/* ==========================================================================
   REDE ZEBU — CLEAN THEME PREMIUM (ADR-0014)
   Design limpo, sofisticado, moderno, contraste cristalino (WCAG AAA).
   ========================================================================== */

:root {
    --bg-canvas: #f8fafc;
    --surface-card: #ffffff;
    --surface-muted: #f1f5f9;
    --border-light: #e2e8f0;
    --border-subtle: #cbd5e1;
    --text-heading: #0f172a;
    --text-body: #334155;
    --text-muted: #64748b;
    --brand-emerald: #059669;
    --brand-emerald-dark: #047857;
    --brand-emerald-light: #ecfdf5;
}

/* Canvas & Global Typography */
html, body {
    background-color: var(--bg-canvas) !important;
    color: var(--text-body) !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Scrollbar Clean */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: #f1f5f9 !important;
}
::-webkit-scrollbar-thumb {
    background: #cbd5e1 !important;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #94a3b8 !important;
}

/* Surface containers (Cards, Tables, Panels - Light Theme) */
.bg-surface-950,
.bg-surface-950\/60,
.bg-slate-950:not(footer):not(.dark-card):not(.dark-surface):not([class*="from-"]):not(.text-white),
.bg-slate-950\/50:not(footer):not(.dark-card):not(.dark-surface):not([class*="from-"]),
.bg-slate-950\/60:not(footer):not(.dark-card):not(.dark-surface):not([class*="from-"]),
.bg-slate-950\/70:not(footer):not(.dark-card):not(.dark-surface):not([class*="from-"]),
.bg-slate-950\/80:not(footer):not(.dark-card):not(.dark-surface):not([class*="from-"]),
.bg-slate-950\/90:not(footer):not(.dark-card):not(.dark-surface):not([class*="from-"]),
body.bg-surface-950,
main.bg-surface-950 {
    background-color: var(--bg-canvas) !important;
}

/* Sub-containers inside cards */
.bg-surface-900 div.bg-slate-950:not(.dark-card):not(.text-white),
.bg-surface-900 div.bg-slate-950\/70:not(.dark-card),
.bg-surface-900 div.bg-slate-950\/60:not(.dark-card),
.bg-surface-900 div.bg-slate-950\/50:not(.dark-card),
div.bg-slate-950\/70:not(.dark-card),
div.bg-slate-950\/60:not(.dark-card),
div.bg-slate-950\/50:not(.dark-card) {
    background-color: #f8fafc !important;
    border-color: #e2e8f0 !important;
}

/* Ensure labels inside cards have high contrast */
label,
.bg-surface-900 label {
    color: #1e293b !important;
    font-weight: 600 !important;
}

/* Level indicator spans inside level boxes */
div[class*="bg-slate-950"] span.font-mono,
div.bg-slate-50 span.font-mono,
.level-badge {
    color: #0f172a !important;
    font-weight: 700 !important;
}

.level-input {
    background-color: #ffffff !important;
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
    font-weight: 700 !important;
}
.level-input:focus {
    border-color: #059669 !important;
    box-shadow: 0 0 0 2px rgba(5, 150, 105, 0.2) !important;
}

.bg-surface-900,
.bg-surface-900\/80,
.bg-surface-900\/90,
.bg-surface-900\/95,
.bg-slate-900:not(.dark-card):not(.dark-surface):not([class*="from-"]):not(.text-white),
.bg-slate-900\/80:not(.dark-card):not([class*="from-"]),
.bg-slate-900\/90:not(.dark-card):not([class*="from-"]),
.bg-slate-900\/95:not(.dark-card):not([class*="from-"]),
aside.bg-surface-900,
header.bg-surface-900,
nav.bg-surface-900,
div.bg-surface-900:not(.dark-card):not(.dark-surface) {
    background-color: var(--surface-card) !important;
}

.bg-surface-850,
.bg-surface-850\/50,
.bg-surface-800 {
    background-color: var(--surface-muted) !important;
}

/* Non-interactive slate-800 elements */
div.bg-slate-800:not(button):not(a),
section.bg-slate-800 {
    background-color: var(--surface-card) !important;
}

/* Borders Clean */
.border-slate-800,
.border-slate-800\/80,
.border-slate-800\/60,
.border-slate-700,
.border-slate-700\/60,
.border-slate-600,
.border-slate-900,
.divide-slate-800 > :not([hidden]) ~ :not([hidden]),
.divide-slate-700 > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--border-light) !important;
}

/* Clean Elevation Shadows */
.bg-surface-900,
.bg-slate-900,
.rounded-2xl.border,
.rounded-xl.border {
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.04), 0 1px 2px -1px rgb(0 0 0 / 0.02);
}

/* ==========================================================================
   BUTTONS & ACTION CONTROLS (CRITICAL CONTRAST FIX)
   ========================================================================== */

/* Primary Action Buttons (Emerald) */
button.bg-emerald-600,
a.bg-emerald-600,
button.bg-emerald-500,
a.bg-emerald-500,
button.bg-emerald-700,
a.bg-emerald-700,
button[type="submit"]:not(.bg-slate-800):not(.bg-slate-700):not(.text-rose-400):not(.bg-rose-600):not(.bg-sky-600):not(.bg-indigo-600):not(.text-slate-400) {
    background-color: #059669 !important;
    background-image: none !important;
    color: #ffffff !important;
    border: 1px solid #047857 !important;
    box-shadow: 0 1px 2px 0 rgba(5, 150, 105, 0.25) !important;
}

button.bg-emerald-600:hover,
a.bg-emerald-600:hover,
button.bg-emerald-500:hover,
a.bg-emerald-500:hover,
button[type="submit"]:not(.bg-slate-800):not(.bg-slate-700):not(.text-rose-400):not(.bg-rose-600):not(.bg-sky-600):not(.bg-indigo-600):not(.text-slate-400):hover {
    background-color: #047857 !important;
    color: #ffffff !important;
    border-color: #065f46 !important;
}

button.bg-emerald-600 *,
a.bg-emerald-600 *,
button.bg-emerald-500 *,
a.bg-emerald-500 *,
button[type="submit"]:not(.bg-slate-800):not(.bg-slate-700):not(.text-rose-400):not(.bg-rose-600):not(.bg-sky-600):not(.bg-indigo-600):not(.text-slate-400) * {
    color: #ffffff !important;
    stroke: #ffffff !important;
}

/* Secondary & Neutral Buttons & Action Links (Light Mode) */
button.bg-slate-800:not(.text-white),
a.bg-slate-800:not(.text-white),
button.bg-slate-700:not(.text-white),
a.bg-slate-700:not(.text-white),
button.bg-slate-900:not(.text-white),
a.bg-slate-900:not(.text-white),
button.bg-surface-800,
a.bg-surface-800,
a.bg-surface-900.border {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}

button.bg-slate-800:not(.text-white):hover,
a.bg-slate-800:not(.text-white):hover,
button.bg-slate-700:not(.text-white):hover,
a.bg-slate-700:not(.text-white):hover,
button.bg-slate-900:not(.text-white):hover,
a.bg-slate-900:not(.text-white):hover,
button.bg-surface-800:hover,
a.bg-surface-800:hover,
a.bg-surface-900.border:hover {
    background-color: #f8fafc !important;
    border-color: #94a3b8 !important;
    color: #020617 !important;
}

button.bg-slate-800:not(.text-white):not(.text-emerald-400):not(.text-rose-400) *,
a.bg-slate-800:not(.text-white):not(.text-emerald-400):not(.text-rose-400) *,
button.bg-slate-700:not(.text-white) *,
a.bg-slate-700:not(.text-white) *,
button.bg-slate-900:not(.text-white) *,
a.bg-slate-900:not(.text-white) * {
    color: #0f172a !important;
    stroke: #475569 !important;
}

/* Intentional Dark Action Buttons with Pure White Contrast */
button.bg-slate-900.text-white,
a.bg-slate-900.text-white,
button.bg-slate-800.text-white,
a.bg-slate-800.text-white,
.btn-dark {
    background-color: #0f172a !important;
    color: #ffffff !important;
    border: 1px solid #1e293b !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2) !important;
}

button.bg-slate-900.text-white:hover,
a.bg-slate-900.text-white:hover,
button.bg-slate-800.text-white:hover,
a.bg-slate-800.text-white:hover,
.btn-dark:hover {
    background-color: #1e293b !important;
    color: #ffffff !important;
    border-color: #334155 !important;
}

button.bg-slate-900.text-white *,
a.bg-slate-900.text-white *,
button.bg-slate-800.text-white *,
a.bg-slate-800.text-white *,
.btn-dark * {
    color: #ffffff !important;
    stroke: #ffffff !important;
}

/* Specific Secondary Action buttons with colored text */
button.bg-slate-800.text-emerald-400,
a.bg-slate-800.text-emerald-400 {
    color: #047857 !important;
    border-color: #a7f3d0 !important;
}
button.bg-slate-800.text-emerald-400 *,
a.bg-slate-800.text-emerald-400 * {
    color: #047857 !important;
    stroke: #047857 !important;
}

/* Outlined Action Buttons & Links */
a.border.rounded-lg,
a.border.rounded-xl,
button.border.rounded-lg,
button.border.rounded-xl {
    border-color: #cbd5e1 !important;
    background-color: #ffffff !important;
    color: #334155 !important;
    white-space: nowrap !important;
}
a.border.rounded-lg:hover,
a.border.rounded-xl:hover,
button.border.rounded-lg:hover,
button.border.rounded-xl:hover {
    background-color: #f8fafc !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
}

/* ==========================================================================
   BUTTONS, BADGES & TABLE ACTION CELLS (PREVENT WORD WRAPPING)
   ========================================================================== */

button,
a.rounded-lg,
a.rounded-xl,
a.rounded-md,
a.rounded-full,
a.px-3,
a.px-4,
a.px-2\.5,
a[class*="rounded"],
span[class*="rounded"],
.badge {
    white-space: nowrap !important;
    flex-shrink: 0;
}

td a.rounded-lg,
td a.rounded-xl,
td a.rounded-md,
td a[class*="rounded"],
td button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
}

th.text-right,
td.text-right,
th.whitespace-nowrap,
td.whitespace-nowrap {
    white-space: nowrap !important;
    width: 1%;
}

/* Disabled buttons */
button:disabled,
button.cursor-not-allowed,
a.cursor-not-allowed {
    background-color: #f1f5f9 !important;
    color: #94a3b8 !important;
    border-color: #e2e8f0 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
}
button:disabled *,
button.cursor-not-allowed * {
    color: #94a3b8 !important;
}

/* Danger / Cancel Buttons */
button.bg-rose-600,
a.bg-rose-600 {
    background-color: #dc2626 !important;
    color: #ffffff !important;
    border: 1px solid #b91c1c !important;
}
button.bg-rose-600:hover,
a.bg-rose-600:hover {
    background-color: #b91c1c !important;
}
button.text-rose-400 {
    color: #be123c !important;
}
button.text-rose-400:hover {
    background-color: #fff1f2 !important;
    color: #9f1239 !important;
}

/* ==========================================================================
   STATUS BADGES & PILLS
   ========================================================================== */

/* Neutral Status Badges */
span.bg-slate-800,
span.bg-slate-700,
span.bg-slate-900,
span.bg-surface-800 {
    background-color: #f1f5f9 !important;
    color: #475569 !important;
    border: 1px solid #e2e8f0 !important;
}
span.bg-slate-800 *,
span.bg-slate-700 *,
span.bg-slate-900 * {
    color: #475569 !important;
}

/* Colored Status Badges */
.bg-emerald-500\/10,
.bg-emerald-500\/15,
.bg-emerald-500\/20,
.bg-emerald-500\/25,
.bg-emerald-500\/30 {
    background-color: #ecfdf5 !important;
    color: #047857 !important;
    border-color: #a7f3d0 !important;
}
.bg-emerald-500\/10 *,
.bg-emerald-500\/15 *,
.bg-emerald-500\/20 * {
    color: #047857 !important;
}

.bg-amber-500\/10,
.bg-amber-500\/15,
.bg-amber-500\/20,
.bg-amber-500\/25 {
    background-color: #fffbeb !important;
    color: #b45309 !important;
    border-color: #fde68a !important;
}
.bg-amber-500\/10 *,
.bg-amber-500\/15 *,
.bg-amber-500\/20 * {
    color: #b45309 !important;
}

.bg-blue-500\/10,
.bg-blue-500\/15,
.bg-blue-500\/20,
.bg-sky-500\/10,
.bg-sky-500\/15,
.bg-sky-500\/20 {
    background-color: #eff6ff !important;
    color: #1d4ed8 !important;
    border-color: #bfdbfe !important;
}
.bg-blue-500\/10 *,
.bg-blue-500\/15 *,
.bg-sky-500\/10 * {
    color: #1d4ed8 !important;
}

.bg-rose-500\/10,
.bg-rose-500\/15,
.bg-rose-500\/20,
.bg-red-500\/10,
.bg-red-500\/15,
.bg-red-500\/20 {
    background-color: #fff1f2 !important;
    color: #be123c !important;
    border-color: #fecdd3 !important;
}
.bg-rose-500\/10 *,
.bg-rose-500\/15 *,
.bg-red-500\/10 * {
    color: #be123c !important;
}

/* ==========================================================================
   TYPOGRAPHY & CONTRAST OVERRIDES (LIGHT SURFACES)
   ========================================================================== */

/* Headings and Titles (White in Dark -> Slate-900 in Clean ONLY on Light Containers) */
h1.text-white:not(.dark *):not([data-theme="dark"] *):not(.dark-surface *):not(.dark-card *):not([class*="from-"] *):not(footer *):not(.bg-slate-900 *):not(.bg-slate-950 *),
h2.text-white:not(.dark *):not([data-theme="dark"] *):not(.dark-surface *):not(.dark-card *):not([class*="from-"] *):not(footer *):not(.bg-slate-900 *):not(.bg-slate-950 *),
h3.text-white:not(.dark *):not([data-theme="dark"] *):not(.dark-surface *):not(.dark-card *):not([class*="from-"] *):not(footer *):not(.bg-slate-900 *):not(.bg-slate-950 *),
h4.text-white:not(.dark *):not([data-theme="dark"] *):not(.dark-surface *):not(.dark-card *):not([class*="from-"] *):not(footer *):not(.bg-slate-900 *):not(.bg-slate-950 *),
p.text-white:not(.dark *):not([data-theme="dark"] *):not(.dark-surface *):not(.dark-card *):not([class*="from-"] *):not(footer *):not(.bg-slate-900 *):not(.bg-slate-950 *),
td.text-white:not(.dark *):not([data-theme="dark"] *):not(.dark-surface *):not(.dark-card *):not([class*="from-"] *):not(footer *):not(.bg-slate-900 *):not(.bg-slate-950 *),
strong.text-white:not(.dark *):not([data-theme="dark"] *):not(.dark-surface *):not(.dark-card *):not([class*="from-"] *):not(footer *):not(.bg-slate-900 *):not(.bg-slate-950 *),
span.text-white:not(.bg-emerald-600 *):not(.bg-emerald-500 *):not(button *):not(a.bg-emerald-600 *):not(.badge *):not(.dark *):not([data-theme="dark"] *):not(.dark-surface *):not(.dark-card *):not([class*="from-"] *):not(footer *):not(.bg-slate-900 *):not(.bg-slate-950 *),
div.text-white:not(.bg-emerald-600 *):not(.bg-emerald-500 *):not(button *):not(a.bg-emerald-600 *):not(.dark *):not([data-theme="dark"] *):not(.dark-surface *):not(.dark-card *):not([class*="from-"] *):not(footer *):not(.bg-slate-900 *):not(.bg-slate-950 *) {
    color: var(--text-heading) !important;
}

/* Typography Text Colors (High Contrast - Default Light Surfaces) */
.text-slate-100 {
    color: var(--text-heading) !important;
}
.text-slate-200 {
    color: #1e293b !important;
}
.text-slate-300 {
    color: var(--text-body) !important;
}
.text-slate-400 {
    color: var(--text-muted) !important;
}
.text-slate-500 {
    color: #64748b !important;
}

/* Accent Colors Mapped for Light Backgrounds */
.text-emerald-400,
.text-emerald-300 {
    color: #047857 !important;
}
.text-emerald-500 {
    color: #059669 !important;
}
.text-amber-400,
.text-amber-300 {
    color: #b45309 !important;
}
.text-rose-400,
.text-rose-300,
.text-red-400,
.text-red-300 {
    color: #be123c !important;
}
.text-blue-400,
.text-blue-300 {
    color: #1d4ed8 !important;
}
.text-sky-400,
.text-sky-300 {
    color: #0284c7 !important;
}
.text-indigo-400,
.text-indigo-300 {
    color: #4338ca !important;
}
.text-purple-400 {
    color: #7e22ce !important;
}

/* Hover link fixes (prevent turning white on white) */
.hover\:text-white:hover {
    color: var(--text-heading) !important;
}
.hover\:text-slate-100:hover,
.hover\:text-slate-200:hover {
    color: var(--text-heading) !important;
}
.hover\:text-emerald-400:hover {
    color: #047857 !important;
}
.hover\:text-blue-400:hover {
    color: #1d4ed8 !important;
}

/* ==========================================================================
   DARK CONTAINERS & DARK BACKGROUNDS (CRYSTAL WCAG AAA CONTRAST)
   Guarantees that ANY dark surface, dark gradient, dark card, footer, or dark
   badge preserves luminous, crystal-clear typography and never blends fonts.
   ========================================================================== */

/* Dark Container Root Elements - Preserve Dark Background */
.dark-card,
.dark-surface,
.dark-panel,
.bg-slate-900.text-white,
div.bg-slate-900.text-white,
section.bg-slate-900.text-white,
div.bg-slate-900[class*="border-slate-800"],
div.bg-slate-950[class*="border-slate-800"] {
    background-color: #0f172a !important;
    color: #f8fafc !important;
}

.bg-slate-950.text-white,
div.bg-slate-950.text-white,
section.bg-slate-950.text-white,
footer.bg-slate-950,
footer[class*="bg-slate-"] {
    background-color: #020617 !important;
    color: #94a3b8 !important;
    border-color: #1e293b !important;
}

/* Headings and Titles inside Dark Containers */
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) :is(h1, h2, h3, h4, h5, h6, .text-white, h1.text-white, h2.text-white, h3.text-white, h4.text-white, p.text-white, td.text-white, strong.text-white, span.text-white, div.text-white, a.text-white, strong, b) {
    color: #ffffff !important;
}

/* High Contrast Slate Scales inside Dark Containers */
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) .text-slate-50 {
    color: #f8fafc !important;
}
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) .text-slate-100 {
    color: #f1f5f9 !important;
}
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) .text-slate-200 {
    color: #e2e8f0 !important;
}
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) .text-slate-300 {
    color: #cbd5e1 !important;
}
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) .text-slate-400 {
    color: #94a3b8 !important;
}
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) .text-slate-500 {
    color: #64748b !important;
}

/* Luminous Emerald Highlights inside Dark Containers */
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) :is(.text-emerald-400, .text-emerald-300) {
    color: #34d399 !important;
}
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) .text-emerald-500 {
    color: #10b981 !important;
}
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) :is(.text-emerald-200, .text-emerald-100) {
    color: #a7f3d0 !important;
}

/* Luminous Amber inside Dark Containers */
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) :is(.text-amber-400, .text-amber-300) {
    color: #fbbf24 !important;
}

/* Luminous Rose & Red inside Dark Containers */
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) :is(.text-rose-400, .text-rose-300, .text-red-400, .text-red-300) {
    color: #fb7185 !important;
}

/* Luminous Blue & Sky inside Dark Containers */
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) :is(.text-blue-400, .text-blue-300, .text-sky-400, .text-sky-300) {
    color: #38bdf8 !important;
}

/* Hover fixes inside Dark Containers */
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) .hover\:text-white:hover {
    color: #ffffff !important;
}
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white, div.bg-slate-900[class*="border-slate-800"], div.bg-slate-950[class*="border-slate-800"]) .hover\:text-emerald-400:hover {
    color: #34d399 !important;
}

/* Borders inside Dark Containers */
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"], .bg-slate-900.text-white, .bg-slate-950.text-white) :is(.border-slate-800, .border-slate-700) {
    border-color: #334155 !important;
}

/* Sub-containers inside Dark Containers */
:is(.dark, [data-theme="dark"], .dark-surface, .dark-card, .dark-panel, footer.bg-slate-950, footer[class*="bg-slate-"], [class*="from-slate-9"], [class*="from-slate-8"], [class*="from-emerald-9"], [class*="from-brand-9"]) :is(.bg-slate-800\/80, .bg-slate-800\/60, .bg-slate-800\/50, .bg-slate-900\/80, .bg-slate-900\/50, .bg-slate-950\/80, .bg-slate-950\/60) {
    background-color: rgba(15, 23, 42, 0.75) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: #f8fafc !important;
}

/* Footer Links Contrast */
footer.bg-slate-950 a,
footer[class*="bg-slate-"] a {
    color: #94a3b8 !important;
}
footer.bg-slate-950 a:hover,
footer[class*="bg-slate-"] a:hover {
    color: #ffffff !important;
}
footer.bg-slate-950 a.text-white,
footer[class*="bg-slate-"] a.text-white {
    color: #ffffff !important;
}
footer.bg-slate-950 a.text-white:hover,
footer[class*="bg-slate-"] a.text-white:hover {
    color: #34d399 !important;
}

/* ==========================================================================
   INPUTS, SELECTS, TABLES, AND CARDS
   ========================================================================== */

/* Inputs, Selects & Textareas */
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
select,
textarea {
    background-color: #ffffff !important;
    border-color: #cbd5e1 !important;
    color: var(--text-heading) !important;
}
input::placeholder,
textarea::placeholder {
    color: #94a3b8 !important;
}
input:focus,
select:focus,
textarea:focus {
    border-color: var(--brand-emerald) !important;
    box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.15) !important;
}

/* Table Headers & Rows */
thead.bg-surface-850\/50,
thead {
    background-color: #f8fafc !important;
    color: #64748b !important;
    border-bottom: 1px solid var(--border-light) !important;
}
tbody tr:hover,
tr.hover\:bg-slate-800\/40:hover,
tr.hover\:bg-slate-800\/30:hover {
    background-color: #f8fafc !important;
}

/* Navigation items hover & active */
.hover\:bg-slate-800\/60:hover,
.hover\:bg-slate-800\/40:hover,
.hover\:bg-slate-800\/30:hover,
.hover\:bg-slate-800\/50:hover,
.hover\:bg-slate-800:hover,
.hover\:bg-slate-700:hover {
    background-color: #f1f5f9 !important;
    color: var(--text-heading) !important;
}

a.bg-emerald-500\/15,
a.bg-emerald-500\/20 {
    background-color: #ecfdf5 !important;
    color: #047857 !important;
    border-color: #a7f3d0 !important;
}

/* ==========================================================================
   CARDS & TREE EXPLORER
   ========================================================================== */

/* Feature / Highlight Cards (Network Tree Focus, Policies) */
.from-emerald-950\/40,
.from-emerald-950\/50 {
    background: linear-gradient(135deg, #ecfdf5 0%, #ffffff 40%, #ffffff 100%) !important;
    border-color: #a7f3d0 !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Upstream Tree Connector Line & Bullets */
.before\:bg-slate-800::before {
    background-color: #cbd5e1 !important;
}
span.bg-slate-900.border-emerald-500 {
    background-color: #ffffff !important;
}

/* Welcome Dashboard Banner Clean Premium */
.bg-gradient-to-r.from-emerald-950\/60 {
    background: linear-gradient(135deg, #047857 0%, #059669 50%, #0f766e 100%) !important;
    border-color: rgba(5, 150, 105, 0.3) !important;
}
.bg-gradient-to-r.from-emerald-950\/60 h1,
.bg-gradient-to-r.from-emerald-950\/60 h2,
.bg-gradient-to-r.from-emerald-950\/60 h3,
.bg-gradient-to-r.from-emerald-950\/60 p,
.bg-gradient-to-r.from-emerald-950\/60 span,
.bg-gradient-to-r.from-emerald-950\/60 div {
    color: #ffffff !important;
}

/* ==========================================================================
   MOBILE RESPONSIVENESS & TOUCH OPTIMIZATION
   ========================================================================== */
@media (max-width: 1023px) {
    /* Touch target comfort */
    button, a {
        touch-action: manipulation;
    }

    /* Prevent awkward horizontal scroll on body */
    body {
        overflow-x: hidden;
    }

    /* Smooth touch scrolling for horizontal tables */
    .overflow-x-auto {
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
    }

    /* Cards spacing on mobile */
    .p-6, .p-8 {
        padding: 1.25rem !important;
    }
}

@media (max-width: 640px) {
    /* Mobile drawer smooth shadow & backdrop */
    #mobile-sidebar,
    #consumer-mobile-sidebar,
    #partner-mobile-sidebar {
        box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.25) !important;
    }

    /* Ensure text in tight badges doesn't clip */
    .whitespace-nowrap {
        white-space: nowrap !important;
    }
}