@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,700&family=Manrope:wght@400;500;600;700&display=swap');
@import 'tailwindcss';

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.js';

@theme {
    --font-sans: 'Manrope', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',
        'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    --font-display: 'Fraunces', Georgia, serif;
    --color-brand-400: #818cf8;
    --color-brand-500: #3b5bdb;
    --color-brand-600: #2b3f9e;
    --color-accent-cyan: #6366f1;
    --color-accent-violet: #7c3aed;
    --color-accent-fuchsia: #c026d3;
}

@layer base {
    html {
        -webkit-tap-highlight-color: transparent;
        scroll-behavior: smooth;
    }

    body {
        @apply antialiased;
        font-family: var(--font-sans);
    }

    ::selection {
        @apply bg-indigo-500/30 text-slate-900;
    }
}

@layer components {
    .app-bg {
        background-color: #070b14;
        background-image:
            radial-gradient(ellipse 80% 50% at 20% -10%, rgba(59, 91, 219, 0.28), transparent 55%),
            radial-gradient(ellipse 60% 40% at 90% 10%, rgba(192, 38, 211, 0.14), transparent 50%),
            radial-gradient(ellipse 50% 30% at 50% 100%, rgba(99, 102, 241, 0.1), transparent 55%);
    }

    .glass-card {
        @apply rounded-2xl border border-white/10 bg-slate-900/70 backdrop-blur-xl shadow-xl shadow-black/20 transition-all duration-300 ease-out;
    }

    .glass-card:hover {
        @apply -translate-y-0.5 shadow-2xl shadow-indigo-950/30 border-indigo-400/20;
    }

    .glass-card-subtle {
        @apply rounded-2xl border border-white/5 bg-slate-900/50 backdrop-blur-md transition-all duration-300;
    }

    .gradient-text {
        @apply bg-gradient-to-r from-indigo-200 via-violet-200 to-fuchsia-200 bg-clip-text text-transparent;
    }

    .gradient-border {
        position: relative;
        background: linear-gradient(135deg, rgba(59, 91, 219, 0.18), rgba(124, 58, 237, 0.12), rgba(192, 38, 211, 0.08));
    }

    .btn {
        @apply inline-flex items-center justify-center gap-2 rounded-xl px-4 py-2.5 text-sm font-semibold transition-all duration-200 active:scale-[0.98] disabled:opacity-50 disabled:pointer-events-none;
    }

    .btn-primary {
        @apply inline-flex items-center justify-center gap-2 rounded-xl px-4 py-2.5 text-sm font-semibold transition-all duration-200 active:scale-[0.98] disabled:opacity-50 disabled:pointer-events-none bg-gradient-to-r from-indigo-700 via-violet-600 to-fuchsia-600 bg-[length:200%_100%] text-white shadow-lg shadow-indigo-900/40 hover:bg-right hover:shadow-violet-800/50;
    }

    .btn-secondary {
        @apply inline-flex items-center justify-center gap-2 rounded-xl px-4 py-2.5 text-sm font-semibold transition-all duration-200 active:scale-[0.98] disabled:opacity-50 disabled:pointer-events-none border border-white/10 bg-white/5 text-slate-200 hover:bg-white/10 hover:border-white/20;
    }

    .btn-danger {
        @apply inline-flex items-center justify-center gap-2 rounded-xl px-4 py-2.5 text-sm font-semibold transition-all duration-200 active:scale-[0.98] disabled:opacity-50 disabled:pointer-events-none text-red-400 hover:bg-red-500/10 hover:text-red-300;
    }

    .btn-ghost {
        @apply inline-flex items-center justify-center gap-2 rounded-xl px-4 py-2.5 text-sm font-semibold transition-all duration-200 active:scale-[0.98] disabled:opacity-50 disabled:pointer-events-none text-slate-400 hover:text-white hover:bg-white/5;
    }

    .btn-sm {
        @apply px-3 py-1.5 text-xs rounded-lg;
    }

    .field-label {
        @apply block text-sm font-medium text-slate-300 mb-1.5;
    }

    .field-input {
        @apply w-full rounded-xl border border-white/10 bg-slate-950/80 px-4 py-2.5 text-sm text-slate-100 placeholder:text-slate-500 transition-all duration-200 focus:border-teal-500/60 focus:outline-none focus:ring-2 focus:ring-teal-500/20;
    }

    .field-select {
        @apply w-full rounded-xl border border-white/10 bg-slate-950/80 px-4 py-2.5 text-sm text-slate-100 placeholder:text-slate-500 transition-all duration-200 focus:border-teal-500/60 focus:outline-none focus:ring-2 focus:ring-teal-500/20 appearance-none bg-[length:1rem] bg-[right_0.75rem_center] bg-no-repeat pr-10;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2394a3b8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    }

    .stat-card {
        @apply rounded-2xl border border-white/10 bg-slate-900/70 backdrop-blur-xl shadow-xl shadow-black/20 relative overflow-hidden p-5 transition-transform duration-300 hover:-translate-y-0.5;
    }

    .stat-card::before {
        content: '';
        @apply absolute inset-0 opacity-0 transition-opacity duration-300;
        background: linear-gradient(135deg, rgba(11, 110, 106, 0.12), transparent 60%);
    }

    .stat-card:hover::before {
        @apply opacity-100;
    }

    .dash-stat {
        @apply relative overflow-hidden rounded-2xl border border-slate-200/80 bg-white/90 p-5 shadow-sm shadow-slate-200/60 backdrop-blur-xl transition-all duration-300 ease-out;
    }

    .dash-stat:hover {
        @apply -translate-y-1 border-indigo-300/50 shadow-md shadow-indigo-800/10;
    }

    .dash-stat-glow {
        @apply pointer-events-none absolute inset-0 opacity-90 transition-opacity duration-300;
    }

    .dash-stat:hover .dash-stat-glow {
        @apply opacity-100;
    }

    .dash-stat-label {
        @apply text-xs sm:text-sm font-medium text-slate-500 tracking-wide;
    }

    .dash-stat-value {
        @apply mt-1.5 text-2xl sm:text-3xl font-bold tabular-nums text-slate-900 tracking-tight;
    }

    .dash-stat-hint {
        @apply mt-1 text-[11px] text-slate-400;
    }

    .dash-shell {
        @apply relative;
    }

    .dash-feed {
        @apply overflow-hidden rounded-2xl border border-slate-200/80 bg-white/90 shadow-sm shadow-slate-200/50 backdrop-blur-xl;
    }

    .dash-feed-header {
        @apply flex flex-wrap items-center justify-between gap-3 border-b border-slate-100 px-4 sm:px-6 py-4;
    }

    .dash-live-pill {
        @apply inline-flex items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-semibold transition-colors duration-300;
    }

    .dash-bell {
        @apply relative inline-flex h-10 w-10 items-center justify-center rounded-xl border border-slate-200 bg-white text-slate-500 shadow-sm transition-all duration-200 hover:border-teal-300 hover:text-teal-700 hover:shadow-teal-800/10;
    }

    .dash-bell-panel {
        @apply absolute right-0 z-50 mt-2 w-80 sm:w-96 origin-top-right overflow-hidden rounded-2xl border border-slate-200 bg-white shadow-xl shadow-slate-300/40;
    }

    .dash-toast {
        @apply pointer-events-auto rounded-2xl border border-amber-200/80 bg-white/95 p-4 shadow-lg shadow-amber-900/10 backdrop-blur-xl ring-1 ring-amber-100;
    }

    .dash-row-enter {
        animation: dash-row-in 0.45s ease both;
    }

    @keyframes dash-row-in {
        from {
            opacity: 0;
            transform: translateY(-6px);
            background-color: rgba(11, 110, 106, 0.08);
        }
        to {
            opacity: 1;
            transform: translateY(0);
            background-color: transparent;
        }
    }

    [data-theme="dark"] .dash-stat {
        @apply border-white/10 bg-slate-900/70 shadow-black/20;
    }

    [data-theme="dark"] .dash-stat:hover {
        @apply border-teal-500/30 shadow-teal-900/20;
    }

    [data-theme="dark"] .dash-stat-label {
        @apply text-slate-400;
    }

    [data-theme="dark"] .dash-stat-value {
        @apply text-white;
    }

    [data-theme="dark"] .dash-feed {
        @apply border-white/10 bg-slate-900/70 shadow-black/20;
    }

    [data-theme="dark"] .dash-feed-header {
        @apply border-white/5;
    }

    [data-theme="dark"] .dash-bell {
        @apply border-white/10 bg-white/5 text-slate-300 hover:border-teal-500/40 hover:text-teal-200;
    }

    [data-theme="dark"] .dash-bell-panel {
        @apply border-white/10 bg-slate-900/95 shadow-black/40;
    }

    [data-theme="dark"] .dash-toast {
        @apply border-amber-500/30 bg-slate-900/95 shadow-black/40 ring-amber-500/20;
    }

    .nav-link {
        @apply flex items-center gap-3 rounded-xl px-3 py-2.5 text-sm font-medium transition-all duration-200;
    }

    .nav-link-active {
        @apply bg-gradient-to-r from-indigo-700/95 to-violet-700/85 text-white shadow-lg shadow-indigo-900/30;
    }

    .nav-link-inactive {
        @apply text-slate-400 hover:bg-white/5 hover:text-slate-200;
    }

    .badge {
        @apply inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium;
    }

    .badge-success {
        @apply inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium bg-emerald-500/15 text-emerald-300 ring-1 ring-emerald-500/30;
    }

    .badge-warning {
        @apply inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium bg-amber-500/15 text-amber-300 ring-1 ring-amber-500/30;
    }

    .badge-danger {
        @apply inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium bg-red-500/15 text-red-300 ring-1 ring-red-500/30;
    }

    .badge-neutral {
        @apply inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium bg-slate-500/15 text-slate-300 ring-1 ring-slate-500/30;
    }

    .badge-info {
        @apply inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium bg-teal-500/15 text-teal-200 ring-1 ring-teal-500/30;
    }

    .flash-success {
        @apply mb-4 flex items-start gap-3 rounded-xl border border-emerald-500/30 bg-emerald-500/10 px-4 py-3 text-emerald-200;
    }

    .flash-error {
        @apply mb-4 flex items-start gap-3 rounded-xl border border-red-500/30 bg-red-500/10 px-4 py-3 text-red-200;
    }

    .flash-warning {
        @apply mb-4 flex items-start gap-3 rounded-xl border border-amber-500/30 bg-amber-500/10 px-4 py-3 text-amber-200;
    }

    .table-wrap {
        @apply rounded-2xl border border-white/10 bg-slate-900/70 backdrop-blur-xl shadow-xl shadow-black/20 overflow-hidden;
    }

    .data-table {
        @apply w-full text-sm;
    }

    .data-table thead {
        @apply text-slate-400 border-b border-white/5;
    }

    .data-table th {
        @apply text-left px-4 lg:px-6 py-3 font-medium text-xs uppercase tracking-wider;
    }

    .data-table td {
        @apply px-4 lg:px-6 py-3.5;
    }

    .data-table tbody tr {
        @apply border-b border-white/5 transition-colors hover:bg-white/[0.02];
    }

    .icon-box {
        @apply flex h-10 w-10 shrink-0 items-center justify-center rounded-xl;
    }

    .icon-box-indigo {
        @apply flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-teal-500/25 to-cyan-500/10 text-teal-200 ring-1 ring-teal-500/25;
    }

    .icon-box-emerald {
        @apply flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-emerald-500/20 to-cyan-500/10 text-emerald-300 ring-1 ring-emerald-500/20;
    }

    .icon-box-amber {
        @apply flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-amber-500/20 to-orange-500/10 text-amber-300 ring-1 ring-amber-500/20;
    }

    .icon-box-red {
        @apply flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-red-500/20 to-rose-500/10 text-red-300 ring-1 ring-red-500/20;
    }

    .icon-box-violet {
        @apply flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-teal-600/25 to-teal-800/15 text-teal-100 ring-1 ring-teal-600/25;
    }

    .icon-box-cyan {
        @apply flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-cyan-500/20 to-blue-500/10 text-cyan-300 ring-1 ring-cyan-500/20;
    }

    .login-orb {
        @apply absolute rounded-full blur-3xl opacity-40 pointer-events-none;
        animation: orb-float 8s ease-in-out infinite;
    }

    .login-orb-1 {
        @apply absolute rounded-full blur-3xl opacity-40 pointer-events-none w-72 h-72 bg-teal-700 -top-20 -left-20;
        animation: orb-float 8s ease-in-out infinite;
        animation-delay: 0s;
    }

    .login-orb-2 {
        @apply absolute rounded-full blur-3xl opacity-40 pointer-events-none w-96 h-96 bg-cyan-600 top-1/3 -right-32;
        animation: orb-float 8s ease-in-out infinite;
        animation-delay: -3s;
    }

    .login-orb-3 {
        @apply absolute rounded-full blur-3xl opacity-40 pointer-events-none w-64 h-64 bg-teal-500 -bottom-16 left-1/4;
        animation: orb-float 8s ease-in-out infinite;
        animation-delay: -5s;
    }
}

@layer utilities {
    .animate-icon-pulse {
        animation: icon-pulse 2s ease-in-out infinite;
    }

    .animate-icon-float {
        animation: icon-float 3s ease-in-out infinite;
    }

    .animate-icon-spin-slow {
        animation: icon-spin 8s linear infinite;
    }

    .animate-shimmer {
        animation: shimmer 2.5s ease-in-out infinite;
    }

    .animate-fade-in {
        animation: fade-in 0.4s ease-out forwards;
    }

    .animate-slide-up {
        animation: slide-up 0.45s ease-out forwards;
    }

    .safe-bottom {
        padding-bottom: env(safe-area-inset-bottom, 0);
    }

    .safe-top {
        padding-top: env(safe-area-inset-top, 0);
    }
}

@keyframes icon-pulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.08); opacity: 0.85; }
}

@keyframes icon-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@keyframes icon-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes shimmer {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

@keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slide-up {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes orb-float {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(20px, -15px) scale(1.05); }
    66% { transform: translate(-10px, 10px) scale(0.95); }
}

@media (max-width: 767px) {
    .responsive-table thead {
        @apply hidden;
    }

    .responsive-table tbody tr {
        @apply block mb-3 rounded-xl border border-white/5 bg-slate-900/50 p-4;
    }

    .responsive-table tbody tr:last-child {
        @apply mb-0;
    }

    .responsive-table td {
        @apply flex items-start justify-between gap-4 px-0 py-2 border-none text-right;
    }

    .responsive-table td::before {
        content: attr(data-label);
        @apply text-xs font-medium uppercase tracking-wide text-slate-500 shrink-0 text-left;
    }

    .responsive-table td[data-label=""]::before,
    .responsive-table td:not([data-label])::before {
        content: none;
    }

    .responsive-table .td-actions {
        @apply justify-end pt-2 border-t border-white/5 mt-1;
    }

    .responsive-table .td-actions::before {
        @apply hidden;
    }
}

/* Laravel pagination */
nav[role="navigation"] {
    @apply flex justify-center;
}

nav[role="navigation"] span,
nav[role="navigation"] a {
    @apply inline-flex items-center justify-center min-w-[2.25rem] h-9 px-2 mx-0.5 rounded-lg text-sm transition-colors;
}

nav[role="navigation"] a {
    @apply border border-white/10 bg-white/5 text-slate-300 hover:bg-white/10 hover:text-white;
}

nav[role="navigation"] span[aria-current="page"] span,
nav[role="navigation"] .bg-white {
    @apply bg-gradient-to-r from-teal-700 to-cyan-700 text-white border-0 font-medium;
}

nav[role="navigation"] span[aria-disabled="true"] span {
    @apply text-slate-600 border border-white/5 bg-transparent;
}

/* Theme tokens & light mode */
:root,
[data-theme="dark"] {
    color-scheme: dark;
    --text-primary: #f1f5f9;
    --text-muted: #94a3b8;
    --border-themed: rgba(255, 255, 255, 0.1);
    --bg-themed-header: rgba(2, 6, 23, 0.8);
    --bg-themed-subtle: rgba(255, 255, 255, 0.05);
    --bg-themed-hover: rgba(255, 255, 255, 0.1);
}

[data-theme="light"] {
    color-scheme: light;
    --text-primary: #0f172a;
    --text-muted: #334155;
    --border-themed: rgba(15, 23, 42, 0.12);
    --bg-themed-header: rgba(247, 248, 252, 0.92);
    --bg-themed-subtle: rgba(59, 91, 219, 0.05);
    --bg-themed-hover: rgba(59, 91, 219, 0.1);
}

.text-themed { color: var(--text-primary); }
.text-themed-muted { color: var(--text-muted); }
.border-themed { border-color: var(--border-themed); }
.bg-themed-header { background-color: var(--bg-themed-header); }
.bg-themed-subtle { background-color: var(--bg-themed-subtle); }
.bg-themed-hover:hover { background-color: var(--bg-themed-hover); }

[data-theme="light"] body,
[data-theme="light"] .app-bg {
    background-color: #f7f8fc;
    background-image:
        radial-gradient(ellipse 80% 50% at 20% -10%, rgba(59, 91, 219, 0.12), transparent 55%),
        radial-gradient(ellipse 60% 40% at 90% 10%, rgba(192, 38, 211, 0.08), transparent 50%),
        radial-gradient(ellipse 50% 30% at 50% 100%, rgba(99, 102, 241, 0.07), transparent 55%);
}

[data-theme="light"] .glass-card {
    @apply bg-white/90 border-slate-200/80 shadow-slate-200/50;
}

[data-theme="light"] .glass-card:hover {
    @apply shadow-indigo-200/40 border-indigo-200/70;
}

[data-theme="light"] .glass-card-subtle {
    @apply bg-white/70 border-slate-200/60;
}

[data-theme="light"] .table-wrap {
    @apply bg-white/90 border-slate-200/80 shadow-slate-200/40;
}

[data-theme="light"] .field-input,
[data-theme="light"] .field-select {
    @apply bg-white border-slate-200 text-slate-900 placeholder:text-slate-400;
}

[data-theme="light"] .field-label {
    @apply text-slate-700;
}

[data-theme="light"] .data-table thead {
    @apply text-slate-600 border-slate-200;
}

[data-theme="light"] .data-table tbody tr {
    @apply border-slate-100 hover:bg-slate-50;
}

[data-theme="light"] .responsive-table tbody tr {
    @apply bg-white border-slate-200;
}

[data-theme="light"] .nav-link-inactive {
    @apply text-slate-600 hover:bg-slate-100 hover:text-slate-900;
}

[data-theme="light"] aside {
    @apply bg-white/95 border-slate-200 lg:bg-white/80;
}

[data-theme="light"] .gradient-text {
    @apply from-indigo-700 via-violet-600 to-fuchsia-600;
}

[data-theme="light"] .btn-primary {
    @apply from-indigo-700 via-violet-600 to-fuchsia-600 shadow-indigo-800/25;
}

[data-theme="light"] .nav-link-active {
    @apply from-indigo-600 to-violet-600 shadow-indigo-800/20;
}

[data-theme="light"] .flash-success {
    @apply text-emerald-800 border-emerald-300/60 bg-emerald-50;
}

[data-theme="light"] .flash-error {
    @apply text-red-800 border-red-300/60 bg-red-50;
}

[data-theme="light"] .flash-warning {
    @apply text-amber-900 border-amber-300/60 bg-amber-50;
}

[data-theme="light"] .login-orb {
    @apply opacity-25;
}

[data-theme="light"] nav[role="navigation"] a {
    @apply border-slate-200 bg-white text-slate-700 hover:bg-slate-50 hover:text-slate-900;
}

/*
 * Light-mode contrast: dark-first utilities (slate-200/300/400, cyan-300, etc.)
 * are nearly invisible on white. Raw colors so these rules stay unlayered and win.
 */
html[data-theme="light"] {
    color: var(--text-primary);
}

html[data-theme="light"] .text-themed-muted {
    color: #334155;
}

html[data-theme="light"] .btn-secondary {
    color: #1e293b;
    background-color: #f1f5f9;
    border-color: #cbd5e1;
}

html[data-theme="light"] .btn-secondary:hover {
    color: #0f172a;
    background-color: #e2e8f0;
    border-color: #94a3b8;
}

html[data-theme="light"] .btn-ghost {
    color: #334155;
}

html[data-theme="light"] .btn-ghost:hover {
    color: #0f172a;
    background-color: #f1f5f9;
}

html[data-theme="light"] .btn-danger {
    color: #b91c1c;
}

html[data-theme="light"] .btn-danger:hover {
    color: #991b1b;
    background-color: rgb(254 226 226 / 0.7);
}

html[data-theme="light"] .nav-link-inactive,
html[data-theme="light"] .nav-link-inactive span {
    color: #334155;
}

html[data-theme="light"] .nav-link-inactive:hover,
html[data-theme="light"] .nav-link-inactive:hover span {
    color: #0f172a;
}

html[data-theme="light"] .nav-link-inactive:hover {
    background-color: #f1f5f9;
}

html[data-theme="light"] .dash-stat-label,
html[data-theme="light"] .dash-stat-hint {
    color: #475569;
}

html[data-theme="light"] .field-label {
    color: #334155;
}

html[data-theme="light"] .data-table thead,
html[data-theme="light"] .data-table th {
    color: #475569;
}

html[data-theme="light"] aside .text-slate-200,
html[data-theme="light"] .text-slate-100,
html[data-theme="light"] .text-slate-200,
html[data-theme="light"] .text-slate-300 {
    color: #1e293b;
}

html[data-theme="light"] .text-slate-400,
html[data-theme="light"] .text-slate-500 {
    color: #475569;
}

html[data-theme="light"] .text-cyan-200,
html[data-theme="light"] .text-cyan-300,
html[data-theme="light"] a.text-cyan-300,
html[data-theme="light"] .hover\:text-cyan-300:hover {
    color: #0e7490;
}

html[data-theme="light"] .text-teal-100,
html[data-theme="light"] .text-teal-200,
html[data-theme="light"] .text-teal-300 {
    color: #0f766e;
}

html[data-theme="light"] .text-violet-200,
html[data-theme="light"] .text-violet-300 {
    color: #6d28d9;
}

html[data-theme="light"] .text-indigo-200,
html[data-theme="light"] .text-indigo-300 {
    color: #4338ca;
}

html[data-theme="light"] .text-emerald-200,
html[data-theme="light"] .text-emerald-300 {
    color: #047857;
}

html[data-theme="light"] .text-amber-200,
html[data-theme="light"] .text-amber-300 {
    color: #b45309;
}

html[data-theme="light"] .text-red-300,
html[data-theme="light"] .text-red-400,
html[data-theme="light"] .text-rose-400 {
    color: #b91c1c;
}

html[data-theme="light"] .icon-box-indigo,
html[data-theme="light"] .icon-box-violet,
html[data-theme="light"] .icon-box-cyan {
    color: #1d4ed8;
}

html[data-theme="light"] .icon-box-emerald {
    color: #047857;
}

html[data-theme="light"] .icon-box-amber {
    color: #b45309;
}

html[data-theme="light"] .icon-box-red {
    color: #b91c1c;
}

html[data-theme="light"] .badge-success {
    color: #047857;
    background-color: #ecfdf5;
}

html[data-theme="light"] .badge-warning {
    color: #b45309;
    background-color: #fffbeb;
}

html[data-theme="light"] .badge-danger {
    color: #b91c1c;
    background-color: #fef2f2;
}

html[data-theme="light"] .badge-neutral {
    color: #334155;
    background-color: #f1f5f9;
}

html[data-theme="light"] .badge-info {
    color: #0f766e;
    background-color: #f0fdfa;
}

html[data-theme="light"] nav[role="navigation"] span[aria-disabled="true"] span {
    color: #64748b;
}