/* ==========================================================================
   TAXLENZ — Site-wide iOS Glass overhaul (loaded after styles.css)
   ========================================================================== */

/* Refined tokens */
[data-theme="light"] {
    --glass-bg: linear-gradient(135deg, rgba(252,246,233,.68), rgba(252,246,233,.45));
    --glass-brd: rgba(229,216,184,.75);
    --glass-shadow: 0 20px 60px rgba(11,61,58,.12), inset 0 1px 0 rgba(255,255,255,.6);
}
[data-theme="dark"] {
    --glass-bg: linear-gradient(135deg, rgba(20,53,48,.72), rgba(12,40,37,.55));
    --glass-brd: rgba(140,190,175,.24);
    --glass-shadow: 0 20px 60px rgba(0,0,0,.55), inset 0 1px 0 rgba(230,194,94,.10);
}

/* Ambient body glow */
body::before {
    content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
    background:
      radial-gradient(700px 500px at 15% 10%, color-mix(in srgb, var(--gold) 12%, transparent), transparent 60%),
      radial-gradient(700px 500px at 85% 90%, color-mix(in srgb, var(--teal) 12%, transparent), transparent 60%),
      radial-gradient(500px 500px at 50% 50%, color-mix(in srgb, var(--maroon) 6%, transparent), transparent 70%);
    animation: bodyGlow 18s ease-in-out infinite alternate;
}
@keyframes bodyGlow {
    0% { transform: translate(0,0) scale(1); }
    100% { transform: translate(2%, -2%) scale(1.08); }
}
[data-theme="dark"] body::before { opacity: .85; }

/* Every card becomes glass */
.card, .info-card, .hero-card, .neu, .testimonial-card, .faq-item,
.profile-card, .admin-login-card, .empty-state, .post-card {
    background: var(--glass-bg) !important;
    backdrop-filter: blur(18px) saturate(180%);
    -webkit-backdrop-filter: blur(18px) saturate(180%);
    border: 1px solid var(--glass-brd) !important;
    box-shadow: var(--glass-shadow) !important;
    transition: transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s ease, border-color .3s ease;
}
.card:hover, .info-card:hover, .testimonial-card:hover, .post-card:hover {
    transform: translateY(-6px);
    border-color: color-mix(in srgb, var(--gold) 45%, var(--glass-brd)) !important;
    box-shadow: 0 30px 80px color-mix(in srgb, var(--gold) 20%, rgba(11,61,58,.2)),
                inset 0 1px 0 rgba(255,255,255,.5) !important;
}

/* Hero card */
.hero-card { border-radius: 24px !important; padding: 2rem !important; }
.hero-stat {
    background: color-mix(in srgb, var(--surface) 55%, transparent) !important;
    border: 1px solid var(--glass-brd) !important;
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border-radius: 16px !important;
}
.hero-float {
    background: var(--glass-bg) !important;
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid var(--glass-brd) !important;
    box-shadow: 0 12px 30px color-mix(in srgb, var(--gold) 22%, rgba(0,0,0,.15)) !important;
}

/* Buttons — glossy iOS */
.btn-primary {
    background: linear-gradient(135deg, var(--navy), var(--teal)) !important;
    color: #fff !important;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--primary) 28%, transparent),
                inset 0 1px 0 rgba(255,255,255,.25) !important;
    position: relative;
    overflow: hidden;
    isolation: isolate;
}
.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 26px color-mix(in srgb, var(--primary) 42%, transparent),
                inset 0 1px 0 rgba(255,255,255,.32) !important;
}
/* Contained shine sweep (stays inside the pill) */
.btn-primary::after, .nav-cta::after {
    content: "" !important; display: block !important;
    position: absolute; inset: 0; border-radius: inherit;
    background: linear-gradient(120deg, transparent 35%, rgba(255,255,255,.22) 50%, transparent 65%);
    transform: translateX(-110%); transition: transform .8s cubic-bezier(.22,.61,.36,1);
    pointer-events: none; z-index: 1;
}
.btn-primary:hover::after, .nav-cta:hover::after { transform: translateX(110%); }
.btn-primary > *, .nav-cta > * { position: relative; z-index: 2; }

.btn-accent, .btn-gold {
    background: linear-gradient(135deg, var(--gold), var(--gold-400)) !important;
    color: #2a2109 !important;
    box-shadow: 0 8px 24px color-mix(in srgb, var(--gold) 45%, transparent),
                inset 0 1px 0 rgba(255,255,255,.4) !important;
}
.btn-accent:hover, .btn-gold:hover {
    box-shadow: 0 12px 34px color-mix(in srgb, var(--gold) 60%, transparent),
                inset 0 1px 0 rgba(255,255,255,.45) !important;
    transform: translateY(-2px);
}

.btn-outline {
    background: color-mix(in srgb, var(--surface) 40%, transparent) !important;
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border: 1.5px solid var(--glass-brd) !important;
    color: var(--heading) !important;
}
.btn-outline:hover {
    background: color-mix(in srgb, var(--surface) 70%, transparent) !important;
    border-color: var(--gold) !important;
    color: var(--heading) !important;
}

/* Form inputs — glass */
.field input, .field textarea, .field select {
    background: color-mix(in srgb, var(--surface) 55%, transparent) !important;
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border: 1.5px solid var(--glass-brd) !important;
    border-radius: 12px !important;
    transition: all .3s ease;
}
.field input:focus, .field textarea:focus, .field select:focus {
    background: color-mix(in srgb, var(--surface) 88%, transparent) !important;
    border-color: var(--gold) !important;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--gold) 22%, transparent),
                0 8px 24px color-mix(in srgb, var(--primary) 12%, transparent) !important;
}

/* Chips */
.chip {
    background: color-mix(in srgb, var(--surface) 55%, transparent) !important;
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    border: 1.5px solid var(--glass-brd) !important;
}
.chip.is-active {
    background: linear-gradient(135deg, var(--navy), var(--teal)) !important;
    color: #fff !important; border-color: transparent !important;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--primary) 40%, transparent);
}

/* Eyebrow */
.section-eyebrow {
    display: inline-block; padding: .4rem 1rem; border-radius: 999px;
    background: color-mix(in srgb, var(--gold) 15%, transparent);
    border: 1px solid color-mix(in srgb, var(--gold) 35%, transparent);
    color: var(--gold-ink) !important;
    letter-spacing: .12em !important; font-size: .72rem !important;
    backdrop-filter: blur(8px);
}

/* Admin login ambient glow */
.admin-login-wrap { position: relative; overflow: hidden; }
.admin-login-wrap::before {
    content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background: radial-gradient(50% 50% at 30% 30%, color-mix(in srgb, var(--gold) 22%, transparent), transparent 60%),
                radial-gradient(50% 50% at 70% 70%, color-mix(in srgb, var(--teal) 22%, transparent), transparent 60%);
    animation: bodyGlow 14s ease-in-out infinite alternate;
}
.admin-login-card { position: relative; z-index: 2; }

/* Stats + CTA panels in dark mode */
[data-theme="dark"] .cta-band, [data-theme="dark"] .stats-band {
    background: linear-gradient(135deg, rgba(22,61,55,.85), rgba(16,48,43,.75)) !important;
    border: 1px solid rgba(212,162,42,.25);
    box-shadow: 0 30px 90px rgba(0,0,0,.5);
}

/* Testimonial avatar glow */
.testimonial-avatar {
    box-shadow: 0 6px 20px color-mix(in srgb, var(--gold) 40%, transparent),
                inset 0 1px 0 rgba(255,255,255,.3);
}

/* Scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--gold), var(--teal));
    border-radius: 999px; border: 2px solid var(--bg);
}
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, var(--gold-400), var(--teal-400)); }

/* Selection */
::selection { background: color-mix(in srgb, var(--gold) 40%, transparent); color: var(--heading); }

@media (prefers-reduced-motion: reduce) {
    body::before, .admin-login-wrap::before { animation: none !important; }
}