/* Modal overlay helper. Toggled open/closed with the `hidden` class via JS.
   Using this custom class (instead of Tailwind's `flex`) keeps `hidden` and a
   display utility from sitting on the same element, which Tailwind flags as a
   cssConflict. Alignment is still done with Tailwind items-*/justify-* classes. */
.modal-overlay { display: flex; }
.modal-overlay.hidden { display: none; }

/* ── Dark Orange (default) ── */
body.theme-orange { background-color: #000000; color: #ffffff; }
body.theme-orange .t-bg-card        { background-color: #1a1008; }
body.theme-orange .t-border         { border-color: #3a3020; }
body.theme-orange .t-accent         { color: #c0c0c0; }
body.theme-orange .t-accent-border  { border-color: #c2410c; }
body.theme-orange .t-accent-bg      { background-color: #c2410c; }
body.theme-orange .t-accent-bg:hover{ background-color: #ea580c; }
body.theme-orange .t-muted          { color: #b08060; }
body.theme-orange .t-sub            { color: #e8d0b8; }
body.theme-orange .t-nav-bg         { background-color: #161008; }
body.theme-orange .t-card-hover:hover { background-color: #251810; }
body.theme-orange .t-card-active:active { background-color: #302015; }
body.theme-orange .t-expense        { color: #ffffff; }

body.theme-orange h1,
body.theme-orange h2 {
    background: linear-gradient(to bottom, #ffffff, #e0e0e0, #a0a0a0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.5));
}

/* ── Dark Burgundy ── */
body.theme-burgundy { background-color: #000000; color: #ffffff; }
body.theme-burgundy .t-bg-card        { background-color: #220d1a; }
body.theme-burgundy .t-border         { border-color: #7a2040; }
body.theme-burgundy .t-accent         { color: #c0c0c0; }
body.theme-burgundy .t-accent-border  { border-color: #ff6080; }
body.theme-burgundy .t-accent-bg      { background-color: #9b2a3e; }
body.theme-burgundy .t-accent-bg:hover{ background-color: #c03050; }
body.theme-burgundy .t-muted          { color: #a06070; }
body.theme-burgundy .t-sub            { color: #e8c0cc; }
body.theme-burgundy .t-nav-bg         { background-color: #1a0810; }
body.theme-burgundy .t-card-hover:hover { background-color: #2e1220; }
body.theme-burgundy .t-card-active:active { background-color: #3a182a; }
body.theme-burgundy .t-expense        { color: #ffffff; }

/* ── Dark Navy ── */
body.theme-navy { background-color: #000000; color: #ffffff; }
body.theme-navy .t-bg-card        { background-color: #0c1628; }
body.theme-navy .t-border         { border-color: #1e4070; }
body.theme-navy .t-accent         { color: #c0c0c0; }
body.theme-navy .t-accent-border  { border-color: #60a8ff; }
body.theme-navy .t-accent-bg      { background-color: #1d4ed8; }
body.theme-navy .t-accent-bg:hover{ background-color: #2563eb; }
body.theme-navy .t-muted          { color: #6090c0; }
body.theme-navy .t-sub            { color: #b8d0f0; }
body.theme-navy .t-nav-bg         { background-color: #081020; }
body.theme-navy .t-card-hover:hover { background-color: #121e34; }
body.theme-navy .t-card-active:active { background-color: #182540; }
body.theme-navy .t-expense        { color: #ffffff; }

/* ── Forest ── */
body.theme-forest { background-color: #000000; color: #ffffff; }
body.theme-forest .t-bg-card        { background-color: #0a1a0a; }
body.theme-forest .t-border         { border-color: #1e4820; }
body.theme-forest .t-accent         { color: #c0c0c0; }
body.theme-forest .t-accent-border  { border-color: #4ade80; }
body.theme-forest .t-accent-bg      { background-color: #166534; }
body.theme-forest .t-accent-bg:hover{ background-color: #1a7a3e; }
body.theme-forest .t-muted          { color: #60a070; }
body.theme-forest .t-sub            { color: #c0e8c8; }
body.theme-forest .t-nav-bg         { background-color: #071207; }
body.theme-forest .t-card-hover:hover { background-color: #122212; }
body.theme-forest .t-card-active:active { background-color: #182a18; }
body.theme-forest .t-expense        { color: #ffffff; }

/* ── Purple ── */
body.theme-purple { background-color: #000000; color: #ffffff; }
body.theme-purple .t-bg-card        { background-color: #120a24; }
body.theme-purple .t-border         { border-color: #5a2a90; }
body.theme-purple .t-accent         { color: #c0c0c0; }
body.theme-purple .t-accent-border  { border-color: #c084fc; }
body.theme-purple .t-accent-bg      { background-color: #7e22ce; }
body.theme-purple .t-accent-bg:hover{ background-color: #9333ea; }
body.theme-purple .t-muted          { color: #9060c0; }
body.theme-purple .t-sub            { color: #d8c0f0; }
body.theme-purple .t-nav-bg         { background-color: #0d0618; }
body.theme-purple .t-card-hover:hover { background-color: #1a1030; }
body.theme-purple .t-card-active:active { background-color: #22163c; }
body.theme-purple .t-expense        { color: #ffffff; }

/* ── Red White Blue ── */
body.theme-rwb { background-color: #000000; color: #ffffff; }
body.theme-rwb .t-bg-card        { background-color: #0c1020; border-top: 2px solid #dc2626; }
body.theme-rwb .t-border         { border-color: #2a4a8a; }
body.theme-rwb .t-accent         { color: #c0c0c0; }
body.theme-rwb .t-accent-border  { border-color: #ff5050; }
body.theme-rwb .t-accent-bg      { background-color: #b91c1c; }
body.theme-rwb .t-accent-bg:hover{ background-color: #dc2626; }
body.theme-rwb .t-muted          { color: #8090c0; }
body.theme-rwb .t-sub            { color: #c8d0f0; }
body.theme-rwb .t-nav-bg         { background-color: #080a18; }
body.theme-rwb .t-card-hover:hover { background-color: #141828; }
body.theme-rwb .t-card-active:active { background-color: #1a2030; }
body.theme-rwb .t-expense        { color: #ffffff; }

/* ── Texture on body background only ── */
body {
    background-image: url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22300%22 height=%22300%22%3E%3Cfilter id=%22n%22%3E%3CfeTurbulence type=%22turbulence%22 baseFrequency=%220.4%22 numOctaves=%224%22 stitchTiles=%22stitch%22/%3E%3C/filter%3E%3Crect width=%22300%22 height=%22300%22 filter=%22url(%23n)%22 opacity=%220.15%22/%3E%3C/svg%3E');
    background-repeat: repeat;
    background-size: 200px 200px;
}

/* ── t-texture available for one-off use ── */
.t-texture {
    background-color: rgba(0,0,0,0.4) !important;
    background-image: url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22300%22 height=%22300%22%3E%3Cfilter id=%22n%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.75%22 numOctaves=%224%22 stitchTiles=%22stitch%22/%3E%3C/filter%3E%3Crect width=%22300%22 height=%22300%22 filter=%22url(%23n)%22 opacity=%220.15%22/%3E%3C/svg%3E') !important;
    background-repeat: repeat !important;
    background-size: 200px 200px !important;
}

/* ── CTA Buttons — theme-aware gradient + glow + silver border ── */
body.theme-orange .cta-btn {
    background: linear-gradient(135deg, #c2410c, #9a3412, #7c2d12);
    box-shadow: 0 0 20px rgba(194,65,12,0.45), 0 4px 12px rgba(0,0,0,0.5);
    color: #ffffff;
}
body.theme-burgundy .cta-btn {
    background: linear-gradient(135deg, #9f1239, #881337, #6b0f2d);
    box-shadow: 0 0 20px rgba(159,18,57,0.45), 0 4px 12px rgba(0,0,0,0.5);
    color: #ffffff;
}
body.theme-navy .cta-btn {
    background: linear-gradient(135deg, #1d4ed8, #1e3a8a, #172554);
    box-shadow: 0 0 20px rgba(29,78,216,0.45), 0 4px 12px rgba(0,0,0,0.5);
    color: #ffffff;
}
body.theme-forest .cta-btn {
    background: linear-gradient(135deg, #166534, #14532d, #052e16);
    box-shadow: 0 0 20px rgba(22,101,52,0.45), 0 4px 12px rgba(0,0,0,0.5);
    color: #ffffff;
}
body.theme-purple .cta-btn {
    background: linear-gradient(135deg, #7e22ce, #581c87, #3b0764);
    box-shadow: 0 0 20px rgba(126,34,206,0.45), 0 4px 12px rgba(0,0,0,0.5);
    color: #ffffff;
}
body.theme-rwb .cta-btn {
    background: linear-gradient(135deg, #b91c1c, #991b1b, #7f1d1d);
    box-shadow: 0 0 20px rgba(185,28,28,0.45), 0 4px 12px rgba(0,0,0,0.5);
    color: #ffffff;
}