:root{
  --bg:#08031f;
  --panel:#11142a;
  --text:#fff;
  --muted:#b8bad0;
  --line:rgba(255,255,255,.1);
  --lime:#7cff4e;
  --purple:#9d42ff;
  --teal:#11d6cb;
}
*{box-sizing:border-box}
body{
  margin:0;
  min-height:100vh;
  font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;
  background:radial-gradient(circle at 15% 10%,rgba(124,255,78,.12),transparent 25%),linear-gradient(180deg,#08031f,#050218);
  color:var(--text);
}
a{color:inherit;text-decoration:none}
.sidebar{
  position:fixed;
  inset:0 auto 0 0;
  width:260px;
  padding:24px;
  background:rgba(10,8,35,.86);
  border-right:1px solid var(--line);
}
.brand{display:block;margin-bottom:28px}
.brand strong{display:block;font-size:1.8rem;color:var(--lime)}
.brand span{color:#ffbf1c;font-weight:800}
.sidebar nav{display:grid;gap:8px}
.sidebar nav a{
  padding:13px 14px;
  border-radius:14px;
  color:var(--muted);
  font-weight:800;
}
.sidebar nav a:hover,.sidebar nav a.is-active{
  background:linear-gradient(90deg,rgba(124,255,78,.14),rgba(157,66,255,.14));
  color:#fff;
}
.main{margin-left:260px;padding:28px}
.topbar{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
  margin-bottom:26px;
}
.topbar h1{margin:0;font-size:2rem}
.topbar p{margin:6px 0 0;color:var(--muted)}
.logout,.admin-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 16px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  font-weight:900;
}
.admin-btn{background:linear-gradient(90deg,var(--lime),var(--teal),var(--purple));color:#08101a}
.admin-btn.ghost{background:rgba(255,255,255,.08);color:#fff}
.grid{display:grid;gap:18px}
.cards{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:22px}
.card,.panel{
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04));
  border:1px solid var(--line);
  border-radius:24px;
  padding:22px;
  box-shadow:0 18px 44px rgba(0,0,0,.22);
}
.card span{display:block;color:var(--muted);font-weight:800}
.card strong{display:block;font-size:2.2rem;margin-top:8px}
.panel-head{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
}
.panel h2{margin-top:0}
table{width:100%;border-collapse:collapse}
th,td{
  text-align:left;
  padding:13px 10px;
  border-bottom:1px solid var(--line);
  vertical-align:top;
}
th{color:var(--muted);font-size:.82rem;text-transform:uppercase;letter-spacing:.08em}
.admin-form{display:grid;gap:18px}
.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.admin-form label{
  display:grid;
  gap:8px;
  color:var(--muted);
  font-weight:900;
}
.admin-form input,.admin-form select,.admin-form textarea{
  width:100%;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.06);
  color:#fff;
  padding:13px 14px;
  font:inherit;
}
.checks{display:flex;gap:18px;flex-wrap:wrap}
.checks label{display:flex;align-items:center;gap:8px}
button{
  border:0;
  border-radius:999px;
  padding:12px 16px;
  font-weight:900;
  background:linear-gradient(90deg,var(--lime),var(--teal),var(--purple));
  color:#08101a;
  cursor:pointer;
}
.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.actions a,.actions button{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:#fff;
}
.actions form{margin:0}
.actions button.danger{background:rgba(255,80,80,.18);color:#ffb6b6}
.roadmap{display:grid;gap:10px;color:var(--muted)}
.merchant-map{
  width:100%;
  height:420px;
  border-radius:22px;
  overflow:hidden;
  border:1px solid var(--line);
}
.map-help{
  padding:14px;
  border-radius:18px;
  background:rgba(124,255,78,.08);
  border:1px solid rgba(124,255,78,.16);
}
.map-help p{margin:6px 0 0;color:var(--muted)}
.success,.error{
  padding:12px;
  border-radius:14px;
  margin-bottom:16px;
}
.success{background:rgba(124,255,78,.14);border:1px solid rgba(124,255,78,.24)}
.error{background:rgba(255,80,80,.15);border:1px solid rgba(255,80,80,.25)}
.login-body{display:grid;place-items:center;padding:24px}
.login-card{
  width:min(92vw,430px);
  padding:28px;
  border-radius:28px;
  background:var(--panel);
  border:1px solid var(--line);
}
.login-card h1{margin:0;color:var(--lime)}
.login-card p{color:var(--muted)}
.login-card label{display:grid;gap:8px;margin:16px 0;color:var(--muted);font-weight:800}
.login-card input{
  width:100%;
  min-height:48px;
  border-radius:14px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.06);
  color:#fff;
  padding:0 14px;
}
.login-card button{width:100%;margin-top:8px}
@media(max-width:900px){
  .sidebar{position:static;width:auto}
  .main{margin-left:0;padding:18px}
  .cards,.form-grid{grid-template-columns:1fr}
}

.hours-grid{
  display:grid;
  gap:12px;
  margin:16px 0;
}
.hours-row{
  display:grid;
  grid-template-columns:140px 1fr 1fr 120px;
  gap:12px;
  align-items:center;
  padding:12px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  background:#fff;
}
.hours-row label{
  display:grid;
  gap:4px;
}
.check-inline{
  display:flex !important;
  flex-direction:row !important;
  align-items:center;
  gap:8px !important;
}
@media(max-width:760px){
  .hours-row{
    grid-template-columns:1fr;
  }
}

/* Better merchant hours layout */
.hours-grid{
  display:grid;
  gap:10px;
  margin:16px 0 22px;
}

.hours-row{
  display:grid;
  grid-template-columns:140px minmax(150px,1fr) minmax(150px,1fr) 110px;
  gap:14px;
  align-items:end;
  padding:14px 16px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px;
  background:#fff;
}

.hours-row > strong{
  align-self:center;
  color:#17142a;
  font-size:.95rem;
}

.hours-row label{
  display:grid;
  gap:6px;
  color:#5f6070;
  font-size:.8rem;
  font-weight:800;
}

.hours-row input[type="time"]{
  width:100%;
  min-height:42px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.14);
  background:#fff;
  color:#151226;
  font-weight:800;
}

.hours-row .check-inline{
  display:flex !important;
  flex-direction:row !important;
  align-items:center;
  justify-content:flex-start;
  gap:8px !important;
  min-height:42px;
  color:#17142a;
  white-space:nowrap;
}

.hours-row .check-inline input{
  width:16px;
  height:16px;
}

@media(max-width:900px){
  .hours-row{
    grid-template-columns:1fr 1fr;
  }

  .hours-row > strong,
  .hours-row .check-inline{
    grid-column:1 / -1;
  }
}

@media(max-width:560px){
  .hours-row{
    grid-template-columns:1fr;
  }
}

.merchant-profile-grid {
  display: grid;
  grid-template-columns: minmax(320px, 520px) 1fr;
  gap: 22px;
  align-items: start;
}

.merchant-logo-preview {
  width: 110px;
  height: 110px;
  border-radius: 26px;
  overflow: hidden;
  display: grid;
  place-items: center;
  margin: 0 0 18px;
  background: linear-gradient(135deg, #22c55e, #7c3aed);
  color: #fff;
  font-size: 3rem;
  font-weight: 900;
}

.merchant-logo-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.address-list {
  display: grid;
  gap: 10px;
  margin: 16px 0 22px;
}

.address-card {
  width: 100%;
  text-align: left;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: inherit;
  cursor: pointer;
}

.address-card strong,
.address-card small {
  display: block;
}

.address-card span {
  display: inline-block;
  margin: 8px 0;
  padding: 4px 9px;
  border-radius: 999px;
  background: rgba(34,197,94,.16);
  color: #86efac;
  font-size: .76rem;
  font-weight: 900;
}

.merchant-alert {
  margin: 0 0 18px;
  padding: 14px 16px;
  border-radius: 16px;
  background: rgba(34,197,94,.14);
  border: 1px solid rgba(34,197,94,.3);
  color: #86efac;
  font-weight: 900;
}

@media (max-width: 920px) {
  .merchant-profile-grid {
    grid-template-columns: 1fr;
  }
}

/* Profile layout fix */
.merchant-profile-grid {
  display: grid !important;
  grid-template-columns: minmax(360px, 520px) minmax(420px, 1fr) !important;
  gap: 32px !important;
  align-items: start !important;
  max-width: 1180px;
}

.merchant-card {
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 24px;
  padding: 28px;
}

.merchant-form {
  display: grid !important;
  gap: 18px !important;
}

.merchant-form label {
  display: grid !important;
  gap: 8px !important;
  font-weight: 800;
  font-size: .92rem;
}

.merchant-form input,
.merchant-form textarea,
.merchant-form select {
  width: 100% !important;
  min-height: 44px;
  box-sizing: border-box;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 14px;
  background: rgba(255,255,255,.08);
  color: #fff;
  padding: 11px 13px;
  font: inherit;
}

.merchant-form textarea {
  min-height: 120px;
  resize: vertical;
}

.merchant-form small,
.muted {
  color: rgba(255,255,255,.68);
  line-height: 1.45;
}

.form-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  align-items: start;
}

.checkline {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.checkline input {
  width: auto !important;
  min-height: auto !important;
}

.merchant-btn {
  width: fit-content;
  border: 0;
  border-radius: 999px;
  padding: 13px 18px;
  font-weight: 900;
  cursor: pointer;
}

.merchant-btn.primary {
  background: linear-gradient(90deg, #61ff5f, #41d6ff, #9a5cff);
  color: #071018;
}

.merchant-logo-preview {
  width: 112px;
  height: 112px;
  border-radius: 26px;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #24d76b, #8b5cf6);
  color: #fff;
  font-size: 3rem;
  font-weight: 900;
}

.merchant-logo-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.address-list {
  display: grid;
  gap: 12px;
  margin: 18px 0 24px;
}

.address-card {
  width: 100%;
  text-align: left;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.07);
  color: #fff;
  border-radius: 18px;
  padding: 15px;
  cursor: pointer;
}

.address-card strong,
.address-card small {
  display: block;
}

.address-card span {
  display: inline-block;
  margin: 8px 0;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(34,197,94,.18);
  color: #8cff98;
  font-size: .75rem;
  font-weight: 900;
}

@media (max-width: 980px) {
  .merchant-profile-grid {
    grid-template-columns: 1fr !important;
  }

  .form-row {
    grid-template-columns: 1fr !important;
  }
}


.merchant-alert.error {
  background: rgba(239,68,68,.16);
  border-color: rgba(239,68,68,.35);
  color: #fecaca;
}


/* Menu item image previews */
.menu-image-upload-card {
  display: grid;
  gap: 14px;
  margin: 18px 0;
  padding: 16px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  background: rgba(255,255,255,.04);
}

.menu-image-preview {
  width: 180px;
  min-height: 140px;
  display: grid;
  gap: 8px;
  align-content: start;
}

.menu-image-preview img {
  width: 180px;
  height: 140px;
  object-fit: cover;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.14);
}

.menu-image-preview span {
  color: var(--muted, #94a3b8);
  font-size: .85rem;
}

.menu-image-preview.is-empty {
  width: 180px;
  height: 120px;
  place-items: center;
  border: 1px dashed rgba(255,255,255,.2);
  border-radius: 16px;
  color: var(--muted, #94a3b8);
}

.menu-item-thumb {
  width: 58px;
  height: 58px;
  display: inline-grid;
  place-items: center;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: var(--muted, #94a3b8);
}

/* Split-service hours */
.split-hours-list {
  display: grid;
  gap: 14px;
}

.split-hours-day {
  margin: 0;
}

.split-hours-day__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.split-hours-blocks {
  display: grid;
  gap: 12px;
}

.split-hours-block {
  display: grid;
  grid-template-columns: 120px minmax(120px, 1fr) minmax(120px, 1fr);
  gap: 12px;
  align-items: end;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: rgba(255,255,255,.03);
}

.split-hours-label {
  font-weight: 800;
}

.split-hours-label small {
  display: block;
  opacity: .65;
  font-weight: 600;
}

@media (max-width: 760px) {
  .split-hours-day__head,
  .split-hours-block {
    grid-template-columns: 1fr;
  }
}

/* Menu channel visibility badges */
.merchant-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  margin: 2px 3px 2px 0;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 800;
  background: rgba(0,255,157,.12);
  color: #00ff9d;
  border: 1px solid rgba(0,255,157,.22);
}

.merchant-badge.muted {
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.66);
  border-color: rgba(255,255,255,.12);
}

/* === Menu Item Editor Layout === */
.menu-item-editor {
  width: 100%;
}

.menu-item-layout {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr) minmax(220px, 280px);
  gap: 20px;
  align-items: start;
}

.menu-item-left,
.menu-item-right {
  position: sticky;
  top: 18px;
}

.menu-item-main {
  min-width: 0;
}

.menu-image-upload-card,
.menu-settings-card {
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 20px;
  padding: 16px;
  background: rgba(255,255,255,.035);
  box-shadow: 0 16px 34px rgba(0,0,0,.12);
}

.menu-image-upload-card strong,
.menu-settings-card strong {
  display: block;
  font-size: 1rem;
  margin-bottom: 4px;
}

.menu-image-preview {
  margin: 14px 0;
  border-radius: 18px;
  overflow: hidden;
  min-height: 180px;
  background: rgba(0,0,0,.20);
  border: 1px solid rgba(255,255,255,.10);
  display: grid;
  place-items: center;
  position: relative;
}

.menu-image-preview img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
}

.menu-image-preview span {
  display: inline-flex;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 800;
  background: rgba(0,0,0,.48);
  color: #fff;
}

.menu-image-preview:not(.is-empty) span {
  position: absolute;
  left: 10px;
  bottom: 10px;
}

.menu-image-preview.is-empty {
  color: rgba(255,255,255,.62);
  min-height: 180px;
}

.menu-settings-card__head {
  margin-bottom: 12px;
}

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

.menu-setting-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.08);
  cursor: pointer;
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.menu-setting-toggle:hover {
  transform: translateY(-1px);
  border-color: rgba(0,255,157,.28);
  background: rgba(0,255,157,.06);
}

.menu-setting-toggle input {
  width: 18px;
  height: 18px;
  accent-color: #00ff9d;
}

.menu-setting-toggle span {
  font-weight: 750;
  line-height: 1.2;
}

.menu-item-save-btn {
  margin-top: 14px;
}

@media (max-width: 1120px) {
  .menu-item-layout {
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  }

  .menu-item-right {
    grid-column: 1 / -1;
    position: static;
  }

  .menu-settings-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .menu-item-layout {
    grid-template-columns: 1fr;
  }

  .menu-item-left {
    position: static;
  }

  .menu-settings-list {
    grid-template-columns: 1fr;
  }
}

/* === Grouped Menu Index === */
.menu-category-group {
  margin-top: 22px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 20px;
  overflow: hidden;
  background: rgba(255,255,255,.025);
}

.menu-category-group__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 16px 18px;
  background: rgba(255,255,255,.045);
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.menu-category-group__head h3 {
  margin: 0;
  font-size: 1.05rem;
}

.menu-category-group__head span {
  display: inline-flex;
  padding: 5px 10px;
  border-radius: 999px;
  font-weight: 800;
  font-size: .82rem;
  color: #00ff9d;
  background: rgba(0,255,157,.10);
  border: 1px solid rgba(0,255,157,.20);
}

.menu-table-wrap {
  width: 100%;
  overflow-x: auto;
}

.menu-grouped-table {
  margin: 0;
}

.menu-grouped-table thead th {
  white-space: nowrap;
}

@media (max-width: 760px) {
  .menu-category-group__head {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Menu item option/combo builder */
.menu-config-builder {
  display: grid;
  gap: 18px;
  padding: 20px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.045);
  margin-top: 18px;
}

.menu-config-builder__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.menu-config-builder__head strong {
  display: block;
  font-size: 1.05rem;
  color: #fff;
}

.menu-option-groups,
.menu-options-list,
.menu-addons-list {
  display: grid;
  gap: 12px;
}

.menu-option-group {
  display: grid;
  gap: 14px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(0,0,0,.16);
}

.menu-option-group__top {
  display: grid;
  grid-template-columns: 1.4fr 1fr .8fr .55fr .55fr auto;
  gap: 12px;
  align-items: end;
}

.menu-option-row,
.menu-addon-row {
  display: grid;
  grid-template-columns: 1.5fr .7fr .7fr auto;
  gap: 10px;
  align-items: center;
}

.menu-option-row input,
.menu-addon-row input,
.menu-option-group__top input,
.menu-option-group__top select {
  min-height: 42px;
}

.inline-check {
  display: flex !important;
  align-items: center;
  gap: 8px !important;
  color: var(--muted);
  white-space: nowrap;
}

.inline-check input {
  width: 16px !important;
  min-height: auto !important;
}

button.mini,
.admin-btn.mini {
  min-height: 36px;
  padding: 8px 12px;
  font-size: .82rem;
}

button.danger.mini {
  background: rgba(255,80,80,.18);
  color: #ffb6b6;
}

@media(max-width: 960px) {
  .menu-option-group__top,
  .menu-option-row,
  .menu-addon-row {
    grid-template-columns: 1fr;
  }

  .menu-config-builder__head {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Linked existing item add-ons */
.menu-addon-row {
  grid-template-columns: .8fr 1.4fr 1.2fr .7fr .6fr auto;
}

.menu-addon-row select {
  min-height: 42px;
}

@media(max-width: 1120px) {
  .menu-addon-row {
    grid-template-columns: 1fr;
  }
}

/* Merchant Order Controls Phase 1 */
.merchant-orders-hero{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
}

.merchant-orders-hero p{
  margin:.35rem 0 0;
}

.merchant-order-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(90px,1fr));
  gap:10px;
}

.merchant-order-stats article{
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.055);
}

.merchant-order-stats span,
.merchant-order-stats strong{
  display:block;
}

.merchant-order-stats span{
  color:var(--muted);
  font-weight:800;
  font-size:.82rem;
}

.merchant-order-stats strong{
  margin-top:4px;
  font-size:1.6rem;
}

.merchant-order-tabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:18px 0;
}

.merchant-order-tabs button{
  background:rgba(255,255,255,.07);
  color:#fff;
  border:1px solid rgba(255,255,255,.10);
}

.merchant-order-tabs button.is-active{
  background:linear-gradient(90deg,var(--lime),var(--teal),var(--purple));
  color:#08101a;
}

.merchant-order-panel{
  display:none;
}

.merchant-order-panel.is-active{
  display:block;
}

.merchant-order-list{
  display:grid;
  gap:16px;
}

.merchant-order-card{
  border:1px solid rgba(255,255,255,.12);
  border-radius:24px;
  padding:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  box-shadow:0 18px 44px rgba(0,0,0,.2);
}

.merchant-order-card.status-pending{
  border-color:rgba(255,191,28,.35);
}

.merchant-order-card.status-accepted,
.merchant-order-card.status-preparing{
  border-color:rgba(17,214,203,.32);
}

.merchant-order-card.status-ready_for_pickup{
  border-color:rgba(124,255,78,.36);
}

.merchant-order-card header{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  margin-bottom:14px;
}

.merchant-order-card header strong,
.merchant-order-card header span{
  display:block;
}

.merchant-order-card header strong{
  font-size:1.2rem;
}

.merchant-order-card header span{
  color:var(--muted);
  margin-top:4px;
}

.merchant-order-badges{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.merchant-order-badges em{
  display:inline-flex;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(124,255,78,.13);
  color:#baff9f;
  font-style:normal;
  font-weight:900;
  font-size:.8rem;
}

.merchant-order-badges em.is-scheduled{
  background:rgba(157,66,255,.16);
  color:#dabdff;
}

.merchant-scheduled-banner{
  display:grid;
  gap:4px;
  margin:12px 0;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(157,66,255,.22);
  background:rgba(157,66,255,.10);
}

.merchant-scheduled-banner span{
  color:var(--muted);
}

.merchant-order-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin:14px 0;
}

.merchant-order-grid div{
  padding:12px;
  border-radius:16px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.08);
}

.merchant-order-grid span,
.merchant-order-grid strong{
  display:block;
}

.merchant-order-grid span{
  color:var(--muted);
  font-size:.78rem;
  font-weight:900;
}

.merchant-order-grid strong{
  margin-top:5px;
}

.merchant-order-details{
  margin:12px 0;
  padding:12px 0;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
}

.merchant-order-details summary{
  cursor:pointer;
  color:#8cff98;
  font-weight:900;
}

.merchant-order-detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin-top:14px;
}

.merchant-order-detail-grid h4{
  margin:.2rem 0;
}

.merchant-order-detail-grid p{
  margin:.35rem 0;
  color:var(--muted);
}

.merchant-order-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:end;
  margin-top:14px;
}

.merchant-order-actions form{
  margin:0;
}

.merchant-inline-action{
  display:flex;
  gap:8px;
  align-items:end;
  flex-wrap:wrap;
}

.merchant-inline-action label{
  display:grid;
  gap:5px;
  color:var(--muted);
  font-size:.78rem;
  font-weight:900;
}

.merchant-inline-action select,
.merchant-inline-action input{
  min-height:42px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(255,255,255,.07);
  color:#fff;
  padding:0 13px;
}

.merchant-inline-action input{
  min-width:220px;
}

.merchant-order-actions button.danger{
  background:rgba(255,80,80,.18);
  color:#ffb6b6;
}

.merchant-orders-empty{
  padding:26px;
}

.cards{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

@media(max-width:1100px){
  .merchant-orders-hero{
    display:grid;
  }

  .merchant-order-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .cards{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:700px){
  .merchant-order-stats,
  .merchant-order-tabs,
  .merchant-order-grid,
  .merchant-order-detail-grid,
  .cards{
    grid-template-columns:1fr;
  }

  .merchant-order-card header{
    display:grid;
  }

  .merchant-order-badges{
    justify-content:flex-start;
  }

  .merchant-inline-action,
  .merchant-order-actions,
  .merchant-order-actions form,
  .merchant-inline-action input,
  .merchant-inline-action select,
  .merchant-order-actions button{
    width:100%;
  }
}

/* Merchant order action disabled/processing state */
button.is-processing,
form.is-processing button,
.vk-btn-preparing[disabled],
button[disabled]{
  opacity:.55;
  cursor:not-allowed;
  filter:saturate(.7);
}

.vk-order-preparing-note,
.merchant-order-notice{
  margin:10px 0;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(124,255,78,.10);
  border:1px solid rgba(124,255,78,.25);
  color:#dfffcc;
  font-weight:800;
}