/* Elegant Barber Theme (Black + Gold) */
:root{
  --e-black:#0b0b0b;
  --e-black-2:#121212;
  --e-gold:#c8a44a;
  --e-gold-2:#a8842e;
  --e-white:#ffffff;
}

/* Typography */
body{font-family: 'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;}
h1,h2,h3,h4,h5,h6,.heading-section .subheading,.hero-wrap .text .subheading{font-family:'Cinzel', serif; letter-spacing:.5px;}

/* Navbar */
.ftco-navbar-light, .navbar{background: rgba(11,11,11,.92) !important; box-shadow: 0 8px 30px rgba(0,0,0,.35);}
.ftco-navbar-light .navbar-nav > .nav-item > .nav-link{color: rgba(255,255,255,.9) !important;}
.ftco-navbar-light .navbar-nav > .nav-item > .nav-link:hover,
.ftco-navbar-light .navbar-nav > .nav-item.active > a{color: var(--e-gold) !important;}

/* Buttons */
.btn-primary, .btn.btn-primary{
  background: linear-gradient(180deg, var(--e-gold), var(--e-gold-2)) !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  color: #111 !important;
  font-weight: 700;
  letter-spacing: .6px;
  border-radius: 14px;
  box-shadow: 0 14px 35px rgba(0,0,0,.35);
}
.btn-primary:hover, .btn.btn-primary:hover{
  filter: brightness(.95);
  transform: translateY(-1px);
}

/* Links / accents */
a{color: var(--e-gold);}
a:hover{color: #ffd777;}

/* Hero text readability */
.hero-wrap .overlay{
  background: linear-gradient(180deg, rgba(0,0,0,.65), rgba(0,0,0,.65)) !important;
}
.hero-wrap .text h1, .hero-wrap .text .mb-4{color: #fff !important; text-shadow: 0 10px 30px rgba(0,0,0,.65);}
.hero-wrap .text p{color: rgba(255,255,255,.92) !important; text-shadow: 0 8px 24px rgba(0,0,0,.55);}

/* Slider image should not dominate background */
.owl-carousel.home-slider .slider-item{
  background-position: center center !important;
  background-size: cover !important;
}
.owl-carousel.home-slider .slider-item .img{
  opacity: .18;
  filter: blur(.2px) saturate(.9);
}
@media (max-width: 768px){
  .owl-carousel.home-slider .slider-item .img{display:none !important;}
}

/* Appointment / booking section - premium card */
.appointment-wrap{background: transparent !important;}
.appointment-form{
  background: rgba(11,11,11,.78) !important;
  border: 1px solid rgba(200,164,74,.25) !important;
  border-radius: 22px !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.45);
  backdrop-filter: blur(10px);
}
.appointment-form .form-control{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #fff !important;
  border-radius: 14px !important;
}
.appointment-form .form-control::placeholder{color: rgba(255,255,255,.6) !important;}
.appointment-form label, .appointment-form h3{color:#fff !important;}

/* Sections headings */
.heading-section .subheading{color: var(--e-gold) !important;}

/* Footer */
.ftco-footer{background: var(--e-black) !important;}
.ftco-footer a{color: rgba(255,255,255,.85) !important;}
.ftco-footer a:hover{color: var(--e-gold) !important;}

/* =========================================================
   GLOBAL premium background + typography (ALL SCREENS)
   Fix: dark theme applies to mobile AND desktop
   ========================================================= */

/* Page background */
html, body{
  background-color: var(--e-black) !important;
  color: rgba(255,255,255,.88);
}

/* Common wrappers / sections used by template */
.ftco-section,
.bg-light,
.ftco-bg-light,
.ftco-intro,
.ftco-services,
.ftco-about,
.ftco-counter,
.ftco-appointment,
.ftco-pricing,
.ftco-gallery,
.ftco-team,
.ftco-testimony,
.ftco-contact-section,
section{
  background-color: var(--e-black) !important;
}

/* If any container blocks set white backgrounds, neutralize */
.container,
.container-fluid,
.wrap,
.content,
.page,
.site-wrap{
  background-color: transparent !important;
}

/* Text colors */
h1,h2,h3,h4,h5,h6{
  color: #fff !important;
}
p, li, label, small, .text, .form-group, .form-control{
  color: rgba(255,255,255,.88) !important;
}

/* Premium accents */
.heading-section .subheading,
.hero-wrap .text .subheading,
.navbar-brand{
  color: var(--e-gold) !important;
}

/* Cards / boxes that may default to white */
.block-7, .services, .staff, .pricing-entry, .testimony-wrap, .contact-info, .appointment-form{
  background-color: rgba(18,18,18,.75) !important;
  border: 1px solid rgba(200,164,74,.22) !important;
}

/* Inputs */
.form-control{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}
.form-control::placeholder{
  color: rgba(255,255,255,.55) !important;
}

/* Booking section */
.ftco-booking{
  background: var(--e-black) !important;
}
.ftco-booking .one-forth{
  background: transparent !important;
}

/* =========================================================
   Breadcrumbs / hero-wrap-2 (thank-you, contact, etc.)
   ========================================================= */
.hero-wrap-2 .bread,
.hero-wrap-2 .breadcrumbs,
.hero-wrap-2 .breadcrumbs span,
.hero-wrap-2 .breadcrumbs a{
  color: #fff !important;
}

/* =========================================================
   Mobile-specific refinements
   ========================================================= */
@media (max-width: 991px){
  /* Ensure navbar toggler is visible */
  .navbar-toggler .oi-menu{
    color: var(--e-gold) !important;
  }

  /* Gallery project text */
  .project .text span,
  .project .text h3{
    color: #fff !important;
  }

  /* Thank-you / general section text */
  .w3ls_head,
  .ftco-section h4,
  .ftco-section p{
    color: rgba(255,255,255,.88) !important;
  }
}