/* ============================================================
   QUERU CENTRAL — Design System
   Hierarquia visual pensada para o dono de negócio brasileiro.
   Stack: Vanilla CSS + Lucide Icons
   ============================================================ */

:root {
    /* ---- Palette (Queru DNA — from queru-saas theme) ---- */
    --q-primary: #D91E0D;
    --q-primary-dark: #BF0413;
    --q-primary-soft: color-mix(in srgb, var(--q-primary) 10%, #ffffff);
    --q-primary-soft-hover: color-mix(in srgb, var(--q-primary) 18%, #ffffff);

    --q-success: #059669;
    --q-success-dark: #047857;
    --q-success-soft: color-mix(in srgb, var(--q-success) 13%, #ffffff);

    --q-danger: #DC2626;
    --q-danger-soft: #FEF2F2;

    --q-warning: #D97706;
    --q-warning-soft: #FFFBEB;
    --q-link: #2563EB;
    --q-link-soft: color-mix(in srgb, var(--q-link) 10%, #ffffff);

    --q-bg: #FFFDF9;
    --q-bg-warm: #FAF1E6;
    --q-surface: #FFFFFF;
    --q-surface-alt: rgba(255, 255, 255, 0.92);
    --q-secondary: #F6F2EC;
    --q-muted: #F5EFE7;
    --q-accent: #FFF3EE;

    --q-border: #E9DDD1;
    --q-border-light: rgba(233, 221, 209, 0.6);

    --q-note-bg: #FEF3C7;
    --q-note-border: rgba(217, 30, 13, 0.28);

    /* ---- Text ---- */
    --q-text-primary: #1A1A1A;
    --q-text-secondary: #5B5B5B;
    --q-text-tertiary: #98A2B3;
    --q-text-muted: #6B5E57;
    --q-text-inverse: #FFFFFF;

    /* ---- Typography ---- */
    --q-font: "Avenir Next", "SF Pro Text", "Segoe UI", "Helvetica Neue", "Nunito Sans", sans-serif;
    --q-font-display: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;

    --q-text-2xs: 0.6875rem;   /* 11px — kickers */
    --q-text-xs: 0.75rem;      /* 12px — help, meta */
    --q-text-sm: 0.8125rem;    /* 13px — body small */
    --q-text-base: 0.875rem;   /* 14px — body */
    --q-text-md: 0.9375rem;    /* 15px — card titles */
    --q-text-lg: 1.0625rem;    /* 17px — section titles */
    --q-text-xl: 1.25rem;      /* 20px — page titles */
    --q-text-2xl: 1.5rem;      /* 24px — hero */
    --q-text-3xl: clamp(1.625rem, 2.2vw, 2rem); /* hero greeting */

    /* ---- Spacing ---- */
    --q-space-1: 4px;
    --q-space-2: 8px;
    --q-space-3: 12px;
    --q-space-4: 16px;
    --q-space-5: 20px;
    --q-space-6: 24px;
    --q-space-7: 28px;
    --q-space-8: 32px;
    --q-space-10: 40px;

    /* ---- Modal widths ---- */
    --q-modal-width-work: min(860px, calc(100vw - 40px));
    --q-modal-width-work-wide: min(1240px, calc(100vw - 40px));
    --q-modal-width-compact: min(420px, calc(100vw - 32px));

    /* ---- Radius ---- */
    --q-radius-sm: 6px;
    --q-radius-md: 8px;
    --q-radius-lg: 12px;
    --q-radius-xl: 16px;
    --q-radius-2xl: 20px;
    --q-radius-full: 999px;

    /* ---- Shadows ---- */
    --q-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
    --q-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
    --q-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.06);
    --q-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.08);
    --q-shadow-primary: 0 4px 14px rgba(217, 30, 13, 0.18);

    /* ---- Transitions ---- */
    --q-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --q-duration: 150ms;
}

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
[hidden] { display: none !important; }

body.queru-admin-body {
    font-family: var(--q-font);
    font-size: var(--q-text-base);
    line-height: 1.5;
    color: var(--q-text-primary);
    background: var(--q-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ============================================================
   LAYOUT SHELL
   ============================================================ */
.queru-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 240px 1fr;
}

/* ============================================================
   SIDEBAR
   ============================================================ */
.queru-sidebar {
    position: sticky;
    top: 0;
    align-self: start;
    height: 100vh;
    padding: var(--q-space-5);
    border-right: 1px solid var(--q-border-light);
    background: linear-gradient(180deg, rgba(255, 253, 249, 0.97) 0%, rgba(250, 241, 230, 0.97) 100%);
    backdrop-filter: blur(20px);
    overflow-y: auto;
}

.queru-sidebar__inner {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    gap: var(--q-space-5);
}

.brand-lockup {
    display: grid;
    gap: var(--q-space-3);
}

.brand-logo {
    width: 120px;
    height: auto;
}

/* Status pill — shows actual store status */
.status-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    padding: 5px 10px;
    border-radius: var(--q-radius-full);
    font-size: var(--q-text-2xs);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    transition: var(--q-duration) var(--q-ease);
}

.status-pill--open {
    background: var(--q-success-soft);
    color: var(--q-success-dark);
    border: 1px solid color-mix(in srgb, var(--q-success) 16%, transparent);
}

.status-pill--closed {
    background: var(--q-danger-soft);
    color: var(--q-danger);
    border: 1px solid color-mix(in srgb, var(--q-danger) 16%, transparent);
}

.status-pill--paused {
    background: var(--q-danger-soft);
    color: var(--q-danger);
    border: 1px solid color-mix(in srgb, var(--q-danger) 16%, transparent);
}

.status-pill__dot {
    width: 7px;
    height: 7px;
    border-radius: var(--q-radius-full);
    flex-shrink: 0;
}

.status-pill--open .status-pill__dot {
    background: var(--q-success);
    box-shadow: 0 0 0 0 rgba(5, 150, 105, 0.3);
    animation: pulse-dot 2.5s infinite;
}

.status-pill--closed .status-pill__dot { background: var(--q-danger); }
.status-pill--paused .status-pill__dot { background: var(--q-danger); }

@keyframes pulse-dot {
    0%   { box-shadow: 0 0 0 0 rgba(5, 150, 105, 0.3); }
    70%  { box-shadow: 0 0 0 6px rgba(5, 150, 105, 0); }
    100% { box-shadow: 0 0 0 0 rgba(5, 150, 105, 0); }
}

/* ---- Sidebar Nav ---- */
.sidebar-nav {
    display: grid;
    gap: 2px;
    margin-top: var(--q-space-5);
}

.sidebar-link {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 12px;
    border-radius: var(--q-radius-md);
    border: 1px solid transparent;
    background: transparent;
    color: var(--q-text-secondary);
    font-size: var(--q-text-sm);
    font-weight: 500;
    text-align: left;
    cursor: pointer;
    transition: var(--q-duration) var(--q-ease);
}

.sidebar-link:hover {
    background: rgba(255, 255, 255, 0.7);
    color: var(--q-text-primary);
}

.sidebar-link.is-active {
    background: var(--q-surface);
    border-color: var(--q-border-light);
    color: var(--q-text-primary);
    font-weight: 600;
    box-shadow: var(--q-shadow-xs);
}

.sidebar-link .lucide {
    width: 18px;
    height: 18px;
    stroke-width: 1.8;
    flex-shrink: 0;
    color: var(--q-text-tertiary);
    transition: var(--q-duration) var(--q-ease);
}

.sidebar-link:hover .lucide,
.sidebar-link.is-active .lucide {
    color: var(--q-primary);
}

/* ---- Sidebar Footer ---- */
.sidebar-footer {
    display: grid;
    gap: var(--q-space-3);
    padding-top: var(--q-space-4);
    border-top: 1px solid var(--q-border-light);
}

.store-context-shell {
    display: grid;
}

.store-context-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border-radius: var(--q-radius-xl);
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
    box-shadow: var(--q-shadow-xs);
}

.store-context-card__eyebrow {
    margin: 0;
    min-width: 0;
    font-size: var(--q-text-2xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.store-context-card__title-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.store-context-card__lead {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 14px;
    background: var(--q-primary-soft);
    color: var(--q-primary);
}

.store-context-card__lead .lucide {
    width: 18px;
    height: 18px;
}

.store-context-card__content {
    min-width: 0;
    display: grid;
    gap: 8px;
}

.store-context-card__name {
    margin: 0;
    min-width: 0;
    font-size: var(--q-text-lg);
    font-weight: 700;
    line-height: 1.15;
    color: var(--q-text-primary);
    word-break: break-word;
}

.store-context-card__select-wrap {
    position: relative;
    width: 100%;
}

.store-context-card__select {
    min-height: 48px;
    width: 100%;
    font-weight: 700;
    padding-right: 44px;
    appearance: none;
    -webkit-appearance: none;
    background-image: none;
}

.store-context-card__select-icon {
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
    pointer-events: none;
    color: var(--q-text-muted);
    display: inline-flex;
}

.store-context-card__select-icon .lucide {
    width: 16px;
    height: 16px;
}

.store-context-card__status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 36px;
    padding: 0 12px;
    border-radius: 16px;
    font-size: var(--q-text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border: 1px solid transparent;
}

.store-context-card__status-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    flex-shrink: 0;
}

.store-context-card__status--open {
    background: var(--q-success-soft);
    color: var(--q-success-dark);
    border-color: color-mix(in srgb, var(--q-success) 18%, transparent);
}

.store-context-card__status--open .store-context-card__status-dot {
    background: var(--q-success);
}

.store-context-card__status--closed {
    background: var(--q-danger-soft);
    color: var(--q-danger);
    border-color: color-mix(in srgb, var(--q-danger) 18%, transparent);
}

.store-context-card__status--closed .store-context-card__status-dot {
    background: var(--q-danger);
}

.store-context-card__status--paused {
    background: var(--q-danger-soft);
    color: var(--q-danger);
    border-color: color-mix(in srgb, var(--q-danger) 18%, transparent);
}

.store-context-card__status--paused .store-context-card__status-dot {
    background: var(--q-danger);
}

/* ============================================================
   BUTTONS
   ============================================================ */
.primary-button,
.secondary-button,
.danger-button,
.ghost-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 36px;
    padding: 0 14px;
    border-radius: var(--q-radius-md);
    font-size: var(--q-text-sm);
    font-weight: 600;
    cursor: pointer;
    transition: var(--q-duration) var(--q-ease);
    white-space: nowrap;
}

.primary-button {
    user-select: none;
    border: none;
    color: var(--q-text-inverse);
    background: var(--q-primary);
    box-shadow: var(--q-shadow-primary);
}

.primary-button:hover {
    background: var(--q-primary-dark);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(217, 30, 13, 0.22);
}

.primary-button:active {
    transform: translateY(0);
    box-shadow: var(--q-shadow-xs);
}
.primary-button:focus-visible {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--q-primary) 12%, transparent);
}

.secondary-button {
    user-select: none;
    border: 1px solid var(--q-border);
    background: var(--q-surface);
    color: var(--q-text-secondary);
}

.secondary-button:hover {
    border-color: var(--q-primary);
    color: var(--q-primary);
    background: var(--q-primary-soft);
}
.secondary-button:focus-visible {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
}

.danger-button {
    border: 1px solid color-mix(in srgb, var(--q-danger) 16%, transparent);
    background: var(--q-danger-soft);
    color: var(--q-danger);
}

.danger-button:hover {
    background: color-mix(in srgb, var(--q-danger) 8%, #ffffff);
    border-color: color-mix(in srgb, var(--q-danger) 28%, transparent);
}

.ghost-button {
    border: 1px dashed var(--q-border);
    background: transparent;
    color: var(--q-text-secondary);
}

.ghost-button:hover {
    border-color: var(--q-primary);
    color: var(--q-primary);
    background: var(--q-primary-soft);
}

.primary-button:disabled,
.secondary-button:disabled,
.danger-button:disabled,
.ghost-button:disabled {
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.primary-button:disabled {
    background: color-mix(in srgb, var(--q-primary) 16%, #ffffff);
    color: color-mix(in srgb, var(--q-text-primary) 54%, #ffffff);
}

.secondary-button:disabled,
.danger-button:disabled,
.ghost-button:disabled {
    border-color: rgba(163, 126, 95, 0.18);
    background: rgba(255, 255, 255, 0.68);
    color: color-mix(in srgb, var(--q-text-tertiary) 88%, #ffffff);
}

.btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: var(--q-radius-sm);
    border: 1px solid var(--q-border);
    background: var(--q-surface);
    color: var(--q-text-tertiary);
    cursor: pointer;
    transition: var(--q-duration) var(--q-ease);
}

.btn-icon:hover {
    color: var(--q-primary);
    border-color: var(--q-primary);
    background: var(--q-primary-soft);
}

.btn-icon .lucide {
    width: 15px;
    height: 15px;
}

/* ============================================================
   MAIN CONTENT
   ============================================================ */
.queru-main {
    padding: var(--q-space-6);
    max-width: 1200px;
}

/* ---- Page Header ---- */
.panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--q-space-4);
    margin-bottom: var(--q-space-5);
}

.panel-header__text {
    flex: 1;
    min-width: 0;
}

.page-kicker {
    margin: 0;
    font-size: var(--q-text-2xs);
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--q-primary);
}

.page-title {
    margin: 4px 0 0;
    font-size: var(--q-text-xl);
    line-height: 1.2;
    letter-spacing: -0.02em;
    font-weight: 700;
    color: var(--q-text-primary);
}

.page-copy {
    margin: 4px 0 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-sm);
    line-height: 1.5;
    max-width: 560px;
}

/* ---- Feedback Bar ---- */
.feedback-bar {
    margin-bottom: var(--q-space-4);
    padding: 10px 14px;
    border-radius: var(--q-radius-md);
    font-size: var(--q-text-sm);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 8px;
}

.feedback-bar.success {
    border: 1px solid color-mix(in srgb, var(--q-success) 20%, transparent);
    background: var(--q-success-soft);
    color: var(--q-success-dark);
}

.feedback-bar.error {
    border: 1px solid color-mix(in srgb, var(--q-danger) 20%, transparent);
    background: var(--q-danger-soft);
    color: var(--q-danger);
}

/* ============================================================
   SECTIONS
   ============================================================ */
.panel-section { /* visible when active */ }

.section-stack {
    display: grid;
    gap: var(--q-space-5);
}

/* ============================================================
   DASHBOARD — HERO
   ============================================================ */
.dashboard-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--q-space-6);
    padding: var(--q-space-6);
    border-radius: var(--q-radius-xl);
    background: var(--q-surface);
    border: 1px solid var(--q-border-light);
    box-shadow: var(--q-shadow-sm);
}

.dashboard-hero__content {
    display: grid;
    gap: var(--q-space-4);
    align-content: start;
}

.dashboard-hero__greeting {
    margin: 0;
    font-size: var(--q-text-3xl);
    line-height: 1.1;
    letter-spacing: -0.03em;
    font-weight: 700;
    color: var(--q-text-primary);
}

.dashboard-hero__subtitle {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-base);
    line-height: 1.5;
    max-width: 480px;
}

.dashboard-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.quick-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 34px;
    padding: 0 12px;
    border-radius: var(--q-radius-sm);
    border: 1px solid var(--q-border);
    background: var(--q-surface);
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    font-weight: 500;
    cursor: pointer;
    transition: var(--q-duration) var(--q-ease);
}

.quick-link:hover {
    border-color: var(--q-primary);
    color: var(--q-primary);
    background: var(--q-primary-soft);
}

.quick-link .lucide {
    width: 14px;
    height: 14px;
}

/* ---- Status Card (inside hero) ---- */
.dashboard-hero__side {
    display: grid;
    gap: var(--q-space-3);
    align-content: start;
    min-width: 260px;
}

.status-card {
    padding: var(--q-space-4);
    border-radius: var(--q-radius-lg);
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
}

.status-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--q-space-2);
}

.status-card__label {
    margin: 0;
    font-size: var(--q-text-2xs);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.status-card__title {
    margin: 4px 0 0;
    font-size: var(--q-text-md);
    font-weight: 600;
    color: var(--q-text-primary);
}

.status-card__helper {
    margin: 4px 0 0;
    font-size: var(--q-text-xs);
    color: var(--q-text-secondary);
    line-height: 1.4;
}

/* ---- Status Toggle Button ---- */
.status-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 34px;
    width: 240px;
    min-width: 240px;
    justify-content: space-between;
    padding: 0 10px 0 14px;
    border-radius: var(--q-radius-full);
    border: none;
    color: var(--q-text-inverse);
    font-size: var(--q-text-2xs);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: var(--q-duration) var(--q-ease);
    flex-shrink: 0;
}

.status-toggle:hover { transform: translateY(-1px); }
.status-toggle:active { transform: translateY(0); }

.status-toggle--open { background: var(--q-success); }
.status-toggle--closed { background: var(--q-danger); }
.status-toggle--paused { background: var(--q-danger); }

.status-toggle__label {
    min-width: 0;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
}

.status-toggle__thumb {
    position: relative;
    width: 38px;
    height: 22px;
    border-radius: var(--q-radius-full);
    background: rgba(255, 255, 255, 0.2);
}

.status-toggle__thumb::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: var(--q-radius-full);
    background: var(--q-surface);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    transition: var(--q-duration) var(--q-ease);
}

.status-toggle[data-enabled="true"] .status-toggle__thumb::after {
    transform: translateX(16px);
}

/* ---- Store identity card (in hero) ---- */
.store-identity {
    display: flex;
    align-items: center;
    gap: var(--q-space-3);
    padding: var(--q-space-3);
    border-radius: var(--q-radius-lg);
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
}

.store-identity__avatar {
    width: 40px;
    height: 40px;
    border-radius: var(--q-radius-md);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--q-primary);
    color: var(--q-text-inverse);
    font-size: var(--q-text-base);
    font-weight: 700;
    flex-shrink: 0;
}

.store-identity__name {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 600;
    color: var(--q-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.store-identity__slogan {
    margin: 2px 0 0;
    font-size: var(--q-text-xs);
    color: var(--q-text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ============================================================
   METRIC CARDS
   ============================================================ */
.metric-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--q-space-3);
}

.metric-card {
    padding: var(--q-space-4);
    border-radius: var(--q-radius-lg);
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
    display: grid;
    gap: 2px;
}

.metric-card__icon {
    width: 28px;
    height: 28px;
    border-radius: var(--q-radius-sm);
    background: var(--q-primary-soft);
    color: var(--q-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--q-space-2);
}

.metric-card__icon .lucide {
    width: 14px;
    height: 14px;
}

.metric-card__label {
    margin: 0;
    font-size: var(--q-text-2xs);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.metric-card__value {
    margin: 4px 0 0;
    font-size: var(--q-text-2xl);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.03em;
    color: var(--q-text-primary);
}

.metric-card__copy {
    margin: 6px 0 0;
    font-size: var(--q-text-xs);
    line-height: 1.4;
    color: var(--q-text-secondary);
}

/* ============================================================
   INFO GRID — Dashboard bottom
   ============================================================ */
.info-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: var(--q-space-4);
}

/* ---- Section Cards ---- */
.section-card {
    padding: var(--q-space-5);
    border-radius: var(--q-radius-xl);
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
    box-shadow: var(--q-shadow-xs);
}

.note-card {
    padding: var(--q-space-5);
    border-radius: var(--q-radius-xl);
    border: 1px dashed var(--q-note-border);
    background: linear-gradient(180deg, var(--q-surface) 0%, color-mix(in srgb, var(--q-note-bg) 20%, #ffffff) 100%);
}

.section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--q-space-3);
    margin-bottom: var(--q-space-4);
}

.section-kicker {
    margin: 0;
    font-size: var(--q-text-2xs);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-primary);
}

.section-title {
    margin: 4px 0 0;
    font-size: var(--q-text-md);
    line-height: 1.3;
    font-weight: 600;
    color: var(--q-text-primary);
}

.section-copy {
    margin: 4px 0 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.5;
}

/* ---- Bullet list (dashboard focus) ---- */
.bullet-list {
    display: grid;
    gap: var(--q-space-2);
    margin-top: var(--q-space-3);
}

.bullet-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--q-radius-md);
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
    transition: var(--q-duration) var(--q-ease);
}

.bullet-item:hover {
    border-color: var(--q-border);
}

.bullet-item__icon {
    width: 28px;
    height: 28px;
    border-radius: var(--q-radius-sm);
    background: var(--q-primary-soft);
    color: var(--q-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.bullet-item__icon .lucide {
    width: 14px;
    height: 14px;
}

.bullet-item__title {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 600;
    color: var(--q-text-primary);
}

.bullet-item__copy {
    margin: 2px 0 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.4;
}

/* ---- Surface rows (store snapshot) ---- */
.surface-stack {
    display: grid;
    gap: var(--q-space-2);
}

.surface-row {
    padding: 10px 12px;
    border-radius: var(--q-radius-md);
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 2px;
    align-items: start;
}

.surface-row__label {
    margin: 0;
    font-size: var(--q-text-2xs);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
    font-weight: 600;
    grid-column: 1 / -1;
}

.surface-row__value {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 600;
    color: var(--q-text-primary);
}

.surface-row__helper {
    margin: 0;
    font-size: var(--q-text-xs);
    color: var(--q-text-secondary);
    grid-column: 1 / -1;
}

/* ============================================================
   TAB BAR — Cardápio sub-sections
   ============================================================ */
.tab-bar {
    display: flex;
    gap: 2px;
    padding: 3px;
    border-radius: var(--q-radius-md);
    background: color-mix(in srgb, var(--q-border) 30%, var(--q-bg));
    width: fit-content;
    margin-bottom: var(--q-space-4);
}

.tab-btn {
    padding: 7px 16px;
    border: none;
    border-radius: var(--q-radius-sm);
    background: transparent;
    color: var(--q-text-secondary);
    font-size: var(--q-text-sm);
    font-weight: 500;
    cursor: pointer;
    transition: var(--q-duration) var(--q-ease);
}

.tab-btn:hover {
    color: var(--q-text-primary);
}

.tab-btn.is-active {
    background: var(--q-surface);
    color: var(--q-text-primary);
    font-weight: 600;
    box-shadow: var(--q-shadow-xs);
}

.tab-panel { /* shown by default */ }

/* ============================================================
   EDITOR LAYOUT — Form + List
   ============================================================ */
.editor-layout {
    display: grid;
    grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
    gap: var(--q-space-4);
    align-items: start;
}

.editor-panel {
    position: sticky;
    top: var(--q-space-6);
}

/* Form editing state indicator */
.editor-panel.is-editing {
    border-color: var(--q-primary);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--q-primary) 12%, transparent);
}

.editing-indicator {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: var(--q-radius-sm);
    background: var(--q-primary-soft);
    color: var(--q-primary);
    font-size: var(--q-text-xs);
    font-weight: 600;
    margin-bottom: var(--q-space-3);
}

.editing-indicator .lucide {
    width: 13px;
    height: 13px;
}

.editing-indicator__dismiss {
    margin-left: auto;
    background: none;
    border: none;
    color: var(--q-primary);
    cursor: pointer;
    padding: 2px;
    display: inline-flex;
}

.editing-indicator__dismiss .lucide {
    width: 12px;
    height: 12px;
}

.editor-list {
    min-width: 0;
}

/* ============================================================
   FORMS
   ============================================================ */
.field-grid {
    display: grid;
    gap: var(--q-space-3);
    grid-template-columns: repeat(2, 1fr);
    align-items: start;
}

.field-grid--wide {
    grid-template-columns: repeat(3, 1fr);
}

.field {
    display: grid;
    gap: 4px;
}

.field--full {
    grid-column: 1 / -1;
}

.field-label {
    margin: 0;
    font-size: var(--q-text-xs);
    font-weight: 600;
    color: var(--q-text-primary);
}

.field-help {
    margin: 0;
    font-size: var(--q-text-2xs);
    line-height: 1.4;
    color: var(--q-text-secondary);
}

.input,
.textarea,
.select {
    width: 100%;
    min-height: 36px;
    padding: 0 10px;
    padding-right: 38px;
    border-radius: var(--q-radius-sm);
    border: 1px solid var(--q-border);
    background: var(--q-surface);
    color: var(--q-text-primary);
    font-size: var(--q-text-sm);
    transition: var(--q-duration) var(--q-ease);
}

.textarea {
    min-height: 72px;
    resize: vertical;
    padding: 8px 10px;
}

.input:focus,
.textarea:focus,
.select:focus {
    outline: none;
    border-color: var(--q-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-primary) 8%, transparent);
}

.form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--q-space-2);
    margin-top: var(--q-space-2);
}

/* ============================================================
   SEARCH BAR
   ============================================================ */
.search-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 10px;
    border-radius: var(--q-radius-sm);
    border: 1px solid var(--q-border);
    background: var(--q-surface);
    transition: var(--q-duration) var(--q-ease);
}

.search-bar:focus-within {
    border-color: var(--q-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-primary) 8%, transparent);
}

.search-bar input {
    width: 100%;
    border: none;
    outline: none;
    background: transparent;
    font-size: var(--q-text-sm);
    color: var(--q-text-primary);
}

.search-bar__icon {
    color: var(--q-text-tertiary);
    display: inline-flex;
    flex-shrink: 0;
}

.search-bar__icon .lucide {
    width: 15px;
    height: 15px;
}

/* ============================================================
   LIST CARDS — Items, Categories, Hours, etc.
   ============================================================ */
.list-stack {
    display: grid;
    gap: var(--q-space-2);
}

.list-card {
    padding: var(--q-space-3) var(--q-space-4);
    border-radius: var(--q-radius-lg);
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
    display: grid;
    gap: var(--q-space-2);
    transition: var(--q-duration) var(--q-ease);
}

.list-card:hover {
    border-color: var(--q-border);
    box-shadow: var(--q-shadow-xs);
}

.list-card--current {
    border-color: color-mix(in srgb, var(--q-primary) 26%, var(--q-border-light));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--q-primary) 14%, transparent), var(--q-shadow-xs);
}

.queru-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: grid;
    place-items: center;
    padding: var(--q-space-6);
}

.queru-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(6, 14, 31, 0.58);
    backdrop-filter: blur(6px);
}

.queru-modal__dialog {
    position: relative;
    width: min(100%, 560px);
    padding: var(--q-space-7);
    border-radius: 28px;
    background: rgba(255, 253, 249, 0.98);
    border: 1px solid rgba(148, 163, 184, 0.22);
    box-shadow: 0 30px 70px rgba(15, 23, 42, 0.18);
}

.list-card__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--q-space-3);
}

.list-card__title {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 600;
    color: var(--q-text-primary);
}

.list-card__copy {
    margin: 2px 0 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.4;
}

/* ---- Meta chips ---- */
.meta-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.meta-chip {
    display: inline-flex;
    align-items: center;
    height: 22px;
    padding: 0 8px;
    border-radius: var(--q-radius-full);
    font-size: var(--q-text-2xs);
    font-weight: 600;
}

.meta-chip.success {
    background: var(--q-success-soft);
    color: var(--q-success-dark);
}

.meta-chip.alert {
    background: var(--q-primary-soft);
    color: var(--q-primary);
}

.meta-chip.accent {
    background: color-mix(in srgb, var(--q-primary) 12%, #ffffff);
    color: color-mix(in srgb, var(--q-primary) 86%, #8a2d12);
}

.meta-chip.muted {
    background: color-mix(in srgb, var(--q-border) 40%, var(--q-bg));
    color: var(--q-text-secondary);
}

.card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.input--error {
    border-color: color-mix(in srgb, var(--q-danger) 68%, var(--q-border));
    background: color-mix(in srgb, var(--q-danger-soft) 72%, #ffffff);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-danger) 10%, transparent);
}

.switch--success input:checked + .switch__track {
    background: var(--q-success);
}

/* ============================================================
   HOURS BOARD — Weekly inline schedule
   ============================================================ */
.hours-board {
    padding: 0;
    overflow: visible;
}

.hours-board__toolbar {
    display: grid;
    gap: var(--q-space-4);
    padding: var(--q-space-5);
    border-bottom: 1px solid var(--q-border-light);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 251, 245, 0.82) 100%);
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}

.hours-board__toolbar-main {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--q-space-4);
}

.hours-board__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--q-space-2);
    justify-content: flex-end;
}

.hours-board__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--q-space-2);
}

.hours-board__notice {
    display: flex;
    align-items: center;
    gap: var(--q-space-2);
    margin: 0 var(--q-space-5);
    padding: 12px 14px;
    border-radius: 16px;
    border: 1px solid var(--q-border-light);
    background: rgba(255, 255, 255, 0.82);
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    font-weight: 600;
}

.hours-board__notice .lucide {
    width: 16px;
    height: 16px;
}

.hours-board__notice--muted {
    background: color-mix(in srgb, var(--q-note-bg) 18%, #ffffff);
    border-color: color-mix(in srgb, var(--q-note-border) 42%, transparent);
    color: var(--q-text-secondary);
}

.hours-board__notice--success {
    background: color-mix(in srgb, var(--q-success-soft) 68%, #ffffff);
    border-color: color-mix(in srgb, var(--q-success) 18%, transparent);
    color: var(--q-success-dark);
}

.hours-board__notice--warning {
    background: color-mix(in srgb, var(--q-warning-soft) 72%, #ffffff);
    border-color: color-mix(in srgb, var(--q-warning) 24%, transparent);
    color: var(--q-warning);
}

.hours-board__notice--error {
    background: color-mix(in srgb, var(--q-danger-soft) 74%, #ffffff);
    border-color: color-mix(in srgb, var(--q-danger) 22%, transparent);
    color: var(--q-danger);
}

/* ---- Hours V5 (Final premium layout) ---- */
.hours-surface {
    padding: 0;
    overflow: visible;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.hours-surface__head {
    padding: 24px 24px 14px;
    min-width: 0;
}

.hours-surface__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 24px 18px;
    border-bottom: 1px solid var(--q-border-light);
    min-width: 0;
}

.hours-surface__chips {
    display: flex;
    gap: 6px;
}

.hours-surface__actions {
    display: flex;
    gap: 8px;
}

.hours-surface__notice {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 14px 24px 0;
    padding: 10px 14px;
    border-radius: 14px;
    border: 1px solid var(--q-border-light);
    font-size: var(--q-text-xs);
    font-weight: 600;
    width: fit-content;
    max-width: min(100%, 640px);
}

.hours-surface__notice .lucide { width: 15px; height: 15px; }
.hours-surface__notice--success { background: color-mix(in srgb, var(--q-success-soft) 68%, #fff); border-color: color-mix(in srgb, var(--q-success) 18%, transparent); color: var(--q-success-dark); }
.hours-surface__notice--warning { background: color-mix(in srgb, #FEF3C7 72%, #fff); border-color: color-mix(in srgb, #D97706 24%, transparent); color: #92400E; }
.hours-surface__notice--error { background: color-mix(in srgb, #FEE2E2 74%, #fff); border-color: color-mix(in srgb, #DC2626 22%, transparent); color: #DC2626; }
.hours-surface__notice.is-hidden { display: none; }

.hours-surface__stack {
    display: grid;
    justify-items: flex-start;
    gap: 10px;
    margin: 16px 24px 0;
    min-width: 0;
}

.hours-surface__footer {
    display: flex;
    justify-content: center;
    padding: 14px 24px;
    border-top: 1px dashed var(--q-border-light);
}

.hours-surface__hint {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
    padding: 12px 14px;
    border-radius: 14px;
    background: color-mix(in srgb, #FEF3C7 72%, #fff);
    border: 1px solid color-mix(in srgb, #D97706 20%, transparent);
    font-size: var(--q-text-xs);
    font-weight: 600;
    line-height: 1.5;
    color: #92400E;
    max-width: min(100%, 640px);
    width: fit-content;
}

.hours-surface__hint .lucide {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    stroke-width: 2;
}

.hours-surface__notice {
    margin: 0;
    max-width: min(100%, 760px);
    width: fit-content;
}

/* Day list */
.hours-day-list {
    display: grid;
    gap: 10px;
    padding: 18px 24px;
}

/* Day card — VIEW mode */
.hours-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 18px;
    border: 1px solid var(--q-border-light);
    border-radius: 16px;
    background: color-mix(in srgb, var(--q-surface) 94%, var(--q-bg-warm));
    transition: border-color var(--q-duration) var(--q-ease);
    min-height: 52px;
}

.hours-card:hover {
    border-color: rgba(163, 126, 95, 0.22);
}

.hours-card--off {
    opacity: 1;
    background: rgba(245, 240, 235, 0.5);
}

.hours-card--off .hours-card__name {
    opacity: 0.5;
}

.hours-card--today {
    border-color: color-mix(in srgb, var(--q-success) 22%, var(--q-border));
    background: color-mix(in srgb, var(--q-success) 2%, rgba(255, 255, 255, 0.94));
}

.hours-card--today-row {
    border-color: color-mix(in srgb, var(--q-success) 42%, var(--q-border));
    background: color-mix(in srgb, var(--q-success) 2%, rgba(255, 255, 255, 0.94));
}

.hours-card--error {
    border-color: color-mix(in srgb, #DC2626 52%, var(--q-border));
    background: color-mix(in srgb, #FEE2E2 26%, rgba(255, 255, 255, 0.94));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, #DC2626 10%, transparent);
}

.hours-card--today-row:not(.hours-card--error) {
    border-color: color-mix(in srgb, var(--q-success) 42%, var(--q-border));
}

.hours-day-row {
    position: relative;
    display: grid;
    gap: 10px;
    padding-block-start: 8px;
}

.hours-day-row--today {
    padding-block-start: 12px;
}

.hours-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
}

.hours-card__title-row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 236px;
    flex: 0 0 236px;
    white-space: nowrap;
}

.hours-card__day-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    color: var(--q-text-muted);
    flex-shrink: 0;
}

.hours-card__day-mark .lucide {
    width: 15px;
    height: 15px;
    stroke-width: 2;
}

.hours-card__day-mark.is-active {
    color: var(--q-text-muted);
}

.hours-card--today-row .hours-card__day-mark {
    color: var(--q-success-dark);
}

.hours-card__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--q-border);
    flex-shrink: 0;
}

.hours-card__dot--on { background: var(--q-success); }

.hours-card__title,
.hours-card__name {
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-primary);
    flex-shrink: 0;
    width: 72px;
}

.hours-card__name--full {
    width: 128px;
}

.hours-card--off .hours-card__title,
.hours-card--off .hours-card__name {
    color: var(--q-text-tertiary);
}

.hours-card__today {
    display: inline-flex;
    align-items: center;
    margin-inline-start: auto;
    padding: 4px 8px;
    border-radius: 999px;
    background: var(--q-success-soft);
    color: var(--q-success-dark);
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    line-height: 1;
    flex-shrink: 0;
}

.hours-card__status {
    font-size: var(--q-text-xs);
    font-weight: 600;
    color: var(--q-text-tertiary);
    flex-shrink: 0;
}

.hours-card__view-periods {
    flex: 1;
    font-size: var(--q-text-sm);
    font-weight: 600;
    color: var(--q-text-secondary);
    font-variant-numeric: tabular-nums;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hours-card--view {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
    min-height: 64px;
}

.hours-card__summary {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
}

.hours-card__summary--inline {
    flex: 1;
    min-width: 0;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
}

.hours-card__summary--inline .hours-card__summary-pill {
    flex-shrink: 0;
}

.hours-card__summary--inline::-webkit-scrollbar {
    display: none;
}

.hours-card__summary-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--q-success) 12%, var(--q-border-light));
    background: color-mix(in srgb, var(--q-success-soft) 50%, #fff);
    color: var(--q-text-primary);
    font-size: var(--q-text-xs);
    font-weight: 650;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.hours-card__summary-pill .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 2;
    color: var(--q-success-dark);
}

.hours-card__summary-pill--muted {
    border-color: var(--q-border-light);
    background: color-mix(in srgb, var(--q-secondary) 60%, #fff);
    color: var(--q-text-tertiary);
}

.hours-card__summary-pill--muted .lucide {
    color: var(--q-text-tertiary);
}

.hours-card__summary-pill--interval {
    border-color: color-mix(in srgb, #D97706 18%, var(--q-border-light));
    background: color-mix(in srgb, #FEF3C7 66%, #fff);
    color: #92400E;
}

.hours-card__summary-pill--interval .lucide {
    color: #B45309;
}

.hours-card--today-row .hours-card__summary-pill:not(.hours-card__summary-pill--interval):not(.hours-card__summary-pill--muted) {
    border-color: color-mix(in srgb, var(--q-success) 18%, var(--q-border-light));
    background: color-mix(in srgb, var(--q-success-soft) 74%, #fff);
    color: var(--q-success-dark);
}

.hours-card__tail {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-inline-start: auto;
    flex-shrink: 0;
}

.hours-card__tail .hours-card__today {
    margin-inline-start: 0;
}

.hours-card__today {
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 18px;
    transform: translateY(-50%);
    z-index: 1;
}

.hours-card--off .hours-card__view-periods {
    color: var(--q-text-muted);
    font-style: italic;
    font-weight: 500;
}

/* Legacy chip kept for compatibility */
.hours-card__chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 8px;
    background: rgba(107, 94, 87, 0.04);
    font-size: var(--q-text-xs);
    font-weight: 650;
    color: var(--q-text-secondary);
    font-variant-numeric: tabular-nums;
}

.hours-card__chip .lucide {
    width: 12px;
    height: 12px;
    stroke-width: 1.8;
    color: var(--q-text-muted);
}

.hours-card__closed {
    font-size: var(--q-text-xs);
    color: var(--q-text-tertiary);
    font-style: italic;
}

/* Day card — EDIT mode (inline row) */
.hours-card--edit {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    overflow: visible;
}

.hours-card--edit .hours-card__title-row {
    min-width: 164px;
    flex: 0 0 164px;
}

.hours-card__toggle-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    cursor: pointer;
    min-height: 40px;
    min-width: 40px;
}

.hours-card--edit .hours-card__name {
    width: 116px;
}

.hours-card--edit .hours-card__fields,
.hours-card--edit .hours-card__off-label {
    flex: 1;
}

.hours-card--edit .hours-card__today {
    margin-inline-start: 0;
}

.switch--hours-row .switch__track {
    background: #D1D5DB;
    border: 0;
    box-shadow: none;
}

.switch--hours-row input:checked + .switch__track {
    background: var(--q-success);
}

.hours-card__toggle-wrap:hover .switch--hours-row .switch__track,
.hours-card__switch:hover .switch--hours-row .switch__track {
    filter: brightness(0.98);
}

.hours-card__toggle-wrap:focus-within .switch--hours-row .switch__track,
.hours-card__switch:focus-within .switch--hours-row .switch__track {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-primary) 10%, transparent);
}

.hours-card__fields {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
    flex-wrap: nowrap;
    overflow: hidden;
}

.hours-card__period-block {
    display: inline-grid;
    grid-template-columns: minmax(0, auto) auto minmax(0, auto);
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
}

.hours-card__period-block--disabled {
    opacity: 0.62;
}

.hours-card__input {
    width: 72px;
    min-width: 72px;
    height: 40px;
    min-height: 40px;
    padding: 0 10px;
    text-align: center;
    font-size: 0.92rem;
    font-weight: 680;
    font-family: var(--q-font-primary);
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1, "lnum" 1;
    border-radius: 12px;
    border: 1px solid var(--q-border);
    background: var(--q-surface);
    box-sizing: border-box;
    color: var(--q-text-primary);
    line-height: 1.2;
    letter-spacing: 0.01em;
    appearance: none;
    text-rendering: optimizeLegibility;
    direction: ltr;
    flex: 0 0 auto;
    caret-color: var(--q-primary);
    -webkit-text-size-adjust: 100%;
    vertical-align: middle;
}

.hours-card__input:focus {
    outline: none;
    border-color: var(--q-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-primary) 8%, transparent);
}

.hours-card__input.input--error {
    border-color: #DC2626;
}

.hours-card__input:disabled {
    opacity: 0.52;
    cursor: not-allowed;
    background: rgba(107, 94, 87, 0.08);
    color: var(--q-text-tertiary);
}

.hours-card__to--p2 {
    transition: opacity 150ms var(--q-ease);
}

.hours-card__input--p2:disabled ~ .hours-card__to--p2,
.hours-card__to--p2:has(+ .hours-card__input--p2:disabled),
.hours-card__input--p3:disabled ~ .hours-card__to--p3,
.hours-card__to--p3:has(+ .hours-card__input--p3:disabled) {
    opacity: 0.48;
}

.hours-card__to {
    font-size: var(--q-text-xs);
    color: var(--q-text-muted);
    font-weight: 500;
    flex-shrink: 0;
    padding: 0 1px;
}

.hours-card__slot-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    min-height: 24px;
    padding: 0 7px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--q-secondary) 72%, #fff);
    color: var(--q-text-tertiary);
    font-size: var(--q-text-2xs);
    font-weight: 700;
    letter-spacing: 0.04em;
    flex-shrink: 0;
}

.hours-card__slot-separator {
    width: 1px;
    height: 18px;
    margin-inline: 4px 2px;
    border-radius: 999px;
    background: color-mix(in srgb, rgba(163, 126, 95, 0.34) 70%, transparent);
    flex-shrink: 0;
}

.hours-card__slot-break {
    display: none;
}

.hours-card__interval-check {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    flex-shrink: 0;
    min-height: 30px;
    padding: 0 10px;
    font-size: var(--q-text-2xs);
    font-weight: 650;
    color: var(--q-text-muted);
    user-select: none;
    border: 1px solid rgba(175, 137, 106, 0.16);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.94);
    transition: all 150ms var(--q-ease);
    margin-left: 2px;
}

.hours-card__interval-icon {
    display: inline-flex;
    align-items: center;
    color: currentColor;
}

.hours-card__interval-icon .lucide {
    width: 13px;
    height: 13px;
    stroke-width: 2;
}

.hours-card__interval-check:hover {
    border-color: rgba(163, 126, 95, 0.26);
    background: rgba(252, 247, 241, 0.98);
    color: var(--q-text-secondary);
}

.hours-card__interval-check input {
    width: 15px;
    height: 15px;
    accent-color: var(--q-success);
    margin: 0;
}

.hours-card__interval-check input:checked ~ span {
    color: var(--q-success-dark);
}

.hours-card__interval-copy {
    line-height: 1;
}

.hours-card__interval-check:has(input:checked) {
    border-color: color-mix(in srgb, var(--q-success) 22%, var(--q-border));
    background: color-mix(in srgb, var(--q-success) 6%, transparent);
    color: var(--q-success-dark);
}

.hours-card__interval-check:has(input:focus-visible) {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-success) 10%, transparent);
}

.hours-card__off-label {
    font-size: var(--q-text-xs);
    color: var(--q-text-muted);
    font-style: italic;
}

.hours-card__row-error {
    width: auto;
    margin: 4px 12px 0 66px;
    font-size: var(--q-text-xs);
    color: #DC2626;
    font-weight: 600;
}

.hours-card__slot-controls {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    margin-inline-start: 4px;
}

.hours-card__slot-add,
.hours-card__slot-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 30px;
    min-width: 48px;
    min-height: 30px;
    padding: 0 9px;
    border-radius: 999px;
    border: 1px solid rgba(175, 137, 106, 0.16);
    background: rgba(255, 255, 255, 0.94);
    color: var(--q-text-secondary);
    cursor: pointer;
    flex-shrink: 0;
    white-space: nowrap;
    user-select: none;
    transition: border-color var(--q-duration) var(--q-ease), background var(--q-duration) var(--q-ease), color var(--q-duration) var(--q-ease), transform var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease);
}

.hours-card__slot-add {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(251, 246, 241, 0.98) 100%);
}

.hours-card__slot-add-sign {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1;
    color: currentColor;
}

.hours-card__slot-remove .lucide {
    width: 12px;
    height: 12px;
    stroke-width: 1.9;
}

.hours-card__slot-add span,
.hours-card__slot-remove span {
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1;
}

.hours-card__slot-add:hover {
    border-color: rgba(163, 126, 95, 0.28);
    background: rgba(252, 247, 241, 1);
    color: var(--q-text-primary);
    transform: translateY(-1px);
}

.hours-card__slot-add:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-primary) 10%, transparent);
}

.hours-card__slot-remove:hover {
    border-color: color-mix(in srgb, var(--q-danger) 26%, rgba(175, 137, 106, 0.16));
    background: rgba(220, 38, 38, 0.06);
    color: var(--q-danger);
}

.hours-card__slot-remove:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-danger) 10%, transparent);
}

.hours-card__switch {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    flex-shrink: 0;
    white-space: nowrap;
}

.hours-card__switch-label {
    font-size: var(--q-text-xs);
    font-weight: 600;
    color: var(--q-text-muted);
}

.hours-card__switch-label.is-active {
    color: var(--q-success-dark);
}

@media (max-width: 1440px) and (min-width: 769px) {
    .hours-card--edit {
        gap: 7px;
        padding: 11px 14px;
    }

    .hours-card--edit .hours-card__title-row {
        min-width: 154px;
        flex-basis: 154px;
    }

    .hours-card--edit .hours-card__name {
        width: 108px;
    }

    .hours-card__input {
        width: 68px;
        min-width: 68px;
        height: 38px;
        min-height: 38px;
        font-size: 0.9rem;
    }

    .hours-card__interval-check,
    .hours-card__slot-add,
    .hours-card__slot-remove {
        min-height: 28px;
        height: 28px;
        padding: 0 8px;
    }

    .hours-card__slot-separator {
        margin-inline: 3px 1px;
    }
}

@media (max-width: 1280px) and (min-width: 769px) {
    .hours-card--edit .hours-card__title-row {
        min-width: 146px;
        flex-basis: 146px;
    }

    .hours-card--edit .hours-card__name {
        width: 100px;
    }

    .hours-card--edit .hours-card__fields {
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 2px;
        scrollbar-width: none;
    }

    .hours-card--edit .hours-card__fields::-webkit-scrollbar {
        display: none;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .hours-surface__head {
        padding: 18px 18px 10px;
    }

    .hours-surface__bar {
        flex-wrap: wrap;
        padding: 0 18px 14px;
        gap: 8px;
        align-items: stretch;
    }

    .hours-day-list {
        padding: 14px 18px;
        gap: 8px;
    }

    .hours-card {
        padding: 12px 14px;
        border-radius: 14px;
    }

    .hours-surface__head > div,
    .hours-surface__chips,
    .hours-surface__actions {
        min-width: 0;
    }

    .hours-surface__actions {
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .hours-surface .section-title,
    .hours-surface .section-copy {
        max-width: 100%;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .hours-card--edit {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
        gap: 10px 12px;
        padding: 10px 12px;
    }

    .hours-card--view {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
        gap: 10px 12px;
    }

    .hours-card__title-row {
        min-width: 0;
        flex: initial;
    }

    .hours-card__summary--inline {
        grid-column: 1 / -1;
        width: 100%;
        flex: initial;
        flex-wrap: wrap;
        overflow: visible;
        padding-bottom: 0;
    }

    .hours-card__tail {
        width: auto;
        justify-content: flex-end;
        margin-inline-start: 0;
        align-self: start;
        grid-column: 2;
        grid-row: 1;
    }

    .hours-card__today {
        inset-inline-end: 12px;
    }

    .hours-card__toggle-wrap {
        justify-self: end;
        grid-column: 2;
        grid-row: 1;
    }

    .hours-card__fields {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px 10px;
        overflow: visible;
        padding-bottom: 0;
    }

    .hours-card__input {
        width: 100%;
        min-width: 0;
        height: 38px;
        min-height: 38px;
        padding: 0 8px;
        font-size: 0.88rem;
        line-height: 1;
    }

    .hours-card__period-block {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
        gap: 8px;
        width: 100%;
    }

    .hours-card__to {
        justify-self: center;
        align-self: center;
    }

    .hours-card__interval-check,
    .hours-card__slot-add,
    .hours-card__slot-controls {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .hours-card__slot-controls {
        gap: 8px;
        margin-inline-start: 0;
    }

    .hours-card__slot-separator {
        display: none;
    }

    .hours-card__name {
        min-width: 0;
        font-size: var(--q-text-xs);
    }

    .hours-card__name--full {
        width: auto;
    }

    .hours-card__row-error {
        margin: 2px 8px 0 12px;
    }

    .hours-surface__stack {
        margin: 10px 18px 0;
    }

    .hours-surface__notice,
    .hours-surface__hint {
        width: 100%;
        max-width: 100%;
    }

    .hours-surface__footer {
        padding: 12px 18px;
    }
}


/* ---- CRUD Surface (Entrega + Cupons) ---- */
.crud-surface {
    padding: 0;
    overflow: visible;
}

.crud-surface__head {
    padding: 24px 24px 14px;
    min-width: 0;
}

.crud-surface__form-shell {
    padding: 16px 24px;
    border-bottom: 1px solid var(--q-border-light);
    background: rgba(107, 94, 87, 0.02);
}

.crud-surface__list {
    padding: 0 24px 20px;
    display: grid;
    gap: 10px;
}

.crud-list {
    display: grid;
    gap: 8px;
}

/* Bar (chips + filters + search in one row) */
.crud-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 0 18px;
    border-bottom: 1px solid var(--q-border-light);
    flex-wrap: wrap;
}

.crud-bar--surface {
    align-items: flex-start;
}

.crud-bar__left {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    min-width: 0;
}

.crud-bar__right {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: flex-end;
    flex: 1 1 320px;
    min-width: 0;
}

.crud-bar__select {
    min-width: 158px;
    max-width: 190px;
    min-height: 36px;
    flex: 0 1 190px;
}

.crud-bar__cta {
    flex-shrink: 0;
}

/* Inline search (compact) */
.crud-bar__search {
    flex: 1 1 280px;
    min-width: 280px;
    max-width: 360px;
    flex-shrink: 1;
}

.crud-bar__search input {
    min-width: 0;
}

.crud-status-filter {
    position: relative;
    flex: 0 1 auto;
    min-width: 0;
}

.crud-status-filter__trigger {
    min-height: 44px;
    min-width: 172px;
    padding: 0 14px 0 12px;
    border: 1px solid rgba(163, 126, 95, 0.22);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84);
    color: var(--q-text-primary);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color 160ms var(--q-ease), background 160ms var(--q-ease), box-shadow 160ms var(--q-ease), color 160ms var(--q-ease);
}

.crud-status-filter__trigger:hover {
    border-color: rgba(217, 30, 13, 0.20);
    background: rgba(255, 255, 255, 0.92);
}

.crud-status-filter__trigger:focus-visible {
    outline: none;
    border-color: color-mix(in srgb, var(--q-primary) 22%, transparent);
    box-shadow: 0 0 0 3px rgba(217, 30, 13, 0.10);
}

.crud-status-filter.is-open .crud-status-filter__trigger {
    border-color: color-mix(in srgb, var(--q-primary) 18%, rgba(175, 137, 106, 0.14));
    background: rgba(255, 251, 247, 0.98);
}

.crud-status-filter__trigger-icon,
.crud-status-filter__trigger-chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--q-text-tertiary);
    flex-shrink: 0;
}

.crud-status-filter__trigger-icon {
    width: 24px;
    height: 24px;
    border-radius: 8px;
    border: 1px solid transparent;
}

.crud-status-filter__trigger-icon .lucide,
.crud-status-filter__trigger-chevron .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.9;
}

.crud-status-filter__trigger-icon--all {
    background: rgba(255, 255, 255, 0.88);
    color: var(--q-text-tertiary);
    border-color: rgba(175, 137, 106, 0.12);
}

.crud-status-filter__trigger-icon--active {
    background: var(--q-success-soft);
    color: var(--q-success-dark);
}

.crud-status-filter__trigger-icon--paused {
    background: rgba(120, 113, 108, 0.10);
    color: var(--q-text-secondary);
}

.crud-status-filter__trigger-icon--scheduled {
    background: rgba(217, 119, 6, 0.10);
    color: #b45309;
}

.crud-status-filter__trigger-icon--warning {
    background: rgba(245, 158, 11, 0.12);
    color: #b45309;
}

.crud-status-filter__trigger-icon--current {
    background: rgba(37, 99, 235, 0.10);
    color: #2563eb;
}

.crud-status-filter__trigger-icon--expired {
    background: rgba(217, 119, 6, 0.08);
    color: #92400e;
}

.crud-status-filter__trigger-copy {
    display: grid;
    gap: 1px;
    min-width: 0;
    text-align: left;
    flex: 1 1 auto;
}

.crud-status-filter__trigger-kicker {
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.1;
    color: var(--q-text-tertiary);
}

.crud-status-filter__trigger-value {
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.15;
    color: var(--q-text-primary);
}

.crud-status-filter__menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 12;
    min-width: 304px;
    width: max-content;
    max-width: min(360px, calc(100vw - 32px));
    padding: 6px;
    border-radius: 14px;
    border: 1px solid rgba(175, 137, 106, 0.14);
    background: rgba(255, 252, 248, 0.98);
    box-shadow: 0 14px 36px rgba(74, 46, 29, 0.14);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 120ms ease, transform 120ms ease, visibility 120ms ease;
}

.crud-status-filter.is-open .crud-status-filter__menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.crud-status-filter__option {
    width: 100%;
    min-height: 42px;
    padding: 8px 10px;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: var(--q-text-secondary);
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    text-align: left;
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease;
}

.crud-status-filter__option:hover {
    background: rgba(255, 247, 240, 0.92);
    color: var(--q-text-primary);
}

.crud-status-filter__option:focus-visible {
    outline: none;
    background: rgba(255, 247, 240, 0.98);
    box-shadow: inset 0 0 0 2px rgba(217, 30, 13, 0.12);
}

.crud-status-filter__option.is-active {
    background: color-mix(in srgb, var(--q-primary) 7%, #fffaf5);
    color: var(--q-text-primary);
}

.crud-status-filter__option-icon {
    width: 28px;
    height: 28px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
}

.crud-status-filter__option-icon .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.8;
}

.crud-status-filter__option-icon--all {
    background: rgba(255, 255, 255, 0.86);
    color: var(--q-text-tertiary);
    border-color: rgba(175, 137, 106, 0.12);
}

.crud-status-filter__option-icon--active {
    background: var(--q-success-soft);
    color: var(--q-success-dark);
}

.crud-status-filter__option-icon--paused {
    background: rgba(120, 113, 108, 0.10);
    color: var(--q-text-secondary);
}

.crud-status-filter__option-icon--scheduled {
    background: rgba(217, 119, 6, 0.10);
    color: #b45309;
}

.crud-status-filter__option-icon--warning {
    background: rgba(245, 158, 11, 0.12);
    color: #b45309;
}

.crud-status-filter__option-icon--current {
    background: rgba(37, 99, 235, 0.10);
    color: #2563eb;
}

.crud-status-filter__option-icon--expired {
    background: rgba(217, 119, 6, 0.08);
    color: #92400e;
}

.crud-status-filter__option-copy {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.crud-status-filter__option-title {
    font-size: 0.82rem;
    font-weight: 650;
    line-height: 1.2;
}

.crud-status-filter__option-help {
    font-size: 0.7rem;
    line-height: 1.3;
    color: var(--q-text-tertiary);
}

.crud-select-menu {
    position: relative;
    flex: 0 1 auto;
    min-width: 0;
}

.crud-select-menu__trigger {
    min-height: 44px;
    min-width: 186px;
    padding: 0 14px;
    border: 1px solid rgba(163, 126, 95, 0.22);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84);
    color: var(--q-text-primary);
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
    transition: border-color 160ms var(--q-ease), background 160ms var(--q-ease), box-shadow 160ms var(--q-ease);
}

.crud-select-menu__trigger:hover {
    border-color: rgba(217, 30, 13, 0.20);
    background: rgba(255, 255, 255, 0.92);
}

.crud-select-menu__trigger:focus-visible {
    outline: none;
    border-color: color-mix(in srgb, var(--q-primary) 22%, transparent);
    box-shadow: 0 0 0 3px rgba(217, 30, 13, 0.10);
}

.crud-select-menu.is-open .crud-select-menu__trigger {
    border-color: color-mix(in srgb, var(--q-primary) 18%, rgba(175, 137, 106, 0.14));
    background: rgba(255, 251, 247, 0.98);
}

.crud-select-menu__copy {
    display: grid;
    gap: 1px;
    min-width: 0;
    text-align: left;
    flex: 1 1 auto;
}

.crud-select-menu__kicker {
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.1;
    color: var(--q-text-tertiary);
}

.crud-select-menu__value {
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.15;
    color: var(--q-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.crud-select-menu__chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--q-text-tertiary);
    flex-shrink: 0;
}

.crud-select-menu__chevron .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.9;
}

.crud-select-menu__menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 12;
    min-width: 272px;
    width: max-content;
    max-width: min(340px, calc(100vw - 32px));
    padding: 6px;
    border-radius: 14px;
    border: 1px solid rgba(175, 137, 106, 0.14);
    background: rgba(255, 252, 248, 0.98);
    box-shadow: 0 14px 36px rgba(74, 46, 29, 0.14);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 120ms ease, transform 120ms ease, visibility 120ms ease;
}

.crud-select-menu.is-open .crud-select-menu__menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.crud-select-menu__option {
    width: 100%;
    min-height: 42px;
    padding: 9px 10px;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: var(--q-text-secondary);
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    text-align: left;
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease;
}

.crud-select-menu__option:hover {
    background: rgba(255, 247, 240, 0.92);
    color: var(--q-text-primary);
}

.crud-select-menu__option:focus-visible {
    outline: none;
    background: rgba(255, 247, 240, 0.98);
    box-shadow: inset 0 0 0 2px rgba(217, 30, 13, 0.12);
}

.crud-select-menu__option.is-active {
    background: color-mix(in srgb, var(--q-primary) 7%, #fffaf5);
    color: var(--q-text-primary);
}

.crud-select-menu__option-copy {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.crud-select-menu__option-title {
    font-size: 0.82rem;
    font-weight: 650;
    line-height: 1.2;
}

.crud-select-menu__option-help {
    font-size: 0.7rem;
    line-height: 1.3;
    color: var(--q-text-tertiary);
}

.crud-select-menu__option-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    color: var(--q-primary);
    flex-shrink: 0;
}

.crud-select-menu__option-check .lucide {
    width: 15px;
    height: 15px;
    stroke-width: 2;
}

.product-health-filter .crud-status-filter__trigger {
    min-width: 210px;
}

.crud-status-filter__option-count {
    min-width: 28px;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--q-text-tertiary);
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Column header */
.crud-col-header {
    display: grid;
    align-items: center;
    gap: 12px;
    padding: 8px 14px;
    font-size: var(--q-text-2xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--q-text-muted);
}

.crud-col-header__cell {
    min-width: 0;
}

.crud-col-header__cell--icon,
.crud-col-header__cell--right {
    text-align: left;
}

.crud-col-header__cell--icon {
    text-align: center;
}

.crud-col-header--neighborhood {
    grid-template-columns: 32px minmax(0, 1fr) 132px 212px;
}

.crud-col-header--coupon {
    grid-template-columns: 32px minmax(0, 1fr) 132px 120px 372px;
}

/* Toolbar (legacy, keep for compat) */
.crud-toolbar {
    display: grid;
    gap: 10px;
    margin-bottom: 4px;
}

.crud-filter-strip {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.crud-filter-strip::-webkit-scrollbar { display: none; }

.crud-filter-strip__label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.74rem;
    font-weight: 700;
    color: var(--q-text-muted);
    flex-shrink: 0;
    padding-right: 2px;
}

.crud-filter-strip__label .lucide {
    width: 13px;
    height: 13px;
}

.crud-no-results {
    text-align: center;
    padding: 24px 16px;
    color: var(--q-text-tertiary);
    font-size: var(--q-text-xs);
    font-style: italic;
    margin: 0;
}

/* Inline form */
.crud-inline-form {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.crud-inline-form--grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px;
    align-items: end;
}

.crud-inline-form__field { min-width: 0; }
.crud-inline-form__field--grow { flex: 1; min-width: 140px; }
.crud-inline-form__field--sm { max-width: 80px; }
.crud-inline-form__field .input,
.crud-inline-form__field .select { min-height: 40px; }

.crud-inline-form__actions {
    display: flex;
    gap: 8px;
    align-items: flex-end;
    padding-bottom: 1px;
}

/* Card (individual item) */
.crud-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border: 1px solid var(--q-border-light);
    border-radius: 14px;
    background: color-mix(in srgb, var(--q-surface) 94%, var(--q-bg-warm));
    transition: opacity 300ms var(--q-ease), border-color 150ms var(--q-ease), box-shadow 150ms var(--q-ease);
}

.crud-card:hover {
    border-color: rgba(163, 126, 95, 0.24);
    background: rgba(255, 255, 255, 0.98);
}

.crud-card--paused {
    opacity: 0.55;
    background: rgba(245, 240, 235, 0.5);
}

.crud-card--paused:hover {
    opacity: 0.75;
}

.crud-card--editing {
    border-color: color-mix(in srgb, var(--q-primary) 34%, var(--q-border));
    box-shadow: var(--q-shadow-primary);
}

/* Copied button feedback */
.product-card__action--copied {
    color: var(--q-success-dark) !important;
}

.product-card__action--copied .lucide {
    color: var(--q-success-dark);
}

.crud-card__icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    flex-shrink: 0;
}

.crud-card__icon-wrap .lucide {
    width: 15px;
    height: 15px;
    stroke-width: 1.8;
}

.crud-card__icon-wrap--delivery {
    background: color-mix(in srgb, var(--q-primary) 8%, rgba(255, 255, 255, 0.9));
    color: var(--q-primary);
}

.crud-card__icon-wrap--coupon {
    background: color-mix(in srgb, var(--q-success) 8%, rgba(255, 255, 255, 0.9));
    color: var(--q-success-dark);
}

.crud-card__body {
    display: grid;
    gap: 2px;
    flex: 1;
    min-width: 0;
}

.crud-card__title {
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.crud-card__title--code {
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    font-size: var(--q-text-md);
}

.crud-card__subtitle {
    font-size: var(--q-text-xs);
    font-weight: 600;
    color: var(--q-text-secondary);
}

.crud-card__badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 10px;
    font-weight: 700;
    font-size: var(--q-text-sm);
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
}

.crud-card__badge--value {
    background: var(--q-success-soft);
    color: var(--q-success-dark);
}

.crud-card__meta {
    font-size: var(--q-text-2xs);
    font-weight: 600;
    color: var(--q-text-tertiary);
    flex-shrink: 0;
    white-space: nowrap;
}

.crud-card__value-cell {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
}

.crud-card__meta-cell,
.crud-card__status-cell {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
}

.crud-card__actions {
    display: flex;
    align-items: center;
    gap: 2px;
    flex-shrink: 0;
    justify-content: flex-start;
    min-width: 0;
    width: 100%;
}

.crud-card--neighborhood {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) 132px 212px;
    align-items: center;
    gap: 12px;
}

.crud-card--coupon {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) 132px 120px 372px;
    align-items: center;
    gap: 12px;
}

.crud-card--coupon .meta-chip {
    white-space: nowrap;
}

.crud-card--coupon .crud-card__meta:empty {
    visibility: hidden;
}

/* Pagination */
.crud-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px 0 4px;
}

.crud-pagination__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--q-border-light);
    border-radius: 10px;
    background: var(--q-surface);
    color: var(--q-text-secondary);
    cursor: pointer;
    transition: all 150ms var(--q-ease);
}

.crud-pagination__btn:hover:not(:disabled) {
    border-color: var(--q-border);
    color: var(--q-text-primary);
}

.crud-pagination__btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.crud-pagination__btn .lucide {
    width: 16px;
    height: 16px;
}

.crud-pagination__info {
    font-size: var(--q-text-xs);
    font-weight: 650;
    color: var(--q-text-tertiary);
    min-width: 60px;
    text-align: center;
}

/* Mobile */
@media (max-width: 768px) {
    .crud-surface__head {
        padding: 18px;
    }

    .crud-surface__form-shell { padding: 14px 18px; }
    .crud-surface__list { padding: 0 18px 14px; }

    .crud-bar {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        padding: 0 0 14px;
    }

    .crud-bar__right {
        flex-wrap: wrap;
    }

    .crud-bar__select {
        width: 100%;
        max-width: none;
        min-width: 0;
        flex-basis: 100%;
    }

    .crud-bar__search {
        width: 100%;
        max-width: none;
        min-width: 0;
    }

    .crud-status-filter {
        width: 100%;
    }

    .crud-status-filter__trigger {
        width: 100%;
        justify-content: space-between;
        min-width: 0;
    }

    .crud-status-filter__menu {
        left: 0;
        right: 0;
        min-width: 0;
    }

    .crud-col-header {
        display: none;
    }

    .crud-inline-form {
        flex-direction: column;
        align-items: stretch;
    }

    .crud-inline-form__field--grow,
    .crud-inline-form__field--sm { max-width: none; }
    .crud-inline-form__actions { justify-content: flex-end; }

    .crud-card {
        gap: 8px;
        padding: 12px 14px;
    }

    .crud-card--neighborhood,
    .crud-card--coupon {
        grid-template-columns: 32px minmax(0, 1fr);
        align-items: start;
        gap: 8px 10px;
    }

    .crud-card--neighborhood .crud-card__body,
    .crud-card--coupon .crud-card__body {
        grid-column: 2;
        width: 100%;
    }

    .crud-card--neighborhood .crud-card__value-cell,
    .crud-card--coupon .crud-card__meta-cell,
    .crud-card--coupon .crud-card__status-cell,
    .crud-card__actions {
        grid-column: 2;
        justify-self: start;
    }

    .crud-card__actions {
        margin-left: 0;
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}

.hours-board__guide {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--q-space-3);
    margin: var(--q-space-3) var(--q-space-5) 0;
}

.hours-guide-card {
    display: grid;
    gap: 6px;
    padding: 14px 16px;
    border-radius: 18px;
    border: 1px solid var(--q-border-light);
    background: color-mix(in srgb, var(--q-bg) 42%, #ffffff);
}

.hours-guide-card__eyebrow {
    margin: 0;
    font-size: var(--q-text-2xs);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--q-primary);
}

.hours-guide-card__title {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-primary);
}

.hours-guide-card__copy {
    margin: 0;
    font-size: var(--q-text-xs);
    line-height: 1.45;
    color: var(--q-text-secondary);
}

.hours-week-list {
    display: grid;
    gap: var(--q-space-3);
    padding: var(--q-space-5);
}

.hours-day-card {
    display: grid;
    gap: var(--q-space-3);
    padding: var(--q-space-4);
    border-radius: 22px;
    border: 1px solid var(--q-border-light);
    background: rgba(255, 255, 255, 0.88);
    box-shadow: var(--q-shadow-xs);
    transition: var(--q-duration) var(--q-ease);
}

.hours-day-card.is-today {
    border-color: color-mix(in srgb, var(--q-success) 24%, var(--q-border-light));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--q-success) 10%, transparent), var(--q-shadow-xs);
}

.hours-day-card.is-disabled {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.86) 0%, rgba(246, 242, 236, 0.82) 100%);
}

.hours-day-card.is-disabled .hours-day-card__copy {
    color: var(--q-text-tertiary);
}

.hours-day-card.is-enabled .hours-day-card__copy {
    color: var(--q-success-dark);
}

.hours-day-card.has-error {
    border-color: color-mix(in srgb, var(--q-danger) 32%, var(--q-border-light));
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--q-danger) 10%, transparent);
}

.hours-day-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--q-space-4);
}

.hours-day-card__intro {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.hours-day-card__title-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.hours-day-card__title {
    margin: 0;
    font-size: var(--q-text-md);
    font-weight: 700;
    color: var(--q-text-primary);
}

.hours-day-card__today {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--q-success-soft) 88%, #fff);
    color: var(--q-success-dark);
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    line-height: 1;
}

.hours-day-card__copy {
    margin: 0;
    font-size: var(--q-text-xs);
    color: var(--q-text-secondary);
    line-height: 1.5;
}

.hours-day-card__state {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-shrink: 0;
}

.hours-day-card__switch {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--q-space-3);
    flex-shrink: 0;
    min-height: 44px;
}

.hours-day-card__switch-copy {
    font-size: var(--q-text-xs);
    font-weight: 600;
    color: var(--q-text-muted);
    text-align: right;
}

.hours-day-card__switch-copy.is-active {
    color: var(--q-success-dark);
}

.hours-day-card__switch-copy.is-inactive {
    color: var(--q-danger);
}

.hours-day-card__switch .switch--hours {
    width: 48px;
    height: 28px;
}

.hours-day-card__switch .switch--hours .switch__track {
    background: var(--q-danger);
}

.hours-day-card__switch .switch--hours .switch__thumb {
    top: 3px;
    left: 3px;
    width: 22px;
    height: 22px;
}

.hours-day-card__switch .switch--hours input:checked + .switch__track {
    background: var(--q-success);
}

.hours-day-card__switch .switch--hours input:checked + .switch__track + .switch__thumb {
    transform: translateX(20px);
}

.hours-day-card__summary {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.hours-day-card__period-pill {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--q-success) 10%, var(--q-border-light));
    background: color-mix(in srgb, var(--q-success-soft) 46%, #fff);
    color: var(--q-text-primary);
    font-size: var(--q-text-xs);
    font-weight: 650;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.hours-day-card__period-pill--muted {
    border-color: var(--q-border-light);
    background: color-mix(in srgb, var(--q-secondary) 56%, #fff);
    color: var(--q-text-tertiary);
}

.hours-day-card__editor {
    display: grid;
    gap: var(--q-space-3);
    padding-top: var(--q-space-3);
    border-top: 1px dashed color-mix(in srgb, var(--q-border) 68%, transparent);
}

.hours-day-card__editor.is-collapsed {
    display: none;
}

.hours-day-card__interval-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--q-space-4);
    padding: 12px 14px;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--q-border) 80%, transparent);
    background: color-mix(in srgb, var(--q-secondary) 30%, #fff);
}

.hours-day-card__interval-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.hours-day-card__interval-title,
.hours-day-card__interval-help {
    margin: 0;
}

.hours-day-card__interval-title {
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-primary);
}

.hours-day-card__interval-help {
    font-size: var(--q-text-xs);
    line-height: 1.45;
    color: var(--q-text-secondary);
}

.hours-day-card__interval-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--q-space-3);
    min-height: 44px;
    flex-shrink: 0;
}

.hours-day-card__interval-state {
    font-size: var(--q-text-xs);
    font-weight: 650;
    color: var(--q-text-tertiary);
}

.hours-day-card__interval-toggle.is-active .hours-day-card__interval-state {
    color: var(--q-success-dark);
}

.hours-slot {
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr);
    gap: var(--q-space-3);
    align-items: end;
    padding: 12px 14px;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--q-border) 74%, transparent);
    background: rgba(255, 255, 255, 0.78);
}

.hours-slot--optional {
    background: color-mix(in srgb, var(--q-secondary) 26%, #fff);
}

.hours-slot.is-disabled {
    border-style: dashed;
    border-color: color-mix(in srgb, var(--q-border) 58%, transparent);
    background: color-mix(in srgb, var(--q-secondary) 46%, #fff);
}

.hours-slot.is-disabled .hours-slot__eyebrow,
.hours-slot.is-disabled .hours-slot__helper,
.hours-slot.is-disabled .field-label {
    color: var(--q-text-tertiary);
}

.hours-slot.is-disabled .hours-slot__inputs {
    opacity: 0.52;
}

.hours-slot.is-disabled .hours-slot__separator {
    opacity: 0.48;
}

.hours-slot__label {
    display: grid;
    gap: 3px;
    align-content: center;
    min-height: 42px;
}

.hours-slot__eyebrow {
    font-size: var(--q-text-2xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-text-muted);
}

.hours-slot__helper {
    font-size: var(--q-text-2xs);
    line-height: 1.4;
    color: var(--q-text-secondary);
}

.hours-slot__inputs {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: var(--q-space-3);
    align-items: end;
}

.hours-slot__separator {
    align-self: center;
    font-size: var(--q-text-xs);
    font-weight: 600;
    color: var(--q-text-tertiary);
}

.hours-slot__field {
    gap: 6px;
}

.hours-time-input {
    text-align: center;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
    min-height: 46px;
}

.hours-time-input:disabled {
    cursor: not-allowed;
    background: color-mix(in srgb, var(--q-secondary) 68%, #fff);
    border-color: color-mix(in srgb, var(--q-border) 58%, transparent);
    color: var(--q-text-tertiary);
}

.hours-day-card__errors {
    display: grid;
    gap: 4px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid color-mix(in srgb, var(--q-danger) 18%, transparent);
    background: color-mix(in srgb, var(--q-danger-soft) 74%, #ffffff);
    color: var(--q-danger);
    font-size: var(--q-text-xs);
    line-height: 1.45;
}

.hours-day-card__errors p {
    margin: 0;
}

/* ============================================================
   CONFIG SECTION — Loja (V1 base — overridden by V2 below)
   ============================================================ */
.config-section-grid {
    display: grid;
    gap: var(--q-space-4);
    margin-top: var(--q-space-4);
    grid-template-columns: repeat(2, 1fr);
}

.config-section-card--advanced {
    border-style: dashed;
    border-color: var(--q-note-border);
    background: linear-gradient(180deg, var(--q-surface) 0%, color-mix(in srgb, var(--q-note-bg) 8%, #ffffff) 100%);
}

.config-section-form {
    margin-top: var(--q-space-3);
}

/* ---- Switch ---- */
.switch-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--q-space-3);
    min-height: 44px;
    padding: 8px 10px;
    border-radius: var(--q-radius-md);
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
}

.switch-row__copy {
    display: grid;
    gap: 2px;
}

.switch-row__label {
    font-size: var(--q-text-sm);
    font-weight: 600;
    color: var(--q-text-primary);
}

.switch-row__help {
    font-size: var(--q-text-2xs);
    line-height: 1.4;
    color: var(--q-text-tertiary);
}

.switch {
    position: relative;
    width: 40px;
    height: 22px;
    flex-shrink: 0;
}

.switch input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.switch__track {
    position: absolute;
    inset: 0;
    border-radius: var(--q-radius-full);
    background: #D1D5DB;
    transition: var(--q-duration) var(--q-ease);
    pointer-events: none;
}

.switch__thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: var(--q-radius-full);
    background: var(--q-surface);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
    transition: var(--q-duration) var(--q-ease);
    pointer-events: none;
}

.switch input:checked + .switch__track {
    background: var(--q-success);
}

.switch input:checked + .switch__track + .switch__thumb {
    transform: translateX(18px);
}
.switch input:focus-visible + .switch__track {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
}

/* ---- Option Cards (Checkout options) ---- */
.option-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--q-space-3);
}

.option-card {
    padding: var(--q-space-3);
    border-radius: var(--q-radius-lg);
    border: 1px solid var(--q-border-light);
    background: color-mix(in srgb, var(--q-bg) 50%, var(--q-surface));
    display: grid;
    gap: var(--q-space-3);
}

.option-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--q-space-2);
}

.option-card__title {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 600;
    color: var(--q-text-primary);
}

.option-card__copy {
    margin: 2px 0 0;
    font-size: var(--q-text-xs);
    color: var(--q-text-secondary);
    line-height: 1.4;
}

/* ============================================================
   EMPTY STATE
   ============================================================ */
.empty-state {
    padding: var(--q-space-6) var(--q-space-4);
    border-radius: var(--q-radius-lg);
    border: 1px dashed var(--q-border);
    background: color-mix(in srgb, var(--q-bg) 60%, var(--q-surface));
    color: var(--q-text-secondary);
    font-size: var(--q-text-sm);
    font-weight: 500;
    text-align: center;
}

.empty-state .lucide {
    width: 28px;
    height: 28px;
    margin: 0 auto var(--q-space-2);
    color: var(--q-text-tertiary);
}

/* ============================================================
   LOGIN PAGE
   ============================================================ */
.login-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: var(--q-space-6);
    background: var(--q-bg);
}

.login-card {
    width: min(960px, 100%);
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-radius: var(--q-radius-2xl);
    overflow: hidden;
    background: var(--q-surface);
    border: 1px solid var(--q-border-light);
    box-shadow: var(--q-shadow-lg);
}

.login-brand {
    position: relative;
    overflow: hidden;
    padding: 40px;
    color: var(--q-text-inverse);
    background: linear-gradient(145deg, var(--q-primary-dark) 0%, var(--q-primary) 100%);
}

.login-brand::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.15), transparent 30%),
        radial-gradient(circle at bottom right, rgba(255, 255, 255, 0.1), transparent 26%);
}

.login-brand__content,
.login-form-wrap {
    position: relative;
    z-index: 1;
}

.login-form-wrap {
    padding: 40px;
    display: grid;
    align-content: center;
}

.login-logo {
    width: 140px;
    height: auto;
    filter: brightness(0) invert(1);
}

.login-brand__title {
    margin: 20px 0 0;
    font-size: clamp(1.75rem, 2.5vw, 2.5rem);
    line-height: 1.05;
    letter-spacing: -0.03em;
    font-weight: 700;
}

.login-brand__copy,
.login-brand__quote {
    margin: 12px 0 0;
    max-width: 400px;
    color: rgba(255, 255, 255, 0.8);
    font-size: var(--q-text-md);
    line-height: 1.6;
}

.login-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: var(--q-radius-full);
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.16);
    font-size: var(--q-text-2xs);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 700;
}

.brand-note {
    margin-top: var(--q-space-6);
    padding: var(--q-space-3) var(--q-space-4);
    border-radius: var(--q-radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.15);
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(12px);
}

.login-feedback {
    margin-top: var(--q-space-4);
}

.helper-grid {
    display: grid;
    gap: var(--q-space-2);
}

.helper-card {
    padding: 10px 12px;
    border-radius: var(--q-radius-md);
    border: 1px solid var(--q-border);
    background: color-mix(in srgb, var(--q-note-bg) 12%, var(--q-surface));
}

.helper-card__title {
    margin: 0;
    font-size: var(--q-text-xs);
    font-weight: 600;
    color: var(--q-primary);
}

.helper-card__copy {
    margin: 2px 0 0;
    font-size: var(--q-text-xs);
    color: var(--q-text-secondary);
    line-height: 1.4;
}

/* ============================================================
   INTERFACE REFRESH — Operational Premium
   ============================================================ */
:root {
    --q-bg: #fbf5ee;
    --q-bg-warm: #f3e7d6;
    --q-surface: rgba(255, 255, 255, 0.84);
    --q-surface-alt: rgba(255, 253, 250, 0.92);
    --q-secondary: #f3ede5;
    --q-muted: #f0e5d7;
    --q-accent: #fff0e7;
    --q-border: rgba(175, 137, 106, 0.24);
    --q-border-light: rgba(175, 137, 106, 0.16);
    --q-text-primary: #241b16;
    --q-text-secondary: #665952;
    --q-text-tertiary: #9a8f87;
    --q-shadow-soft: 0 20px 50px rgba(103, 68, 43, 0.08);
    --q-shadow-panel: 0 24px 72px rgba(74, 46, 29, 0.10);
}

body.queru-admin-body {
    background: var(--q-bg-warm);
}

/* ---- Sidebar v2 — Premium Refresh ---- */
.queru-shell {
    position: relative;
    z-index: 1;
    grid-template-columns: 256px minmax(0, 1fr);
}

.queru-sidebar {
    padding: 24px 16px 16px;
    background: #f8f4ef;
    border-right: 1px solid rgba(175, 137, 106, 0.12);
    box-shadow: none;
    backdrop-filter: none;
}

.queru-sidebar__inner {
    justify-content: flex-start;
    gap: 18px;
    min-height: 100%;
}

.sidebar-primary {
    display: grid;
    gap: 10px;
}

/* Mobile-only elements hidden on desktop */
.sidebar-close {
    display: none;
}

.sidebar-mobile-header {
    display: contents;
}

.brand-lockup {
    gap: 0;
    padding-bottom: 10px;
    margin-bottom: 0;
    border-bottom: none;
}

.brand-logo {
    width: min(176px, 100%);
}

.sidebar-nav {
    gap: 4px;
    margin-top: 0;
}

.sidebar-link {
    position: relative;
    min-height: 40px;
    padding: 0 14px;
    border-radius: var(--q-radius-lg);
    border: 1px solid transparent;
    color: var(--q-text-secondary);
    font-size: 0.9rem;
    font-weight: 400;
    letter-spacing: 0.005em;
    transition: color 120ms ease, background 120ms ease;
}

.sidebar-link:hover {
    background: rgba(0, 0, 0, 0.035);
    color: var(--q-text-primary);
    box-shadow: none;
}

.sidebar-link.is-active {
    background: rgba(0, 0, 0, 0.05);
    border-color: transparent;
    color: var(--q-text-primary);
    font-weight: 500;
    box-shadow: none;
    transform: none;
}

.sidebar-link .lucide {
    width: 19px;
    height: 19px;
    stroke-width: 1.6;
    transition: color 120ms ease;
}

.sidebar-link:hover .lucide {
    color: var(--q-text-primary);
}

.sidebar-link.is-active .lucide {
    color: var(--q-primary);
}

.status-pill {
    padding: 7px 12px;
    border-radius: 999px;
    font-size: 0.68rem;
}

.sidebar-utility-rail {
    display: grid;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px dashed rgba(175, 137, 106, 0.22);
}

.sidebar-section--utility {
    display: grid;
    gap: 10px;
}

.sidebar-section__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.sidebar-section__eyebrow {
    margin: 0;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.sidebar-section__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    min-height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(217, 30, 13, 0.08);
    color: var(--q-primary);
    font-size: 0.72rem;
    font-weight: 700;
}

.sidebar-launcher {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 12px;
    border: 1px solid rgba(175, 137, 106, 0.14);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.72);
    color: var(--q-text-primary);
    text-decoration: none;
    cursor: pointer;
    transition: transform 120ms ease, background 120ms ease, border-color 120ms ease;
}

.sidebar-launcher:hover {
    transform: translateY(-1px);
    background: rgba(255, 255, 255, 0.86);
    border-color: rgba(175, 137, 106, 0.22);
}

.sidebar-launcher--status {
    text-align: left;
}

.sidebar-launcher--status[aria-disabled="true"] {
    cursor: not-allowed;
}

.sidebar-launcher:focus-visible,
.sidebar-shortcut:focus-visible,
.sidebar-logout:focus-visible {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
}

.sidebar-launcher__icon,
.sidebar-shortcut__icon,
.store-context-card__header-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sidebar-launcher__icon {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    background: rgba(217, 30, 13, 0.08);
    color: var(--q-primary);
}

.sidebar-launcher--open .sidebar-launcher__icon {
    background: rgba(5, 150, 105, 0.12);
    color: var(--q-success-dark);
}

.sidebar-launcher--closed .sidebar-launcher__icon {
    background: rgba(217, 30, 13, 0.10);
    color: #b42318;
}

.sidebar-launcher--paused .sidebar-launcher__icon,
.sidebar-launcher--blocked .sidebar-launcher__icon {
    background: rgba(217, 30, 13, 0.10);
    color: #b42318;
}

.sidebar-launcher--open .sidebar-launcher__eyebrow {
    color: var(--q-success-dark);
}

.sidebar-launcher--closed .sidebar-launcher__eyebrow {
    color: #b42318;
}

.sidebar-launcher--paused .sidebar-launcher__eyebrow,
.sidebar-launcher--blocked .sidebar-launcher__eyebrow {
    color: #b42318;
}

/* Toggle switch inside launcher — HIDDEN on desktop */
.sidebar-launcher__toggle {
    display: none;
}

.sidebar-launcher__icon .lucide,
.store-context-card__header-icon .lucide {
    width: 16px;
    height: 16px;
    stroke-width: 1.8;
}

.sidebar-launcher__body,
.sidebar-shortcut__body {
    min-width: 0;
    display: grid;
    gap: 2px;
    text-align: left;
}

.sidebar-launcher__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.sidebar-launcher__dot {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.72);
}

.sidebar-launcher__title,
.sidebar-shortcut__title {
    font-size: 0.84rem;
    font-weight: 600;
    line-height: 1.2;
    color: var(--q-text-primary);
}

.sidebar-launcher__copy,
.sidebar-shortcut__copy {
    font-size: 0.74rem;
    line-height: 1.35;
    color: var(--q-text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sidebar-launcher__trail {
    color: var(--q-text-tertiary);
}

.sidebar-launcher__trail .lucide {
    width: 16px;
    height: 16px;
    stroke-width: 1.7;
}

.sidebar-shortcuts {
    display: grid;
    gap: 6px;
}

.sidebar-shortcut {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 42px;
    padding: 8px 10px;
    border: 1px solid transparent;
    border-radius: 14px;
    background: transparent;
    color: var(--q-text-primary);
    text-align: left;
    cursor: pointer;
    transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}

.sidebar-shortcut:hover {
    background: rgba(255, 255, 255, 0.56);
    border-color: rgba(175, 137, 106, 0.14);
}

.sidebar-shortcut.is-copied {
    background: rgba(232, 249, 241, 0.72);
    border-color: rgba(5, 150, 105, 0.2);
}

.sidebar-shortcut__icon {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.82);
    color: var(--q-text-secondary);
    box-shadow: inset 0 0 0 1px rgba(175, 137, 106, 0.10);
}

.sidebar-shortcut__icon .lucide {
    width: 15px;
    height: 15px;
    stroke-width: 1.75;
}

.sidebar-shortcut__trail {
    color: var(--q-text-tertiary);
}

.sidebar-shortcut__trail .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.7;
}

.sidebar-shortcut--link .sidebar-shortcut__copy {
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.sidebar-shortcut--alert .sidebar-shortcut__icon {
    background: rgba(255, 244, 230, 0.92);
    color: #c16d00;
}

.sidebar-shortcut--disabled {
    opacity: 0.72;
    cursor: not-allowed;
}

/* Store context — reset card styles (no longer a card wrapper) */
.store-context-card {
    padding: 0;
    border-radius: 0;
    border: none;
    background: transparent;
    box-shadow: none;
    gap: 0;
}

.store-context-card::before {
    display: none;
}

.sidebar-footer {
    margin-top: auto;
    gap: 6px;
    padding-top: 0;
    border-top: none;
}

.store-context-shell {
    display: grid;
    gap: 8px;
}

.store-context-dock {
    display: grid;
    gap: 8px;
    padding: 12px;
    border-radius: 18px;
    border: 1px solid rgba(175, 137, 106, 0.12);
    background: rgba(255, 255, 255, 0.72);
}

/* Dashed divider — Queru DNA */
.sidebar-divider {
    border: none;
    border-top: 1px dashed rgba(175, 137, 106, 0.22);
    margin: 2px 4px;
}

/* Sidebar zones */
.sidebar-zone {
    display: grid;
    gap: 2px;
    padding: 4px 0;
}

.sidebar-zone--store {
    padding: 4px 0 6px;
}

/* Identity row — avatar + info side by side */
.store-context-card__header {
    display: flex;
    align-items: center;
    gap: 8px;
}

.store-context-card__header-icon {
    width: 28px;
    height: 28px;
    border-radius: 10px;
    background: rgba(217, 30, 13, 0.08);
    color: var(--q-primary);
}

.store-context-card__header-label {
    margin: 0;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.store-context-card__identity {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 0;
}

/* Avatar — store logo or initial */
.store-context-card__avatar {
    width: 40px;
    height: 40px;
    border-radius: 9px;
    overflow: hidden;
    flex-shrink: 0;
    background: linear-gradient(145deg, #d4a054, #c08a3a);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 0.95rem;
    letter-spacing: -0.02em;
    line-height: 1;
    border: 1.5px solid rgba(196, 140, 60, 0.2);
}

.store-context-card__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Info block — stacks name + status vertically */
.store-context-card__info {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.store-context-card__name {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.25;
    color: var(--q-text-primary);
}

.store-context-card__status-meta {
    display: grid;
    gap: 2px;
}

/* Status — single line, wraps gracefully */
.store-context-card__status {
    min-height: 0;
    width: fit-content;
    padding: 0;
    border-radius: 0;
    border: none;
    background: transparent;
    justify-content: flex-start;
    font-size: 0.77rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    box-shadow: none;
    gap: 6px;
    text-transform: uppercase;
}

.store-context-card__status-dot {
    width: 6px;
    height: 6px;
}

.store-context-card__status--open {
    background: transparent;
    color: var(--q-success-dark);
    border-color: transparent;
}

.store-context-card__status--closed {
    background: transparent;
    color: var(--q-danger);
    border-color: transparent;
}

.store-context-card__status--paused {
    background: transparent;
    color: var(--q-danger);
    border-color: transparent;
}

/* Select — styled, warm */
.store-context-card__select-wrap {
    min-width: 0;
}

.store-context-card__select {
    min-height: 42px;
    padding-left: 14px;
    padding-right: 38px;
    border-radius: 14px;
    border: 1px solid rgba(175, 137, 106, 0.12);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: none;
    font-size: 0.94rem;
    font-weight: 600;
    color: var(--q-text-primary);
}

.store-context-card__select:hover {
    border-color: rgba(175, 137, 106, 0.22);
    background: rgba(255, 255, 255, 0.65);
}

.store-context-card__select:focus {
    border-color: var(--q-primary);
    background: rgba(255, 255, 255, 0.65);
    box-shadow: none;
    outline: none;
}

.store-context-card__select-icon {
    right: 10px;
    color: var(--q-text-tertiary);
}

.store-context-card__select-icon .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.6;
}

/* Hours hint — second line, avoids clipping */
.store-context-card__timing {
    margin: 0;
    font-size: 0.78rem;
    color: var(--q-text-secondary);
    line-height: 1.35;
}

/* Logout — quiet, last item */
.sidebar-logout {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 38px;
    padding: 0 14px;
    border: none;
    border-radius: var(--q-radius-lg);
    background: transparent;
    color: var(--q-text-tertiary);
    font-size: 0.82rem;
    font-weight: 400;
    cursor: pointer;
    transition: color 120ms ease, background 120ms ease;
}

.sidebar-logout .lucide {
    width: 16px;
    height: 16px;
    stroke-width: 1.6;
    color: var(--q-text-tertiary);
    transition: color 120ms ease;
}

.sidebar-logout:hover {
    background: rgba(220, 38, 38, 0.05);
    color: var(--q-danger);
}

.sidebar-logout:hover .lucide {
    color: var(--q-danger);
}

.queru-main {
    width: min(100%, 1480px);
    max-width: none;
    padding: 30px 34px 60px;
    margin: 0 auto;
}

.sidebar-drawer-backdrop {
    display: none;
}

/* Topbar — clean strip, page context + store controls */
.panel-topbar {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    padding: 0 0 14px;
    border-radius: 0;
    border: none;
    border-bottom: 1px dashed rgba(175, 137, 106, 0.16);
    background: transparent;
    backdrop-filter: none;
    box-shadow: none;
}

/* Lead avatar — hidden on desktop, visible on mobile */
.panel-topbar__lead {
    display: none;
}

.panel-topbar__lead .topbar-store__avatar {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    font-size: 0.82rem;
}

/* Vertical dashed divider — hidden on desktop, visible on mobile */
.panel-topbar__divider {
    display: none;
    width: 1px;
    height: 20px;
    flex-shrink: 0;
    border: none;
    border-left: 1px dashed rgba(175, 137, 106, 0.22);
}

.panel-topbar__page {
    flex: 1;
    min-width: 0;
}

.panel-topbar__page .page-kicker {
    margin: 0;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--q-primary);
}

.panel-topbar__page .page-title {
    margin: 3px 0 0;
    font-size: 1.12rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.02em;
    color: var(--q-text-primary);
}

.panel-topbar__actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.panel-topbar__menu {
    display: none;
}

.panel-topbar__store-slot {
    min-width: 0;
}

.topbar-icon-button {
    display: none;
    width: 38px;
    height: 38px;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: var(--q-text-secondary);
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: color 120ms ease, background 120ms ease;
}

.topbar-icon-button:hover {
    background: rgba(0, 0, 0, 0.04);
    color: var(--q-text-primary);
}

.topbar-icon-button:focus-visible,
.topbar-account__trigger:focus-visible,
.topbar-account__menu-item:focus-visible,
.topbar-store__select:focus-visible {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
}

.topbar-icon-button .lucide {
    width: 18px;
    height: 18px;
    stroke-width: 1.8;
}

/* Topbar store chip — compact */
.topbar-store {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.topbar-store__avatar {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: linear-gradient(145deg, #d4a054, #c08a3a);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    border: 1px solid rgba(196, 140, 60, 0.18);
}

.topbar-store__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.topbar-store__body {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.topbar-store__eyebrow {
    margin: 0;
    font-size: 0.62rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.topbar-account__eyebrow {
    margin: 0;
    font-size: 0.62rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.topbar-store__title {
    margin: 0;
    font-size: 0.84rem;
    font-weight: 500;
    color: var(--q-text-primary);
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.topbar-account__name {
    margin: 0;
    font-size: 0.82rem;
    font-weight: 400;
    color: var(--q-text-primary);
    line-height: 1.2;
}

.topbar-store__select-wrap {
    position: relative;
}

.topbar-store__select {
    width: 100%;
    min-height: 34px;
    padding: 0 32px 0 10px;
    border-radius: 8px;
    border: 1px solid rgba(175, 137, 106, 0.10);
    background: transparent;
    color: var(--q-text-primary);
    font-size: 0.82rem;
    font-weight: 500;
    box-shadow: none;
}

.topbar-store__select:hover {
    border-color: rgba(175, 137, 106, 0.20);
    background: rgba(0, 0, 0, 0.02);
}

.topbar-store__select-icon {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--q-text-tertiary);
    pointer-events: none;
}

.topbar-store__select-icon .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.7;
}

/* Schedule chip — compact inline */
.topbar-schedule {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 6px 12px;
    border-radius: 10px;
    border: 1px solid rgba(175, 137, 106, 0.10);
    background: rgba(255, 248, 238, 0.5);
}

.topbar-schedule__icon {
    width: 28px;
    height: 28px;
    border-radius: 7px;
    background: rgba(217, 119, 6, 0.08);
    color: #b45309;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.topbar-schedule__icon .lucide {
    width: 13px;
    height: 13px;
    stroke-width: 1.7;
}

.topbar-schedule__body {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.topbar-schedule__eyebrow {
    display: none;
}

.topbar-schedule__title {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 500;
    line-height: 1.25;
    color: var(--q-text-primary);
    white-space: nowrap;
}

.topbar-schedule__hint {
    margin: 0;
    font-size: 0.7rem;
    line-height: 1.3;
    color: var(--q-text-tertiary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.topbar-account {
    position: relative;
    justify-self: end;
}

/* Store chip — fused avatar + name + logout dropdown */
.topbar-store-chip {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 6px 12px 6px 6px;
    border: 1px solid rgba(175, 137, 106, 0.10);
    border-radius: 10px;
    background: rgba(255, 248, 238, 0.5);
    color: var(--q-text-primary);
    cursor: pointer;
    transition: border-color 120ms ease, background 120ms ease;
}

.topbar-store-chip:hover {
    border-color: rgba(175, 137, 106, 0.20);
    background: rgba(255, 248, 238, 0.8);
}

.topbar-store-chip .topbar-store__avatar {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    font-size: 0.78rem;
}

.topbar-store-chip__body {
    min-width: 0;
    display: grid;
    gap: 1px;
    text-align: left;
}

.topbar-store-chip__eyebrow {
    font-size: 0.62rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
    line-height: 1.2;
}

.topbar-store-chip__name {
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--q-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
    line-height: 1.2;
}

.topbar-store-chip__chevron {
    color: var(--q-text-tertiary);
    display: inline-flex;
    flex-shrink: 0;
}

.topbar-store-chip__chevron .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.6;
}

/* Legacy account trigger hidden */
.topbar-account__trigger {
    display: none;
}

.topbar-account__avatar {
    display: none;
}

.topbar-account__chevron {
    color: var(--q-text-tertiary);
}

.topbar-account__chevron .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.8;
}

.topbar-account__menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 12;
    min-width: 200px;
    padding: 6px;
    border-radius: 12px;
    border: 1px solid rgba(175, 137, 106, 0.12);
    background: rgba(255, 252, 248, 0.98);
    box-shadow: 0 12px 32px rgba(74, 46, 29, 0.12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 120ms ease, transform 120ms ease, visibility 120ms ease;
}

.topbar-account__menu.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.topbar-account__menu-section {
    padding: 8px 10px;
    display: grid;
    gap: 6px;
}

.topbar-account__menu-label {
    margin: 0;
    font-size: 0.68rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.topbar-account__menu-select {
    width: 100%;
    min-height: 34px;
    padding: 0 32px 0 10px;
    border-radius: 8px;
    border: 1px solid rgba(175, 137, 106, 0.12);
    background: rgba(255, 255, 255, 0.6);
    font-size: 0.82rem;
    font-weight: 400;
    color: var(--q-text-primary);
    appearance: none;
    -webkit-appearance: none;
}

.topbar-account__menu-divider {
    border: none;
    border-top: 1px solid rgba(175, 137, 106, 0.10);
    margin: 4px 8px;
}

.topbar-account__menu-item {
    width: 100%;
    min-height: 38px;
    padding: 0 10px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: var(--q-text-secondary);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    font-weight: 400;
    cursor: pointer;
    transition: color 120ms ease, background 120ms ease;
}

.topbar-account__menu-item .lucide {
    width: 15px;
    height: 15px;
    stroke-width: 1.6;
}

.topbar-account__menu-item:hover {
    background: rgba(220, 38, 38, 0.05);
    color: var(--q-danger);
}

.mobile-action-strip {
    display: none;
}

/* Panel header — hidden, replaced by topbar */
.panel-header {
    display: none;
}

.panel-header__aside {
    display: none;
}

.page-kicker,
.section-kicker,
.summary-pill__label {
    letter-spacing: 0.12em;
}

.page-title {
    margin-top: 6px;
    font-size: clamp(1.85rem, 2vw, 2.35rem);
    line-height: 1.02;
}

.page-copy {
    margin-top: 10px;
    max-width: 640px;
    font-size: 0.92rem;
}

.section-summary-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.summary-pill {
    min-width: 140px;
    padding: 12px 14px;
    border-radius: 18px;
    border: 1px solid var(--q-border-light);
    background: rgba(255, 255, 255, 0.76);
    backdrop-filter: blur(16px);
    box-shadow: var(--q-shadow-soft);
    display: grid;
    gap: 5px;
}

.summary-pill__label {
    font-size: var(--q-text-2xs);
    font-weight: 700;
    color: var(--q-text-tertiary);
    text-transform: uppercase;
}

.summary-pill__value {
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-primary);
}

.summary-pill--open,
.hero-badge--open {
    background: rgba(232, 249, 241, 0.95);
    border-color: rgba(5, 150, 105, 0.18);
}

.summary-pill--closed,
.summary-pill--warning,
.hero-badge--closed {
    background: rgba(255, 236, 233, 0.95);
    border-color: rgba(217, 30, 13, 0.20);
}

.summary-pill--paused,
.summary-pill--alert,
.hero-badge--paused {
    background: rgba(255, 236, 233, 0.95);
    border-color: rgba(217, 30, 13, 0.20);
}

.summary-pill--success {
    background: rgba(232, 249, 241, 0.95);
    border-color: rgba(5, 150, 105, 0.18);
}

.summary-pill--muted {
    background: rgba(255, 255, 255, 0.76);
}

.feedback-bar {
    padding: 12px 16px;
    border-radius: 18px;
    backdrop-filter: blur(18px);
    box-shadow: var(--q-shadow-soft);
}

.dashboard-hero,
.section-card,
.note-card {
    position: relative;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid var(--q-border-light);
    backdrop-filter: blur(18px);
    box-shadow: var(--q-shadow-panel);
}

.section-card::before,
.note-card::before,
.dashboard-hero::before {
    content: "";
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.14));
    pointer-events: none;
}

.dashboard-hero {
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 24px;
    padding: 28px 30px;
    background:
        radial-gradient(circle at top left, rgba(217, 30, 13, 0.10), transparent 28%),
        radial-gradient(circle at bottom right, rgba(214, 163, 118, 0.16), transparent 32%),
        rgba(255, 255, 255, 0.84);
}

/* Brand logo — matches height of text column */
.dashboard-hero__brand {
    width: auto;
    height: auto;
    aspect-ratio: 1;
    align-self: stretch;
    max-height: 120px;
    border-radius: 22px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: linear-gradient(145deg, #d4a054, #c08a3a);
    color: #fff;
    font-weight: 700;
    font-size: 2rem;
    letter-spacing: -0.02em;
    border: 2px solid rgba(196, 140, 60, 0.18);
}

.dashboard-hero__brand img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dashboard-hero__content {
    gap: 4px;
    align-content: center;
    min-width: 0;
}

.dashboard-hero__greeting {
    margin: 0;
    font-family: var(--q-font-display);
    font-size: clamp(2rem, 3.2vw, 2.75rem);
    line-height: 1.06;
    letter-spacing: -0.04em;
    font-weight: 700;
    color: var(--q-text-primary);
}

.dashboard-hero__subtitle {
    margin: 6px 0 0;
    max-width: 580px;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--q-text-tertiary);
}

.dashboard-hero__actions {
    gap: 10px;
}

.quick-link {
    height: 40px;
    padding: 0 14px;
    border-radius: 999px;
    border-color: rgba(163, 126, 95, 0.24);
    background: rgba(255, 255, 255, 0.84);
    font-size: var(--q-text-xs);
    font-weight: 700;
    box-shadow: 0 10px 24px rgba(90, 60, 39, 0.05);
}

/* (brand styles defined above in hero section) */

.dashboard-hero__side {
    gap: 0;
    align-content: center;
    min-width: 220px;
}

.status-card {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 18px;
    box-shadow: none;
    padding: 16px 18px;
    display: grid;
    gap: 10px;
}

.status-card__label {
    margin: 0;
    font-size: 0.68rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.status-card__title {
    margin: 0;
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--q-text-primary);
}

.metric-grid {
    gap: 14px;
}

.metric-card {
    padding: 18px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: var(--q-shadow-soft);
}

.metric-card__icon {
    width: 34px;
    height: 34px;
    border-radius: 12px;
}

.metric-card__icon .lucide {
    width: 16px;
    height: 16px;
}

.section-card,
.note-card {
    padding: 24px;
    border-radius: 26px;
}

.dashboard-focus-section {
    padding: 26px 28px 28px;
    background:
        radial-gradient(circle at top left, rgba(217, 30, 13, 0.06), transparent 28%),
        linear-gradient(180deg, rgba(255, 249, 243, 0.96) 0%, rgba(255, 255, 255, 0.88) 100%);
}

.section-card--summary {
    padding: 26px 28px;
    background:
        radial-gradient(circle at top right, rgba(217, 30, 13, 0.04), transparent 34%),
        linear-gradient(180deg, rgba(255, 252, 249, 0.96) 0%, rgba(255, 255, 255, 0.86) 100%);
}

.note-card {
    padding: 22px;
    border-style: solid;
    background:
        radial-gradient(circle at top right, rgba(217, 30, 13, 0.045), transparent 30%),
        linear-gradient(180deg, rgba(255, 248, 240, 0.92) 0%, rgba(255, 255, 255, 0.84) 100%);
}

.section-head__meta {
    display: flex;
    align-items: center;
    gap: 10px;
}

.section-title {
    font-size: 1.22rem;
}

.dashboard-focus-section .section-head,
.section-card--summary .section-head {
    padding-bottom: 18px;
    margin-bottom: 18px;
    border-bottom: 1px solid rgba(163, 126, 95, 0.12);
}

/* ---- Focus Cards (dashboard action cards) ---- */
.bullet-list--dashboard {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 0;
}

.focus-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 14px;
    width: 100%;
    padding: 18px 18px;
    border: 1px solid rgba(163, 126, 95, 0.14);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.92);
    color: inherit;
    text-align: left;
    cursor: pointer;
    transition:
        transform var(--q-duration) var(--q-ease),
        box-shadow 0.22s var(--q-ease),
        border-color var(--q-duration) var(--q-ease);
}

.focus-card:hover {
    transform: translateY(-2px);
    border-color: rgba(163, 126, 95, 0.24);
    box-shadow: 0 14px 32px rgba(90, 60, 39, 0.09);
}

.focus-card:active {
    transform: translateY(0);
    box-shadow: 0 4px 12px rgba(90, 60, 39, 0.06);
}

.focus-card:focus-visible {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
}

.focus-card__icon {
    width: 38px;
    height: 38px;
    border-radius: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform var(--q-duration) var(--q-ease);
}

.focus-card:hover .focus-card__icon {
    transform: scale(1.06);
}

.focus-card__icon .lucide {
    width: 17px;
    height: 17px;
    stroke-width: 1.9;
}

/* Tone variants — icon colors */
.focus-card--warm .focus-card__icon {
    background: rgba(217, 30, 13, 0.08);
    color: var(--q-primary);
}

.focus-card--neutral .focus-card__icon {
    background: rgba(107, 94, 87, 0.08);
    color: var(--q-text-muted);
}

.focus-card--alert .focus-card__icon {
    background: rgba(217, 119, 6, 0.10);
    color: #b45309;
}

.focus-card--cool .focus-card__icon {
    background: rgba(59, 130, 246, 0.08);
    color: #2563eb;
}

.focus-card--gold .focus-card__icon {
    background: rgba(217, 119, 6, 0.08);
    color: #d97706;
}

/* Alert tone — card border shift */
.focus-card--alert {
    border-color: rgba(217, 119, 6, 0.20);
}

.focus-card__body {
    min-width: 0;
    display: grid;
    gap: 3px;
    align-content: center;
}

.focus-card__title {
    margin: 0;
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--q-text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
    line-height: 1.3;
}

.focus-card__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.01em;
    background: var(--q-primary);
    color: var(--q-text-inverse);
}

.focus-card--neutral .focus-card__badge,
.focus-card--cool .focus-card__badge {
    background: rgba(107, 94, 87, 0.12);
    color: var(--q-text-muted);
}

.focus-card--gold .focus-card__badge {
    background: rgba(217, 119, 6, 0.12);
    color: #b45309;
}

.focus-card--alert .focus-card__badge {
    background: rgba(217, 119, 6, 0.14);
    color: #b45309;
}

.focus-card__copy {
    margin: 0;
    font-size: 0.76rem;
    line-height: 1.45;
    color: var(--q-text-secondary);
}

.focus-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    color: var(--q-text-tertiary);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    transition: color var(--q-duration) var(--q-ease), gap var(--q-duration) var(--q-ease);
}

.focus-card:hover .focus-card__cta {
    color: var(--q-primary);
    gap: 6px;
}

.focus-card__cta .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 2.2;
    transition: transform var(--q-duration) var(--q-ease);
}

.focus-card:hover .focus-card__cta .lucide {
    transform: translateX(2px);
}

.focus-card__cta-label {
    display: none;
}

@media (min-width: 1081px) {
    .focus-card__cta-label {
        display: inline;
    }
}

/* ---- Info Desk: restructured ---- */
.info-desk-grid {
    display: grid;
    gap: 16px;
}

/* -- Channel cards (link + WhatsApp) -- */
.info-channels {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.info-channel {
    position: relative;
    padding: 22px 22px 20px;
    border: 1px solid rgba(163, 126, 95, 0.16);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        0 12px 28px rgba(90, 60, 39, 0.06);
    display: grid;
    gap: 14px;
    align-content: start;
    transition: border-color var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease);
}

.info-channel:hover {
    border-color: rgba(163, 126, 95, 0.28);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        0 16px 36px rgba(90, 60, 39, 0.09);
}

.info-channel__head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.info-channel__icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.info-channel__icon .lucide {
    width: 17px;
    height: 17px;
    stroke-width: 2;
}

.info-channel__icon--link {
    background: rgba(59, 130, 246, 0.10);
    color: #2563eb;
}

.info-channel__icon--delivery {
    background: rgba(217, 119, 6, 0.10);
    color: #b45309;
}

.info-channel__icon--wa {
    background: rgba(5, 150, 105, 0.10);
    color: #059669;
}

.info-channel__label {
    margin: 0;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.info-channel__value {
    margin: 0;
    font-size: 1.12rem;
    line-height: 1.35;
    font-weight: 800;
    letter-spacing: -0.025em;
    color: var(--q-text-primary);
    word-break: break-word;
}

.info-channel__helper {
    margin: 0;
    font-size: 0.78rem;
    line-height: 1.5;
    color: var(--q-text-secondary);
}

.info-channel__actions {
    display: flex;
    gap: 8px;
    margin-top: 2px;
}

.info-channel__btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 34px;
    padding: 0 14px;
    border: none;
    border-radius: 999px;
    background: var(--q-primary);
    color: var(--q-text-inverse);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    cursor: pointer;
    text-decoration: none;
    transition: transform var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease), background var(--q-duration) var(--q-ease);
    box-shadow: 0 8px 20px rgba(217, 30, 13, 0.18);
}

.info-channel__btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(217, 30, 13, 0.24);
    background: var(--q-primary-dark);
}

.info-channel__btn:active {
    transform: translateY(0);
}

.info-channel__btn .lucide {
    width: 13px;
    height: 13px;
}

.info-channel__btn--ghost {
    background: transparent;
    color: var(--q-text-secondary);
    border: 1px solid rgba(163, 126, 95, 0.22);
    box-shadow: none;
}

.info-channel__btn--ghost:hover {
    border-color: var(--q-primary);
    color: var(--q-primary);
    background: rgba(217, 30, 13, 0.04);
    box-shadow: none;
    transform: translateY(-1px);
}

.info-channel__btn.is-copied {
    background: var(--q-success);
    box-shadow: 0 8px 20px rgba(5, 150, 105, 0.18);
}

/* -- Reference data (compact ficha) -- */
.info-reference {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    border: 1px solid rgba(163, 126, 95, 0.14);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
    overflow: hidden;
}

.info-reference__item {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 16px 18px;
    transition: background var(--q-duration) var(--q-ease);
}

.info-reference__item:hover {
    background: rgba(255, 248, 240, 0.6);
}

/* Dividers — right border for left column, bottom border for top row */
.info-reference__item:nth-child(odd):not(:nth-last-child(1)):not(:nth-last-child(2))::after,
.info-reference__item:nth-child(odd)::before {
    content: "";
    position: absolute;
    pointer-events: none;
}

/* Right vertical divider for odd items */
.info-reference__item:nth-child(odd)::before {
    top: 14px;
    right: 0;
    width: 1px;
    height: calc(100% - 28px);
    background: linear-gradient(180deg, rgba(163, 126, 95, 0), rgba(163, 126, 95, 0.16), rgba(163, 126, 95, 0));
}

/* Bottom horizontal divider for first two items */
.info-reference__item:nth-child(1)::after,
.info-reference__item:nth-child(2)::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 18px;
    width: calc(100% - 36px);
    height: 1px;
    background: linear-gradient(90deg, rgba(163, 126, 95, 0), rgba(163, 126, 95, 0.16), rgba(163, 126, 95, 0));
    pointer-events: none;
}

.info-reference__icon {
    width: 32px;
    height: 32px;
    border-radius: 9px;
    background: rgba(243, 231, 214, 0.6);
    color: var(--q-text-muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.info-reference__icon .lucide {
    width: 15px;
    height: 15px;
    stroke-width: 1.8;
}

.info-reference__text {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.info-reference__label {
    margin: 0;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.info-reference__value {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.4;
    font-weight: 700;
    color: var(--q-text-primary);
    word-break: break-word;
}

.info-reference__edit {
    width: 30px;
    height: 30px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: var(--q-text-tertiary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    transition: opacity var(--q-duration) var(--q-ease), color var(--q-duration) var(--q-ease), border-color var(--q-duration) var(--q-ease), background var(--q-duration) var(--q-ease);
}

.info-reference__item:hover .info-reference__edit {
    opacity: 1;
}

.info-reference__edit:hover {
    color: var(--q-primary);
    border-color: rgba(217, 30, 13, 0.16);
    background: rgba(217, 30, 13, 0.04);
}

.info-reference__edit .lucide {
    width: 13px;
    height: 13px;
}

/* Focus visible for keyboard */
.info-channel__btn:focus-visible,
.info-reference__edit:focus-visible {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
}

.info-reference__edit:focus-visible {
    opacity: 1;
}

.summary-board {
    display: grid;
    gap: 10px;
}

.summary-board__row {
    display: grid;
    border: 1px solid rgba(163, 126, 95, 0.16);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
    overflow: hidden;
}

.summary-board__row--3 {
    grid-template-columns: minmax(0, 1.15fr) minmax(170px, 0.8fr) minmax(220px, 1fr);
}

.summary-board__row--2 {
    grid-template-columns: minmax(180px, 0.85fr) minmax(0, 1.45fr);
}

.summary-board__cell {
    position: relative;
    min-height: 108px;
    padding: 18px 20px;
    display: grid;
    gap: 10px;
    align-content: start;
}

.summary-board__cell:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 18px;
    right: 0;
    width: 1px;
    height: calc(100% - 36px);
    background: linear-gradient(180deg, rgba(163, 126, 95, 0), rgba(163, 126, 95, 0.16), rgba(163, 126, 95, 0));
}

.summary-board__cell--identity {
    background: linear-gradient(135deg, rgba(255, 245, 236, 0.92) 0%, rgba(255, 255, 255, 0.9) 68%);
}

.summary-board__cell--open .summary-board__value {
    color: var(--q-success-dark);
}

.summary-board__cell--closed .summary-board__value {
    color: var(--q-danger);
}

.summary-board__cell--paused .summary-board__value {
    color: var(--q-danger);
}

.summary-board__label {
    margin: 0;
    font-size: var(--q-text-2xs);
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.summary-board__value {
    margin: 0;
    font-size: 1.02rem;
    line-height: 1.4;
    font-weight: 700;
    color: var(--q-text-primary);
}

.summary-board__cell--identity .summary-board__value {
    font-family: var(--q-font-display);
    font-size: clamp(1.55rem, 2.3vw, 2.2rem);
    line-height: 0.96;
    letter-spacing: -0.04em;
}

.summary-board__divider {
    height: 1px;
    margin: 0 8px;
    background: linear-gradient(90deg, rgba(163, 126, 95, 0), rgba(163, 126, 95, 0.22), rgba(163, 126, 95, 0));
}

.tab-bar {
    padding: 4px;
    border: 1px solid var(--q-border-light);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: var(--q-shadow-soft);
}

.tab-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 38px;
    padding: 0 18px;
    border-radius: 14px;
    font-weight: 700;
}

.tab-btn .lucide {
    width: 15px;
    height: 15px;
    stroke-width: 1.8;
    flex-shrink: 0;
}

.editor-layout {
    grid-template-columns: minmax(360px, 430px) minmax(0, 1fr);
    gap: 20px;
}

.editor-panel {
    top: 20px;
}

.editor-panel.is-editing {
    box-shadow: 0 0 0 2px rgba(217, 30, 13, 0.10), var(--q-shadow-soft);
}

.editing-indicator {
    padding: 8px 12px;
    border-radius: 14px;
}

.form-stack {
    display: grid;
    gap: 16px;
}

.form-cluster {
    margin: 0;
    padding: 18px;
    border: 1px solid rgba(163, 126, 95, 0.16);
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92) 0%, rgba(255, 249, 243, 0.82) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    display: grid;
    gap: 14px;
}

.form-cluster__title {
    padding: 0 8px;
    font-size: var(--q-text-2xs);
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--q-primary);
}

.form-cluster__copy {
    margin: -4px 0 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.45;
}

.field-grid {
    gap: 14px;
}

.field {
    gap: 6px;
    min-width: 0;
}

.field-label {
    font-size: var(--q-text-xs);
    font-weight: 700;
    color: var(--q-text-primary);
}

.field-help {
    line-height: 1.45;
}

.input:not(.hours-card__input),
.textarea,
.select,
.search-bar {
    border-radius: 16px;
}

.input:not(.hours-card__input),
.textarea,
.select {
    min-height: 44px;
    padding: 0 14px;
    padding-right: 42px;
    border-color: rgba(163, 126, 95, 0.22);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

.input:not(.hours-card__input):hover,
.textarea:hover,
.select:hover {
    border-color: rgba(217, 30, 13, 0.20);
}

.textarea {
    min-height: 96px;
    padding: 12px 14px;
}

.form-actions {
    gap: 10px;
}

.config-section-form > .form-actions {
    justify-content: flex-end;
    margin-top: var(--q-space-4);
    padding-top: var(--q-space-3);
    border-top: 1px solid var(--q-border-light);
}

.primary-button,
.secondary-button,
.danger-button,
.ghost-button {
    min-height: 40px;
    padding: 0 16px;
    border-radius: 999px;
    font-size: var(--q-text-xs);
    font-weight: 700;
}

.primary-button {
    box-shadow: 0 18px 30px rgba(217, 30, 13, 0.20);
}

.media-field {
    display: grid;
    gap: 10px;
}

.media-field__preview {
    position: relative;
    aspect-ratio: 16 / 10;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid var(--q-border-light);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.65) 0%, rgba(247, 236, 226, 0.88) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.media-field__placeholder,
.list-card__media-placeholder {
    color: var(--q-primary);
    display: inline-flex;
}

.media-field__placeholder .lucide,
.list-card__media-placeholder .lucide {
    width: 24px;
    height: 24px;
}

.media-field__preview img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.search-bar {
    height: 44px;
    border-color: rgba(163, 126, 95, 0.22);
    background: rgba(255, 255, 255, 0.94);
}

.list-stack {
    gap: 14px;
}

.list-card {
    padding: 16px 18px;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: var(--q-shadow-soft);
}

.list-card--product {
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.list-card__media {
    position: relative;
    width: 104px;
    height: 104px;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid var(--q-border-light);
    background: linear-gradient(180deg, rgba(255, 247, 240, 1) 0%, rgba(245, 233, 219, 0.92) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.list-card__media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.list-card__body {
    min-width: 0;
    display: grid;
    gap: 10px;
}

.list-card__title {
    font-size: 0.96rem;
}

.meta-inline {
    gap: 6px;
}

.meta-chip {
    min-height: 26px;
    padding: 0 10px;
    font-size: 0.7rem;
    letter-spacing: 0.03em;
}

.meta-chip.warning {
    background: rgba(255, 247, 221, 1);
    color: #b45309;
}

/* ---- Config V2 — Hero ---- */
.config-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 24px;
    padding: 28px 30px;
    border-radius: 26px;
    border: 1px solid var(--q-border-light);
    backdrop-filter: blur(18px);
    box-shadow: var(--q-shadow-panel);
    background:
        radial-gradient(circle at top left, rgba(196, 140, 60, 0.10), transparent 28%),
        radial-gradient(circle at bottom right, rgba(217, 30, 13, 0.08), transparent 32%),
        rgba(255, 255, 255, 0.84);
}
.config-hero::before {
    content: "";
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.14));
    pointer-events: none;
}
.config-hero__brand {
    width: auto;
    height: auto;
    aspect-ratio: 1;
    align-self: stretch;
    max-height: 100px;
    border-radius: 22px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: linear-gradient(145deg, #d4a054, #c08a3a);
    color: #fff;
    font-weight: 700;
    font-size: 1.8rem;
    letter-spacing: -0.02em;
    border: 2px solid rgba(196, 140, 60, 0.18);
}
.config-hero__brand img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.config-hero__content {
    display: grid;
    gap: 4px;
    align-content: center;
    min-width: 0;
}
.config-hero__kicker {
    margin: 0;
    font-size: var(--q-text-2xs);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-primary);
}
.config-hero__name {
    margin: 0;
    font-family: var(--q-font-display);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    font-size: clamp(1.6rem, 2.8vw, 2.2rem);
    line-height: 1.1;
    letter-spacing: -0.04em;
    font-weight: 700;
    color: var(--q-text-primary);
}
.config-hero__slogan {
    margin: 4px 0 0;
    max-width: 480px;
    font-size: var(--q-text-sm);
    line-height: 1.5;
    color: var(--q-text-tertiary);
}
.config-hero__live-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 8px;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--q-success-soft);
    color: var(--q-success-dark);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    vertical-align: middle;
}
.config-hero__live-badge .lucide { width: 10px; height: 10px; }
.config-hero__draft-badge {
    display: inline-flex;
    align-items: center;
    margin-left: 8px;
    padding: 2px 10px;
    border-radius: 999px;
    background: rgba(255, 247, 221, 1);
    color: #b45309;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    vertical-align: middle;
}
.config-hero__preview-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    padding: 6px 14px;
    border-radius: 999px;
    border: 1px solid rgba(163, 126, 95, 0.18);
    background: rgba(255, 255, 255, 0.7);
    color: var(--q-text-secondary);
    font-size: var(--q-text-2xs);
    font-weight: 700;
    text-decoration: none;
    transition: border-color var(--q-duration) var(--q-ease), color var(--q-duration) var(--q-ease), transform var(--q-duration) var(--q-ease);
}
.config-hero__preview-link:hover {
    border-color: var(--q-primary);
    color: var(--q-primary);
    transform: translateY(-1px);
}
.config-hero__preview-link .lucide { width: 12px; height: 12px; }
.config-hero__completion {
    min-width: 200px;
    padding: 18px;
    border-radius: 18px;
    border: 1px solid var(--q-border-light);
    background: rgba(255, 255, 255, 0.88);
    display: grid;
    gap: 10px;
}
.config-hero__completion-title {
    margin: 0;
    font-size: var(--q-text-2xs);
    font-weight: 800;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}
.config-hero__completion-value {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--q-text-primary);
}
.config-hero__completion-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.config-hero__completion-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.config-hero__completion-chip.success {
    background: var(--q-success-soft);
    color: var(--q-success-dark);
}
.config-hero__completion-chip.alert {
    background: var(--q-primary-soft);
    color: var(--q-primary);
}
.config-hero__completion-chip.warning {
    background: rgba(255, 247, 221, 1);
    color: #b45309;
}

/* ---- Config V2 — Channels ---- */
.config-channels {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

/* ---- Config V2 — Nav Rail ---- */
.config-nav-rail {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.config-nav-rail__link {
    min-width: 140px;
    flex: 1;
    padding: 10px 14px;
    border: 1px solid var(--q-border-light);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.84);
    color: var(--q-text-primary);
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
    cursor: pointer;
    box-shadow: var(--q-shadow-soft);
    transition: transform var(--q-duration) var(--q-ease), border-color var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease);
}
.config-nav-rail__link:hover {
    transform: translateY(-1px);
    border-color: rgba(217, 30, 13, 0.18);
    box-shadow: 0 12px 28px rgba(90, 60, 39, 0.08);
}
.config-nav-rail__link:focus-visible {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
}
.config-nav-rail__link.is-advanced {
    background: rgba(255, 247, 240, 0.88);
}
.config-nav-rail__icon {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.config-nav-rail__icon .lucide {
    width: 18px;
    height: 18px;
    stroke-width: 2;
}
.config-nav-rail__icon--identidade_visual,
.config-nav-rail__icon--contato,
.config-nav-rail__icon--cores,
.config-nav-rail__icon--checkout,
.config-nav-rail__icon--redes_sociais,
.config-nav-rail__icon--advanced {
    background: linear-gradient(180deg, rgba(243, 231, 214, 0.7) 0%, rgba(233, 218, 197, 0.5) 100%);
    color: var(--q-text-secondary);
}
.config-nav-rail__text {
    display: grid;
    gap: 2px;
    min-width: 0;
}
.config-nav-rail__kicker {
    font-size: var(--q-text-2xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}
.config-nav-rail__label {
    font-size: var(--q-text-xs);
    font-weight: 700;
    flex: 1;
}

/* ---- Config V2 — Section Cards (clean, no colored borders) ---- */
.config-section-grid {
    gap: var(--q-space-5);
}
.config-section-card {
    padding: var(--q-space-5);
    border-radius: 22px;
    border: 1px solid var(--q-border-light);
    background: rgba(255, 255, 255, 0.92);
    transition: border-color var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease);
}
.config-section-card:hover {
    border-color: rgba(163, 126, 95, 0.24);
    box-shadow: 0 12px 28px rgba(90, 60, 39, 0.06);
}
.config-section-card--wide { grid-column: span 2; }

.config-section-card .section-head {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 14px;
    align-items: start;
}

.config-section-icon {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: linear-gradient(180deg, rgba(243, 231, 214, 0.7) 0%, rgba(233, 218, 197, 0.5) 100%);
    color: var(--q-text-secondary);
}
.config-section-icon .lucide {
    width: 20px;
    height: 20px;
    stroke-width: 1.8;
}

.meta-chip--lg {
    min-height: 24px;
    padding: 0 10px;
    font-size: var(--q-text-2xs);
    font-weight: 700;
    border-radius: 999px;
}

.config-section-card--advanced-surface {
    background: linear-gradient(180deg, rgba(255, 250, 245, 0.9) 0%, rgba(255, 255, 255, 0.84) 100%);
}

/* ---- Config V2 — Color Swatches (small, elegant) ---- */
.color-swatch-row {
    display: flex;
    gap: 6px;
    align-items: center;
    margin-bottom: 4px;
}
.color-swatch-row__dot {
    width: 22px;
    height: 22px;
    border-radius: 7px;
    border: 2px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.10);
    flex-shrink: 0;
}

/* ---- Config V2 — Inline Color Picker (swatch + hex) ---- */
.color-inline-picker {
    display: flex;
    align-items: center;
    gap: 10px;
}
.color-inline-picker__swatch {
    position: relative;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    border: 2px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.10);
    flex-shrink: 0;
    cursor: pointer;
    overflow: hidden;
    transition: transform var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease);
}
.color-inline-picker__swatch:hover {
    transform: scale(1.06);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.14);
}
.color-inline-picker__native {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    border: none;
    padding: 0;
}
.color-inline-picker__hex {
    flex: 1;
    min-width: 0;
}

/* ---- Config V2 — Payment Toggle List ---- */
.payment-toggle-list {
    display: grid;
    gap: 6px;
}
.payment-toggle-list .switch-row {
    border: 1px solid var(--q-border-light);
}
.switch-row__icon {
    font-size: 1.1rem;
    line-height: 1;
    margin-right: 2px;
}

/* ---- Config V2 — Checkout Command Blocks ---- */
.checkout-block-stack {
    display: grid;
    gap: var(--q-space-5);
}
.checkout-block-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--q-space-5);
    align-items: start;
}
.checkout-block {
    padding: var(--q-space-5);
    border-radius: 22px;
    border: 1px solid var(--q-border-light);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 249, 243, 0.84) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    display: grid;
    gap: 16px;
}
.checkout-block__head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(163, 126, 95, 0.08);
}
.checkout-block__icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.checkout-block__icon .lucide { width: 16px; height: 16px; stroke-width: 1.8; }
.checkout-block__icon--rules,
.checkout-block__icon--payment,
.checkout-block__icon--options,
.checkout-block__icon--extra {
    background: linear-gradient(180deg, rgba(243, 231, 214, 0.7) 0%, rgba(233, 218, 197, 0.5) 100%);
    color: var(--q-text-secondary);
}
.checkout-block__text {
    display: grid;
    gap: 2px;
    min-width: 0;
}
.checkout-block__kicker {
    margin: 0;
    font-size: var(--q-text-2xs);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-primary);
}
.checkout-block__title {
    margin: 0;
    font-size: var(--q-text-md);
    font-weight: 700;
    color: var(--q-text-primary);
}
.checkout-block__copy {
    margin: 0;
    font-size: var(--q-text-xs);
    color: var(--q-text-tertiary);
    line-height: 1.4;
}

/* ---- Config V2 — Pix Key Field ---- */
.pix-key-field__card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: start;
    padding: 16px 18px;
    border-radius: 18px;
    border: 1px solid rgba(0, 187, 173, 0.18);
    background: linear-gradient(180deg, rgba(0, 187, 173, 0.04) 0%, rgba(255, 255, 255, 0.92) 100%);
    transition: border-color var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease);
}
.pix-key-field__card:focus-within {
    border-color: rgba(0, 187, 173, 0.4);
    box-shadow: 0 0 0 3px rgba(0, 187, 173, 0.08);
}
.pix-key-field__icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: rgba(0, 187, 173, 0.10);
    color: #00796b;
    margin-top: 2px;
}
.pix-key-field__icon svg { width: 20px; height: 20px; }
.pix-key-field__body {
    display: grid;
    gap: 4px;
    min-width: 0;
}
.pix-key-field__label {
    font-size: var(--q-text-xs);
    font-weight: 700;
    color: var(--q-text-primary);
}
.pix-key-field__input {
    width: 100%;
    min-height: 44px;
    padding: 0 14px;
    border-radius: 16px;
    border: 1px solid rgba(0, 187, 173, 0.16);
    background: rgba(255, 255, 255, 0.96);
    font-size: var(--q-text-sm);
    color: var(--q-text-primary);
    transition: border-color var(--q-duration) var(--q-ease);
}
.pix-key-field__input:focus {
    outline: none;
    border-color: rgba(0, 187, 173, 0.5);
    box-shadow: 0 0 0 3px rgba(0, 187, 173, 0.08);
}
.pix-key-field__input::placeholder { color: var(--q-text-muted); }
.pix-key-field__help {
    font-size: var(--q-text-2xs);
    color: var(--q-text-tertiary);
}

/* ---- Config V2 — Social Link Cards ---- */
.social-link-stack {
    display: grid;
    gap: 12px;
}
.social-link-field {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    align-items: start;
    padding: 14px 16px;
    border-radius: 18px;
    border: 1px solid var(--q-border-light);
    background: rgba(255, 255, 255, 0.88);
    transition: border-color var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease);
}
.social-link-field:hover {
    border-color: rgba(163, 126, 95, 0.24);
}
.social-link-field:focus-within {
    border-color: var(--q-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-primary) 8%, transparent);
}
.social-link-field__icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 2px;
}
.social-link-field__icon .lucide { width: 18px; height: 18px; stroke-width: 2; }
.social-link-field__icon--instagram,
.social-link-field__icon--facebook,
.social-link-field__icon--google {
    background: linear-gradient(180deg, rgba(243, 231, 214, 0.7) 0%, rgba(233, 218, 197, 0.5) 100%);
    color: var(--q-text-secondary);
}
.social-link-field__body {
    display: grid;
    gap: 4px;
    min-width: 0;
}
.social-link-field__label {
    font-size: var(--q-text-xs);
    font-weight: 700;
    color: var(--q-text-primary);
}
.social-link-field__input {
    width: 100%;
    min-height: 44px;
    padding: 0 14px;
    border-radius: 16px;
    border: 1px solid rgba(163, 126, 95, 0.16);
    background: rgba(255, 255, 255, 0.96);
    font-size: var(--q-text-sm);
    color: var(--q-text-primary);
    transition: border-color var(--q-duration) var(--q-ease);
}
.social-link-field__input:focus {
    outline: none;
    border-color: var(--q-primary);
}
.social-link-field__help {
    font-size: var(--q-text-2xs);
    color: var(--q-text-tertiary);
}

/* ---- Config V2 — Channel icon variants ---- */
.info-channel__icon--orders { background: rgba(217, 119, 6, 0.10); color: #b45309; }
.info-channel__icon--money { background: rgba(59, 130, 246, 0.10); color: #2563eb; }
.info-channel__icon--colors { background: rgba(139, 92, 246, 0.10); color: #7c3aed; }

/* ---- Config V2 — Media Upload (drag-drop style) ---- */
.config-media-upload {
    display: grid;
    gap: 6px;
}
.config-media-upload__dropzone {
    position: relative;
    aspect-ratio: 4 / 3;
    border: 2px dashed rgba(163, 126, 95, 0.28);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(247, 236, 226, 0.5) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    overflow: hidden;
    transition: border-color var(--q-duration) var(--q-ease), background var(--q-duration) var(--q-ease), transform var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease);
}
.config-media-upload__dropzone:hover {
    border-color: color-mix(in srgb, var(--q-primary) 40%, transparent);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.85) 0%, rgba(247, 236, 226, 0.6) 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(90, 60, 39, 0.06);
}
.config-media-upload__dropzone:focus-visible {
    outline: none;
    border-color: var(--q-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-primary) 10%, transparent);
}
.config-media-upload__dropzone.has-preview {
    border: 1px solid var(--q-border-light);
    background: rgba(0, 0, 0, 0.02);
}
.config-media-upload__dropzone.has-preview img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.config-media-upload__remove {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 30px;
    height: 30px;
    border: none;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.55);
    backdrop-filter: blur(4px);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    transition: opacity var(--q-duration), background var(--q-duration), transform var(--q-duration);
}
.config-media-upload__remove .lucide { width: 14px; height: 14px; }
.config-media-upload__actions {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
    opacity: 0;
    transition: opacity var(--q-duration) var(--q-ease);
}
.config-media-upload__dropzone:hover .config-media-upload__actions { opacity: 1; }
.config-media-upload__change {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 32px;
    padding: 0 14px;
    border: none;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(6px);
    color: var(--q-text-primary);
    font-size: 0.7rem;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    transition: background var(--q-duration), transform var(--q-duration);
}
.config-media-upload__change .lucide { width: 12px; height: 12px; }
.config-media-upload__change:hover {
    background: #fff;
    transform: translateY(-1px);
}
.config-media-upload__change:focus-visible,
.config-media-upload__remove:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
    opacity: 1;
}
.config-media-upload__remove:hover {
    background: rgba(220, 38, 38, 0.85);
    transform: scale(1.08);
}
.config-media-upload__hint {
    display: grid;
    gap: 6px;
    justify-items: center;
    text-align: center;
    padding: 16px;
}
.config-media-upload__icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--q-primary) 6%, transparent);
    color: var(--q-primary);
    display: flex;
    align-items: center;
    justify-content: center;
}
.config-media-upload__icon .lucide { width: 20px; height: 20px; stroke-width: 1.8; }
.config-media-upload__text {
    font-size: var(--q-text-sm);
    font-weight: 650;
    color: var(--q-primary);
}
.config-media-upload__formats {
    font-size: var(--q-text-2xs);
    font-weight: 500;
    color: var(--q-text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.config-media-upload__input { display: none; }

.advanced-panel {
    margin-top: 24px;
    border-radius: 24px;
    border: 1px dashed rgba(217, 30, 13, 0.20);
    background: linear-gradient(180deg, rgba(255, 248, 241, 0.92) 0%, rgba(255, 255, 255, 0.82) 100%);
    box-shadow: var(--q-shadow-soft);
}

.advanced-panel__summary {
    list-style: none;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    cursor: pointer;
}

.advanced-panel__summary::-webkit-details-marker {
    display: none;
}

.advanced-panel__title {
    display: block;
    font-size: 1rem;
    color: var(--q-text-primary);
}

.advanced-panel__copy {
    display: block;
    margin-top: 4px;
    font-size: var(--q-text-xs);
    line-height: 1.5;
    color: var(--q-text-secondary);
}

.advanced-panel__body {
    padding: 0 20px 20px;
}

.config-section-grid--advanced {
    margin-top: 0;
}

.switch-row {
    min-height: 56px;
    padding: 12px 14px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.94);
}

.empty-state {
    border-radius: 20px;
    padding: 30px 22px;
    background: rgba(255, 255, 255, 0.72);
}

.queru-modal__dialog {
    width: min(100%, 620px);
    padding: 34px;
    border-radius: 30px;
    background: rgba(255, 252, 249, 0.96);
}

.login-shell {
    background:
        radial-gradient(circle at top left, rgba(217, 30, 13, 0.10), transparent 24%),
        radial-gradient(circle at bottom right, rgba(208, 156, 106, 0.18), transparent 24%),
        linear-gradient(180deg, #fcf8f2 0%, #f7efe6 100%);
}

.login-card {
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.84);
    backdrop-filter: blur(18px);
}

.login-brand {
    background:
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.12), transparent 26%),
        linear-gradient(145deg, #a80d10 0%, #d91e0d 48%, #eb5f27 100%);
}

.login-brand__title {
    font-family: var(--q-font-display);
    line-height: 0.98;
}

/* ============================================================
   UTILITIES
   ============================================================ */
.hidden {
    display: none !important;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1080px) {
    .metric-grid { grid-template-columns: repeat(2, 1fr); }
    .hours-board__toolbar-main {
        flex-direction: column;
        align-items: stretch;
    }

    .hours-board__meta,
    .hours-board__actions {
        justify-content: flex-start;
    }

    .hours-board__guide {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-hero {
        grid-template-columns: auto 1fr;
        gap: 16px;
    }

    .dashboard-hero__side {
        display: none;
    }

    .dashboard-hero__brand {
        align-self: stretch;
        max-height: 90px;
        border-radius: 16px;
        font-size: 1.6rem;
    }

    .dashboard-hero__greeting {
        font-size: clamp(1.5rem, 6vw, 2rem);
    }

    .dashboard-hero__subtitle {
        font-size: 0.88rem;
    }
    .info-channels { grid-template-columns: 1fr; }
    .info-reference { grid-template-columns: 1fr; }
    .info-reference__item:nth-child(odd)::before { display: none; }
    .info-reference__item:not(:last-child)::after {
        content: "" !important;
        position: absolute !important;
        bottom: 0 !important;
        left: 18px !important;
        top: auto !important;
        right: auto !important;
        width: calc(100% - 36px) !important;
        height: 1px !important;
        background: linear-gradient(90deg, rgba(163, 126, 95, 0), rgba(163, 126, 95, 0.16), rgba(163, 126, 95, 0)) !important;
        pointer-events: none;
    }
    .config-hero { grid-template-columns: 1fr; text-align: center; padding: 22px; }
    .config-hero__brand { justify-self: center; max-height: 80px; }
    .config-hero__content { justify-items: center; }
    .config-hero__slogan { text-align: center; }
    .config-hero__completion { justify-self: center; text-align: center; min-width: 0; width: 100%; }
    .config-hero__completion-chips { justify-content: center; }
    .config-channels { grid-template-columns: 1fr; }
    .config-nav-rail__link { min-width: 0; }
    .config-nav-rail__link { min-width: 0; flex: 1 1 100%; }
    .config-section-grid { grid-template-columns: 1fr; }
    .config-section-card--wide { grid-column: span 1; }
    .checkout-block-row { grid-template-columns: 1fr; }
    .option-grid { grid-template-columns: 1fr; }
    .editor-layout { grid-template-columns: 1fr; }
    .field-grid { grid-template-columns: 1fr; }
    .field-grid--wide { grid-template-columns: repeat(2, 1fr); }

    .editor-panel {
        position: static;
    }

    .summary-pill {
        min-width: 0;
        flex: 1 1 180px;
    }

    .summary-board__row--3,
    .summary-board__row--2 {
        grid-template-columns: 1fr;
    }

    .summary-board__cell:not(:last-child)::after {
        top: auto;
        right: 20px;
        bottom: 0;
        width: calc(100% - 40px);
        height: 1px;
        background: linear-gradient(90deg, rgba(163, 126, 95, 0), rgba(163, 126, 95, 0.16), rgba(163, 126, 95, 0));
    }

    .queru-shell {
        grid-template-columns: 1fr;
    }

    .queru-main {
        padding: 22px 20px 56px;
    }

    /* Mobile topbar — flex row, reordered */
    .panel-topbar {
        position: sticky;
        top: 0;
        z-index: 24;
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 10px;
        padding: 10px 12px;
        margin-bottom: 14px;
        border-radius: 0;
        border: none;
        border-bottom: 1px solid rgba(175, 137, 106, 0.10);
        background: rgba(252, 248, 242, 0.97);
        backdrop-filter: blur(16px);
    }

    /* Store chip mobile — hide avatar (already in lead), show name + chevron */
    .topbar-store-chip {
        padding: 0;
        border: none;
        background: transparent;
        gap: 4px;
        min-height: 0;
    }

    .topbar-store-chip .topbar-store__avatar {
        display: none;
    }

    .topbar-store-chip__eyebrow {
        display: none;
    }

    .topbar-store-chip__name {
        font-size: 0.82rem;
        font-weight: 500;
        max-width: 100px;
    }

    .topbar-store-chip__chevron .lucide {
        width: 12px;
        height: 12px;
    }

    /* Page title — between store and menu */
    .panel-topbar__page {
        flex: 1;
        min-width: 0;
        text-align: left;
    }

    .panel-topbar__page .page-kicker {
        font-size: 0.56rem;
    }

    .panel-topbar__page .page-title {
        font-size: 0.78rem;
        margin-top: 1px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .panel-topbar__page .page-kicker {
        font-size: 0.58rem;
    }

    .panel-topbar__page .page-title {
        font-size: 0.82rem;
        margin-top: 1px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* Actions — split: store goes left (order -1), menu goes right (order 10) */
    .panel-topbar__actions {
        display: contents;
    }

    /* Schedule hidden on mobile */
    .panel-topbar__actions .topbar-schedule {
        display: none;
    }

    /* Lead avatar visible on mobile */
    .panel-topbar__lead {
        display: block;
        flex-shrink: 0;
        order: -1;
    }

    .panel-topbar__lead .topbar-store__avatar {
        width: 38px;
        height: 38px;
        border-radius: 10px;
    }

    /* Divider visible on mobile */
    .panel-topbar__divider {
        display: block;
        height: 24px;
    }

    /* Hamburger — last, right side, with Queru soul */
    .panel-topbar__menu {
        display: inline-flex;
        order: 10;
    }

    .panel-topbar__menu.topbar-icon-button {
        width: 38px;
        height: 38px;
        border-radius: 10px;
        background: var(--q-primary);
        color: var(--q-text-inverse);
        border: none;
        box-shadow: 0 4px 12px rgba(217, 30, 13, 0.20);
    }

    .panel-topbar__menu.topbar-icon-button:hover {
        background: var(--q-primary-dark);
        color: var(--q-text-inverse);
    }

    .panel-topbar__menu.topbar-icon-button .lucide {
        width: 18px;
        height: 18px;
        stroke-width: 2;
    }

    .topbar-schedule__hint {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .mobile-action-strip {
        display: grid;
        gap: 10px;
        margin-bottom: 20px;
    }

    .mobile-action-strip__grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .mobile-action-strip .sidebar-launcher,
    .mobile-action-strip .sidebar-shortcut {
        background: rgba(255, 255, 255, 0.82);
        border-color: var(--q-border-light);
    }

    .mobile-action-strip .sidebar-shortcut.is-copied {
        background: rgba(232, 249, 241, 0.92);
        border-color: rgba(5, 150, 105, 0.22);
    }

    /* ============================================================
       MOBILE SIDEBAR — built from scratch for the dono de delivery
       ============================================================ */

    /* Drawer — full screen feel */
    .queru-sidebar {
        position: fixed;
        inset: 0;
        width: 100%;
        height: 100dvh;
        padding: 0;
        border: none;
        background: #f8f4ef;
        transform: translateX(-100%);
        transition: transform 220ms cubic-bezier(0.4, 0, 0.2, 1);
        z-index: 40;
        overflow-y: auto;
        overflow-x: hidden;
        box-shadow: none;
        -webkit-overflow-scrolling: touch;
    }

    body.queru-admin-body.is-nav-drawer-open .queru-sidebar {
        transform: translateX(0);
    }

    .sidebar-drawer-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        border: none;
        background: rgba(36, 27, 22, 0.4);
        opacity: 0;
        pointer-events: none;
        transition: opacity 200ms ease;
        z-index: 35;
    }

    body.queru-admin-body.is-nav-drawer-open {
        overflow: hidden;
    }

    body.queru-admin-body.is-nav-drawer-open .sidebar-drawer-backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    /* Inner — full height flex column */
    .queru-sidebar__inner {
        gap: 0;
        min-height: 100%;
        padding: 0 24px env(safe-area-inset-bottom, 24px);
    }

    /* ---- Header: logo + close ---- */
    .sidebar-mobile-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 20px 0 24px;
        position: sticky;
        top: 0;
        background: #f8f4ef;
        z-index: 2;
    }

    .brand-lockup {
        padding: 0;
        margin: 0;
        border: none;
    }

    .brand-logo {
        width: min(200px, 100%);
    }

    .sidebar-close {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        border: 1px dashed rgba(175, 137, 106, 0.20);
        border-radius: 12px;
        background: transparent;
        color: var(--q-text-tertiary);
        cursor: pointer;
        transition: border-color 120ms ease, color 120ms ease, background 120ms ease;
    }

    .sidebar-close:hover {
        border-color: var(--q-primary);
        color: var(--q-primary);
        background: rgba(217, 30, 13, 0.04);
    }

    .sidebar-close .lucide {
        width: 18px;
        height: 18px;
        stroke-width: 1.6;
    }

    /* ---- Nav links — big, bold, mobile-native ---- */
    .sidebar-nav {
        display: grid;
        gap: 2px;
        margin-top: 0;
    }

    .sidebar-link {
        min-height: 60px;
        padding: 0 18px;
        font-size: 1.375rem;
        font-weight: 400;
        border-radius: 16px;
        gap: 18px;
        color: var(--q-text-secondary);
        transition: background 120ms ease, color 120ms ease;
    }

    .sidebar-link:hover {
        background: rgba(0, 0, 0, 0.04);
        color: var(--q-text-primary);
    }

    .sidebar-link:active {
        background: rgba(217, 30, 13, 0.08);
        color: var(--q-primary);
        transform: scale(0.98);
    }

    .sidebar-link.is-active {
        background: rgba(0, 0, 0, 0.06);
        color: var(--q-text-primary);
        font-weight: 500;
    }

    .sidebar-link .lucide {
        width: 26px;
        height: 26px;
        stroke-width: 1.3;
    }

    .sidebar-link.is-active .lucide {
        color: var(--q-primary);
    }

    /* ---- Utility rail — visible, bottom section ---- */
    .sidebar-utility-rail {
        display: grid;
        gap: 10px;
        margin-top: 32px;
        padding: 24px 0 max(28px, env(safe-area-inset-bottom, 28px));
        border-top: 1px dashed rgba(175, 137, 106, 0.20);
    }

    .sidebar-section__eyebrow {
        font-size: 0.72rem;
        letter-spacing: 0.06em;
        font-weight: 500;
    }

    .sidebar-launcher {
        grid-template-columns: auto minmax(0, 1fr) auto;
        min-height: 56px;
        padding: 12px 16px;
        border-radius: 16px;
        align-items: center;
    }

    /* Toggle visible on mobile — same row */
    .sidebar-launcher__toggle {
        display: block;
        width: 52px;
        height: 28px;
        border-radius: 999px;
        flex-shrink: 0;
        margin-left: auto;
        position: relative;
        align-self: center;
        overflow: hidden;
    }

    .sidebar-launcher__toggle.status-toggle--open {
        background: var(--q-success);
    }

    .sidebar-launcher__toggle.status-toggle--closed,
    .sidebar-launcher__toggle.status-toggle--paused {
        background: var(--q-danger);
    }

    .sidebar-launcher__toggle .status-toggle__thumb {
        position: absolute;
        top: 4px;
        left: 4px;
        width: 20px;
        height: 20px;
        border-radius: 999px;
        background: #fff;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.10);
        transition: transform 150ms ease;
    }

    .sidebar-launcher__toggle .status-toggle__thumb[data-enabled="true"] {
        transform: translateX(24px);
    }

    .sidebar-launcher__icon {
        width: 40px;
        height: 40px;
        border-radius: 12px;
    }

    .sidebar-launcher__icon .lucide {
        width: 18px;
        height: 18px;
    }

    .sidebar-launcher__title {
        font-size: 1rem;
        font-weight: 500;
    }

    .mobile-action-strip__lead .sidebar-launcher {
        min-height: 84px;
    }

    .mobile-action-strip__lead .sidebar-launcher__body {
        gap: 3px;
        align-self: center;
    }

    .sidebar-shortcut {
        min-height: 52px;
        padding: 12px 16px;
        border-radius: 16px;
    }

    .sidebar-shortcut__icon {
        width: 36px;
        height: 36px;
        border-radius: 10px;
    }

    .sidebar-shortcut__title {
        font-size: 0.95rem;
        font-weight: 500;
    }
}

@media (max-width: 640px) {
    .queru-main {
        padding: var(--q-space-4) var(--q-space-4) 48px;
    }

    .section-card,
    .note-card,
    .dashboard-hero {
        padding: var(--q-space-4);
    }

    .panel-topbar {
        gap: 10px;
        padding: 10px 12px;
        border-radius: 18px;
    }

    .topbar-store {
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 10px;
    }

    .topbar-store__avatar {
        width: 44px;
        height: 44px;
        border-radius: 13px;
    }

    .topbar-account__trigger {
        min-width: 52px;
        padding: 0 10px;
    }

    .topbar-schedule {
        padding: 10px 12px;
    }

    .mobile-action-strip__grid {
        grid-template-columns: 1fr;
    }

    .hours-board__toolbar {
        padding: var(--q-space-4);
    }

    .hours-board__toolbar-main {
        flex-direction: column;
        align-items: stretch;
    }

    .hours-board__meta,
    .hours-board__actions {
        justify-content: flex-start;
    }

    .hours-board__guide {
        grid-template-columns: 1fr;
        margin: var(--q-space-3) var(--q-space-4) 0;
    }

    .hours-week-list {
        padding: var(--q-space-4);
    }

    .hours-day-card__head {
        flex-direction: column;
        align-items: stretch;
    }

    .hours-day-card__switch {
        justify-content: space-between;
    }

    .hours-day-card__interval-row {
        flex-direction: column;
        align-items: stretch;
    }

    .hours-day-card__interval-toggle {
        justify-content: space-between;
    }

    .hours-slot {
        grid-template-columns: 1fr;
    }

    .hours-slot__inputs {
        grid-template-columns: 1fr;
    }

    .hours-slot__separator {
        display: none;
    }

    .dashboard-hero {
        gap: 14px;
    }

    .dashboard-hero__greeting {
        max-width: none;
    }

    .login-card {
        grid-template-columns: 1fr;
    }

    .login-brand {
        padding: var(--q-space-6);
    }

    .login-form-wrap {
        padding: var(--q-space-6);
    }

    .list-card__head {
        flex-direction: column;
    }

    .list-card--product {
        grid-template-columns: 1fr;
    }

    .list-card__media {
        width: 100%;
        height: 180px;
    }

    .summary-board__cell {
        min-height: 0;
    }

    .config-jump-nav__link,
    .summary-pill {
        width: 100%;
    }

    .info-channels {
        grid-template-columns: 1fr;
    }

    .info-reference {
        grid-template-columns: 1fr;
    }

    .info-reference__edit {
        opacity: 1;
    }

    .card-actions,
    .form-actions {
        width: 100%;
    }

    .card-actions > *,
    .form-actions > * {
        flex: 1;
    }

    .field-grid--wide {
        grid-template-columns: 1fr;
    }

    .bullet-list--dashboard {
        grid-template-columns: 1fr;
    }

.focus-card {
        grid-template-columns: auto 1fr auto;
    }
}

/* ============================================================
   MENU CONTROL — Hoje / Semana / Modelos
   ============================================================ */
.menu-surface {
    display: grid;
    gap: var(--q-space-5);
}

.editor-layout--menu-ops {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
}

.menu-week-layout.editor-layout--menu-ops {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.menu-mode-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--q-space-3);
}

.menu-mode-card {
    display: grid;
    gap: 6px;
    text-align: left;
    padding: 18px;
    border: 1px solid var(--q-border-light);
    border-radius: 18px;
    background: color-mix(in srgb, var(--q-surface) 92%, var(--q-bg-warm));
    transition: transform var(--q-duration) var(--q-ease), border-color var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease), background var(--q-duration) var(--q-ease);
}

.menu-mode-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--q-shadow-sm);
}

.menu-mode-card.is-active {
    border-color: color-mix(in srgb, var(--q-primary) 38%, var(--q-border));
    box-shadow: var(--q-shadow-primary);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 243, 238, 0.92));
}

.menu-mode-card__label {
    font-size: var(--q-text-2xs);
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--q-text-muted);
    font-weight: 700;
}

.menu-mode-card__title {
    font-size: var(--q-text-lg);
    font-weight: 700;
    color: var(--q-text-primary);
}

.menu-mode-card__copy {
    font-size: var(--q-text-sm);
    color: var(--q-text-secondary);
}

.menu-mode-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--q-space-2);
}

.menu-live-strip {
    display: flex;
    flex-wrap: wrap;
    gap: var(--q-space-2);
}

.menu-live-pill {
    display: inline-flex;
    align-items: center;
    gap: var(--q-space-2);
    padding: 10px 14px;
    border-radius: var(--q-radius-full);
    border: 1px solid color-mix(in srgb, var(--q-success) 22%, var(--q-border));
    background: color-mix(in srgb, var(--q-success) 10%, #ffffff);
}

.menu-live-pill__title {
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-primary);
}

.menu-live-pill__meta {
    font-size: var(--q-text-xs);
    color: var(--q-success-dark);
    font-weight: 700;
}

.empty-state--menu {
    width: 100%;
}

.list-card--menu-item,
.list-card--menu-toggle,
.menu-day-card,
.scope-choice {
    border-radius: 18px;
}

.menu-day-card {
    display: grid;
    gap: 10px;
    width: 100%;
    padding: 16px 18px;
    border: 1px solid var(--q-border-light);
    background: color-mix(in srgb, var(--q-surface) 94%, var(--q-bg-warm));
    text-align: left;
    cursor: pointer;
    transition: border-color var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease), transform var(--q-duration) var(--q-ease);
}

.menu-day-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--q-shadow-sm);
}

.menu-day-card.is-active {
    border-color: color-mix(in srgb, var(--q-primary) 34%, var(--q-border));
    box-shadow: var(--q-shadow-primary);
}

.menu-day-card:focus-visible {
    outline: none;
    border-color: color-mix(in srgb, var(--q-primary) 38%, var(--q-border));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-primary) 10%, transparent), var(--q-shadow-primary);
}

.menu-day-card.is-today {
    border-color: color-mix(in srgb, var(--q-success) 22%, var(--q-border));
}

.menu-day-card.is-today.is-active {
    border-color: color-mix(in srgb, var(--q-primary) 34%, var(--q-border));
}

.menu-day-card__today-badge {
    display: inline-flex;
    align-items: center;
    padding: 1px 8px;
    border-radius: 6px;
    background: var(--q-success-soft);
    color: var(--q-success-dark);
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    vertical-align: middle;
    margin-left: 6px;
}

.menu-day-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--q-space-3);
}

.menu-day-card__select,
.menu-day-card__body {
    width: 100%;
    border: none;
    background: transparent;
    color: inherit;
    padding: 0;
    margin: 0;
    text-align: left;
    cursor: pointer;
}

.menu-day-card__title-group {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.menu-day-card__title {
    font-size: var(--q-text-md);
    font-weight: 700;
}

.menu-day-card__action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--q-text-xs);
    font-weight: 700;
    color: var(--q-text-tertiary);
}

.menu-day-card__copy {
    font-size: var(--q-text-sm);
    color: var(--q-text-secondary);
}

.menu-day-card__head-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.menu-day-card__copy-btn {
    min-height: 32px;
    padding-inline: 10px;
    font-size: var(--q-text-2xs);
    flex-shrink: 0;
}

.menu-day-card__copy-btn--active {
    border-color: color-mix(in srgb, var(--q-primary) 28%, var(--q-border));
    background: color-mix(in srgb, var(--q-primary) 8%, #ffffff);
    color: var(--q-primary);
}

.menu-day-card__copy-btn .lucide {
    width: 14px;
    height: 14px;
}

.menu-day-card__body {
    display: grid;
    gap: 10px;
}

.menu-week-toolbar {
    display: grid;
    gap: var(--q-space-3);
    margin-bottom: var(--q-space-4);
}

.menu-week-toolbar__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--q-space-2);
}

.menu-week-toolbar__row--main {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.35fr);
    align-items: center;
}

.menu-week-toolbar__row--compact {
    grid-template-columns: minmax(0, 1fr);
}

.menu-week-toolbar__row--main > *,
.menu-week-toolbar__row--compact > * {
    min-width: 0;
}

.menu-week-layout .editor-list,
.menu-week-layout .editor-panel {
    min-width: 0;
    align-self: start;
}

.menu-week-layout .editor-panel {
    top: 0;
}

.menu-sets-layout .editor-list,
.menu-sets-layout .editor-panel {
    min-width: 0;
    align-self: start;
}

.menu-sets-layout .editor-panel {
    top: 0;
}

.menu-week-editor-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: flex-start;
    gap: var(--q-space-4);
    margin-bottom: var(--q-space-4);
}

.menu-week-editor-head__copy {
    min-width: 0;
    display: grid;
    gap: var(--q-space-2);
}

.menu-week-editor-head__top {
    display: flex;
    align-items: flex-start;
    gap: var(--q-space-3);
}

.menu-week-editor-head__title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--q-space-2);
}

.menu-week-editor-head__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: nowrap;
    flex-shrink: 0;
    align-self: start;
    min-height: 40px;
}

.menu-week-editor-head__idle {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(107, 94, 87, 0.06);
    color: var(--q-text-tertiary);
    font-size: var(--q-text-2xs);
    font-weight: 700;
    letter-spacing: 0.03em;
}

.menu-week-editor-head__action-buttons {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.menu-week-editor-head__action-buttons .primary-button,
.menu-week-editor-head__action-buttons .secondary-button {
    min-height: 36px;
    padding-inline: 14px;
    font-size: var(--q-text-2xs);
}

.menu-week-editor-head__dirty-chip[hidden] {
    display: none;
}

.menu-week-scope-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--q-space-3);
    margin-bottom: var(--q-space-3);
    padding: 14px 16px;
    min-height: 92px;
    border-radius: 20px;
    border: 1px solid rgba(183, 146, 115, 0.16);
    background: linear-gradient(180deg, rgba(255, 252, 248, 0.96) 0%, rgba(255, 248, 242, 0.9) 100%);
}

.menu-week-scope-strip--today {
    border-color: rgba(217, 30, 13, 0.16);
    background: linear-gradient(180deg, rgba(255, 249, 246, 0.98) 0%, rgba(255, 244, 238, 0.92) 100%);
}

.menu-week-scope-strip__copy {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.menu-week-scope-strip__icon {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--q-primary);
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(183, 146, 115, 0.14);
}

.menu-week-scope-strip__title {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-primary);
}

.menu-week-scope-strip__text {
    margin: 4px 0 0;
    font-size: var(--q-text-xs);
    line-height: 1.55;
    color: var(--q-text-secondary);
    max-width: 54ch;
}

.menu-week-scope-strip__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--q-space-2);
    flex-wrap: wrap;
}

.menu-week-scope-strip__cta {
    min-width: 156px;
    justify-content: center;
}

.menu-week-scope-strip__actions .secondary-button,
.menu-week-scope-strip__actions .ghost-button {
    min-height: 42px;
    padding-inline: 16px;
    font-size: var(--q-text-2xs);
}

.menu-week-scope-strip__cta--today {
    border-style: solid;
    border-color: rgba(217, 30, 13, 0.26);
    color: var(--q-primary);
    background: rgba(255, 255, 255, 0.8);
}

.menu-week-toolbar__row--main .select,
.menu-week-toolbar__row--main .search-bar,
.menu-week-toolbar__row--compact .search-bar {
    min-height: 44px;
}

.menu-week-toolbar__search {
    width: 100%;
}

.menu-week-toolbar__select {
    padding-right: 48px;
}

.menu-week-toolbar__search input::placeholder {
    color: color-mix(in srgb, var(--q-text-tertiary) 90%, #ffffff);
}

.menu-set-editor-card {
    padding: 18px;
    border: 1px solid rgba(163, 126, 95, 0.16);
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 249, 243, 0.84) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.menu-set-editor-toolbar {
    display: grid;
    gap: var(--q-space-2);
}

.menu-set-editor-toolbar__search {
    width: 100%;
}

.menu-set-editor-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.menu-sets-library {
    gap: 16px;
}

/* ---- Menu Set Cards (Modelos prontos) ---- */
.list-card--menu-set {
    gap: 10px;
    padding: 16px 18px;
    border-radius: var(--q-radius-2xl);
    background: color-mix(in srgb, var(--q-bg) 94%, #ffffff);
}

.list-card--menu-set .list-card__head {
    gap: 10px;
}

.list-card--menu-set .list-card__title {
    font-size: var(--q-text-md);
    font-weight: 700;
}

.list-card__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
}

.menu-set-card__actions {
    display: flex;
    align-items: center;
    gap: 2px;
    flex-wrap: wrap;
    padding-top: 6px;
    border-top: 1px dashed var(--q-border-light);
}

/* Expand section */
.list-card__expand {
    padding: 10px 0 0;
    border-top: 1px solid var(--q-border-light);
}

.list-card__expand-list {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.list-card__expand-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: var(--q-radius-sm);
    background: rgba(107, 94, 87, 0.04);
    font-size: var(--q-text-2xs);
    font-weight: 600;
    color: var(--q-text-primary);
    line-height: 1.3;
}

.list-card__expand-price {
    color: var(--q-success-dark);
    font-weight: 700;
}

/* select--compact removed — using product-card__action pattern instead */

.ghost-button--icon {
    width: 40px;
    height: 40px;
    padding: 0;
    justify-content: center;
}

.menu-checklist {
    max-height: 720px;
    overflow: auto;
    padding-right: 4px;
}

.list-card--menu-toggle {
    display: grid;
    gap: var(--q-space-3);
}

.menu-checklist__toggle {
    justify-self: flex-end;
}

.scope-choice {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--q-space-3);
    align-items: start;
    width: 100%;
    padding: 16px 18px;
    border: 1px solid var(--q-border-light);
    background: color-mix(in srgb, var(--q-surface) 94%, var(--q-bg-warm));
    text-align: left;
    transition: border-color var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease), transform var(--q-duration) var(--q-ease);
}

.scope-choice:hover {
    transform: translateY(-1px);
    box-shadow: var(--q-shadow-sm);
}

.scope-choice__icon {
    display: inline-flex;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: color-mix(in srgb, var(--q-primary) 10%, #ffffff);
    color: var(--q-primary);
}

.scope-choice--default .scope-choice__icon {
    background: color-mix(in srgb, var(--q-success) 12%, #ffffff);
    color: var(--q-success-dark);
}

.scope-choice__body {
    display: grid;
    gap: 4px;
}

.scope-choice__title {
    font-size: var(--q-text-md);
    font-weight: 700;
    color: var(--q-text-primary);
}

.scope-choice__copy {
    font-size: var(--q-text-sm);
    color: var(--q-text-secondary);
}

/* ============================================================
   CARDÁPIO V2 — Hoje, Semana, Modelos
   ============================================================ */

/* ---- Menu Today surface ---- */
.menu-today-surface {
    display: grid;
    gap: 20px;
}

/* ---- Mode selector V2 ---- */
.menu-mode-surface {
    display: grid;
    gap: 14px;
}

.menu-mode-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.menu-mode-header__text {
    display: grid;
    gap: 4px;
}

.menu-mode-strip {
    display: flex;
    gap: 6px;
}

.menu-mode-card {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    border: 1px solid rgba(163, 126, 95, 0.14);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.7);
    color: var(--q-text-secondary);
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 150ms ease;
    white-space: nowrap;
}

.menu-mode-card:hover {
    background: rgba(255, 255, 255, 0.95);
    border-color: rgba(163, 126, 95, 0.28);
    color: var(--q-text-primary);
}

.menu-mode-card.is-active {
    background: var(--q-primary);
    border-color: var(--q-primary);
    color: #fff;
    box-shadow: 0 4px 14px rgba(217, 30, 13, 0.18);
}

.menu-mode-card__label {
    font-size: inherit;
    font-weight: inherit;
}

.menu-mode-context {
    margin: 0;
    font-size: 0.82rem;
    color: var(--q-text-tertiary);
    line-height: 1.45;
}

/* ---- Today control surface ---- */
.today-control-surface {
    display: grid;
    gap: 16px;
}

.today-control-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.section-divider {
    border: none;
    border-top: 1px dashed rgba(175, 137, 106, 0.18);
    margin: 0;
}

.section-divider--light {
    border-top-color: rgba(175, 137, 106, 0.10);
}

.today-list-header {
    display: flex;
    gap: 10px;
}

.today-list-header .search-bar {
    flex: 1;
    max-width: 320px;
}

/* ---- Today item row — compact inline toggle ---- */
.today-item-group {
    display: grid;
    gap: 0;
}

.today-item-row {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 48px;
    padding: 8px 12px;
    border-bottom: 1px solid rgba(175, 137, 106, 0.08);
    transition: background 120ms ease;
}

.today-item-row:last-child {
    border-bottom: none;
}

.today-item-row:hover {
    background: rgba(0, 0, 0, 0.02);
}

.today-item-row--live {
    background: color-mix(in srgb, var(--q-success) 4%, transparent);
}

.today-item-row--live:hover {
    background: color-mix(in srgb, var(--q-success) 7%, transparent);
}

.today-item-row__name {
    flex: 1;
    min-width: 0;
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--q-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.today-item-row__price {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--q-primary);
    white-space: nowrap;
}

/* Toggle switch */
.today-item-row__toggle {
    position: relative;
    width: 44px;
    height: 24px;
    border: none;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.12);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 150ms ease;
    padding: 0;
}

.today-item-row__toggle--on {
    background: var(--q-success);
}

.today-item-row__toggle-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    transition: transform 150ms ease;
}

.today-item-row__toggle--on .today-item-row__toggle-thumb {
    transform: translateX(20px);
}

/* Today group separator */
.today-item-group--off {
    opacity: 0.7;
}

.today-item-group--off:hover {
    opacity: 1;
}

/* ---- Compact checklist (Semana + Modelos) ---- */
.menu-checklist-compact {
    display: grid;
    gap: 0;
    max-height: 520px;
    overflow-y: auto;
    border: 1px solid rgba(175, 137, 106, 0.12);
    border-radius: 16px;
}

.menu-week-layout--mobile-overview .editor-list,
.menu-week-layout--mobile-overview .editor-panel,
.menu-week-layout--mobile-detail .editor-list,
.menu-week-layout--mobile-detail .editor-panel {
    min-width: 0;
}

.checklist-row {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 44px;
    padding: 6px 14px;
    border-bottom: 1px solid rgba(175, 137, 106, 0.06);
    cursor: pointer;
    transition: background 100ms ease;
}

.checklist-row:last-child {
    border-bottom: none;
}

.checklist-row:hover {
    background: rgba(0, 0, 0, 0.02);
}

.checklist-row--on {
    background: color-mix(in srgb, var(--q-success) 5%, transparent);
}

.checklist-row__name {
    flex: 1;
    min-width: 0;
    font-size: 0.86rem;
    font-weight: 500;
    color: var(--q-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.checklist-row__price {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--q-text-tertiary);
    white-space: nowrap;
}

.checklist-row__input {
    width: 18px;
    height: 18px;
    border-radius: 4px;
    accent-color: var(--q-success);
    flex-shrink: 0;
    cursor: pointer;
}

/* ============================================================
   PRODUCTS V2 — Grid + Modal
   ============================================================ */

/* ---- Toolbar ---- */
.products-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 20px;
}

.products-toolbar .search-bar {
    flex: 1;
    max-width: 360px;
}

/* ---- Product Grid (row cards, 2 per row) ---- */
.product-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

/* ---- Product Card ---- */
/* ---- Product Card V2 (two-row layout) ---- */
.product-card {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0;
    border-radius: 16px;
    border: 1px solid rgba(163, 126, 95, 0.1);
    background: rgba(255, 255, 255, 0.92);
    cursor: pointer;
    overflow: hidden;
    min-width: 0;
    transition: background 150ms var(--q-ease), border-color 150ms var(--q-ease), opacity 150ms var(--q-ease);
}

.product-card__main {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
}

.product-card:hover {
    background: rgba(255, 255, 255, 1);
    border-color: rgba(163, 126, 95, 0.22);
}

.product-card:focus-visible {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
}

/* Paused state */
.product-card--paused {
    opacity: 0.5;
}

.product-card--paused:hover {
    opacity: 0.8;
}

/* Thumbnail */
.product-card__thumb {
    width: 80px;
    height: 80px;
    border-radius: 14px;
    flex-shrink: 0;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(255, 247, 240, 0.9), rgba(245, 233, 219, 0.7));
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.product-card__thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-card__thumb--empty {
    width: 56px;
    height: 56px;
    border-radius: 12px;
}

.product-card__no-photo {
    color: rgba(163, 126, 95, 0.2);
    display: inline-flex;
}

.product-card__no-photo .lucide {
    width: 18px;
    height: 18px;
    stroke-width: 1.4;
}

/* Info block */
.product-card__info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.product-card__name {
    margin: 0;
    font-size: 0.94rem;
    font-weight: 650;
    line-height: 1.3;
    color: var(--q-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-card__status-pill {
    font-size: 0.66rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 3px 10px;
    border-radius: var(--q-radius-full);
    flex-shrink: 0;
    line-height: 1.4;
    white-space: nowrap;
}

.product-card__status-pill--active {
    background: color-mix(in srgb, var(--q-success) 12%, #ffffff);
    color: var(--q-success-dark);
}

.product-card__status-pill--paused {
    background: rgba(107, 94, 87, 0.08);
    color: var(--q-text-tertiary);
}

.product-card__price {
    margin: 0;
    font-size: 0.88rem;
    font-weight: 800;
    color: var(--q-success-dark);
    line-height: 1.3;
    white-space: nowrap;
}

/* Footer: category left, actions + status right */
.product-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 14px;
    border-top: 1px solid rgba(163, 126, 95, 0.06);
    background: rgba(250, 247, 244, 0.5);
}

.product-card__footer-left {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    overflow: hidden;
}

.product-card__footer-right {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.product-card__catalog-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 34px;
    padding: 0 12px;
    border: 1px solid rgba(163, 126, 95, 0.12);
    border-radius: var(--q-radius-full);
    background: rgba(250, 247, 244, 0.92);
    color: var(--q-text-secondary);
    cursor: pointer;
    transition:
        border-color 150ms var(--q-ease),
        background 150ms var(--q-ease),
        color 150ms var(--q-ease),
        box-shadow 150ms var(--q-ease);
}

.product-card__catalog-toggle:hover {
    background: rgba(255, 255, 255, 1);
    border-color: rgba(163, 126, 95, 0.22);
}

.product-card__catalog-toggle:focus-visible {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
}

.product-card__catalog-toggle.is-active {
    background: color-mix(in srgb, var(--q-success) 8%, #ffffff);
    border-color: color-mix(in srgb, var(--q-success) 22%, rgba(163, 126, 95, 0.12));
    color: var(--q-success-dark);
}

.product-card__catalog-toggle-track {
    position: relative;
    width: 34px;
    height: 20px;
    border-radius: var(--q-radius-full);
    background: rgba(107, 94, 87, 0.18);
    flex-shrink: 0;
    transition: background 150ms var(--q-ease);
}

.product-card__catalog-toggle.is-active .product-card__catalog-toggle-track {
    background: color-mix(in srgb, var(--q-success) 48%, rgba(15, 118, 110, 0.2));
}

.product-card__catalog-toggle-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 2px 6px rgba(107, 94, 87, 0.18);
    transition: transform 150ms var(--q-ease);
}

.product-card__catalog-toggle.is-active .product-card__catalog-toggle-thumb {
    transform: translateX(14px);
}

.product-card__catalog-toggle-label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.product-card__category {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--q-primary);
    background: color-mix(in srgb, var(--q-primary) 8%, #ffffff);
    padding: 3px 10px;
    border-radius: var(--q-radius-full);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}

.product-card__warning {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px;
    border-radius: var(--q-radius-full);
    background: color-mix(in srgb, var(--q-warning-soft) 74%, #ffffff);
    color: #9a5b12;
    font-size: 0.68rem;
    font-weight: 700;
    white-space: nowrap;
}

.product-card__warning .lucide {
    width: 12px;
    height: 12px;
    stroke-width: 1.9;
}

.product-card__divider {
    width: 1px;
    height: 20px;
    border-left: 1px dashed var(--q-border);
    flex-shrink: 0;
    margin: 0 2px;
}

.product-card__action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    height: 34px;
    padding: 0 12px;
    border-radius: 10px;
    border: none;
    background: transparent;
    color: var(--q-text-tertiary);
    font-size: 0.76rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 150ms var(--q-ease), color 150ms var(--q-ease);
}

.product-card__action .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.8;
    flex-shrink: 0;
}

.product-card__action span {
    font-family: var(--q-font-primary);
}

.product-card__action:hover {
    background: rgba(107, 94, 87, 0.07);
    color: var(--q-text-primary);
}

.product-card__action.btn-loading {
    padding-inline-end: 28px;
}

.product-card__action--danger {
    padding: 0 10px;
}

.product-card__action--danger:hover {
    background: rgba(220, 38, 38, 0.07);
    color: #DC2626;
}

/* Compact actions on smaller screens */
@media (max-width: 900px) {
    .product-card__catalog-toggle {
        padding: 0 10px;
    }

    .product-card__catalog-toggle-label {
        display: none;
    }

    .product-card__action span {
        display: none;
    }

    .product-card__action {
        padding: 0;
        width: 44px;
        height: 44px;
        justify-content: center;
    }

    .product-card__footer-right {
        gap: 4px;
    }

    .product-card__divider {
        height: 20px;
    }
}

@media (max-width: 480px) {
    .product-card__divider {
        display: none;
    }

    .product-card__footer {
        gap: 6px;
        padding: 6px 10px;
    }

    .product-card__footer-left {
        display: none;
    }

    .product-card__footer-right {
        width: 100%;
        justify-content: flex-end;
    }
}

/* ---- Q-Modal (shared modal component) ---- */
.q-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.q-modal.hidden {
    display: none;
}

.q-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(47, 25, 14, 0.26);
    backdrop-filter: blur(10px);
    cursor: pointer;
}

.q-modal__dialog {
    position: relative;
    width: 100%;
    max-width: 600px;
    max-height: calc(100dvh - 48px);
    overflow-y: auto;
    background: rgba(255, 253, 249, 0.98);
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 24px;
    box-shadow: 0 30px 70px rgba(15, 23, 42, 0.16);
}

.q-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 0;
    position: sticky;
    top: 0;
    background: rgba(255, 253, 249, 0.98);
    z-index: 2;
}

.q-modal__header-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.q-modal__title {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--q-text-primary);
    letter-spacing: -0.02em;
}

.q-modal__subtitle {
    margin: 0;
    font-size: var(--q-text-xs);
    line-height: 1.5;
    color: var(--q-text-secondary);
}

.q-modal__close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: var(--q-text-tertiary);
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease;
}

.q-modal__close:hover {
    background: rgba(0, 0, 0, 0.05);
    color: var(--q-text-primary);
}

.q-modal__close:focus-visible {
    outline: none;
    background: rgba(217, 30, 13, 0.08);
    color: var(--q-primary);
    box-shadow: 0 0 0 3px rgba(217, 30, 13, 0.12);
}

.q-modal__close:active {
    transform: translateY(1px);
}

.q-modal__close .lucide {
    width: 18px;
    height: 18px;
    stroke-width: 1.8;
}

.q-modal__body {
    padding: 20px 24px;
    display: grid;
    gap: 20px;
}

.q-modal__footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    padding-top: 16px;
    border-top: 1px dashed rgba(175, 137, 106, 0.16);
    margin-top: 4px;
}

.q-modal__dialog--work {
    max-width: var(--q-modal-width-work);
}

.q-modal__dialog--work-wide {
    max-width: var(--q-modal-width-work-wide);
}

html.is-overlay-open,
body.queru-admin-body.is-overlay-open {
    overflow: hidden;
    overscroll-behavior: none;
}

.q-modal__footer--sticky {
    position: sticky;
    bottom: 0;
    z-index: 2;
    margin-inline: calc(var(--q-space-6) * -1);
    margin-block-end: calc(var(--q-space-5) * -1);
    padding-block: 16px;
    padding-inline: 24px;
    background: linear-gradient(180deg, rgba(255, 253, 249, 0) 0%, rgba(255, 253, 249, 0.92) 34%, rgba(255, 253, 249, 0.98) 100%);
    backdrop-filter: blur(8px);
}

.q-modal__footer--split {
    justify-content: space-between;
    align-items: end;
    gap: 16px;
}

.q-modal__footer-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
    flex: 1 1 280px;
}

.q-modal__footer-title {
    margin: 0;
    color: var(--q-text-primary);
    font-size: var(--q-text-sm);
    font-weight: 800;
    letter-spacing: -0.02em;
}

.q-modal__footer-hint {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.5;
}

.q-modal__footer-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.q-modal__footer-actions > * {
    min-block-size: 44px;
}

.modal-form-grid .field {
    min-width: 0;
}

.modal-form-grid .field:not(.field--toggle-row) {
    display: grid;
    gap: 6px;
    align-content: start;
    grid-template-rows: auto minmax(48px, auto) minmax(2.4rem, auto);
}

.modal-form-grid .field-label {
    min-block-size: 1.5rem;
    display: flex;
    align-items: flex-end;
    line-height: 1.35;
}

.modal-form-grid .field:not(.field--toggle-row):not(:has(.field-help))::after {
    content: '';
    display: block;
    min-block-size: 2.4rem;
}

.modal-form-grid .field-help {
    min-block-size: 2.4rem;
    line-height: 1.45;
}

.modal-form-grid .input,
.modal-form-grid .select,
.modal-form-grid .textarea {
    align-self: start;
}

.modal-form-grid--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
}

.modal-form-grid--two .field--full,
.modal-form-grid--two .q-modal__footer {
    grid-column: 1 / -1;
}

/* Product modal footer — sticky */
.product-modal__footer {
    position: sticky;
    bottom: 0;
    z-index: 2;
    background: rgba(255, 253, 249, 0.96);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    padding: 14px 24px 18px;
    border-top: 1px solid var(--q-border-light);
    margin: 0 -24px -20px;
    width: calc(100% + 48px);
}

/* ---- Collapsible form cluster (details/summary) ---- */
.form-cluster--collapsible {
    padding: 0;
    border: 1px dashed rgba(175, 137, 106, 0.14);
    background: transparent;
    box-shadow: none;
}

.form-cluster__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 18px;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.form-cluster__toggle::-webkit-details-marker {
    display: none;
}

.form-cluster__toggle .form-cluster__title {
    padding: 0;
    font-size: var(--q-text-2xs);
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.form-cluster__toggle-hint {
    font-size: var(--q-text-2xs);
    color: var(--q-text-tertiary);
}

.form-cluster--collapsible[open] .form-cluster__toggle {
    border-bottom: 1px dashed rgba(175, 137, 106, 0.14);
}

.form-cluster--collapsible[open] .field-grid {
    padding: 0 18px 18px;
}

/* ---- Toggle inline (inside form cluster) ---- */
.field--toggle-inline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-radius: 12px;
    background: rgba(107, 94, 87, 0.03);
    border: 1px solid rgba(175, 137, 106, 0.1);
}

.field--toggle-inline .field-label {
    font-weight: 600;
}

/* ---- Form validation visual feedback ---- */
.input:invalid:not(:placeholder-shown),
.textarea:invalid:not(:placeholder-shown),
.select:invalid {
    border-color: color-mix(in srgb, var(--q-danger) 40%, var(--q-border));
}

.input:invalid:not(:placeholder-shown):focus,
.textarea:invalid:not(:placeholder-shown):focus {
    border-color: var(--q-danger);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-danger) 8%, transparent);
}

/* ---- Variation onboarding (Step 2 empty state) ---- */
.variation-onboarding {
    display: grid;
    gap: 10px;
    justify-items: center;
    text-align: center;
    padding: 48px 32px;
    border: 1px dashed rgba(175, 137, 106, 0.2);
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 249, 243, 0.7) 100%);
}

.variation-onboarding__icon {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: color-mix(in srgb, var(--q-primary) 8%, #fff);
    color: var(--q-primary);
}

.variation-onboarding__icon .lucide {
    width: 22px;
    height: 22px;
}

.variation-onboarding__title {
    font-size: var(--q-text-md);
    font-weight: 700;
    color: var(--q-text-primary);
}

.variation-onboarding__copy {
    font-size: var(--q-text-sm);
    color: var(--q-text-secondary);
    max-width: 400px;
    line-height: 1.5;
}

.variation-onboarding__actions {
    display: flex;
    gap: 10px;
    margin-top: 8px;
}

/* ---- Form advanced (collapsible) ---- */
.form-advanced {
    border: 1px solid rgba(175, 137, 106, 0.12);
    border-radius: 16px;
    padding: 0;
    overflow: hidden;
}

.form-advanced__toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--q-text-tertiary);
    cursor: pointer;
    transition: color 120ms ease;
    list-style: none;
}

.form-advanced__toggle::-webkit-details-marker { display: none; }
.form-advanced__toggle::marker { display: none; content: ''; }

.form-advanced__toggle:hover {
    color: var(--q-text-primary);
}

.form-advanced[open] .form-advanced__toggle {
    border-bottom: 1px solid rgba(175, 137, 106, 0.10);
    color: var(--q-text-primary);
}

.form-advanced .form-cluster {
    padding: 16px;
    border: none;
    margin: 0;
}

/* ---- Toggle row field ---- */
.field--toggle-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.field-toggle-text {
    display: grid;
    gap: 2px;
    flex: 1;
}

.field--toggle-row .select--compact {
    width: auto;
    min-width: 120px;
    flex-shrink: 0;
}

/* ---- Media field preview in modal ---- */
.product-modal__dialog .media-field__preview {
    aspect-ratio: 16 / 10;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(175, 137, 106, 0.12);
    background: linear-gradient(180deg, rgba(255, 247, 240, 1) 0%, rgba(245, 233, 219, 0.88) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.product-modal__dialog .media-field__preview img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-modal__dialog .media-field__placeholder {
    color: rgba(163, 126, 95, 0.3);
    display: inline-flex;
}

.product-modal__dialog .media-field__placeholder .lucide {
    width: 28px;
    height: 28px;
    stroke-width: 1.4;
}

.product-modal__dialog {
    max-width: var(--q-modal-width-work-wide);
}

.product-modal__header-copy {
    display: grid;
    gap: 4px;
}

.product-modal__subtitle {
    margin: 0;
    font-size: var(--q-text-xs);
    line-height: 1.45;
    color: var(--q-text-secondary);
}

.product-modal__body {
    gap: 16px;
}

/* ---- Product Stepper V2 (slim bar) ---- */
.product-stepper--slim {
    --product-stepper-pill-width: 168px;
    --product-stepper-rail-width: 24px;
    --product-stepper-rail-gap: 8px;
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    border: 1px solid rgba(175, 137, 106, 0.16);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(247, 241, 234, 0.92) 0%, rgba(255, 250, 244, 0.96) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    width: fit-content;
    max-width: 100%;
    margin: 0 auto;
    justify-self: center;
}

.product-stepper--slim .product-stepper__step {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 var(--product-stepper-pill-width);
    min-width: var(--product-stepper-pill-width);
    gap: 10px;
    min-height: 46px;
    padding: 0 10px;
    border-radius: 14px;
    border: 1px solid rgba(175, 137, 106, 0.08);
    background: linear-gradient(180deg, rgba(255, 252, 248, 0.74) 0%, rgba(252, 245, 238, 0.68) 100%);
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
    transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.product-stepper--slim .product-stepper__rail {
    position: relative;
    display: block;
    flex: 0 0 var(--product-stepper-rail-width);
    width: var(--product-stepper-rail-width);
    height: 0;
    margin: 0 var(--product-stepper-rail-gap);
    pointer-events: none;
    border-top: 1px dashed rgba(175, 137, 106, 0.22);
}

.product-stepper--slim .product-stepper__rail::after {
    content: "";
    position: absolute;
    left: 0;
    top: -1px;
    width: 0;
    border-top: 1px dashed rgba(217, 30, 13, 0.55);
    opacity: 0;
    transition: width 220ms ease, opacity 180ms ease;
}

.product-stepper--slim[data-step="variations"] .product-stepper__rail::after {
    width: 100%;
    opacity: 0.78;
}

.product-stepper--slim .product-stepper__step:hover:not(.is-active) {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.86) 0%, rgba(252, 245, 238, 0.78) 100%);
    border-color: rgba(175, 137, 106, 0.12);
    transform: translateY(-1px);
}

.product-stepper--slim .product-stepper__step:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-primary) 10%, transparent);
}

.product-stepper--slim .product-stepper__step.is-active {
    background: #fff;
    border-color: rgba(175, 137, 106, 0.14);
    box-shadow: 0 10px 24px rgba(68, 39, 18, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.product-stepper--slim .product-stepper__step.is-complete {
    background: linear-gradient(180deg, rgba(255, 252, 248, 0.86) 0%, rgba(252, 245, 238, 0.8) 100%);
    border-color: rgba(175, 137, 106, 0.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.product-stepper--slim .product-stepper__index {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    position: relative;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 0.72rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: var(--q-text-tertiary);
    background: rgba(107, 94, 87, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
    transition: background 180ms ease, color 180ms ease, box-shadow 180ms ease;
    line-height: 1;
}

.product-stepper--slim .product-stepper__step.is-active .product-stepper__index {
    color: #fff;
    background: var(--q-primary);
    box-shadow: 0 8px 18px rgba(217, 30, 13, 0.18);
}

.product-stepper--slim .product-stepper__step.is-complete .product-stepper__index {
    color: transparent;
    background: rgba(47, 157, 109, 0.12);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.product-stepper--slim .product-stepper__step.is-complete .product-stepper__index::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 5px;
    height: 9px;
    border-right: 2px solid #2f9d6d;
    border-bottom: 2px solid #2f9d6d;
    transform: translate(-50%, -58%) rotate(45deg);
}

.product-stepper__label {
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-secondary);
    white-space: nowrap;
    transition: color 180ms ease;
    line-height: 1.1;
    text-align: center;
}

.product-stepper--slim .product-stepper__step.is-active .product-stepper__label {
    color: var(--q-text-primary);
}

.product-stepper--slim .product-stepper__step.is-complete .product-stepper__label {
    color: var(--q-text-primary);
}

.product-step-panel.hidden {
    display: none;
}

.product-base-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.56fr) minmax(320px, 0.94fr);
    gap: 16px;
    align-items: start;
}

.product-base-layout__main,
.product-base-layout__side {
    display: grid;
    gap: 16px;
    align-content: start;
}

.product-modal__footer {
    justify-content: space-between;
    align-items: center;
}

.product-modal__footer-left,
.product-modal__footer-right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.product-compatibility {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 14px 16px;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--q-warning) 24%, transparent);
    background: color-mix(in srgb, var(--q-warning-soft) 72%, #ffffff);
    color: color-mix(in srgb, var(--q-warning) 84%, #4b2e12);
    font-size: var(--q-text-xs);
    line-height: 1.5;
}

.product-compatibility.hidden {
    display: none;
}

.product-variation-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.24fr) minmax(340px, 0.92fr);
    gap: 16px;
    align-items: start;
}

.product-variation-layout__editor,
.product-variation-layout__preview {
    min-width: 0;
}

.product-builder-head,
.product-template-rail,
.product-groups-shell,
.product-preview-shell {
    border: 1px solid rgba(175, 137, 106, 0.14);
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 251, 245, 0.92) 100%);
    box-shadow: var(--q-shadow-xs);
}

.product-builder-head,
.product-template-rail,
.product-groups-shell {
    padding: 18px 20px;
}

.product-variation-layout__editor {
    display: grid;
    gap: 16px;
}

.product-builder-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px 16px;
    align-items: start;
}

.product-builder-head__eyebrow,
.product-template-rail__eyebrow {
    margin: 0 0 4px;
    font-size: var(--q-text-2xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-primary);
}

.product-builder-head__title,
.product-template-rail__title {
    margin: 0;
    font-size: var(--q-text-md);
    font-weight: 700;
    color: var(--q-text-primary);
}

.product-builder-head__copy {
    margin: 0;
    font-size: var(--q-text-xs);
    line-height: 1.5;
    color: var(--q-text-secondary);
    max-width: 58ch;
}

.product-builder-head__meta {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.product-builder-head__meta:empty {
    display: none;
}

.product-template-rail {
    display: grid;
    gap: 14px;
}

.product-template-rail--collapsed {
    padding: 14px 16px;
}

.product-template-stage {
    display: grid;
    gap: 16px;
}

.product-template-stage__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
}

.product-template-stage__copy {
    margin: 8px 0 0;
    font-size: var(--q-text-xs);
    line-height: 1.5;
    color: var(--q-text-secondary);
    max-width: 56ch;
}

.product-template-stage__actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.product-template-stage__toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 260px);
    gap: 12px;
    align-items: center;
}

.product-template-stage__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.product-template-stage__hint {
    margin: 0;
    font-size: var(--q-text-2xs);
    line-height: 1.45;
    color: var(--q-text-secondary);
}

.product-template-active {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
}

.product-template-active__icon {
    width: 54px;
    height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    background: color-mix(in srgb, var(--q-primary) 8%, #ffffff);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
    font-size: 1.5rem;
}

.product-template-active__body {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.product-template-active__eyebrow {
    margin: 0;
    font-size: var(--q-text-2xs);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-primary);
}

.product-template-active__title {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-primary);
}

.product-template-active__copy {
    margin: 0;
    font-size: var(--q-text-xs);
    line-height: 1.45;
    color: var(--q-text-secondary);
}

.product-template-active__actions {
    display: grid;
    justify-items: end;
    gap: 8px;
}

.product-template-rail__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.product-template-search {
    min-width: 220px;
}

.product-template-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.product-template-filter {
    display: inline-flex;
    align-items: center;
    height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(175, 137, 106, 0.16);
    background: #fff;
    color: var(--q-text-secondary);
    font-size: var(--q-text-2xs);
    font-weight: 700;
    cursor: pointer;
    transition: var(--q-duration) var(--q-ease);
}

.product-template-filter:hover,
.product-template-filter.is-active {
    border-color: color-mix(in srgb, var(--q-primary) 28%, rgba(175, 137, 106, 0.18));
    color: var(--q-primary);
    background: color-mix(in srgb, var(--q-primary) 8%, #ffffff);
}

.product-template-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.product-template-card {
    display: grid;
    justify-items: center;
    align-content: start;
    gap: 8px;
    min-height: 126px;
    padding: 14px 12px;
    border-radius: 16px;
    border: 1px solid rgba(175, 137, 106, 0.14);
    background: #fff;
    cursor: pointer;
    transition: var(--q-duration) var(--q-ease);
    text-align: center;
}

.product-template-card:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--q-primary) 30%, rgba(175, 137, 106, 0.14));
    box-shadow: var(--q-shadow-xs);
}

.product-template-card.is-active {
    border-color: color-mix(in srgb, var(--q-primary) 34%, rgba(175, 137, 106, 0.14));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--q-primary) 14%, transparent), var(--q-shadow-xs);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 247, 240, 0.96) 100%);
}

.product-template-card__icon {
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: color-mix(in srgb, var(--q-primary) 8%, #ffffff);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
    font-size: 1.45rem;
}

.product-template-card__title {
    margin: 0;
    font-size: var(--q-text-xs);
    font-weight: 700;
    color: var(--q-text-primary);
}

.product-template-card__meta {
    margin: 0;
    font-size: var(--q-text-2xs);
    line-height: 1.45;
    color: var(--q-text-secondary);
    max-width: 18ch;
}

.product-groups-shell {
    display: grid;
    gap: 14px;
}

.product-groups-shell__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.product-variation-groups {
    display: grid;
    gap: 14px;
}

.variation-group-card {
    border: 1px solid rgba(175, 137, 106, 0.14);
    border-radius: 18px;
    background: #fff;
    padding: 16px;
    display: grid;
    gap: 14px;
}

.variation-group-card__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
}

.variation-group-card__title {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-primary);
}

.variation-group-card__copy {
    margin: 4px 0 0;
    font-size: var(--q-text-2xs);
    line-height: 1.45;
    color: var(--q-text-secondary);
}

.variation-group-card__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

.variation-group-card__actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.variation-group-card__icon-btn {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    border: 1px solid rgba(175, 137, 106, 0.16);
    background: #fff;
    color: var(--q-text-secondary);
    cursor: pointer;
    transition: var(--q-duration) var(--q-ease);
}

.variation-group-card__icon-btn:hover {
    border-color: color-mix(in srgb, var(--q-primary) 24%, rgba(175, 137, 106, 0.16));
    color: var(--q-primary);
}

.variation-group-card__icon-btn.is-danger:hover {
    border-color: color-mix(in srgb, var(--q-danger) 26%, rgba(175, 137, 106, 0.16));
    color: var(--q-danger);
}

.variation-group-card__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.variation-group-card__toggles {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.variation-flag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 14px;
    border: 1px solid rgba(175, 137, 106, 0.12);
    background: color-mix(in srgb, var(--q-bg) 38%, #ffffff);
    font-size: var(--q-text-2xs);
    font-weight: 600;
    color: var(--q-text-secondary);
}

.variation-group-options {
    display: grid;
    gap: 10px;
}

.variation-group-options__legend {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(120px, 0.75fr) auto;
    gap: 10px;
    padding: 0 12px;
    font-size: var(--q-text-2xs);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.variation-option-row {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) auto minmax(120px, 0.75fr) auto;
    gap: 10px;
    align-items: center;
    padding: 12px;
    border-radius: 16px;
    border: 1px solid rgba(175, 137, 106, 0.12);
    background: color-mix(in srgb, var(--q-bg) 32%, #ffffff);
}

.variation-option-row__name {
    min-width: 0;
}

.variation-option-sign {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    height: 36px;
    border-radius: 12px;
    border: 1px solid rgba(175, 137, 106, 0.14);
    background: #fff;
}

.variation-option-sign button {
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 8px;
    background: color-mix(in srgb, var(--q-bg) 40%, #ffffff);
    color: var(--q-text-secondary);
    cursor: pointer;
    transition: var(--q-duration) var(--q-ease);
}

.variation-option-sign button.is-active[data-sign="+"] {
    background: color-mix(in srgb, var(--q-success) 12%, #ffffff);
    color: var(--q-success-dark);
}

.variation-option-sign button.is-active[data-sign="-"] {
    background: color-mix(in srgb, var(--q-danger) 10%, #ffffff);
    color: var(--q-danger);
}

.variation-option-value {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 8px;
    align-items: center;
}

.variation-option-value__currency {
    font-size: var(--q-text-xs);
    font-weight: 700;
    color: var(--q-text-secondary);
}

.variation-option-row__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.product-preview-shell {
    position: sticky;
    top: 0;
    padding: 18px 20px;
    display: grid;
    gap: 14px;
}

.product-preview-shell__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.secondary-button--quiet {
    padding-inline: 12px;
}

.product-variation-preview {
    display: grid;
    gap: 12px;
}

.product-preview-card {
    display: grid;
    gap: 16px;
    padding: 20px;
    border-radius: 20px;
    border: 1px solid rgba(175, 137, 106, 0.14);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 250, 244, 0.92) 100%);
}

.product-preview-card__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.product-preview-card__name {
    margin: 0;
    font-size: var(--q-text-md);
    font-weight: 700;
    color: var(--q-text-primary);
}

.product-preview-card__category,
.product-preview-card__description {
    margin: 4px 0 0;
    font-size: var(--q-text-xs);
    line-height: 1.45;
    color: var(--q-text-secondary);
}

.product-preview-card__price-block {
    display: grid;
    justify-items: end;
    gap: 4px;
}

.product-preview-card__price-label {
    font-size: var(--q-text-2xs);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--q-text-tertiary);
}

.product-preview-card__price {
    font-size: var(--q-text-lg);
    font-weight: 800;
    color: var(--q-primary);
    white-space: nowrap;
}

.product-preview-group {
    display: grid;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px dashed rgba(175, 137, 106, 0.18);
}

.product-preview-group__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.product-preview-group__title {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-primary);
}

.product-preview-group__copy {
    margin: -2px 0 0;
    font-size: var(--q-text-2xs);
    line-height: 1.45;
    color: var(--q-text-secondary);
}

.product-preview-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(175, 137, 106, 0.12);
    background: #fff;
    cursor: pointer;
    transition: var(--q-duration) var(--q-ease);
}

.product-preview-option:hover {
    border-color: color-mix(in srgb, var(--q-primary) 24%, rgba(175, 137, 106, 0.12));
    box-shadow: var(--q-shadow-xs);
}

.product-preview-option.is-selected {
    border-color: color-mix(in srgb, var(--q-primary) 30%, rgba(175, 137, 106, 0.12));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--q-primary) 12%, transparent);
}

.product-preview-option__left {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.product-preview-option__name {
    font-size: var(--q-text-xs);
    font-weight: 600;
    color: var(--q-text-primary);
}

.product-preview-option__price {
    font-size: var(--q-text-xs);
    font-weight: 700;
}

.product-preview-option__price.is-positive {
    color: var(--q-success-dark);
}

.product-preview-option__price.is-negative {
    color: var(--q-danger);
}

.product-preview-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.product-preview-total__label {
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: var(--q-text-primary);
}

.product-preview-total__value {
    font-size: var(--q-text-lg);
    font-weight: 800;
    color: var(--q-success-dark);
}

.product-preview-footer {
    display: grid;
    gap: 12px;
    padding-top: 14px;
    border-top: 1px dashed rgba(175, 137, 106, 0.18);
}

.product-preview-cta {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 46px;
    border: none;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--q-primary) 0%, color-mix(in srgb, var(--q-primary) 60%, #f07a3f) 100%);
    color: #fff;
    font-size: var(--q-text-sm);
    font-weight: 700;
    opacity: 0.92;
}

.product-preview-empty {
    display: grid;
    gap: 8px;
    padding: 18px;
    border-radius: 18px;
    border: 1px dashed rgba(175, 137, 106, 0.24);
    background: color-mix(in srgb, var(--q-bg) 42%, #ffffff);
    font-size: var(--q-text-xs);
    line-height: 1.5;
    color: var(--q-text-secondary);
}

.product-preview-empty strong {
    font-size: var(--q-text-sm);
    color: var(--q-text-primary);
}

.product-preview-empty--soft {
    border-style: solid;
}

.product-form-cluster--media .media-upload__dropzone {
    aspect-ratio: 16 / 9;
    min-height: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.product-form-cluster--status .field-grid {
    min-height: 0;
}

/* ---- Categories surface ---- */
.categories-surface {
    display: grid;
    gap: 0;
}

@media (max-width: 1080px) {
    .products-toolbar {
        flex-wrap: wrap;
    }

    .products-toolbar .search-bar {
        max-width: none;
        flex: 1 1 200px;
    }

    .q-modal {
        padding: 0;
    }

    .q-modal__dialog {
        max-width: 100%;
        max-height: 100dvh;
        height: 100dvh;
        border-radius: 0;
    }

    .menu-mode-strip,
    .editor-layout--menu-ops {
        grid-template-columns: 1fr;
    }

    .menu-week-toolbar__row {
        grid-template-columns: 1fr;
    }

    .menu-week-editor-head {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .menu-week-scope-strip {
        flex-direction: column;
        align-items: stretch;
    }

    .menu-week-scope-strip__actions {
        width: 100%;
        justify-content: stretch;
    }

    .menu-week-scope-strip__actions > * {
        flex: 1;
    }

    .menu-week-scope-strip__cta {
        width: 100%;
        min-width: 0;
    }

    .menu-week-editor-head__actions {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .menu-week-editor-head__actions > * {
        flex: 1;
    }

    .product-base-layout,
    .product-variation-layout {
        grid-template-columns: 1fr;
    }

    .product-preview-shell {
        position: static;
    }

    .product-template-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .product-template-stage__toolbar {
        grid-template-columns: 1fr;
    }

    .product-template-active {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .product-template-active__actions {
        grid-column: 1 / -1;
        justify-items: start;
    }
}

@media (max-width: 640px) {
    .menu-day-card__head {
        align-items: flex-start;
    }

    .menu-day-card__head-actions {
        width: 100%;
        justify-content: space-between;
    }

    .menu-week-layout--mobile-overview .editor-list,
    .menu-week-layout--mobile-overview .editor-panel,
    .menu-week-layout--mobile-detail .editor-list,
    .menu-week-layout--mobile-detail .editor-panel {
        border-radius: 18px;
    }

    .menu-week-editor-head__top {
        align-items: center;
    }

    .menu-week-editor-head__title-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .menu-week-scope-strip__copy {
        align-items: center;
    }

    .product-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .product-card__thumb {
        width: 56px;
        height: 56px;
        border-radius: 10px;
    }

    .product-card__thumb--empty {
        width: 44px;
        height: 44px;
        border-radius: 8px;
    }

    .product-card__main {
        gap: 10px;
        padding: 10px 12px;
    }

    .product-card__name {
        font-size: 0.84rem;
    }

    .product-card__price {
        font-size: 0.8rem;
    }

    .product-card__footer {
        padding: 6px 12px;
    }

    .product-card__status-pill {
        font-size: 0.6rem;
        padding: 2px 8px;
    }

    .products-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .products-toolbar .search-bar {
        height: 44px;
        max-height: 44px;
    }

    .q-modal__body {
        padding: 16px;
    }

    .q-modal__header {
        padding: 16px 16px 0;
    }

    .product-stepper--slim {
        --product-stepper-rail-width: 18px;
        --product-stepper-rail-gap: 4px;
        width: 100%;
    }

    .product-stepper--slim .product-stepper__step {
        flex: 1 1 0;
        min-width: 0;
        min-height: 44px;
        padding: 0 12px;
    }

    .product-stepper--slim .product-stepper__label {
        font-size: var(--q-text-xs);
    }

    .product-template-rail__head,
    .product-builder-head,
    .product-preview-shell__head {
        grid-template-columns: 1fr;
        display: grid;
    }

    .product-modal__footer {
        padding: 12px 16px 16px;
        margin: 0 -16px -16px;
        width: calc(100% + 32px);
    }

    .product-modal__footer-right {
        grid-template-columns: 1fr;
        display: grid;
    }

    .product-template-search {
        min-width: 0;
    }

    .variation-group-card__grid,
    .variation-option-row,
    .product-template-grid {
        grid-template-columns: 1fr;
    }

    .product-template-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .product-template-card {
        min-height: 112px;
        padding: 12px 8px;
    }

    .product-template-card__meta,
    .variation-group-options__legend {
        display: none;
    }

    .product-template-stage__footer,
    .product-preview-footer,
    .product-template-active {
        grid-template-columns: 1fr;
        display: grid;
    }

    .product-template-active__actions {
        justify-items: stretch;
    }

    .variation-option-row__actions {
        justify-content: flex-start;
    }

    .tab-bar {
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        flex-wrap: nowrap;
        width: 100%;
    }

    .tab-bar::-webkit-scrollbar {
        display: none;
    }

    .tab-btn {
        white-space: nowrap;
        flex-shrink: 0;
        font-size: 0.8rem;
        padding: 7px 12px;
    }

    .tab-bar__divider {
        display: none;
    }

    .tab-btn--feature {
        font-size: 0.8rem;
    }

    .tab-btn .lucide {
        width: 14px;
        height: 14px;
    }

    .today-item-row__name {
        font-size: 0.84rem;
    }

    .today-control-header {
        flex-direction: column;
        gap: 10px;
    }

    .today-control-header .primary-button {
        width: 100%;
        justify-content: center;
    }

    .today-list-header .search-bar {
        max-width: none;
    }

    .menu-mode-strip {
        flex-wrap: wrap;
    }
}

/* ============================================================
   CARDAPIO V2 — Foundation Components
   ============================================================ */

/* ---- Q-Toggle (form-compatible switch) ---- */
.q-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    flex-shrink: 0;
}

.q-toggle__input {
    position: absolute;
    width: 44px;
    height: 24px;
    opacity: 0;
    cursor: pointer;
    z-index: 1;
}

.q-toggle__track {
    width: 44px;
    height: 24px;
    border-radius: var(--q-radius-full);
    background: #D1D5DB;
    transition: background var(--q-duration) var(--q-ease);
    position: relative;
}

.q-toggle__thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: var(--q-radius-full);
    background: var(--q-surface);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.14);
    transition: transform var(--q-duration) var(--q-ease);
    pointer-events: none;
}

.q-toggle__input:checked ~ .q-toggle__track {
    background: var(--q-success);
}

.q-toggle__input:checked ~ .q-toggle__thumb {
    transform: translateX(20px);
}

.q-toggle__input:focus-visible ~ .q-toggle__track {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
}

.q-toggle__label {
    font-size: var(--q-text-sm);
    font-weight: 600;
    color: var(--q-text-secondary);
    margin-left: 10px;
    user-select: none;
}

.q-toggle__input:checked ~ .q-toggle__label {
    color: var(--q-success-dark);
}

/* ---- Media Upload (drag-and-drop photo upload) ---- */
.media-upload {
    display: grid;
    gap: 8px;
}

.media-upload__dropzone {
    position: relative;
    aspect-ratio: 4 / 3;
    border: 2px dashed rgba(163, 126, 95, 0.28);
    border-radius: 16px;
    cursor: pointer;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(247, 236, 226, 0.5) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    max-width: 100%;
    box-sizing: border-box;
    transition:
        border-color 200ms cubic-bezier(0.4, 0, 0.2, 1),
        background 200ms cubic-bezier(0.4, 0, 0.2, 1),
        transform 200ms cubic-bezier(0.4, 0, 0.2, 1),
        box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

.media-upload__dropzone:hover {
    border-color: rgba(217, 30, 13, 0.4);
    background: linear-gradient(180deg, rgba(255, 252, 248, 0.85) 0%, rgba(255, 240, 230, 0.7) 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
}

.media-upload__dropzone:focus-within {
    border-color: var(--q-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-primary) 10%, transparent);
    outline: none;
}

.media-upload__dropzone.is-dragover {
    border-color: var(--q-primary);
    border-style: solid;
    transform: scale(1.02);
    box-shadow: 0 8px 24px rgba(217, 30, 13, 0.1);
    background: color-mix(in srgb, var(--q-primary) 4%, rgba(255, 255, 255, 0.9));
}

.media-upload__dropzone img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 14px;
}

.media-upload__hint {
    display: grid;
    gap: 6px;
    justify-items: center;
    text-align: center;
    padding: 16px;
    pointer-events: none;
}

.media-upload__icon {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: color-mix(in srgb, var(--q-primary) 6%, rgba(255, 255, 255, 0.8));
    color: var(--q-primary);
    margin-bottom: 2px;
}

.media-upload__icon .lucide {
    width: 22px;
    height: 22px;
    stroke-width: 1.5;
}

.media-upload__text {
    font-size: var(--q-text-sm);
    font-weight: 650;
    color: var(--q-text-primary);
    line-height: 1.3;
}

.media-upload__formats {
    font-size: var(--q-text-2xs);
    font-weight: 500;
    color: var(--q-text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.media-upload__input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.media-upload__remove {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 30px;
    height: 30px;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.55);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: none;
    z-index: 2;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    transition: background 150ms, transform 150ms;
}

.media-upload__remove:hover {
    background: rgba(220, 38, 38, 0.85);
    transform: scale(1.08);
}

.media-upload__remove:focus-visible {
    outline: 2px solid white;
    outline-offset: 2px;
}

.media-upload__remove .lucide {
    width: 14px;
    height: 14px;
}

/* ---- Item Row Card (compact horizontal product card) ---- */
.item-row-card {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) minmax(112px, auto) auto auto;
    gap: 12px;
    align-items: center;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(175, 137, 106, 0.08);
    transition: background var(--q-duration) var(--q-ease);
}

.item-row-card:last-child {
    border-bottom: none;
}

.item-row-card:hover {
    background: rgba(0, 0, 0, 0.015);
}

.item-row-card--live {
    background: color-mix(in srgb, var(--q-success) 4%, transparent);
}

.item-row-card--live:hover {
    background: color-mix(in srgb, var(--q-success) 7%, transparent);
}

.item-row-card--selected {
    background: color-mix(in srgb, var(--q-primary) 4%, transparent);
}

.item-row-card--selected:hover {
    background: color-mix(in srgb, var(--q-primary) 7%, transparent);
}

.item-row-card--pasted {
    animation: pasted-highlight 2s ease-out;
}

@keyframes pasted-highlight {
    0% { background: color-mix(in srgb, var(--q-success) 16%, transparent); }
    70% { background: color-mix(in srgb, var(--q-success) 8%, transparent); }
    100% { background: color-mix(in srgb, var(--q-primary) 4%, transparent); }
}

.item-row-card__thumb {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    overflow: hidden;
    flex-shrink: 0;
    position: relative;
    background: linear-gradient(180deg, rgba(255, 247, 240, 1) 0%, rgba(245, 233, 219, 0.92) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.item-row-card__thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.item-row-card__placeholder {
    color: rgba(163, 126, 95, 0.25);
    display: inline-flex;
}

.item-row-card__placeholder .lucide {
    width: 20px;
    height: 20px;
    stroke-width: 1.4;
}

.item-row-card__info {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.item-row-card__name {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--q-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-row-card__category {
    font-size: 0.72rem;
    color: var(--q-text-tertiary);
}

.item-row-card__meta {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.item-row-card__status-column {
    display: grid;
    justify-items: end;
    align-content: center;
    gap: 6px;
    min-width: 126px;
}

.item-row-card__availability {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: var(--q-radius-full);
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1.4;
}

.item-row-card__availability .lucide {
    width: 11px;
    height: 11px;
    stroke-width: 2;
    flex-shrink: 0;
}

.item-row-card__availability--warning {
    background: color-mix(in srgb, var(--q-warning-soft) 74%, #ffffff);
    color: #9a5b12;
}

.item-row-card__availability--muted {
    background: rgba(107, 94, 87, 0.08);
    color: var(--q-text-secondary);
}

.item-row-card__availability-action {
    min-height: 30px;
    padding: 0 12px;
    border: 1px solid rgba(107, 94, 87, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    color: var(--q-text-primary);
    font-size: 0.72rem;
    font-weight: 700;
    cursor: pointer;
    transition: border-color var(--q-duration) var(--q-ease), background var(--q-duration) var(--q-ease), color var(--q-duration) var(--q-ease), transform var(--q-duration) var(--q-ease);
}

.item-row-card__availability-action:hover {
    border-color: rgba(107, 94, 87, 0.28);
    background: rgba(252, 247, 241, 0.98);
    transform: translateY(-1px);
}

.item-row-card__availability-action:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-primary) 12%, transparent);
}

.item-row-card--unavailable {
    background: color-mix(in srgb, rgba(107, 94, 87, 0.05) 82%, #ffffff);
}

.item-row-card--unavailable:hover {
    background: color-mix(in srgb, rgba(107, 94, 87, 0.08) 82%, #ffffff);
}

.item-row-card__price {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--q-primary);
    white-space: nowrap;
    justify-self: end;
}

/* ---- Tab Hero (mini-hero for tab panels) ---- */
.tab-hero {
    padding: 22px 24px;
    border-radius: 22px;
    background:
        radial-gradient(circle at top left, rgba(217, 30, 13, 0.06), transparent 28%),
        linear-gradient(180deg, rgba(255, 249, 243, 0.96) 0%, rgba(255, 255, 255, 0.88) 100%);
    border: 1px solid var(--q-border-light);
    box-shadow: var(--q-shadow-soft);
    position: relative;
    overflow: hidden;
}

.tab-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.7) 30%, rgba(255, 255, 255, 0.7) 70%, transparent);
    pointer-events: none;
}

.tab-hero__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px;
}

.tab-hero__text {
    display: grid;
    gap: 4px;
}

.tab-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex-shrink: 0;
}

.tab-hero__actions {
    display: flex;
    gap: 8px;
}

/* ---- Mode Card V2 (icon + title + helper) ---- */
.menu-mode-card--v2 {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 12px;
    align-items: center;
    text-align: left;
    padding: 16px 18px;
    border: 1px solid var(--q-border-light);
    border-radius: 18px;
    background: color-mix(in srgb, var(--q-surface) 92%, var(--q-bg-warm));
    cursor: pointer;
    transition:
        transform var(--q-duration) var(--q-ease),
        border-color var(--q-duration) var(--q-ease),
        box-shadow var(--q-duration) var(--q-ease),
        background var(--q-duration) var(--q-ease);
}

.menu-mode-card--v2:hover {
    transform: translateY(-1px);
    box-shadow: var(--q-shadow-sm);
}

.menu-mode-card--v2.is-active {
    border-color: color-mix(in srgb, var(--q-primary) 38%, var(--q-border));
    box-shadow: var(--q-shadow-primary);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 243, 238, 0.92));
}

.menu-mode-card--v2 .menu-mode-card__icon {
    width: 38px;
    height: 38px;
    border-radius: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(107, 94, 87, 0.08);
    color: var(--q-text-muted);
    transition: background var(--q-duration) var(--q-ease), color var(--q-duration) var(--q-ease);
}

.menu-mode-card--v2 .menu-mode-card__icon .lucide {
    width: 17px;
    height: 17px;
    stroke-width: 1.9;
}

.menu-mode-card--v2.is-active .menu-mode-card__icon {
    background: rgba(217, 30, 13, 0.10);
    color: var(--q-primary);
}

.menu-mode-card--v2 .menu-mode-card__body {
    display: grid;
    gap: 2px;
}

.menu-mode-card--v2 .menu-mode-card__title {
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--q-text-primary);
}

.menu-mode-card--v2 .menu-mode-card__helper {
    font-size: 0.72rem;
    color: var(--q-text-tertiary);
}

/* ---- Live Product Chip (replaces green pills) ---- */
.live-product-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.live-product-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px 8px 8px;
    border-radius: var(--q-radius-full);
    border: 1px solid color-mix(in srgb, var(--q-success) 22%, var(--q-border));
    background: color-mix(in srgb, var(--q-success) 8%, #ffffff);
    transition: transform var(--q-duration) var(--q-ease), box-shadow var(--q-duration) var(--q-ease);
}

.live-product-chip:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.08);
}

.live-product-chip__thumb {
    width: 36px;
    height: 36px;
    border-radius: var(--q-radius-full);
    overflow: hidden;
    flex-shrink: 0;
    position: relative;
    background: linear-gradient(180deg, rgba(255, 247, 240, 1) 0%, rgba(245, 233, 219, 0.92) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.live-product-chip__thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.live-product-chip__placeholder {
    color: rgba(163, 126, 95, 0.25);
    display: inline-flex;
}

.live-product-chip__placeholder .lucide {
    width: 16px;
    height: 16px;
    stroke-width: 1.4;
}

.live-product-chip__info {
    display: grid;
    gap: 1px;
}

.live-product-chip__name {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--q-text-primary);
    line-height: 1.2;
}

.live-product-chip__price {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--q-success-dark);
}

/* ---- Category Card V2 ---- */
.category-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}

.category-card {
    display: grid;
    grid-template-columns: 52px 1fr;
    gap: 14px;
    align-items: start;
    padding: 18px;
    border: 1px solid rgba(163, 126, 95, 0.14);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.88);
    cursor: pointer;
    transition:
        transform 150ms ease,
        box-shadow 150ms ease,
        border-color 150ms ease;
}

.category-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 32px rgba(103, 68, 43, 0.08);
    border-color: rgba(163, 126, 95, 0.24);
}

.category-card:focus-visible {
    outline: 2px solid var(--q-primary);
    outline-offset: 2px;
}

.category-card__icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255, 247, 240, 1) 0%, rgba(245, 233, 219, 0.92) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.category-card__icon .lucide {
    width: 22px;
    height: 22px;
    stroke-width: 1.4;
    color: rgba(163, 126, 95, 0.4);
}

.category-card__body {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.category-card__title {
    margin: 0;
    font-size: 0.96rem;
    font-weight: 700;
    color: var(--q-text-primary);
}

.category-card__desc {
    margin: 0;
    font-size: 0.82rem;
    color: var(--q-text-secondary);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.category-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 2px;
}

.category-card__previews {
    display: flex;
    gap: 4px;
    margin-top: 4px;
}

.category-card__preview-thumb {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    flex-shrink: 0;
    background: linear-gradient(180deg, rgba(255, 247, 240, 1) 0%, rgba(245, 233, 219, 0.92) 100%);
}

.category-card__preview-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.category-card__actions {
    display: flex;
    gap: 6px;
    grid-column: 1 / -1;
    opacity: 0;
    transition: opacity 150ms ease;
}

.category-card:hover .category-card__actions,
.category-card:focus-within .category-card__actions {
    opacity: 1;
}

/* ---- Tab Count Badge ---- */
.tab-btn__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: var(--q-radius-full);
    font-size: 0.66rem;
    font-weight: 800;
    background: rgba(107, 94, 87, 0.08);
    color: var(--q-text-muted);
    margin-left: 4px;
    line-height: 1;
}

.tab-btn.is-active .tab-btn__count {
    background: color-mix(in srgb, var(--q-primary) 12%, #ffffff);
    color: var(--q-primary);
}

.tab-btn__count--live {
    background: color-mix(in srgb, var(--q-success) 12%, #ffffff);
    color: var(--q-success-dark);
}

.tab-btn__count:empty {
    display: none;
}

/* ---- Product Group (category grouping in grid) ---- */
.product-group {
    display: grid;
    gap: 14px;
    margin-bottom: 28px;
}

.product-group:last-child {
    margin-bottom: 0;
}

.product-group__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 4px;
}

.product-group__title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--q-text-primary);
}

/* ---- Product Card Status Dot ---- */
/* status dot removed — replaced by status pill in card body */

/* ---- Empty State Hero ---- */
.empty-state--hero {
    padding: 48px 24px;
    text-align: center;
    display: grid;
    gap: 8px;
    justify-items: center;
}

.empty-state--hero .lucide {
    width: 40px;
    height: 40px;
    color: rgba(163, 126, 95, 0.25);
    stroke-width: 1.2;
    margin-bottom: 4px;
}

.empty-state__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--q-text-primary);
}

.empty-state__copy {
    margin: 0;
    font-size: 0.86rem;
    color: var(--q-text-secondary);
    max-width: 380px;
    line-height: 1.45;
}

/* ---- Day Card Thumbnails ---- */
.menu-day-card__thumbs {
    display: flex;
    gap: 4px;
    align-items: center;
}

.menu-day-card__thumb {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    flex-shrink: 0;
    background: linear-gradient(180deg, rgba(255, 247, 240, 1) 0%, rgba(245, 233, 219, 0.92) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.menu-day-card__thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.menu-day-card__thumb-placeholder {
    color: rgba(163, 126, 95, 0.25);
    display: inline-flex;
}

.menu-day-card__thumb-placeholder .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.4;
}

.menu-day-card__thumb-more {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.68rem;
    font-weight: 800;
    background: rgba(107, 94, 87, 0.08);
    color: var(--q-text-muted);
}

/* ---- List Card Preview Thumbs ---- */
.list-card__preview {
    display: flex;
    gap: 4px;
    margin-top: 4px;
}

.list-card__preview-thumb {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    flex-shrink: 0;
    background: linear-gradient(180deg, rgba(255, 247, 240, 1) 0%, rgba(245, 233, 219, 0.92) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.list-card__preview-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.list-card__preview-placeholder {
    color: rgba(163, 126, 95, 0.25);
    display: inline-flex;
}

.list-card__preview-placeholder .lucide {
    width: 16px;
    height: 16px;
    stroke-width: 1.4;
}

.list-card__preview-more {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.68rem;
    font-weight: 800;
    background: rgba(107, 94, 87, 0.08);
    color: var(--q-text-muted);
}

/* ---- Cardapio V2 Responsive ---- */
@media (max-width: 1080px) {
    .category-grid {
        grid-template-columns: 1fr;
    }

    .live-product-strip {
        gap: 8px;
    }

    .tab-hero__head {
        flex-direction: column;
    }
}

@media (max-width: 640px) {
    .tab-btn__count {
        font-size: 0.6rem;
        min-width: 18px;
        height: 18px;
        padding: 0 5px;
    }

    .menu-mode-card--v2 {
        grid-template-columns: 1fr;
    }

    .menu-mode-card--v2 .menu-mode-card__icon {
        display: none;
    }

    .category-grid {
        grid-template-columns: 1fr;
    }

    .category-card__actions {
        opacity: 1;
    }

    .item-row-card {
        grid-template-columns: 40px minmax(0, 1fr) auto auto auto;
        gap: 8px;
        padding: 8px 10px;
    }

    .item-row-card__thumb {
        width: 40px;
        height: 40px;
        border-radius: 10px;
    }

    .item-row-card__name {
        font-size: 0.82rem;
    }

    .item-row-card__price {
        font-size: 0.76rem;
    }

    .item-row-card__availability-action {
        min-height: 28px;
        padding: 0 8px;
        font-size: 0.68rem;
    }

    .item-row-card__status-column {
        min-width: 0;
        justify-items: start;
    }

    .live-product-chip__thumb {
        width: 30px;
        height: 30px;
    }

    .live-product-chip {
        padding: 6px 10px 6px 6px;
        gap: 8px;
    }

    .tab-hero {
        padding: 16px 18px;
        border-radius: 18px;
    }

    .media-upload__dropzone {
        aspect-ratio: 4 / 3;
    }
}

/* ============================================================
   CARDAPIO V2 — Refinement Pass
   ============================================================ */

/* ---- Confirm Modal (premium delete confirmation) ---- */
.confirm-modal {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.confirm-modal.hidden { display: none; }

.confirm-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(6, 14, 31, 0.48);
    backdrop-filter: blur(6px);
}

.confirm-modal__dialog {
    position: relative;
    width: 100%;
    max-width: var(--q-modal-width-compact);
    padding: 32px;
    border-radius: var(--q-radius-xl);
    border: none;
    background: var(--q-text-primary);
    color: #FFFFFF;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.3);
    display: grid;
    gap: 16px;
    text-align: center;
    animation: confirm-appear 200ms var(--q-ease);
}

/* Red accent line */
.confirm-modal__dialog::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--q-primary);
    border-radius: var(--q-radius-xl) var(--q-radius-xl) 0 0;
}

@keyframes confirm-appear {
    from { opacity: 0; transform: scale(0.96) translateY(6px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

.confirm-modal__icon {
    width: 48px;
    height: 48px;
    border-radius: var(--q-radius-md);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    background: rgba(217, 30, 13, 0.2);
    color: var(--q-primary);
}

.confirm-modal__icon .lucide {
    width: 22px;
    height: 22px;
    stroke-width: 1.8;
}

.confirm-modal__title {
    margin: 0;
    font-size: var(--q-text-lg);
    font-weight: 800;
    color: #FFFFFF;
    letter-spacing: -0.01em;
}

.confirm-modal__copy {
    margin: 0;
    font-size: var(--q-text-sm);
    color: rgba(255, 255, 255, 0.55);
    line-height: 1.5;
}

.confirm-modal__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    padding-top: 4px;
}

.confirm-modal__actions .danger-button {
    min-width: 120px;
    min-block-size: 42px;
    background: var(--q-primary);
    border-color: transparent;
    color: #FFFFFF;
}

.confirm-modal__actions .danger-button:hover {
    background: var(--q-primary-dark);
}

.confirm-modal__actions .secondary-button {
    min-width: 100px;
    min-block-size: 42px;
    background: transparent;
    border-color: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.7);
}

.confirm-modal__actions .secondary-button:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #FFFFFF;
    border-color: rgba(255, 255, 255, 0.25);
}

/* ---- Toggle Label (inline Ativo/Pausado text) ---- */
.q-toggle__label-inline {
    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-left: 10px;
    user-select: none;
    transition: color var(--q-duration) var(--q-ease);
    color: var(--q-text-muted);
}

.q-toggle__input:checked ~ .q-toggle__label-inline {
    color: var(--q-success-dark);
}

/* ---- Button Loading State ---- */
.btn-loading {
    position: relative;
    pointer-events: none;
    opacity: 0.7;
}

.btn-loading::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: currentColor;
    border-radius: 50%;
    animation: btn-spin 600ms linear infinite;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
}

.secondary-button.btn-loading::after,
.ghost-button.btn-loading::after {
    border-color: rgba(0, 0, 0, 0.1);
    border-top-color: currentColor;
}

@keyframes btn-spin {
    to { transform: translateY(-50%) rotate(360deg); }
}

/* product card actions are always visible now (icon buttons) */

/* ---- Unify border-radius to 20px ---- */
.category-card { border-radius: 20px; }
.menu-mode-card--v2 { border-radius: 20px; }
.menu-day-card { border-radius: 20px; }
.list-card--menu-item,
.list-card--menu-toggle,
.scope-choice { border-radius: 20px; }
.tab-hero { border-radius: 20px; }

/* Tab bar: no fade needed — tabs use grid layout on mobile */

/* ---- Checklist Scroll Indicator ---- */
.menu-checklist-compact {
    position: relative;
}

.menu-checklist-compact::after {
    content: '';
    position: sticky;
    bottom: 0;
    left: 0;
    right: 0;
    height: 32px;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.9));
    pointer-events: none;
    display: block;
    margin-top: -32px;
}

/* ---- Select All Bar ---- */
.select-all-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    background: rgba(107, 94, 87, 0.04);
    border-radius: 12px;
    margin-bottom: 8px;
}

.select-all-bar__label {
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--q-text-secondary);
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
}

.select-all-bar__selected {
    color: var(--q-success-dark);
    font-weight: 800;
}

.select-all-bar__separator,
.select-all-bar__copy {
    color: var(--q-text-secondary);
}

.select-all-bar__total {
    font-weight: 700;
    color: var(--q-text-primary);
}

.select-all-bar__actions {
    display: flex;
    gap: 8px;
}

.select-all-bar__btn {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--q-primary);
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 6px;
    transition: background var(--q-duration) var(--q-ease);
}

.select-all-bar__btn:hover {
    background: rgba(217, 30, 13, 0.06);
}

.today-control-summary {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}

/* ---- Skeleton Loader ---- */
.skeleton-card {
    border-radius: 20px;
    background: linear-gradient(90deg, rgba(245, 239, 231, 0.6) 25%, rgba(255, 252, 248, 0.8) 50%, rgba(245, 239, 231, 0.6) 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s ease infinite;
    border: 1px solid rgba(163, 126, 95, 0.08);
}

.skeleton-card--product {
    aspect-ratio: 3 / 4;
}

.skeleton-card--row {
    height: 68px;
    border-radius: 0;
    border-bottom: 1px solid rgba(175, 137, 106, 0.06);
}

@keyframes skeleton-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* no-photo badge removed — placeholder icon is enough */

/* ============================================================
   TODAY TAB — Product Grid (replaces list + green pills)
   ============================================================ */

.today-control-header__actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* ---- Tab Bar Row (tabs + filters) ---- */
.tab-bar-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: var(--q-space-4);
}

.tab-bar-row .tab-bar {
    margin-bottom: 0;
}

/* ---- Product Filter Bar ---- */
.tab-bar-health {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.product-filter-shell {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
    width: 100%;
}

.tab-bar-health .crud-status-filter {
    flex: 0 1 auto;
}

.tab-bar-health .crud-status-filter__menu {
    min-width: 300px;
}

.tab-bar-health .crud-select-menu__trigger {
    min-width: 214px;
}

.tab-bar-health .crud-select-menu__menu {
    min-width: 300px;
}

.product-filter-chip--clear-inline {
    min-height: 40px;
    padding-inline: 12px;
    border-radius: 16px;
}

.product-filter-shell {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
    width: 100%;
}

.tab-bar-health .crud-status-filter {
    flex: 0 1 auto;
}

.tab-bar-health .crud-status-filter__menu {
    min-width: 300px;
}

.product-filter-chip--clear-inline {
    min-height: 40px;
    padding-inline: 12px;
    border-radius: 16px;
}

.product-filter-label {
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--q-text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.product-filter-group {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
    background: rgba(107, 94, 87, 0.04);
    border-radius: var(--q-radius-full);
    padding: 3px;
}

.product-filter {
    display: inline-flex;
    align-items: center;
    padding: 5px 14px;
    border-radius: var(--q-radius-full);
    border: none;
    background: transparent;
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--q-text-tertiary);
    cursor: pointer;
    white-space: nowrap;
    transition: background 150ms var(--q-ease), color 150ms var(--q-ease);
}

.product-filter:hover {
    color: var(--q-text-primary);
    background: rgba(255, 255, 255, 0.6);
}

.product-filter--active {
    background: rgba(255, 255, 255, 0.95);
    color: var(--q-text-primary);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

/* Semantic colors for specific filters */
.product-filter--danger.product-filter--active {
    color: var(--q-primary);
}

.product-filter--success.product-filter--active {
    color: var(--q-success-dark);
}

.product-filter--accent.product-filter--active {
    color: var(--q-primary);
}

/* ---- Product Filter Strip ---- */
.product-filter-strip {
    display: flex;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 0;
    max-width: 100%;
}

.product-filter-strip::-webkit-scrollbar {
    display: none;
}

.product-filter-strip__label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.74rem;
    font-weight: 700;
    color: color-mix(in srgb, var(--q-border) 40%, var(--q-text-secondary));
    flex-shrink: 0;
    padding-right: 2px;
    white-space: nowrap;
}

.product-filter-strip__label .lucide {
    width: 13px;
    height: 13px;
    stroke-width: 2.2;
}

.product-filter-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 16px;
    border: 1px solid var(--q-border-light);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.6);
    color: var(--q-text-secondary);
    font-size: 0.78rem;
    font-weight: 650;
    font-family: var(--q-font-primary);
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: color 160ms var(--q-ease), background 160ms var(--q-ease), border-color 160ms var(--q-ease), box-shadow 160ms var(--q-ease);
}

.product-filter-chip:hover {
    color: var(--q-text-primary);
    background: rgba(255, 255, 255, 0.9);
    border-color: var(--q-border);
}

.product-filter-chip.is-active {
    color: var(--q-primary);
    background: var(--q-primary-soft);
    border-color: color-mix(in srgb, var(--q-primary) 20%, transparent);
    font-weight: 700;
}

.product-filter-chip.product-filter--alert {
    color: var(--q-text-secondary);
}

.product-filter-chip.product-filter--alert.is-active {
    color: #92400E;
    background: color-mix(in srgb, #D97706 10%, #ffffff);
    border-color: color-mix(in srgb, #D97706 20%, transparent);
}

.product-filter-chip--clear {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: transparent;
    border-color: transparent;
    color: var(--q-text-muted);
    font-weight: 600;
    padding: 0 10px;
}

.product-filter-chip--clear .lucide {
    width: 12px;
    height: 12px;
    stroke-width: 2.4;
}

.product-filter-chip--clear:hover {
    color: var(--q-primary);
    background: transparent;
    border-color: transparent;
}

.product-filter-sheet {
    display: none !important;
}

@media (max-width: 768px) {
    .queru-main,
    .panel-section,
    .tab-panel,
    .products-surface,
    .products-toolbar,
    .tab-bar-row,
    .tab-bar-row .tab-bar,
    .tab-bar-health,
    .product-filter-strip,
    #items-table,
    .product-group,
    .product-grid {
        min-width: 0;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .tab-bar-row {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .tab-bar-row .tab-bar {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 4px;
        width: 100%;
        padding: 4px;
        overflow: hidden;
        border-radius: 18px;
    }

    .tab-bar-health {
        position: relative;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
        justify-content: flex-start;
    }

    .tab-bar-health::before,
    .tab-bar-health::after {
        display: none;
    }

    .product-filter-label {
        display: none;
    }

    .tab-bar-row .tab-btn {
        min-width: 0;
        min-height: 84px;
        padding: 10px 8px;
        justify-content: center;
        text-align: center;
        white-space: normal;
        line-height: 1.14;
        flex-direction: column;
        gap: 8px;
        border-radius: 14px;
        background: rgba(255, 255, 255, 0.54);
        box-shadow: inset 0 0 0 1px rgba(175, 137, 106, 0.1);
        color: var(--q-text-secondary);
        font-size: 0.76rem;
        font-weight: 700;
    }

    .tab-bar-row .tab-btn .lucide {
        display: block;
        width: 16px;
        height: 16px;
        stroke-width: 2;
        color: currentColor;
    }

    .tab-bar-row .tab-btn--feature {
        font-size: 0.71rem;
        letter-spacing: -0.01em;
    }

    .tab-bar-row .tab-btn.is-active {
        background: rgba(255, 255, 255, 0.96);
        color: var(--q-text-primary);
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.07);
    }

    .tab-bar-row .tab-btn__count {
        margin-left: 0;
        order: 2;
    }

    .product-filter-shell {
        width: 100%;
        align-items: stretch;
        justify-content: stretch;
    }

    .tab-bar-health .crud-status-filter {
        width: 100%;
    }

    .tab-bar-health .crud-status-filter__trigger {
        width: 100%;
        min-width: 0;
    }

    .tab-bar-health .crud-status-filter__menu {
        left: 0;
        right: 0;
        min-width: 0;
        max-width: none;
        width: auto;
    }

    .crud-select-menu {
        width: 100%;
    }

    .crud-select-menu__trigger {
        width: 100%;
        min-width: 0;
    }

    .crud-select-menu__menu {
        left: 0;
        right: 0;
        min-width: 0;
        max-width: none;
        width: auto;
    }

    .tab-bar-health .crud-select-menu__trigger {
        min-width: 0;
    }

    .product-filter-chip--clear-inline {
        width: 100%;
        justify-content: center;
    }
}

/* ---- Filter Bar (active filter indicator) ---- */
.filter-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    border-radius: 12px;
    background: color-mix(in srgb, #D97706 6%, rgba(255, 255, 255, 0.9));
    border: 1px solid color-mix(in srgb, #D97706 15%, transparent);
    margin-bottom: 16px;
}

.filter-bar__label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.84rem;
    font-weight: 650;
    color: #92400E;
}

.filter-bar__label .lucide {
    width: 15px;
    height: 15px;
    stroke-width: 1.8;
}

.filter-bar__count {
    font-size: 0.76rem;
    color: var(--q-text-tertiary);
    font-weight: 500;
}

.filter-bar__clear {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
    padding: 4px 12px;
    border-radius: var(--q-radius-full);
    border: 1px solid var(--q-border-light);
    background: rgba(255, 255, 255, 0.9);
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--q-text-secondary);
    cursor: pointer;
    transition: background 150ms var(--q-ease), color 150ms var(--q-ease);
}

.filter-bar__clear .lucide {
    width: 12px;
    height: 12px;
    stroke-width: 2;
}

.filter-bar__clear:hover {
    background: rgba(255, 255, 255, 1);
}

@media (max-width: 640px) {
    .filter-bar {
        flex-wrap: wrap;
        gap: 8px;
        padding: 10px 12px;
    }

    .filter-bar__clear {
        min-height: 36px;
        padding: 6px 14px;
    }
}

/* ---- Tab Bar Divider ---- */

.tab-bar__divider {
    width: 1px;
    height: 22px;
    background: var(--q-border);
    align-self: center;
    margin: 0 4px;
    opacity: 0.5;
    flex-shrink: 0;
}

/* ---- Tab Feature (branded tab) ---- */
.tab-btn--feature {
    letter-spacing: -0.01em;
}

/* ---- Smart Mode Panel ---- */
.smart-mode-panel {
    display: grid;
    gap: 20px;
    margin-bottom: 8px;
}

.smart-mode-panel__header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
}

/* ---- Smart Sub-Nav (Hoje / Agenda / Modelos) ---- */
.smart-sub-nav {
    display: flex;
    gap: 2px;
    padding: 3px;
    border-radius: 12px;
    background: rgba(107, 94, 87, 0.04);
    width: fit-content;
    margin-bottom: 20px;
}

.smart-sub-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 18px;
    border: none;
    border-radius: 10px;
    background: transparent;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--q-text-tertiary);
    cursor: pointer;
    transition: background 150ms var(--q-ease), color 150ms var(--q-ease), box-shadow 150ms var(--q-ease);
}

.smart-sub-btn .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.8;
    flex-shrink: 0;
}

.smart-sub-btn.is-active {
    background: rgba(255, 255, 255, 0.92);
    color: var(--q-text-primary);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.smart-sub-btn:hover:not(.is-active) {
    color: var(--q-text-primary);
    background: rgba(255, 255, 255, 0.4);
}

@media (max-width: 640px) {
    .smart-sub-nav {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .smart-sub-btn {
        width: 100%;
        justify-content: center;
        text-align: center;
        padding: 8px 12px;
        font-size: 0.78rem;
    }
}

.smart-mode-panel__meta {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.smart-mode-panel__notice {
    display: inline-flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 16px;
    border: 1px solid color-mix(in srgb, var(--q-warning) 18%, transparent);
    background: color-mix(in srgb, var(--q-warning-soft) 56%, #ffffff);
    color: #9a5b12;
    font-size: 0.82rem;
    line-height: 1.5;
}

.smart-mode-panel__notice .lucide {
    width: 16px;
    height: 16px;
    stroke-width: 1.9;
    flex-shrink: 0;
    margin-top: 1px;
}

.smart-mode-panel__notice strong {
    color: var(--q-text-primary);
}

.smart-mode-panel__notice--inline {
    margin-bottom: 16px;
}

/* ---- Smart Mode Grid (2 cards: Fixo + Semanal) ---- */
.smart-mode-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}

/* ---- Smart Mode Card (row layout: icon left, content right) ---- */
.smart-mode-card {
    display: flex;
    align-items: stretch;
    gap: 0;
    padding: 0;
    border: 1px solid var(--q-border-light);
    border-radius: 20px;
    background: color-mix(in srgb, var(--q-surface) 92%, var(--q-bg-warm));
    text-align: left;
    cursor: pointer;
    overflow: hidden;
    transition:
        transform var(--q-duration) var(--q-ease),
        border-color var(--q-duration) var(--q-ease),
        box-shadow var(--q-duration) var(--q-ease),
        background var(--q-duration) var(--q-ease);
}

.smart-mode-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--q-shadow-sm);
    border-color: rgba(163, 126, 95, 0.22);
}

.smart-mode-card.is-active {
    border-color: color-mix(in srgb, var(--q-success) 30%, var(--q-border));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--q-success) 10%, transparent), 0 4px 16px rgba(5, 150, 105, 0.06);
    background: linear-gradient(135deg, rgba(240, 253, 244, 0.95), rgba(255, 255, 255, 0.98));
}

.smart-mode-card__icon {
    width: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(107, 94, 87, 0.04);
    color: var(--q-text-muted);
    flex-shrink: 0;
    align-self: stretch;
    transition: background var(--q-duration) var(--q-ease), color var(--q-duration) var(--q-ease);
}

.smart-mode-card__icon .lucide {
    width: 26px;
    height: 26px;
    stroke-width: 1.6;
}

.smart-mode-card.is-active .smart-mode-card__icon {
    background: color-mix(in srgb, var(--q-success) 12%, #ffffff);
    color: var(--q-success-dark);
}

.smart-mode-card__body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    min-width: 0;
    padding: 18px 20px;
}

.smart-mode-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.smart-mode-card__title {
    font-size: 0.94rem;
    font-weight: 700;
    color: var(--q-text-primary);
    line-height: 1.2;
}

.smart-mode-card__copy {
    font-size: 0.84rem;
    color: var(--q-text-secondary);
    line-height: 1.5;
}

.smart-mode-card__example {
    font-size: 0.76rem;
    color: var(--q-text-tertiary);
    line-height: 1.5;
    padding-top: 6px;
    border-top: 1px dashed var(--q-border-light);
    font-style: italic;
}

/* Badge: green pill, active state */
.smart-mode-card__badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: var(--q-radius-full);
    background: color-mix(in srgb, var(--q-success) 10%, #ffffff);
    color: var(--q-success-dark);
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    flex-shrink: 0;
    white-space: nowrap;
}

.smart-mode-card__badge .lucide {
    width: 12px;
    height: 12px;
    stroke-width: 2.2;
}

/* CTA: subtle hint for inactive card */
.smart-mode-card__cta {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--q-text-tertiary);
    opacity: 0;
    transition: opacity var(--q-duration) var(--q-ease);
    flex-shrink: 0;
    white-space: nowrap;
}

.smart-mode-card:hover .smart-mode-card__cta {
    opacity: 1;
}

@media (max-width: 1080px) {
    .smart-mode-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .smart-mode-panel__header {
        flex-direction: column;
    }
}

@media (max-width: 640px) {
    .tab-bar__divider {
        height: 18px;
        margin: 0 2px;
    }

    .tab-btn--feature {
        font-size: 0.78rem;
    }

    .smart-mode-card__icon {
        width: 56px;
    }

    .smart-mode-card__icon .lucide {
        width: 20px;
        height: 20px;
    }

    .smart-mode-card__body {
        padding: 14px 16px;
    }

    .smart-mode-card__copy {
        font-size: 0.76rem;
    }

    .smart-mode-card__example {
        font-size: 0.72rem;
    }

    .smart-mode-card__cta {
        opacity: 1;
    }
}

.today-category-group {
    margin-bottom: 24px;
}

.today-category-group:last-child {
    margin-bottom: 0;
}

.today-category-group__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 4px;
    margin-bottom: 12px;
}

.today-category-group__title {
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--q-text-primary);
}

/* ---- Today Product Grid (3 per row) ---- */
.today-product-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

/* ---- Today Product Card — ROW layout (image left) ---- */
.today-product-card {
    display: grid;
    grid-template-columns: 64px 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 16px;
    border: 1px solid rgba(163, 126, 95, 0.12);
    background: rgba(255, 255, 255, 0.88);
    transition:
        transform 150ms ease,
        box-shadow 150ms ease,
        border-color 150ms ease,
        opacity 150ms ease;
}

.today-product-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(103, 68, 43, 0.06);
    border-color: rgba(163, 126, 95, 0.22);
}

/* Active card — green left accent */
.today-product-card--live {
    border-color: color-mix(in srgb, var(--q-success) 28%, rgba(163, 126, 95, 0.12));
    background: color-mix(in srgb, var(--q-success) 3%, rgba(255, 255, 255, 0.88));
}

.today-product-card--live:hover {
    border-color: color-mix(in srgb, var(--q-success) 40%, rgba(163, 126, 95, 0.12));
    box-shadow: 0 8px 20px rgba(5, 150, 105, 0.06);
}

/* Off card — dimmed */
.today-product-card--off {
    opacity: 0.5;
}

.today-product-card--off:hover {
    opacity: 0.8;
}

.today-product-card--summary {
    cursor: default;
}

.today-product-card--summary:hover {
    transform: none;
    box-shadow: none;
}

/* Thumb (left) */
.today-product-card__thumb {
    width: 64px;
    height: 64px;
    border-radius: 14px;
    overflow: hidden;
    flex-shrink: 0;
    position: relative;
    background: linear-gradient(180deg, rgba(255, 247, 240, 1) 0%, rgba(245, 233, 219, 0.92) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.today-product-card__thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.today-product-card__thumb-placeholder {
    color: rgba(163, 126, 95, 0.25);
    display: inline-flex;
}

.today-product-card__thumb-placeholder .lucide {
    width: 22px;
    height: 22px;
    stroke-width: 1.3;
}

/* Body (middle) */
.today-product-card__body {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.today-product-card__name {
    margin: 0;
    font-size: 0.86rem;
    font-weight: 600;
    line-height: 1.25;
    color: var(--q-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.today-product-card__price {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--q-success-dark);
}

.today-product-card__warning {
    display: inline-flex;
    align-items: flex-start;
    gap: 6px;
    margin: 1px 0 0;
    font-size: 0.72rem;
    line-height: 1.4;
    color: #9a5b12;
}

.today-product-card__warning .lucide {
    width: 13px;
    height: 13px;
    stroke-width: 1.9;
    flex-shrink: 0;
    margin-top: 1px;
}

/* Toggle switch (right) — reuses today-item-row__toggle system */
.today-product-card .today-item-row__toggle {
    flex-shrink: 0;
}

/* ---- Today Grid Responsive ---- */
@media (max-width: 1080px) {
    .today-product-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    .today-control-header {
        flex-direction: column;
        gap: 12px;
    }

    .today-control-header__actions {
        width: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 640px) {
    .today-product-grid {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .today-product-card {
        grid-template-columns: 52px 1fr auto;
        gap: 10px;
        padding: 8px 12px;
    }

    .today-product-card__thumb {
        width: 52px;
        height: 52px;
        border-radius: 12px;
    }

    .today-product-card__name {
        font-size: 0.82rem;
    }

    .today-product-card__price {
        font-size: 0.74rem;
    }

    .today-control-header__actions .primary-button {
        width: 100%;
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .config-hero, .config-nav-rail__link, .config-section-card,
    .checkout-block, .social-link-field, .pix-key-field__card,
    .info-channel, .info-channel__btn, .primary-button,
    .secondary-button, .color-inline-picker__swatch,
    .config-media-upload__dropzone, .config-hero__preview-link {
        transition: none !important;
    }
}
/* ============================================================
   ADMINISTRAÇÃO — Mesa limpa da Queru
   Light-only, editorial, sem legado visual
   ============================================================ */
.admin-command-surface {
    --admin-rail-width: clamp(410px, 34vw, 470px);
    --admin-panel-surface:
        linear-gradient(180deg, rgba(255, 252, 248, 0.98) 0%, rgba(255, 255, 255, 1) 100%);
    --admin-panel-shadow:
        0 1px 0 rgba(255, 255, 255, 0.84) inset,
        0 18px 40px rgba(73, 47, 30, 0.06);
    display: grid;
    gap: 18px;
    padding: 0;
    background: transparent;
    border: none;
    box-shadow: none;
}

.admin-mode-switch-shell {
    display: flex;
    justify-content: center;
    padding-inline: 8px;
}

.admin-mode-switch {
    inline-size: min(100%, 720px);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: 6px;
    padding: 7px;
    border-radius: 24px;
    border: none;
    background: var(--q-text-primary);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.14);
}

.admin-mode-switch__btn {
    min-block-size: 52px;
    padding-block: 12px;
    padding-inline: 18px;
    border: none;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.05);
    color: rgba(255, 255, 255, 0.45);
    font-size: 0.875rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-align: start;
    cursor: pointer;
    user-select: none;
    transition: all 200ms var(--q-ease);
}

.admin-mode-switch__btn:hover {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.85);
}

.admin-mode-switch__btn:active {
    transform: scale(0.97);
}

.admin-mode-switch__btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px var(--q-primary), 0 0 0 4px rgba(217, 30, 13, 0.2);
}

.admin-mode-switch__btn.is-active {
    background: rgba(255, 255, 255, 0.1);
    color: #FFFFFF;
    font-weight: 800;
    box-shadow: 0 4px 16px rgba(217, 30, 13, 0.25);
}

.admin-mode-switch__icon {
    inline-size: 18px;
    block-size: 18px;
    display: inline-grid;
    place-items: center;
    flex-shrink: 0;
    color: rgba(255, 255, 255, 0.35);
    transition: color 200ms var(--q-ease);
}

.admin-mode-switch__btn:hover .admin-mode-switch__icon {
    color: rgba(255, 255, 255, 0.7);
}

.admin-mode-switch__btn.is-active .admin-mode-switch__icon {
    color: var(--q-primary);
}

.admin-mode-switch__icon .lucide {
    inline-size: 18px;
    block-size: 18px;
}

.admin-mode-switch__label {
    min-inline-size: 0;
    flex: 1;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
}

.admin-mode-switch__count {
    min-inline-size: 22px;
    min-block-size: 22px;
    padding-inline: 6px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.2);
    color: #FFFFFF;
    display: inline-grid;
    place-items: center;
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.admin-mode-switch__btn.is-active .admin-mode-switch__count {
    background: var(--q-primary);
    color: #FFFFFF;
}

.admin-summary-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.admin-summary-strip[data-mode="owner"][data-count="3"] {
    inline-size: min(100%, 980px);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    justify-content: center;
    margin-inline: auto;
}

.admin-summary-pill {
    --admin-pill-accent: var(--q-primary);
    --admin-pill-soft: rgba(217, 30, 13, 0.08);
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding-block: 15px;
    padding-inline: 16px;
    border-radius: 20px;
    border: 1px solid color-mix(in srgb, var(--q-border) 82%, #FFFFFF);
    background: var(--admin-panel-surface);
    box-shadow: 0 10px 24px rgba(73, 47, 30, 0.05);
    position: relative;
    overflow: hidden;
}

.admin-summary-pill::before {
    display: none;
}

.admin-summary-pill--accent {
    --admin-pill-accent: var(--q-primary);
    --admin-pill-soft: rgba(217, 30, 13, 0.08);
}

.admin-summary-pill--success {
    --admin-pill-accent: var(--q-success-dark);
    --admin-pill-soft: rgba(0, 153, 110, 0.08);
}

.admin-summary-pill--warning {
    --admin-pill-accent: var(--q-warning);
    --admin-pill-soft: rgba(245, 158, 11, 0.12);
}

.admin-summary-pill--muted {
    --admin-pill-accent: color-mix(in srgb, var(--q-text-tertiary) 84%, #7f6654);
    --admin-pill-soft: rgba(121, 91, 66, 0.08);
}

.admin-summary-pill__label {
    margin: 0;
    color: var(--q-text-tertiary);
    font-size: var(--q-text-2xs);
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.admin-summary-pill__icon {
    inline-size: 38px;
    block-size: 38px;
    display: inline-grid;
    place-items: center;
    border-radius: 14px;
    background: var(--admin-pill-soft);
    color: var(--admin-pill-accent);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.admin-summary-pill__icon .lucide {
    inline-size: 18px;
    block-size: 18px;
}

.admin-summary-pill__copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.admin-summary-pill__value {
    margin: 0;
    color: var(--admin-pill-accent);
    font-size: clamp(1.1rem, 1.65vw, 1.42rem);
    line-height: 1;
    font-weight: 800;
    letter-spacing: -0.04em;
}

.admin-summary-pill__hint {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.38;
}

.admin-command-deck {
    display: grid;
    grid-template-columns: var(--admin-rail-width) minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.admin-command-rail,
.admin-registry-stage {
    min-width: 0;
    display: grid;
    gap: 16px;
    padding-block: 22px;
    padding-inline: 22px;
    border-radius: 32px;
    border: 1px solid color-mix(in srgb, var(--q-border) 82%, #FFFFFF);
    background: var(--admin-panel-surface);
    box-shadow: var(--admin-panel-shadow);
}

.admin-command-rail {
    position: sticky;
    inset-block-start: 16px;
    overflow: hidden;
}

.admin-command-rail::before {
    content: '';
    position: absolute;
    inset-block-start: 0;
    inset-inline: 22px;
    block-size: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--q-primary), rgba(255, 177, 123, 0.88));
}

.admin-command-rail__stack {
    display: grid;
    gap: 14px;
}

.admin-command-composer-head {
    display: grid;
    gap: 12px;
    padding: 18px;
    border-radius: 24px;
    border: 1px solid color-mix(in srgb, var(--q-border) 82%, #FFFFFF);
    background:
        radial-gradient(circle at top right, rgba(255, 226, 204, 0.46), transparent 44%),
        linear-gradient(180deg, rgba(255, 248, 242, 0.96) 0%, rgba(255, 255, 255, 0.98) 100%);
}

.admin-command-composer-head .section-kicker {
    margin: 0;
    color: var(--q-primary);
}

.admin-command-composer-head .section-title {
    margin: 0;
    font-size: clamp(1.2rem, 2vw, 1.45rem);
    letter-spacing: -0.04em;
}

.admin-command-composer-head .section-copy {
    margin: 0;
    max-inline-size: 34ch;
}

.admin-command-composer-head .primary-button {
    justify-self: start;
    min-block-size: 46px;
}

.admin-form-shell {
    display: grid;
}

.admin-form {
    display: grid;
    gap: 16px;
}

.admin-command-rail .field-label {
    color: color-mix(in srgb, var(--q-text-primary) 90%, #7a5d49);
    font-weight: 700;
}

.admin-command-rail .field-help {
    color: var(--q-text-tertiary);
    line-height: 1.45;
}

.admin-command-rail .input,
.admin-command-rail .select {
    min-block-size: 48px;
    border-radius: 16px;
    border-color: rgba(121, 91, 66, 0.14);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74);
}

.admin-command-rail .input:hover,
.admin-command-rail .select:hover {
    border-color: rgba(217, 30, 13, 0.22);
}

.admin-command-rail .input:focus,
.admin-command-rail .select:focus {
    border-color: rgba(217, 30, 13, 0.4);
    box-shadow: 0 0 0 4px rgba(217, 30, 13, 0.08);
}

.admin-form__cluster {
    display: grid;
    gap: 14px;
    padding-block: 18px;
    padding-inline: 18px;
    border-radius: 24px;
    border: 1px solid color-mix(in srgb, var(--q-border-light) 88%, #FFFFFF);
    background:
        linear-gradient(180deg, rgba(255, 247, 240, 0.8) 0%, rgba(255, 255, 255, 0.96) 100%);
}

.admin-form__cluster--compact {
    gap: 12px;
}

.admin-form__cluster-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding-block-end: 14px;
    border-block-end: 1px solid rgba(121, 91, 66, 0.1);
}

.admin-form__cluster-icon {
    inline-size: 42px;
    block-size: 42px;
    display: inline-grid;
    place-items: center;
    border-radius: 15px;
    background: linear-gradient(180deg, rgba(255, 240, 232, 0.96) 0%, rgba(255, 249, 243, 0.9) 100%);
    border: 1px solid rgba(121, 91, 66, 0.08);
    color: var(--q-primary);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.admin-form__cluster-icon .lucide {
    inline-size: 18px;
    block-size: 18px;
    stroke-width: 1.9;
}

.admin-form__cluster-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.admin-form__eyebrow {
    margin: 0;
    color: var(--q-primary);
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.admin-form__title {
    margin: 0;
    color: var(--q-text-primary);
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.admin-form__cluster-text {
    margin: 0;
    max-inline-size: 58ch;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.55;
}

.admin-form__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    align-items: start;
}

.admin-form__grid--tight {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.7fr) minmax(0, 0.95fr);
    align-items: start;
}

.admin-form__inline-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 10px;
    align-items: stretch;
}

.admin-form__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
    padding-block-start: 14px;
    border-block-start: 1px solid rgba(121, 91, 66, 0.12);
}

.admin-form__actions-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
    flex: 1 1 240px;
}

.admin-form__actions-title {
    margin: 0;
    color: var(--q-text-primary);
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.admin-form__actions-hint {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.5;
}

.admin-form__actions-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.admin-form__actions-buttons > * {
    min-block-size: 44px;
}

.admin-form__actions-buttons .lucide {
    inline-size: 14px;
    block-size: 14px;
    stroke-width: 1.9;
}

.admin-preview-card {
    display: grid;
    gap: 8px;
    padding-block: 12px;
    padding-inline: 14px;
    border-radius: 18px;
    border: 1px dashed rgba(121, 91, 66, 0.18);
    background: rgba(255, 255, 255, 0.88);
}

.admin-preview-card__head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}

.admin-preview-card__icon {
    inline-size: 34px;
    block-size: 34px;
    display: inline-grid;
    place-items: center;
    border-radius: 12px;
    background: rgba(217, 30, 13, 0.08);
    color: var(--q-primary);
}

.admin-preview-card__icon .lucide {
    inline-size: 15px;
    block-size: 15px;
    stroke-width: 1.9;
}

.admin-preview-card__label {
    margin: 0;
    color: var(--q-text-tertiary);
    font-size: 0.5625rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.admin-preview-card__value {
    margin: 0;
    color: var(--q-text-primary);
    font-size: var(--q-text-sm);
    font-weight: 800;
    word-break: break-word;
    font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
}

.admin-preview-card__hint {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
}

.admin-role-banner__surface {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: center;
    justify-self: start;
    max-inline-size: min(100%, 360px);
    padding-block: 12px;
    padding-inline: 14px;
    border-radius: 20px;
    border: 1px solid rgba(121, 91, 66, 0.1);
    background: rgba(255, 248, 242, 0.9);
}

.admin-role-banner__surface--owner {
    background: rgba(217, 30, 13, 0.08);
    border-color: rgba(217, 30, 13, 0.14);
}

.admin-role-banner__icon {
    inline-size: 34px;
    block-size: 34px;
    display: inline-grid;
    place-items: center;
    border-radius: 12px;
    background: rgba(217, 30, 13, 0.1);
    color: var(--q-primary);
}

.admin-role-banner__icon .lucide {
    inline-size: 16px;
    block-size: 16px;
}

.admin-role-banner__title {
    margin: 0;
    color: var(--q-text-primary);
    font-size: var(--q-text-sm);
    font-weight: 800;
}

.admin-role-banner__copy {
    margin: 2px 0 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.45;
}

.admin-registry-stage {
    align-content: start;
}

.admin-registry-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.admin-registry-toolbar__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.admin-toolbar-chip {
    min-block-size: 30px;
    display: inline-flex;
    align-items: center;
    padding-inline: 12px;
    border-radius: 999px;
    background: rgba(121, 91, 66, 0.08);
    color: var(--q-text-primary);
    font-size: var(--q-text-xs);
    font-weight: 700;
}

.admin-toolbar-chip--muted {
    background: rgba(121, 91, 66, 0.04);
    color: var(--q-text-tertiary);
    font-weight: 600;
}

.admin-registry-stage__body {
    display: grid;
    gap: 14px;
}

.admin-form-parking {
    display: none;
}

.admin-registry-toolbar--command {
    display: block;
    gap: 14px;
}

.admin-registry-toolbar__main {
    min-width: 0;
    display: grid;
    gap: 10px;
}

.admin-registry-toolbar__bar {
    display: grid;
    grid-template-columns: minmax(240px, 1.2fr) auto auto;
    align-items: center;
    gap: 10px;
}

.admin-registry-toolbar__searchbar {
    min-width: 0;
    inline-size: 100%;
    min-block-size: 44px;
    padding-inline: 12px;
    border-radius: 16px;
}

.admin-registry-toolbar__searchbar input {
    min-width: 0;
}

.admin-registry-toolbar__filters {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    min-width: 0;
}

.admin-registry-toolbar__filters.hidden {
    display: none;
}

.admin-registry-toolbar__meta .meta-chip {
    min-height: 28px;
    padding-inline: 10px;
    letter-spacing: 0.02em;
}

.admin-filter-bar {
    display: block;
}

.admin-filter-bar.hidden {
    display: none;
}

.admin-filter-bar__surface {
    margin-block: 2px 2px;
}

.admin-pagination {
    padding-top: 2px;
}

.admin-registry-toolbar__actions {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    min-width: 0;
}

.admin-registry-toolbar__actions .primary-button {
    min-block-size: 44px;
    padding-inline: 16px;
    border-radius: 16px;
}

.admin-create-modal .q-modal__backdrop,
.admin-sheet .q-modal__backdrop {
    background: rgba(47, 25, 14, 0.24);
    backdrop-filter: blur(10px);
}

.admin-create-modal,
.admin-sheet {
    --admin-modal-width: var(--q-modal-width-work);
}

.admin-create-modal__dialog,
.admin-sheet__dialog {
    width: min(100%, var(--admin-modal-width));
    max-width: var(--admin-modal-width);
    max-height: calc(100dvh - 32px);
    border-radius: var(--q-radius-xl);
    border: 1px solid var(--q-border);
    background: #FFFFFF;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.14);
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
    margin-inline: auto;
}

.admin-sheet {
    position: fixed;
    inset: 0;
    z-index: 81;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.admin-sheet.hidden {
    display: none;
}

.admin-sheet__dialog {
    position: relative;
}

.admin-sheet__body,
.admin-editor-surface__body {
    display: grid;
    gap: 18px;
    padding: 18px 28px 28px;
}

.admin-editor-surface__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 24px 28px 16px;
    position: sticky;
    top: 0;
    z-index: 2;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--q-border-light);
}

.admin-editor-surface__header-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.admin-editor-surface__eyebrow {
    margin: 0;
    color: var(--q-primary);
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.admin-editor-surface__subtitle {
    margin: 0;
    max-inline-size: 54ch;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.5;
}

.admin-editor-surface__guide {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
}

.admin-editor-surface__guide.hidden {
    display: none;
}

.admin-editor-surface__guide--single {
    grid-template-columns: 1fr;
}

.admin-editor-guide-card {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 12px 14px;
    border-radius: 18px;
    border: 1px solid rgba(167, 132, 103, 0.12);
    background: linear-gradient(180deg, rgba(255, 247, 239, 0.9) 0%, rgba(255, 253, 249, 0.98) 100%);
}

.admin-editor-guide-card__icon {
    inline-size: 32px;
    block-size: 32px;
    display: inline-grid;
    place-items: center;
    border-radius: 11px;
    background: rgba(217, 30, 13, 0.08);
    color: var(--q-primary);
}

.admin-editor-guide-card__icon .lucide {
    inline-size: 15px;
    block-size: 15px;
    stroke-width: 1.9;
}

.admin-editor-guide-card__copy {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.admin-editor-guide-card__title {
    margin: 0;
    color: var(--q-text-primary);
    font-size: var(--q-text-xs);
    font-weight: 800;
    letter-spacing: -0.01em;
}

.admin-editor-guide-card__text {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: 0.75rem;
    line-height: 1.5;
}

.admin-editor-surface__mount {
    min-width: 0;
    display: grid;
    gap: 18px;
}

.admin-editor-surface__mount .admin-form-shell {
    display: grid;
}

.admin-editor-surface__mount .field-label {
    color: color-mix(in srgb, var(--q-text-primary) 90%, #7a5d49);
    font-weight: 700;
    min-block-size: 1.5rem;
    display: flex;
    align-items: flex-end;
    line-height: 1.35;
}

.admin-create-modal .field,
.admin-sheet .field {
    min-width: 0;
    display: grid;
    gap: 6px;
    align-content: start;
    grid-template-rows: auto minmax(48px, auto) minmax(2.75rem, auto);
}

.admin-create-modal .field:not(:has(.field-help))::after,
.admin-sheet .field:not(:has(.field-help))::after {
    content: '';
    display: block;
    min-block-size: 2.75rem;
}

.admin-editor-surface__mount .field-help,
.admin-create-modal .field-help,
.admin-sheet .field-help {
    color: var(--q-text-tertiary);
    line-height: 1.45;
    min-block-size: 2.75rem;
}

/* Password change modal — force single column for better mobile UX */
.password-change-modal .modal-form-grid--two {
    grid-template-columns: 1fr;
}

.password-change-modal[data-locked="true"] [data-password-change-dismiss="true"] {
    display: none;
}

.password-change-modal[data-locked="true"] .q-modal__backdrop {
    cursor: default;
}

.admin-editor-surface__mount .input,
.admin-editor-surface__mount .select,
.admin-editor-surface__mount .textarea,
.admin-create-modal .input,
.admin-create-modal .select,
.admin-create-modal .textarea,
.admin-sheet .input,
.admin-sheet .select,
.admin-sheet .textarea {
    min-block-size: 48px;
    align-self: start;
    border-radius: 16px;
    border-color: rgba(121, 91, 66, 0.14);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74);
}

.admin-editor-surface__mount .input:hover,
.admin-editor-surface__mount .select:hover,
.admin-editor-surface__mount .textarea:hover {
    border-color: rgba(217, 30, 13, 0.22);
}

.admin-editor-surface__mount .input:focus,
.admin-editor-surface__mount .select:focus,
.admin-editor-surface__mount .textarea:focus {
    border-color: rgba(217, 30, 13, 0.42);
    box-shadow: 0 0 0 4px rgba(217, 30, 13, 0.08);
}

.admin-editor-surface__mount .admin-form__actions {
    position: sticky;
    inset-block-end: 0;
    z-index: 2;
    padding-block-start: 14px;
    padding-block-end: 6px;
    background:
        linear-gradient(180deg, rgba(255, 251, 246, 0) 0%, rgba(255, 251, 246, 0.92) 38%, rgba(255, 251, 246, 0.98) 100%);
}

.admin-editor-surface__mount .admin-form__actions.product-modal__footer {
    align-items: center;
}

.admin-editor-surface__mount .admin-form__actions.product-modal__footer .product-modal__footer-left {
    justify-content: flex-start;
}

.admin-editor-surface__mount .admin-form__actions-buttons > * {
    min-block-size: 46px;
    border-radius: 18px;
}

.admin-sheet__body .owner-credentials,
.admin-create-modal .owner-credentials {
    margin-block-start: 4px;
}

.admin-scope-note {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 14px;
    border-radius: 20px;
    border: 1px solid rgba(121, 91, 66, 0.1);
    background: rgba(255, 248, 242, 0.9);
}

.admin-scope-note--owner {
    background: rgba(217, 30, 13, 0.08);
    border-color: rgba(217, 30, 13, 0.14);
}

.admin-scope-note--warning {
    background: rgba(255, 247, 221, 0.76);
    border-color: rgba(217, 119, 6, 0.18);
}

.admin-scope-note__icon {
    inline-size: 36px;
    block-size: 36px;
    display: inline-grid;
    place-items: center;
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.72);
    color: var(--q-primary);
}

.admin-scope-note__icon .lucide {
    inline-size: 16px;
    block-size: 16px;
    stroke-width: 1.9;
}

.admin-scope-note__title {
    margin: 0;
    color: var(--q-text-primary);
    font-size: 0.875rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.admin-scope-note__copy {
    margin: 4px 0 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.55;
}

.admin-scope-panel {
    display: grid;
    gap: 12px;
}

.admin-scope-panel__head {
    display: grid;
    gap: 10px;
}

.admin-scope-panel__toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: end;
}

.admin-scope-panel__summary {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.admin-scope-panel__summary-pill {
    min-block-size: 32px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding-inline: 12px;
    border-radius: 999px;
    background: rgba(121, 91, 66, 0.06);
    color: var(--q-text-primary);
    font-size: 0.75rem;
    font-weight: 700;
}

.admin-scope-panel__summary-pill strong {
    font-weight: 800;
}

.admin-scope-panel__search {
    max-inline-size: 360px;
}

.admin-scope-panel__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.admin-scope-panel__actions .secondary-button {
    min-block-size: 42px;
    border-radius: 16px;
}

.admin-scope-panel__list {
    display: grid;
    gap: 10px;
    max-block-size: 320px;
    overflow-y: auto;
    padding-inline-end: 4px;
}

.admin-scope-panel__list::-webkit-scrollbar {
    width: 10px;
}

.admin-scope-panel__list::-webkit-scrollbar-thumb {
    background: rgba(121, 91, 66, 0.16);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.admin-scope-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    border-radius: 18px;
    border: 1px solid rgba(121, 91, 66, 0.08);
    background: linear-gradient(180deg, rgba(255, 248, 242, 0.76) 0%, rgba(255, 255, 255, 0.98) 100%);
}

.admin-scope-row--selected {
    border-color: rgba(217, 30, 13, 0.16);
    box-shadow: inset 0 0 0 1px rgba(217, 30, 13, 0.06);
}

.admin-scope-row__identity {
    min-width: 0;
    display: grid;
    gap: 5px;
}

.admin-scope-row__title {
    margin: 0;
    color: var(--q-text-primary);
    font-size: 0.875rem;
    font-weight: 800;
    line-height: 1.2;
}

.admin-scope-row__slug {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: 0.7rem;
    line-height: 1.45;
    font-family: "SF Mono", "Fira Code", "Consolas", monospace;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-scope-row__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.admin-scope-row__controls {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    align-items: center;
}

.admin-scope-choice {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-block-size: 38px;
    padding-inline: 12px;
    border-radius: 14px;
    border: 1px solid rgba(121, 91, 66, 0.08);
    background: rgba(255, 255, 255, 0.88);
    color: var(--q-text-primary);
    font-size: 0.75rem;
    font-weight: 700;
    cursor: pointer;
}

.admin-scope-choice input {
    margin: 0;
    accent-color: var(--q-primary);
}

.admin-scope-choice:has(input:disabled) {
    opacity: 0.58;
    cursor: not-allowed;
}

.admin-scope-choice__copy {
    line-height: 1.2;
}

.admin-scope-empty {
    padding: 18px 16px;
    border-radius: 18px;
    border: 1px dashed rgba(121, 91, 66, 0.16);
    background: rgba(255, 255, 255, 0.72);
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.55;
}

.owner-credentials {
    display: grid;
    gap: 14px;
    padding: 20px;
    border-radius: var(--q-radius-lg);
    border: none;
    background: var(--q-text-primary);
    color: #FFFFFF;
    position: relative;
    overflow: hidden;
}

/* Red accent stripe */
.owner-credentials::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--q-primary);
}

.owner-credentials__head {
    display: grid;
    gap: 4px;
}

.owner-credentials__title {
    margin: 0;
    color: #FFFFFF;
    font-size: var(--q-text-md);
    font-weight: 800;
    letter-spacing: -0.02em;
}

.owner-credentials__copy {
    margin: 0;
    color: rgba(255, 255, 255, 0.55);
    font-size: var(--q-text-xs);
    line-height: 1.5;
}

.owner-credentials__grid {
    display: grid;
    gap: 8px;
}

.owner-credentials__item {
    align-items: center;
    gap: 10px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: var(--q-radius-md);
    padding: 10px 12px;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.owner-credentials__item .surface-row__label {
    color: rgba(255, 255, 255, 0.45);
}

.owner-credentials__item .surface-row__value {
    font-family: "SF Mono", "Fira Code", "Consolas", monospace;
    overflow-wrap: anywhere;
    color: #FFFFFF;
    font-weight: 700;
}

.owner-credentials__copy-btn {
    min-block-size: 34px;
    padding-inline: 10px;
    border-radius: var(--q-radius-sm);
    color: rgba(255, 255, 255, 0.6);
    border-color: rgba(255, 255, 255, 0.12);
}

.owner-credentials__copy-btn:hover {
    color: #FFFFFF;
    background: rgba(255, 255, 255, 0.08);
}

.owner-credentials__copy-btn .lucide {
    inline-size: 13px;
    block-size: 13px;
}

.owner-credentials__copy-all {
    width: 100%;
    min-height: 42px;
    font-weight: 700;
}

.owner-credentials__hint {
    margin: 0;
    color: rgba(255, 255, 255, 0.4);
    font-size: var(--q-text-xs);
    line-height: 1.45;
}

.admin-launch-stepper {
    margin-block-end: 2px;
}

.admin-launch-stepper[data-step="access"] .product-stepper__rail::after {
    width: 100%;
    opacity: 0.78;
}

.admin-launch-step {
    display: grid;
    gap: 16px;
}

.admin-operation-footer {
    margin-block-start: 10px;
}

.password-change-modal__footer,
.menu-scope-modal__footer {
    justify-content: space-between;
    align-items: center;
}

.step-up-modal__dialog {
    max-inline-size: min(100%, 560px);
}

.inline-feedback {
    display: flex;
    align-items: center;
    min-block-size: 44px;
    padding-block: 10px;
    padding-inline: 12px;
    border-radius: 16px;
    border: 1px solid rgba(121, 91, 66, 0.12);
    background: rgba(255, 248, 240, 0.92);
    color: var(--q-text-secondary);
    font-size: var(--q-text-sm);
    line-height: 1.45;
}

.inline-feedback.hidden {
    display: none;
}

.inline-feedback--error {
    border-color: rgba(220, 38, 38, 0.18);
    background: rgba(254, 242, 242, 0.96);
    color: #991b1b;
}

.inline-feedback--success {
    border-color: rgba(15, 118, 110, 0.18);
    background: rgba(240, 253, 250, 0.96);
    color: #115e59;
}

.admin-team-summary {
    display: grid;
    grid-template-columns: 1.2fr repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.admin-team-summary__card {
    min-width: 0;
    display: grid;
    gap: 6px;
    padding: 14px 15px;
    border-radius: 20px;
    border: 1px solid rgba(121, 91, 66, 0.08);
    background: linear-gradient(180deg, rgba(255, 248, 240, 0.92) 0%, rgba(255, 255, 255, 0.98) 100%);
}

.admin-team-summary__card--primary {
    background:
        radial-gradient(circle at top right, rgba(255, 224, 198, 0.42), transparent 38%),
        linear-gradient(180deg, rgba(255, 247, 239, 0.96) 0%, rgba(255, 255, 255, 1) 100%);
}

.admin-team-summary__label {
    margin: 0;
    color: color-mix(in srgb, var(--q-text-tertiary) 90%, #8f7765);
    font-size: 0.5625rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.admin-team-summary__title {
    margin: 0;
    color: var(--q-text-primary);
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1.25;
    text-wrap: balance;
}

.admin-team-summary__copy {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.admin-operation-team__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.admin-operation-team__actions > * {
    min-block-size: 44px;
    border-radius: 18px;
}

.admin-operation-context {
    display: grid;
    gap: 12px;
}

.admin-operation-context-card {
    display: grid;
    gap: 12px;
    padding: 16px;
    border-radius: 22px;
    border: 1px solid rgba(121, 91, 66, 0.08);
    background:
        radial-gradient(circle at top right, rgba(255, 225, 199, 0.32), transparent 34%),
        linear-gradient(180deg, rgba(255, 248, 241, 0.92) 0%, rgba(255, 255, 255, 0.98) 100%);
}

.admin-operation-context-card__identity {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.admin-operation-context-card__avatar {
    inline-size: 48px;
    block-size: 48px;
    position: relative;
    display: inline-grid;
    place-items: center;
    border-radius: 17px;
    font-size: 1rem;
    font-weight: 800;
    border: 1px solid rgba(255, 255, 255, 0.64);
    box-shadow: 0 10px 22px rgba(73, 47, 30, 0.08);
}

.admin-operation-context-card__avatar img {
    position: absolute;
    inset: 0;
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
}

.admin-operation-context-card__copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.admin-operation-context-card__eyebrow {
    margin: 0;
    color: var(--q-primary);
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.admin-operation-context-card__title {
    margin: 0;
    color: var(--q-text-primary);
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: -0.03em;
}

.admin-operation-context-card__subtitle {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: 0.74rem;
    line-height: 1.45;
    font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
    overflow-wrap: anywhere;
}

.admin-operation-context-card__status,
.admin-operation-context-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.admin-operation-context-card__actions > * {
    min-block-size: 42px;
    border-radius: 16px;
}

.admin-operation-roster__toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: end;
}

.admin-operation-roster__search {
    max-inline-size: 100%;
}

.admin-operation-roster__toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.admin-operation-roster__toolbar-actions > * {
    min-block-size: 44px;
    border-radius: 18px;
}

.admin-operation-roster {
    display: grid;
    gap: 10px;
}

.admin-operation-roster__empty {
    display: grid;
    gap: 6px;
    padding: 18px;
    border-radius: 20px;
    border: 1px dashed rgba(121, 91, 66, 0.16);
    background: rgba(255, 255, 255, 0.78);
}

.admin-operation-roster__empty-title {
    margin: 0;
    color: var(--q-text-primary);
    font-size: 0.92rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.admin-operation-roster__empty-copy {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.55;
}

.admin-operation-person {
    --operation-person-accent: var(--q-primary);
    min-width: 0;
    display: grid;
    gap: 10px;
    padding: 14px;
    border-radius: 20px;
    border: 1px solid rgba(121, 91, 66, 0.08);
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--operation-person-accent) 6%, #FFFFFF), transparent 34%),
        linear-gradient(180deg, rgba(255, 248, 242, 0.92) 0%, rgba(255, 255, 255, 0.98) 100%);
    box-shadow: 0 10px 24px rgba(73, 47, 30, 0.05);
}

.admin-operation-person.is-active {
    border-color: color-mix(in srgb, var(--operation-person-accent) 28%, var(--q-border));
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--operation-person-accent) 10%, transparent),
        0 16px 30px rgba(73, 47, 30, 0.08);
}

.admin-operation-person--tone-success {
    --operation-person-accent: var(--q-success-dark);
}

.admin-operation-person--tone-warning {
    --operation-person-accent: var(--q-warning);
}

.admin-operation-person--tone-muted {
    --operation-person-accent: color-mix(in srgb, var(--q-text-tertiary) 84%, #7f6654);
}

.admin-operation-person__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: start;
}

.admin-operation-person__identity {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}

.admin-operation-person__avatar {
    inline-size: 42px;
    block-size: 42px;
    display: inline-grid;
    place-items: center;
    border-radius: 15px;
    background: linear-gradient(180deg, #3f2d24 0%, #271910 100%);
    color: #fff;
    font-size: 0.9375rem;
    font-weight: 800;
    box-shadow: 0 10px 20px rgba(73, 47, 30, 0.08);
}

.admin-operation-person__copy {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.admin-operation-person__name {
    margin: 0;
    color: var(--q-text-primary);
    font-size: 0.94rem;
    font-weight: 800;
    line-height: 1.2;
}

.admin-operation-person__login {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: 0.72rem;
    line-height: 1.45;
    font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
    overflow-wrap: anywhere;
}

.admin-operation-person__status {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.admin-operation-person__meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.admin-operation-person__meta-item {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(121, 91, 66, 0.08);
    background: rgba(255, 255, 255, 0.9);
    color: var(--q-text-secondary);
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.admin-operation-person__meta-item .lucide {
    inline-size: 14px;
    block-size: 14px;
    flex: 0 0 auto;
    color: var(--operation-person-accent);
}

.admin-operation-person__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.admin-operation-person__actions > * {
    min-block-size: 40px;
    border-radius: 16px;
}

.admin-scope-panel--contextual .admin-scope-row__head {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}

.admin-scope-row__avatar {
    inline-size: 40px;
    block-size: 40px;
    position: relative;
    display: inline-grid;
    place-items: center;
    border-radius: 14px;
    font-size: 0.875rem;
    font-weight: 800;
    border: 1px solid rgba(255, 255, 255, 0.56);
    box-shadow: 0 8px 18px rgba(73, 47, 30, 0.06);
}

.admin-scope-row__avatar img {
    position: absolute;
    inset: 0;
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
}

.admin-scope-row__copy {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.admin-scope-row--context {
    border-color: rgba(217, 30, 13, 0.14);
    box-shadow: inset 0 0 0 1px rgba(217, 30, 13, 0.05);
}

.admin-scope-choice--locked {
    border-color: rgba(217, 30, 13, 0.12);
    background: rgba(217, 30, 13, 0.06);
    color: var(--q-primary);
}

/* ============================================================
   OPERATION CARDS — Presença visual. DNA comida.
   Topo contextual, meio analítico, diagnóstico claro e dock estável.
   ============================================================ */
.op-grid {
    --op-grid-track-max: 460px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 14px;
    align-items: start;
}

.op-grid[data-count="1"] {
    grid-template-columns: minmax(min(100%, 400px), var(--op-grid-track-max));
    justify-content: start;
}

.op-grid[data-count="2"] {
    grid-template-columns: repeat(2, minmax(min(100%, 400px), var(--op-grid-track-max)));
    justify-content: start;
}

.op-card {
    display: flex;
    flex-direction: column;
    border-radius: 22px;
    border: 1px solid var(--q-border-light);
    background: rgba(255, 255, 255, 0.9);
    overflow: hidden;
    box-shadow: var(--q-shadow-xs);
    transition: box-shadow 200ms var(--q-ease), transform 200ms var(--q-ease), border-color 200ms var(--q-ease);
    min-width: 0;
}

.op-card:hover {
    box-shadow: var(--q-shadow-sm);
    transform: translateY(-1px);
    border-color: var(--q-border);
}

.op-card--success {
    --op-card-accent: var(--q-success-dark);
}

.op-card--warning {
    --op-card-accent: #d97706;
}

.op-card--muted {
    --op-card-accent: #8d7769;
}

.op-card.is-current {
    box-shadow:
        0 0 0 1px rgba(37, 99, 235, 0.12),
        0 8px 18px rgba(37, 99, 235, 0.06);
}

.op-card.is-selected {
    border-color: color-mix(in srgb, var(--q-primary) 24%, var(--q-border));
    box-shadow:
        0 0 0 2px rgba(217, 30, 13, 0.08),
        0 10px 22px rgba(73, 47, 30, 0.08);
}

.op-card.is-muted {
    border-color: rgba(121, 91, 66, 0.12);
    background: rgba(252, 249, 246, 0.98);
}

.op-card__surface {
    appearance: none;
    inline-size: 100%;
    display: grid;
    gap: 0;
    padding: 0;
    border: none;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.op-card__surface:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--q-primary) 76%, #FFFFFF);
    outline-offset: -2px;
}

.op-card__main {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px 10px;
    background: #241912;
    color: #FFFFFF;
}

.op-card__main::before {
    display: none;
}

.op-card__avatar {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: inline-grid;
    place-items: center;
    font-size: 0.9375rem;
    font-weight: 800;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.12);
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.op-card__avatar img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}

.op-card__info {
    flex: 1;
    min-width: 0;
}

.op-card__name {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.op-card__slug {
    margin: 2px 0 0;
    font-size: var(--q-text-2xs);
    color: rgba(255, 255, 255, 0.4);
    font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.op-card__status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 8px;
    border-radius: var(--q-radius-full);
    font-size: 0.5625rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    white-space: nowrap;
    flex-shrink: 0;
}

.op-card__status--on {
    background: color-mix(in srgb, var(--q-success-dark) 18%, transparent);
    color: #7df0c8;
}

.op-card__status--off {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.6);
}

.op-card__status-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.op-card__numbers {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    padding: 10px 12px 0;
    background: transparent;
}

.op-card__num {
    min-width: 0;
    display: grid;
    justify-items: start;
    gap: 3px;
    padding: 9px 10px;
    border-radius: 14px;
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
}

.op-card__num--products {
    --op-metric-accent: #df5d45;
}

.op-card__num--categories {
    --op-metric-accent: #b7791f;
}

.op-card__num--team {
    --op-metric-accent: #0f8f7c;
}

.op-card__num strong {
    font-size: 1rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--q-text-primary);
}

.op-card__num span {
    font-size: 0.53125rem;
    font-weight: 700;
    color: color-mix(in srgb, var(--op-metric-accent) 76%, #8a705f);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.op-card__diagnosis {
    display: grid;
    gap: 8px;
    padding: 10px 12px 12px;
    background: transparent;
}

.op-card__diagnosis-copy {
    display: grid;
    gap: 4px;
}

.op-card__diagnosis-label {
    margin: 0;
    color: var(--q-text-tertiary);
    font-size: var(--q-text-2xs);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.op-card__diagnosis-title {
    margin: 0;
    color: var(--q-text-primary);
    font-size: var(--q-text-sm);
    font-weight: 800;
    letter-spacing: -0.02em;
}

.op-card__diagnosis-text {
    margin: 0;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.op-card__diagnosis-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 20px;
}

.op-card__dock {
    display: grid;
    gap: 0;
    padding: 0 12px 12px;
    border-top: 1px solid rgba(121, 91, 66, 0.08);
    background: transparent;
}

.op-card__utility-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
    padding-top: 10px;
}

.op-card__utility {
    min-width: 0;
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
    box-shadow: none;
}

.op-card__utility {
    min-block-size: 38px;
    padding: 0 8px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    transition: border-color 160ms var(--q-ease), background 160ms var(--q-ease), color 160ms var(--q-ease), transform 160ms var(--q-ease);
}

.op-card__utility:hover {
    border-color: var(--q-border);
    color: var(--q-text-primary);
    background: rgba(255, 255, 255, 0.98);
    transform: translateY(-1px);
}

.op-card__utility:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--q-primary) 76%, #FFFFFF);
    outline-offset: 2px;
}

.op-card__utility--context {
    border-color: color-mix(in srgb, var(--q-link) 18%, var(--q-border));
    background: var(--q-link-soft);
    color: var(--q-link);
}

.op-card__utility--passive {
    cursor: default;
    color: var(--q-text-tertiary);
    background: rgba(247, 242, 238, 0.92);
}

.op-card__utility--passive:hover {
    transform: none;
    border-color: var(--q-border-light);
    background: rgba(247, 242, 238, 0.92);
    color: var(--q-text-tertiary);
}

.op-card__utility .lucide {
    width: 13px;
    height: 13px;
    stroke-width: 1.9;
    flex-shrink: 0;
}

.op-card__tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 20px;
    padding: 0 8px;
    border-radius: var(--q-radius-full);
    font-size: var(--q-text-2xs);
    font-weight: 700;
    white-space: nowrap;
}

.op-card__tag--you {
    background: var(--q-primary-soft);
    color: var(--q-primary);
}

.op-card__tag--warn {
    background: var(--q-warning-soft);
    color: var(--q-warning);
}

.op-card__tag--muted {
    background: var(--q-secondary);
    color: var(--q-text-tertiary);
}

.op-card__tag--ok {
    background: var(--q-success-soft);
    color: var(--q-success-dark);
}

.op-card__tag .lucide {
    width: 12px;
    height: 12px;
    stroke-width: 1.8;
}

.op-card__utility--state {
    font-weight: 800;
}

.op-card__utility--danger {
    border-color: rgba(220, 38, 38, 0.16);
    background: rgba(254, 242, 242, 0.98);
    color: #b42318;
}

.op-card__utility--danger:hover {
    border-color: rgba(220, 38, 38, 0.26);
    background: rgba(254, 232, 232, 1);
}

.op-card__utility--go {
    border-color: rgba(5, 150, 105, 0.16);
    background: rgba(236, 253, 245, 0.98);
    color: var(--q-success-dark);
}

/* ============================================================
   TEAM CARDS — Person-focused. Limpo.
   Avatar forte, status claro e footer adaptativo por quantidade de ação.
   ============================================================ */
.team-grid {
    --team-grid-track-min: 260px;
    --team-grid-track-max: 320px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--team-grid-track-min)), var(--team-grid-track-max)));
    gap: 14px;
    align-items: start;
    justify-content: start;
    align-content: start;
    container-type: inline-size;
}

.team-grid[data-count="1"] {
    grid-template-columns: minmax(min(100%, var(--team-grid-track-min)), var(--team-grid-track-max));
}

.team-grid[data-count="2"] {
    grid-template-columns: repeat(2, minmax(min(100%, var(--team-grid-track-min)), var(--team-grid-track-max)));
}

.team-card {
    display: flex;
    flex-direction: column;
    border-radius: 20px;
    border: 1px solid var(--q-border-light);
    background: rgba(255, 255, 255, 0.9);
    overflow: hidden;
    transition: border-color 180ms var(--q-ease), box-shadow 180ms var(--q-ease), transform 180ms var(--q-ease), background 180ms var(--q-ease);
    min-width: 0;
}

.team-card:hover {
    border-color: var(--q-border);
    box-shadow: var(--q-shadow-sm);
    transform: translateY(-1px);
}

.team-card--success {
    --team-card-accent: var(--q-success-dark);
    --team-card-accent-soft: rgba(0, 153, 110, 0.08);
}

.team-card--warning {
    --team-card-accent: #d97706;
    --team-card-accent-soft: rgba(245, 158, 11, 0.1);
}

.team-card--muted {
    --team-card-accent: #8d7769;
    --team-card-accent-soft: rgba(121, 91, 66, 0.08);
}

.team-card.is-self {
    box-shadow:
        0 0 0 1px rgba(217, 30, 13, 0.08),
        0 8px 18px rgba(217, 30, 13, 0.05);
}

.team-card.is-selected {
    border-color: color-mix(in srgb, var(--q-primary) 24%, var(--q-border));
    box-shadow:
        0 0 0 2px rgba(217, 30, 13, 0.08),
        0 10px 22px rgba(73, 47, 30, 0.08);
}

.team-card.is-muted {
    background: rgba(252, 249, 246, 0.98);
}

.team-card__surface {
    appearance: none;
    inline-size: 100%;
    display: grid;
    gap: 0;
    padding: 0;
    border: none;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.team-card__surface::before {
    display: none;
}

.team-card__surface:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--q-primary) 76%, #FFFFFF);
    outline-offset: -2px;
}

.team-card__main {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px 9px;
    background-color: #241912;
    background-image:
        radial-gradient(circle at 12% 18%, rgba(217, 30, 13, 0.16), transparent 32%),
        linear-gradient(180deg, rgba(38, 24, 20, 0.98) 0%, rgba(33, 21, 18, 0.98) 100%);
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.04);
}

.team-card__avatar {
    width: 42px;
    height: 42px;
    border-radius: 13px;
    display: inline-grid;
    place-items: center;
    font-size: var(--q-text-sm);
    font-weight: 800;
    color: #FFFFFF;
    flex-shrink: 0;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.team-card__info {
    flex: 1;
    min-width: 0;
    display: grid;
    gap: 1px;
}

.team-card__name {
    margin: 0;
    font-size: var(--q-text-sm);
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.team-card__login {
    margin: 0;
    font-size: var(--q-text-2xs);
    color: rgba(255, 255, 255, 0.7);
    font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
}

.team-card__contact {
    margin: 0;
    font-size: var(--q-text-2xs);
    color: rgba(255, 255, 255, 0.56);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.team-card__middle {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
    padding: 8px 14px 9px;
}

.team-card__status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 8px;
    border-radius: var(--q-radius-full);
    font-size: var(--q-text-2xs);
    font-weight: 700;
}

.team-card__status--on {
    background: var(--q-success-soft);
    color: var(--q-success-dark);
}

.team-card__status--off {
    background: var(--q-secondary);
    color: var(--q-text-tertiary);
}

.team-card__status--warn {
    background: var(--q-warning-soft);
    color: var(--q-warning);
}

.team-card__status-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
}

.team-card__you {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border-radius: var(--q-radius-full);
    background: var(--q-primary-soft);
    color: var(--q-primary);
    font-size: var(--q-text-2xs);
    font-weight: 700;
}

.team-card__scope {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border-radius: var(--q-radius-full);
    background: var(--q-secondary);
    color: var(--q-text-secondary);
    font-size: var(--q-text-2xs);
    font-weight: 600;
    max-width: 160px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.team-card__extra {
    color: var(--q-text-tertiary);
    font-size: var(--q-text-2xs);
    font-weight: 700;
}

.team-card__foot {
    display: grid;
    gap: 8px;
    padding: 8px 8px 9px;
    border-top: 1px solid rgba(121, 91, 66, 0.08);
    background: transparent;
    margin-top: auto;
}

.team-card__foot[data-action-count="1"] {
    grid-template-columns: minmax(0, 1fr);
}

.team-card__foot[data-action-count="2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.team-card__foot[data-action-count="3"] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.team-card__act {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 100%;
    min-height: 36px;
    padding: 0 10px;
    border-radius: 14px;
    border: 1px solid var(--q-border-light);
    background: var(--q-surface);
    color: var(--q-text-secondary);
    font-size: var(--q-text-xs);
    font-weight: 700;
    cursor: pointer;
    transition: border-color 150ms var(--q-ease), background 150ms var(--q-ease), color 150ms var(--q-ease), transform 150ms var(--q-ease);
    white-space: nowrap;
}

.team-card__act:hover {
    border-color: var(--q-border);
    background: rgba(255, 255, 255, 0.98);
    color: var(--q-text-primary);
    transform: translateY(-1px);
}

.team-card__act--danger {
    border-color: rgba(220, 38, 38, 0.14);
    color: #b42318;
    background: rgba(254, 242, 242, 0.92);
}

.team-card__act--danger:hover {
    border-color: rgba(220, 38, 38, 0.24);
    background: rgba(254, 232, 232, 1);
    color: #991b1b;
}

.team-card__act--single {
    max-inline-size: 200px;
    justify-self: center;
}

.team-card__act:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--q-primary) 76%, #FFFFFF);
    outline-offset: 2px;
}

.team-card__act .lucide {
    width: 14px;
    height: 14px;
    stroke-width: 1.8;
    flex-shrink: 0;
}

/* ---- Cards responsive ---- */
@media (max-width: 900px) {
    .op-grid {
        --op-grid-track-max: 420px;
        grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    }

    .op-grid[data-count="1"] {
        grid-template-columns: minmax(min(100%, 340px), var(--op-grid-track-max));
    }

    .op-grid[data-count="2"] {
        grid-template-columns: repeat(2, minmax(min(100%, 340px), var(--op-grid-track-max)));
    }

    .team-grid {
        --team-grid-track-min: 240px;
        --team-grid-track-max: 300px;
    }
}

@media (max-width: 720px) {
    .op-grid,
    .team-grid {
        grid-template-columns: 1fr;
    }

    .op-card__numbers {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .op-card__utility-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .op-card__num--team {
        grid-column: span 2;
    }
}

@media (prefers-reduced-motion: reduce) {
    .admin-mode-switch__btn,
    .admin-summary-pill,
    .admin-record-card,
    .admin-record-icon {
        transition: none;
    }
}

@media (max-width: 1080px) {
    .admin-summary-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-summary-strip[data-mode="owner"][data-count="3"] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        justify-content: stretch;
        max-inline-size: none;
        margin-inline: 0;
    }

    .admin-form__grid,
    .admin-form__grid--tight,
    .admin-form__inline-grid {
        grid-template-columns: 1fr;
    }

    .admin-registry-toolbar,
    .admin-registry-toolbar--command {
        align-items: stretch;
    }

    .admin-registry-toolbar__bar {
        grid-template-columns: 1fr;
    }

    .admin-registry-toolbar__meta {
        justify-content: flex-start;
    }

    .admin-registry-toolbar__filters {
        flex-wrap: wrap;
    }

    .admin-registry-toolbar__actions {
        justify-content: flex-start;
    }

    .admin-sheet {
        padding: 12px;
    }

    .admin-sheet__dialog {
        width: min(100%, var(--admin-modal-width));
    }

    .admin-team-summary {
        grid-template-columns: 1fr;
    }

    .admin-operation-roster__toolbar {
        grid-template-columns: 1fr;
    }

    .admin-operation-roster__toolbar-actions {
        justify-content: flex-start;
    }

    .admin-form__actions {
        align-items: stretch;
    }

    .admin-form__actions-buttons {
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    .modal-form-grid--two {
        grid-template-columns: 1fr;
    }

    .q-modal__footer--split {
        align-items: stretch;
    }

    .q-modal__footer-actions {
        justify-content: flex-start;
    }

    .admin-summary-strip,
    .admin-card-grid {
        grid-template-columns: 1fr;
    }

    .admin-summary-strip[data-mode="owner"][data-count="3"] {
        grid-template-columns: 1fr;
        justify-content: stretch;
        max-inline-size: none;
        margin-inline: 0;
    }

    .admin-registry-stage {
        padding-block: 18px;
        padding-inline: 16px;
        border-radius: 24px;
    }

    .admin-mode-switch {
        inline-size: 100%;
        grid-template-columns: 1fr;
    }

    .admin-registry-toolbar__searchbar,
    .admin-registry-toolbar__filters,
    .admin-registry-toolbar__filters .crud-status-filter,
    .admin-registry-toolbar__filters .crud-status-filter__trigger,
    .admin-registry-toolbar__actions,
    .admin-registry-toolbar__actions .primary-button {
        width: 100%;
    }

    .admin-record-card__status,
    .admin-record-card__utility,
    .admin-record-card__actions {
        justify-content: flex-start;
    }

    .admin-operation-context-card__status,
    .admin-operation-context-card__actions,
    .admin-operation-person__status,
    .admin-operation-person__actions {
        justify-content: flex-start;
    }

    .admin-operation-person__meta {
        grid-template-columns: 1fr;
    }

    .op-card__utility-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .team-card__foot[data-action-count="3"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .team-card__foot[data-action-count="3"] .team-card__act--danger {
        grid-column: span 2;
    }

    .admin-create-modal,
    .admin-sheet {
        padding: 12px;
    }

    .admin-create-modal__dialog,
    .admin-sheet__dialog {
        max-width: 100%;
        max-height: calc(100dvh - 24px);
        border-radius: 24px;
    }

    .admin-sheet__body,
    .admin-editor-surface__body {
        padding: 16px 18px 18px;
    }

    .admin-editor-surface__header {
        padding: 18px 18px 0;
    }

    .admin-form__cluster-head,
    .admin-scope-row {
        grid-template-columns: 1fr;
    }

    .admin-form__cluster-icon {
        inline-size: 38px;
        block-size: 38px;
    }

    .admin-form__actions-buttons > * {
        flex: 1 1 100%;
        justify-content: center;
    }

    .admin-scope-panel__search {
        max-inline-size: 100%;
    }

    .admin-scope-panel__toolbar {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .admin-scope-panel__actions {
        justify-content: flex-start;
    }

    .admin-scope-row__controls {
        justify-content: flex-start;
    }

    .admin-operation-team__actions > * {
        flex: 1 1 100%;
        justify-content: center;
    }
}

/* ============================================================
   PRODUCTIVITY ENHANCEMENTS
   ============================================================ */

/* Micro-celebration on success feedback */
@keyframes celebrate-pulse {
    0% { transform: scale(1); }
    30% { transform: scale(1.02); }
    100% { transform: scale(1); }
}

.feedback-bar.is-celebrating {
    animation: celebrate-pulse 400ms var(--q-ease);
}

/* Password change progress bar */
.password-progress {
    width: 100%;
    height: 4px;
    border-radius: 2px;
    background: var(--q-border-light);
    margin-bottom: 8px;
    overflow: hidden;
}

.password-progress__bar {
    width: 90%;
    height: 100%;
    border-radius: 2px;
    background: var(--q-primary);
    animation: progress-fill 600ms var(--q-ease) forwards;
}

@keyframes progress-fill {
    from { width: 0; }
    to { width: 90%; }
}

/* WhatsApp button in credentials */
.owner-credentials__whatsapp {
    color: #FFFFFF;
    border-color: rgba(255, 255, 255, 0.15);
    background: rgba(255, 255, 255, 0.06);
}

.owner-credentials__whatsapp:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.25);
    color: #FFFFFF;
}

/* Credentials actions row */
.owner-credentials__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.owner-credentials__actions .primary-button,
.owner-credentials__actions .secondary-button {
    flex: 1 1 auto;
    min-width: 0;
}

/* Field optional label */
.field-optional {
    font-weight: 400;
    color: var(--q-text-tertiary);
    font-size: 0.9em;
}