/* ── Yahnova theme tokens + dark-mode remaps ──────────────────────────────── */
:root {
    --ndl-page: #f8fafc;
    --ndl-surface: #ffffff;
    --ndl-surface-2: #fafbfc;
    --ndl-surface-hover: #f8fafc;
    --ndl-surface-muted: #f9fafb;
    --ndl-text: #111827;
    --ndl-text-secondary: #374151;
    --ndl-text-muted: #6b7280;
    --ndl-text-subtle: #9ca3af;
    --ndl-text-faint: #d1d5db;
    --ndl-border: #e5e7eb;
    --ndl-border-subtle: #f1f5f9;
    --ndl-input-bg: #ffffff;
    --ndl-input-border: #e5e7eb;
    --ndl-accent: #3b82f6;
    --ndl-accent-text: #1e40af;
    --ndl-accent-soft: #eff6ff;
    --ndl-accent-ring: rgba(59, 130, 246, 0.12);
    --ndl-scrollbar: #cbd5e1;
    --ndl-scrollbar-track: #f8fafc;
    --ndl-mobile-bar: rgba(255, 255, 255, 0.97);
    --ndl-dt-processing: rgba(255, 255, 255, 0.92);
    --ndl-theme-color: #2563eb;

    --ndl-badge-paid-bg: #dcfce7;
    --ndl-badge-paid-fg: #166534;
    --ndl-badge-partial-bg: #fef9c3;
    --ndl-badge-partial-fg: #854d0e;
    --ndl-badge-unpaid-bg: #fee2e2;
    --ndl-badge-unpaid-fg: #991b1b;
    --ndl-badge-overdue-bg: #fce7f3;
    --ndl-badge-overdue-fg: #9d174d;
    --ndl-badge-draft-bg: #f3f4f6;
    --ndl-badge-draft-fg: #4b5563;
    --ndl-badge-sent-bg: #dbeafe;
    --ndl-badge-sent-fg: #1e40af;
    --ndl-badge-void-bg: #f3f4f6;
    --ndl-badge-void-fg: #9ca3af;
    --ndl-badge-approved-bg: #d1fae5;
    --ndl-badge-approved-fg: #065f46;
    --ndl-badge-pending-bg: #fef3c7;
    --ndl-badge-pending-fg: #92400e;
}

html { color-scheme: light; }

html[data-theme="dark"] {
    color-scheme: dark;
    --ndl-page: #0f172a;
    --ndl-surface: #1e293b;
    --ndl-surface-2: #1a2438;
    --ndl-surface-hover: #243044;
    --ndl-surface-muted: #243044;
    --ndl-text: #f1f5f9;
    --ndl-text-secondary: #e2e8f0;
    --ndl-text-muted: #cbd5e1;
    --ndl-text-subtle: #94a3b8;
    --ndl-text-faint: #94a3b8;
    --ndl-border: #334155;
    --ndl-border-subtle: #334155;
    --ndl-input-bg: #1e293b;
    --ndl-input-border: #475569;
    --ndl-accent: #60a5fa;
    --ndl-accent-text: #93c5fd;
    --ndl-accent-soft: #1e3a5f;
    --ndl-accent-ring: rgba(96, 165, 250, 0.22);
    --ndl-scrollbar: #475569;
    --ndl-scrollbar-track: #0f172a;
    --ndl-mobile-bar: rgba(15, 23, 42, 0.97);
    --ndl-dt-processing: rgba(30, 41, 59, 0.95);
    --ndl-theme-color: #0f172a;

    --ndl-badge-paid-bg: #14532d;
    --ndl-badge-paid-fg: #86efac;
    --ndl-badge-partial-bg: #713f12;
    --ndl-badge-partial-fg: #fde047;
    --ndl-badge-unpaid-bg: #7f1d1d;
    --ndl-badge-unpaid-fg: #fca5a5;
    --ndl-badge-overdue-bg: #831843;
    --ndl-badge-overdue-fg: #f9a8d4;
    --ndl-badge-draft-bg: #334155;
    --ndl-badge-draft-fg: #cbd5e1;
    --ndl-badge-sent-bg: #1e3a5f;
    --ndl-badge-sent-fg: #93c5fd;
    --ndl-badge-void-bg: #334155;
    --ndl-badge-void-fg: #94a3b8;
    --ndl-badge-approved-bg: #064e3b;
    --ndl-badge-approved-fg: #6ee7b7;
    --ndl-badge-pending-bg: #78350f;
    --ndl-badge-pending-fg: #fcd34d;
    --tw-ring-offset-color: #0f172a;
}

@media not print {
    html[data-theme="dark"] body {
        background-color: var(--ndl-page);
        color: var(--ndl-text);
    }

    html[data-theme="dark"] ::selection {
        background: #1e3a5f;
        color: #f1f5f9;
    }

    html[data-theme="dark"] ::placeholder {
        color: #94a3b8 !important;
        opacity: 1;
    }

    html[data-theme="dark"] hr {
        border-color: var(--ndl-border);
    }

    html[data-theme="dark"] option {
        background-color: var(--ndl-surface);
        color: var(--ndl-text);
    }

    /* Native inputs without an explicit bg class still inherit a dark field */
    html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]),
    html[data-theme="dark"] select,
    html[data-theme="dark"] textarea {
        color: var(--ndl-text);
    }

    /* DataTables responsive expand control */
    html[data-theme="dark"] table.dataTable > tbody > tr > td.dtr-control:before,
    html[data-theme="dark"] table.dataTable > tbody > tr > th.dtr-control:before {
        color: rgba(241, 245, 249, 0.7) !important;
    }
    html[data-theme="dark"] table.dataTable > tbody > tr.child ul.dtr-details > li {
        border-bottom-color: var(--ndl-border);
    }
    html[data-theme="dark"] div.dtr-modal div.dtr-modal-display {
        background-color: var(--ndl-surface);
        border-color: var(--ndl-border);
        color: var(--ndl-text);
    }

    /* ── Neutral Tailwind remaps ─────────────────────────────────────────── */
    html[data-theme="dark"] .bg-white { background-color: var(--ndl-surface) !important; }
    html[data-theme="dark"] .bg-slate-50,
    html[data-theme="dark"] .bg-gray-50 { background-color: var(--ndl-page) !important; }
    html[data-theme="dark"] .bg-slate-100,
    html[data-theme="dark"] .bg-gray-100 { background-color: var(--ndl-surface-muted) !important; }
    html[data-theme="dark"] .bg-slate-200,
    html[data-theme="dark"] .bg-gray-200 { background-color: #334155 !important; }
    html[data-theme="dark"] .bg-gray-300 { background-color: #475569 !important; }

    html[data-theme="dark"] .hover\:bg-gray-50:hover,
    html[data-theme="dark"] .hover\:bg-slate-50:hover { background-color: var(--ndl-surface-hover) !important; }
    html[data-theme="dark"] .hover\:bg-gray-100:hover { background-color: #334155 !important; }
    html[data-theme="dark"] .hover\:bg-gray-200:hover { background-color: #475569 !important; }
    html[data-theme="dark"] .focus\:bg-white:focus { background-color: var(--ndl-surface) !important; }

    html[data-theme="dark"] .text-black,
    html[data-theme="dark"] .text-gray-900,
    html[data-theme="dark"] .text-slate-900,
    html[data-theme="dark"] .text-gray-800,
    html[data-theme="dark"] .text-slate-800 { color: var(--ndl-text) !important; }
    html[data-theme="dark"] .text-gray-700,
    html[data-theme="dark"] .text-slate-700 { color: var(--ndl-text-secondary) !important; }
    html[data-theme="dark"] .text-gray-600,
    html[data-theme="dark"] .text-slate-600 { color: var(--ndl-text-muted) !important; }
    html[data-theme="dark"] .text-gray-500,
    html[data-theme="dark"] .text-slate-500,
    html[data-theme="dark"] .text-gray-400,
    html[data-theme="dark"] .text-slate-400,
    html[data-theme="dark"] .text-gray-300,
    html[data-theme="dark"] .text-slate-300 { color: var(--ndl-text-subtle) !important; }

    html[data-theme="dark"] .hover\:text-gray-900:hover { color: var(--ndl-text) !important; }
    html[data-theme="dark"] .hover\:text-gray-700:hover,
    html[data-theme="dark"] .hover\:text-gray-600:hover { color: var(--ndl-text-muted) !important; }
    html[data-theme="dark"] .hover\:text-gray-500:hover { color: #cbd5e1 !important; }

    html[data-theme="dark"] .border-gray-50,
    html[data-theme="dark"] .border-gray-100,
    html[data-theme="dark"] .border-slate-100,
    html[data-theme="dark"] .border-gray-200,
    html[data-theme="dark"] .border-slate-200,
    html[data-theme="dark"] .border-gray-300,
    html[data-theme="dark"] .border-slate-300 { border-color: var(--ndl-border) !important; }
    html[data-theme="dark"] .hover\:border-gray-200:hover,
    html[data-theme="dark"] .hover\:border-gray-300:hover { border-color: #475569 !important; }

    html[data-theme="dark"] .divide-gray-50 > :not([hidden]) ~ :not([hidden]),
    html[data-theme="dark"] .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
    html[data-theme="dark"] .divide-gray-200 > :not([hidden]) ~ :not([hidden]),
    html[data-theme="dark"] .divide-y-2.divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
        border-color: var(--ndl-border) !important;
    }

    html[data-theme="dark"] .placeholder-gray-400::placeholder,
    html[data-theme="dark"] .placeholder-gray-500::placeholder {
        color: #94a3b8 !important;
    }

    html[data-theme="dark"] .ring-gray-200,
    html[data-theme="dark"] .ring-gray-300 { --tw-ring-color: #334155; }

    /* ── Accent tint + dark-on-light text remaps ─────────────────────────── */
    html[data-theme="dark"] .bg-blue-50 { background-color: #1e3a5f !important; }
    html[data-theme="dark"] .bg-blue-100 { background-color: #1e3a8a !important; }
    html[data-theme="dark"] .hover\:bg-blue-50:hover { background-color: #1e3a8a !important; }
    html[data-theme="dark"] .hover\:bg-blue-100:hover { background-color: #1e40af !important; }
    html[data-theme="dark"] .text-blue-900,
    html[data-theme="dark"] .text-blue-800 { color: #bfdbfe !important; }
    html[data-theme="dark"] .text-blue-700,
    html[data-theme="dark"] .hover\:text-blue-700:hover { color: #93c5fd !important; }
    html[data-theme="dark"] .text-blue-600,
    html[data-theme="dark"] .hover\:text-blue-600:hover { color: #60a5fa !important; }
    html[data-theme="dark"] .border-blue-100,
    html[data-theme="dark"] .border-blue-200 { border-color: #1e3a8a !important; }

    html[data-theme="dark"] .bg-indigo-50 { background-color: #312e81 !important; }
    html[data-theme="dark"] .bg-indigo-100 { background-color: #3730a3 !important; }
    html[data-theme="dark"] .hover\:bg-indigo-50:hover { background-color: #3730a3 !important; }
    html[data-theme="dark"] .hover\:bg-indigo-100:hover { background-color: #4338ca !important; }
    html[data-theme="dark"] .text-indigo-900,
    html[data-theme="dark"] .text-indigo-800 { color: #c7d2fe !important; }
    html[data-theme="dark"] .text-indigo-700,
    html[data-theme="dark"] .hover\:text-indigo-700:hover { color: #a5b4fc !important; }
    html[data-theme="dark"] .text-indigo-600,
    html[data-theme="dark"] .hover\:text-indigo-600:hover { color: #818cf8 !important; }
    html[data-theme="dark"] .text-indigo-400 { color: #a5b4fc !important; }
    html[data-theme="dark"] .border-indigo-100,
    html[data-theme="dark"] .border-indigo-200 { border-color: #3730a3 !important; }

    html[data-theme="dark"] .bg-emerald-50 { background-color: #064e3b !important; }
    html[data-theme="dark"] .bg-emerald-100 { background-color: #065f46 !important; }
    html[data-theme="dark"] .hover\:bg-emerald-50:hover { background-color: #065f46 !important; }
    html[data-theme="dark"] .text-emerald-900,
    html[data-theme="dark"] .text-emerald-800 { color: #a7f3d0 !important; }
    html[data-theme="dark"] .text-emerald-700 { color: #6ee7b7 !important; }
    html[data-theme="dark"] .text-emerald-600,
    html[data-theme="dark"] .hover\:text-emerald-600:hover { color: #34d399 !important; }
    html[data-theme="dark"] .border-emerald-100,
    html[data-theme="dark"] .border-emerald-200 { border-color: #065f46 !important; }

    html[data-theme="dark"] .bg-green-50 { background-color: #14532d !important; }
    html[data-theme="dark"] .bg-green-100 { background-color: #166534 !important; }
    html[data-theme="dark"] .hover\:bg-green-50:hover { background-color: #166534 !important; }
    html[data-theme="dark"] .hover\:bg-green-100:hover { background-color: #15803d !important; }
    html[data-theme="dark"] .text-green-900,
    html[data-theme="dark"] .text-green-800 { color: #bbf7d0 !important; }
    html[data-theme="dark"] .text-green-700,
    html[data-theme="dark"] .hover\:text-green-700:hover { color: #86efac !important; }
    html[data-theme="dark"] .text-green-600,
    html[data-theme="dark"] .hover\:text-green-600:hover { color: #4ade80 !important; }
    html[data-theme="dark"] .border-green-100,
    html[data-theme="dark"] .border-green-200 { border-color: #166534 !important; }

    html[data-theme="dark"] .bg-red-50 { background-color: #7f1d1d !important; }
    html[data-theme="dark"] .bg-red-100 { background-color: #991b1b !important; }
    html[data-theme="dark"] .hover\:bg-red-50:hover { background-color: #991b1b !important; }
    html[data-theme="dark"] .hover\:bg-red-100:hover { background-color: #b91c1c !important; }
    html[data-theme="dark"] .text-red-900,
    html[data-theme="dark"] .text-red-800 { color: #fecaca !important; }
    html[data-theme="dark"] .text-red-700 { color: #fca5a5 !important; }
    html[data-theme="dark"] .text-red-600,
    html[data-theme="dark"] .hover\:text-red-600:hover { color: #f87171 !important; }
    html[data-theme="dark"] .border-red-100,
    html[data-theme="dark"] .border-red-200 { border-color: #991b1b !important; }

    html[data-theme="dark"] .bg-amber-50 { background-color: #78350f !important; }
    html[data-theme="dark"] .bg-amber-100 { background-color: #92400e !important; }
    html[data-theme="dark"] .hover\:bg-amber-50:hover { background-color: #92400e !important; }
    html[data-theme="dark"] .text-amber-900,
    html[data-theme="dark"] .text-amber-800 { color: #fde68a !important; }
    html[data-theme="dark"] .text-amber-700,
    html[data-theme="dark"] .hover\:text-amber-700:hover { color: #fcd34d !important; }
    html[data-theme="dark"] .text-amber-600,
    html[data-theme="dark"] .hover\:text-amber-600:hover { color: #fbbf24 !important; }
    html[data-theme="dark"] .border-amber-100,
    html[data-theme="dark"] .border-amber-200 { border-color: #92400e !important; }

    html[data-theme="dark"] .bg-yellow-50 { background-color: #713f12 !important; }
    html[data-theme="dark"] .bg-yellow-100 { background-color: #854d0e !important; }
    html[data-theme="dark"] .hover\:bg-yellow-50:hover { background-color: #854d0e !important; }
    html[data-theme="dark"] .text-yellow-900,
    html[data-theme="dark"] .text-yellow-800 { color: #fef08a !important; }
    html[data-theme="dark"] .text-yellow-700 { color: #fde047 !important; }
    html[data-theme="dark"] .text-yellow-600 { color: #facc15 !important; }
    html[data-theme="dark"] .border-yellow-100,
    html[data-theme="dark"] .border-yellow-200 { border-color: #854d0e !important; }

    html[data-theme="dark"] .bg-purple-50 { background-color: #581c87 !important; }
    html[data-theme="dark"] .bg-purple-100 { background-color: #6b21a8 !important; }
    html[data-theme="dark"] .hover\:bg-purple-50:hover { background-color: #6b21a8 !important; }
    html[data-theme="dark"] .text-purple-900,
    html[data-theme="dark"] .text-purple-800 { color: #e9d5ff !important; }
    html[data-theme="dark"] .text-purple-700 { color: #d8b4fe !important; }
    html[data-theme="dark"] .text-purple-600,
    html[data-theme="dark"] .hover\:text-purple-600:hover { color: #c084fc !important; }
    html[data-theme="dark"] .border-purple-100,
    html[data-theme="dark"] .border-purple-200 { border-color: #6b21a8 !important; }

    html[data-theme="dark"] .bg-sky-50 { background-color: #0c4a6e !important; }
    html[data-theme="dark"] .bg-sky-100 { background-color: #075985 !important; }
    html[data-theme="dark"] .hover\:bg-sky-50:hover { background-color: #075985 !important; }
    html[data-theme="dark"] .text-sky-900,
    html[data-theme="dark"] .text-sky-800 { color: #bae6fd !important; }
    html[data-theme="dark"] .text-sky-700 { color: #7dd3fc !important; }
    html[data-theme="dark"] .text-sky-600 { color: #38bdf8 !important; }
    html[data-theme="dark"] .border-sky-100,
    html[data-theme="dark"] .border-sky-200 { border-color: #075985 !important; }

    html[data-theme="dark"] .bg-rose-50 { background-color: #881337 !important; }
    html[data-theme="dark"] .bg-rose-100 { background-color: #9f1239 !important; }
    html[data-theme="dark"] .hover\:bg-rose-50:hover { background-color: #9f1239 !important; }
    html[data-theme="dark"] .text-rose-900,
    html[data-theme="dark"] .text-rose-800 { color: #fecdd3 !important; }
    html[data-theme="dark"] .text-rose-700 { color: #fda4af !important; }
    html[data-theme="dark"] .text-rose-600 { color: #fb7185 !important; }
    html[data-theme="dark"] .border-rose-100,
    html[data-theme="dark"] .border-rose-200 { border-color: #9f1239 !important; }

    html[data-theme="dark"] .bg-teal-50 { background-color: #134e4a !important; }
    html[data-theme="dark"] .bg-teal-100 { background-color: #115e59 !important; }
    html[data-theme="dark"] .hover\:bg-teal-50:hover { background-color: #115e59 !important; }
    html[data-theme="dark"] .text-teal-900,
    html[data-theme="dark"] .text-teal-800 { color: #99f6e4 !important; }
    html[data-theme="dark"] .text-teal-700 { color: #5eead4 !important; }
    html[data-theme="dark"] .text-teal-600 { color: #2dd4bf !important; }
    html[data-theme="dark"] .border-teal-100,
    html[data-theme="dark"] .border-teal-200 { border-color: #115e59 !important; }

    html[data-theme="dark"] .bg-orange-50 { background-color: #7c2d12 !important; }
    html[data-theme="dark"] .bg-orange-100 { background-color: #9a3412 !important; }
    html[data-theme="dark"] .hover\:bg-orange-50:hover { background-color: #9a3412 !important; }
    html[data-theme="dark"] .text-orange-900,
    html[data-theme="dark"] .text-orange-800 { color: #fed7aa !important; }
    html[data-theme="dark"] .text-orange-700 { color: #fdba74 !important; }
    html[data-theme="dark"] .text-orange-600 { color: #fb923c !important; }
    html[data-theme="dark"] .border-orange-100,
    html[data-theme="dark"] .border-orange-200 { border-color: #9a3412 !important; }

    html[data-theme="dark"] .bg-pink-50 { background-color: #831843 !important; }
    html[data-theme="dark"] .bg-pink-100 { background-color: #9d174d !important; }
    html[data-theme="dark"] .hover\:bg-pink-50:hover { background-color: #9d174d !important; }
    html[data-theme="dark"] .text-pink-900,
    html[data-theme="dark"] .text-pink-800 { color: #fbcfe8 !important; }
    html[data-theme="dark"] .text-pink-700 { color: #f9a8d4 !important; }
    html[data-theme="dark"] .text-pink-600 { color: #f472b6 !important; }

    html[data-theme="dark"] .bg-cyan-50 { background-color: #164e63 !important; }
    html[data-theme="dark"] .bg-cyan-100 { background-color: #155e75 !important; }
    html[data-theme="dark"] .text-cyan-800,
    html[data-theme="dark"] .text-cyan-700 { color: #67e8f9 !important; }
    html[data-theme="dark"] .text-cyan-600 { color: #22d3ee !important; }

    html[data-theme="dark"] .bg-violet-50 { background-color: #4c1d95 !important; }
    html[data-theme="dark"] .bg-violet-100 { background-color: #5b21b6 !important; }
    html[data-theme="dark"] .text-violet-800,
    html[data-theme="dark"] .text-violet-700 { color: #c4b5fd !important; }
    html[data-theme="dark"] .text-violet-600 { color: #a78bfa !important; }

    html[data-theme="dark"] .bg-fuchsia-50 { background-color: #701a75 !important; }
    html[data-theme="dark"] .text-fuchsia-700 { color: #f0abfc !important; }
    html[data-theme="dark"] .text-fuchsia-600 { color: #e879f9 !important; }

    html[data-theme="dark"] .bg-lime-50 { background-color: #365314 !important; }
    html[data-theme="dark"] .text-lime-700 { color: #bef264 !important; }
    html[data-theme="dark"] .text-lime-600 { color: #a3e635 !important; }

    html[data-theme="dark"] .border-sky-400 { border-color: #38bdf8 !important; }
    html[data-theme="dark"] .border-amber-400 { border-color: #fbbf24 !important; }

    /* Tom Select parent-path hint */
    html[data-theme="dark"] .ts-muted { color: var(--ndl-text-subtle) !important; }

    html[data-theme="dark"] .ndl-brand-logo {
        background-color: #f8fafc;
    }

    html[data-theme="dark"] .badge-new { background: #1e3a5f; color: #93c5fd; border-color: #1e40af; }
    html[data-theme="dark"] .badge-contacted { background: #713f12; color: #fde047; border-color: #a16207; }
    html[data-theme="dark"] .badge-proposal_sent { background: #14532d; color: #86efac; border-color: #166534; }
    html[data-theme="dark"] .badge-won { background: #14532d; color: #86efac; border-color: #166534; }
    html[data-theme="dark"] .badge-lost { background: #7f1d1d; color: #fca5a5; border-color: #991b1b; }
    html[data-theme="dark"] .priority-cold { color: #94a3b8; }
    html[data-theme="dark"] .step-future { background: #334155; color: #94a3b8; }

    html[data-theme="dark"] #commissionsTable tbody tr.row-selected td {
        background: rgba(30, 58, 95, 0.85) !important;
    }
    html[data-theme="dark"] .drop-zone-active {
        background-color: #312e81 !important;
        border-color: #6366f1 !important;
        box-shadow: inset 0 0 0 2px #6366f1;
    }
}

@media print {
    html,
    html[data-theme="dark"] {
        color-scheme: light !important;
        --ndl-page: #f8fafc;
        --ndl-surface: #ffffff;
        --ndl-surface-2: #fafbfc;
        --ndl-surface-hover: #f8fafc;
        --ndl-surface-muted: #f9fafb;
        --ndl-text: #111827;
        --ndl-text-secondary: #374151;
        --ndl-text-muted: #6b7280;
        --ndl-text-subtle: #9ca3af;
        --ndl-text-faint: #d1d5db;
        --ndl-border: #e5e7eb;
        --ndl-border-subtle: #f1f5f9;
        --ndl-input-bg: #ffffff;
        --ndl-input-border: #e5e7eb;
        --ndl-accent: #3b82f6;
        --ndl-accent-text: #1e40af;
        --ndl-accent-soft: #eff6ff;
        --ndl-mobile-bar: #ffffff;
        --ndl-badge-paid-bg: #dcfce7;
        --ndl-badge-paid-fg: #166534;
        --ndl-badge-partial-bg: #fef9c3;
        --ndl-badge-partial-fg: #854d0e;
        --ndl-badge-unpaid-bg: #fee2e2;
        --ndl-badge-unpaid-fg: #991b1b;
        --ndl-badge-overdue-bg: #fce7f3;
        --ndl-badge-overdue-fg: #9d174d;
        --ndl-badge-draft-bg: #f3f4f6;
        --ndl-badge-draft-fg: #4b5563;
        --ndl-badge-sent-bg: #dbeafe;
        --ndl-badge-sent-fg: #1e40af;
        --ndl-badge-void-bg: #f3f4f6;
        --ndl-badge-void-fg: #9ca3af;
        --ndl-badge-approved-bg: #d1fae5;
        --ndl-badge-approved-fg: #065f46;
        --ndl-badge-pending-bg: #fef3c7;
        --ndl-badge-pending-fg: #92400e;
    }
}