/*
 * Tabernacle Animal Hospital – Brand Color Theme Override
 * Palette inspired by www.tabernacleanimalhospital.com
 *
 * Primary Navy Blue  : #1a3a5c   (navbar, footer, headings)
 * Accent Teal/Green  : #2e8b7a   (buttons, highlights, icons)
 * Light Teal         : #3aaf9f   (hover states, subheadings)
 * Warm Cream/Off-White: #f7f9f8  (section backgrounds)
 * Dark Text          : #2c2c2c   (body text)
 * Gold Accent        : #c8922a   (secondary highlights, CTAs)
 * White              : #ffffff
 */

/* ── CSS Variables ─────────────────────────────────────────────────── */
:root {
  --tah-navy:   #1a3a5c;
  --tah-teal:   #2e8b7a;
  --tah-teal-light: #3aaf9f;
  --tah-gold:   #c8922a;
  --tah-cream:  #f7f9f8;
  --tah-dark:   #2c2c2c;
  --tah-white:  #ffffff;
  --tah-gray:   #6c7a89;
  --tah-light-bg: #edf4f2;
}

/* ── Body & Base ────────────────────────────────────────────────────── */
body {
  color: var(--tah-dark);
  background-color: var(--tah-white);
}

/* ── Top Bar ────────────────────────────────────────────────────────── */
.wrap {
  background: #245A4A !important;
  color: rgba(255,255,255,0.85) !important;
}
.wrap a {
  color: var(--tah-teal-light) !important;
}
.wrap a:hover {
  color: var(--tah-gold) !important;
  text-decoration: none;
}
.wrap .mailus {
  color: rgba(255,255,255,0.6) !important;
}

/* ── Navbar ─────────────────────────────────────────────────────────── */
.ftco-navbar-light,
.ftco_navbar.bg-dark,
nav.ftco_navbar {
  background: #245A4A !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.25);
}

/* Fix: inner container inherits navy background so white link text is always visible */
.ftco-navbar-light .container {
  background: transparent !important;
}

/* Always-visible navbar: override the scroll-hide (margin-top: -130px) behaviour */
.ftco-navbar-light,
.ftco-navbar-light.scrolled,
.ftco-navbar-light.scrolled.awake,
.ftco-navbar-light.scrolled.sleep {
  position: sticky !important;
  top: 0 !important;
  margin-top: 0 !important;
  z-index: 1030;
}

.ftco-navbar-light .navbar-brand h1,
.navbar-brand h1 {
  color: var(--tah-white) !important;
  font-weight: 700;
}
.ftco-navbar-light .navbar-brand h1 .mini,
.navbar-brand h1 .mini {
  color: var(--tah-teal-light) !important;
  font-weight: 300;
}
.ftco-navbar-light .nav-item .nav-link {
  color: rgba(255,255,255,0.85) !important;
  font-weight: 500;
  letter-spacing: 0.02em;
}
.ftco-navbar-light .nav-item .nav-link:hover,
.ftco-navbar-light .nav-item.active .nav-link {
  color: var(--tah-teal-light) !important;
}
/* Keep hamburger/menu button white at all times */
.ftco-navbar-light .navbar-toggler,
.ftco-navbar-light.scrolled .navbar-toggler {
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.6) !important;
}
.ftco-navbar-light .navbar-toggler-icon,
.ftco-navbar-light.scrolled .navbar-toggler-icon {
  filter: brightness(0) invert(1);
}

/* Keep nav text white when scrolled */
.ftco-navbar-light.scrolled .nav-link,
.ftco-navbar-light.scrolled .nav-item > .nav-link,
.ftco-navbar-light.scrolled .nav-link.active {
  color: #ffffff !important;
}
.ftco-navbar-light.scrolled .nav-item .nav-link:hover,
.ftco-navbar-light.scrolled .nav-item.active .nav-link {
  color: var(--tah-teal-light) !important;
}
.ftco-navbar-light .nav-item.cta .nav-link {
  background: var(--tah-teal) !important;
  color: var(--tah-white) !important;
  border-radius: 4px;
  padding: 8px 20px !important;
}
.ftco-navbar-light .nav-item.cta .nav-link:hover {
  background: var(--tah-gold) !important;
  color: var(--tah-white) !important;
}

/* ── Buttons ────────────────────────────────────────────────────────── */
.btn-primary,
a.btn-primary,
.btn.btn-primary {
  background-color: var(--tah-teal) !important;
  background: var(--tah-teal) !important;
  border: 1px solid var(--tah-teal) !important;
  color: var(--tah-white) !important;
  outline: none !important;
  box-shadow: none !important;
}
.btn-primary:hover,
a.btn-primary:hover,
.btn.btn-primary:hover {
  background-color: var(--tah-teal-light) !important;
  background: var(--tah-teal-light) !important;
  border: 1px solid var(--tah-teal-light) !important;
  color: var(--tah-white) !important;
}
.btn-primary:focus,
.btn-primary:active,
a.btn-primary:focus,
a.btn-primary:active,
.btn.btn-primary:focus,
.btn.btn-primary:active {
  outline: none !important;
  box-shadow: none !important;
  background: var(--tah-teal) !important;
  border: 1px solid var(--tah-teal) !important;
  color: var(--tah-white) !important;
}
.btn-secondary,
a.btn-secondary,
.btn.btn-secondary {
  background-color: var(--tah-navy) !important;
  background: var(--tah-navy) !important;
  border: 1px solid var(--tah-navy) !important;
  color: var(--tah-white) !important;
}
.btn-secondary:hover,
a.btn-secondary:hover,
.btn.btn-secondary:hover {
  background-color: #254d70 !important;
  background: #254d70 !important;
  border: 1px solid #254d70 !important;
  color: var(--tah-white) !important;
}
.btn-secondary:focus,
.btn-secondary:active,
a.btn-secondary:focus,
a.btn-secondary:active,
.btn.btn-secondary:focus,
.btn.btn-secondary:active {
  background: var(--tah-navy) !important;
  border: 1px solid var(--tah-navy) !important;
  color: var(--tah-white) !important;
  outline: none !important;
  box-shadow: none !important;
}

/* ── Intro Service Blocks (prevent overlap with hero buttons) ───────── */
@media (min-width: 768px) {
  .intro .services {
    margin-top: 0 !important;
  }
}
.ftco-section.intro {
  padding-top: 3rem !important;
}

/* ── Hero Section ───────────────────────────────────────────────────── */
.hero-wrap,
.hero-wrap .slider-text {
  height: auto !important;
  min-height: 600px;
}
.hero-wrap .slider-text {
  padding-top: 82px !important;
  padding-bottom: 44px !important;
  align-items: flex-start !important;
}
.hero-wrap .overlay {
  background: rgba(0,0,0,0.6) !important;
}

/* ── Section Backgrounds ────────────────────────────────────────────── */
section.bg-light,
.ftco-section.bg-light {
  background: var(--tah-cream) !important;
}
.ftco-section {
  background: var(--tah-white);
}

/* ── Subheadings / Labels ───────────────────────────────────────────── */
.subheading {
  color: var(--tah-teal) !important;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* ── Headings ───────────────────────────────────────────────────────── */
h2, h3, h4 {
  color: var(--tah-navy) !important;
  font-weight: 700 !important;
}
/* Hero sections — all text must be white regardless of heading rules */
.hero-wrap .slider-text h1,
.hero-wrap .slider-text h2,
.hero-wrap .slider-text h3,
.hero-wrap .slider-text h4,
.hero-wrap .slider-text p,
.hero-wrap .slider-text span,
.hero-wrap .slider-text .subheading {
  color: #ffffff !important;
}
.hero-wrap .slider-text h1 {
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.75);
}
.hero-wrap .slider-text p {
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.7;
}
.heading-section h2 {
  color: var(--tah-navy) !important;
}
.heading-section-white h2,
.heading-section-white .subheading {
  color: var(--tah-white) !important;
}

/* ── Intro Service Cards ────────────────────────────────────────────── */
section.intro .services {
  background: var(--tah-white);
  border-left: 4px solid var(--tah-teal);
  border-radius: 6px;
  padding: 20px;
  box-shadow: 0 2px 12px rgba(26,58,92,0.08);
}
section.intro .services .icon {
  background: var(--tah-teal) !important;
  color: var(--tah-white) !important;
  border-radius: 50%;
  min-width: 54px;
  height: 54px;
}
section.intro .services .icon span {
  color: var(--tah-white) !important;
}
section.intro .services .heading {
  color: var(--tah-navy) !important;
}
section.intro .services p {
  color: var(--tah-gray) !important;
}

/* ── About / Counter Section ────────────────────────────────────────── */
.ftco-counter .heading-section .subheading {
  color: var(--tah-teal) !important;
}
.list-services .icon {
  background: var(--tah-teal) !important;
}
.list-services .icon span {
  color: var(--tah-white) !important;
}
.list-services p {
  color: var(--tah-navy) !important;
  font-weight: 500;
}

/* ── Appointment Section ────────────────────────────────────────────── */
.ftco-services-2 {
  background: var(--tah-light-bg) !important;
}
.appointment-heading {
  color: var(--tah-navy) !important;
}
.appointment-form .form-control:focus {
  border-color: var(--tah-teal) !important;
  box-shadow: 0 0 0 0.2rem rgba(46,139,122,0.25) !important;
}
.appointment-form input[type="submit"],
.appointment-form .btn {
  background: var(--tah-teal) !important;
  border-color: var(--tah-teal) !important;
  color: var(--tah-white) !important;
}
.appointment-form input[type="submit"]:hover {
  background: var(--tah-navy) !important;
  border-color: var(--tah-navy) !important;
}

/* ── Staff / Team Cards ─────────────────────────────────────────────── */
.staff .text {
  background: var(--tah-white) !important;
  border-top: 3px solid var(--tah-teal);
}
.staff .text h3 {
  color: var(--tah-navy) !important;
}
.staff .text .position {
  color: var(--tah-teal) !important;
  font-weight: 600;
}
.staff .faded {
  background: var(--tah-navy) !important;
}
.ftco-social li a {
  background: var(--tah-teal) !important;
  color: var(--tah-white) !important;
}
.ftco-social li a:hover {
  background: var(--tah-gold) !important;
}

/* ── Testimonials Section ───────────────────────────────────────────── */
.testimony-section .overlay {
  background: linear-gradient(135deg, rgba(26,58,92,0.88) 0%, rgba(46,139,122,0.70) 100%) !important;
}
.testimony-wrap .quote {
  background: var(--tah-teal) !important;
  color: var(--tah-white) !important;
}
.testimony-wrap .name {
  color: var(--tah-navy) !important;
  font-weight: 700;
}
.testimony-wrap .position {
  color: var(--tah-teal) !important;
}
.testimony-wrap p {
  color: var(--tah-navy) !important;
}

/* ── Pricing Cards ──────────────────────────────────────────────────── */
.block-7 {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 18px rgba(26,58,92,0.1);
}
.block-7 .excerpt {
  color: var(--tah-teal) !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.block-7 .price {
  color: var(--tah-navy) !important;
}
.block-7 .pricing-text li {
  color: var(--tah-dark) !important;
  border-bottom: 1px solid var(--tah-light-bg);
  padding: 6px 0;
}
.block-7 .pricing-text .fa-check {
  color: var(--tah-teal) !important;
}
.block-7 .btn-primary {
  background: var(--tah-navy) !important;
  border-color: var(--tah-navy) !important;
}
.block-7 .btn-primary:hover {
  background: var(--tah-teal) !important;
  border-color: var(--tah-teal) !important;
}

/* ── Blog Entries ───────────────────────────────────────────────────── */
.blog-entry .heading a {
  color: var(--tah-navy) !important;
}
.blog-entry .heading a:hover {
  color: var(--tah-teal) !important;
}
.blog-entry .meta a {
  color: var(--tah-teal) !important;
}

/* ── Footer ─────────────────────────────────────────────────────────── */
/* ── Footer ─────────────────────────────────────────────────────────── */
.ftco-footer {
  background: var(--tah-navy) !important;
  color: rgba(255,255,255,0.75);
  font-size: 0.92rem;
}
.ftco-footer h2,
.ftco-footer .ftco-heading-2 {
  color: var(--tah-white) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border-bottom: 2px solid var(--tah-teal);
  padding-bottom: 8px;
  display: inline-block;
}
.ftco-footer p {
  color: rgba(255,255,255,0.7) !important;
  line-height: 1.7;
}

/* Hours list */
.footer-hours {
  margin: 0;
}
.footer-hours li {
  display: flex;
  justify-content: space-between;
  padding: 4px 0;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  color: rgba(255,255,255,0.75);
}
.footer-hours li:last-child { border-bottom: none; }
.footer-day { font-weight: 600; color: rgba(255,255,255,0.9); }
.footer-day::after { content: ":"; margin-right: 6px; color: rgba(255,255,255,0.5); }
.footer-time { color: rgba(255,255,255,0.65); }
.footer-closed .footer-time { color: var(--tah-teal-light); font-weight: 600; }

/* Services / quick links list */
.footer-links {
  margin: 0;
}
.footer-links li {
  padding: 3px 0;
}
.footer-links li a {
  color: rgba(255,255,255,0.7) !important;
  text-decoration: none;
  transition: color 0.2s, padding-left 0.2s;
}
.footer-links li a::before {
  content: "›  ";
  color: var(--tah-teal-light);
  font-weight: 700;
}
.footer-links li a:hover {
  color: var(--tah-teal-light) !important;
  padding-left: 4px;
}

/* Contact list */
.footer-contact {
  margin: 0;
}
.footer-contact li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 5px 0;
  color: rgba(255,255,255,0.75);
}
.footer-contact li a {
  color: rgba(255,255,255,0.75) !important;
  text-decoration: none;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
}
.footer-contact li a:hover { color: var(--tah-teal-light) !important; }
.footer-icon {
  color: var(--tah-teal-light) !important;
  font-size: 0.9rem;
  margin-top: 3px;
  flex-shrink: 0;
  width: 16px;
  text-align: center;
}

/* Social icons */
.ftco-footer-social li a {
  background: rgba(255,255,255,0.12) !important;
  color: var(--tah-white) !important;
  border-radius: 50%;
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}
.ftco-footer-social li a:hover {
  background: var(--tah-teal) !important;
}

/* Footer bottom bar */
.footer-bottom {
  background: rgba(0,0,0,0.25);
  border-top: 1px solid rgba(255,255,255,0.1);
  padding: 18px 0;
}
.footer-bottom p {
  color: rgba(255,255,255,0.6) !important;
  font-size: 0.82rem;
  margin: 0;
}
.footer-bottom a {
  color: rgba(255,255,255,0.7) !important;
  text-decoration: none;
  font-size: 0.82rem;
}
.footer-bottom a:hover {
  color: var(--tah-teal-light) !important;
}

/* ── Legacy Footer Bottom Bar ───────────────────────────────────────── */
.bg-primary {
  background: #245A4A !important;
}
.bg-primary p,
.bg-primary a {
  color: rgba(255,255,255,0.9) !important;
}
.bg-primary a:hover {
  color: var(--tah-gold) !important;
}

/* ── Contact Page ───────────────────────────────────────────────────── */
.contact-info .box {
  background: var(--tah-cream) !important;
  border-top: 4px solid var(--tah-teal);
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(26,58,92,0.08);
  overflow-wrap: break-word;
  word-break: break-word;
  padding-top: 24px !important;
}
/* Override absolute positioning so icon doesn't overlap text */
.contact-section .box .icon,
.contact-info .icon {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  margin: 0 auto 14px auto !important;
  background: var(--tah-teal) !important;
  color: var(--tah-white) !important;
  width: 60px !important;
  height: 60px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.contact-section .box .icon span {
  font-size: 26px !important;
  color: var(--tah-white) !important;
}
.contact-info .text {
  color: var(--tah-navy) !important;
}
.contact-info h3 {
  color: var(--tah-navy) !important;
}

/* ── Page Header / Breadcrumb ───────────────────────────────────────── */
.ftco-page-cover,
.hero-wrap.hero-wrap-2 .overlay {
  background: linear-gradient(135deg, rgba(26,58,92,0.85) 0%, rgba(46,139,122,0.6) 100%) !important;
}
.hero-wrap.hero-wrap-2 h1,
.hero-wrap.hero-wrap-2 p,
.hero-wrap.hero-wrap-2 .slider-text h1,
.hero-wrap.hero-wrap-2 .slider-text p,
.hero-wrap.hero-wrap-2 .subheading {
  color: var(--tah-white) !important;
}
.ftco-section .bread {
  color: rgba(255,255,255,0.75) !important;
}
.ftco-section .bread a {
  color: var(--tah-teal-light) !important;
}

/* ── Loader ─────────────────────────────────────────────────────────── */
#ftco-loader .path {
  stroke: var(--tah-teal) !important;
}

/* ── Flaticon icon color overrides ─────────────────────────────────── */
.flaticon-stethoscope:before,
.flaticon-pet:before,
.flaticon-cat:before,
.flaticon-house:before,
.flaticon-dog:before,
.flaticon-veterinary:before,
.flaticon-dog-training:before {
  color: inherit;
}

/* ── Services page card grid ────────────────────────────────────────── */
.ftco-services .media {
  border-top: 3px solid var(--tah-teal);
  box-shadow: 0 2px 12px rgba(26,58,92,0.08);
}
.ftco-services .media .icon {
  background: var(--tah-teal) !important;
  color: var(--tah-white) !important;
}
.ftco-services .media h3 a {
  color: var(--tah-navy) !important;
}
.ftco-services .media h3 a:hover {
  color: var(--tah-teal) !important;
}

/* ── Hours box (contact page) ───────────────────────────────────────── */
.contact-info .box em {
  color: var(--tah-teal) !important;
  font-style: italic;
}
.contact-info .fa-clock-o {
  color: var(--tah-navy) !important;
}

/* ══════════════════════════════════════════════════════════════════
   TAH LOGO SIZING & PLACEMENT
   Logo is square (logo.jpg) — always height-constrained, width:auto
   so the image NEVER stretches or distorts.
   ══════════════════════════════════════════════════════════════════ */

/* Navbar logo */
.tah-brand {
  padding: 2px 0;
}
.tah-logo-nav {
  height: 105px;       /* constrains height only */
  width: auto;        /* browser calculates width to preserve aspect ratio */
  display: block;
  object-fit: contain;
}

/* Remove old text/icon brand elements */
.tah-brand h1,
.tah-brand .flaticon {
  display: none !important;
}

/* Hero section logo — floats right so text wraps naturally around it */
.tah-hero-logo {
  float: right;
  margin: 0 0 16px 24px;
  clear: right;
}
.tah-logo-hero {
  height: 200px;      /* constrains height only */
  width: auto;        /* preserves square aspect ratio */
  display: block;
  object-fit: contain;
  border-radius: 14px;
  box-shadow: 0 6px 28px rgba(0,0,0,0.4);
}

/* Footer logo */
.tah-logo-footer {
  height: 110px;      /* constrains height only */
  width: auto;        /* preserves square aspect ratio */
  display: block;
  object-fit: contain;
  border-radius: 10px;
  margin-bottom: 14px;
}

/* Responsive adjustments */
@media (max-width: 991px) {
  .tah-hero-logo {
    float: none;
    margin: 0 0 20px 0;
  }
  .tah-logo-hero {
    height: 140px;
  }
}
@media (max-width: 768px) {
  .tah-logo-nav {
    height: 48px;
  }
  .tah-logo-hero {
    height: 110px;
  }
  .tah-logo-footer {
    height: 85px;
  }
}

/* ── Navbar CTA Buttons (Book Appointment & Online Pharmacy) ─────────── */
.btn-nav-cta {
  border-radius: 4px;
  font-weight: 700;
  font-size: 0.85rem;
  padding: 7px 14px;
  white-space: nowrap;
  letter-spacing: 0.02em;
  display: inline-block;
  text-decoration: none !important;
  transition: background 0.2s, border-color 0.2s, opacity 0.2s;
}
.btn-book-appt,
.btn-book-appt.btn-nav-cta {
  background: var(--tah-teal) !important;
  color: var(--tah-white) !important;
  border: 2px solid var(--tah-teal) !important;
}
.btn-book-appt:hover,
.btn-book-appt:focus {
  opacity: 0.88;
  color: var(--tah-white) !important;
  text-decoration: none;
}
.btn-pharmacy-cta {
  background: transparent !important;
  color: var(--tah-white) !important;
  border: 2px solid rgba(255,255,255,0.6) !important;
}
.btn-pharmacy-cta:hover,
.btn-pharmacy-cta:focus {
  background: rgba(255,255,255,0.12) !important;
  border-color: #fff !important;
  color: var(--tah-white) !important;
  text-decoration: none;
}
@media (max-width: 991px) {
  .btn-nav-cta {
    font-size: 0.8rem;
    padding: 6px 10px;
    margin: 4px 0;
  }
}

/* ── Hover Dropdowns (desktop only) ────────────────────────────────── */
@media (min-width: 992px) {
  .ftco-navbar-light .nav-item.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0;
  }
  /* Prevent gap between link and dropdown from closing the menu */
  .ftco-navbar-light .nav-item.dropdown .dropdown-menu {
    margin-top: 0 !important;
  }
}

/* ── About Dropdown ─────────────────────────────────────────────────── */
.ftco-navbar-light .nav-item.dropdown .dropdown-menu {
  background-color: #1e3a2f;
  border: none;
  border-top: 3px solid var(--tah-teal);
  border-radius: 0 0 6px 6px;
  padding: 8px 0;
  min-width: 200px;
}
.ftco-navbar-light .nav-item.dropdown .dropdown-menu .dropdown-item {
  color: rgba(255,255,255,0.85);
  font-weight: 500;
  font-size: 0.9rem;
  padding: 8px 20px;
  letter-spacing: 0.02em;
}
.ftco-navbar-light .nav-item.dropdown .dropdown-menu .dropdown-item:hover,
.ftco-navbar-light .nav-item.dropdown .dropdown-menu .dropdown-item:focus {
  background-color: var(--tah-teal);
  color: #fff;
}
.ftco-navbar-light .nav-item.dropdown > .nav-link::after {
  display: inline-block;
  margin-left: 5px;
  vertical-align: middle;
  content: "";
  border-top: 0.3em solid;
  border-right: 0.3em solid transparent;
  border-bottom: 0;
  border-left: 0.3em solid transparent;
}