/* FAI-P07-04..09 — Shared admin console primitives (UI_UX_PLAN §7): dense tables, form fields
   and status chips reused by every /admin screen. Global (not isolated) because the console is
   ten pages of the same shapes; page-specific styles stay in each page's razor.css. Everything
   rides the --fai-* tokens and the .fai-compact density the AdminLayout applies. */

/* --- Data tables (§7.4/§7.9 — the console's default layout) --- */
.admx-table-wrap {
    overflow-x: auto;
}

.admx-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--fai-density-text);
}

.admx-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 8px 12px;
    text-align: start;
    font-size: var(--fai-text-xs);
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--fai-ink-3);
    background: var(--fai-surface);
    border-bottom: 1px solid var(--fai-border-strong);
    white-space: nowrap;
}

.admx-table td {
    padding: 8px 12px;
    border-bottom: 1px solid var(--fai-border);
    color: var(--fai-ink-2);
    vertical-align: middle;
}

.admx-table tbody tr:hover {
    background: var(--fai-surface-2);
}

.admx-table .fai-numeric {
    font-variant-numeric: tabular-nums;
}

/* --- Status / meta chips --- */
.admx-status {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 10px;
    border-radius: var(--fai-radius-pill);
    font-size: var(--fai-text-xs);
    font-weight: 600;
    background: var(--fai-surface-2);
    color: var(--fai-ink-2);
    border: 1px solid var(--fai-border);
    white-space: nowrap;
}

.admx-status-draft { background: var(--fai-surface-3); color: var(--fai-ink-2); }
.admx-status-published { background: var(--fai-info-soft); color: var(--fai-info); border-color: transparent; }
.admx-status-live { background: var(--fai-success-soft); color: var(--fai-success); border-color: transparent; }
.admx-status-archived { background: var(--fai-surface-2); color: var(--fai-ink-3); }
.admx-status-valid { background: var(--fai-success-soft); color: var(--fai-success); border-color: transparent; }
.admx-status-duplicate { background: var(--fai-warning-soft); color: var(--fai-warning); border-color: transparent; }
.admx-status-invalid { background: var(--fai-danger-soft); color: var(--fai-danger); border-color: transparent; }
.admx-status-warning { background: var(--fai-warning-soft); color: var(--fai-warning); border-color: transparent; }
.admx-status-info { background: var(--fai-info-soft); color: var(--fai-info); border-color: transparent; }
.admx-status-active { background: var(--fai-success-soft); color: var(--fai-success); border-color: transparent; }
.admx-status-inactive { background: var(--fai-surface-2); color: var(--fai-ink-3); }

.admx-meta {
    display: block;
    font-size: var(--fai-text-xs);
    color: var(--fai-ink-3);
}

/* --- Form fields (sheet editors, filters) --- */
.admx-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.admx-label {
    font-size: var(--fai-text-xs);
    font-weight: 600;
    color: var(--fai-ink-2);
}

.admx-input,
.admx-select,
.admx-textarea {
    width: 100%;
    min-height: 36px;
    padding: 6px 10px;
    font-family: var(--fai-font-body);
    font-size: var(--fai-text-sm);
    color: var(--fai-ink);
    background: var(--fai-surface);
    border: 1px solid var(--fai-border-strong);
    border-radius: var(--fai-radius-sm);
    transition: border-color var(--fai-motion-fast) var(--fai-ease),
        box-shadow var(--fai-motion-fast) var(--fai-ease);
}

.admx-textarea {
    min-height: 120px;
    resize: vertical;
    font-family: var(--fai-font-mono);
    font-size: var(--fai-text-xs);
    line-height: 1.5;
}

.admx-input:focus,
.admx-select:focus,
.admx-textarea:focus {
    outline: none;
    border-color: var(--fai-primary);
    box-shadow: var(--fai-focus-ring);
}

.admx-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.admx-form-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}

/* --- Filter row (search + facet selects) --- */
.admx-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.admx-filters .admx-input,
.admx-filters .admx-select {
    width: auto;
    min-width: 140px;
}

/* --- Error banner --- */
.admx-error {
    margin: 0;
    padding: 10px 14px;
    border-radius: var(--fai-radius-sm);
    background: var(--fai-danger-soft);
    border: 1px solid var(--fai-border);
    color: var(--fai-danger);
    font-size: var(--fai-text-sm);
}

/* --- Paginator --- */
.admx-pager {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: flex-end;
    padding: 8px 12px;
    border-top: 1px solid var(--fai-border);
    font-size: var(--fai-text-sm);
    color: var(--fai-ink-3);
}

/* FAI-P07-06 — Full-bleed floor-plan editor (/admin/venue): pages hosting the editor (.fpe)
   unlock the app shell's reading-width cap (scoped .shell-content max-width 1160 + .adm
   max-width 1400) so the canvas gets the full viewport width. The extra .shell /
   .shell-content compound outranks those scoped rules in the cascade. */
.shell .shell-content:has(.fpe) {
    max-width: none;
    padding-inline: var(--fai-space-4);
}

.shell-content .adm:has(.fpe) {
    max-width: none;
}