/* Light/dark theme for the Actualizer portal.
   Kept as a static stylesheet so it does not depend on a Vite rebuild. */

html {
    color-scheme: light;
}

html[data-theme="dark"] {
    color-scheme: dark;
}

.theme-icon-sun {
    display: none;
}

html[data-theme="dark"] .theme-icon-moon {
    display: none;
}

html[data-theme="dark"] .theme-icon-sun {
    display: inline-flex;
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.theme-logo-plate {
    background-color: #ffffff !important;
}

/* -------------------------------------------------------------------------- */
/* Dark surfaces                                                               */
/* -------------------------------------------------------------------------- */

html[data-theme="dark"] body {
    background-color: #020617;
    color: #e2e8f0;
}

html[data-theme="dark"] .theme-page-glow {
    opacity: 0.4;
}

html[data-theme="dark"] .theme-header {
    background-color: rgba(15, 23, 42, 0.82);
    border-color: rgba(148, 163, 184, 0.12);
}

html[data-theme="dark"] .theme-dropdown {
    background-color: rgba(15, 23, 42, 0.96);
    border-color: rgba(148, 163, 184, 0.16);
}

html[data-theme="dark"] .theme-guest-main {
    background-color: #0b1220;
}

html[data-theme="dark"] .theme-panel {
    background-color: rgba(15, 23, 42, 0.88);
    border-color: rgba(148, 163, 184, 0.14);
}

html[data-theme="dark"] .card {
    background-color: rgba(15, 23, 42, 0.82);
    border-color: rgba(148, 163, 184, 0.12);
    box-shadow: 0 1px 2px rgb(0 0 0 / 0.28), 0 12px 28px -16px rgb(0 0 0 / 0.6);
}

html[data-theme="dark"] .btn-secondary {
    background-color: rgba(15, 23, 42, 0.92);
    color: #e2e8f0;
    border-color: #334155;
}

html[data-theme="dark"] .btn-secondary:hover {
    background-color: #1e293b;
}

html[data-theme="dark"] .form-label {
    color: #94a3b8;
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] select.form-control,
html[data-theme="dark"] textarea.form-control,
html[data-theme="dark"] input.form-control {
    background-color: #0f172a;
    border-color: #334155;
    color: #e2e8f0;
    color-scheme: dark;
}

html[data-theme="dark"] .form-control:focus {
    border-color: #4361ee;
}

html[data-theme="dark"] .form-control::placeholder {
    color: #64748b;
}

html[data-theme="dark"] .data-table thead {
    background-color: rgba(15, 23, 42, 0.92);
}

html[data-theme="dark"] .data-table th {
    color: #94a3b8;
}

html[data-theme="dark"] .data-table td {
    color: #cbd5e1;
}

html[data-theme="dark"] .data-table tbody tr {
    border-color: #1e293b;
}

html[data-theme="dark"] .data-table tbody tr:hover {
    background-color: rgba(67, 97, 238, 0.1);
}

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

html[data-theme="dark"] ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #334155;
    border-radius: 999px;
}

html[data-theme="dark"] ::-webkit-scrollbar-track {
    background: #0f172a;
}

/* -------------------------------------------------------------------------- */
/* Common Tailwind utilities used across Blade views                           */
/* -------------------------------------------------------------------------- */

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

html[data-theme="dark"] .bg-slate-50,
html[data-theme="dark"] .bg-slate-50\/80,
html[data-theme="dark"] .bg-slate-50\/90 {
    background-color: #0b1220;
}

html[data-theme="dark"] .bg-slate-100 {
    background-color: #1e293b;
}

html[data-theme="dark"] .text-slate-900,
html[data-theme="dark"] .text-slate-800 {
    color: #f1f5f9;
}

html[data-theme="dark"] .text-slate-700 {
    color: #e2e8f0;
}

html[data-theme="dark"] .text-slate-600 {
    color: #cbd5e1;
}

html[data-theme="dark"] .text-slate-500 {
    color: #94a3b8;
}

html[data-theme="dark"] .text-slate-400 {
    color: #94a3b8;
}

html[data-theme="dark"] .border-slate-100,
html[data-theme="dark"] .border-slate-200,
html[data-theme="dark"] .border-slate-200\/80,
html[data-theme="dark"] .border-slate-300,
html[data-theme="dark"] .border-white\/60,
html[data-theme="dark"] .border-white\/80 {
    border-color: #1e293b;
}

html[data-theme="dark"] .divide-slate-100 > :not([hidden]) ~ :not([hidden]),
html[data-theme="dark"] .divide-slate-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: #1e293b;
}

html[data-theme="dark"] .hover\:bg-white:hover,
html[data-theme="dark"] .hover\:bg-white\/80:hover,
html[data-theme="dark"] .hover\:bg-slate-50:hover,
html[data-theme="dark"] .hover\:bg-slate-100:hover {
    background-color: #1e293b;
}

html[data-theme="dark"] .hover\:text-slate-600:hover,
html[data-theme="dark"] .hover\:text-slate-700:hover,
html[data-theme="dark"] .hover\:text-slate-800:hover {
    color: #f8fafc;
}

html[data-theme="dark"] .placeholder\:text-slate-400::placeholder {
    color: #64748b;
}

/* Brand / status tints — keep hue, darken the wash */
html[data-theme="dark"] .bg-brand-50 {
    background-color: rgba(67, 97, 238, 0.16);
}

html[data-theme="dark"] .bg-brand-100 {
    background-color: rgba(67, 97, 238, 0.22);
}

html[data-theme="dark"] .text-brand-600,
html[data-theme="dark"] .text-brand-700 {
    color: #8fa1f5;
}

html[data-theme="dark"] .hover\:text-brand-700:hover {
    color: #bec8f9;
}

html[data-theme="dark"] .bg-emerald-50,
html[data-theme="dark"] .bg-emerald-50\/90,
html[data-theme="dark"] .bg-emerald-100 {
    background-color: rgba(6, 78, 59, 0.42);
}

html[data-theme="dark"] .text-emerald-600,
html[data-theme="dark"] .text-emerald-700,
html[data-theme="dark"] .text-emerald-800 {
    color: #6ee7b7;
}

html[data-theme="dark"] .border-emerald-200,
html[data-theme="dark"] .border-emerald-200\/80 {
    border-color: rgba(16, 185, 129, 0.28);
}

html[data-theme="dark"] .bg-amber-50,
html[data-theme="dark"] .bg-amber-50\/60,
html[data-theme="dark"] .bg-amber-50\/90,
html[data-theme="dark"] .bg-amber-100 {
    background-color: rgba(120, 53, 15, 0.38);
}

html[data-theme="dark"] .text-amber-600,
html[data-theme="dark"] .text-amber-700,
html[data-theme="dark"] .text-amber-800 {
    color: #fcd34d;
}

html[data-theme="dark"] .border-amber-200,
html[data-theme="dark"] .border-amber-200\/80 {
    border-color: rgba(245, 158, 11, 0.32);
}

html[data-theme="dark"] .bg-rose-50,
html[data-theme="dark"] .bg-rose-50\/90,
html[data-theme="dark"] .bg-rose-100 {
    background-color: rgba(127, 29, 29, 0.38);
}

html[data-theme="dark"] .text-rose-600,
html[data-theme="dark"] .text-rose-700 {
    color: #fda4af;
}

html[data-theme="dark"] .border-rose-200,
html[data-theme="dark"] .border-rose-200\/80 {
    border-color: rgba(244, 63, 94, 0.32);
}

html[data-theme="dark"] .bg-violet-50,
html[data-theme="dark"] .bg-violet-100 {
    background-color: rgba(76, 29, 149, 0.38);
}

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

/* Keep native checkboxes readable */
html[data-theme="dark"] input[type="checkbox"],
html[data-theme="dark"] input[type="radio"] {
    background-color: #0f172a;
    border-color: #475569;
}

/* Laravel Tailwind pagination (vendor views) */
html[data-theme="dark"] .bg-gray-100,
html[data-theme="dark"] .bg-gray-200 {
    background-color: #1e293b;
}

html[data-theme="dark"] .text-gray-500,
html[data-theme="dark"] .text-gray-600,
html[data-theme="dark"] .text-gray-700 {
    color: #cbd5e1;
}

html[data-theme="dark"] .border-gray-300 {
    border-color: #334155;
}

html[data-theme="dark"] .hover\:bg-gray-100:hover,
html[data-theme="dark"] .hover\:bg-gray-50:hover {
    background-color: #1e293b;
}