/* ============================================================
 * Telugu Gospel Lyrics — Pro module styles (v1.32.0)
 * Mobile drawer, sticky bottom nav, favorites, dark mode.
 * Light visual; no change to existing brand colors.
 * ============================================================ */

/* ---------- Dark mode tokens (sitewide) ---------- */
html[data-theme="dark"]{
  --tgl-bg:#0f172a;            /* slate-900 */
  --tgl-surface:#1e293b;       /* slate-800 */
  --tgl-surface-2:#273449;     /* slightly lighter */
  --tgl-text:#f1f5f9;          /* slate-100 */
  --tgl-muted:#94a3b8;         /* slate-400 */
  --tgl-line:rgba(255,255,255,.10);
  --tgl-card:#1e293b;
  --tgl-accent:#fbbf24;        /* warm gold for links/hover */
  color-scheme:dark;
  background:#0f172a !important;
}
html[data-theme="dark"] body{ background:#0f172a !important; color:#f1f5f9 !important; }
html[data-theme="dark"] .tgl-article,
html[data-theme="dark"] .tgl-widget,
html[data-theme="dark"] .tgl-pcard,
html[data-theme="dark"] .tgl-card,
html[data-theme="dark"] .tgl-related-card,
html[data-theme="dark"] .tgl-hero,
html[data-theme="dark"] .tgl-container .tgl-block,
html[data-theme="dark"] .lgenx-table,
html[data-theme="dark"] .tgl-table{
  background:#1e293b !important; color:#f1f5f9 !important;
  border-color:rgba(255,255,255,.10) !important;
  box-shadow:0 1px 2px rgba(0,0,0,.4) !important;
}
html[data-theme="dark"] .tgl-content,
html[data-theme="dark"] .tgl-content p,
html[data-theme="dark"] .tgl-content li,
html[data-theme="dark"] .tgl-post-title,
html[data-theme="dark"] .tgl-widget-title,
html[data-theme="dark"] .tgl-pcard__title,
html[data-theme="dark"] .tgl-pcard__excerpt,
html[data-theme="dark"] h1,html[data-theme="dark"] h2,html[data-theme="dark"] h3,
html[data-theme="dark"] h4,html[data-theme="dark"] h5,html[data-theme="dark"] h6{
  color:#f1f5f9 !important;
}
html[data-theme="dark"] .tgl-content p,
html[data-theme="dark"] .tgl-content li,
html[data-theme="dark"] .tgl-pcard__excerpt,
html[data-theme="dark"] .tgl-muted,
html[data-theme="dark"] small,
html[data-theme="dark"] .tgl-meta{ color:#cbd5e1 !important; }
html[data-theme="dark"] a{ color:#7dd3fc; }
html[data-theme="dark"] a:hover{ color:#fbbf24; }
html[data-theme="dark"] hr,
html[data-theme="dark"] .tgl-divider{ border-color:rgba(255,255,255,.10) !important; }
html[data-theme="dark"] th,
html[data-theme="dark"] td{ border-color:rgba(255,255,255,.10) !important; }
html[data-theme="dark"] thead th,
html[data-theme="dark"] .lgenx-table thead th,
html[data-theme="dark"] .tgl-table thead th{
  background:#273449 !important; color:#f1f5f9 !important;
}
html[data-theme="dark"] code,
html[data-theme="dark"] pre,
html[data-theme="dark"] blockquote{
  background:#0b1224 !important; color:#e2e8f0 !important;
  border-color:rgba(255,255,255,.10) !important;
}
html[data-theme="dark"] ::selection{ background:#fbbf24; color:#0f172a; }
html[data-theme="dark"] .tgl-header,
html[data-theme="dark"] .tgl-header--v2,
html[data-theme="dark"] .tgl-navbar,
html[data-theme="dark"] .tgl-topbar,
html[data-theme="dark"] .tgl-ticker{
  background:#0b1224 !important; color:#f1f5f9 !important;
  border-color:rgba(255,255,255,.10) !important;
}
html[data-theme="dark"] .tgl-header-search__input,
html[data-theme="dark"] input[type="search"],
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="url"],
html[data-theme="dark"] select,
html[data-theme="dark"] textarea{
  background:#0f172a !important; color:#f1f5f9 !important;
  border-color:rgba(255,255,255,.18) !important;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder{ color:#94a3b8 !important; }
html[data-theme="dark"] .tgl-ad-box{ background:#0f172a !important; color:#94a3b8 !important; border-color:rgba(255,255,255,.10) !important; }
html[data-theme="dark"] .tgl-btn,
html[data-theme="dark"] button.tgl-btn{
  background:#fbbf24 !important; color:#0f172a !important; border-color:transparent !important;
}
html[data-theme="dark"] .tgl-btn:hover{ background:#f59e0b !important; }
html[data-theme="dark"] img{ filter:brightness(.92); }

/* ---------- Floating Dark/Light toggle button ---------- */
.tgl-floattoggle{
  position:fixed; z-index:9999;
  width:48px; height:48px; border-radius:50%;
  border:1px solid rgba(0,0,0,.08);
  background:#ffffff; color:#0f172a; cursor:pointer;
  box-shadow:0 6px 18px rgba(15,23,42,.18);
  display:inline-flex; align-items:center; justify-content:center;
  transition:transform .2s ease, background .2s ease, color .2s ease;
  padding:0;
}
.tgl-floattoggle:hover{ transform:scale(1.08); }
.tgl-floattoggle svg{ width:22px; height:22px; fill:currentColor; }
.tgl-floattoggle .tgl-floattoggle__icon{ display:none; line-height:0; }
.tgl-floattoggle .tgl-floattoggle__icon--moon{ display:inline-flex; }
html[data-theme="dark"] .tgl-floattoggle{
  background:#1e293b; color:#fbbf24; border-color:rgba(255,255,255,.12);
  box-shadow:0 6px 18px rgba(0,0,0,.5);
}
html[data-theme="dark"] .tgl-floattoggle .tgl-floattoggle__icon--moon{ display:none; }
html[data-theme="dark"] .tgl-floattoggle .tgl-floattoggle__icon--sun{ display:inline-flex; }

.tgl-floattoggle--bottom-right{ right:18px; bottom:18px; }
.tgl-floattoggle--bottom-left { left:18px;  bottom:18px; }
.tgl-floattoggle--top-right   { right:18px; top:84px; }
.tgl-floattoggle--top-left    { left:18px;  top:84px; }
@media (max-width:860px){
  .tgl-floattoggle--bottom-right,
  .tgl-floattoggle--bottom-left{ bottom:86px; } /* clear sticky bottom nav */
}

/* ---------- Slide-in drawer ---------- */
.tgl-drawer{ position:fixed; inset:0; z-index:10010; }
.tgl-drawer[hidden]{ display:none; }
.tgl-drawer__scrim{ position:absolute; inset:0; background:rgba(8,12,28,.55); opacity:0; transition:opacity .25s ease; }
.tgl-drawer.is-open .tgl-drawer__scrim{ opacity:1; }
.tgl-drawer__panel{
  position:absolute; top:0; left:0; height:100%; width:min(86vw,340px);
  background:#fff; color:#0b1530; box-shadow:2px 0 24px rgba(0,0,0,.25);
  transform:translateX(-100%); transition:transform .28s ease; display:flex; flex-direction:column;
  overflow-y:auto; overscroll-behavior:contain;
}
.tgl-drawer.is-open .tgl-drawer__panel{ transform:translateX(0); }
html[data-theme="dark"] .tgl-drawer__panel{ background:#121a36; color:#e6ecff; }
.tgl-drawer__head{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 16px; border-bottom:1px solid rgba(0,0,0,.08); position:sticky; top:0;
  background:inherit; z-index:1;
}
.tgl-drawer__title{ font-weight:800; font-size:16px; }
.tgl-drawer__close{
  width:38px; height:38px; border-radius:50%; border:0;
  background:rgba(0,0,0,.06); cursor:pointer; font-size:18px;
}
.tgl-drawer__search{
  display:flex; gap:6px; padding:12px 16px; border-bottom:1px solid rgba(0,0,0,.08);
}
.tgl-drawer__search input{
  flex:1; min-width:0; padding:10px 12px; border-radius:10px;
  border:1px solid rgba(0,0,0,.12); font:inherit;
}
.tgl-drawer__search button{
  width:42px; border:0; border-radius:10px; background:#0b1530; color:#fff; cursor:pointer;
}
.tgl-drawer__nav,
.tgl-drawer__cats{ padding:6px 8px 12px; }
.tgl-drawer__list,
.tgl-drawer__cats ul{ list-style:none; padding:0; margin:0; }
.tgl-drawer__list li a,
.tgl-drawer__cats ul li a{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 14px; border-radius:10px; text-decoration:none; color:inherit;
  font-weight:600; font-size:15px;
}
.tgl-drawer__list li a:hover,
.tgl-drawer__cats ul li a:hover{ background:rgba(11,21,48,.06); }
html[data-theme="dark"] .tgl-drawer__list li a:hover,
html[data-theme="dark"] .tgl-drawer__cats ul li a:hover{ background:rgba(255,255,255,.06); }
.tgl-drawer__cats h4{ margin:8px 14px 6px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:#6b7280; }
.tgl-drawer__cats ul li a span{ font-size:12px; color:#6b7280; font-weight:500; }
.tgl-drawer__foot{ margin-top:auto; padding:14px 16px; border-top:1px solid rgba(0,0,0,.08); }
.tgl-darktoggle{
  width:100%; display:flex; align-items:center; justify-content:center; gap:10px;
  padding:12px; border-radius:12px; border:1px solid rgba(0,0,0,.1);
  background:transparent; cursor:pointer; font-weight:700; font-size:14px; color:inherit;
}
.tgl-darktoggle[aria-pressed="true"]{ background:#0b1530; color:#fff; border-color:#0b1530; }
html[data-theme="dark"] .tgl-darktoggle{ border-color:rgba(255,255,255,.15); }

/* ---------- Sticky bottom nav (mobile only) ---------- */
.tgl-bottomnav{
  position:fixed; left:0; right:0; bottom:0; z-index:9998;
  display:none; grid-template-columns:repeat(5,1fr);
  background:#fff; border-top:1px solid rgba(0,0,0,.08);
  box-shadow:0 -6px 16px rgba(0,0,0,.06);
  padding:4px 4px calc(4px + env(safe-area-inset-bottom));
}
html[data-theme="dark"] .tgl-bottomnav{ background:#0f1733; border-color:rgba(255,255,255,.08); }
.tgl-bottomnav__item{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2px; padding:6px 4px; min-height:54px;
  background:transparent; border:0; cursor:pointer;
  text-decoration:none; color:#374151; font-size:11px; font-weight:600;
}
html[data-theme="dark"] .tgl-bottomnav__item{ color:#cbd5e1; }
.tgl-bottomnav__item svg{ width:22px; height:22px; fill:currentColor; }
.tgl-bottomnav__item:hover,
.tgl-bottomnav__item:focus{ color:#0b1530; }
html[data-theme="dark"] .tgl-bottomnav__item:hover{ color:#FFB300; }
.tgl-bottomnav__cta{
  position:relative; margin-top:-14px; background:#FF9000; color:#fff !important;
  border-radius:50%; width:54px; height:54px; align-self:center; justify-self:center;
  box-shadow:0 6px 14px rgba(255,144,0,.45);
}
.tgl-bottomnav__cta span{ display:none; }
.tgl-favbadge{
  display:inline-block; font-style:normal; min-width:16px; padding:0 4px;
  background:#e11d48; color:#fff; border-radius:8px; font-size:10px; font-weight:700;
}
@media (max-width:860px){
  .tgl-bottomnav{ display:grid; }
  body{ padding-bottom:74px; }
}

/* ---------- Favorites button on single posts ---------- */
.tgl-favbtn{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 14px; border-radius:999px; border:1px solid rgba(0,0,0,.12);
  background:#fff; cursor:pointer; font:600 14px/1 inherit; color:#0b1530;
  margin:0 0 14px; transition:all .2s ease;
}
.tgl-favbtn svg{ width:18px; height:18px; fill:none; stroke:#e11d48; stroke-width:2; }
.tgl-favbtn[aria-pressed="true"]{ background:#fff1f3; border-color:#fda4af; }
.tgl-favbtn[aria-pressed="true"] svg{ fill:#e11d48; }
.tgl-favbtn .tgl-favbtn__on{ display:none; }
.tgl-favbtn[aria-pressed="true"] .tgl-favbtn__on{ display:inline; }
.tgl-favbtn[aria-pressed="true"] .tgl-favbtn__off{ display:none; }
html[data-theme="dark"] .tgl-favbtn{ background:#121a36; color:#e6ecff; border-color:rgba(255,255,255,.15); }

/* ---------- Favorites page list ---------- */
#tgl-favorites-root{ display:grid; gap:12px; }
.tgl-fav-item{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 16px; border-radius:12px; border:1px solid rgba(0,0,0,.08);
  background:#fff;
}
html[data-theme="dark"] .tgl-fav-item{ background:#121a36; border-color:rgba(255,255,255,.08); }
.tgl-fav-item a{ font-weight:700; color:inherit; text-decoration:none; }
.tgl-fav-item button{
  border:0; background:transparent; cursor:pointer; color:#e11d48; font-size:20px;
}
.tgl-fav-empty{ padding:24px; text-align:center; color:#6b7280; border:1px dashed rgba(0,0,0,.12); border-radius:12px; }

/* ---------- Mobile polish ---------- */
@media (max-width:860px){
  .tgl-content{ font-size:16px; line-height:1.8; }
  .tgl-content p{ margin:0 0 14px; }
  .tgl-content h2,.tgl-content h3{ margin:22px 0 10px; }
  .tgl-btn{ min-height:44px; padding:10px 16px; }
  .tgl-pcard__title{ font-size:16px; }
  /* Smoother tap targets in lists */
  .tgl-content a{ padding:2px 0; }
}

@media print{
  .tgl-bottomnav,.tgl-drawer,.tgl-favbtn{ display:none !important; }
}