/* =========================================================
   Zubair Vaidyar — V31.2 Public Dark / Light Theme
   Shared across Malayalam / Tamil / English public pages.
   Default remains the existing Light design.
   ========================================================= */

html{
  color-scheme:light;
}

.site-theme-toggle{
  width:42px;
  height:42px;
  min-width:42px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.55);
  border-radius:999px;
  background:rgba(255,255,255,.10);
  color:#fff;
  font:800 1.05rem/1 system-ui,-apple-system,"Segoe UI",sans-serif;
  cursor:pointer;
  flex:0 0 auto;
  transition:background .2s ease,transform .2s ease,border-color .2s ease;
}

.site-theme-toggle:hover{
  background:rgba(255,255,255,.20);
  transform:translateY(-1px);
}

.site-theme-toggle:focus-visible{
  outline:3px solid rgba(255,255,255,.45);
  outline-offset:3px;
}

.site-theme-toggle-floating{
  position:fixed;
  right:18px;
  top:18px;
  z-index:1500;
  background:#2f6b4f;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
}

/* ================= DARK THEME ================= */

html[data-site-theme="dark"]{
  color-scheme:dark;

  --bg:#0d1511;
  --surface:#16211b;
  --surface-soft:#1d2d24;
  --ink:#edf4ef;
  --muted:#a8b7ae;
  --brand:#4b956c;
  --brand-dark:#173c2b;
  --brand-hover:#5aa77a;
  --gold:#c3a866;
  --line:#34483d;
  --shadow:0 18px 50px rgba(0,0,0,.30);
}

html[data-site-theme="dark"] body{
  background:var(--bg);
  color:var(--ink);
}

html[data-site-theme="dark"] .site-header{
  background:#173f2e;
  border-bottom-color:rgba(255,255,255,.11);
  box-shadow:0 7px 22px rgba(0,0,0,.30);
}

html[data-site-theme="dark"] .logo{
  background:#eef5f0;
  color:#245d43;
}

html[data-site-theme="dark"] .brand-copy small{
  color:rgba(255,255,255,.74);
}

html[data-site-theme="dark"] .desktop-language-select{
  background:rgba(255,255,255,.08);
  color:#fff;
  border-color:rgba(255,255,255,.48);
}

html[data-site-theme="dark"] .desktop-language-select option{
  background:#16211b;
  color:#edf4ef;
}

html[data-site-theme="dark"] .menu{
  color:var(--ink);
}

@media(max-width:1280px){
  html[data-site-theme="dark"] .menu{
    background:#16211b !important;
    border-color:#34483d !important;
    box-shadow:0 18px 45px rgba(0,0,0,.38) !important;
  }

  html[data-site-theme="dark"] .menu a{
    color:#edf4ef !important;
  }

  html[data-site-theme="dark"] .menu a:hover,
  html[data-site-theme="dark"] .menu a.active{
    color:#8fd1aa !important;
    background:#20352a !important;
  }

  html[data-site-theme="dark"] .menu .menu-language{
    border-color:#34483d !important;
  }

  html[data-site-theme="dark"] .menu .menu-language label{
    color:#a8b7ae !important;
  }

  html[data-site-theme="dark"] .menu .menu-language select{
    background:#101914 !important;
    color:#edf4ef !important;
    border-color:#405449 !important;
  }
}

html[data-site-theme="dark"] .alt{
  background:#111c17;
}

html[data-site-theme="dark"] .hero-card,
html[data-site-theme="dark"] .card,
html[data-site-theme="dark"] .panel,
html[data-site-theme="dark"] .feature{
  background:#16211b;
  border-color:#34483d;
  box-shadow:0 18px 50px rgba(0,0,0,.26);
}

html[data-site-theme="dark"] .card:hover,
html[data-site-theme="dark"] .feature:hover{
  border-color:#4c705c;
  box-shadow:0 24px 55px rgba(0,0,0,.36);
}

html[data-site-theme="dark"] .icon{
  background:#20382b;
  color:#98d8b4;
}

html[data-site-theme="dark"] p,
html[data-site-theme="dark"] .sv-privacy-note,
html[data-site-theme="dark"] .sv-managed-gallery-section .section-head p,
html[data-site-theme="dark"] .sv-page-video-section .section-head p,
html[data-site-theme="dark"] .sv-video-message,
html[data-site-theme="dark"] .sv-page-video-message{
  color:var(--muted);
}

html[data-site-theme="dark"] .kicker{
  color:#83c7a1;
}

html[data-site-theme="dark"] .btn-primary,
html[data-site-theme="dark"] .sv-load-more,
html[data-site-theme="dark"] .sv-page-load-more{
  background:#397e59;
  color:#fff;
  box-shadow:0 10px 25px rgba(0,0,0,.26);
}

html[data-site-theme="dark"] .btn-primary:hover,
html[data-site-theme="dark"] .sv-load-more:hover,
html[data-site-theme="dark"] .sv-page-load-more:hover{
  background:#4a9169;
}

html[data-site-theme="dark"] .btn-secondary{
  background:#17231c;
  border-color:#5aa77a;
  color:#9cd8b7;
}

html[data-site-theme="dark"] .btn-secondary:hover{
  background:#20352a;
}

html[data-site-theme="dark"] .mini-item{
  border-color:#34483d;
}

html[data-site-theme="dark"] .notice{
  background:#332b18;
  border-color:#62542f;
  color:#ead7a3;
}

html[data-site-theme="dark"] input,
html[data-site-theme="dark"] select,
html[data-site-theme="dark"] textarea,
html[data-site-theme="dark"] .sv-form-card input,
html[data-site-theme="dark"] .sv-form-card select,
html[data-site-theme="dark"] .sv-form-card textarea{
  background:#101914;
  color:#edf4ef;
  border-color:#405449;
}

html[data-site-theme="dark"] input::placeholder,
html[data-site-theme="dark"] textarea::placeholder{
  color:#7e8e84;
  opacity:1;
}

html[data-site-theme="dark"] input:focus,
html[data-site-theme="dark"] select:focus,
html[data-site-theme="dark"] textarea:focus,
html[data-site-theme="dark"] .sv-form-card input:focus,
html[data-site-theme="dark"] .sv-form-card select:focus,
html[data-site-theme="dark"] .sv-form-card textarea:focus{
  border-color:#5aa77a;
  box-shadow:0 0 0 3px rgba(90,167,122,.16);
}

html[data-site-theme="dark"] .success,
html[data-site-theme="dark"] .sv-form-status.success{
  background:#173124;
  color:#9fd9b6;
  border-color:#315b42;
}

html[data-site-theme="dark"] .sv-form-status.error{
  background:#351d1d;
  color:#ffabab;
  border-color:#6b3636;
}

html[data-site-theme="dark"] .sv-video-message{
  background:#16211b;
  border-color:#34483d;
}

html[data-site-theme="dark"] .sv-page-video-section.alt{
  background:#111c17;
}

html[data-site-theme="dark"] .media-slot{
  background:
    linear-gradient(135deg,rgba(38,93,65,.96),rgba(69,91,62,.90)),
    radial-gradient(circle at top right,#253d31,#13231b);
}

html[data-site-theme="dark"] .media-slot.video{
  background:linear-gradient(135deg,#10261c,#285f43);
}

html[data-site-theme="dark"] .cta{
  background:linear-gradient(135deg,#102c20,#2f6b4f);
  box-shadow:0 18px 46px rgba(0,0,0,.24);
}

html[data-site-theme="dark"] .cta p{
  color:rgba(255,255,255,.78);
}

html[data-site-theme="dark"] .cta .btn-secondary{
  background:#f2f6f3;
  color:#285c44;
  border-color:#f2f6f3;
}

html[data-site-theme="dark"] footer{
  background:#091a13;
  border-top:1px solid #20382b;
}

html[data-site-theme="dark"] footer p,
html[data-site-theme="dark"] footer a{
  color:rgba(238,246,241,.72);
}

html[data-site-theme="dark"] .footer-bottom{
  border-color:rgba(255,255,255,.10);
  color:rgba(238,246,241,.60);
}

/* Public contact / appointment module */
html[data-site-theme="dark"] .sv-form-card{
  background:#16211b !important;
  border-color:#34483d !important;
}

html[data-site-theme="dark"] .sv-setting-card,
html[data-site-theme="dark"] .sv-contact-details .panel{
  background:#16211b !important;
  border-color:#34483d !important;
}

html[data-site-theme="dark"] .sv-form-status{
  border-color:#34483d;
}

/* Native controls inherit dark palette */
html[data-site-theme="dark"] select option{
  background:#101914;
  color:#edf4ef;
}

/* Keep embedded YouTube player naturally black */
html[data-site-theme="dark"] .sv-video-card{
  background:#000;
  box-shadow:0 12px 32px rgba(0,0,0,.34);
}

/* Smooth visual switch without affecting reduced-motion users */
@media(prefers-reduced-motion:no-preference){
  body,
  .site-header,
  .hero-card,
  .card,
  .panel,
  .feature,
  .alt,
  footer,
  input,
  select,
  textarea,
  .btn-secondary{
    transition:
      background-color .22s ease,
      color .22s ease,
      border-color .22s ease,
      box-shadow .22s ease;
  }
}

@media(max-width:620px){
  .site-theme-toggle{
    width:39px;
    height:39px;
    min-width:39px;
    font-size:1rem;
  }

  .site-header .nav-toggle{
    margin-left:auto !important;
  }
}

/* =========================================================
   V39.4.7.1 — Production UI Stabilization
   Theme-safe buttons, centered actions, course contrast,
   and appointment process-card layout hardening.
   ========================================================= */

/* Theme-safe button palette. Custom inline CMS colors still win when explicitly enabled. */
html[data-site-theme="light"] .btn-primary,
html[data-site-theme="light"] button.btn-primary{
  background:#2f6b4f;
  color:#fff;
  border-color:#2f6b4f;
}
html[data-site-theme="light"] .btn-primary:hover,
html[data-site-theme="light"] button.btn-primary:hover{
  background:#285c44;
  color:#fff;
  border-color:#285c44;
}
html[data-site-theme="light"] .btn-secondary,
html[data-site-theme="light"] button.btn-secondary{
  background:transparent;
  color:#245d43;
  border-color:#2f6b4f;
}
html[data-site-theme="light"] .btn-secondary:hover,
html[data-site-theme="light"] button.btn-secondary:hover{
  background:#edf5ef;
  color:#173f2e;
  border-color:#285c44;
}
html[data-site-theme="dark"] .btn-primary,
html[data-site-theme="dark"] button.btn-primary{
  background:#3f8d62;
  color:#fff;
  border-color:#3f8d62;
}
html[data-site-theme="dark"] .btn-primary:hover,
html[data-site-theme="dark"] button.btn-primary:hover{
  background:#4d9e70;
  color:#fff;
  border-color:#4d9e70;
}
html[data-site-theme="dark"] .btn-secondary,
html[data-site-theme="dark"] button.btn-secondary{
  background:transparent;
  color:#dff4e6;
  border-color:#5aa77a;
}
html[data-site-theme="dark"] .btn-secondary:hover,
html[data-site-theme="dark"] button.btn-secondary:hover{
  background:#20352a;
  color:#fff;
  border-color:#72bb91;
}

/* Keep CTA white-button treatment accessible in both themes. */
.cta .btn-secondary,
html[data-site-theme="dark"] .cta .btn-secondary,
html[data-site-theme="light"] .cta .btn-secondary{
  background:#fff;
  color:#245d43;
  border-color:#fff;
}
.cta .btn-secondary:hover,
html[data-site-theme="dark"] .cta .btn-secondary:hover,
html[data-site-theme="light"] .cta .btn-secondary:hover{
  background:#f1f7f3;
  color:#173f2e;
  border-color:#f1f7f3;
}

/* Buttons are centered consistently on desktop, tablet and mobile. */
.btn{
  align-items:center;
  justify-content:center;
  text-align:center;
}
.actions,
.hero .actions,
.cta .actions,
.course-actions,
.sv-page-video-actions,
.sv-managed-gallery-actions{
  justify-content:center;
  align-items:center;
}
.course-actions{
  width:100%;
}
.course-actions .btn{
  min-width:170px;
}
.cta > .btn,
.panel > .btn,
.feature > .btn,
form > .btn,
.sv-form-card form > .btn{
  display:flex;
  width:max-content;
  max-width:100%;
  margin-left:auto;
  margin-right:auto;
}

/* Course text/fact contrast follows the active theme instead of stale CMS colors. */
.course-card-v39 h1,
.course-card-v39 h2,
.course-card-v39 h3,
.course-card-v39 strong,
.course-facts strong,
.course-detail-grid h1,
.course-detail-grid h2,
.course-detail-grid h3,
.syllabus-grid-v39 strong{
  color:var(--ink);
}
.course-card-v39 > p,
.course-card-v39 p,
.course-facts small,
.course-list-v39,
.course-detail-grid p,
.syllabus-grid-v39 p{
  color:var(--muted);
}
html[data-site-theme="dark"] .course-card-v39{
  background:var(--surface);
  border-color:var(--line);
}
html[data-site-theme="light"] .course-card-v39{
  background:var(--surface);
  border-color:var(--line);
}

/* Appointment process cards: wider, equal-height horizontal row on desktop. */
.sv-process-grid{
  align-items:stretch;
}
.sv-process-grid .panel{
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
}
.sv-process-grid .panel h3{
  color:var(--ink);
  font-size:1rem;
  line-height:1.42;
}
.sv-process-grid .panel p{
  color:var(--muted);
  font-size:.96rem;
  line-height:1.7;
  margin-bottom:0;
}
@media (min-width:1181px){
  .sv-contact-layout{
    grid-template-columns:minmax(460px,.88fr) minmax(620px,1.12fr);
    gap:28px;
  }
  .sv-process-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
  }
  .sv-process-grid .panel{
    padding:20px 18px;
  }
}
@media (min-width:821px) and (max-width:1180px){
  .sv-contact-layout{
    grid-template-columns:1fr;
  }
  .sv-process-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
  }
}
@media (max-width:820px){
  .sv-process-grid{
    grid-template-columns:1fr;
  }
  .sv-process-grid .panel{
    text-align:center;
  }
}
@media (max-width:650px){
  .actions .btn,
  .hero .actions .btn,
  .cta .btn,
  .course-actions .btn,
  form > .btn,
  .sv-form-card form > .btn{
    width:min(100%,520px);
    margin-left:auto;
    margin-right:auto;
  }
}

/* =========================================================
   V39.4.7.2 — Secondary button contrast + appointment cleanup
   ========================================================= */
/* Secondary/outline buttons must never lose their label on light surfaces. */
html[data-site-theme="light"] .btn-secondary,
html[data-site-theme="light"] button.btn-secondary{
  color:#245d43 !important;
}
html[data-site-theme="light"] .btn-secondary:hover,
html[data-site-theme="light"] button.btn-secondary:hover{
  color:#173f2e !important;
}
/* On dark surfaces use a brighter green; white CTA surfaces keep dark green. */
html[data-site-theme="dark"] .btn-secondary,
html[data-site-theme="dark"] button.btn-secondary{
  color:#72bb91 !important;
}
.cta .btn-secondary,
html[data-site-theme="dark"] .cta .btn-secondary,
html[data-site-theme="light"] .cta .btn-secondary{
  color:#245d43 !important;
}

/* Appointment process cards were intentionally removed. Keep the form centered. */
.sv-contact-layout.sv-appointment-single{
  grid-template-columns:minmax(0,860px) !important;
  justify-content:center;
  align-items:start;
}
.sv-contact-layout.sv-appointment-single .sv-form-card{
  width:100%;
  max-width:860px;
  margin-inline:auto;
}
@media(max-width:900px){
  .sv-contact-layout.sv-appointment-single{
    grid-template-columns:minmax(0,1fr) !important;
  }
}

/* =========================================================
   V39.4.7.3 — Light-mode outline button label visibility
   Only light-theme secondary/outline button text is forced green.
   Dark theme and primary buttons remain unchanged.
   ========================================================= */
html[data-site-theme="light"] a.btn-secondary,
html[data-site-theme="light"] button.btn-secondary,
html[data-site-theme="light"] .course-actions a.btn-secondary,
html[data-site-theme="light"] .course-actions button.btn-secondary,
html[data-site-theme="light"] .actions a.btn-secondary,
html[data-site-theme="light"] .actions button.btn-secondary{
  color:#2f6b4f !important;
  -webkit-text-fill-color:#2f6b4f !important;
  opacity:1 !important;
  text-shadow:none !important;
}
html[data-site-theme="light"] a.btn-secondary:hover,
html[data-site-theme="light"] button.btn-secondary:hover,
html[data-site-theme="light"] .course-actions a.btn-secondary:hover,
html[data-site-theme="light"] .course-actions button.btn-secondary:hover,
html[data-site-theme="light"] .actions a.btn-secondary:hover,
html[data-site-theme="light"] .actions button.btn-secondary:hover{
  color:#245d43 !important;
  -webkit-text-fill-color:#245d43 !important;
}

/* =========================================================
   V39.4.7.6 — Fixed Header Reliability Repair
   Restores valid theme assets and pins the public header to
   the viewport. A JS-measured spacer prevents content overlap.
   ========================================================= */
.site-header,
body > .site-header,
.site-header.sv-fixed-header-v3976 {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: auto !important;
  left: 0 !important;
  width: 100% !important;
  max-width: none !important;
  z-index: 10000 !important;
  transform: none !important;
  -webkit-transform: none !important;
}

.sv-fixed-header-spacer-v3976 {
  display: block !important;
  width: 100% !important;
  height: var(--sv-public-header-height, 118px);
  min-height: var(--sv-public-header-height, 118px);
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

html {
  scroll-padding-top: calc(var(--sv-public-header-height, 118px) + 16px);
}

.site-header .menu,
.site-header .desktop-language-select-wrap,
.site-header .nav-toggle,
.site-header .menu-language,
.site-header .lang-dropdown,
.site-header .site-theme-toggle {
  position: relative;
  z-index: 10001;
}

@media (max-width: 620px) {
  .sv-fixed-header-spacer-v3976 {
    height: var(--sv-public-header-height, 103px);
    min-height: var(--sv-public-header-height, 103px);
  }
}

/* =========================================================
   V39.4.7.7 — Mobile Menu Overlay / Header Height Safety
   Keep the hamburger menu out of the fixed header's layout flow.
   ========================================================= */
@media (max-width:1280px){
  .site-header .container.nav{
    position:relative !important;
  }

  .site-header .menu{
    position:fixed !important;
    top:calc(var(--sv-public-header-height, 98px) + 8px) !important;
    right:12px !important;
    left:auto !important;
    bottom:auto !important;
    width:min(360px, calc(100vw - 24px)) !important;
    max-width:calc(100vw - 24px) !important;
    max-height:calc(100dvh - var(--sv-public-header-height, 98px) - 20px) !important;
    margin:0 !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    z-index:10030 !important;
    transform:none !important;
    -webkit-transform:none !important;
  }

  .site-header .menu.open{
    display:flex !important;
  }

  html.sv-mobile-menu-open,
  html.sv-mobile-menu-open body{
    overflow:hidden !important;
  }
}

@media (max-width:620px){
  .site-header .menu{
    top:calc(var(--sv-public-header-height, 85px) + 8px) !important;
    right:10px !important;
    width:min(340px, calc(100vw - 20px)) !important;
    max-width:calc(100vw - 20px) !important;
    max-height:calc(100dvh - var(--sv-public-header-height, 85px) - 18px) !important;
  }
}
/* V39.4.7.7 END */