:root {
  color-scheme: light;
  --bg: #f7f9fc;
  --surface: #ffffff;
  --surface-soft: #f0f5fb;
  --ink: #17253a;
  --muted: #6f7f95;
  --line: #dfe7f0;
  --primary: #3271d8;
  --primary-dark: #2457ad;
  --selected: #eef4ff;
  --focus: #8cabff;
  --on-primary: #ffffff;
  --accent: #dff6e9;
  --accent-ink: #157043;
  --warning: #fff1d4;
  --danger: #b54848;
  --shadow: 0 18px 50px rgba(39, 66, 100, .08);
  --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: "Quicksand", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.45;
}
button, input, select, textarea { font: inherit; }
button, select, input { min-height: 44px; }
button { cursor: pointer; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(50, 113, 216, .35);
  outline-offset: 2px;
}
a { color: inherit; text-decoration: none; }

.app-shell { width: 100%; min-height: 100vh; max-width: none; margin: 0; padding: 0 30px 60px; border: 0px solid var(--line); }
.app-header { position: sticky; top: 0; z-index: 100; padding: 8px 0 12px; background: var(--bg); }
.topbar { min-width: 0; min-height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: inline-flex; align-items: center; gap: 11px; min-width: 0; font-size: 1.45rem; font-weight: 800; letter-spacing: -.04em; }
.brand-copy { display: grid; gap: 2px; min-width: 0; }
.brand-title { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.brand-name, .brand-shop { display: block; font-size: 1.45rem; font-weight: 800; letter-spacing: -.04em; line-height: 1; }
.brand-tagline { display: block; color: var(--primary); font-size: .58rem; font-weight: 800; letter-spacing: .12em; line-height: 1.1; text-transform: uppercase; }
.brand-shop { min-width: 0; max-width: min(34vw, 330px); overflow: hidden; color: inherit; text-overflow: ellipsis; white-space: nowrap; }
.topbar-actions { display: flex; align-items: center; gap: 12px; min-width: 0; }
.status-pill, .count-bubble { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; }
.status-pill { padding: 7px 13px; color: var(--accent-ink); background: var(--accent); font-size: .8rem; font-weight: 700; }
.status-pill.local-mode { border: 1px solid var(--line); color: var(--primary-dark); background: var(--surface-soft); }
.status-pill.has-pending { border: 1px solid #efcaca; color: var(--danger); background: #fff0f0; }
.sync-button-countdown { white-space: nowrap; font-variant-numeric: tabular-nums; }
.sync-button-icon { width: 16px; height: 16px; flex: 0 0 16px; }
.nav-link.sync-status-warning { color: var(--danger); }
.reservation-key { max-width: min(390px, 34vw); overflow: hidden; color: var(--primary-dark); font-size: .8rem; font-weight: 700; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.reservation-key strong { font-size: calc(.8rem + 4px); font-weight: 800; letter-spacing: .02em; }
.main-nav .nav-reservation-key { flex: 0 1 auto; margin-left: auto; }
.user-chips { display: flex; align-items: center; gap: 8px; min-width: 0; max-width: min(52vw, 650px); overflow-x: auto; padding: 3px 1px; scrollbar-width: thin; }
.user-chip { flex: 0 0 auto; max-width: 230px; overflow: hidden; padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; color: var(--primary-dark); background: var(--surface-soft); font-size: .78rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.user-chip.active { border-color: var(--primary-dark); color: white; background: var(--primary-dark); }
.user-chip:hover, .user-chip:focus-visible { color: var(--on-primary); background: var(--primary-dark); }
.topbar-actions .account-action { min-height: 40px; padding: 8px 13px; font-size: .78rem; }
.account-menu { position: relative; }
.account-menu-popup { position: absolute; z-index: 40; top: calc(100% + 2px); right: 0; display: grid; min-width: 190px; padding: 7px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); box-shadow: 0 14px 30px rgba(39, 66, 100, .18); opacity: 0; pointer-events: none; transform: translateY(-4px); transition: opacity .15s ease, transform .15s ease; }
.account-menu-popup::before { content: ''; position: absolute; top: -8px; right: 0; left: 0; height: 8px; }
.account-menu:hover .account-menu-popup, .account-menu:focus-within .account-menu-popup, .account-menu.open .account-menu-popup { opacity: 1; pointer-events: auto; transform: translateY(0); }
.account-menu-item { width: 100%; min-height: 38px; padding: 8px 10px; border: 0; border-radius: 9px; color: var(--primary-dark); background: transparent; font-size: .8rem; font-weight: 750; text-align: left; }
.account-menu-item:hover, .account-menu-item:focus-visible { background: var(--surface-soft); }
.account-menu-item.danger-menu-item { color: var(--danger); }
.account-menu-item.danger-menu-item:hover, .account-menu-item.danger-menu-item:focus-visible { background: #fff0f0; }
.icon-button { display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border: 1px solid var(--line); color: var(--ink); background: var(--surface); border-radius: 50%; }
.icon-button svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }

.main-nav { display: flex; align-items: center; gap: 9px; padding: 8px; background: var(--surface); border: 1px solid var(--line); border-radius: 17px; box-shadow: 0 5px 20px rgba(39, 66, 100, .03); }
.nav-link { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 9px 15px; border: 0; border-radius: 12px; color: var(--muted); background: transparent; font-size: .92rem; font-weight: 700; }
.nav-link:hover, .nav-link.active { color: var(--primary-dark); background: var(--selected); }
.admin-nav-menu { position: relative; flex: 0 0 auto; }
.admin-nav-menu > .nav-link { width: 100%; }
.admin-nav-chevron { margin-left: 1px; font-size: .78rem; }
.admin-nav-submenu { position: absolute; z-index: 130; top: calc(100% - 2px); left: 0; display: none; width: min(280px, calc(100vw - 40px)); padding: 7px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); box-shadow: 0 14px 30px rgba(39, 66, 100, .18); }
.admin-nav-menu.is-open .admin-nav-submenu { display: grid; gap: 4px; }
.admin-nav-submenu-item { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 42px; padding: 8px 10px; border: 0; border-radius: 9px; color: var(--ink); background: transparent; font-size: .82rem; font-weight: 700; text-align: left; }
.admin-nav-submenu-item:hover, .admin-nav-submenu-item:focus-visible, .admin-nav-submenu-item[aria-pressed="true"] { color: var(--primary-dark); background: var(--selected); }
.admin-nav-submenu-icon { flex: 0 0 22px; color: var(--primary); font-size: 1.1rem; line-height: 1; text-align: center; }
.main-nav.admin-nav-dropdown-open { overflow: visible; }
.nav-action { margin-left: auto; }
.nav-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 9px; margin-left: auto; }
.nav-cash-switcher { position: relative; cursor: pointer; }
.nav-cash-switcher select { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; opacity: 0; cursor: pointer; }
.nav-cash-switcher:focus-within { outline: 3px solid var(--focus); outline-offset: 2px; color: var(--primary-dark); background: var(--selected); }
.nav-link.sync-working { color: #087443; background: #dcfce7; }
.nav-link.sync-working:hover, .nav-link.sync-working:focus-visible { color: #065f36; background: #bbf7d0; }
.nav-link.sync-conflicts { color: #fff; background: var(--danger); }
.nav-link.sync-conflicts:hover, .nav-link.sync-conflicts:focus-visible { color: #fff; background: #953737; }
.nav-link.sync-conflicts .nav-icon { display: none; }
.nav-icon { font-size: 1.25rem; line-height: 1; }
section[id] { scroll-margin-top: var(--section-scroll-offset, 145px); }

.page-section { margin-top: 23px; }
.hero-section { display: grid; grid-template-columns: minmax(260px, .78fr) minmax(520px, 1.22fr); align-items: start; gap: 42px; }
.eyebrow { display: block; color: var(--primary); font-size: .75rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
h1 { max-width: 560px; margin: 10px 0 13px; font-size: clamp(2.25rem, 4vw, 4.25rem); line-height: .98; letter-spacing: -.07em; }
h2 { margin: 7px 0 0; font-size: clamp(1.35rem, 2vw, 1.8rem); letter-spacing: -.04em; }
h3 { margin-bottom: 7px; font-size: 1.03rem; }
.hero-copy p { max-width: none; margin-bottom: 0; color: var(--muted); font-size: .88rem; }
.hero-shop-branding { display: grid; justify-items: start; gap: 13px; }
.hero-shop-logo { display: block; width: auto; height: auto; max-width: min(100%, 720px); max-height: 300px; object-fit: contain; object-position: left center; }
.hero-shop-branding.has-tagline .hero-shop-logo { max-height: calc(300px - 36px); }
.hero-shop-tagline { margin: 0; color: var(--muted); font-size: .95rem; line-height: 1.35; }
.card { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.catalog-toolbar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; gap: 11px; padding: 18px; }
.catalog-toolbar .field-shop { grid-column: 1; grid-row: 1; }
.catalog-toolbar .catalog-filter-shelf { grid-column: 2; grid-row: 1; }
.catalog-toolbar .catalog-filter-seller { grid-column: 3; grid-row: 1; }
.catalog-toolbar .search-field { grid-column: 1 / span 2; grid-row: 2; }
.catalog-toolbar .primary-button { grid-column: 3; grid-row: 2; }
.catalog-toolbar.catalog-toolbar-global { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.catalog-toolbar.catalog-toolbar-global .field-shop { grid-column: 1; grid-row: 1; }
.catalog-toolbar.catalog-toolbar-global .catalog-filter-seller { grid-column: 2; grid-row: 1; }
.catalog-toolbar.catalog-toolbar-global .search-field { grid-column: 1; grid-row: 2; }
.catalog-toolbar.catalog-toolbar-global .primary-button { grid-column: 2; grid-row: 2; }
.catalog-toolbar > .field, .catalog-toolbar .search-field, .catalog-toolbar select, .catalog-toolbar .primary-button { min-width: 0; }
.catalog-toolbar select { width: 100%; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.field { display: grid; gap: 7px; color: var(--muted); font-size: .78rem; font-weight: 700; }
.catalog-shop-label { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; width: 100%; flex-wrap: wrap; }
.catalog-shop-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; flex-wrap: wrap; }
.catalog-shop-actions .text-button { padding: 0; font-size: .7rem; white-space: nowrap; }
.shop-link-banner { grid-column: 1 / -1; margin: 0; }
.catalog-connected-shop { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: .72rem; font-weight: 700; line-height: 1; white-space: nowrap; }
.catalog-connected-shop input[type="checkbox"] { width: 16px; height: 16px; min-width: 16px; margin: 0; padding: 0; accent-color: var(--primary); }
.catalog-search-help { color: var(--muted); font-size: calc(.78rem - 2px); font-weight: 500; }
.field input, .field select, .field textarea { width: 100%; border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; color: var(--ink); background: #fbfcfe; }
.catalog-multiselect { position: relative; min-width: 0; }
.catalog-multiselect-trigger { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); background: #fbfcfe; font-size: .84rem; font-weight: 600; text-align: left; }
.catalog-multiselect-trigger > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.catalog-multiselect-trigger:disabled { color: var(--muted); cursor: not-allowed; opacity: .78; }
.catalog-multiselect-chevron { flex: 0 0 auto; color: var(--muted); font-size: 1rem; line-height: 1; }
.catalog-multiselect-panel { position: absolute; z-index: 150; top: calc(100% + 5px); left: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 8px; width: 100%; max-height: 340px; padding: 9px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); box-shadow: 0 14px 34px rgba(39, 66, 100, .2); }
.catalog-multiselect-tools { display: grid; grid-template-columns: minmax(0, 1fr) 36px 36px; align-items: center; gap: 6px; }
.catalog-multiselect-search { width: 100%; min-width: 0; min-height: 36px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fbfcfe; font-size: .8rem; }
.catalog-filter-icon-button { display: grid; place-items: center; width: 36px; min-width: 36px; min-height: 36px; padding: 0; border: 1px solid var(--line); border-radius: 9px; color: var(--primary-dark); background: var(--surface-soft); font-size: 1.1rem; line-height: 1; }
.catalog-filter-icon-button:hover, .catalog-filter-icon-button:focus-visible { border-color: var(--primary); background: var(--selected); }
.catalog-multiselect-options { display: grid; align-content: start; gap: 2px; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.catalog-multiselect-option { display: flex; align-items: center; gap: 9px; min-width: 0; min-height: 36px; padding: 5px 7px; border-radius: 8px; color: var(--ink); cursor: pointer; font-size: .81rem; font-weight: 600; }
.catalog-multiselect-option:hover { background: var(--surface-soft); }
.catalog-multiselect-option input { flex: 0 0 16px; width: 16px; min-height: 16px; height: 16px; margin: 0; padding: 0; accent-color: var(--primary); }
.catalog-multiselect-option span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.catalog-multiselect-empty { padding: 10px 7px; color: var(--muted); font-size: .79rem; }
.catalog-connected-shop input[type="checkbox"] { border: 0; border-radius: 3px; background: transparent; }
.field textarea { resize: vertical; }
.input-with-icon { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); background: #fbfcfe; }
.input-with-icon input { min-height: 40px; padding: 0; border: 0; outline: 0; background: transparent; }
.primary-button, .secondary-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 10px 17px; border-radius: 13px; font-weight: 800; }
.primary-button { border: 1px solid var(--primary); color: white; background: var(--primary); box-shadow: 0 9px 18px rgba(50, 113, 216, .18); }
.primary-button:hover { background: var(--primary-dark); }
.secondary-button { border: 1px solid var(--line); color: var(--primary-dark); background: var(--surface-soft); }
.primary-button:disabled { cursor: not-allowed; opacity: .45; box-shadow: none; }
.full-width { width: 100%; }
.pos-close-payment-totals { display: grid; gap: 10px; }
.pos-close-payment-totals input[readonly] { color: var(--ink); background: var(--surface-soft); font-variant-numeric: tabular-nums; }
.text-button { padding: 5px; border: 0; color: var(--primary); background: transparent; font-size: .82rem; font-weight: 800; }
.user-switcher-dialog { width: min(440px, calc(100% - 30px)); }
.active-users-list { display: grid; gap: 8px; max-height: 360px; margin: 18px 0 13px; overflow-y: auto; }
.active-user-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-width: 0; padding: 11px 13px; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); background: var(--surface-soft); text-align: left; }
.active-user-row:hover, .active-user-row:focus-visible { border-color: var(--primary); background: var(--selected); }
.active-user-row.active { border-color: var(--primary-dark); color: white; background: var(--primary-dark); }
.active-user-row > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.active-user-row small { flex: 0 0 auto; color: var(--muted); font-size: .72rem; font-weight: 700; }
.active-user-row.active small { color: #dce9ff; }
.active-users-empty { padding: 12px; border: 1px dashed var(--line); border-radius: 10px; color: var(--muted); font-size: .82rem; }
.user-switcher-actions { display: grid; gap: 9px; }

.content-layout { display: grid; grid-template-columns: minmax(0, 1fr) 355px; align-items: start; gap: 32px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.muted-text { color: var(--muted); font-size: .86rem; }
.notice { margin-bottom: 14px; padding: 12px 14px; border-radius: 13px; color: #73551a; background: var(--warning); font-size: .9rem; }
.notice.error, .form-message.error { color: var(--danger); background: #fff0f0; }
.hidden { display: none !important; }
.product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.product-card { display: flex; min-height: 250px; flex-direction: column; gap: 12px; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.product-visual { display: flex; align-items: center; justify-content: center; gap: 4px; height: 92px; border-radius: 15px; color: var(--primary); background: linear-gradient(140deg, #eef5ff, #f7fbff); font-size: 2.4rem; overflow: hidden; }
.product-visual-button { width: 100%; padding: 0; border: 0; cursor: pointer; }
.product-visual-button:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.product-thumbnail { position: relative; display: block; flex: 0 0 90px; width: 90px; height: 90px; overflow: hidden; border-radius: 10px; background: white; }
.product-thumbnail img { display: block; width: 100%; height: 100%; object-fit: cover; }
.product-thumbnail-more strong { position: absolute; inset: 0; display: grid; place-items: center; color: white; background: rgba(20, 48, 91, .58); font-size: 1.5rem; }
.product-placeholder { display: grid; place-items: center; width: 90px; height: 90px; }
.product-detail-dialog { width: min(540px, calc(100% - 30px)); }
.product-detail-gallery { display: grid; grid-template-columns: 38px minmax(0, 1fr) 38px; grid-template-areas: 'previous frame next'; align-items: center; gap: 8px; min-height: 360px; margin-bottom: 16px; padding: 8px; border-radius: 16px; background: linear-gradient(140deg, #eef5ff, #f7fbff); }
.product-detail-gallery-frame { position: relative; display: grid; grid-area: frame; width: 100%; aspect-ratio: 1 / 1; min-height: 0; place-items: center; min-width: 0; }
.product-detail-gallery img { display: block; width: min(100%, 420px); height: auto; aspect-ratio: 1 / 1; object-fit: contain; border-radius: 10px; background: white; }
.product-detail-gallery-nav:first-child { grid-area: previous; }
.product-detail-gallery-nav:last-child { grid-area: next; }
.product-detail-gallery-nav { display: grid; place-items: center; width: 36px; height: 36px; min-height: 36px; padding: 0; border: 1px solid var(--line); border-radius: 50%; color: var(--primary-dark); background: var(--surface); font-size: 1.7rem; line-height: 1; }
.product-detail-gallery-nav:disabled { cursor: default; opacity: .35; }
.product-detail-image-counter { position: absolute; right: 8px; bottom: 8px; padding: 4px 8px; border-radius: 999px; color: var(--primary-dark); background: rgba(255, 255, 255, .9); font-size: .72rem; font-weight: 800; }
.product-detail-attributes { margin: 14px 0; }
.product-attributes-table { width: 100%; border-collapse: collapse; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.product-attributes-table th, .product-attributes-table td { width: 33.333%; padding: 9px 11px; border-bottom: 1px solid var(--line); text-align: left; font-size: .82rem; }
.product-attributes-table thead th { color: var(--primary-dark); background: var(--surface-soft); font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; }
.product-attributes-table tbody tr:last-child td, .product-attributes-table tbody tr:last-child th { border-bottom: 0; }
.product-attribute-value { display: inline-flex; align-items: center; gap: 7px; }
.product-attribute-stock-icon { display: inline-grid; flex: 0 0 17px; width: 17px; height: 17px; place-items: center; border-radius: 50%; color: white; font-size: .73rem; font-weight: 900; line-height: 1; }
.product-attribute-stock-icon.has-stock { background: #16834d; }
.product-attribute-stock-icon.no-stock { background: #c43e46; }
.product-attribute-heading th { color: var(--ink); background: #f8fbff; }
.product-options-dialog { width: min(540px, calc(100% - 30px)); overflow: visible; }
.product-options-list { display: grid; gap: 13px; max-height: 420px; overflow-y: auto; }
.product-option-group { margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: 13px; }
.product-option-group legend { padding: 0 5px; color: var(--muted); font-size: .78rem; font-weight: 800; }
.product-option-picker { position: relative; }
.product-option-picker-button { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); background: #fbfcfe; font-size: .82rem; font-weight: 700; text-align: left; }
.product-option-picker-button:hover { border-color: var(--primary); }
.product-option-menu { position: fixed; z-index: 1000; top: 0; left: 0; display: grid; gap: 8px; max-width: calc(100vw - 24px); max-height: 280px; padding: 9px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); box-shadow: 0 18px 40px rgba(39, 66, 100, .2); }
.product-option-search { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fbfcfe; }
.product-option-values { display: grid; gap: 5px; max-height: 210px; overflow-y: auto; }
.product-option { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-width: 0; padding: 8px 9px; border-radius: 9px; color: var(--ink); background: var(--surface-soft); font-size: .82rem; cursor: pointer; }
.product-option:hover { background: var(--selected); }
.product-option-main { display: flex; align-items: center; gap: 9px; min-width: 0; }
.product-option-main > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.product-option input { flex: 0 0 auto; width: 16px; min-height: 16px; height: 16px; margin: 0; accent-color: var(--primary); }
.product-option-availability { flex: 0 0 auto; color: var(--primary-dark); font-size: .76rem; white-space: nowrap; }
.product-option-unavailable { color: var(--muted); cursor: not-allowed; opacity: .62; }
.product-option-unavailable:hover { background: var(--surface-soft); }
.product-option-empty { padding: 8px 9px; color: var(--muted); font-size: .8rem; }
.product-availability-trigger { display: inline-block; border-bottom: 1px dotted currentColor; cursor: help; }
.product-availability-trigger:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; border-radius: 3px; }
.availability-hover-popup { position: fixed; z-index: 1100; display: grid; gap: 9px; width: min(320px, calc(100vw - 24px)); max-height: min(360px, calc(100vh - 24px)); overflow-y: auto; padding: 12px; border: 1px solid var(--line); border-radius: 13px; color: var(--ink); background: var(--surface); box-shadow: 0 18px 40px rgba(39, 66, 100, .2); }
.availability-hover-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-bottom: 2px; }
.availability-hover-heading strong { color: var(--primary-dark); font-size: .82rem; }
.availability-hover-heading span { color: var(--muted); font-size: .76rem; font-weight: 700; white-space: nowrap; }
.availability-hover-group { display: grid; gap: 5px; margin: 0; padding-top: 8px; border-top: 1px solid var(--line); }
.availability-hover-group > strong { color: var(--muted); font-size: .76rem; }
.availability-hover-values { display: grid; gap: 4px; }
.availability-hover-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-width: 0; padding: 7px 8px; border-radius: 8px; background: var(--surface-soft); font-size: .78rem; }
.availability-hover-row span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.availability-hover-row strong { flex: 0 0 auto; color: var(--primary-dark); font-size: .74rem; white-space: nowrap; }
.product-option-availability-hover { z-index: 1400; width: min(270px, calc(100vw - 24px)); pointer-events: none; }
.product-detail-attribute { padding: 9px 11px; border-radius: 10px; background: var(--surface-soft); }
.product-detail-attribute strong, .product-detail-attribute span { display: block; }
.product-detail-attribute span { margin-top: 3px; color: var(--muted); font-size: .82rem; }
.product-detail-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.product-detail-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 4px; }
.product-detail-footer strong { font-size: 1.25rem; }
.product-detail-summary { display: grid; gap: 2px; }
.product-image-preview { display: grid; justify-items: start; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.product-image-preview-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; width: 100%; }
.product-image-preview-item { position: relative; min-width: 0; }
.product-image-preview-grid img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 10px; background: white; }
.product-image-preview-remove { position: absolute; top: 4px; right: 4px; width: 28px; min-height: 28px; height: 28px; border-radius: 8px; }
.product-card h3 { margin: 0; font-size: 1rem; }
.product-description { min-height: 40px; margin: 0; color: var(--muted); font-size: .81rem; }
.product-description,
body[data-public-catalog] #product-grid .product-card:not(.public-product-detail) > h2 + p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; overflow-wrap: anywhere; }
/* Public storefront listings contain products from the current shop only. */
body[data-public-catalog] #product-grid .product-card:not(.public-product-detail) > .product-meta > a:first-child { display: none; }
.product-meta { display: flex; flex-wrap: wrap; gap: 5px; min-height: 23px; }
.tag { padding: 4px 7px; border-radius: 8px; color: var(--muted); background: var(--surface-soft); font-size: .7rem; }
.product-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; }
.price { font-size: 1.05rem; font-weight: 850; }
.add-button { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 13px; color: white; background: var(--primary); font-size: 1.4rem; }
.add-button:disabled { opacity: .38; cursor: not-allowed; }
.empty-catalog, .empty-state { padding: 42px 20px; text-align: center; color: var(--muted); }
.empty-icon { display: block; margin-bottom: 8px; font-size: 2.25rem; }

.basket-panel { position: sticky; top: 130px; padding: 21px; }
.basket-heading { display: flex; justify-content: space-between; align-items: start; gap: 10px; }
.count-bubble { width: 25px; height: 25px; margin-left: 4px; color: var(--primary-dark); background: #e6effe; font-size: .78rem; vertical-align: 3px; }
.basket-items { display: grid; gap: 11px; max-height: 350px; margin: 18px 0; overflow: auto; }
.basket-item { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.basket-item-name { font-size: .88rem; font-weight: 750; }
.basket-item-price { color: var(--muted); font-size: .78rem; }
.basket-item-options { margin-top: 4px; color: var(--primary-dark); font-size: .72rem; }
.quantity-control { display: flex; align-items: center; gap: 7px; }
.quantity-control button { display: grid; place-items: center; width: 30px; height: 30px; min-height: 30px; padding: 0; border: 1px solid var(--line); border-radius: 9px; color: var(--primary-dark); background: white; }
.basket-summary { display: grid; gap: 5px; padding: 14px 0; border-top: 1px solid var(--line); }
.basket-summary > div { display: flex; justify-content: space-between; font-size: .9rem; }
.basket-summary strong { font-size: 1.15rem; }
.basket-summary small { color: var(--muted); font-size: .72rem; }
.basket-panel .secondary-button { margin-top: 10px; }

.info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.info-card { padding: 23px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.info-card { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 12px; align-content: start; }
.info-card p { margin-bottom: 0; color: var(--muted); font-size: .88rem; }
.large-icon { display: block; margin-bottom: 17px; color: var(--primary); font-size: 2rem; font-weight: 800; }
.info-card .large-icon, .info-card h3 { align-self: center; margin: 0; }
.info-card p { grid-column: 1 / -1; margin-top: 10px; }
.staff-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; margin-top: 15px; }
.staff-tool { padding: 21px; }
.staff-tool-heading { display: flex; align-items: start; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.staff-tool-heading h3 { margin: 8px 0 0; }
.reservation-contact-button { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 9px; min-height: 42px; padding: 8px 11px 8px 14px; border: 1px solid #f0c477; border-radius: 12px; color: #724600; background: #fff4d9; font-weight: 800; }
.reservation-contact-button:hover, .reservation-contact-button:focus-visible { color: #5d3900; background: #ffe8b0; }
.reservation-contact-count { display: grid; min-width: 24px; height: 24px; place-items: center; padding: 0 6px; border-radius: 999px; color: white; background: #bd6b00; font-size: .75rem; }
.reservation-queue { display: grid; gap: 8px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.reservation-queue-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px; }
.reservation-queue-heading strong { color: var(--primary-dark); font-size: .84rem; }
.reservation-queue-heading span { color: var(--muted); font-size: .72rem; }
.reservation-queue-list { display: grid; gap: 7px; max-height: 270px; overflow-y: auto; }
.reservation-queue-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-width: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: var(--surface-soft); text-align: left; }
.reservation-queue-row:hover, .reservation-queue-row:focus-within { border-color: var(--primary); background: var(--selected); }
.reservation-queue-row.selected { border-color: var(--primary); box-shadow: inset 3px 0 var(--primary); }
.reservation-queue-select { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex: 1; min-width: 0; padding: 0; border: 0; color: inherit; background: transparent; text-align: left; }
.reservation-queue-select:hover, .reservation-queue-select:focus-visible { color: inherit; background: transparent; }
.reservation-queue-main, .reservation-queue-side { display: grid; gap: 3px; min-width: 0; }
.reservation-queue-main { flex: 1; }
.reservation-queue-side { flex: 0 0 auto; justify-items: end; text-align: right; }
.reservation-queue-row strong { overflow: hidden; color: var(--primary-dark); font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.reservation-queue-row small { overflow: hidden; color: var(--muted); font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.reservation-queue-actions { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; gap: 6px; }
.reservation-queue-actions .reservation-countdown { color: var(--primary-dark); font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
.reservation-queue-actions .reservation-countdown.expired { color: var(--danger); }
.reservation-prolong-button { min-height: 34px; padding: 7px 10px; font-size: .74rem; white-space: nowrap; }
.reservation-status-message { padding: 8px 10px; border-radius: 9px; color: var(--primary-dark); background: #eef4ff; font-size: .76rem; line-height: 1.35; }
.buyer-reservations { display: grid; gap: 12px; margin-bottom: 16px; padding: 18px; }
.buyer-reservations-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.buyer-reservations-heading h3 { margin: 0 0 3px; }
.buyer-reservations-heading p { margin: 0; font-size: .78rem; }
.buyer-reservation-list { display: grid; gap: 9px; }
.buyer-reservation-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 8px 18px; padding: 13px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }
.buyer-reservation-main { display: grid; gap: 4px; min-width: 0; }
.buyer-reservation-main strong { overflow: hidden; color: var(--ink); font-size: .9rem; text-overflow: ellipsis; white-space: nowrap; }
.buyer-reservation-main small, .buyer-reservation-meta { color: var(--muted); font-size: .75rem; }
.buyer-reservation-status { align-self: start; padding: 4px 9px; border-radius: 999px; color: var(--primary-dark); background: #e4efff; font-size: .72rem; font-weight: 800; white-space: nowrap; }
.buyer-reservation-status.status-expired, .buyer-reservation-status.status-cancelled { color: var(--danger); background: #fff0f0; }
.buyer-reservation-contact { display: grid; gap: 3px; color: var(--muted); font-size: .75rem; }
.buyer-reservation-countdown { color: var(--primary-dark); font-size: .86rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.buyer-reservation-countdown.expired { color: var(--danger); }
.buyer-reservation-update { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: .76rem; line-height: 1.4; }
.buyer-reservation-meta { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 5px 14px; }
.reservation-queue-empty { padding: 10px 12px; border: 1px dashed var(--line); border-radius: 10px; color: var(--muted); font-size: .78rem; }
.reservation-queue-empty.error { color: var(--danger); }
.reservation-picking-context { overflow-wrap: anywhere; color: var(--muted); font-size: .76rem; }
.reservation-picking-progress { margin: 12px 0; color: var(--primary-dark); font-size: .84rem; font-weight: 700; }
.reservation-picking-progress:empty, .reservation-picking-context:empty { display: none; }
.reservation-picking-list { display: grid; gap: 8px; max-height: 350px; overflow-y: auto; }
.reservation-picking-row { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-soft); }
label.reservation-picking-row { cursor: pointer; }
.reservation-picking-row input { flex: 0 0 20px; width: 20px; height: 20px; margin: 0; accent-color: var(--primary); }
.reservation-picking-row:focus-within { outline: 2px solid var(--primary); outline-offset: -2px; }
.reservation-picking-product { display: grid; flex: 1; gap: 4px; min-width: 0; overflow-wrap: anywhere; }
.reservation-picking-product strong { font-size: .88rem; }
.reservation-picking-product span, .reservation-picking-product small { color: var(--muted); font-size: .78rem; }
.reservation-picking-status { flex: 0 0 auto; color: var(--muted); font-size: .72rem; }
.reservation-picking-row.picked { border-color: #a2cfb6; background: #f0faf4; }
.reservation-picking-row.picked .reservation-picking-status { color: #28734d; font-weight: 700; }
.seller-report-tool { margin-bottom: 15px; }
.seller-report-tool .report-heading { margin-bottom: 0; }
.report-heading { display: flex; align-items: start; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.report-heading h3 { margin-bottom: 0; }
.report-heading .muted-text { margin: 7px 0 0; }
.report-kpis { display: grid; grid-template-columns: repeat(2, minmax(112px, 1fr)); gap: 8px; min-width: min(100%, 270px); }
.dialog.report-dialog { width: min(1380px, calc(100% - 30px)); }
.report-dialog .dialog-card { max-height: min(900px, calc(100dvh - 30px)); }
.report-overview-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); min-width: 0; }
.report-overview-kpis:not(.has-referral-commission) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.report-missed-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; margin-top: 8px; }
.report-kpi { display: grid; gap: 3px; min-width: 0; padding: 8px 10px; border-radius: 11px; background: var(--surface-soft); }
.report-kpi span { overflow: hidden; color: var(--muted); font-size: .68rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.report-kpi strong { color: var(--primary-dark); font-size: 1.2rem; line-height: 1.1; white-space: nowrap; }
.inline-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) auto; align-items: end; gap: 10px; }
.report-form { display: grid; gap: 10px; }
.report-form-row { display: grid; align-items: end; gap: 10px; }
.report-shop-seller-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.report-date-row { grid-template-columns: repeat(2, minmax(0, 1fr)) auto; }
.report-date-row button { min-width: 160px; }
.report-quick-ranges { display: flex; flex-wrap: nowrap; gap: 7px; overflow-x: auto; padding-bottom: 4px; }
.report-range-button { flex: 0 0 auto; min-height: 36px; padding: 7px 11px; font-size: .76rem; white-space: nowrap; }
.report-range-button[aria-pressed="true"] { border-color: var(--primary); color: var(--primary-dark); background: #eaf1ff; }
.form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.report-filter { min-width: 145px; }
.report-output { display: grid; gap: 11px; margin-top: 17px; color: var(--muted); font-size: .84rem; }
.report-missed-section { display: grid; gap: 9px; padding-top: 14px; border-top: 1px solid var(--line); }
.report-missed-section h3 { margin: 0; font-size: .9rem; color: var(--ink); }
.report-history-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.report-history-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; min-width: 0; }
#report-chart-scope-label { font-size: 11px; overflow-wrap: anywhere; }
.report-history-toolbar .report-quick-ranges { margin: 0; }
.report-history-toolbar .report-legend { flex-wrap: wrap; white-space: normal; }
.report-history-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.report-history-card { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 13px; background: #fbfcfe; }
.report-history-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.report-history-heading h3 { margin: 0; font-size: .85rem; }
.report-legend { display: inline-flex; align-items: center; gap: 4px; color: var(--muted); font-size: .64rem; white-space: nowrap; }
.report-legend i { display: inline-block; width: 7px; height: 7px; margin-left: 5px; border-radius: 50%; }
.report-legend i:first-child { margin-left: 0; }
.report-legend-sales { background: var(--primary); }
.report-legend-payout { background: #54a77a; }
.report-legend-added { background: #54a77a; }
.report-legend-expired { background: #e79536; }
.report-chart-bar.added { background: #54a77a; }
.report-chart-bar.expired { background: #e79536; }
.report-chart { display: flex; align-items: stretch; gap: 4px; min-height: 103px; padding: 4px 2px 0; }
.report-chart-point { display: grid; flex: 1 1 0; grid-template-rows: 1fr auto; gap: 6px; min-width: 0; }
.report-chart-bars { display: flex; align-items: end; justify-content: center; gap: 3px; height: 75px; border-bottom: 1px solid var(--line); }
.report-chart-bar { display: block; width: min(22px, 30%); border-radius: 4px 4px 0 0; }
.report-chart-bar.sales { background: var(--primary); }
.report-chart-bar.payout { background: #54a77a; }
.report-chart-label { overflow: hidden; color: var(--muted); font-size: .63rem; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.report-chart-empty { display: grid; width: 100%; place-items: center; min-height: 120px; color: var(--muted); font-size: .78rem; }
.reservation-queue-actions .danger-button { min-height: 30px; padding: 5px 9px; font-size: .73rem; }
.report-table-scroll { max-height: 328px; overflow: auto; border: 1px solid var(--line); border-radius: 10px; }
.report-table-scroll table { min-width: 430px; }
.report-table-scroll thead { position: sticky; top: 0; z-index: 1; background: var(--surface); }
.report-table-scroll th, .report-table-scroll td { background: inherit; }
.report-missed-section td small { display: block; margin-top: 3px; color: var(--muted); font-size: .7rem; white-space: normal; }
.report-error { padding: 10px 12px; border-radius: 9px; color: var(--danger); background: #fff0f0; }
.accounting-summary { padding: 9px 11px; border-radius: 10px; background: var(--surface-soft); }
.table-scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; white-space: nowrap; }
th, td { padding: 8px 7px; border-bottom: 1px solid var(--line); text-align: left; }
th { color: var(--ink); font-size: .73rem; }
.admin-console { margin-top: 26px; }
.admin-console-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 15px; }
.admin-console-heading h3 { margin: 7px 0 0; font-size: 1.35rem; letter-spacing: -.035em; }
.admin-console-heading p { max-width: 430px; margin: 0; text-align: right; }
.admin-console-header-actions { display: grid; justify-items: end; gap: 10px; }
.dialog.cash-report-dialog { width: min(1320px, calc(100% - 30px)); }
.dialog.cash-report-detail-dialog { width: min(920px, calc(100% - 30px)); }
.dialog.sync-conflicts-dialog { width: min(1000px, calc(100% - 30px)); }
.sync-conflict-context { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; font-size: .83rem; }
.sync-conflict-context small { color: var(--muted); overflow-wrap: anywhere; }
.sync-conflict-comparison { overflow-x: auto; margin-block: 12px; border: 1px solid var(--line); border-radius: 10px; }
.sync-conflict-comparison table { table-layout: fixed; min-width: 560px; white-space: normal; }
.sync-conflict-comparison th, .sync-conflict-comparison td { width: 35%; overflow-wrap: anywhere; vertical-align: top; }
.sync-conflict-comparison th:first-child, .sync-conflict-comparison td:first-child { width: 30%; }
.sync-conflict-comparison td.changed { background: #fff6e8; color: var(--ink); }
.sync-conflict-actions { margin-top: 16px; }
.cash-report-filters { display: grid; grid-template-columns: 1fr 1fr 1.4fr 1fr auto; align-items: end; gap: 10px; margin: 20px 0 12px; }
.cash-report-output { overflow-x: auto; }
.cash-report-table { width: 100%; min-width: 880px; border-collapse: collapse; }
.cash-report-table th, .cash-report-table td { padding: 10px; border-bottom: 1px solid var(--line); text-align: left; font-size: .79rem; }
.cash-report-table th { color: var(--muted); font-size: .73rem; }
.cash-report-table small { display: block; margin-top: 4px; color: var(--muted); }
.cash-report-state { display: inline-block; border-radius: 8px; padding: 4px 7px; color: var(--primary-dark); background: #eef4ff; white-space: nowrap; }
.cash-report-state.closed { color: #286145; background: #eaf6ef; }
.cash-report-pagination { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 18px; font-size: .8rem; }
.cash-report-context { padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); line-height: 1.7; }
.cash-report-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 18px 0; }
.cash-report-detail-card { padding: 15px; border: 1px solid var(--line); border-radius: 12px; }
.cash-report-detail-card h3 { margin: 0 0 12px; font-size: 1rem; }
.cash-report-values { display: grid; gap: 0; margin: 0; }
.cash-report-values > div { display: flex; justify-content: space-between; align-items: baseline; gap: 15px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.cash-report-values dt { color: var(--muted); font-size: .8rem; }
.cash-report-values dd { margin: 0; font-weight: 800; font-size: .88rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.cash-report-values .cash-report-total dt, .cash-report-values .cash-report-total dd { color: var(--ink); font-weight: 800; }
.cash-report-difference { margin: 8px 0; padding: 12px; border-radius: 10px; color: #286145; background: #eaf6ef; }
.cash-report-difference.has-difference { color: var(--danger); background: #fff2f2; }
.cash-report-warning { margin: 12px 0; padding: 12px; border: 1px solid #f1d8a8; border-radius: 10px; background: var(--warning); color: #73551a; font-size: .82rem; }
@media (max-width: 700px) {
  .admin-console-header-actions { justify-items: start; margin-top: 10px; }
  .cash-report-filters { grid-template-columns: 1fr 1fr; }
  .cash-report-detail-grid { grid-template-columns: 1fr; }
  .cash-report-values > div { flex-wrap: wrap; gap: 5px 10px; }
}
.admin-console-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.staff-tools, .admin-console-grid, .seller-tools-grid { align-items: start; }
.admin-workspace { grid-column: 1 / -1; min-width: 0; }
.admin-workspace-menu { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 15px; }
.admin-workspace-tab { display: flex; align-items: center; gap: 11px; min-width: 0; min-height: 76px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 17px; color: var(--ink); background: var(--surface); box-shadow: var(--shadow); text-align: left; }
.admin-workspace-tab:hover, .admin-workspace-tab:focus-visible, .admin-workspace-tab[aria-selected="true"] { border-color: var(--primary); color: var(--primary-dark); background: var(--selected); }
.admin-workspace-icon { flex: 0 0 auto; color: var(--primary); font-size: 1.35rem; line-height: 1; }
.admin-workspace-tab-label { display: grid; gap: 3px; min-width: 0; }
.admin-workspace-tab-label .eyebrow { overflow: hidden; font-size: .58rem; text-overflow: ellipsis; white-space: nowrap; }
.admin-workspace-tab-label strong { overflow-wrap: anywhere; font-size: .83rem; line-height: 1.2; }
.admin-workspace-content { min-width: 0; }
.admin-workspace-panel { width: 100%; min-width: 0; }
.admin-workspace-panel[hidden] { display: none !important; }
@media (max-width: 1000px) {
  .admin-workspace-menu { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.management-panel { min-width: 0; }
.management-panel-heading { display: flex; align-items: center; gap: 12px; }
.management-panel-heading:has(> .management-panel-toggle) { cursor: pointer; }
.management-panel-heading > .large-icon { flex: 0 0 auto; margin: 0; font-size: 1.65rem; }
.management-panel-label { flex: 1; min-width: 0; }
.management-panel-label h3 { margin: 4px 0 0; overflow-wrap: anywhere; }
.management-panel-label .eyebrow { font-size: .65rem; }
.management-panel-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; flex: 0 0 auto; min-height: 38px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); color: var(--primary-dark); font-size: .72rem; font-weight: 700; }
.management-panel-toggle:hover { border-color: var(--primary); background: var(--selected); }
.management-panel-chevron { display: block; width: 8px; height: 8px; margin: -3px 3px 0; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); }
.management-panel-toggle[aria-expanded="true"] .management-panel-chevron { margin-top: 3px; transform: rotate(225deg); }
.management-panel-body { min-width: 0; margin-top: 16px; }
.management-panel-body[hidden] { display: none !important; }
.admin-console-card > .management-panel-body { display: flex; flex: 1; flex-direction: column; }
.admin-console-card > .management-panel-body > .admin-form { display: flex; flex: 1; flex-direction: column; }
.admin-console-card > .management-panel-body > .admin-form > .primary-button, .admin-console-card > .management-panel-body > .admin-form > .admin-form-actions { margin-top: auto; }
.management-panel-body .staff-tool-heading:has(> div:empty) { justify-content: flex-end; }
.management-panel-body .stock-filter-heading { margin-bottom: 13px; }
@media (max-width: 700px) {
  .admin-workspace-menu { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .admin-workspace-tab { min-height: 66px; padding: 10px; }
  .management-panel-heading { gap: 8px; }
  .management-panel-toggle-label { display: none; }
  .management-panel-toggle { min-width: 38px; }
}
.admin-console-card { display: flex; flex-direction: column; padding: 22px; }
.admin-stock-approval-card, .admin-purchase-order-card { grid-column: 1 / -1; }
.admin-console-card-heading { display: flex; align-items: center; gap: 12px; }
.admin-console-card-heading .large-icon { margin: 0; font-size: 1.65rem; }
.admin-console-card-heading h3 { margin: 5px 0 0; }
.shop-finance-card { margin-top: 0; }
.shop-finance-card > .field { max-width: 520px; }
.shop-finance-grid { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.5fr); gap: 20px; margin-top: 8px; }
.shop-finance-section { min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.shop-finance-section h4 { margin: 0 0 12px; font-size: 1rem; }
.shop-banned-phone-list { display: grid; gap: 8px; margin-top: 14px; }
.shop-banned-phone-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
.shop-banned-phone-row > div { display: grid; gap: 3px; min-width: 0; }
.shop-banned-phone-row strong { overflow-wrap: anywhere; }
.shop-banned-phone-row small { color: var(--muted); }
.shop-finance-inline-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; gap: 10px; margin: 13px 0; padding: 12px; border-radius: 10px; background: var(--surface); }
.shop-finance-inline-form .field { min-width: 0; }
.shop-finance-inline-form button { min-height: 42px; }
.shop-finance-report-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; gap: 10px; margin: 16px 0 10px; }
.shop-finance-report-form .opening-hours-toggle { align-self: center; }
.shop-financial-report { display: grid; gap: 7px; margin-top: 10px; }
.shop-financial-row { display: grid; grid-template-columns: minmax(0, 1fr) repeat(2, minmax(95px, auto)); gap: 12px; align-items: center; padding: 9px 11px; border-radius: 9px; background: var(--surface-soft); font-size: .83rem; }
.shop-financial-row.shop-financial-budget-only { grid-template-columns: minmax(0, 1fr) minmax(95px, auto); }
.shop-financial-row strong { text-align: right; }
.shop-financial-head { color: var(--muted); font-size: .75rem; font-weight: 700; }
.shop-financial-total { border-top: 1px solid var(--line); background: var(--surface); font-weight: 700; }
.shop-cost-list { display: grid; gap: 6px; margin-top: 14px; }
.shop-cost-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 8px 10px; border-radius: 8px; background: var(--surface); font-size: .8rem; }
.shop-cost-row small { display: block; color: var(--muted); }
.shop-history-details { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.shop-history-details > summary { color: var(--primary-dark); font-weight: 700; cursor: pointer; }
.shop-history-list { display: grid; gap: 8px; margin: 12px 0; }
.shop-history-entry { padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-soft); }
.shop-history-entry > strong, .shop-history-entry > small { display: block; }
.shop-history-entry > small { margin-top: 3px; color: var(--muted); }
.shop-history-entry pre { max-height: 180px; overflow: auto; margin: 7px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; font: .74rem/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; }
.field-help { min-height: 39px; margin: 13px 0 17px; color: var(--muted); font-size: .84rem; }
.admin-form { display: grid; gap: 13px; }
.product-section-menu { display: flex; gap: 6px; min-width: 0; max-width: 100%; overflow-x: auto; padding: 3px 2px 9px; border-bottom: 1px solid var(--line); }
.product-section-tab { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; min-height: 44px; padding: 9px 14px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--muted); font: inherit; font-size: .82rem; font-weight: 650; white-space: nowrap; }
.product-section-tab:hover, .product-section-tab[aria-selected="true"] { color: var(--primary-dark); border-color: var(--line); background: var(--surface-soft); }
.product-section-tab:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
.product-section-panel { display: grid; align-content: start; gap: 13px; min-width: 0; }
.product-section-panel[hidden] { display: none !important; }
.form-grid { display: grid; gap: 11px; }
.two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.admin-item-shop-seller:has(#admin-item-seller-field.hidden) { grid-template-columns: minmax(0, 1fr); }
.three-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.admin-user-assignment { align-items: start; }
.admin-user-assignment:has(#admin-user-system-mode-field.hidden) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.admin-user-assignment > .field { align-content: start; }
.admin-user-assignment select { height: 44px; min-height: 44px; }
.admin-user-identity { align-items: start; }
.admin-user-identity > .field { align-content: start; }
.admin-user-identity input { height: 44px; min-height: 44px; }
.admin-user-identity:has(#admin-user-catalog-alias-field.hidden) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#admin-item-fixed-fields.calculated { grid-template-columns: minmax(0, 1fr); }
#admin-item-fixed-fields.production-only { grid-template-columns: minmax(0, 1fr); }
.product-use-field { align-content: start; }
.product-use-switch { display: flex; align-items: center; gap: 9px; min-height: 43px; color: var(--ink); font-size: .82rem; font-weight: 650; cursor: pointer; }
.product-use-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.product-use-switch-track { position: relative; flex: 0 0 40px; width: 40px; height: 23px; border-radius: 20px; background: #a7b5cc; transition: background .15s; }
.product-use-switch-track::after { content: ''; position: absolute; top: 3px; left: 3px; width: 17px; height: 17px; border-radius: 50%; background: white; transition: transform .15s; }
.product-use-switch input:checked + .product-use-switch-track { background: var(--primary); }
.product-use-switch input:checked + .product-use-switch-track::after { transform: translateX(17px); }
.product-use-switch input:focus-visible + .product-use-switch-track { outline: 3px solid var(--focus); outline-offset: 2px; }
.admin-user-credentials { align-items: start; }
.admin-user-credentials > .field { align-self: start; }
.admin-user-credentials input, .admin-user-credentials select { height: 44px; min-height: 44px; }
.admin-user-welcome-status { color: #3474d9; min-height: 1.2em; }
.welcome-password-identity, .welcome-password-shop { display: grid; gap: 4px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: #f3f7fd; color: var(--muted); font-size: .78rem; }
.welcome-password-identity strong, .welcome-password-shop strong { color: var(--ink); font-size: .92rem; }
.field small { color: var(--muted); font-size: .72rem; font-weight: 500; }
.field select[multiple] { min-height: 104px; padding-block: 7px; }
.admin-form .form-message { min-height: 0; }
.admin-form .primary-button { justify-self: start; }
.admin-console-card > .admin-form { display: flex; flex: 1; flex-direction: column; }
.admin-console-card > .admin-form > .primary-button, .admin-console-card > .admin-form > .admin-form-actions { margin-top: auto; }
.admin-form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.admin-list-button { margin: 0; }
.attribute-editor { display: grid; gap: 11px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.pricing-editor { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.item-components { display: grid; gap: 9px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.item-components > .field-help { margin: 0; }
.item-components-editor, .item-components-list { display: grid; gap: 9px; }
.item-component-row { display: grid; grid-template-columns: minmax(180px, 1.7fr) minmax(110px, .7fr) minmax(120px, .8fr) auto; align-items: end; gap: 9px; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.item-component-row .field { margin: 0; }
.item-component-attributes { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 9px; padding-top: 3px; }
.item-component-cost { padding: 10px 0; color: var(--muted); font-size: .78rem; font-weight: 700; }
.item-component-row button { min-height: 40px; padding: 7px 10px; }
.item-components .pricing-preview { margin: 0; }
@media (max-width: 760px) { .item-component-row { grid-template-columns: 1fr 1fr; } .item-component-row .item-component-product { grid-column: 1 / -1; } .item-component-row .item-component-cost { grid-column: 1 / 2; } .item-component-attributes { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; } }
.pricing-rules { display: grid; gap: 10px; max-height: 360px; overflow-y: auto; }
.pricing-rules:has([data-cost-shelf-menu]:not(.hidden)) { max-height: none; overflow: visible; }
.pricing-rule { display: grid; gap: 9px; padding: 11px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pricing-rule-toggle { margin: 0; }
.pricing-value-rules { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.pricing-value-rule { gap: 5px; }
.pricing-value-rule input { min-height: 38px; }
.pricing-unit-list, .pricing-modifier-group { display: grid; gap: 8px; }
.pricing-unit-row { display: grid; grid-template-columns: minmax(90px, .7fr) repeat(2, minmax(110px, 1fr)) minmax(110px, .8fr); align-items: end; gap: 8px; padding: 10px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
.pricing-cost-row { grid-template-columns: minmax(90px, .7fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(135px, .8fr); }
.pricing-cost-shelf-field { min-width: 0; }
.pricing-cost-shelf-field .attribute-multiselect-button { min-height: 38px; }
.pricing-attribute-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pricing-unit-row > strong, .pricing-modifier-group > strong { align-self: center; color: var(--ink); font-size: .82rem; }
.pricing-unit-row .field { gap: 4px; }
.pricing-unit-row .field input { min-height: 38px; }
.pricing-zero-confirm { min-height: 38px; align-self: end; }
.pricing-preview { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--surface); color: var(--ink); font-size: .82rem; font-weight: 700; }
.pricing-orphan { color: var(--danger, #b33); font-size: .76rem; }
.pricing-orphan .text-button { margin-left: 5px; }
.attribute-editor-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.attribute-editor-heading > div { display: grid; gap: 3px; }
.field-label { color: var(--muted); font-size: .78rem; font-weight: 700; }
.attribute-editor-heading small { color: var(--muted); font-size: .72rem; font-weight: 500; }
.attribute-editor-heading .secondary-button { min-height: 36px; padding: 7px 11px; font-size: .76rem; }
.attribute-option-product { display: grid; gap: 4px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); background: var(--surface-soft); font-size: .78rem; }
.attribute-option-product strong { color: var(--ink); font-size: .92rem; }
.attribute-key-picker, .attribute-key-input { position: relative; min-width: 0; }
.attribute-key-input input { padding-right: 42px; }
.attribute-key-toggle { position: absolute; top: 4px; right: 4px; display: grid; place-items: center; width: 36px; min-height: 36px; padding: 0; border: 0; border-radius: 8px; color: var(--muted); background: transparent; cursor: pointer; font-size: 1.1rem; }
.attribute-key-toggle:hover, .attribute-key-toggle:focus-visible { color: var(--primary); background: var(--surface-soft); }
.attribute-key-menu { position: absolute; z-index: 30; top: calc(100% + 5px); left: 0; right: 0; display: grid; gap: 8px; padding: 9px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: 0 12px 24px rgb(15 35 70 / 15%); }
.attribute-key-options { max-height: min(220px, 30dvh); overflow-y: auto; display: grid; gap: 3px; }
.attribute-key-choice { min-height: 36px; width: 100%; padding: 8px 10px; border: 0; border-radius: 7px; color: var(--ink); background: transparent; font: inherit; font-size: .82rem; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.attribute-key-choice:hover, .attribute-key-choice:focus-visible, .attribute-key-choice[aria-selected="true"] { background: var(--surface-soft); color: var(--primary); }
#attribute-options-list .attribute-option-selected { border-color: var(--primary); }
.attribute-rows { display: grid; gap: 8px; overflow: visible; }
.attribute-row { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr) minmax(130px, .75fr) auto; align-items: end; gap: 8px; }
.attribute-row .field { min-width: 0; }
.attribute-row .field span { font-size: .72rem; }
.attribute-row .danger-icon-button { min-height: 38px; width: 38px; }
.attribute-multiselect { position: relative; min-width: 0; }
.attribute-multiselect-button { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-width: 0; min-height: 44px; overflow: hidden; padding: 9px 12px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: var(--surface); text-align: left; font: inherit; font-size: .82rem; font-weight: 650; }
.attribute-multiselect-button:focus { outline: 3px solid #b8d0fa; outline-offset: 1px; }
.attribute-multiselect-button span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attribute-multiselect-menu { position: absolute; z-index: 20; top: calc(100% + 5px); left: 0; right: 0; max-height: min(360px, 50vh); overflow-y: auto; padding: 7px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: 0 12px 24px rgb(15 35 70 / 15%); }
.attribute-multiselect-option { display: flex; align-items: center; gap: 9px; min-height: 34px; padding: 6px 8px; border-radius: 8px; color: var(--ink); font-size: .8rem; line-height: 1.2; cursor: pointer; }
.attribute-multiselect-option:hover { background: var(--surface-soft); }
.attribute-multiselect-option input[type="checkbox"] { flex: 0 0 16px; width: 16px; height: 16px; min-width: 16px; min-height: 16px; margin: 0; padding: 0; border: 0; border-radius: 3px; background: transparent; accent-color: var(--primary); }
.attribute-multiselect-option span { flex: 1; min-width: 0; text-align: left; }
.attribute-add-button { justify-self: start; min-height: 38px; padding: 7px 12px; font-size: .78rem; }
.accounting-summary { color: var(--primary-dark); font-size: .84rem; }
.seller-tools-section { margin-top: 26px; }
.seller-tools-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, .72fr); gap: 15px; margin-bottom: 15px; }
.seller-tool { min-width: 0; padding: 21px; }
.seller-tool h3 { margin-top: 7px; }
.stock-workspace { display: flex; flex-direction: column; }
.stock-filter-panel { position: sticky; top: 20px; }
.stock-filter-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.stock-filter-heading h3 { margin-bottom: 0; }
.stock-filter-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; min-width: 0; }
.stock-filter-notice { margin: 0; padding: 7px 10px; border-radius: 999px; font-size: .72rem; white-space: nowrap; }
.stock-filter-actions .secondary-button { min-height: 36px; padding: 7px 11px; font-size: .76rem; white-space: nowrap; }
.stocklist-table { min-width: 1200px; }
.stocklist-table th, .stocklist-table td { vertical-align: middle; }
.stocklist-table .stocklist-row { cursor: pointer; }
.stocklist-table .stocklist-row:hover, .stocklist-table .stocklist-row-selected { background: var(--selected); }
.stocklist-table .stocklist-row:focus { outline: 3px solid #b8d0fa; outline-offset: -3px; }
.stocklist-table td small { display: block; margin-top: 2px; color: var(--muted); font-size: .72rem; }
.stocklist-table .stock-attribute-cell { max-width: 220px; white-space: normal; color: var(--primary-dark); font-size: .78rem; line-height: 1.35; }
.stock-price-action-column, .stock-price-action-cell { text-align: right; white-space: nowrap; }
.stock-price-open-button { margin-left: auto; min-height: 38px; padding: 7px 12px; font-size: .78rem; }
.stocklist-table .stock-below-minimum { color: var(--danger); font-weight: 800; }
.stocklist-table input { width: 92px; min-height: 36px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 9px; }
.stocklist-table button { min-height: 36px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--primary-dark); background: var(--surface-soft); font-size: .76rem; font-weight: 750; }
.stocklist-table button:hover { border-color: var(--primary); background: var(--selected); }
.stock-movement-divider { height: 1px; margin: 22px 0 18px; background: var(--line); }
.stock-movement-heading { display: flex; align-items: end; justify-content: space-between; gap: 15px; margin-bottom: 13px; }
.stock-movement-heading h3 { margin-bottom: 0; }
.stock-request-form { gap: 12px; }
.stock-request-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.stock-supplemental-fields { display: grid; gap: 12px; }
.stock-request-actions { justify-content: flex-end; }
.stock-request-drafts { display: grid; gap: 7px; padding: 11px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.stock-request-drafts-heading { display: flex; justify-content: space-between; gap: 10px; color: var(--primary-dark); font-size: .8rem; }
.stock-request-drafts-heading span { color: var(--muted); font-weight: 600; }
.stock-request-draft { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.stock-request-draft strong, .stock-request-draft small { display: block; }
.stock-request-draft small { margin-top: 2px; color: var(--muted); font-size: .74rem; }
.stock-request-draft .danger-icon-button { flex: 0 0 auto; width: 34px; min-height: 34px; }
.stock-filter-attributes { display: grid; gap: 8px; }
.stock-filter-attributes-heading { display: grid; gap: 3px; }
.stock-filter-attributes-heading small { color: var(--muted); font-size: .72rem; font-weight: 500; }
.stock-filter-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; align-items: end; gap: 7px; }
.stock-filter-row .field { min-width: 0; }
.stock-filter-row .field span { font-size: .72rem; }
.stock-filter-row .danger-icon-button { width: 38px; min-height: 38px; }
.stock-filter-picker { position: relative; }
.stock-filter-picker-button { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); background: #fbfcfe; font-size: .82rem; font-weight: 700; text-align: left; }
.stock-filter-picker-button span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stock-filter-menu { position: absolute; z-index: 25; top: calc(100% + 7px); right: 0; left: 0; display: grid; gap: 8px; max-height: 280px; padding: 9px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); box-shadow: 0 18px 40px rgba(39, 66, 100, .2); }
.stock-filter-search { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fbfcfe; }
.stock-filter-values { display: grid; gap: 5px; max-height: 210px; overflow-y: auto; }
.stock-filter-option { display: flex; align-items: center; gap: 9px; padding: 8px 9px; border-radius: 9px; color: var(--ink); background: var(--surface-soft); font-size: .82rem; cursor: pointer; }
.stock-filter-option:hover { background: var(--selected); }
.stock-filter-option input { flex: 0 0 auto; width: 16px; min-height: 16px; height: 16px; margin: 0; accent-color: var(--primary); }
.stock-filter-empty { padding: 8px 9px; color: var(--muted); font-size: .8rem; }
.stock-price-dialog { width: min(620px, calc(100% - 30px)); }
.stock-price-dialog .dialog-card { max-height: min(820px, calc(100dvh - 30px)); }
.dialog.stock-movement-history-dialog { width: min(1380px, calc(100% - 30px)); }
.stock-movement-history-dialog .dialog-card { max-height: min(820px, calc(100dvh - 30px)); }
.stock-price-context { display: grid; gap: 3px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 13px; color: var(--muted); background: var(--surface-soft); font-size: .8rem; }
.stock-price-context strong { color: var(--ink); font-size: .95rem; }
.stock-price-editor-fields { align-items: end; }
.stock-price-history-section { display: grid; gap: 8px; }
.stock-price-history-section h3 { margin: 0; color: var(--primary-dark); font-size: .92rem; }
.stock-price-history { display: grid; gap: 7px; max-height: 250px; overflow-y: auto; }
.stock-price-history-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-soft); font-size: .78rem; }
.stock-price-history-row > div { display: grid; gap: 2px; min-width: 0; }
.stock-price-history-row > div:last-child { justify-items: end; text-align: right; }
.stock-price-history-row strong { color: var(--primary-dark); font-size: .92rem; }
.stock-price-history-row span, .stock-price-history-row small { color: var(--muted); font-size: .72rem; }
.stock-price-history-empty { padding: 12px; border: 1px dashed var(--line); border-radius: 11px; color: var(--muted); font-size: .8rem; }
.stock-price-dialog-actions { justify-content: flex-end; }
.stock-movement-history { display: grid; gap: 13px; max-height: 520px; overflow-y: auto; }
.stock-movement-statistics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.stock-movement-statistic { display: grid; align-content: start; gap: 5px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }
.stock-movement-statistic span { color: var(--muted); font-size: .76rem; }
.stock-movement-statistic strong { color: var(--ink); font-size: 1.1rem; overflow-wrap: anywhere; }
.stock-movement-pagination { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; }
.stock-movement-pagination span { color: var(--muted); font-size: .8rem; }
@media (max-width: 700px) { .stock-movement-statistics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.stock-movement-history-group { display: grid; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.stock-movement-history-group-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.stock-movement-history-group-heading > div { display: grid; gap: 2px; min-width: 0; }
.stock-movement-history-group-heading > div:last-child { justify-items: end; text-align: right; }
.stock-movement-history-group-heading strong { color: var(--primary-dark); font-size: .86rem; }
.stock-movement-history-group-heading small { color: var(--muted); font-size: .72rem; }
.stock-movement-history-table { min-width: 760px; background: var(--surface); font-size: .76rem; }
.stock-movement-history-table th { color: var(--muted); font-size: .7rem; }
.stock-movement-history-table td { padding-block: 7px; vertical-align: top; }
.stock-movement-history-table td small { display: block; max-width: 320px; margin-top: 3px; color: var(--muted); font-size: .7rem; white-space: normal; }
.stock-movement-history-open-button { margin-left: 5px; }
.seller-only-column { white-space: nowrap; }
.stock-approval-table { min-width: 960px; }
.stock-approval-table td { vertical-align: middle; }
.stock-approval-table td strong, .stock-approval-table td small { display: block; }
.stock-approval-table td small { margin-top: 3px; color: var(--muted); font-size: .72rem; }
.stock-approval-attributes { max-width: 230px; color: var(--primary-dark); font-size: .78rem; }
.stock-approval-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: end; }
.stock-approval-actions .primary-button, .stock-approval-actions .danger-button { min-height: 36px; padding: 7px 10px; font-size: .76rem; }
.purchase-order-heading { margin-top: 4px; }
.purchase-order-table { min-width: 820px; }
.purchase-order-table td { vertical-align: top; }
.purchase-order-table td strong, .purchase-order-table td small { display: block; }
.purchase-order-table td small { margin-top: 3px; color: var(--muted); font-size: .72rem; }
.purchase-order-status { display: inline-flex; align-items: center; min-height: 28px; padding: 5px 9px; border-radius: 999px; font-size: .72rem; font-weight: 800; white-space: nowrap; }
.purchase-order-status-pending { color: #8a5a00; background: #fff1cf; }
.purchase-order-status-approved { color: #08734b; background: #dcf7e8; }
.purchase-order-status-rejected { color: #a32121; background: #ffe2e2; }
.purchase-order-line { display: grid; gap: 2px; margin-bottom: 7px; }
.purchase-order-line:last-child { margin-bottom: 0; }
.purchase-order-line strong { color: var(--primary-dark); font-size: .78rem; }
.purchase-order-line small { color: var(--muted); font-size: .72rem; line-height: 1.35; white-space: normal; }
.purchase-order-panel { grid-column: 1 / -1; }
.purchase-order-list { display: grid; gap: 10px; max-height: 520px; overflow-y: auto; }
.purchase-order-card { display: grid; gap: 12px; padding: 13px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.purchase-order-card-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.purchase-order-card-heading strong, .purchase-order-card-heading small { display: block; }
.purchase-order-card-heading small { margin-top: 3px; color: var(--muted); font-size: .72rem; }
.purchase-order-lines { display: grid; gap: 8px; padding: 10px; border-radius: 10px; background: var(--surface); }
.purchase-order-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.purchase-order-empty { padding: 13px; border: 1px dashed var(--line); border-radius: 11px; color: var(--muted); font-size: .8rem; }
.stock-request-attributes { display: grid; gap: 8px; padding: 11px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }
.stock-request-attributes-heading { display: grid; gap: 2px; }
.stock-request-attributes-heading small { color: var(--muted); font-size: .72rem; font-weight: 500; }
.stock-request-attribute-group { min-width: 0; margin: 0; padding: 8px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.stock-request-attribute-group legend { padding: 0 4px; color: var(--muted); font-size: .75rem; font-weight: 800; }
.stock-request-attribute-option { display: grid; gap: 4px; color: var(--ink); font-size: .78rem; }
.stock-request-attribute-option select { width: 100%; min-height: 38px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fbfcfe; font-size: .78rem; }
.payment-qr { display: grid; justify-items: start; gap: 8px; padding: 13px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.inline-form .payment-qr { grid-column: 1 / -1; }
.payment-qr p { margin: 0; color: var(--ink); font-size: .84rem; font-weight: 700; }
.payment-qr img { display: block; width: min(220px, 100%); aspect-ratio: 1; object-fit: contain; border-radius: 10px; background: white; }
.admin-payment-qr-preview { justify-items: center; }
.admin-payment-qr-preview img { width: 180px; }
.shop-logo-preview { display: flex; align-items: center; gap: 16px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.shop-logo-preview img { display: block; width: min(100%, 420px); max-height: 180px; object-fit: contain; object-position: left center; border-radius: 10px; background: #fff; }
.shop-logo-preview-actions { display: grid; justify-items: start; gap: 8px; }
.shop-logo-preview-actions .field-help { margin: 0; }
.shop-logo-preview-actions button { min-height: 38px; padding: 7px 12px; }
@media (max-width: 620px) { .shop-logo-preview { align-items: flex-start; flex-direction: column; } .shop-logo-preview img { max-height: 150px; } }
.dialog.payment-qr-dialog { width: min(964px, calc(100% - 30px)); margin: auto; }
.payment-qr-dialog .payment-qr { justify-items: center; border: 0; padding: 0; background: transparent; text-align: center; }
.payment-qr-dialog .payment-qr img { width: min(880px, calc(100vw - 88px), calc(100dvh - 380px)); max-width: 100%; }

.toast { position: fixed; right: 22px; bottom: 22px; z-index: 10; max-width: min(360px, calc(100vw - 44px)); padding: 13px 16px; transform: translateY(20px); border: 1px solid var(--line); border-radius: 13px; color: var(--ink); background: white; box-shadow: var(--shadow); opacity: 0; pointer-events: none; transition: .2s ease; }
.toast.visible { transform: translateY(0); opacity: 1; }
.dialog { width: min(460px, calc(100% - 30px)); max-height: calc(100dvh - 30px); overflow: hidden; padding: 0; border: 0; border-radius: 22px; background: transparent; }
.dialog::backdrop { background: rgba(20, 35, 56, .34); backdrop-filter: blur(3px); }
.dialog-card { position: relative; display: grid; gap: 15px; max-height: calc(100dvh - 30px); overflow-y: auto; overscroll-behavior-y: contain; padding: 29px; border-radius: 22px; background: white; box-shadow: 0 30px 80px rgba(20, 35, 56, .2); }
.dialog-card h2 { margin: 0; }
.dialog-close { position: absolute; z-index: 1200; top: 14px; right: 14px; display: grid; place-items: center; width: 37px; height: 37px; min-height: 37px; border: 0; border-radius: 50%; color: var(--muted); background: var(--surface-soft); font-size: 1.4rem; }
.dialog.reservation-contact-dialog { width: min(560px, calc(100% - 30px)); }
.reservation-contact-person { display: grid; gap: 9px; padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface-soft); }
.reservation-contact-person strong { color: var(--primary-dark); font-size: clamp(1.45rem, 5vw, 2rem); line-height: 1.15; overflow-wrap: anywhere; }
.reservation-contact-number { color: var(--ink); font-size: clamp(1.35rem, 5vw, 1.85rem); font-weight: 800; line-height: 1.15; overflow-wrap: anywhere; }
.reservation-contact-person small { color: var(--muted); font-size: .8rem; line-height: 1.4; overflow-wrap: anywhere; }
.reservation-contact-link { justify-content: center; text-decoration: none; }
.reservation-contact-whatsapp { border-color: #15803d; color: white; background: #15803d; box-shadow: 0 9px 18px rgba(21, 128, 61, .16); }
.reservation-contact-whatsapp:hover { border-color: #166534; background: #166534; }
.reservation-whatsapp-qr-help { margin: -7px 0 0; font-size: .78rem; line-height: 1.45; }
.admin-list-dialog { width: min(820px, calc(100% - 30px)); }
.admin-list-dialog .dialog-card { max-height: min(820px, calc(100dvh - 30px)); }
.admin-list-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.admin-role-picker { position: relative; }
.admin-role-picker-button { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); background: #fbfcfe; font-size: .82rem; font-weight: 700; text-align: left; }
.admin-role-picker-button span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-role-menu { position: fixed; z-index: 1000; top: 0; left: 0; display: grid; gap: 5px; max-width: calc(100vw - 24px); max-height: 260px; overflow-y: auto; padding: 9px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); box-shadow: 0 18px 40px rgba(39, 66, 100, .2); }
.admin-role-option { display: flex; align-items: center; gap: 9px; padding: 8px 9px; border-radius: 9px; color: var(--ink); background: var(--surface-soft); font-size: .82rem; cursor: pointer; }
.admin-role-option:hover { background: var(--selected); }
.admin-role-option input { flex: 0 0 auto; width: 16px; min-height: 16px; height: 16px; margin: 0; accent-color: var(--primary); }
.admin-role-count { min-width: 22px; margin-left: auto; padding: 2px 6px; border-radius: 999px; color: var(--muted); background: #e8eef8; font-size: .72rem; font-weight: 700; line-height: 1.3; text-align: center; }
.admin-list-count { margin: 8px 2px; color: var(--muted); font-size: .8rem; font-weight: 700; text-align: right; }
.admin-list-filters .search-field { grid-column: 1 / -1; }
.admin-list-body { display: grid; gap: 8px; max-height: 430px; overflow-y: auto; padding-right: 3px; }
.admin-list-empty { padding: 28px 16px; border: 1px dashed var(--line); border-radius: 13px; color: var(--muted); text-align: center; }
.admin-list-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px 13px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.admin-list-row strong, .admin-list-row small { display: block; }
.admin-list-row small { color: var(--muted); font-size: .78rem; }
.admin-list-row-actions { display: flex; flex-wrap: wrap; justify-content: end; gap: 7px; }
.admin-list-row-actions .secondary-button, .admin-list-row-actions .danger-button { min-height: 36px; padding: 7px 11px; font-size: .78rem; }
.opening-hours-editor { display: grid; gap: 8px; }
.opening-hours-day { display: grid; grid-template-columns: minmax(110px, 1fr) minmax(110px, .8fr) minmax(110px, .8fr); gap: 10px; align-items: end; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }
.opening-hours-toggle { display: flex; align-items: center; gap: 9px; min-height: 40px; font-weight: 600; }
.opening-hours-toggle input { width: 18px; height: 18px; accent-color: var(--primary); }
.opening-hours-time { margin: 0; }
.opening-hours-continuous-settings { display: grid; gap: 8px; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }
.opening-hours-siesta-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.opening-hours-siesta-fields > small { grid-column: 1 / -1; }
.reservation-confirmation-dialog { width: min(680px, calc(100% - 24px)); }
.reservation-confirmation-lead { margin: 14px 0 24px; color: var(--ink); font-size: clamp(1.35rem, 5vw, 2.1rem); font-weight: 700; line-height: 1.25; }
.reservation-confirmation-hours { padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.reservation-confirmation-hours h3 { margin: 0 0 5px; }
.reservation-confirmation-hours > p { margin: 0 0 10px; }
.reservation-confirmation-hours-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 14px; }
.reservation-confirmation-hours-day { display: flex; justify-content: space-between; gap: 12px; font-size: .88rem; }
.reservation-confirmation-hours-day span:last-child { color: var(--muted); text-align: right; }
.reservation-confirmation-next-opening { margin: 16px 0; padding: 12px; border-radius: 12px; background: var(--accent-soft, #eef4ff); color: var(--ink); font-weight: 600; }
.danger-button { border: 1px solid #efcaca; border-radius: 10px; color: var(--danger); background: #fff2f2; font-weight: 800; }
.danger-button:hover { background: #ffe4e4; }
.danger-icon-button { display: inline-grid; place-items: center; width: 36px; padding: 0 !important; font-size: 1rem !important; }
.form-message { min-height: 18px; padding: 0; color: var(--danger); font-size: .84rem; }
.cash-session-list { display: grid; gap: 8px; max-height: 190px; overflow-y: auto; }
.cash-session-list .field, .cash-session-list select { min-width: 0; }
.cash-session-empty { padding: 12px; border: 1px dashed var(--border); border-radius: 12px; color: var(--muted); font-size: .86rem; }
.cash-session-option { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.cash-session-option strong { display: block; }
.cash-session-option small { color: var(--muted); }
.cash-session-option button { min-height: 36px; padding: 7px 12px; }

@media (min-width: 1280px) {
  .hero-copy p { white-space: nowrap; font-size: clamp(.66rem, calc(.31vw + .42rem), .72rem); letter-spacing: -.025em; }
}
@media (max-width: 1150px) {
  .hero-section { grid-template-columns: 1fr; gap: 15px; }
  .hero-copy { padding-bottom: 0; }
  .catalog-toolbar { grid-template-columns: repeat(3, 1fr); }
  .catalog-toolbar .field-shop { grid-column: 1; grid-row: 1; }
  .catalog-toolbar .catalog-filter-shelf { grid-column: 2; grid-row: 1; }
  .catalog-toolbar .catalog-filter-seller { grid-column: 3; grid-row: 1; }
  .catalog-toolbar .search-field { grid-column: 1 / span 2; grid-row: 2; }
  .catalog-toolbar .primary-button { grid-column: 3; grid-row: 2; }
  .content-layout { grid-template-columns: minmax(0, 1fr) 310px; gap: 20px; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 780px) {
  .pricing-unit-row, .pricing-cost-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pricing-unit-row > strong, .pricing-unit-row .pricing-zero-confirm { grid-column: 1 / -1; }
  .pricing-attribute-pair { grid-template-columns: 1fr; }
  .report-history-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .app-shell { padding: 0 16px 40px; }
  .app-header { padding-bottom: 10px; }
  .topbar { min-height: 70px; }
  .main-nav { overflow-x: auto; }
  .main-nav.admin-nav-dropdown-open { overflow: visible; }
  .nav-link { flex: 0 0 auto; padding-inline: 12px; }
  .nav-action { margin-left: 0; }
  .content-layout { grid-template-columns: 1fr; }
  .basket-panel { position: static; order: -1; }
  .stock-filter-panel { position: static; }
  .stock-filter-heading { align-items: start; flex-direction: column; }
  .stock-filter-actions { justify-content: flex-start; width: 100%; }
  .basket-items { max-height: 250px; }
  .catalog-toolbar { grid-template-columns: repeat(2, 1fr); }
  .catalog-toolbar.catalog-toolbar-local { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-toolbar .field-shop { grid-column: 1; grid-row: 1; }
  .catalog-toolbar .catalog-filter-shelf { grid-column: 2; grid-row: 1; }
  .catalog-toolbar .catalog-filter-seller { grid-column: 1; grid-row: 2; }
  .catalog-toolbar .search-field { grid-column: 2; grid-row: 2; }
  .catalog-toolbar .primary-button { grid-column: 2; grid-row: 3; }
  .info-grid, .staff-tools, .admin-console-grid, .seller-tools-grid, .shop-finance-grid { grid-template-columns: 1fr; }
  .shop-finance-inline-form, .shop-finance-report-form { grid-template-columns: 1fr; }
  .report-heading { align-items: stretch; flex-direction: column; }
  .report-kpis { width: 100%; }
  .admin-console-heading { display: block; }
  .admin-console-heading p { margin-top: 9px; text-align: left; }
  .page-section { margin-top: 38px; }
}
@media (max-width: 520px) {
  .brand-shop { max-width: 38vw; }
  .hero-shop-logo { max-width: 100%; max-height: 220px; }
  .hero-shop-branding.has-tagline .hero-shop-logo { max-height: calc(220px - 36px); }
  .topbar-actions .status-pill { display: none; }
  .user-chips { max-width: 58vw; }
  .user-chip { max-width: 150px; }
  .catalog-toolbar { grid-template-columns: 1fr; }
  .catalog-toolbar.catalog-toolbar-global { grid-template-columns: 1fr; }
  .report-overview-kpis,
  .report-overview-kpis:not(.has-referral-commission) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-toolbar > * { grid-column: auto !important; grid-row: auto !important; }
  .product-grid { grid-template-columns: 1fr; }
  h1 { font-size: 2.65rem; }
  .inline-form { grid-template-columns: 1fr; }
  .report-form-row { grid-template-columns: 1fr; }
  .report-history-grid { grid-template-columns: 1fr; }
  .report-history-heading { align-items: start; flex-direction: column; }
  .two-columns { grid-template-columns: 1fr; }
  .admin-user-assignment:has(#admin-user-system-mode-field.hidden), .admin-user-identity:has(#admin-user-catalog-alias-field.hidden) { grid-template-columns: 1fr; }
  #admin-item-fixed-fields.production-only { grid-template-columns: 1fr; }
  .stock-request-fields, .stock-filter-row, .three-columns { grid-template-columns: 1fr; }
  .stock-movement-heading { display: block; }
  .stock-movement-heading .muted-text { display: block; margin-top: 5px; }
  .admin-list-filters { grid-template-columns: 1fr; }
  .admin-list-filters .search-field { grid-column: auto; }
  .admin-list-row { grid-template-columns: 1fr; }
  .admin-list-row-actions { justify-content: start; }
  .opening-hours-day { grid-template-columns: 1fr 1fr; }
  .opening-hours-toggle { grid-column: 1 / -1; }
  .reservation-confirmation-hours-list { grid-template-columns: 1fr; }
  .attribute-editor-heading { display: grid; }
  .attribute-row { grid-template-columns: 1fr 1fr; }
  .attribute-row .danger-icon-button { justify-self: end; }
  .staff-tool-heading { align-items: start; flex-wrap: wrap; }
  .reservation-contact-button { margin-left: auto; }
  .reservation-queue-row { align-items: stretch; flex-direction: column; }
  .reservation-queue-actions { justify-content: flex-end; }
  .buyer-reservations-heading { align-items: flex-start; flex-direction: column; }
  .buyer-reservation-row { grid-template-columns: minmax(0, 1fr); }
  .buyer-reservation-status { justify-self: start; }
  .hero-section { padding-top: 18px; }
}
.global-order-service-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

.basket-service-price {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.35rem;
  color: var(--muted, #64748b);
  font-size: 0.82rem;
}

.basket-service-price input {
  width: 7.5rem;
}
/* The sticky app header keeps unpaid notices visible across views and scrolling. */
.subscription-banner {
  margin: 8px 0 0;
  padding: 1rem 1.25rem;
  color: #713f12;
  background: #fef3c7;
  border: 1px solid #fcd34d;
  border-radius: 12px;
  line-height: 1.5;
}
.subscription-banner.subscription-restricted {
  color: #7f1d1d;
  background: #fee2e2;
  border-color: #fca5a5;
}

.production-catalog-toolbar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.production-catalog-toolbar .search-field { grid-column: 1 / -1; grid-row: 1; }
.production-catalog-toolbar .catalog-filter-shelf { grid-column: 1; grid-row: 2; }
.production-catalog-toolbar .catalog-filter-seller { grid-column: 2; grid-row: 2; }
.production-catalog-toolbar .primary-button { grid-column: 3; grid-row: 2; }
.production-product-card { min-height: 215px; }
.production-product-card .product-visual { flex: 0 0 92px; }
.production-product-card .product-description { min-height: 0; margin-top: 5px; }
.production-product-card .product-footer .secondary-button { min-height: 38px; padding: 7px 12px; }
#production-request-panel .admin-form { margin-top: 16px; }
#production-request-panel .stock-request-drafts { max-height: 260px; overflow-y: auto; }
.shop-group-seller-config { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--line, #dbe5f2); border-radius: 14px; background: var(--soft, #f4f7fb); }
.shop-group-seller-shop { display: grid; gap: 9px; }
.shop-group-seller-shop h4 { margin: 0; font-size: .98rem; }
.shop-group-seller-list { display: grid; gap: 8px; }
.shop-group-seller-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(135px, 180px); align-items: center; gap: 12px; padding: 9px 11px; border: 1px solid var(--line, #dbe5f2); border-radius: 10px; background: var(--surface, #fff); }
.shop-group-seller-row > label:first-child { display: flex; align-items: center; gap: 8px; min-width: 0; }
.shop-group-seller-row > label:first-child span { overflow-wrap: anywhere; }
.shop-group-seller-row .field { gap: 4px; }
.shop-group-seller-row .field span { font-size: .74rem; }
.shop-group-seller-row input[type="number"] { min-height: 37px; padding: 7px 9px; }
@media (max-width: 600px) {
  .shop-group-seller-row { grid-template-columns: minmax(0, 1fr); gap: 8px; }
}
@media (max-width: 520px) {
  .production-catalog-toolbar { grid-template-columns: 1fr; }
  .production-catalog-toolbar > * { grid-column: 1 !important; grid-row: auto !important; }
}

/* Public HTML is visible before JavaScript and enhances the existing catalog layout. */
body[data-public-catalog] #catalogo, body[data-public-catalog] .workflow-heading { display: none !important; }
body:not([data-public-catalog]) #public-catalog-heading, body:not([data-public-catalog]) #public-catalog-pagination { display: none; }
#public-catalog-heading { margin-bottom: 24px; }
#public-catalog-heading nav { color: var(--muted); font-size: .85rem; }
#public-catalog-heading a:hover, #public-catalog-pagination a:hover { color: var(--primary); }
#public-catalog-pagination { display: flex; gap: 24px; padding: 20px 0; }
.public-product-detail { grid-column: 1 / -1; }
.public-product-detail .product-visual { display: flex; flex-wrap: wrap; gap: 10px; }
.public-product-detail img { max-width: min(100%, 300px); max-height: 300px; object-fit: contain; }
.public-product-detail dt { font-weight: 700; }
.public-product-detail dd { margin: 0 0 8px; }
body[data-public-catalog] #reservas, body[data-public-catalog] #administracion, body[data-public-catalog] #production-catalog { display: none !important; }

/* Shared dispon.date identity, independent of the selected shop. */
.application-logo { display: block; width: 190px; height: auto; max-width: 100%; flex: 0 0 auto; }
.brand:has(.application-logo) .brand-name { display: none; }
@media (max-width:767px) { .brand:has(.application-logo) { flex-wrap: wrap; } .brand > .application-logo { width: 158px; } }