/* Enterprise UI foundation — tokens, shell polish, cards, tables, states */

/* Los tokens que vivían acá se movieron a brand.css (única :root, Design System §2, P0). */

.holos-enterprise-shell .holos-content {
    max-width: var(--holos-enterprise-content-max);
    width: 100%;
    margin-inline: auto;
    padding: var(--holos-space-4) var(--holos-space-5) var(--holos-space-6);
}

.holos-enterprise-shell .holos-topbar {
    min-height: 2.75rem;
    padding: 0.35rem 1.25rem;
    gap: 0.65rem;
}

.holos-enterprise-shell .holos-topbar-status {
    margin-right: auto;
    padding-left: 0.15rem;
}

.holos-enterprise-page {
    display: flex;
    flex-direction: column;
    gap: var(--holos-space-5);
}

.holos-enterprise-page-header,
.holos-page-header.holos-enterprise-page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--holos-space-3);
    margin-bottom: 0;
    padding-bottom: var(--holos-space-3);
    border-bottom: 1px solid var(--holos-border);
}

.holos-enterprise-page-header h1,
.holos-page-header.holos-enterprise-page-header h1 {
    margin: 0;
    font-size: var(--holos-font-2xl);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.2;
}

.holos-enterprise-card,
.holos-enterprise-page .card.holos-enterprise-card {
    background: var(--holos-enterprise-surface);
    border: 1px solid var(--holos-border);
    border-radius: var(--holos-radius);
    box-shadow: var(--holos-shadow-card);
    padding: var(--holos-enterprise-card-padding);
}

.holos-enterprise-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    font-size: var(--holos-font-sm);
    font-weight: 600;
    letter-spacing: 0.02em;
    border: 1px solid transparent;
    white-space: nowrap;
}

.holos-enterprise-badge--neutral {
    background: var(--holos-page);
    color: var(--holos-muted-strong);
    border-color: var(--holos-border);
}

.holos-enterprise-badge--success {
    background: color-mix(in srgb, var(--holos-success) 12%, var(--holos-surface));
    color: var(--holos-success-ink);
    border-color: color-mix(in srgb, var(--holos-success) 30%, var(--holos-surface));
}

.holos-enterprise-badge--warning {
    background: color-mix(in srgb, var(--holos-warning) 10%, var(--holos-surface));
    color: var(--holos-warning-ink);
    border-color: color-mix(in srgb, var(--holos-warning) 40%, var(--holos-surface));
}

.holos-enterprise-badge--danger {
    background: color-mix(in srgb, var(--holos-danger) 10%, var(--holos-surface));
    color: var(--holos-danger-ink);
    border-color: color-mix(in srgb, var(--holos-danger) 25%, var(--holos-surface));
}

.holos-enterprise-badge--info {
    background: var(--holos-brand-primary-soft);
    color: var(--holos-brand-primary-hover);
    border-color: color-mix(in srgb, var(--holos-info) 30%, var(--holos-surface));
}

.holos-enterprise-badge--readonly {
    background: var(--holos-enterprise-readonly-bg);
    color: var(--holos-muted);
    border-color: var(--holos-border);
}

.holos-enterprise-badge--pending {
    background: var(--holos-enterprise-pending-bg);
    color: var(--holos-warning-ink);
    border-color: var(--holos-enterprise-pending-border);
}

.holos-enterprise-table-shell .table-scroll,
.holos-enterprise-table-scroll {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}

.holos-enterprise-guarded-note {
    margin: 0;
    padding: var(--holos-space-3) var(--holos-space-4);
    border-radius: var(--holos-radius-sm);
    background: var(--holos-enterprise-readonly-bg);
    border: 1px solid var(--holos-border);
    color: var(--holos-enterprise-muted);
    font-size: var(--holos-font-md);
    line-height: 1.45;
}

/* ── El motivo de un dato ausente (HolosDatoAusente.razor) ────────────────────────────────────
   Va acá y no en el .razor.css de la pantalla porque el CSS scoped no alcanza el markup de un
   componente hijo — no hay un solo `::deep` en el repo.

   Se ve DISTINTO de un valor a propósito: en minúscula, sin peso y sin caja. Un motivo pintado con
   el mismo tratamiento que un dato se lee como si fuera el dato («no tenés permiso de verlo»
   ocupando el lugar del teléfono se copia y se marca). */
.holos-dato-ausente {
    font-size: 0.78rem;
    font-weight: 400;
    font-style: italic;
    color: var(--holos-muted);
    white-space: normal;
}

/* Los dos que le PIDEN algo a alguien —construir la capacidad, dar el permiso— se separan del
   hecho neutro «el CV no lo dice», donde no hay nada que hacer. */
.holos-dato-ausente--todavia-no {
    color: var(--holos-muted);
    border-bottom: 1px dashed var(--holos-border-strong);
}

.holos-dato-ausente--sin-permiso {
    color: var(--holos-brand-purple);
}

.holos-dato-ausente--sin-evidencia {
    color: var(--holos-warning-ink);
}

/* ── Los dos campos de la ventana de reclutamiento que son <HolosLiveTextInput> ───────────────
   Van acá por la MISMA razón que la clase de arriba, y vale la pena escribirla dos veces porque ya
   se cayó una pantalla en la trampa: el CSS scoped de una página compila a `.rwk-buscar[b-xxxxx]`
   y ese atributo se le pone únicamente al markup declarado en ESA página. El <input> de verdad lo
   emite el componente hijo, que no lo lleva. Puesta en el .razor.css, la regla compila, no da
   error y no pinta nada — que es como está hoy `.cvr-buscar` en la revista de aspirantes. */
.rwk-buscar {
    flex: 1 1 16rem;
    min-width: 0;
    /* 2.75rem es el objetivo táctil de la casa: menos que eso no se acierta con el pulgar. */
    min-height: 2.75rem;
    padding: 0.45rem 0.7rem;
    border: 1px solid var(--holos-border);
    border-radius: 8px;
    font: inherit;
}

.rwk-motivo {
    flex: 1 1 12rem;
    min-width: 0;
    min-height: 2.75rem;
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--holos-border);
    border-radius: 8px;
    font: inherit;
}

.holos-enterprise-page .reception-home {
    gap: var(--holos-space-5);
}

.holos-enterprise-page .reception-kpi,
.holos-enterprise-page .acct-kpi {
    box-shadow: var(--holos-shadow-sm);
}

.holos-enterprise-page .fiscal-config-layout > .card {
    box-shadow: var(--holos-shadow-card);
}

.holos-enterprise-touch-target,
.holos-enterprise-page .btn-primary,
.holos-enterprise-page .btn-secondary,
.holos-enterprise-page .btn-compact,
.holos-enterprise-page .btn-op,
.holos-enterprise-page .reception-quick-btn,
.holos-enterprise-page .reception-task-tab,
.holos-enterprise-page .reception-guest-open,
.holos-enterprise-page .reception-task-open {
    min-height: 2.75rem;
    min-width: 2.75rem;
}

.holos-enterprise-page .btn-compact {
    min-height: 2.25rem;
    padding: 0.4rem 0.65rem;
}

/* ── Enterprise page: reception KPI grid ── */

.holos-enterprise-page .reception-home-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--holos-space-3);
    min-width: 0;
}

.holos-enterprise-page .reception-home-split {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: var(--holos-space-4);
    min-width: 0;
}

.holos-enterprise-page .reception-home-header {
    flex-wrap: wrap;
    gap: var(--holos-space-3);
}

.holos-enterprise-page .reception-home-toolbar {
    flex-wrap: wrap;
    gap: var(--holos-space-2);
}

.holos-enterprise-page .reception-quick-actions {
    flex-wrap: wrap;
    gap: var(--holos-space-2);
}

.holos-enterprise-page .reception-home {
    max-height: none;
    overflow: visible;
    min-width: 0;
}

/* ── Accounting / fiscal safe overflow ── */

.holos-enterprise-page .acct-table-wrap,
.holos-enterprise-page .acct-split,
.holos-enterprise-page .fiscal-config-layout {
    min-width: 0;
    max-width: 100%;
}

.holos-enterprise-page .acct-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.holos-enterprise-page .acct-kpi-strip {
    flex-wrap: wrap;
    gap: var(--holos-space-2);
}

/* ── Spa / Tours calendar boards (tablet scroll) ── */

.holos-enterprise-page .scb-board-wrap,
.holos-enterprise-page .tcb-board-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}

.holos-enterprise-page .scb-toolbar .scb-filters,
.holos-enterprise-page .tcb-toolbar .tcb-filters,
.holos-enterprise-page .scb-filter-group,
.holos-enterprise-page .tcb-filter-group,
.holos-enterprise-page .scb-filter-toggles,
.holos-enterprise-page .tcb-filter-toggles {
    flex-wrap: wrap;
    gap: var(--holos-space-2);
}

/* ── Topbar status: never hide BCCR or clock ── */

.holos-enterprise-shell .holos-topbar .bccr-rate-badge,
.holos-enterprise-shell .holos-topbar .property-clock-badge {
    flex-shrink: 0;
    max-width: none;
}

.holos-enterprise-shell .holos-sidebar-property .property-selector-wrap,
.holos-enterprise-shell .holos-sidebar-property .property-selector {
    min-width: 0;
    max-width: 100%;
}

/*
 * Breakpoints (min targets):
 *   Desktop 1440+ · Laptop 1280 · Tablet H 1024 · Tablet V 768
 *   Mobile L 430 · Mobile S 390
 */

/* Laptop ≤1280 */
@media (max-width: 1280px) {
    .holos-enterprise-shell .holos-content {
        padding: var(--holos-space-4) var(--holos-space-4) var(--holos-space-5);
    }

    .holos-enterprise-page .reception-home-kpis {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .holos-enterprise-page .reception-home-split {
        grid-template-columns: 1fr;
    }

    .holos-enterprise-page-header h1,
    .holos-page-header.holos-enterprise-page-header h1 {
        font-size: var(--holos-font-xl);
    }
}

/* Tablet horizontal ≤1024 */
@media (max-width: 1024px) {
    .holos-enterprise-shell .holos-topbar {
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
        row-gap: 0.35rem;
        padding: 0.35rem 0.85rem;
    }

    .holos-enterprise-shell .holos-topbar-status {
        flex: 1 1 auto;
        flex-wrap: wrap;
        margin-right: 0;
        min-width: 0;
        gap: 0.35rem;
    }

    .holos-enterprise-shell .holos-sidebar-nav .topnav-trigger,
    .holos-enterprise-shell .holos-sidebar-nav .topnav-link-direct {
        min-height: 2.75rem;
    }

    .holos-enterprise-page .fiscal-config-layout {
        grid-template-columns: 1fr;
    }

    .holos-enterprise-page .acct-split {
        grid-template-columns: 1fr;
    }

}

/* Tablet vertical ≤768 */
@media (max-width: 768px) {
    .holos-enterprise-shell .holos-content {
        padding: var(--holos-space-3) var(--holos-space-3) var(--holos-space-5);
    }

    .holos-enterprise-page-header,
    .holos-page-header.holos-enterprise-page-header {
        flex-direction: column;
        align-items: stretch;
        gap: var(--holos-space-2);
        padding-bottom: var(--holos-space-2);
    }

    .holos-enterprise-page-header h1,
    .holos-page-header.holos-enterprise-page-header h1 {
        font-size: var(--holos-font-lg);
    }

    .holos-enterprise-shell .holos-topbar .bar-search-btn span:not([aria-hidden="true"]) {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .holos-enterprise-shell .holos-topbar .bar-search-btn {
        min-width: 2.75rem;
        padding-inline: 0.55rem;
    }

    .holos-enterprise-shell .holos-topbar .bccr-rate-badge {
        padding: 0.25rem 0.45rem;
    }

    .holos-enterprise-shell .holos-topbar .bccr-rate-text {
        font-size: 0.72rem;
    }

    .holos-enterprise-shell .holos-topbar .property-clock-label {
        max-width: 5.5rem;
    }

    .holos-enterprise-shell .holos-topbar .user-label {
        max-width: 7rem;
    }

    .holos-enterprise-page .reception-home-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .holos-enterprise-page .reception-home-title h1 {
        font-size: 1.15rem;
    }

    .holos-enterprise-card,
    .holos-enterprise-page .card.holos-enterprise-card {
        padding: var(--holos-space-4);
    }

    .holos-enterprise-page .scb-board,
    .holos-enterprise-page .tcb-board {
        min-width: 640px;
    }
}

/* Mobile large ≤430 */
@media (max-width: 430px) {
    .holos-enterprise-shell .holos-content {
        padding: var(--holos-space-3) var(--holos-space-2) var(--holos-space-5);
    }

    .holos-enterprise-page .reception-home-kpis {
        grid-template-columns: 1fr 1fr;
    }

    .holos-enterprise-page .reception-kpi-value {
        font-size: 1.25rem;
    }

    .holos-enterprise-page .reception-quick-btn {
        flex: 1 1 calc(50% - 0.35rem);
        justify-content: center;
    }

    .holos-enterprise-shell .holos-topbar {
        gap: 0.3rem;
    }

    .holos-enterprise-shell .holos-topbar .bccr-rate-text {
        font-size: 0.68rem;
    }

    .holos-enterprise-page-header h1,
    .holos-page-header.holos-enterprise-page-header h1 {
        font-size: var(--holos-font-lg);
    }
}

/* Mobile small ≤390 */
@media (max-width: 390px) {
    .holos-enterprise-page .reception-home-kpis {
        grid-template-columns: 1fr;
    }

    .holos-enterprise-page .reception-quick-btn {
        flex: 1 1 100%;
    }

    .holos-enterprise-shell .holos-topbar-status {
        flex-basis: 100%;
        order: -1;
        justify-content: flex-start;
    }

    .holos-enterprise-shell .holos-topbar .user-label {
        max-width: 5rem;
        font-size: 0.72rem;
    }

    .holos-enterprise-page .acct-kpi {
        flex: 1 1 calc(50% - 0.35rem);
    }
}

/* Desktop wide ≥1440 */
@media (min-width: 1440px) {
    .holos-enterprise-shell .holos-content {
        padding-inline: var(--holos-space-5);
    }
}

@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: light;
    }
}

/* Tema oscuro (docs/design/tema-claro-oscuro.md): el hotel decide, no el sistema — por eso arriba
   se fuerza claro contra prefers-color-scheme, y el oscuro entra SOLO por data-theme en <html>.
   color-scheme: dark pone en oscuro los controles nativos (inputs, selects, scrollbars). */
:root[data-theme="dark"] {
    color-scheme: dark;
}