/* WAYNA · UX T01 — base visual del tenant restaurante (solo panel `admin`; el Control Plane NO enlaza esta hoja).
   Sidebar oscuro en los tres modos (claro / oscuro / sistema): Filament pone `.dark` en <html> en los tres casos,
   y el sidebar usa tokens propios, por lo que su contraste no depende del modo del contenido. */
:root {
    --wy-primary: #0284c7;
    --wy-secondary: #38bdf8;
    --wy-tertiary: #0f172a;
    --wy-neutral: #64748b;
    --wy-success: #16a34a;
    --wy-attention: #ea580c;
    --wy-danger: #dc2626;

    /* Estados de mesa (documentados para fases futuras; aún NO se aplican a la pantalla de Mesas). */
    --wy-table-free: #16a34a;
    --wy-table-occupied: #0284c7;
    --wy-table-bill: #ea580c;
    --wy-table-online: #38bdf8;
}

.fi-sidebar {
    --wy-sb-bg: var(--wy-tertiary);
    --wy-sb-border: #1e293b;
    --wy-sb-text: #e2e8f0;
    --wy-sb-muted: #94a3b8;
    --wy-sb-group: #cbd5e1;
    --wy-sb-icon: #94a3b8;
    --wy-sb-hover-bg: #1e293b;
    --wy-sb-hover-text: #ffffff;
    --wy-sb-active-bg: #0c4a6e;
    --wy-sb-active-text: #ffffff;
    --wy-sb-active-icon: var(--wy-secondary);
    --wy-sb-focus: var(--wy-secondary);

    background: var(--wy-sb-bg);
    border-inline-end: 1px solid var(--wy-sb-border);
    color: var(--wy-sb-text);
}

/* Filament pinta `.dark .fi-sidebar` (transparente): :root:root sube la especificidad para que el sidebar sea oscuro igual en claro, oscuro y sistema. */
:root:root .fi-sidebar { background: var(--wy-sb-bg); border-inline-end-color: var(--wy-sb-border); }

:root:root .fi-sidebar .fi-sidebar-header { background: var(--wy-sb-bg); border-bottom: 1px solid var(--wy-sb-border); }
.fi-sidebar .fi-sidebar-header .fi-logo,
.fi-sidebar .fi-sidebar-header img { filter: brightness(0) invert(1); }
:root:root .fi-sidebar .fi-sidebar-nav { background: var(--wy-sb-bg); scrollbar-color: #334155 transparent; }

/* Grupos */
.fi-sidebar .fi-sidebar-group-button { color: var(--wy-sb-group); }
.fi-sidebar .fi-sidebar-group-label { color: var(--wy-sb-group); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; font-size: .72rem; }
.fi-sidebar .fi-sidebar-group-icon { color: var(--wy-secondary); width: 1.5rem; height: 1.5rem; }
.fi-sidebar .fi-sidebar-group-collapse-button { color: var(--wy-sb-muted); }

/* Ítems */
.fi-sidebar .fi-sidebar-item-button { color: var(--wy-sb-text); border-radius: .5rem; }
.fi-sidebar .fi-sidebar-item-label { color: var(--wy-sb-text); }
.fi-sidebar .fi-sidebar-item-icon { color: var(--wy-sb-icon); }
.fi-sidebar .fi-sidebar-item-button:hover,
.fi-sidebar .fi-sidebar-item-button:focus-visible { background: var(--wy-sb-hover-bg); }
.fi-sidebar .fi-sidebar-item-button:hover .fi-sidebar-item-label,
.fi-sidebar .fi-sidebar-item-button:hover .fi-sidebar-item-icon { color: var(--wy-sb-hover-text); }
.fi-sidebar .fi-sidebar-item-button:focus-visible { outline: 2px solid var(--wy-sb-focus); outline-offset: -2px; }
.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-button { background: var(--wy-sb-active-bg); }
.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-button .fi-sidebar-item-label { color: var(--wy-sb-active-text); font-weight: 600; }
.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-button .fi-sidebar-item-icon { color: var(--wy-sb-active-icon); }

/* Insignias */
.fi-sidebar .fi-badge { background: #0c4a6e; color: #e0f2fe; border-color: #075985; }

/* Estados semánticos reutilizables (acciones, insignias y alertas del tenant) */
.wy-state-success { color: var(--wy-success); }
.wy-state-attention { color: var(--wy-attention); }
.wy-state-danger { color: var(--wy-danger); }

/* ---------- UX T05.2 · header del tenant: accesos con texto + Local actual ---------- */
.wy-hdr { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.wy-hdr svg { width: 1.25rem; height: 1.25rem; flex: none; }
.wy-hdr svg.wy-icon--small { width: 1rem; height: 1rem; }
.wy-hdr__btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 2.5rem; padding: .375rem .875rem; border-radius: .625rem; font-size: .875rem; font-weight: 600; line-height: 1.25; white-space: nowrap; text-decoration: none; color: #ffffff !important; background: var(--wy-tone-info-solid); transition: filter .15s ease; }
.wy-hdr__btn--success { background: var(--wy-tone-success-solid); }
.wy-hdr__btn--attention { background: var(--wy-tone-attention-solid); }
.wy-hdr__btn--neutral { background: var(--wy-tone-neutral-solid); }
.wy-hdr__btn:hover { filter: brightness(1.08); }
.wy-hdr__btn:focus-visible, .wy-hdr__context:focus-visible { outline: 3px solid var(--wy-secondary); outline-offset: 2px; }
.wy-hdr__context { display: inline-flex; align-items: center; gap: .375rem; min-height: 2.5rem; max-width: 14rem; min-width: 0; padding: .375rem .75rem; border: 1px solid var(--wy-border); border-radius: .625rem; background: transparent; color: var(--wy-text-muted); font: inherit; font-size: .875rem; font-weight: 600; text-decoration: none; cursor: pointer; }
.wy-hdr__context--static { cursor: default; border-color: transparent; padding-inline: .25rem; }
.wy-hdr__context--pending { color: var(--wy-tone-attention-fg); background: var(--wy-tone-attention-bg); border-color: transparent; }
.wy-hdr__context:not(.wy-hdr__context--static):hover { border-color: var(--wy-primary); color: var(--wy-text); }
.wy-hdr__context-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
@media (max-width: 1023px) { .wy-hdr { gap: .375rem; } .wy-hdr__btn { padding-inline: .625rem; } .wy-hdr__context { max-width: 10rem; } }
@media (max-width: 639px) { .wy-hdr__context { max-width: 7rem; padding-inline: .5rem; } .wy-hdr__btn { padding-inline: .5rem; gap: .25rem; } }
@media (max-width: 479px) { .wy-hdr__context-label { display: none; } .wy-hdr__context--pending .wy-hdr__context-label { display: inline; } }

/* ---------- UX T05.2 · contexto dentro del menú de perfil ---------- */
.wy-ctx { display: flex; flex-direction: column; gap: .125rem; padding: .5rem 1rem .625rem; border-bottom: 1px solid var(--wy-border); }
.wy-ctx__label { font-size: .6875rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--wy-text-muted); }
.wy-ctx__company { font-size: .875rem; font-weight: 700; color: var(--wy-text); overflow-wrap: anywhere; }
.wy-ctx__branch { font-size: .8125rem; color: var(--wy-text-muted); overflow-wrap: anywhere; }
