/* Theme C · On the Go — dark, photo-first, app-like.
   Loaded after style.css: re-maps the SEMANTIC tokens to a dark palette, then restyles a few blocks. */
.theme-c {
    --olive-300: #b9b97e;                         /* olive lifted for text on dark brown: 6.9:1 */
    --color-bg: var(--brown-900);
    --color-fg: var(--cream-100);
    --color-fg-muted: var(--sand-200);
    --color-surface: var(--brown-800);
    --color-surface-alt: #4a2e26;
    --color-accent: var(--olive-300);
    --color-border: rgb(var(--cream-rgb) / .12);
    --color-border-strong: rgb(var(--cream-rgb) / .28);
    --color-primary: var(--cream-100);
    --color-primary-hover: var(--sand-200);
    --color-primary-active: var(--sand-200);
    --color-on-primary: var(--brown-900);
    --color-overlay: rgb(0 0 0 / .6);
    --ring-color: var(--cream-100);
    --card-bg: var(--color-surface);
}
.theme-c .topbar { background: rgb(var(--brown-dark-rgb) / .94); }
.theme-c .cats { background: var(--color-bg); }

/* hero: the photo collage becomes a full-bleed photo backdrop behind the text */
.theme-c .hero { background: var(--brown-900); min-height: 560px; }
.theme-c .hero__collage { position: absolute; inset: 0; gap: 0; z-index: 0; }
.theme-c .hero__collage img { border-radius: 0; height: 100%; margin: 0 !important; aspect-ratio: auto; }
.theme-c .hero__collage::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(var(--brown-dark-rgb) / .92) 0%, rgb(var(--brown-dark-rgb) / .7) 45%, rgb(var(--brown-dark-rgb) / .25) 100%); }
.theme-c .hero__text { position: relative; z-index: 1; }
.theme-c .hero__tagline { font-size: clamp(var(--fs-3xl), 7vw, 5.5rem); text-transform: uppercase; line-height: .92; letter-spacing: -.02em; }
.theme-c .hero__mark { z-index: 1; color: rgb(var(--cream-rgb) / .1); }

/* home: category photo tiles */
.theme-c .cat-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: var(--space-4); }
.theme-c .cat-tile { position: relative; display: flex; align-items: flex-end; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--radius-xl); text-decoration: none; }
.theme-c .cat-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-slow) var(--ease-out); }
.theme-c .cat-tile span { position: relative; margin: var(--space-3); padding: var(--space-2) var(--space-4); border-radius: var(--radius-full); background: var(--cream-100); color: var(--brown-900); font-size: var(--fs-sm); font-weight: var(--fw-black); text-transform: uppercase; }
.theme-c .cat-tile:focus-visible { border-radius: var(--radius-xl); }
@media (hover: hover) { .theme-c .cat-tile:hover img { transform: scale(1.05); } }

/* dishes */
.theme-c .dish__img--logo { color: rgb(var(--cream-rgb) / .22); }
.theme-c .dish.is-picked { box-shadow: 0 0 0 2px var(--cream-100) inset; }
.theme-c .dish__note { color: var(--brown-900); }
/* QR menu: compact horizontal rows — thumbnail left, text right — quicker to scan on a phone */
.theme-c.qr .grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: var(--space-3); }
.theme-c.qr .dish { flex-direction: row; align-items: stretch; padding: var(--space-3); gap: var(--space-4); border-radius: var(--radius-xl); }
.theme-c.qr .dish__img { flex: none; width: 112px; height: 112px; aspect-ratio: auto; border-radius: var(--radius-md); align-self: flex-start; }
.theme-c.qr .dish__body { padding: 0; }
.theme-c.qr .dish__head { flex-direction: column; gap: var(--space-1); }
.theme-c.qr .dish__desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* order list on dark */
.theme-c .order-bar__count { background: var(--brown-900); color: var(--cream-100); }
.theme-c .qty button { background: var(--brown-900); color: var(--cream-100); }
.theme-c .qty button:hover { background: var(--brown-700); }

/* info site blocks */
.theme-c .menu-card { border: 1px solid var(--color-border); }
.theme-c .locs { background: var(--color-bg); }
.theme-c .loc { background: var(--color-surface); border: 1px solid var(--color-border); }
.theme-c .contacts { background: var(--olive-700); }
.theme-c .contacts .socials a { background: var(--cream-100); }
.theme-c .contact-form { background: var(--brown-900); }
.theme-c .contact-form input, .theme-c .contact-form select, .theme-c .contact-form textarea { color: var(--brown-900); }
.theme-c .contact-form__msg--ok { background: #35482a; color: #e4efd9; }
.theme-c .contact-form__msg--err { background: #5a2a1c; color: #f7dcd5; }

/* two-size rows: let the stepper drop under the label on narrow cards instead of overflowing */
.theme-c.qr .dish__sizes li { flex-wrap: wrap; row-gap: var(--space-1); }
.theme-c.qr .dish__sizes .dish__order { margin-left: auto; }
.theme-c.qr .dish__body { min-width: 0; }

@media (max-width: 720px) {
    .theme-c .hero { min-height: 0; }
    .theme-c .hero__collage::after { background: linear-gradient(180deg, rgb(var(--brown-dark-rgb) / .55) 0%, rgb(var(--brown-dark-rgb) / .9) 70%); }
    .theme-c.qr .dish__img { width: 88px; height: 88px; }
}
