:root {
    --local-sky: #dce8f6;
    --local-sky-deep: #bfd3ec;
    --local-ink: #15283a;
    --local-muted: #6f8192;
    --local-line: rgba(21, 40, 58, 0.1);
    --local-panel: rgba(255, 255, 255, 0.96);
    --local-panel-soft: #f7fafc;
    --local-accent: #4a97d2;
    --local-accent-strong: #247fc3;
    --local-accent-dark: #213344;
    --local-green: #5bcf78;
    --local-shadow: 0 22px 48px rgba(21, 40, 58, 0.14);
}

body.legacy-local-shell,
body[class*="dashboard"],
body .dashboard-page--local,
body .auth-page--local {
    background:
        linear-gradient(180deg, #f5f7fa 0%, #edf2f7 100%);
}

.local-shell {
    margin-bottom: 28px;
    color: #fff;
}

.local-shell__sky {
    background:
        linear-gradient(180deg, rgba(220, 232, 246, 0.72), rgba(191, 211, 236, 0.68)),
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.92), transparent 36%);
    border-top: 6px solid rgba(120, 209, 223, 0.5);
}

.local-shell__band {
    background:
        linear-gradient(180deg, rgba(30, 31, 34, 0.96), rgba(34, 35, 39, 0.96)),
        repeating-linear-gradient(
            -45deg,
            rgba(255, 255, 255, 0.02),
            rgba(255, 255, 255, 0.02) 6px,
            transparent 6px,
            transparent 12px
        );
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.local-shell__inner {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
}

.local-shell__inner--narrow {
    padding: 24px 0 22px;
    text-align: center;
}

.local-shell__utility {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 0 14px;
}

.local-shell__brand img {
    width: 168px;
    display: block;
}

.local-shell__meta {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    color: #fff;
    font-family: "Trebuchet MS", "Segoe UI", sans-serif;
    font-weight: 700;
    font-size: 0.92rem;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
}

.local-shell__meta a,
.local-shell__logout button {
    color: #fff;
    font: inherit;
    text-decoration: none;
    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
}

.local-shell__lang {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    min-height: 32px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.94);
    color: var(--local-ink);
    text-shadow: none;
}

.local-shell__logout {
    margin: 0;
}

.local-shell__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 0 0 10px;
}

.local-shell__nav-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 4px 4px 0 0;
    background: linear-gradient(180deg, #55afe8, #3d92cd);
    border: 1px solid rgba(255, 255, 255, 0.45);
    color: #fff;
    text-decoration: none;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 0.98rem;
    letter-spacing: 0.01em;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.32);
}

.local-shell__nav-item.is-active {
    background: linear-gradient(180deg, #2f3238, #202228);
}

.local-shell__inner--narrow h1 {
    margin: 0 0 6px;
    color: #fff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    line-height: 0.98;
}

.local-shell__inner--narrow p {
    margin: 0;
    color: rgba(255,255,255,0.66);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 0.98rem;
}

.legacy-local-shell .wrap,
.local-shell + .dashboard-page--local,
.local-shell + .auth-page--local {
    width: min(1100px, calc(100% - 40px));
    margin: 0 auto 46px;
}

.dashboard-page--local,
.auth-page--local {
    display: grid;
    gap: 22px;
}

.dashboard-page--local .dashboard-hero,
.legacy-local-shell .hero,
.legacy-local-shell .panel,
.legacy-local-shell .card,
.legacy-local-shell .report-box,
.dashboard-page--local .panel,
.dashboard-page--local .order-tile,
.dashboard-page--local .auth-card,
.dashboard-page--local .dashboard-hero,
.dashboard-page--local .menu-card {
    border: 1px solid rgba(24, 41, 57, 0.08);
    background: var(--local-panel);
    border-radius: 26px;
    box-shadow: var(--local-shadow);
    backdrop-filter: blur(14px);
}

.dashboard-page--local .dashboard-hero,
.legacy-local-shell .hero {
    background:
        linear-gradient(180deg, rgba(255,255,255,0.98), rgba(248, 251, 253, 0.95)),
        radial-gradient(circle at top right, rgba(74,151,210,0.12), transparent 30%);
    padding: 26px 28px;
}

.dashboard-page--local .dashboard-hero h1,
.legacy-local-shell h1,
.legacy-local-shell h2,
.legacy-local-shell h3,
.dashboard-page--local h1,
.dashboard-page--local h2,
.dashboard-page--local h3,
.auth-page--local h1 {
    color: #102338;
    font-family: "Trebuchet MS", "Segoe UI", sans-serif;
}

.dashboard-page--local .dashboard-hero p,
.legacy-local-shell p,
.dashboard-page--local p,
.auth-page--local p {
    color: var(--local-muted);
}

.dashboard-page--local .eyebrow,
.legacy-local-shell .eyebrow,
.auth-page--local .eyebrow {
    color: var(--local-accent-dark);
    letter-spacing: 0.16em;
    font-size: 0.72rem;
}

.dashboard-page--local .subnav {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 0;
}

.dashboard-page--local .subnav__item {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(24, 41, 57, 0.1);
    box-shadow: 0 12px 28px rgba(18, 35, 51, 0.08);
    color: #29445a;
    text-decoration: none;
    font-weight: 700;
}

.dashboard-page--local .subnav__item.is-active {
    background: linear-gradient(135deg, var(--local-accent), var(--local-accent-strong));
    color: #fff;
}

.dashboard-page--local .button,
.legacy-local-shell .button,
.legacy-local-shell .mini-button,
.auth-page--local .button {
    border-radius: 999px;
    min-height: 42px;
    padding: 0 18px;
    border: 1px solid transparent;
    font-family: "Trebuchet MS", "Segoe UI", sans-serif;
    font-weight: 700;
    box-shadow: 0 10px 24px rgba(21, 40, 58, 0.1);
}

.dashboard-page--local .button-primary,
.legacy-local-shell .button.primary {
    background: linear-gradient(135deg, var(--local-green), #49be67);
    color: #fff;
}

.dashboard-page--local .button-dark,
.legacy-local-shell .button.dark {
    background: linear-gradient(135deg, var(--local-accent-dark), #2f465b);
    color: #fff;
}

.dashboard-page--local .button-ghost,
.legacy-local-shell .button,
.legacy-local-shell .mini-button {
    background: rgba(255,255,255,0.95);
    border-color: rgba(16, 35, 56, 0.1);
    color: #173042;
}

.dashboard-page--local .button-danger {
    background: linear-gradient(135deg, #f06455, #de4a3a);
    color: #fff;
}

.legacy-local-shell input,
.legacy-local-shell select,
.legacy-local-shell textarea,
.dashboard-page--local input,
.dashboard-page--local select,
.dashboard-page--local textarea,
.auth-page--local input,
.auth-page--local select,
.auth-page--local textarea {
    border-radius: 16px;
    border: 1px solid rgba(21, 40, 58, 0.14);
    background: #fff;
    color: #172a3b;
    box-shadow: inset 0 1px 2px rgba(21, 40, 58, 0.04);
}

.legacy-local-shell .panel,
.legacy-local-shell .card,
.dashboard-page--local .panel,
.dashboard-page--local .order-tile,
.dashboard-page--local .auth-card {
    padding: 22px;
}

.legacy-local-shell .toolbar,
.legacy-local-shell .actions {
    gap: 12px;
}

.legacy-local-shell .metric,
.dashboard-page--local .metric-card,
.dashboard-page--local .order-summary-card,
.dashboard-page--local .faq-card,
.dashboard-page--local .category-card,
.dashboard-page--local .panel-nested {
    border-radius: 22px;
    border: 1px solid rgba(21, 40, 58, 0.08);
    background: linear-gradient(180deg, #ffffff, #f7fafc);
    box-shadow: 0 14px 26px rgba(21, 40, 58, 0.08);
}

.dashboard-page--local .order-tile__header,
.dashboard-page--local .panel-heading,
.dashboard-page--local .menu-card__top,
.dashboard-page--local .menu-card__bottom {
    gap: 16px;
}

.dashboard-page--local .status-pill,
.legacy-local-shell .pill,
.legacy-local-shell .badge {
    border-radius: 999px;
    background: rgba(74, 151, 210, 0.14);
    color: var(--local-accent-strong);
    font-weight: 700;
}

.dashboard-page--local .menu-type-tab {
    border-radius: 18px;
    border: 1px solid rgba(24, 41, 57, 0.1);
    background: rgba(255,255,255,0.92);
    box-shadow: 0 12px 28px rgba(18, 35, 51, 0.08);
}

.dashboard-page--local .menu-type-tab.is-active {
    background: linear-gradient(135deg, var(--local-accent), var(--local-accent-strong));
    color: #fff;
}

.dashboard-page--local .restaurant-media {
    border-radius: 18px;
}

.dashboard-page--local .auth-card {
    width: min(520px, 100%);
    margin: 0 auto;
}

.dashboard-page--local .auth-card__intro h1,
.auth-page--local .auth-card__intro h1 {
    font-size: clamp(2.2rem, 5vw, 4rem);
}

.legacy-local-shell table {
    width: 100%;
    border-collapse: collapse;
}

.legacy-local-shell th,
.legacy-local-shell td {
    padding: 13px 12px;
    border-bottom: 1px solid rgba(21, 40, 58, 0.08);
}

.legacy-local-shell tbody tr:nth-child(even) {
    background: rgba(74, 151, 210, 0.05);
}

.legacy-local-shell .empty-state {
    border-radius: 22px;
    border-color: rgba(21, 40, 58, 0.14);
    background: linear-gradient(180deg, #fff, #f8fbfd);
}

@media (max-width: 900px) {
    .local-shell__utility,
    .local-shell__nav {
        justify-content: flex-start;
    }

    .local-shell__meta {
        gap: 12px;
    }

    .local-shell__nav-item {
        min-height: 40px;
        font-size: 0.9rem;
    }

    .legacy-local-shell .wrap,
    .local-shell + .dashboard-page--local,
    .local-shell + .auth-page--local {
        width: min(100% - 20px, 100%);
    }
}

/* Legacy mirror v6: local backoffice */

body.legacy-local-shell,
body[class*="dashboard"],
body .dashboard-page--local,
body .auth-page--local {
    background:
        linear-gradient(180deg, #cfe0f4 0%, #e8eff7 220px, #f6f8fb 220px);
}

.local-shell {
    margin-bottom: 28px;
}

.local-shell__sky {
    background:
        linear-gradient(180deg, rgba(216, 229, 244, 0.78), rgba(193, 213, 236, 0.72)),
        radial-gradient(circle at top right, rgba(255,255,255,0.86), transparent 38%);
    border-top: 4px solid #b9eaf6;
}

.local-shell__inner {
    width: min(1180px, calc(100% - 28px));
}

.local-shell__utility {
    align-items: flex-start;
    padding: 18px 0 12px;
}

.local-shell__brand img {
    width: 154px;
}

.local-shell__meta {
    color: #ffffff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 0.95rem;
    text-shadow: 0 1px 2px rgba(27, 55, 79, 0.26);
}

.local-shell__lang {
    background: rgba(255,255,255,0.94);
    color: #213243;
    border: 1px solid rgba(255,255,255,0.54);
}

.local-shell__nav {
    gap: 4px;
    padding: 0 0 10px;
}

.local-shell__nav-item {
    min-height: 40px;
    padding: 0 14px;
    border-radius: 4px 4px 0 0;
    background: linear-gradient(180deg, #66b8ee, #4396cf);
    border: 1px solid rgba(255,255,255,0.46);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.36);
    color: #ffffff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 0.96rem;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}

.local-shell__nav-item.is-active {
    background: linear-gradient(180deg, #2f3238, #202228);
    color: #ffffff;
}

.local-shell__band {
    background:
        linear-gradient(180deg, rgba(30, 31, 34, 0.96), rgba(34, 35, 39, 0.96)),
        repeating-linear-gradient(-45deg, rgba(255,255,255,0.02), rgba(255,255,255,0.02) 6px, transparent 6px, transparent 12px);
    border-top: 1px solid rgba(255,255,255,0.16);
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.local-shell__inner--narrow {
    padding: 24px 0 22px;
}

.local-shell__inner--narrow h1 {
    color: #ffffff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.4rem, 4vw, 3.8rem);
    font-weight: 700;
    letter-spacing: -0.04em;
}

.local-shell__inner--narrow p {
    color: rgba(255,255,255,0.7);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1rem;
}

.local-shell + .dashboard-page--local,
.local-shell + .auth-page--local,
.legacy-local-shell .wrap {
    width: min(1120px, calc(100% - 36px));
    margin: 0 auto 44px;
}

.dashboard-page--local,
.auth-page--local {
    gap: 22px;
}

.dashboard-page--local .dashboard-hero,
.legacy-local-shell .hero {
    padding: 24px 26px;
    border-radius: 24px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.98), rgba(248, 251, 253, 0.96)),
        radial-gradient(circle at top right, rgba(97, 190, 228, 0.12), transparent 30%);
    border: 1px solid rgba(24, 41, 57, 0.08);
    box-shadow: 0 18px 34px rgba(24, 41, 57, 0.1);
}

.dashboard-page--local .dashboard-hero h1,
.dashboard-page--local h1,
.dashboard-page--local h2,
.dashboard-page--local h3,
.auth-page--local h1,
.legacy-local-shell h1,
.legacy-local-shell h2,
.legacy-local-shell h3 {
    font-family: "Trebuchet MS", "Segoe UI", sans-serif;
    color: #102338;
    letter-spacing: -0.03em;
}

.dashboard-page--local .dashboard-hero p,
.dashboard-page--local p,
.auth-page--local p,
.legacy-local-shell p {
    color: #6f8192;
}

.dashboard-page--local .subnav__item {
    min-height: 42px;
    border-radius: 999px;
    background: rgba(255,255,255,0.92);
    color: #28445a;
    font-size: 0.88rem;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
}

.dashboard-page--local .subnav__item.is-active {
    background: linear-gradient(135deg, #4a97d2, #247fc3);
    color: #ffffff;
}

.dashboard-page--local .panel,
.dashboard-page--local .order-tile,
.dashboard-page--local .auth-card,
.legacy-local-shell .panel,
.legacy-local-shell .card,
.legacy-local-shell .report-box {
    border-radius: 22px;
    background: rgba(255,255,255,0.97);
    border: 1px solid rgba(24, 41, 57, 0.08);
    box-shadow: 0 16px 28px rgba(24, 41, 57, 0.08);
}

.dashboard-page--local .metric-card,
.dashboard-page--local .order-summary-card,
.dashboard-page--local .faq-card,
.dashboard-page--local .category-card,
.dashboard-page--local .panel-nested {
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f7fafc);
}

.dashboard-page--local .status-pill,
.legacy-local-shell .pill,
.legacy-local-shell .badge {
    background: rgba(74, 151, 210, 0.14);
    color: #247fc3;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
}

.dashboard-page--local .button-primary,
.legacy-local-shell .button.primary {
    background: linear-gradient(135deg, #61bee4, #4a97d2);
    color: #ffffff;
}

.dashboard-page--local .button-dark,
.legacy-local-shell .button.dark {
    background: linear-gradient(135deg, #2f3238, #202228);
    color: #ffffff;
}

@media (max-width: 900px) {
    .local-shell + .dashboard-page--local,
    .local-shell + .auth-page--local,
    .legacy-local-shell .wrap {
        width: min(100% - 16px, 100%);
    }
}
