/**
 * AVA · Enterprise Slate (opción A)
 * Verde reservado para estados OK (badges, KPI en línea, punto en línea).
 * Valores de medición: texto neutro (.ava-valor-medicion).
 */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&display=swap");

.ava-theme-enterprise {
    --ava-bg: #111318;
    --ava-bg-elevated: #181b22;
    --ava-bg-subtle: #1e222a;
    --ava-bg-input: #151820;
    --ava-border: #2a303c;
    --ava-border-soft: #232830;
    --ava-text: #f0f2f5;
    --ava-text-muted: #8b93a1;
    --ava-text-faint: #5c6470;
    --ava-accent: #4f7cff;
    --ava-accent-hover: #6b92ff;
    --ava-accent-muted: rgba(79, 124, 255, 0.12);
    --ava-ok: #3d9b6e;
    --ava-ok-muted: rgba(61, 155, 110, 0.14);
    --ava-warn: #c49a3a;
    --ava-warn-muted: rgba(196, 154, 58, 0.12);
    --ava-danger: #e07070;
    --ava-danger-muted: rgba(224, 112, 112, 0.12);
    --ava-offline: #d4925a;
    --ava-radius: 10px;
    --ava-radius-sm: 6px;
    --ava-font: "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
    font-family: var(--ava-font);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* —— Fondos base —— */
.ava-theme-enterprise.bg-slate-900,
.ava-theme-enterprise .bg-slate-900 {
    background-color: var(--ava-bg) !important;
}
.ava-theme-enterprise .bg-slate-950,
.ava-theme-enterprise .bg-slate-950\/80,
.ava-theme-enterprise .bg-slate-950\/95 {
    background-color: var(--ava-bg-elevated) !important;
}
.ava-theme-enterprise .bg-slate-900\/95,
.ava-theme-enterprise .bg-slate-900\/80,
.ava-theme-enterprise .bg-slate-900\/60,
.ava-theme-enterprise .bg-slate-900\/50,
.ava-theme-enterprise .bg-slate-900\/40,
.ava-theme-enterprise .bg-slate-900\/30,
.ava-theme-enterprise .bg-slate-900\/20 {
    background-color: color-mix(in srgb, var(--ava-bg-subtle) 85%, transparent) !important;
}
.ava-theme-enterprise .bg-slate-800,
.ava-theme-enterprise .bg-slate-800\/40,
.ava-theme-enterprise .bg-slate-800\/50 {
    background-color: var(--ava-bg-subtle) !important;
}

/* —— Bordes —— */
.ava-theme-enterprise .border-slate-800,
.ava-theme-enterprise .border-slate-700,
.ava-theme-enterprise .border-slate-600,
.ava-theme-enterprise .divide-slate-800 > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--ava-border) !important;
}

/* —— Tipografía —— */
.ava-theme-enterprise .text-white,
.ava-theme-enterprise .text-slate-100,
.ava-theme-enterprise .text-slate-200 {
    color: var(--ava-text) !important;
}
.ava-theme-enterprise .text-slate-300,
.ava-theme-enterprise .text-slate-400 {
    color: var(--ava-text-muted) !important;
}
.ava-theme-enterprise .text-slate-500,
.ava-theme-enterprise .text-slate-600 {
    color: var(--ava-text-faint) !important;
}

/* —— Acento (links, botones primarios) —— */
.ava-theme-enterprise .text-blue-400,
.ava-theme-enterprise .text-blue-300,
.ava-theme-enterprise .hover\:text-blue-300:hover,
.ava-theme-enterprise .hover\:text-blue-400:hover {
    color: var(--ava-accent) !important;
}
.ava-theme-enterprise .bg-blue-600,
.ava-theme-enterprise .hover\:bg-blue-700:hover,
.ava-theme-enterprise .bg-blue-600\/20 {
    background-color: var(--ava-accent) !important;
}
.ava-theme-enterprise .border-blue-500,
.ava-theme-enterprise .border-blue-500\/50,
.ava-theme-enterprise .ring-blue-500,
.ava-theme-enterprise .focus\:ring-blue-500:focus,
.ava-theme-enterprise .focus\:border-blue-500:focus {
    border-color: var(--ava-accent) !important;
    --tw-ring-color: rgba(79, 124, 255, 0.35) !important;
}
.ava-theme-enterprise .bg-blue-600\/20 {
    background-color: var(--ava-accent-muted) !important;
}
.ava-theme-enterprise .text-blue-300 {
    color: var(--ava-accent-hover) !important;
}

/* —— Verde solo estados OK —— */
.ava-theme-enterprise .ava-status-ok,
.ava-theme-enterprise .text-emerald-400[data-monitoreo-kpi="online"],
.ava-theme-enterprise [data-monitoreo-kpi="online"] {
    color: var(--ava-ok) !important;
}
.ava-theme-enterprise .bg-emerald-500\/10,
.ava-theme-enterprise .bg-emerald-500\/15 {
    background-color: var(--ava-ok-muted) !important;
}
.ava-theme-enterprise .border-emerald-500\/20,
.ava-theme-enterprise .border-emerald-500\/30,
.ava-theme-enterprise .border-emerald-500\/40,
.ava-theme-enterprise .border-emerald-500\/60,
.ava-theme-enterprise .ring-emerald-500\/30,
.ava-theme-enterprise .hover\:border-emerald-500\/50:hover {
    border-color: color-mix(in srgb, var(--ava-ok) 35%, transparent) !important;
}
.ava-theme-enterprise .bg-emerald-500,
.ava-theme-enterprise .monitoreo-punto-dot.bg-emerald-500 {
    background-color: var(--ava-ok) !important;
}
.ava-theme-enterprise .text-emerald-300,
.ava-theme-enterprise .text-emerald-400:not(.ava-valor-medicion) {
    color: var(--ava-ok) !important;
}

/* Valores de medición: neutros (no verdes) */
.ava-theme-enterprise .ava-valor-medicion {
    color: var(--ava-text) !important;
    font-variant-numeric: tabular-nums;
}

/* —— Tarjetas y paneles —— */
.ava-theme-enterprise .rounded-xl,
.ava-theme-enterprise .rounded-2xl {
    border-radius: var(--ava-radius) !important;
}
.ava-theme-enterprise .rounded-lg {
    border-radius: var(--ava-radius-sm) !important;
}
.ava-theme-enterprise .shadow-xl,
.ava-theme-enterprise .shadow-2xl {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
}

/* —— Sidebar —— */
.ava-theme-enterprise .ava-sidebar {
    background-color: var(--ava-bg-elevated) !important;
    border-color: var(--ava-border) !important;
    padding-top: 1.25rem !important;
    padding-bottom: 1.25rem !important;
}
.ava-theme-enterprise .ava-sidebar .mb-10 {
    margin-bottom: 1.75rem !important;
}
.ava-theme-enterprise .ava-sidebar img.h-28 {
    height: 4.5rem !important;
}
.ava-theme-enterprise .ava-sidebar img.h-20 {
    height: 3.5rem !important;
}
.ava-theme-enterprise .ava-nav-link {
    color: var(--ava-text-muted) !important;
    border-radius: var(--ava-radius-sm);
    font-size: 0.8125rem;
    font-weight: 500;
    letter-spacing: 0.01em;
    transition: background 0.15s, color 0.15s;
}
.ava-theme-enterprise .ava-nav-link:hover {
    color: var(--ava-text) !important;
    background-color: var(--ava-accent-muted) !important;
}
.ava-theme-enterprise .ava-nav-link i {
    opacity: 0.75;
    font-size: 0.8rem;
}

/* —— Topbar —— */
.ava-theme-enterprise header.sticky {
    background-color: color-mix(in srgb, var(--ava-bg) 92%, transparent) !important;
    border-color: var(--ava-border) !important;
    backdrop-filter: blur(8px);
}

/* —— Inputs —— */
.ava-theme-enterprise input[type="text"],
.ava-theme-enterprise input[type="email"],
.ava-theme-enterprise input[type="password"],
.ava-theme-enterprise input[type="url"],
.ava-theme-enterprise input[type="number"],
.ava-theme-enterprise input[type="search"],
.ava-theme-enterprise select,
.ava-theme-enterprise textarea {
    background-color: var(--ava-bg-input) !important;
    border-color: var(--ava-border) !important;
    border-radius: var(--ava-radius-sm) !important;
}
.ava-theme-enterprise input:focus,
.ava-theme-enterprise select:focus,
.ava-theme-enterprise textarea:focus {
    border-color: var(--ava-accent) !important;
    outline: none;
    box-shadow: 0 0 0 1px var(--ava-accent);
}

/* —— Login / auth card —— */
.ava-theme-enterprise .ava-auth-shell {
    background-color: var(--ava-bg) !important;
}
.ava-theme-enterprise .ava-auth-card {
    background-color: var(--ava-bg-elevated) !important;
    border: 1px solid var(--ava-border) !important;
    border-radius: var(--ava-radius) !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2) !important;
}

/* —— Tablas monitoreo —— */
.ava-theme-enterprise .fila-punto:hover {
    background-color: var(--ava-accent-muted) !important;
}
.ava-theme-enterprise thead th {
    font-weight: 500 !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 0.65rem !important;
    color: var(--ava-text-faint) !important;
}

/* —— Nav móvil —— */
.ava-theme-enterprise .ava-nav-inferior {
    background-color: var(--ava-bg-elevated) !important;
    border-color: var(--ava-border) !important;
}

/* —— Títulos —— */
.ava-theme-enterprise h1,
.ava-theme-enterprise h2 {
    letter-spacing: -0.02em;
    font-weight: 600 !important;
}
.ava-theme-enterprise .font-extrabold {
    font-weight: 600 !important;
}

/* —— Pantalla TV (mismo tema) —— */
.ava-theme-enterprise.tablero-tv-body,
.ava-theme-enterprise .tablero-tv-body {
    background: var(--ava-bg) !important;
}
.ava-theme-enterprise .tablero-tv-header {
    border-color: var(--ava-border) !important;
}
.ava-theme-enterprise .tablero-tv-card,
.ava-theme-enterprise .tablero-comando-wrap {
    background: var(--ava-bg-elevated) !important;
    border-color: var(--ava-border) !important;
}
.ava-theme-enterprise .tablero-badge-ok {
    background: var(--ava-ok-muted) !important;
    color: var(--ava-ok) !important;
}

/* —— Wizard alarmas: selección visible (sin peer-checked de Tailwind) —— */
.ava-wizard-operador label {
    flex: 1 1 0;
}
.ava-wizard-operador-btn {
    display: block;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 700;
    text-align: center;
    background-color: rgb(15 23 42);
    color: rgb(148 163 184);
    transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.ava-wizard-operador label:has(input:checked) .ava-wizard-operador-btn {
    background-color: rgb(37 99 235);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgb(96 165 250);
}
.ava-wizard-operador label:not(:has(input:checked)):hover .ava-wizard-operador-btn {
    background-color: rgb(30 41 59);
    color: rgb(226 232 240);
}
.ava-wizard-variable-card {
    transition: border-color 0.15s ease, background-color 0.15s ease;
}
.ava-wizard-variable label:has(input:checked) .ava-wizard-variable-card {
    border-color: rgb(59 130 246) !important;
    background-color: rgb(59 130 246 / 0.12);
    box-shadow: 0 0 0 1px rgb(59 130 246 / 0.35);
}
.ava-wizard-variable label:has(input:checked) .ava-wizard-variable-icon {
    color: rgb(96 165 250) !important;
}

/* —— Switch ON/OFF reglas de alarma (estilo Ubibot) —— */
.ava-alarm-switch-form {
    display: inline-block;
    vertical-align: middle;
}
.ava-alarm-switch {
    position: relative;
    display: inline-flex;
    align-items: center;
    width: 2.75rem;
    height: 1.5rem;
    padding: 0;
    border: none;
    border-radius: 9999px;
    background-color: rgb(71 85 105);
    cursor: pointer;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
    box-shadow: inset 0 0 0 1px rgb(51 65 85);
}
.ava-alarm-switch.is-on {
    background-color: rgb(34 197 94);
    box-shadow: inset 0 0 0 1px rgb(22 163 74);
}
.ava-alarm-switch-knob {
    position: absolute;
    left: 2px;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
    transition: transform 0.2s ease;
}
.ava-alarm-switch.is-on .ava-alarm-switch-knob {
    transform: translateX(1.25rem);
}
.ava-alarm-switch:hover {
    filter: brightness(1.08);
}
.ava-alarm-switch:focus-visible {
    outline: 2px solid rgb(96 165 250);
    outline-offset: 2px;
}