/* ==========================================================================
   Tema Nocturna · oscuro, urbano, cuadrícula de fotos
   ========================================================================== */

.theme-nocturna {
    --bg: #0B0B0F;
    --surface: #15151B;
    --surface-2: #1E1E26;
    --ink: #F5F5F7;
    --muted: #9A9AA5;
    --line: #26262E;
    --accent: #C8FF4D;
    --radius: 20px;
    --radius-s: 14px;
    --font-display: 'Space Grotesk', 'Inter', system-ui, sans-serif;
    --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --shadow-s: 0 2px 10px rgba(0, 0, 0, .5);
    --shadow: 0 18px 40px rgba(0, 0, 0, .55);
    color-scheme: dark;
}

.theme-nocturna .hero-media {
    height: 300px;
    background:
        radial-gradient(120% 90% at 80% 0%, color-mix(in srgb, var(--brand) 34%, transparent), transparent 60%),
        radial-gradient(90% 70% at 0% 30%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 55%),
        #0B0B0F;
}

.theme-nocturna .hero-media::after {
    background: linear-gradient(180deg, rgba(11, 11, 15, .15) 0%, rgba(11, 11, 15, .35) 45%, #0B0B0F 100%);
}

.theme-nocturna .hero-media img { opacity: .5; mix-blend-mode: luminosity; }

.theme-nocturna .hero-id { margin: -68px 18px 0; align-items: flex-end; }

.theme-nocturna .hero-logo {
    width: 64px;
    height: 64px;
    border-radius: 16px;
    border-color: #0B0B0F;
    background: var(--surface-2);
    color: var(--accent);
    box-shadow: 0 0 0 1px var(--line), 0 0 30px color-mix(in srgb, var(--accent) 22%, transparent);
}

.theme-nocturna .hero-name h1 {
    font-family: var(--font-display);
    font-size: 30px;
    font-weight: 700;
    letter-spacing: -.03em;
    text-transform: uppercase;
}

.theme-nocturna .hero-status { color: var(--accent); }
.theme-nocturna .table-chip { background: var(--accent); color: #0B0B0F; }
.theme-nocturna .table-chip::before { background: #0B0B0F; }

.theme-nocturna .tools .search-box { background: var(--surface); border-color: var(--line); border-radius: 14px; }

.theme-nocturna .cats {
    background: linear-gradient(180deg, #0B0B0F 78%, transparent);
    gap: 6px;
}

.theme-nocturna .chip {
    border-radius: 8px;
    background: var(--surface);
    border-color: var(--line);
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: 9px 12px;
}

.theme-nocturna .chip.active {
    background: var(--accent);
    border-color: var(--accent);
    color: #0B0B0F;
}

.theme-nocturna .featured .feat { background: var(--surface); border-color: var(--line); }
.theme-nocturna .feat-tag { background: var(--accent); color: #0B0B0F; }
.theme-nocturna .feat-body p { color: var(--muted); }

.theme-nocturna .cat-title {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -.02em;
    text-transform: uppercase;
}

.theme-nocturna .cat-title small { text-transform: none; letter-spacing: 0; }
.theme-nocturna .sub-title { color: var(--accent); }

.theme-nocturna .menu-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.theme-nocturna .dish {
    display: block;
    padding: 0;
    overflow: hidden;
    border-radius: 18px;
    background: var(--surface);
    border-color: var(--line);
    box-shadow: none;
}

.theme-nocturna .dish-media {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    border-radius: 0;
}

.theme-nocturna .dish-body { padding: 11px 12px 13px; }

.theme-nocturna .dish-head { display: block; }

.theme-nocturna .dish-head h3 { font-size: 13px; font-weight: 600; }

.theme-nocturna .dish-price {
    display: block;
    margin-top: 4px;
    color: var(--accent);
    font-family: var(--font-display);
    font-size: 15px;
    font-weight: 700;
}

.theme-nocturna .dish-desc { font-size: 11px; -webkit-line-clamp: 2; }

.theme-nocturna .dish-foot { padding-top: 9px; }
.theme-nocturna .add { background: var(--accent); color: #0B0B0F; box-shadow: none; }

.theme-nocturna .cartbar {
    background: var(--accent);
    color: #0B0B0F;
    border-radius: 14px;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .6), 0 0 30px color-mix(in srgb, var(--accent) 18%, transparent);
}

.theme-nocturna .cartbar-count { background: #0B0B0F; color: var(--accent); }
.theme-nocturna .cartbar-go { background: #0B0B0F; color: var(--accent); }

.theme-nocturna .panel { background: var(--surface); border: 1px solid var(--line); border-bottom: 0; }

.theme-nocturna .panel-head .icon-btn { background: var(--surface-2); color: var(--ink); }

.theme-nocturna .btn-primary {
    background: var(--accent);
    color: #0B0B0F;
    box-shadow: 0 12px 26px color-mix(in srgb, var(--accent) 22%, transparent);
}

.theme-nocturna .btn-ghost { background: var(--surface-2); color: var(--ink); }

.theme-nocturna .field input,
.theme-nocturna .field select,
.theme-nocturna .field textarea {
    background: var(--surface-2);
    border-color: var(--line);
    color: var(--ink);
}

.theme-nocturna .option-row { border-color: var(--line); }
.theme-nocturna .stepper { background: var(--surface-2); }
.theme-nocturna .stepper button { background: #0B0B0F; color: var(--ink); }

.theme-nocturna .site-foot { border-color: var(--line); }