.shop-workspace {
  --shop-ink: #17202b;
  --shop-slate: #475569;
  --shop-line: #dce3e8;
  --shop-soft: #f3f6f8;
  --shop-blue: #176b87;
  --shop-orange: #ed7a2a;
  --shop-green: #177557;
  --shop-red: #a23b32;
  grid-column: 1 / -1;
  min-width: 0;
  margin-top: 20px;
  color: var(--shop-ink);
  color-scheme: light;
}

/* Mobile commerce stays a light work surface. Desktop overrides these roles
   below so the module composes with the dark operations command center. */
.dashboard .shop-workspace input:not([type="checkbox"]):not([type="radio"]),
.dashboard .shop-workspace select,
.dashboard .shop-workspace textarea,
.shop-product-dialog input:not([type="checkbox"]):not([type="radio"]),
.shop-product-dialog select,
.shop-product-dialog textarea {
  border-color: #c8d5dc;
  color: #17202b;
  background: #fff;
  caret-color: #176b87;
}

.dashboard .shop-workspace input::placeholder,
.dashboard .shop-workspace textarea::placeholder,
.shop-product-dialog input::placeholder,
.shop-product-dialog textarea::placeholder {
  color: #7b8997;
  opacity: 1;
}

.dashboard .shop-workspace input:hover,
.dashboard .shop-workspace select:hover,
.dashboard .shop-workspace textarea:hover,
.shop-product-dialog input:hover,
.shop-product-dialog select:hover,
.shop-product-dialog textarea:hover {
  border-color: #6f929f;
}

.dashboard .shop-workspace input:focus-visible,
.dashboard .shop-workspace select:focus-visible,
.dashboard .shop-workspace textarea:focus-visible,
.shop-product-dialog input:focus-visible,
.shop-product-dialog select:focus-visible,
.shop-product-dialog textarea:focus-visible {
  border-color: #176b87;
  outline: 3px solid rgba(23, 107, 135, 0.18);
  outline-offset: 1px;
}

.dashboard .shop-workspace option,
.shop-product-dialog option {
  color: #17202b;
  background: #fff;
}

.shop-hero {
  position: relative;
  display: flex;
  justify-content: space-between;
  gap: 28px;
  overflow: hidden;
  padding: 28px 30px;
  border-radius: 12px;
  background:
    linear-gradient(110deg, rgba(255, 255, 255, 0.06), transparent 42%),
    #172733;
  color: #fff;
  box-shadow: 0 12px 35px rgba(22, 38, 50, 0.14);
}

.shop-hero::after {
  position: absolute;
  right: 24%;
  bottom: -44px;
  width: 210px;
  height: 90px;
  border: 12px solid rgba(255, 255, 255, 0.06);
  border-right: 0;
  border-radius: 80px 0 0 0;
  content: "";
  transform: skewX(-24deg);
}

.shop-hero > * {
  position: relative;
  z-index: 1;
}

.shop-eyebrow {
  margin: 0 0 8px;
  color: #79c8dc;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.shop-hero h2 {
  margin: 0;
  font-size: clamp(25px, 3vw, 36px);
  letter-spacing: -0.035em;
}

.shop-hero > div:first-child > p:last-child {
  max-width: 620px;
  margin: 10px 0 0;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.6;
}

.shop-hero-state {
  align-self: center;
  display: grid;
  grid-template-columns: 12px auto;
  gap: 11px;
  align-items: center;
  min-width: 156px;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.07);
}

.shop-hero-state > span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #f5a657;
  box-shadow: 0 0 0 5px rgba(245, 166, 87, 0.13);
}

.shop-hero-state.is-enabled > span {
  background: #4fd1a2;
  box-shadow: 0 0 0 5px rgba(79, 209, 162, 0.14);
}

.shop-hero-state small,
.shop-hero-state strong {
  display: block;
}

.shop-hero-state small {
  color: rgba(255, 255, 255, 0.62);
  font-size: 12px;
}

.shop-hero-state strong {
  margin-top: 3px;
  font-size: 15px;
}

.shop-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  margin-top: 14px;
  border: 1px solid var(--shop-line);
  border-radius: 10px;
  background: var(--shop-line);
}

.shop-stat {
  min-width: 0;
  padding: 16px 18px;
  background: #fff;
}

.shop-stat span,
.shop-stat strong,
.shop-stat small {
  display: block;
}

.shop-stat span {
  color: #64748b;
  font-size: 12px;
}

.shop-stat strong {
  margin-top: 7px;
  overflow-wrap: anywhere;
  font-size: 24px;
  letter-spacing: -0.03em;
}

.shop-stat small {
  margin-top: 4px;
  color: #8a96a6;
}

.shop-tab-list {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  margin-top: 16px;
  padding: 5px;
  border: 1px solid var(--shop-line);
  border-radius: 10px;
  background: #fff;
  scrollbar-width: thin;
}

.shop-tab-list button {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 7px;
  align-items: center;
  justify-content: center;
  min-width: 130px;
  min-height: 42px;
  margin: 0;
  background: transparent;
  color: #526170;
}

.shop-tab-list button.active {
  background: var(--shop-ink);
  color: #fff;
}

.shop-tab-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 21px;
  height: 21px;
  padding: 0 6px;
  border-radius: 999px;
  background: #e9eef2;
  color: #44515f;
  font-size: 11px;
  font-weight: 800;
}

.shop-tab-list button.active .shop-tab-count {
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
}

.shop-global-status {
  min-height: 0;
  margin: 10px 2px 0;
}

.shop-global-status:empty {
  display: none;
}

.shop-pane {
  margin-top: 12px;
  padding: 22px;
  border: 1px solid var(--shop-line);
  border-radius: 12px;
  background: #fff;
}

.shop-pane-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  margin-bottom: 18px;
}

.shop-pane-head h3,
.shop-sku-editor h3 {
  margin: 0;
  font-size: 18px;
}

.shop-pane-head p {
  margin: 6px 0 0;
  color: #667586;
  line-height: 1.5;
}

.shop-pane-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.shop-import-panel {
  display: grid;
  gap: 12px;
  margin: 0 0 16px;
  padding: 14px;
  border: 1px solid #dbe3ea;
  border-radius: 8px;
  background: #f7fafc;
}

.shop-import-panel header {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: start;
}

.shop-import-panel h4 {
  margin: 0 0 4px;
  font-size: 15px;
}

.shop-import-panel p,
.shop-import-panel ul {
  margin: 0;
  color: #5d6b7a;
  line-height: 1.6;
}

.shop-import-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.shop-import-summary span {
  padding: 5px 8px;
  border: 1px solid #d6e1ea;
  border-radius: 6px;
  background: #fff;
  color: #2c3a47;
  font-size: 12px;
  font-weight: 700;
}

.shop-import-products {
  display: grid;
  gap: 8px;
  max-height: 320px;
  overflow: auto;
}

.shop-import-product {
  padding: 10px;
  border: 1px solid #e1e8ee;
  border-radius: 8px;
  background: #fff;
}

.shop-import-product strong,
.shop-import-product small {
  display: block;
}

.shop-import-product small {
  margin-top: 3px;
  color: #667586;
}

.shop-compact-filter {
  flex: 0 0 180px;
  margin: 0;
  color: #667586;
  font-size: 12px;
}

.shop-compact-filter select {
  width: 100%;
  margin-top: 5px;
}

.shop-product-list,
.shop-order-list,
.shop-after-sale-list {
  display: grid;
  gap: 12px;
}

.shop-product-card {
  display: grid;
  grid-template-columns: 94px minmax(190px, 1.15fr) minmax(220px, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 16px;
  border: 1px solid var(--shop-line);
  border-radius: 10px;
  background: #fcfdfe;
}

.shop-product-image {
  display: grid;
  place-items: center;
  width: 94px;
  height: 94px;
  overflow: hidden;
  border: 1px solid #dfe5e9;
  border-radius: 8px;
  background: var(--shop-soft);
  color: #82909e;
  font-size: 12px;
  text-align: center;
}

.shop-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.shop-product-main,
.shop-product-stock {
  min-width: 0;
}

.shop-product-main > div:first-child,
.shop-order-title,
.shop-after-sale-title {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.shop-product-main strong {
  font-size: 16px;
}

.shop-product-main p,
.shop-product-main small {
  display: block;
  margin: 6px 0 0;
  color: #6a7887;
  line-height: 1.45;
}

.shop-status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #edf1f4;
  color: #50606f;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.shop-status-pill.is-good { background: #e7f5ef; color: var(--shop-green); }
.shop-status-pill.is-warn { background: #fff2e6; color: #9a541e; }
.shop-status-pill.is-bad { background: #fbeae8; color: var(--shop-red); }
.shop-status-pill.is-info { background: #e6f2f6; color: #155f77; }

.shop-stock-lines {
  display: grid;
  gap: 5px;
}

.shop-stock-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 9px;
  align-items: baseline;
  color: #61707e;
  font-size: 12px;
}

.shop-stock-line span:first-child {
  overflow: hidden;
  color: var(--shop-ink);
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shop-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
  max-width: 220px;
}

.shop-product-gallery {
  grid-column: 1 / -1;
  display: flex;
  gap: 9px;
  overflow-x: auto;
  padding-top: 12px;
  border-top: 1px solid #e6ebef;
  scrollbar-width: thin;
}

.shop-product-thumb {
  flex: 0 0 82px;
  min-width: 0;
}

.shop-product-thumb img {
  display: block;
  width: 82px;
  height: 62px;
  border: 1px solid #dfe5e9;
  border-radius: 7px;
  background: var(--shop-soft);
  object-fit: cover;
}

.shop-product-thumb > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px;
  margin-top: 4px;
}

.shop-product-thumb button,
.shop-product-thumb span {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 25px;
  margin: 0;
  padding: 2px 4px;
  border-radius: 5px;
  font-size: 10px;
  line-height: 1.2;
}

.shop-product-thumb span {
  background: #e6f2f6;
  color: #155f77;
  font-weight: 800;
}

.shop-card-actions button,
.shop-card-actions .link-button {
  min-width: 76px;
  min-height: 36px;
  margin: 0;
  padding: 0 11px;
  font-size: 12px;
}

.shop-order-card,
.shop-after-sale-card {
  border: 1px solid var(--shop-line);
  border-radius: 10px;
  background: #fcfdfe;
}

.shop-order-head,
.shop-after-sale-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border-bottom: 1px solid #e6ebef;
}

.shop-order-title strong,
.shop-after-sale-title strong {
  font-size: 14px;
}

.shop-order-head small,
.shop-after-sale-head small {
  display: block;
  margin-top: 5px;
  color: #788593;
}

.shop-order-amount {
  flex: 0 0 auto;
  text-align: right;
}

.shop-order-amount strong {
  display: block;
  margin-top: 7px;
  font-size: 18px;
}

.shop-order-body,
.shop-after-sale-body {
  display: grid;
  grid-template-columns: minmax(240px, 1.15fr) minmax(220px, 1fr);
  gap: 20px;
  padding: 16px;
}

.shop-order-items {
  display: grid;
  gap: 8px;
}

.shop-order-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  color: #53616f;
  font-size: 13px;
}

.shop-order-item strong,
.shop-order-item span {
  display: block;
}

.shop-order-item span {
  margin-top: 3px;
  color: #84909c;
  font-size: 12px;
}

.shop-address,
.shop-after-sale-facts {
  padding: 12px;
  border-radius: 8px;
  background: var(--shop-soft);
  color: #4f5e6b;
  font-size: 13px;
  line-height: 1.6;
}

.shop-address strong {
  color: var(--shop-ink);
}

.shop-pickup-code {
  color: var(--shop-ink);
  font-size: 16px;
  letter-spacing: 2px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.shop-ship-form,
.shop-after-sale-actions {
  display: grid;
  grid-template-columns: minmax(130px, 0.8fr) minmax(160px, 1fr) auto;
  gap: 8px;
  align-items: end;
  margin: 0 16px 16px;
  padding-top: 14px;
  border-top: 1px solid #e6ebef;
}

.shop-ship-form label,
.shop-after-sale-actions label {
  margin: 0;
  color: #677584;
  font-size: 12px;
}

.shop-ship-form select,
.shop-ship-form input,
.shop-after-sale-actions textarea {
  width: 100%;
  margin-top: 5px;
}

.shop-ship-form button,
.shop-after-sale-actions button {
  min-height: 42px;
  margin: 0;
}

.shop-shipment-note {
  margin: 0 16px 16px;
  padding: 10px 12px;
  border-radius: 7px;
  background: #edf5f7;
  color: #356271;
  font-size: 12px;
  line-height: 1.55;
}

.shop-shipment-note.is-error {
  background: #fff0ed;
  color: #973a30;
}

.shop-pickup-action {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  margin: 0 16px 16px;
  padding: 13px 14px;
  border-radius: 8px;
  background: #edf6f2;
  color: #326652;
}

.shop-pickup-action p { margin: 0; line-height: 1.5; }
.shop-pickup-action button { flex: 0 0 auto; margin: 0; }

.shop-after-sale-actions {
  grid-template-columns: minmax(220px, 1fr) auto auto;
}

.shop-after-sale-facts dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px 16px;
  margin: 0;
}

.shop-after-sale-facts dt {
  color: #7a8794;
  font-size: 11px;
}

.shop-after-sale-facts dd {
  margin: 2px 0 0;
  color: var(--shop-ink);
  font-weight: 700;
  overflow-wrap: anywhere;
}

.shop-settings-form {
  display: grid;
  gap: 18px;
}

.shop-pickup-settings {
  display: grid;
  gap: 12px;
}

.shop-pickup-settings fieldset {
  min-width: 0;
  margin: 0;
  padding: 14px 16px 16px;
  border: 1px solid #dbe4e8;
  border-radius: 9px;
}

.shop-pickup-settings legend { padding: 0 6px; color: #405463; font-weight: 750; }
.shop-pickup-store-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.shop-pickup-store-options > label { display: flex; gap: 10px; align-items: flex-start; margin: 0; padding: 11px; border-radius: 8px; background: #f4f8f9; }
.shop-pickup-store-options input { margin-top: 3px; }
.shop-pickup-store-options span,
.shop-pickup-store-options strong,
.shop-pickup-store-options small { display: block; }
.shop-pickup-store-options small { margin-top: 3px; color: #677584; line-height: 1.4; }
.shop-pickup-store-options > p { grid-column: 1 / -1; margin: 0; color: #8a5a27; }

.shop-setting-toggle {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  padding: 16px;
  border: 1px solid #dbe4e8;
  border-radius: 9px;
  background: #f4f8f9;
}

.shop-setting-toggle strong,
.shop-setting-toggle span {
  display: block;
}

.shop-setting-toggle span {
  margin-top: 5px;
  color: #677584;
  font-size: 13px;
}

.shop-switch {
  display: flex;
  flex: 0 0 auto;
  gap: 9px;
  align-items: center;
  margin: 0;
  cursor: pointer;
}

.shop-switch input {
  position: absolute;
  opacity: 0;
}

.shop-switch > span {
  position: relative;
  width: 46px;
  height: 26px;
  margin: 0;
  border-radius: 999px;
  background: #bac4cc;
  transition: background 160ms ease;
}

.shop-switch > span::after {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(23, 32, 43, 0.26);
  content: "";
  transition: transform 160ms ease;
}

.shop-switch input:checked + span { background: var(--shop-green); }
.shop-switch input:checked + span::after { transform: translateX(20px); }
.shop-switch input:focus-visible + span { outline: 3px solid rgba(237, 122, 42, 0.38); outline-offset: 3px; }
.shop-switch em { color: #465664; font-size: 13px; font-style: normal; }

.shop-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px;
}

.shop-form-grid label {
  min-width: 0;
  margin: 0;
}

.shop-form-grid input,
.shop-form-grid select,
.shop-form-grid textarea {
  width: 100%;
  margin-top: 6px;
}

.shop-fulfillment-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  padding: 14px 16px;
  border: 1px solid #d8e2e6;
  border-radius: 12px;
}

.shop-fulfillment-options legend { padding: 0 6px; color: #203947; font-weight: 750; }
.shop-fulfillment-options label { display: inline-flex; align-items: center; gap: 8px; }
.shop-fulfillment-options input { width: auto; margin: 0; }
.shop-fulfillment-options small { flex-basis: 100%; color: #657681; }

.shop-form-wide { grid-column: 1 / -1; }

.shop-readiness {
  padding: 12px 14px;
  border: 1px solid #e1bd97;
  border-radius: 5px;
  background: #fff6ed;
  color: #83502a;
  line-height: 1.5;
}

.shop-readiness.is-ready {
  border-color: #8fcbb4;
  background: #eaf6f1;
  color: #25634f;
}

.shop-form-actions {
  display: flex;
  justify-content: flex-end;
}

.shop-product-dialog {
  width: min(920px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  padding: 0;
  border: 0;
  border-radius: 13px;
  color: var(--shop-ink, #17202b);
  box-shadow: 0 28px 80px rgba(18, 29, 38, 0.35);
}

.shop-product-dialog::backdrop {
  background: rgba(12, 23, 31, 0.58);
  backdrop-filter: blur(3px);
}

.shop-product-dialog form {
  overflow: auto;
  max-height: calc(100vh - 32px);
  padding: 24px;
}

.shop-product-dialog header,
.shop-product-dialog footer,
.shop-sku-editor > div:first-child {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}

.shop-product-dialog header {
  margin-bottom: 20px;
}

.shop-product-dialog header p {
  margin: 0 0 5px;
  color: #6c7a87;
  font-size: 12px;
}

.shop-product-dialog header h2 { margin: 0; }
.shop-product-dialog footer { margin-top: 20px; justify-content: flex-end; }
.shop-product-dialog footer button { min-width: 110px; }

.shop-sku-editor {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid #dfe5e9;
}

.shop-sku-labels,
.shop-sku-row {
  display: grid;
  grid-template-columns: minmax(150px, 1.4fr) minmax(110px, 0.75fr) minmax(100px, 0.65fr) minmax(100px, 0.65fr) 74px;
  gap: 9px;
  align-items: center;
}

.shop-sku-labels {
  margin-top: 14px;
  padding: 0 8px 6px;
  color: #7a8794;
  font-size: 11px;
}

.shop-sku-row {
  padding: 8px;
  border-top: 1px solid #e8ecef;
}

.shop-sku-row input,
.shop-sku-row select,
.shop-sku-row button {
  width: 100%;
  min-width: 0;
  margin: 0;
}

.shop-empty-state {
  padding: 34px 22px;
  border: 1px dashed #cdd7dd;
  border-radius: 9px;
  background: #fafcfd;
  color: #6f7d8b;
  text-align: center;
  line-height: 1.6;
}

@media (min-width: 1100px) {
  .shop-workspace {
    --shop-ink: #e8f1ff;
    --shop-slate: #a6b7cb;
    --shop-line: #1c3553;
    --shop-soft: #081425;
    --shop-blue: #62c6e5;
    --shop-orange: #ffc778;
    --shop-green: #83e3bd;
    --shop-red: #ffaaa5;
    color: var(--shop-ink);
    color-scheme: dark;
  }

  .shop-hero {
    border: 1px solid var(--shop-line);
    background: #0d1c31;
    box-shadow: none;
  }

  .shop-hero::after {
    border-color: rgba(34, 200, 214, 0.08);
  }

  .shop-hero > div:first-child > p:last-child {
    color: #b5c5d8;
  }

  .shop-stats,
  .dashboard .shop-workspace .shop-tab-list {
    border-color: var(--shop-line);
    background: var(--shop-line);
  }

  .shop-stat {
    background: #0d1c31;
  }

  .shop-stat span,
  .shop-stat small,
  .shop-pane-head p,
  .shop-product-main p,
  .shop-product-main small,
  .shop-order-head small,
  .shop-after-sale-head small,
  .shop-order-item span,
  .shop-compact-filter,
  .shop-ship-form label,
  .shop-after-sale-actions label,
  .shop-after-sale-facts dt,
  .shop-pickup-store-options small,
  .shop-setting-toggle span,
  .shop-fulfillment-options small,
  .shop-switch em,
  .shop-sku-labels,
  .shop-product-dialog header p {
    color: var(--shop-slate);
  }

  .dashboard .shop-workspace strong,
  .shop-pane-head h3,
  .shop-sku-editor h3,
  .shop-product-dialog h2,
  .shop-product-dialog strong {
    color: var(--shop-ink);
  }

  .dashboard .shop-workspace .shop-tab-list {
    background: #081425;
  }

  .dashboard .shop-workspace .shop-tab-list button,
  .dashboard .shop-workspace .shop-tab-list button:not(.secondary):not(.danger) {
    color: #a6b7cb;
    background: transparent;
  }

  .dashboard .shop-workspace .shop-tab-list button:hover,
  .dashboard .shop-workspace .shop-tab-list button:not(.secondary):not(.danger):hover {
    color: #ffffff;
    background: #102a47;
  }

  .dashboard .shop-workspace .shop-tab-list button.active,
  .dashboard .shop-workspace .shop-tab-list button.active:not(.secondary):not(.danger) {
    color: #ffffff;
    background: #0f63d8;
  }

  .shop-tab-count {
    color: #d6e5f7;
    background: #172b44;
  }

  .shop-tab-list button.active .shop-tab-count {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.18);
  }

  .shop-pane {
    border-color: var(--shop-line);
    background: #0b192b;
  }

  .shop-import-panel,
  .shop-import-summary span,
  .shop-import-product,
  .shop-product-card,
  .shop-order-card,
  .shop-after-sale-card,
  .shop-setting-toggle,
  .shop-pickup-store-options > label {
    border-color: #28415f;
    background: #0d1c31;
  }

  .shop-import-panel p,
  .shop-import-panel ul,
  .shop-import-product small {
    color: var(--shop-slate);
  }

  .shop-import-summary span {
    color: #d6e5f7;
  }

  .shop-product-image,
  .shop-product-thumb img {
    border-color: #28415f;
    color: #91a6c2;
    background: #081425;
  }

  .shop-product-gallery,
  .shop-order-head,
  .shop-after-sale-head,
  .shop-ship-form,
  .shop-after-sale-actions,
  .shop-sku-editor,
  .shop-sku-row {
    border-color: #243e5d;
  }

  .shop-product-main p,
  .shop-product-main small,
  .shop-stock-line,
  .shop-order-item {
    color: #a6b7cb;
  }

  .shop-status-pill {
    color: #c6d5e7;
    background: #172b44;
  }

  .shop-status-pill.is-good {
    color: #83e3bd;
    background: #123c32;
  }

  .shop-status-pill.is-warn {
    color: #ffc778;
    background: #3a2b17;
  }

  .shop-status-pill.is-bad {
    color: #ffaaa5;
    background: #3e2024;
  }

  .shop-status-pill.is-info,
  .shop-product-thumb span {
    color: #8bdaf1;
    background: #102f46;
  }

  .shop-address,
  .shop-after-sale-facts {
    color: #b8c7d8;
    background: #081425;
  }

  .shop-shipment-note {
    color: #9fdbeb;
    background: #102f46;
  }

  .shop-shipment-note.is-error {
    color: #ffb6b0;
    background: #3e2024;
  }

  .shop-pickup-action {
    color: #a9e8cf;
    background: #123c32;
  }

  .shop-pickup-settings fieldset,
  .shop-fulfillment-options {
    border-color: #28415f;
  }

  .shop-pickup-settings legend,
  .shop-fulfillment-options legend {
    color: #d6e5f7;
  }

  .shop-switch > span {
    background: #405773;
  }

  .shop-switch input:focus-visible + span {
    outline-color: rgba(22, 119, 255, 0.55);
  }

  .shop-readiness,
  .shop-readiness.is-ready {
    border: 1px solid #66502d;
    color: #ffd694;
    background: #332713;
  }

  .shop-readiness.is-ready {
    border-color: #27624f;
    color: #a9e8cf;
    background: #123c32;
  }

  .shop-empty-state {
    border-color: #36506d;
    color: #9fb0c7;
    background: #081425;
  }

  .dashboard .shop-workspace input:not([type="checkbox"]):not([type="radio"]),
  .dashboard .shop-workspace select,
  .dashboard .shop-workspace textarea,
  .shop-product-dialog input:not([type="checkbox"]):not([type="radio"]),
  .shop-product-dialog select,
  .shop-product-dialog textarea {
    border-color: #36506d;
    color: #e8f1ff;
    background: #081425;
    caret-color: #62c6e5;
  }

  .dashboard .shop-workspace input::placeholder,
  .dashboard .shop-workspace textarea::placeholder,
  .shop-product-dialog input::placeholder,
  .shop-product-dialog textarea::placeholder {
    color: #91a6c2;
  }

  .dashboard .shop-workspace input:hover,
  .dashboard .shop-workspace select:hover,
  .dashboard .shop-workspace textarea:hover,
  .shop-product-dialog input:hover,
  .shop-product-dialog select:hover,
  .shop-product-dialog textarea:hover {
    border-color: #4b739f;
  }

  .dashboard .shop-workspace input:focus-visible,
  .dashboard .shop-workspace select:focus-visible,
  .dashboard .shop-workspace textarea:focus-visible,
  .shop-product-dialog input:focus-visible,
  .shop-product-dialog select:focus-visible,
  .shop-product-dialog textarea:focus-visible {
    border-color: #1677ff;
    outline-color: rgba(22, 119, 255, 0.42);
  }

  .dashboard .shop-workspace option,
  .shop-product-dialog option {
    color: #e8f1ff;
    background: #081425;
  }

  .dashboard .shop-workspace button.danger,
  .shop-product-dialog button.danger {
    border: 1px solid #6f3037;
    color: #ffb0aa;
    background: #32171d;
  }

  .dashboard .shop-workspace button.danger:hover,
  .shop-product-dialog button.danger:hover {
    border-color: #94505a;
    color: #ffd0cc;
    background: #482027;
  }

  .shop-product-dialog {
    --shop-ink: #e8f1ff;
    --shop-line: #1c3553;
    color: #e8f1ff;
    color-scheme: dark;
    background: #0b192b;
  }

  .shop-product-dialog button.secondary {
    border: 1px solid #294767;
    color: #d6e5f7;
    background: #10233a;
  }
}

@media (max-width: 1100px) {
  .shop-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .shop-product-card { grid-template-columns: 84px minmax(0, 1fr) minmax(190px, 0.9fr); }
  .shop-product-image { width: 84px; height: 84px; }
  .shop-card-actions { grid-column: 2 / -1; justify-content: flex-start; max-width: none; }
}

@media (max-width: 760px) {
  .shop-workspace { margin-top: 12px; }
  .shop-hero { padding: 22px 18px; border-radius: 9px; }
  .shop-hero-state { align-self: flex-start; min-width: 132px; padding: 11px; }
  .shop-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shop-stat:last-child { grid-column: 1 / -1; }
  .shop-tab-list button { min-width: 118px; }
  .shop-pane { padding: 16px; }
  .shop-pane-head { align-items: flex-start; }
  .shop-product-card { grid-template-columns: 72px minmax(0, 1fr); gap: 12px; }
  .shop-product-image { width: 72px; height: 72px; }
  .shop-product-stock, .shop-card-actions { grid-column: 1 / -1; }
  .shop-order-body, .shop-after-sale-body { grid-template-columns: 1fr; gap: 12px; }
  .shop-ship-form { grid-template-columns: 1fr 1fr; }
  .shop-ship-form button { grid-column: 1 / -1; }
  .shop-after-sale-actions { grid-template-columns: 1fr 1fr; }
  .shop-after-sale-actions label { grid-column: 1 / -1; }
  .shop-setting-toggle { align-items: flex-start; }
  .shop-pickup-store-options { grid-template-columns: 1fr; }
  .shop-pickup-action { align-items: flex-start; }
}

@media (max-width: 560px) {
  .shop-hero { display: grid; }
  .shop-hero-state { width: 100%; }
  .shop-stats { grid-template-columns: 1fr 1fr; }
  .shop-stat { padding: 13px; }
  .shop-stat strong { font-size: 20px; }
  .shop-pane-head { display: grid; }
  .shop-pane-head > button, .shop-compact-filter { width: 100%; }
  .shop-order-head, .shop-after-sale-head { display: grid; }
  .shop-order-amount { text-align: left; }
  .shop-form-grid { grid-template-columns: 1fr; }
  .shop-form-wide { grid-column: auto; }
  .shop-setting-toggle { display: grid; }
  .shop-pickup-action { display: grid; }
  .shop-pickup-action button { width: 100%; }
  .shop-ship-form, .shop-after-sale-actions { grid-template-columns: 1fr; }
  .shop-ship-form button, .shop-after-sale-actions label { grid-column: auto; }
  .shop-after-sale-actions button { width: 100%; }
  .shop-after-sale-facts dl { grid-template-columns: 1fr; }
  .shop-product-dialog { width: calc(100vw - 18px); max-height: calc(100vh - 18px); }
  .shop-product-dialog form { max-height: calc(100vh - 18px); padding: 18px 14px; }
  .shop-sku-labels { display: none; }
  .shop-sku-row { grid-template-columns: 1fr 1fr; margin-top: 10px; padding: 12px 0; }
  .shop-sku-row .shop-sku-label { grid-column: 1 / -1; }
  .shop-sku-row button { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  .shop-switch > span,
  .shop-switch > span::after { transition: none; }
}