/* ============================================================
   05-outlet.css  (5 of 6)

   Outlet and admin operational controls: per-item daily caps, the pause switch,
   and the delete danger zones.

   Part of an ordered set. The browser concatenates these in the order they
   are linked in fragments/head.html, and that order IS the cascade. Do not
   reorder the <link> tags, and do not move a rule between files without
   checking what it would then stop overriding.
   ============================================================ */

/* ============================================================
   OPERATIONAL CONTROLS — daily caps, outlet pause, danger zones.

   These belong to the outlet and admin portals, which share this
   stylesheet with the student app but deliberately keep the denser,
   flatter treatment (see the --color-surface note at the top). The
   student-facing piece here is .stock-note, which is why that one
   alone is built as a soft pill rather than a table-ish row.
   ============================================================ */

/* --- Per-item daily cap, on the outlet's own menu screen --- */
.daily-limit-row {
    margin-top: 0.75rem;
}

.daily-limit-bar {
    height: 6px;
    border-radius: 999px;
    background: var(--color-field);
    overflow: hidden;
}

.daily-limit-bar > span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: var(--color-primary);
    transition: width 200ms ease;
}

.daily-limit-text {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--color-ink-muted);
}

.daily-limit-text.is-low { color: var(--color-warning); }
.daily-limit-text.is-out { color: var(--color-danger); }

/* --- "Taking orders / paused" switch on the queue screen --- */
.outlet-switch {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 0.85rem 1.1rem;
    margin-bottom: 1.25rem;
    border-radius: var(--radius-sm);
    background: var(--color-primary-tint);
    /* Left rule rather than a full border: the state is the point, and a coloured
       edge reads at a glance from across a kitchen without shouting on the page. */
    border-left: 4px solid var(--color-primary);
}

.outlet-switch.is-paused {
    background: var(--color-warning-tint);
    border-left-color: var(--color-warning);
}

.outlet-switch__text strong {
    display: block;
    font-family: var(--font-display);
    font-size: 1.02rem;
    color: var(--color-ink);
}

.outlet-switch__text span {
    font-size: 0.85rem;
    color: var(--color-ink-muted);
}

/* --- Disclosure panels: cancel-with-reason, and outlet deletion --- */
.cancel-panel,
.danger-zone {
    margin-top: 0.5rem;
}

.cancel-panel > summary,
.danger-zone > summary {
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.4rem 0.7rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-danger);
    color: var(--color-danger);
    font-size: 0.85rem;
    font-weight: 600;
    background: transparent;
    transition: background-color 150ms ease;
}

/* Safari still paints its own disclosure triangle without this. */
.cancel-panel > summary::-webkit-details-marker,
.danger-zone > summary::-webkit-details-marker { display: none; }

.cancel-panel > summary:hover,
.danger-zone > summary:hover { background: var(--color-danger-tint); }

.cancel-panel[open] > summary,
.danger-zone[open] > summary { margin-bottom: 0.6rem; }

.cancel-panel form,
.danger-zone form {
    padding: 0.75rem;
    border-radius: var(--radius-sm);
    background: var(--color-danger-tint);
}

.danger-zone__warning {
    font-size: 0.82rem;
    line-height: 1.5;
    color: var(--color-ink-muted);
    margin-bottom: 0.6rem;
}

/* --- One canteen's row in the admin's tenant screen --- */
.outlet-admin-card {
    padding: 0.9rem;
    margin-bottom: 0.85rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: var(--color-surface);
}

.outlet-admin-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.6rem;
}

.outlet-admin-card__name {
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--color-ink);
}

/* --- Student-facing stock notes on a menu card --- */
.stock-note {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.3rem;
    padding: 0.12rem 0.5rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
}

.stock-note.is-low {
    color: var(--color-warning);
    background: var(--color-warning-tint);
}

.stock-note.is-out {
    color: var(--color-danger);
    background: var(--color-danger-tint);
}

/* --- Why an order in the history list was cancelled --- */
.order-card-reason {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.5rem;
    font-size: 0.8rem;
    color: var(--color-danger);
}