:root {
    --page-bg: #f8fafc;
    --page-text: #0f172a;
    --card-bg: #ffffff;
    --muted-bg: #f8fafc;
    --body-text: #334155;
    --muted-text: #64748b;
    --page-border: #e2e8f0;
}

[data-theme="light"] {
    --page-bg: #f8fafc;
    --page-text: #0f172a;
    --card-bg: #ffffff;
    --muted-bg: #f8fafc;
    --body-text: #334155;
    --muted-text: #64748b;
    --page-border: #e2e8f0;
}

[data-theme="gray"] {
    --page-bg: #e9edf2;
    --page-text: #1e293b;
    --card-bg: #f8fafc;
    --muted-bg: #e2e8f0;
    --body-text: #334155;
    --muted-text: #64748b;
    --page-border: #cbd5e1;
}

[data-theme="bago"] {
    --page-bg: #f7f5fc;
    --page-text: #0f172a;
    --card-bg: #ffffff;
    --muted-bg: #f8fafc;
    --body-text: #334155;
    --muted-text: #64748b;
    --page-border: #e2e8f0;
}

[data-theme="dark"] {
    --page-bg: #0f172a;
    --page-text: #f1f5f9;
    --card-bg: #1e293b;
    --muted-bg: #0f172a;
    --body-text: #e2e8f0;
    --muted-text: #cbd5e1;
    --page-border: #475569;
}

html,
body {
    min-height: 100%;
    background-color: var(--page-bg);
    color: var(--page-text);
}

body {
    min-height: 100vh;
}

.bago-background {
    background-color: var(--page-bg) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='240' viewBox='0 0 400 240'%3E%3Cg transform='rotate(-18 200 120)' font-family='Arial,sans-serif' font-weight='600' letter-spacing='2'%3E%3Ctext x='12' y='62' fill='%238b5cf6' fill-opacity='.18' font-size='34'%3EBag%C3%B3%3C/text%3E%3Ctext x='210' y='128' fill='%238b5cf6' fill-opacity='.045' font-size='15'%3EWL%3C/text%3E%3Ctext x='130' y='170' fill='%238b5cf6' fill-opacity='.045' font-size='15'%3ENC%3C/text%3E%3C/g%3E%3C/svg%3E");
    background-repeat: repeat;
    background-size: 400px 240px;
}

[data-theme="dark"] .bg-white {
    background-color: var(--card-bg) !important;
}

[data-theme="dark"] .bg-white\/95 {
    background-color: rgb(30 41 59 / 96%) !important;
}

[data-theme="dark"] .bg-slate-50 {
    background-color: var(--muted-bg) !important;
}

[data-theme="dark"] .bg-slate-100 {
    background-color: #334155 !important;
}

[data-theme="dark"] .text-slate-900,
[data-theme="dark"] .text-slate-800,
[data-theme="dark"] .text-slate-700,
[data-theme="dark"] .text-slate-600 {
    color: var(--page-text) !important;
}

[data-theme="dark"] .text-slate-500,
[data-theme="dark"] .text-slate-400 {
    color: var(--muted-text) !important;
}

[data-theme="dark"] .text-indigo-700,
[data-theme="dark"] .text-indigo-600 {
    color: #c4b5fd !important;
}

[data-theme="dark"] .text-emerald-700 {
    color: #a7f3d0 !important;
}

[data-theme="dark"] .text-rose-800 {
    color: #fecdd3 !important;
}

[data-theme="dark"] .bg-indigo-50 {
    background-color: #312e81 !important;
}

[data-theme="dark"] .bg-emerald-50 {
    background-color: #064e3b !important;
}

[data-theme="dark"] .bg-rose-50 {
    background-color: #4c0519 !important;
}

[data-theme="dark"] .bg-slate-100,
[data-theme="dark"] .bg-slate-200 {
    color: var(--page-text) !important;
}

[data-theme="dark"] .border-slate-200,
[data-theme="dark"] .border-slate-300,
[data-theme="dark"] .border-slate-100 {
    border-color: var(--page-border) !important;
}

[data-theme="dark"] .divide-slate-100 > :not([hidden]) ~ :not([hidden]),
[data-theme="dark"] .divide-slate-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--page-border) !important;
}

[data-theme="dark"] .hover\:bg-slate-50:hover {
    background-color: #334155 !important;
}

[data-theme="dark"] .hover\:bg-slate-100:hover {
    background-color: #475569 !important;
}

[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
    border-color: var(--page-border);
    background-color: var(--card-bg);
    color: var(--page-text);
}

[data-theme="dark"] select option {
    background-color: var(--card-bg);
    color: var(--page-text);
}

[data-theme="dark"] table thead {
    background-color: #1e293b !important;
}

[data-theme="dark"] table tbody {
    background-color: var(--card-bg) !important;
}

[data-theme="dark"] table tbody tr:hover {
    background-color: #334155 !important;
}

[data-theme="gray"] .bago-background,
[data-theme="light"] .bago-background {
    background-color: var(--page-bg) !important;
}