:root {
  --red: #ef1722;
  --black: #17191a;
  --ink: #17191a;
  --muted: #71736f;
  --line: #dfdfd9;
  --bg: #f4f3ef;
  --card: #ffffff;
  --green: #168f57;
  --amber: #a56500;
  --radius: 17px;
  --shadow: 0 14px 42px rgba(28, 31, 30, .07);
  color-scheme: light;
}

html,
body,
.workspace,
main {
  background: var(--bg) !important;
  color: var(--ink) !important;
  color-scheme: light !important;
}

button,
input,
select,
textarea,
[contenteditable] { color-scheme: light !important; }

.app { grid-template-columns: 84px minmax(0, 1fr); }
.sidebar {
  width: 84px;
  padding: 14px 8px 12px;
  background: #17191a;
  border-right: 1px solid #292b2c;
  align-items: center;
  overflow: visible;
}
.brand { width: 100%; justify-content: center; padding: 0 0 13px; }
.brand > div:last-child { display: none; }
.logo { width: 48px; height: 48px; border-radius: 13px; background: var(--red); position: relative; overflow: hidden; }
.logo img { display: block; height: 100%; width: auto; max-width: none; }
.logo:after { display: none; }
.nav-label { display: none; }
.sidebar > .nav,
.sidebar > .nav-group { width: 100%; }
.nav-primary { overflow-y: auto; max-height: calc(100vh - 255px); scrollbar-width: none; padding-bottom: 8px; }
.nav-primary::-webkit-scrollbar { display: none; }
.sidebar .nav button {
  min-height: 47px;
  padding: 5px 3px;
  gap: 2px;
  border-radius: 11px;
  flex-direction: column;
  justify-content: center;
  color: #aaaeb0;
  font-size: 8px;
  line-height: 1.08;
  text-align: center;
}
.sidebar .nav button i { width: auto; font-size: 18px; line-height: 1; color: #d5d7d8; }
.sidebar .nav button:hover { background: #242728; color: #fff; }
.sidebar .nav button.active { background: #2b2e2f; color: #fff; box-shadow: inset 3px 0 var(--red); }
.sidebar .nav button.active i { color: var(--red); }
.nav-group { position: relative; border-color: #292b2c; }
.nav-group summary {
  min-height: 40px;
  padding: 5px 2px;
  justify-content: center;
  color: #8f9395;
  font-size: 8px;
  line-height: 1.1;
  text-align: center;
}
.nav-group summary:after { display: none; }
.nav-group[open] summary { color: #fff; background: #242728; border-radius: 9px; }
.nav-group > .nav {
  display: none;
  position: fixed;
  z-index: 180;
  left: 84px;
  bottom: 12px;
  width: 250px;
  max-height: calc(100dvh - 24px);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding: 9px;
  border: 1px solid #343738;
  border-radius: 13px;
  background: #17191a;
  box-shadow: 0 18px 48px rgba(0,0,0,.28);
}
.nav-group[open] > .nav { display: grid; }
.nav-group > .nav button { min-height: 39px; padding: 8px 10px; flex-direction: row; justify-content: flex-start; gap: 10px; font-size: 12px; text-align: left; }
.side-state { width: 100%; margin-top: auto; padding: 10px 2px 0; text-align: center; font-size: 8px; }
.side-state b { justify-content: center; }
.side-state #side-version { display: none; }

.topbar {
  height: 66px;
  background: rgba(255,255,255,.94);
  border-color: var(--line);
  padding: 0 28px;
}
.crumb { color: #949794; }
.crumb b { color: var(--ink); }
.top-actions button,
.top-actions .btn { background: #fff; border-color: var(--line); color: var(--ink); }
.avatar { background: #17191a; color: #fff; }
.content { max-width: 1450px; padding: 28px 30px 84px; }

.head {
  overflow: visible;
  align-items: center;
  padding: 5px 0 17px;
  margin-bottom: 18px;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  color: var(--ink);
}
.head:after { display: none; }
.eyebrow { color: var(--red); }
.head h1 { font-size: 32px; margin: 4px 0 2px; }
.head p { color: var(--muted); }

.card,
.metric,
.dashboard-panel,
.cash-panel,
.cashier-stat,
.settings-box,
.system-card,
.module-item,
.equipment-card,
.material-controls,
.quote-paper,
.privacy-note,
.modal,
.order-main-fields,
.production-job-focus,
.production-job-passport,
.production-queue {
  background: #fff !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
  box-shadow: var(--shadow);
}

.btn,
.head .btn,
.close,
.top-actions button {
  background: #fff !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}
.btn:hover { background: #f7f7f4 !important; border-color: #c7c8c4 !important; }
.btn.primary,
.head .btn.primary,
.pwa-install {
  background: var(--red) !important;
  border-color: var(--red) !important;
  color: #fff !important;
}
.btn.dark { background: #17191a !important; border-color: #17191a !important; color: #fff !important; }

.field input,
.field select,
.field textarea,
.toolbar input,
.toolbar select,
.data-head input,
.data-head select,
.cashier-toolbar input,
.cashier-toolbar select,
input.btn,
select.btn,
.mail-search,
.omni-tools input,
.omni-tools select,
.mail-editor,
[contenteditable] {
  background: #fff !important;
  border-color: #d9dad6 !important;
  color: #17191a !important;
  -webkit-text-fill-color: #17191a !important;
}
input::placeholder,
textarea::placeholder { color: #999c98 !important; -webkit-text-fill-color: #999c98 !important; }
select option { background: #fff; color: #17191a; }
.field label { color: #636661; }
.field input:focus,
.field select:focus,
.field textarea:focus { border-color: var(--red) !important; box-shadow: 0 0 0 3px rgba(239,23,34,.10) !important; }

.data-table th,
.data-table td,
.material-table th,
.material-table td,
.data-head,
.modal-head,
.modal-foot { border-color: var(--line) !important; }
.data-table tbody tr,
.material-table tbody tr,
.dashboard-row { background: #fff !important; color: var(--ink) !important; }
.data-table tbody tr:hover,
.material-table tbody tr:hover,
.dashboard-row:hover { background: #fafaf7 !important; }

.order-workspace-modal .modal-head {
  background: #fff !important;
  color: var(--ink) !important;
}
.order-workspace-modal .eyebrow { color: var(--red) !important; }
.order-workspace-tabs .btn.active,
.production-focus-tabs button.active,
.production-version-strip button.active {
  background: #17191a !important;
  color: #fff !important;
  border-color: #17191a !important;
}

.production-operator-summary,
.production-filebar,
.production-preview,
.production-info-card,
.production-check-grid article,
.production-passport-state,
.production-route-step,
.order-workspace-stat,
.order-doc-row,
.client-contact-card,
.dashboard-flow button,
.dashboard-sale,
.auto-choice div,
.spec,
.layout-wrap,
.department-tab,
.product,
.material-choice,
.cashier-item,
.cashier-operator-card,
.cashier-order-line,
.cashier-order-filebox,
.souvenir-card,
.souvenir-provider-card {
  background: #fff !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}
.production-queue button { background: #fff !important; color: var(--ink) !important; border-color: var(--line) !important; }
.production-queue button.active { background: #fff1f2 !important; border-left-color: var(--red) !important; }
.production-preview { background: #f0efeb !important; }
.production-preview-empty { color: var(--ink) !important; }
.production-preview-empty span,
.production-passport-state span,
.production-filebar small { color: var(--muted) !important; }
.production-layout-upload-state { margin-top: 13px; min-height: 20px; color: var(--muted); font-size: 12px; }
.production-preview.is-dragging { outline: 3px solid rgba(239,23,34,.28); outline-offset: -3px; }

/* Production operator: queue, live proof and digital job passport. */
.production-operator-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(130px, .55fr)) minmax(260px, 1.45fr);
  gap: 10px;
  margin-bottom: 14px;
  padding: 0;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.production-operator-summary > div {
  display: flex;
  min-height: 86px;
  padding: 15px 17px;
  flex-direction: column;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: #fff;
}
.production-operator-summary span,
.production-operator-summary small { color: var(--muted); font-size: 11px; }
.production-operator-summary b { margin-top: 5px; font-size: 26px; line-height: 1; }
.production-operator-summary .production-user-state b { font-size: 15px; line-height: 1.2; }
.production-operator-summary .production-user-state small { margin-top: 6px; }
.production-operator-shell {
  display: grid;
  grid-template-columns: minmax(235px, 270px) minmax(450px, 1fr) minmax(270px, 320px);
  gap: 13px;
  align-items: start;
}
.production-queue,
.production-job-focus,
.production-job-passport {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 17px;
}
.production-queue { position: sticky; top: 80px; max-height: calc(100vh - 112px); overflow-y: auto; padding: 0; }
.production-panel-title { position: sticky; z-index: 2; top: 0; display: flex; padding: 16px; flex-direction: column; gap: 4px; border-bottom: 1px solid var(--line); background: #fff; }
.production-panel-title b { font-size: 15px; }
.production-queue > button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  width: 100%;
  min-height: 86px;
  padding: 13px 14px;
  gap: 5px 9px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-left: 4px solid transparent;
  border-radius: 0;
  text-align: left;
  cursor: pointer;
}
.production-queue > button:last-child { border-bottom: 0; }
.production-queue > button > span { min-width: 0; }
.production-queue > button b,
.production-queue > button small { display: block; }
.production-queue > button b { font-size: 13px; }
.production-queue > button small { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.3; }
.production-queue > button > small { grid-column: 1 / -1; margin: 0; }
.production-queue > button em { color: #527ea1; font-size: 10px; font-style: normal; font-weight: 800; white-space: nowrap; }
.production-job-focus { min-height: 680px; padding: 0; }
.production-filebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 17px 18px;
  border-bottom: 1px solid var(--line);
}
.production-filebar > div:first-child { min-width: 0; }
.production-filebar h2 { margin: 7px 0 4px; font-size: 20px; line-height: 1.15; }
.production-filebar .actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.production-version-strip { display: flex; gap: 7px; padding: 10px 14px; overflow-x: auto; border-bottom: 1px solid var(--line); background: #fafaf7; }
.production-version-strip button,
.production-focus-tabs button {
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  cursor: pointer;
}
.production-version-strip button { display: flex; min-width: 130px; padding: 8px 10px; flex-direction: column; align-items: flex-start; gap: 2px; border-radius: 10px; }
.production-version-strip button span { max-width: 180px; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.production-preview {
  display: grid;
  min-height: 420px;
  place-items: center;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}
.production-preview img { display: block; max-width: 100%; max-height: 620px; object-fit: contain; }
.production-preview iframe { display: block; width: 100%; min-height: 520px; border: 0; background: #fff; }
.production-preview-empty { display: grid; max-width: 430px; min-height: 310px; padding: 36px; place-items: center; align-content: center; gap: 12px; text-align: center; }
.production-preview-empty b { font-size: 18px; }
.production-preview-empty span { line-height: 1.45; }
.production-sheet-scheme { display: grid; grid-template-columns: 1fr 1fr; width: 210px; padding: 18px; gap: 8px; border: 2px solid #404341; background: #fff; }
.production-sheet-scheme i { display: block; height: 62px; background: #ef3d37; }
.production-sheet-scheme i:nth-child(even) { background: #282a2b; }
.production-focus-tabs { display: flex; gap: 7px; padding: 10px 14px; overflow-x: auto; border-bottom: 1px solid var(--line); background: #fff; }
.production-focus-tabs button { padding: 9px 12px; border-radius: 99px; font-size: 10px; font-weight: 800; white-space: nowrap; }
#production-focus-pane { padding: 14px; }
.production-pane-grid,
.production-check-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.production-info-card,
.production-check-grid article { display: flex; min-height: 92px; padding: 14px; flex-direction: column; gap: 5px; border: 1px solid var(--line); border-radius: 13px; }
.production-info-card small,
.production-info-card span,
.production-check-grid article span { color: var(--muted); font-size: 10px; line-height: 1.4; }
.production-check-grid article.ok { border-left: 4px solid #2ca36a; }
.production-check-grid article.warning { border-left: 4px solid #e2a22b; }
.production-thread { display: grid; gap: 9px; }
.production-thread article { padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.production-thread article small,
.production-thread article b { display: block; }
.production-thread article small { color: var(--muted); font-size: 9px; }
.production-thread article b { margin-top: 5px; }
.production-thread article p { margin: 7px 0 0; line-height: 1.45; }
.production-job-passport { position: sticky; top: 80px; max-height: calc(100vh - 112px); padding: 17px; overflow-y: auto; }
.production-job-passport > h2 { margin: 6px 0 14px; font-size: 23px; }
.production-passport-state { display: flex; margin-bottom: 9px; padding: 12px; flex-direction: column; gap: 5px; border: 1px solid var(--line); border-radius: 12px; }
.production-passport-state small { color: var(--muted); font-size: 9px; }
.production-passport-state .btn { margin-top: 5px; align-self: stretch; }
.production-route { margin: 15px 0; }
.production-route h3 { margin: 0 0 9px; font-size: 14px; }
.production-route-step { display: grid; grid-template-columns: 27px minmax(0, 1fr); gap: 8px; margin-bottom: 7px; padding: 9px; align-items: start; border: 1px solid var(--line); border-radius: 11px; }
.production-route-step > b { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: #ecece7; }
.production-route-step > span { min-width: 0; font-size: 11px; font-weight: 800; }
.production-route-step small { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; font-weight: 500; }
.production-route-step.active { border-color: #f3b3b6; background: #fff5f5 !important; }
.production-route-step.active > b { background: var(--red); color: #fff; }
.production-passport-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; padding-top: 4px; }

@media (max-width: 1220px) {
  .production-operator-shell { grid-template-columns: 235px minmax(420px, 1fr); }
  .production-job-passport { position: static; grid-column: 1 / -1; max-height: none; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 9px; }
  .production-job-passport > .eyebrow,
  .production-job-passport > h2,
  .production-job-passport > .production-route,
  .production-job-passport > .production-passport-actions { grid-column: 1 / -1; }
}

.calendar-strip,
.schedule-matrix { color: var(--ink); }
.calendar-day,
.schedule-matrix-cell,
.schedule-matrix-head,
.shift-chip { background: #fff !important; border-color: var(--line) !important; color: var(--ink) !important; }

.demo-environment-banner { background: #e9f4ff; border-color: #b5d8f4; color: #23435c; }
.demo-environment-banner b { background: #73baf1; color: #132638; }
.finance-ledger { padding: 18px; }
.finance-toolbar { gap: 16px; align-items: center; }
.segmented { display: inline-flex; padding: 4px; background: #ecebe7; border-radius: 13px; }
.segmented button { border: 0; background: transparent; color: var(--muted); padding: 10px 16px; border-radius: 10px; font-weight: 800; cursor: pointer; }
.segmented button.active { background: #fff; color: var(--ink); box-shadow: 0 2px 10px #17231b16; }
.finance-row { cursor: pointer; }
.finance-row:hover td { background: #faf9f5; }
.finance-row small { display: block; color: var(--muted); margin-top: 3px; }
.danger-text { color: #c5232c; font-weight: 800; }
.task-summary-live { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.task-summary-live button { min-height:78px; padding:14px 16px; border:1px solid var(--line); border-radius:15px; background:#fff; color:var(--ink); text-align:left; box-shadow:var(--shadow); }
.task-summary-live button b,.task-summary-live button span { display:block; }
.task-summary-live button b { font-size:24px; line-height:1; }
.task-summary-live button span { margin-top:7px; color:var(--muted); font-size:11px; font-weight:750; }
.task-summary-live button.late { border-color:#efb6b8; background:#fff5f5; color:#c5232c; }
.tasks-board-live { display:grid; grid-template-columns:repeat(4,minmax(235px,1fr)); gap:12px; overflow-x:auto; align-items:start; padding-bottom:12px; }
.task-column-live { min-height:430px; padding:11px; border:1px solid var(--line); border-radius:17px; background:#ecebe7; }
.task-column-live.dragover { border-color:var(--red); box-shadow:inset 0 0 0 2px rgba(239,23,34,.12); }
.task-column-live header { display:flex; align-items:center; justify-content:space-between; padding:4px 4px 12px; }
.task-column-live header span { display:grid; place-items:center; min-width:27px; height:27px; padding:0 8px; border-radius:99px; background:#fff; color:var(--muted); font-size:11px; font-weight:850; }
.task-card-live { position:relative; display:grid; gap:6px; margin-bottom:9px; padding:14px 13px 13px 18px; border:1px solid #dcddd8; border-radius:14px; background:#fff; box-shadow:0 6px 18px rgba(28,31,30,.05); cursor:pointer; }
.task-card-live:hover { border-color:#b9bbb6; transform:translateY(-1px); }
.task-card-live.dragging { opacity:.45; }
.task-card-live:focus-visible { outline:3px solid rgba(239,23,34,.2); }
.task-card-live > b { font-size:13px; }
.task-card-live small,.task-card-live span,.task-card-live p { color:var(--muted); font-size:11px; line-height:1.35; }
.task-card-live p { margin:2px 0 0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.task-card-live.is-late { border-color:#efb6b8; }
.task-priority-live { position:absolute; left:0; top:12px; bottom:12px; width:4px; border-radius:0 4px 4px 0; background:#afb1ae; }
.task-priority-live.high { background:#f08a24; }.task-priority-live.urgent { background:#d8252d; }.task-priority-live.low { background:#6aa9d8; }
.task-column-empty { display:grid; place-items:center; min-height:100px; color:var(--muted); font-size:12px; }
.debt-card-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin-bottom: 18px; }
.debt-card-summary > div { padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.debt-card-summary small,.debt-card-summary b,.debt-card-summary strong { display: block; }
.debt-card-summary strong { font-size: 22px; color: #c5232c; margin-top: 5px; }
.debt-payment-list { display: grid; gap: 8px; }

@media (max-width: 760px) {
  .app { display: block; }
  .sidebar { width: 258px; left: -270px; align-items: stretch; overflow-y: auto; }
  .sidebar.open { left: 0; }
  .brand { justify-content: flex-start; padding: 0 8px 18px; }
  .brand > div:last-child { display: block; }
  .sidebar .nav button { min-height: 42px; padding: 9px 11px; flex-direction: row; justify-content: flex-start; gap: 11px; font-size: 13px; text-align: left; }
  .nav-label { display: block; }
  .nav-primary { max-height: none; overflow: visible; }
  .nav-group summary { min-height: auto; padding: 12px 11px; justify-content: space-between; font-size: 11px; text-align: left; }
  .nav-group summary:after { display: block; }
  .nav-group > .nav { position: static; width: auto; max-height: none; overflow: visible; padding: 0 0 10px; border: 0; border-radius: 0; box-shadow: none; scrollbar-gutter: auto; }
  .side-state { text-align: left; font-size: 11px; }
  .side-state b { justify-content: flex-start; }
  .side-state #side-version { display: inline; }
  .debt-card-summary { grid-template-columns: 1fr 1fr; }
  .finance-toolbar { align-items: stretch; flex-direction: column; }
  .segmented { width: 100%; }
  .segmented button { flex: 1; }
  .task-summary-live { grid-template-columns:1fr 1fr; }
  .tasks-board-live { grid-template-columns:repeat(4,minmax(270px,1fr)); }
  .production-operator-summary { grid-template-columns: 1fr 1fr; }
  .production-operator-summary .production-user-state { grid-column: 1 / -1; }
  .production-operator-shell { display: block; }
  .production-queue,
  .production-job-passport { position: static; max-height: none; margin-bottom: 12px; }
  .production-filebar { align-items: flex-start; flex-direction: column; }
  .production-filebar .actions { justify-content: flex-start; }
  .production-pane-grid,
  .production-check-grid,
  .production-job-passport { grid-template-columns: 1fr; }
  .production-job-passport > * { grid-column: auto !important; }
}
.calculator-showcase{padding:22px;margin-bottom:18px}.calculator-showcase-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:18px}.calculator-product-card{min-height:122px;border:1px solid var(--line);border-radius:18px;background:#fff;padding:16px;text-align:left;display:grid;grid-template-columns:42px 1fr;gap:10px;cursor:pointer;color:var(--text)}.calculator-product-card:hover,.calculator-product-card.active{border-color:#e7292d;box-shadow:0 10px 28px rgba(231,41,45,.12)}.calculator-product-card i{width:42px;height:42px;border-radius:13px;background:#fff0f0;color:#d71920;display:grid;place-items:center;font-style:normal;font-size:21px}.calculator-product-card span{min-width:0}.calculator-product-card b,.calculator-product-card small{display:block}.calculator-product-card small{color:var(--muted);margin-top:4px}.calculator-product-card strong{grid-column:2;color:#d71920;font-size:12px}.schedule-board{padding:0;overflow:auto}.schedule-grid{min-width:980px;display:grid;grid-template-columns:220px repeat(7,minmax(105px,1fr))}.schedule-corner,.schedule-date,.schedule-person,.schedule-cell{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px;min-height:70px}.schedule-corner{font-weight:800;background:#f7f8fa}.schedule-date{background:#f7f8fa;text-align:center}.schedule-date b,.schedule-date small,.schedule-person b,.schedule-person small,.schedule-cell b,.schedule-cell small{display:block}.schedule-date small,.schedule-person small,.schedule-cell small{color:var(--muted);margin-top:4px}.schedule-person{background:#fff}.schedule-cell{border-top:0;border-left:0;background:#fff;color:#a4a8ae;cursor:pointer}.schedule-cell.filled{background:#fff4f4;color:#1d2025}.schedule-empty{grid-column:1/-1}.clickable-row{cursor:pointer}.clickable-row:hover{background:#fff5f5}@media(max-width:1100px){.calculator-showcase-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.calculator-showcase-grid{grid-template-columns:1fr}}
#calculator-showcase{display:block;margin-top:16px}.calculator-showcase-group{padding:18px 0;border-top:1px solid var(--line)}.calculator-showcase-group:first-child{border-top:0;padding-top:0}.calculator-showcase-group .data-head h3{margin:0}.calculator-showcase-group .calculator-showcase-grid{margin-top:12px}
.storefront-category-group{grid-column:1/-1;padding:18px 0;border-top:1px solid var(--line)}.storefront-category-group:first-child{border-top:0;padding-top:0}.storefront-category-group>.data-head{margin-bottom:14px}.storefront-category-group>.data-head h2{margin:2px 0 0}.storefront-category-group>.equipment-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.storefront-editor-modal{width:min(980px,calc(100vw - 28px));max-width:980px}.storefront-editor-modal .modal-body{max-height:min(72vh,820px);overflow:auto}.storefront-checks{display:flex!important;align-items:center;gap:14px;flex-wrap:wrap}.storefront-checks>label:first-child{width:100%}.storefront-checks .check{margin:0}.storefront-product-cover{width:100%;aspect-ratio:16/9;margin:10px 0;border-radius:12px;object-fit:cover;background:#eee}.storefront-readiness{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:5px 8px;border-radius:999px;background:#e2f4e9;color:#176b45;font-size:11px;font-weight:800}.storefront-readiness.issue{background:#fff0cf;color:#7a5600}.storefront-link{display:block;margin-top:7px;color:var(--muted);font-size:11px}.storefront-health-ok{border-color:#b6e0ca!important;background:#eff9f3!important;color:#176b45!important}.storefront-health-warning{border-color:#f1d292!important;background:#fff8e6!important;color:#755000!important}
.storefront-layout-row{display:grid;grid-template-columns:minmax(150px,1.5fr) repeat(6,minmax(90px,1fr));gap:8px;align-items:end;padding:12px 0;border-bottom:1px solid var(--line)}.storefront-layout-row b{font-size:12px}.storefront-layout-row label{font-size:10px}.storefront-layout-row input,.storefront-layout-row select{width:100%;min-width:0;margin-top:4px}@media(max-width:800px){.storefront-layout-row{grid-template-columns:repeat(2,minmax(0,1fr))}.storefront-layout-row b{grid-column:1/-1}}
.storefront-home-builder{width:min(1180px,calc(100vw - 28px));max-width:1180px}.storefront-home-builder .modal-body{max-height:min(76vh,900px);background:#f6f6f7}.home-builder-form{display:grid;gap:14px}.home-builder-card{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff}.home-builder-card>summary{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;font-size:15px;font-weight:850;cursor:pointer;list-style:none}.home-builder-card>summary:after{content:'⌄';color:var(--muted);transition:.2s}.home-builder-card[open]>summary{border-bottom:1px solid var(--line)}.home-builder-card[open]>summary:after{transform:rotate(180deg)}.home-builder-card>.fields{padding:17px}.home-builder-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:14px;align-items:start}.home-builder-layout>aside{position:sticky;top:0;padding:16px;border:1px solid var(--line);border-radius:14px;background:#fff}.home-builder-layout>aside>b,.home-builder-layout>aside>small{display:block}.home-builder-layout>aside>small{margin:4px 0 12px;color:var(--muted);font-size:11px}.home-builder-sections{display:grid;gap:10px}.home-section-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:7px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}.home-section-row:first-child{border-top:0}.home-section-row label{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:750}.home-section-row input{accent-color:var(--red)}.home-section-row button{width:29px;height:29px;padding:0;border:1px solid var(--line);border-radius:8px;background:#fff}.home-section-row button:disabled{opacity:.25}.search-preview{margin:0 17px 17px;padding:16px;border:1px solid #dedee2;border-radius:12px;background:#fff}.search-preview small,.search-preview b,.search-preview span{display:block}.search-preview b{margin:7px 0 3px;color:#1a0dab;font-size:18px}.search-preview span{color:#17803b;font-size:12px}.search-preview p{margin:5px 0 0;color:#4b4b4b;line-height:1.45}.publish-check{display:block!important}.publish-check span{display:block!important;border-radius:14px!important;padding:14px 16px!important}.publish-check b,.publish-check small{display:block}.publish-check small{margin-top:3px;color:inherit;opacity:.72}.storefront-home-builder .modal-foot{align-items:center}.storefront-home-builder .modal-foot>a{margin-right:auto}@media(max-width:820px){.home-builder-layout{grid-template-columns:1fr}.home-builder-layout>aside{position:static}.storefront-home-builder .modal-foot{flex-wrap:wrap}.storefront-home-builder .modal-foot>a{width:100%;margin:0}.home-builder-card>.fields{grid-template-columns:1fr}.home-builder-card .field.wide{grid-column:auto}}