/* dark-mode.css — shared dark mode overrides for healthcalc.online */
/* Load this AFTER the inline <style> block on every page         */

/* ── Base ───────────────────────────────────────────── */
body.dark{background:#0f172a;color:#f1f5f9;}
body.dark .wrapper,
body.dark .container{background:transparent;}
body.dark .page-header h1{background:linear-gradient(135deg,#38bdf8,#2dd4bf);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
body.dark .page-header p{color:#b0bec5;}
body.dark .controls-row,
body.dark .top-row,
body.dark .top-bar,
body.dark .top-bar-left,
body.dark .top-bar-right{background:transparent;}
body.dark .actions-row{background:transparent;}

/* ── Cards ──────────────────────────────────────────── */
body.dark .card,
body.dark .content-card,
body.dark .blog-card,
body.dark .section-card,
body.dark .calc-card{background:#1e293b;border-color:#334155;}
body.dark .card h2,
body.dark .card h3,
body.dark .content-card h2,
body.dark .content-card h3,
body.dark .blog-card h2,
body.dark .blog-card h2 a,
body.dark .section-card h2{color:#f1f5f9;}
body.dark .card h2 a:hover,
body.dark .blog-card h2 a:hover{color:#38bdf8;}
body.dark .card p,
body.dark .card li,
body.dark .card label,
body.dark .content-card p,
body.dark .content-card li,
body.dark .blog-card .excerpt,
body.dark .section-card p,
body.dark .section-card li,
body.dark .calc-card p{color:#e2e8f0;}
body.dark .card a,
body.dark .content-card a{color:#38bdf8;text-decoration-color:#0ea5e9;}
body.dark .card ul,
body.dark .card ol,
body.dark .content-card ul,
body.dark .content-card ol{padding-left:20px;}
body.dark .card ul li,
body.dark .card ol li{color:#e2e8f0;}
body.dark .blog-card:hover{box-shadow:0 8px 30px rgba(0,0,0,0.3);border-color:#475569;}
body.dark .blog-card .tag{background:#1e3a5f;color:#7dd3fc;}
body.dark .blog-card .meta{color:#64748b;}
body.dark .blog-card .read-more{color:#38bdf8;}
body.dark .blog-card .read-more:hover{color:#7dd3fc;}
body.dark .calc-card h3,
body.dark .calc-card p{color:#e2e8f0;}
body.dark .calc-card:hover{border-color:#475569;}
body.dark .calc-card .arrow{color:#38bdf8;}

/* ── Article Body (blog posts) ──────────────────────── */
body.dark .article-body{background:#1e293b;border-color:#334155;}
body.dark .article-body h2,
body.dark .article-body h3{color:#f1f5f9;}
body.dark .article-body p,
body.dark .article-body ul,
body.dark .article-body ol,
body.dark .article-body li{color:#e2e8f0;}
body.dark .article-body strong{color:#f1f5f9;}
body.dark .article-body a{color:#38bdf8;text-decoration-color:#0ea5e9;}
body.dark .article-body a:hover{color:#7dd3fc;text-decoration-color:#7dd3fc;}
body.dark .article-header h1{color:#f1f5f9;}
body.dark .article-header .tag{background:#1e3a5f;color:#7dd3fc;}
body.dark .article-header .meta{color:#64748b;}
body.dark .breadcrumb{color:#94a3b8;}
body.dark .breadcrumb a{color:#38bdf8;}
body.dark .article-body img{filter:brightness(0.85);}

/* ── Forms & Inputs ─────────────────────────────────── */
body.dark input,
body.dark textarea,
body.dark select{background:#0f172a;border-color:#334155;color:#f1f5f9;}
body.dark input:focus,
body.dark textarea:focus,
body.dark select:focus{border-color:#38bdf8;background:#0f172a;}
body.dark input::placeholder,
body.dark textarea::placeholder{color:#64748b;}
body.dark label,
body.dark .form-group label{color:#e2e8f0;}
body.dark .lang-select,
body.dark select{background:#0f172a;color:#f1f5f9;border-color:#334155;}

/* ── Buttons ────────────────────────────────────────── */
body.dark .btn-primary{background:#2563eb;color:#fff;border-color:#2563eb;}
body.dark .btn-primary:hover{background:#3b82f6;}
body.dark .btn-secondary{background:#334155;color:#f1f5f9;border-color:#475569;}
body.dark .btn-secondary:hover{background:#475569;}
body.dark .btn-danger{background:#451a1a;color:#fca5a5;border-color:#7f1d1d;}
body.dark .btn-danger:hover{background:#7f1d1d;}
body.dark .btn-outline{background:transparent;color:#38bdf8;border-color:#38bdf8;}
body.dark .btn-outline:hover{background:#1e3a5f;}
body.dark .btn-auth,
body.dark .btn-login,
body.dark .btn-signup,
body.dark .btn-clear{background:#334155;color:#e2e8f0;border-color:#475569;}
body.dark .btn-auth:hover,
body.dark .btn-login:hover,
body.dark .btn-signup:hover,
body.dark .btn-clear:hover{background:#475569;color:#f1f5f9;}
body.dark .btn-logout{background:#451a1a;color:#fca5a5;}
body.dark .btn-logout:hover{background:#7f1d1d;color:#fecaca;}
body.dark .btn-modal{background:#2563eb;color:#fff;}
body.dark .btn-modal:hover{background:#3b82f6;}
body.dark .cta-btn,
body.dark .cta-btn:hover{background:#2563eb;color:#fff;}
body.dark .copy-btn{background:#334155;color:#e2e8f0;border-color:#475569;}
body.dark .copy-btn:hover{background:#475569;}
body.dark .copy-btn.copied{background:#065f46;color:#86efac;border-color:#059669;}
body.dark .share-btn,
body.dark .share-x,
body.dark .share-whatsapp,
body.dark .share-instagram,
body.dark .share-pdf,
body.dark .share-save{background:#334155;color:#e2e8f0;border-color:#475569;}
body.dark .share-btn:hover{background:#475569;}
body.dark .entry-del{background:#451a1a;color:#fca5a5;}
body.dark .entry-del:hover{background:#7f1d1d;color:#fecaca;}
body.dark .share-row{background:transparent;}

/* ── Result Display ─────────────────────────────────── */
body.dark .result-box{background:#0f172a;border-color:#334155;color:#e2e8f0;}
body.dark .bmi-number{background:linear-gradient(135deg,#38bdf8,#2dd4bf);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
body.dark .bmi-category,
body.dark .result-label,
body.dark .result-value{color:#e2e8f0;}
body.dark .bmi-gauge{background:#334155;}
body.dark .bmi-gauge .indicator{background:#38bdf8;}
body.dark .suggestions-box{background:#0f172a;border-color:#334155;}
body.dark .sug-title{color:#f1f5f9;}
body.dark .sug-list{color:#e2e8f0;}
body.dark .sug-item{color:#e2e8f0;}
body.dark .sug-item::before{color:#38bdf8;}
body.dark .category-underweight,
body.dark .category-normal,
body.dark .category-overweight,
body.dark .category-obese{color:#e2e8f0;}
body.dark .interpret-box{background:#0f172a;border-color:#334155;}
body.dark .interpret-box .range,
body.dark .interpret-box .label{color:#e2e8f0;}
body.dark .interpret-box.underweight{border-left-color:#3b82f6;}
body.dark .interpret-box.normal{border-left-color:#22c55e;}
body.dark .interpret-box.overweight{border-left-color:#f59e0b;}
body.dark .interpret-box.obese{border-left-color:#ef4444;}
body.dark .interpret-grid{background:transparent;}

/* ── Modal ──────────────────────────────────────────── */
body.dark .modal-overlay{background:rgba(0,0,0,0.7);}
body.dark .modal{background:#1e293b;border-color:#334155;}
body.dark .modal h2{color:#f1f5f9;}
body.dark .modal .modal-sub,
body.dark .modal .form-group label{color:#e2e8f0;}
body.dark .modal input{background:#0f172a;border-color:#334155;color:#f1f5f9;}
body.dark .modal input:focus{border-color:#38bdf8;}
body.dark .modal .close-btn{background:#334155;color:#e2e8f0;}
body.dark .modal .close-btn:hover{background:#475569;color:#f1f5f9;}
body.dark .modal .switch-link{color:#38bdf8;}
body.dark .modal .error-msg{color:#fca5a5;background:#451a1a;border-color:#7f1d1d;}
body.dark .google-divider{color:#94a3b8;}
body.dark .google-divider::before,
body.dark .google-divider::after{background:#334155;}
body.dark .google-btn-wrapper{background:transparent;}

/* ── User Menu ──────────────────────────────────────── */
body.dark .user-menu{background:transparent;}
body.dark .user-avatar{background:linear-gradient(135deg,#38bdf8,#2dd4bf);color:#fff;}
body.dark .user-name{color:#f1f5f9;}

/* ── Stats & Metrics ────────────────────────────────── */
body.dark .stat-box,
body.dark .stat-card{background:#0f172a;border-color:#334155;}
body.dark .stat-box .stat-value,
body.dark .stat-card .stat-num{color:#38bdf8;}
body.dark .stat-box .stat-label,
body.dark .stat-card .stat-label{color:#94a3b8;}
body.dark .stat-change,
body.dark .change-positive{color:#4ade80;}
body.dark .change-negative{color:#f87171;}
body.dark .change-neutral{color:#94a3b8;}
body.dark .stat-icon{color:#38bdf8;}
body.dark .stat-chip{background:#334155;color:#e2e8f0;border-color:#475569;}
body.dark .stat-chip strong{color:#f1f5f9;}
body.dark .stats-row,
body.dark .stats-grid{background:transparent;}
body.dark .section-header{background:transparent;}
body.dark .section-title .count{background:#2563eb;color:#fff;}
body.dark .score-section{color:#f1f5f9;}

/* ── Metrics & Charts ───────────────────────────────── */
body.dark .metric-row{border-color:#334155;}
body.dark .metric-label{color:#e2e8f0;}
body.dark .metric-value{color:#f1f5f9;}
body.dark .metric-date{color:#64748b;}
body.dark .chart-bar{background:#334155;}
body.dark .chart-fill{background:linear-gradient(90deg,#38bdf8,#2dd4bf);}
body.dark .history-list{background:transparent;}
body.dark .history-item{border-color:#334155;}
body.dark .empty-msg{color:#64748b;}
body.dark .empty-msg a{color:#38bdf8;}

/* ── History Entries ────────────────────────────────── */
body.dark .entry{border-color:#334155;}
body.dark .entry:hover{background:#334155;}
body.dark .entry-val{color:#f1f5f9;}
body.dark .entry-label{color:#e2e8f0;}
body.dark .entry-info,
body.dark .entry-detail,
body.dark .entry-date{color:#94a3b8;}
body.dark .empty-state p,
body.dark .login-state p{color:#94a3b8;}
body.dark .empty-state h3,
body.dark .login-state h2{color:#f1f5f9;}
body.dark .empty-state a{color:#38bdf8;}
body.dark .empty-icon,
body.dark .login-icon{color:#64748b;}
body.dark .login-state .btn-primary{background:linear-gradient(135deg,#2563eb,#0891b2);}

/* ── Progress Tracker ───────────────────────────────── */
body.dark .progress-wrap,
body.dark .weekly-row{background:transparent;}
body.dark .progress-label{color:#e2e8f0;}
body.dark .progress-bar{background:#334155;}
body.dark .progress-fill{background:linear-gradient(90deg,#38bdf8,#2dd4bf);}
body.dark .water-glasses{background:transparent;}
body.dark .water-glass{background:#0f172a;border-color:#334155;color:#94a3b8;}
body.dark .water-glass.filled{background:#0284c7;border-color:#0284c7;color:#fff;}
body.dark .water-label{color:#38bdf8;}
body.dark .water-hint{color:#94a3b8;}
body.dark .consistency-label{color:#94a3b8;}
body.dark .weekly-day{background:#0f172a;border-color:#334155;}
body.dark .weekly-day .day-name{color:#b0bec5;}
body.dark .weekly-day .day-weight{color:#e2e8f0;}
body.dark .weekly-day .day-water{color:#38bdf8;}
body.dark .weekly-day .day-score,
body.dark .day-score{color:#94a3b8;}
body.dark .score-good{color:#4ade80;}
body.dark .score-ok{color:#fbbf24;}
body.dark .score-bad{color:#f87171;}
body.dark .chart-container{background:transparent;}

/* ── Details/FAQ ────────────────────────────────────── */
body.dark details summary{background:#0f172a;border-color:#334155;color:#f1f5f9;}
body.dark details summary:hover{background:#1e293b;}
body.dark details[open] summary{border-color:#475569;}
body.dark details .faq-answer{border-color:#334155;color:#e2e8f0;}
body.dark .faq-item{border-color:#334155;}
body.dark .faq-q{color:#f1f5f9;}
body.dark .faq-a{color:#e2e8f0;}
body.dark .faq-a a{color:#38bdf8;}

/* ── CTA Boxes ──────────────────────────────────────── */
body.dark .cta-box{background:#1e3a5f;border-color:#2563eb;}
body.dark .cta-box h2,
body.dark .cta-box h3{color:#f1f5f9;}
body.dark .cta-box p{color:#93c5fd;}
body.dark .cta-box a,
body.dark .cta-banner a{background:#2563eb;color:#fff;}
body.dark .cta-box a:hover,
body.dark .cta-banner a:hover{background:#3b82f6;}
body.dark .cta-banner{background:linear-gradient(135deg,#1e3a5f,#064e3b);}
body.dark .cta-banner h2{color:#f1f5f9;}
body.dark .cta-banner p{color:#cbd5e1;}

/* ── Tip / Warning Boxes ────────────────────────────── */
body.dark .tip-box{background:#052e16;border-left-color:#22c55e;}
body.dark .tip-box p{color:#86efac;}
body.dark .tip-box a{color:#4ade80;text-decoration:underline;}
body.dark .tip-box a:hover{color:#86efac;}
body.dark .warning-box{background:#422006;border-left-color:#f59e0b;}
body.dark .warning-box p{color:#fde68a;}
body.dark .warning-box a{color:#fbbf24;text-decoration:underline;}
body.dark .warning-box a:hover{color:#fde68a;}

/* ── Tables (comparison, rate, cost) ────────────────── */
body.dark table,
body.dark .comparison-table,
body.dark .rate-table,
body.dark .cost-table,
body.dark .bmi-table{overflow-x:auto;}
body.dark table th,
body.dark .comparison-table th,
body.dark .rate-table th,
body.dark .cost-table th{background:#0f172a;color:#f1f5f9;}
body.dark table td,
body.dark .comparison-table td,
body.dark .rate-table td,
body.dark .cost-table td{color:#e2e8f0;}
body.dark table th,
body.dark table td,
body.dark .comparison-table th,
body.dark .comparison-table td,
body.dark .rate-table th,
body.dark .rate-table td,
body.dark .cost-table th,
body.dark .cost-table td{border-color:#334155;}

/* ── Index Page Specific ────────────────────────────── */
body.dark .header{background:transparent;}
body.dark .header p{color:#b0bec5;}
body.dark .tagline p{color:#94a3b8;}
body.dark .tagline strong{color:#e2e8f0;}
body.dark .cat-section h2{color:#f1f5f9;}
body.dark .calc-grid{background:transparent;}

/* ── How It Works Specific ──────────────────────────── */
body.dark .step-box{background:#0f172a;border-color:#334155;}
body.dark .step-box h3{color:#f1f5f9;}
body.dark .step-box p,
body.dark .step-num{color:#94a3b8;}
body.dark .formula-box{background:#0f172a;border-color:#334155;color:#e2e8f0;}
body.dark .highlight{background:#1e3a5f;border-color:#38bdf8;}
body.dark .highlight p{color:#e0f2fe;}
body.dark .tool-item{background:#0f172a;border-color:#334155;}
body.dark .tool-item .text{color:#f1f5f9;}
body.dark .tool-item .sub,
body.dark .tool-item .icon{color:#94a3b8;}

/* ── Widget Page ────────────────────────────────────── */
body.dark .hero-left h1{background:linear-gradient(135deg,#38bdf8,#2dd4bf);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
body.dark .hero-left p{color:#e2e8f0;}
body.dark .hero-badge{background:#1e3a5f;color:#7dd3fc;border-color:#2563eb;}
body.dark .benefit-box{background:#0f172a;border-color:#334155;}
body.dark .benefit-box .title{color:#f1f5f9;}
body.dark .benefit-box .desc{color:#e2e8f0;}
body.dark .benefit-box .icon{color:#38bdf8;}
body.dark .code-block{background:#0f172a;}
body.dark .code-block code{color:#e2e8f0;}
body.dark .kw{color:#7dd3fc;}
body.dark .str{color:#86efac;}
body.dark .cmt{color:#64748b;}
body.dark .feature-list li{color:#e2e8f0;}
body.dark .feature-list .check{color:#4ade80;}
body.dark .widget-demo{background:#0f172a;border-color:#334155;}

/* ── Navigation & Footer ────────────────────────────── */
body.dark .back-link{color:#38bdf8;}
body.dark .back-link:hover{color:#7dd3fc;}
body.dark a.rlink{color:#38bdf8;}
body.dark a.rlink:hover{color:#7dd3fc;}
body.dark .byline{color:#94a3b8;}
body.dark .byline strong{color:#b0bec5;}
body.dark .footer{border-color:#334155;color:#94a3b8;}
body.dark .footer a{color:#94a3b8;text-decoration-color:#475569;}
body.dark .footer a:hover{color:#38bdf8;text-decoration-color:#38bdf8;}

/* ── Theme Toggle ────────────────────────────────────── */
body.dark .theme-toggle{background:#1e293b;color:#fbbf24;border-color:#334155;}
body.dark .theme-toggle:hover{border-color:#38bdf8;}

/* ── Modal / Overrides for body.dark .btn-group etc. ── */
body.dark .actions{background:transparent;}
body.dark .actions .btn-primary{background:#2563eb;color:#fff;}
body.dark .actions .btn-outline{background:transparent;color:#38bdf8;border-color:#38bdf8;}

/* ─── Print styles hidden in dark mode ──────────────── */
@media print{body.dark{background:#fff!important;color:#000!important;}}