:root {
    color-scheme: light;
    --theme-app-bg: #f1f5f9;
    --theme-surface: #ffffff;
    --theme-surface-soft: #f8fafc;
    --theme-surface-muted: #e5e7eb;
    --theme-text: #0f172a;
    --theme-text-soft: #334155;
    --theme-text-muted: #64748b;
    --theme-border: #d1d5db;
    --theme-divider: rgba(148, 163, 184, 0.20);
    --theme-shadow: 0 16px 40px rgba(15, 23, 42, 0.10);
    --theme-input-bg: #ffffff;
    --theme-fab-bg: rgba(15, 23, 42, 0.92);
    --theme-fab-text: #f8fafc;
    --theme-fab-border: rgba(255, 255, 255, 0.08);
}

html[data-theme='dark'] {
    color-scheme: dark;
    --theme-app-bg: #020617;
    --theme-surface: #0f172a;
    --theme-surface-soft: #111827;
    --theme-surface-muted: #1f2937;
    --theme-text: #e2e8f0;
    --theme-text-soft: #cbd5e1;
    --theme-text-muted: #94a3b8;
    --theme-border: #334155;
    --theme-divider: rgba(148, 163, 184, 0.14);
    --theme-shadow: 0 18px 44px rgba(2, 6, 23, 0.55);
    --theme-input-bg: #0b1220;
    --theme-fab-bg: rgba(226, 232, 240, 0.96);
    --theme-fab-text: #0f172a;
    --theme-fab-border: rgba(15, 23, 42, 0.10);
}

html,
body {
    transition: background-color 160ms ease, color 160ms ease;
}

.theme-fab {
    position: fixed;
    left: 1rem;
    bottom: 1rem;
    z-index: 70;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.65rem 0.85rem;
    border-radius: 999px;
    border: 1px solid var(--theme-fab-border);
    background: var(--theme-fab-bg);
    color: var(--theme-fab-text);
    box-shadow: var(--theme-shadow);
    backdrop-filter: blur(14px);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    opacity: 0.94;
}

.theme-fab:hover {
    transform: translateY(-1px);
    opacity: 1;
}

.theme-fab:focus-visible {
    outline: 2px solid #60a5fa;
    outline-offset: 2px;
}

.theme-fab i {
    font-size: 0.95rem;
}

@media (max-width: 768px) {
    .theme-fab {
        left: 0.75rem;
        bottom: calc(0.75rem + env(safe-area-inset-bottom));
        padding: 0.65rem;
        gap: 0;
    }

    .theme-fab [data-theme-label] {
        display: none;
    }
}

@media print {
    .theme-fab {
        display: none !important;
    }

    html[data-theme='dark'] body,
    html[data-theme='dark'] .bg-white,
    html[data-theme='dark'] .bg-white\/90,
    html[data-theme='dark'] .bg-white\/80,
    html[data-theme='dark'] .bg-white\/70,
    html[data-theme='dark'] .bg-gray-50,
    html[data-theme='dark'] .bg-slate-50,
    html[data-theme='dark'] .bg-gray-100,
    html[data-theme='dark'] .bg-slate-100 {
        background: #ffffff !important;
        color: #111827 !important;
    }

    html[data-theme='dark'] .text-black,
    html[data-theme='dark'] .text-gray-900,
    html[data-theme='dark'] .text-gray-800,
    html[data-theme='dark'] .text-gray-700,
    html[data-theme='dark'] .text-gray-600,
    html[data-theme='dark'] .text-gray-500,
    html[data-theme='dark'] .text-slate-900,
    html[data-theme='dark'] .text-slate-800,
    html[data-theme='dark'] .text-slate-700,
    html[data-theme='dark'] .text-slate-600,
    html[data-theme='dark'] .text-slate-500 {
        color: #111827 !important;
    }

    html[data-theme='dark'] .border,
    html[data-theme='dark'] .border-gray-100,
    html[data-theme='dark'] .border-gray-200,
    html[data-theme='dark'] .border-gray-300,
    html[data-theme='dark'] .border-slate-200,
    html[data-theme='dark'] .border-slate-300,
    html[data-theme='dark'] .border-white\/70,
    html[data-theme='dark'] .border-white\/10 {
        border-color: #d1d5db !important;
    }
}

html[data-theme='dark'] body {
    background: var(--theme-app-bg) !important;
    color: var(--theme-text-soft);
}

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

html[data-theme='dark'] .bg-white\/90,
html[data-theme='dark'] .bg-white\/80,
html[data-theme='dark'] .bg-white\/70 {
    background-color: rgba(15, 23, 42, 0.88) !important;
}

html[data-theme='dark'] .bg-gray-50,
html[data-theme='dark'] .bg-slate-50 {
    background-color: var(--theme-surface-soft) !important;
}

html[data-theme='dark'] .bg-gray-100,
html[data-theme='dark'] .bg-slate-100 {
    background-color: var(--theme-surface-muted) !important;
}

html[data-theme='dark'] .bg-gray-200 {
    background-color: #273449 !important;
}

html[data-theme='dark'] .text-black,
html[data-theme='dark'] .text-gray-900,
html[data-theme='dark'] .text-gray-800,
html[data-theme='dark'] .text-slate-900,
html[data-theme='dark'] .text-slate-800 {
    color: var(--theme-text) !important;
}

html[data-theme='dark'] .text-gray-700,
html[data-theme='dark'] .text-gray-600,
html[data-theme='dark'] .text-slate-700,
html[data-theme='dark'] .text-slate-600 {
    color: var(--theme-text-soft) !important;
}

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

html[data-theme='dark'] .border,
html[data-theme='dark'] .border-gray-100,
html[data-theme='dark'] .border-gray-200,
html[data-theme='dark'] .border-gray-300,
html[data-theme='dark'] .border-gray-400,
html[data-theme='dark'] .border-slate-200,
html[data-theme='dark'] .border-slate-300,
html[data-theme='dark'] .border-white\/70,
html[data-theme='dark'] .border-white\/10 {
    border-color: var(--theme-border) !important;
}

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-slate-100 > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--theme-divider) !important;
}

html[data-theme='dark'] .shadow,
html[data-theme='dark'] .shadow-sm,
html[data-theme='dark'] .shadow-md,
html[data-theme='dark'] .shadow-lg,
html[data-theme='dark'] .shadow-xl,
html[data-theme='dark'] .shadow-2xl {
    box-shadow: var(--theme-shadow) !important;
}

html[data-theme='dark'] .hover\:bg-gray-50:hover,
html[data-theme='dark'] .hover\:bg-slate-50:hover {
    background-color: rgba(148, 163, 184, 0.08) !important;
}

html[data-theme='dark'] .hover\:bg-gray-100:hover {
    background-color: rgba(148, 163, 184, 0.12) !important;
}

html[data-theme='dark'] .hover\:text-gray-700:hover,
html[data-theme='dark'] .hover\:text-gray-900:hover,
html[data-theme='dark'] .hover\:text-slate-700:hover,
html[data-theme='dark'] .hover\:text-slate-900:hover {
    color: var(--theme-text) !important;
}

html[data-theme='dark'] input:not([type='checkbox']):not([type='radio']):not([type='range']),
html[data-theme='dark'] textarea,
html[data-theme='dark'] select {
    background-color: var(--theme-input-bg) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
}

html[data-theme='dark'] input::placeholder,
html[data-theme='dark'] textarea::placeholder {
    color: var(--theme-text-muted) !important;
}

html[data-theme='dark'] table thead tr,
html[data-theme='dark'] table tfoot tr {
    color: var(--theme-text-muted);
}

html[data-theme='dark'] code,
html[data-theme='dark'] pre {
    background-color: rgba(15, 23, 42, 0.88);
    color: #dbeafe;
}
