/* ======================================================================
   Astro Chinnaraj - EMERALD & GOLD theme (same palette as Vedic Health Master)
   Loaded AFTER app.css, so it only has to redefine the colour variables.
   ====================================================================== */
:root,
html[data-theme="light"]{
	--bg:#FAF8F0;            /* cream page */
	--card:#FFFFFF;
	--ink:#1B2923;
	--ink2:#2C3C34;
	--mut:#55655C;
	--line:#E7E3D1;
	--tint:#F1F6EC;
	--chip:#FFFFFF;
	--ind:#0E6B50;           /* emerald (primary) */
	--ind2:#0D4032;          /* deep emerald */
	--ind3:#3FA384;          /* emerald edge on dark */
	--gold:#E8AC32;
	--gtxt:#0E6B50;          /* emerald text accents */
	--soft:#DDEFE6;          /* soft mint text on emerald */
	--ongold:#2A1D00;        /* text on gold */
	--kum:#C93F22;
	--ok:#2F8A52;--okbg:#E3F2E8;
	--bad:#C93F22;--badbg:#FBE2D9;
	--warn:#8A5A00;--warnbg:#FCEED0;
	--shadow:0 6px 18px rgba(8,46,36,.10);
}
html[data-theme="dark"]{
	--bg:#07211A;
	--card:#0D3427;
	--ink:#EEF4EE;
	--ink2:#DCE8DF;
	--mut:#A9C0B3;
	--line:#1D4A3B;
	--tint:#12402F;
	--chip:#0D3427;
	--ind:#15805F;
	--ind2:#0D4032;
	--ind3:#3FA384;
	--gold:#E8AC32;
	--gtxt:#9BE0BD;
	--soft:#DDEFE6;
	--ongold:#2A1D00;
	--kum:#E0654A;
	--ok:#7BD9A4;--okbg:#12382A;
	--bad:#FFB4AB;--badbg:#4A1F1B;
	--warn:#FFD28A;--warnbg:#4A3510;
	--shadow:0 6px 18px rgba(0,0,0,.35);
}
body{background:var(--bg);color:var(--ink)}

/* headers / hero / bars were navy: emerald gradient */
.topnav,.topbar{background:linear-gradient(100deg,#082E24,#0E6B50)}
.hero{background:linear-gradient(135deg,#0A3B2E 0%,#12634A 65%,#23956F 100%);color:#fff}
html[data-theme="dark"] .hero{background:linear-gradient(135deg,#082E24 0%,#0D4032 80%)}
.hero .hs,.hs{color:var(--soft)}
.thumb{background:var(--ind2);color:var(--soft)}
.th{background:var(--ind2);color:var(--soft)}

/* text that sits on a gold surface */
.btn.g,.pill.gold,.card.gold,.play-badge,.pl,.badge-i .c{color:var(--ongold)}

/* selected / active states: emerald with a gold ring */
.chip.on,.day.on,.cell.on{background:var(--ind);color:#fff;border-color:var(--gold)}
.tab.on{color:var(--ind)}
html[data-theme="dark"] .tab.on{color:var(--gold)}
.msg.me .b{background:var(--ind);color:#fff}

.sec:before{background:var(--gold)}
.live-badge{background:var(--kum)}
.bar2>i{background:linear-gradient(90deg,var(--gold),#D98E14)}

/* "Sign in with Google" / check-in pill in the Home greeting card: comfortable size, never cramped */
.hero .chk{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 22px !important;line-height:1.2;white-space:nowrap;border-radius:23px;background:var(--gold);color:var(--ongold);font-weight:800;font-size:14.5px;text-decoration:none;border:0;flex:none}
@media(max-width:480px){.hero .top{flex-wrap:wrap;row-gap:12px}.hero .chk{min-height:44px;padding:0 18px !important}}

/* v5: desktop top menu - keep everything on one line */
@media (min-width: 900px) {
  .topnav .in { gap: 8px; flex-wrap: nowrap; }
  .topnav .brand { flex: none; margin-right: 14px; gap: 10px; }
  .topnav .brand span { font-size: 17px !important; white-space: nowrap; letter-spacing: 0; }
  .topnav .brand img { width: 40px; height: 40px; }
  .topnav a.nav { padding-left: 10px; padding-right: 10px; font-size: 15px; white-space: nowrap; }
  .topnav .btn.sm, .topnav .chip { font-size: 14px; padding-left: 14px; padding-right: 14px; white-space: nowrap; flex: none; }
  .topnav .grow { min-width: 0; }
}
@media (max-width: 1500px) { .topnav .hide-lg { display: none !important; } }
