/* ============================================
   Styles for everything the API writes into the page
   (status strip, hours, skeletons).
   Uses the tokens defined in assets/css/site.css.
   ============================================ */

/* ---- Status strip ---- */
.status-strip {
    background: var(--ink);
    color: #f6efe4;
    font-size: .875rem;
    line-height: 1.4;
    padding: .55rem var(--gutter);
    text-align: center;
}
.status-strip.open { background: #1f4d2d; }
.status-strip.closed { background: var(--maroon-2); }
.status-strip.error { background: #4a3b30; }
.status-strip strong { font-weight: 700; }
.status-strip-inner {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    max-width: var(--max);
}
.status-strip-dot {
    flex: none;
    width: .5rem;
    height: .5rem;
    border-radius: 50%;
    background: #c9b8a6;
}
.status-strip.open .status-strip-dot { background: #6fd68c; box-shadow: 0 0 0 3px rgba(111, 214, 140, .22); }
.status-strip.closed .status-strip-dot { background: #ff9d8a; }

/* ---- Loading skeletons ---- */
.skel {
    display: inline-block;
    min-width: 9rem;
    height: .9em;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--paper-2) 0%, var(--line) 50%, var(--paper-2) 100%);
    background-size: 200% 100%;
    animation: skel 1.4s ease-in-out infinite;
    vertical-align: middle;
}
@keyframes skel { to { background-position: -200% 0; } }

/* ---- Hours table ---- */
.hours-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .7rem 0;
    border-bottom: 1px solid var(--line);
    font-size: .975rem;
}
.hours-row:last-child { border-bottom: 0; }
.hours-day em {
    font-style: normal;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--maroon);
    margin-left: .4rem;
}
.hours-row.is-today { font-weight: 600; }
.hours-time { text-align: right; font-variant-numeric: tabular-nums; }
.hours-time.is-closed { color: var(--muted); }

.hours-compact { list-style: none; margin: 0; padding: 0; }
.hours-compact li { display: flex; justify-content: space-between; gap: 1rem; padding: .25rem 0; }

/* ---- Ordering disabled (only if the feature flag is on) ---- */
body.ordering-disabled [data-order-url] {
    opacity: .5;
    pointer-events: none;
}