:root{
  --font-main:-apple-system,BlinkMacSystemFont,'Roboto',system-ui,sans-serif;

  --color-bg:#F9FAFB;
  --color-surface:#fff;
  --color-surface-2:#f3f4f6;

  --color-text:#1F2937;
  --color-text-muted:#4b5563;
  --color-border:#e5e7eb;

  --color-primary:#f97316;
  --color-primary-hover:#ea580c;
  --on-primary:#fff;
  --shop-buy:#f97316;
  --shop-buy-hover:#ea580c;
  --shop-buy-text:#fff;

  --primary-14:rgba(249,115,22,.14);
  --primary-25:rgba(249,115,22,.25);
  --primary-45:rgba(249,115,22,.45);
  --primary-12:rgba(249,115,22,.12);

  --overlay-bg:rgba(0,0,0,.35);

  --shadow-sm:0 4px 6px -1px rgba(0,0,0,.10);
  --shadow-md:0 14px 34px rgba(15,23,42,.18);
  --shop-hover-dark:rgba(0,0,0,.06);

  --radius-lg:16px;
  --radius-md:12px;

  --header-height:50px;

  /* ✅ единые имена (как у тебя в layout+js) */
  --sidebar-width:200px;
  --sidebar-collapsed:60px;

  --ease-smooth:cubic-bezier(.2,.8,.2,1);
  --dur-fast:220ms;
  --dur-med:340ms;

  --column-scroll-pad:200px;
  --column-bottom-gap:32px;
  --admin-mobile-nav-h:50px;
  --admin-mobile-nav-gap:2px;
  --admin-mobile-nav-bottom-gap:0px;
  --admin-mobile-rail-gap:12px;
  --admin-mobile-shell-top-radius:22px;
  --admin-mobile-shell-handle-zone-h:0px;
  --admin-mobile-shell-collapsed-visible-h:0px;
  --admin-mobile-shell-handle-bar-w:72px;
  --admin-mobile-shell-handle-bar-h:6px;
  --mobile-pwa-bottom-lift:0px;
  --admin-mobile-shell-live-offset:0px;
  --admin-mobile-shell-visible-height:calc((var(--admin-mobile-nav-h) * 2) + var(--admin-mobile-nav-gap));
  --admin-mobile-shell-snap-duration:460ms;
  --admin-mobile-shell-snap-ease:cubic-bezier(.22,1,.36,1);
  --admin-mobile-shell-fade-duration:300ms;
  --admin-mobile-shell-fade-ease:cubic-bezier(.2,.8,.2,1);

  /* ✅ Switch vars */
  --switch-w:40px;
  --switch-h:25px;
  --switch-pad:3px;
  --switch-on:var(--color-primary);
  --switch-off-bg:var(--color-surface-2);
  --switch-off-border:var(--color-border);
  --switch-knob:var(--color-surface);
  --switch-shadow:0 6px 16px rgba(0,0,0,.12);
}

html[data-theme="dark"]{
  --color-bg:#0b1220;
  --color-surface:#0f172a;
  --color-surface-2:#111c33;

  --color-text:#e5e7eb;
  --color-text-muted:#9ca3af;
  --color-border:#1f2a44;

  --color-primary:#f97316;
  --color-primary-hover:#fb923c;
  --shop-buy:#f97316;
  --shop-buy-hover:#fb923c;
  --shop-buy-text:#fff;

  --shadow-sm:0 4px 10px rgba(0,0,0,.35);
  --shadow-md:0 18px 42px rgba(0,0,0,.48);
  --shop-hover-dark:rgba(255,255,255,.08);

  --on-primary:#0b1220;

  --primary-14:rgba(249,115,22,.18);
  --primary-25:rgba(249,115,22,.30);
  --primary-45:rgba(249,115,22,.55);
  --primary-12:rgba(249,115,22,.18);

  --overlay-bg:rgba(0,0,0,.55);

  --switch-shadow:0 10px 24px rgba(0,0,0,.35);
}

*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
html{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}
button,input,textarea,select{font:inherit;color:inherit}

button, input, select, textarea{
  font: inherit;
  color: inherit;
}

body{
  font-family:var(--font-main);
  background:var(--color-bg);
  color:var(--color-text);
  transition:background-color var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth);
  overflow:hidden;
}

body.sidebar-open,
body.sheet-open,
body.modal-open{ overflow:hidden; }

.no-scrollbar{ -ms-overflow-style:none; scrollbar-width:none; }
.no-scrollbar::-webkit-scrollbar{ display:none; }

.hidden{display:none!important}
.muted{color:var(--color-text-muted)}

.fade-in{animation:fadeIn 180ms var(--ease-smooth) both}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

/* ================= Header ================= */

header{
  height:var(--header-height);
  background:var(--color-surface);
  box-shadow:var(--shadow-sm);
  display:flex;
  align-items:center;
  padding:4px 16px;
  border-radius:0 0 var(--radius-lg) var(--radius-lg);
  overflow:visible;
}

body[data-admin-active-page] > header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:84;
}

.header-content{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.logo{display:flex;align-items:center;gap:.75rem;user-select:none}
.logo-icon{
  width:36px;height:36px;border-radius:var(--radius-md);
  background:var(--color-surface-2);color:var(--color-text-muted);
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:1rem;
  flex:0 0 36px;
  aspect-ratio:1 / 1;
  overflow:hidden;
}
.logo-img{
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:inherit;
}
.logo-text{font-size:1.05rem;font-weight:700;letter-spacing:.2px}
.logo-city-wrapper{
  position:relative;
  display:flex;
  align-items:center;
  gap:.35rem;
}
.header-city-button{
  display:flex;
  align-items:center;
  gap:.35rem;
  padding:.15rem .75rem;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  font-size:.95rem;
  font-weight:600;
  min-height:32px;
  min-width:140px;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.header-city-button:disabled{
  cursor:default;
  opacity:.6;
}
.header-city-button:hover:not(:disabled){
  background:var(--color-surface-2);
  transform:translateY(-1px);
}
.header-city-name{
  color:var(--color-primary);
  font-weight:700;
  display:inline-block;
  min-width:90px;
}
.header-city-dropdown{
  position:absolute;
  top:calc(100% + .4rem);
  right:0;
  min-width:220px;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:var(--radius-md);
  box-shadow:0 4px 24px rgba(0,0,0,.18);
  padding:.35rem 0;
  z-index:100;
}
.header-city-option{
  width:100%;
  border:none;
  background:transparent;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  padding:.4rem .75rem;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth);
  color:var(--color-text);
  font-size:.9rem;
}
.header-city-option:hover{
  background:var(--color-surface-2);
}
.header-city-option.is-active .header-city-option-city{
  color:var(--color-primary);
}
.header-city-option-city{
  font-weight:600;
}
.header-city-option-store{
  font-size:.75rem;
  color:var(--color-text-muted);
}
.logo-city-wrapper.hidden{
  display:none;
}

/* Header address widget (mobile-only, hidden on desktop) */
.header-address-widget{display:none}
.header-address-button{
  display:flex;
  align-items:center;
  gap:.35rem;
  padding:0;
  border:none;
  background:none;
  color:var(--color-text);
  font-size:1rem;
  font-weight:600;
  cursor:pointer;
  min-width:0;
}
.header-address-icon{
  color:var(--color-primary);
  font-size:1.2rem;
  flex-shrink:0;
}
.header-address-text{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.header-address-text.is-placeholder{
  color:var(--color-text-muted);
  font-weight:500;
}
.header-address-chevron{
  font-size:.55rem;
  color:var(--color-text-muted);
  flex-shrink:0;
}

/* Статус «Мы закрыты» в хедере — только на мобилке */
.header-store-status{
  display:none;
}

@media (max-width:768px){
  header{
    position:relative;
  }
  .logo-city-wrapper{
    position:absolute;
    right:0;
    bottom:0;
    z-index:10;
    flex-wrap:wrap;
    justify-content:flex-end;
  }
  .header-address-widget{
    display:flex;
    align-items:center;
    min-width:0;
    margin-left:.35rem;
  }
  .logo-text{
    margin-right:0;
  }
  .header-store-status:not(.hidden){
    display:block;
    width:100%;
    margin-top:0.25rem;
    font-size:0.8rem;
    color:var(--color-text-muted);
    text-align:right;
    line-height:1.2;
  }
}

.header-actions{display:flex;align-items:center;gap:.75rem}

/* burger */
.icon-btn{
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  border-radius:10px;
  width:40px;height:40px;
  display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.icon-btn:hover{background:var(--color-surface-2);transform:translateY(-1px)}

/* ✅ вернули “как раньше” для темы/профиля */
.header-btn{
  width:40px;height:40px;
  border-radius:10px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;
  text-decoration:none;
  transition:background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.header-btn:hover{background:var(--color-surface-2);transform:translateY(-1px)}

/* ================= User Menu Dropdown ================= */
.user-menu-wrapper {
  position: relative;
}

.header-profile-wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Clients list: phone in one line, no wrapping */
.clients-panel .order-line.muted{
  display: flex;
  gap: 8px;
  align-items: center;
}

.clients-panel .order-line.muted .client-phone{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

/* Clients-specific row layout: tighter right column and responsive middle */
.clients-panel .order-row{
  grid-template-columns: 64px minmax(200px, 1fr) 126px !important;
}

.clients-panel .order-main{ /* compact left */
  display:flex;
  flex-direction:column;
  gap:6px;
}

.clients-panel .order-mid{ /* ensure mid column can shrink */
  min-width:0;
}

.clients-panel .order-actions{ /* align pill to right and make it compact */
  display:flex;
  align-items:center;
  gap:8px;
  justify-content:flex-end;
}

.clients-panel .clients-chat-hint-btn{
  width:32px;
  height:32px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text-muted);
}

.clients-panel .clients-chat-hint-btn:hover{
  background:var(--color-surface-2);
  border-color:var(--color-border);
  color:var(--color-primary);
}

.clients-panel .pill{
  padding:6px 10px;
  font-size:13px;
  height:32px;
  line-height:20px;
  min-width:40px;
  max-width:80px;
  box-sizing:border-box;
}

@media (max-width:768px){
  .clients-panel .order-row{
    grid-template-columns: 56px minmax(160px, 1fr) 108px !important;
  }
  .clients-panel .pill{
    font-size:12px;
    padding:6px 8px;
    height:28px;
  }
}

.user-menu-dropdown {
  position: absolute;
  top: calc(100% + 0.5rem);
  right: 0;
  width: 280px;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: opacity var(--dur-fast) var(--ease-smooth), 
              visibility var(--dur-fast) var(--ease-smooth),
              transform var(--dur-fast) var(--ease-smooth);
  z-index: 1000;
  overflow: hidden;
}

.user-menu-wrapper.active .user-menu-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.user-menu-header {
  padding: 1rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.user-menu-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--color-primary);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
}

.user-menu-info {
  flex: 1;
  min-width: 0;
}

.user-menu-name {
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--color-text);
  margin-bottom: 0.25rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-menu-email {
  font-size: 0.85rem;
  color: var(--color-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 0.25rem;
}

.user-menu-tenant {
  font-size: 0.8rem;
  color: var(--color-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-menu-time {
  font-size: 0.813rem;
  color: var(--color-text-secondary);
  font-family: 'Courier New', monospace;
  margin-top: 4px;
  text-align: left;
}

.user-menu-divider {
  height: 1px;
  background: var(--color-border);
  margin: 0.5rem 0;
}

.user-menu-section {
  padding: 0.5rem 1rem;
}

.user-menu-section-title {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 0.5rem;
}

.user-menu-store-selector {
  position: relative;
}

.user-menu-store-btn {
  width: 100%;
  padding: 0.625rem 0.75rem;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  color: var(--color-text);
  text-align: left;
  cursor: pointer;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  transition: background var(--dur-fast) var(--ease-smooth);
}

.user-menu-store-btn:hover {
  background: var(--color-surface-2);
}

.user-menu-store-btn i:first-child {
  color: var(--color-primary);
  width: 16px;
  text-align: center;
}

.user-menu-store-btn span {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-menu-store-btn i:last-child {
  font-size: 0.75rem;
  color: var(--color-text-muted);
}

.user-menu-store-dropdown {
  position: absolute;
  top: calc(100% + 0.25rem);
  left: 0;
  right: 0;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
  max-height: 200px;
  overflow-y: auto;
  z-index: 10;
}

.user-menu-store-dropdown.hidden {
  display: none;
}

.user-menu-store-option {
  width: 100%;
  padding: 0.625rem 0.75rem;
  border: none;
  background: transparent;
  color: var(--color-text);
  text-align: left;
  cursor: pointer;
  font-size: 0.875rem;
  transition: background var(--dur-fast) var(--ease-smooth);
  display: block;
}

.user-menu-store-option:hover {
  background: var(--color-surface-2);
}

.user-menu-store-option.is-active {
  background: var(--primary-14);
  color: var(--color-primary);
  font-weight: 600;
}

.user-menu-actions {
  padding: 0.5rem;
}

.user-menu-btn {
  width: 100%;
  padding: 0.75rem 1rem;
  border: none;
  background: transparent;
  color: var(--color-text);
  text-align: left;
  cursor: pointer;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.9rem;
  transition: background var(--dur-fast) var(--ease-smooth);
}

.user-menu-btn:hover {
  background: var(--color-surface-2);
}

.user-menu-btn i {
  width: 18px;
  text-align: center;
}

.user-menu-btn#userMenuLogout {
  color: #e74c3c;
}

.user-menu-btn#userMenuLogout:hover {
  background: rgba(231, 76, 60, 0.1);
}

/* ================= Layout / Grid ================= */

.main-container{
  height:calc(100vh - var(--header-height));
  padding:1rem;
  padding-bottom:calc(2rem + var(--column-bottom-gap));
}

body[data-admin-active-page] .main-container{
  margin-top:var(--header-height);
}

.app-grid{
  display:grid;
  grid-template-columns:var(--sidebar-width) 250px 1fr 500px;
  gap:0.5rem;
  height:100%;
  align-items:stretch;
}

html[data-sidebar-collapsed="1"] .app-grid{
  grid-template-columns:var(--sidebar-collapsed) 250px 1fr 500px;
}

.page-col{
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
  min-height:0;
}

body.page-home .page-col-center,
body.page-home .page-col-right{
  position:relative;
}

body.page-home .page-col-center{
  z-index:3;
}

body.page-home .page-col-right{
  z-index:1;
}

body.page-home.store-map-modal-open .page-col-right{
  z-index:2001;
}

body.page-home .page-col-right .panel{
  min-height:calc(100vh - var(--header-height) - var(--column-bottom-gap));
}

/* ================= Panel ================= */

.panel{
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}

.panel.toolbar-island{
  overflow:visible;
  position:relative;
  z-index:1200;
  isolation:isolate;
}

.app-grid > .panel,
.page-col > .panel{
  height:100%;
  display:flex;
  flex-direction:column;
  min-height:0;
}

.panel-header{
  padding:12px;
  border-bottom:1px solid var(--color-border);
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.panel-title{font-weight:800;color:var(--color-text)}

.panel-body{
  padding:12px;
  overflow-y:auto;
  flex:1;
  min-height:0;
}
.panel-body::after{content:"";display:block;height:var(--column-scroll-pad)}

.stores-panel .panel-body::after{height:0}

.panel-footer{
  padding:12px;
  border-top:1px solid var(--color-border);
  background:var(--color-surface);
  flex:0 0 auto;
}

/* ================= Product Footer ================= */

.product-footer-actions{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  flex-wrap:nowrap;
}

.product-footer-view,
.product-footer-edit-mode{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  flex-wrap:nowrap;
}

.product-footer-btn{
  height:52px;
  border:none;
  cursor:pointer;
  font-weight:800;
  transition:all var(--dur-fast) var(--ease-smooth);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
}

/* Round buttons (delete, cancel, more) */
.product-footer-delete,
.product-footer-cancel,
.product-footer-more{
  width:52px;
  border-radius:50%;
  flex:0 0 auto;
  font-size:18px;
  line-height:1;
}

.product-footer-delete{
  background:var(--color-primary);
  color:var(--on-primary);
  border:1px solid var(--color-primary);
}

.product-footer-delete:hover{
  background:var(--color-primary-hover);
  border-color:var(--color-primary-hover);
}

.product-footer-cancel,
.product-footer-more{
  background:var(--color-surface-2);
  color:var(--color-text);
  border:1px solid var(--color-border);
}

.product-footer-cancel:hover,
.product-footer-more:hover{
  background:var(--color-border);
}

/* Expandable buttons (two-step confirmation) */
.product-footer-delete.is-confirm,
.product-footer-cancel.is-confirm{
  width:auto;
  border-radius:999px;
  padding:0 16px;
  font-size:14px;
}

.product-footer-delete.is-confirm{
  background:var(--color-primary);
  color:var(--on-primary);
}

.product-footer-cancel.is-confirm{
  background:var(--color-surface-2);
  color:var(--color-text);
}

/* Full-width buttons (edit, save) */
.product-footer-edit,
.product-footer-save{
  flex:1 1 auto;
  border-radius:999px;
  padding:0 18px;
  background:var(--color-primary);
  color:var(--on-primary);
  border:1px solid var(--color-primary);
}

/* Cancel button in full-width mode (for picker) */
.product-footer-cancel.is-fullwidth{
  flex:1 1 auto;
  width:auto;
  border-radius:999px;
  padding:0 18px;
  font-size:14px;
  line-height:1;
  background:var(--color-surface-2);
  color:var(--color-text);
  border:1px solid var(--color-border);
}

.product-footer-edit:hover,
.product-footer-save:hover{
  background:var(--color-primary-hover);
  border-color:var(--color-primary-hover);
}

/* Меню «три точки» в футере — только по высоте контента */
.product-footer-more-dropdown{
  position:fixed;
  z-index:1000;
  min-width:220px;
  padding:6px 0;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
  display:flex;
  flex-direction:column;
  gap:0;
}
.product-footer-more-dropdown-item{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  padding:12px 16px;
  border:none;
  background:transparent;
  font-size:14px;
  color:var(--color-text);
  cursor:pointer;
  text-align:left;
  transition:background var(--dur-fast) var(--ease-smooth);
}
.product-footer-more-dropdown-item:hover{
  background:var(--color-surface-2);
}
.product-footer-more-dropdown-item i{
  font-size:14px;
  color:var(--color-primary);
  flex-shrink:0;
}
.product-footer-more-dropdown-sep{
  height:1px;
  margin:4px 0;
  background:var(--color-border);
}
.product-footer-more-blocks{
  display:flex;
  flex-direction:column;
}
.product-footer-more-blocks-trigger{
  justify-content:flex-start;
  font-weight:400;
}
.product-footer-more-blocks-trigger-main{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.product-footer-more-blocks-trigger:hover{
  background:var(--color-surface-2);
}
.product-footer-more-blocks-trigger i{
  color:var(--color-primary);
  transition:transform var(--dur-fast) var(--ease-smooth);
}
.product-footer-more-blocks-trigger.is-open i{
  transform:rotate(180deg);
}
.product-footer-more-blocks-panel{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  row-gap:8px;
  padding:0 12px 6px;
}
.product-footer-more-blocks-panel.hidden{
  display:none;
}
.product-footer-more-block-row{
  display:grid;
  grid-template-columns:18px minmax(0, 1fr);
  align-items:center;
  gap:10px;
  width:100%;
  padding:12px 16px;
  border-radius:12px;
  border:1px solid rgba(255, 122, 0, 0.18);
  background:var(--color-surface);
  cursor:pointer;
  color:var(--color-text);
  font-size:14px;
  line-height:1.35;
  box-sizing:border-box;
  transition:border-color var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth);
}
.product-footer-more-block-row:hover{
  border-color:rgba(255, 122, 0, 0.32);
  background:var(--color-surface-2);
}
.product-footer-more-block-row input{
  width:16px;
  height:16px;
  margin:0;
  flex-shrink:0;
  appearance:none;
  border:1px solid var(--color-border);
  border-radius:4px;
  background-color:var(--color-surface);
  background-position:center;
  background-repeat:no-repeat;
  background-size:10px 10px;
  transition:border-color var(--dur-fast) var(--ease-smooth), background-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}
.product-footer-more-block-row span{
  min-width:0;
}
.product-footer-more-block-row input:checked{
  border-color:var(--color-primary);
  background-color:var(--color-primary);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3.5 8.5 6.5 11.5 12.5 4.5'/%3E%3C/svg%3E");
}
.product-footer-more-block-row:has(input:checked){
  border-color:rgba(255, 122, 0, 0.42);
  background:rgba(255, 122, 0, 0.06);
}
.product-footer-more-block-row input:focus-visible{
  outline:none;
  box-shadow:0 0 0 2px rgba(255, 122, 0, 0.18);
}

/* Выпадающее меню «+»: Товар / Комбо-набор (как user-menu) */
.add-main-wrapper{
  position:relative;
}
.add-main-dropdown{
  position:absolute;
  top:calc(100% + 0.5rem);
  right:0;
  min-width:220px;
  padding:8px 0;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:12px;
  box-shadow:0 4px 20px rgba(0,0,0,0.15);
  z-index:1000;
  opacity:0;
  visibility:hidden;
  transform:translateY(-10px);
  transition:opacity var(--dur-fast) var(--ease-smooth), visibility var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.add-main-wrapper.is-open .add-main-dropdown{
  display:block !important;
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.add-main-dropdown-sep{
  height:1px;
  margin:6px 0;
  background:var(--color-border);
}
.add-main-dropdown-item{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  padding:12px 16px;
  border:none;
  background:transparent;
  font-size:14px;
  color:var(--color-text);
  cursor:pointer;
  text-align:left;
  transition:background var(--dur-fast) var(--ease-smooth);
}
.add-main-dropdown-item:hover{
  background:var(--color-surface-2);
}
.add-main-dropdown-item i{
  font-size:14px;
  color:var(--color-primary);
  flex-shrink:0;
}

/* center stack island toolbar + content */
.center-stack{
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:1rem;
}
.orders-center-panel{flex:1;min-height:0}

.stores-panel{
  flex:1;
  min-height:0;
}
.stores-panel-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border-bottom:1px solid var(--color-border);
  padding-bottom:10px;
}
.stores-panel-header .panel-title{
  font-weight:800;
  display:flex;
  align-items:center;
  gap:10px;
}
.stores-current{
  font-size:14px;
  color:var(--color-text-muted);
}
.stores-form{
  border:1px solid var(--color-border);
  border-radius:12px;
  padding:10px;
  background:var(--color-surface-2);
  display:grid;
  gap:8px;
}
.stores-form-row label{
  font-size:12px;
  color:var(--color-text-muted);
  display:block;
  margin-bottom:4px;
}
.stores-form .control{
  width:100%;
  border-radius:8px;
}
.stores-form-actions{
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:flex-start;
  width:100%;
  margin-top:10px;
}
.settings-footer-actions .settings-footer-btn{
  height:52px;
  border:none;
  cursor:pointer;
  font-weight:800;
  transition:all var(--dur-fast) var(--ease-smooth);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  padding:0 18px;
}
.settings-footer-actions .settings-footer-btn--save{
  order:2;
  flex:1 1 auto;
  border-radius:999px;
  background:var(--color-primary);
  color:var(--on-primary);
  border:1px solid var(--color-primary);
}
.settings-footer-actions .settings-footer-btn--save:hover{
  background:var(--color-primary-hover);
  border-color:var(--color-primary-hover);
}
.settings-footer-actions .settings-footer-btn--edit{
  order:1;
  flex:0 1 auto;
  min-width:140px;
  border-radius:999px;
  background:var(--color-surface-2);
  color:var(--color-text);
  border:1px solid var(--color-border);
}
.settings-footer-actions .settings-footer-btn--edit:hover{
  background:var(--color-border);
}
.settings-footer-actions .settings-footer-btn--cancel,
.settings-footer-actions .settings-footer-btn--delete{
  width:52px;
  order:1;
  flex:0 0 auto;
  border-radius:50%;
  padding:0;
  font-size:18px;
  line-height:1;
}
.settings-footer-actions .settings-footer-btn--cancel{
  background:var(--color-surface-2);
  color:var(--color-text);
  border:1px solid var(--color-border);
}
.settings-footer-actions .settings-footer-btn--cancel:hover{
  background:var(--color-border);
}
.settings-footer-actions .settings-footer-btn--delete{
  order:0;
  background:var(--color-primary);
  color:var(--on-primary);
  border:1px solid var(--color-primary);
}
.settings-footer-actions .settings-footer-btn--delete:hover{
  background:var(--color-primary-hover);
  border-color:var(--color-primary-hover);
}
.stores-list{
  display:grid;
  gap:6px;
}
.store-card.is-active{
  border-color:var(--primary-45);
  box-shadow:0 0 0 2px var(--primary-12);
}
.stores-panel .stores-list .order-row{
  padding:8px 12px;
  gap:8px;
}
.stores-panel .stores-list .settings-store-list-row{
  grid-template-columns:56px minmax(0,1fr);
  align-items:center;
  gap:12px;
  padding:12px 14px;
  border-radius:26px;
}
.stores-panel .stores-list .settings-store-list-row.is-selected{
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12);
}
.stores-panel .stores-list .store-status{
  font-size:14px;
  line-height:1.2;
  text-transform:capitalize;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* ================= Toolbar ================= */

.toolbar{
  padding:10px 12px;
  border-bottom:1px solid var(--color-border);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.toolbar-island .toolbar{border-bottom:0}
.toolbar-title{display:flex;align-items:center;gap:10px;font-weight:800}
.clients-toolbar-back{flex-shrink:0}
.toolbar-title-text{display:grid;gap:2px}
.toolbar-title-text .muted{font-size:12px}
.toolbar-left,.toolbar-right{display:flex;align-items:center;gap:8px}
.settings-create-menu-wrap{
  position:relative;
  display:flex;
  align-items:center;
  z-index:1270;
}
.settings-create-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  z-index:1271;
  width:min(280px, calc(100vw - 40px));
  padding:8px;
  border:1px solid var(--color-border);
  border-radius:18px;
  background:var(--color-surface);
  box-shadow:0 20px 50px rgba(15,23,42,.18);
  display:grid;
  gap:6px;
}
.settings-create-menu.hidden{display:none}
.settings-create-menu-item{
  width:100%;
  border:none;
  border-radius:14px;
  background:var(--color-surface-2);
  padding:12px 14px;
  text-align:left;
  display:grid;
  gap:4px;
  cursor:pointer;
}
.settings-create-menu-item:hover{background:var(--primary-10)}
.settings-create-menu-item-title{
  font-size:14px;
  font-weight:800;
  color:var(--color-text);
}
.settings-create-menu-item-text{
  font-size:12px;
  color:var(--color-text-muted);
  line-height:1.4;
}
.settings-delivery-map-search-toolbar{
  width:320px;
  min-width:260px;
  flex-shrink:1;
}
.settings-delivery-map-search-wrap{
  position:relative;
  width:100%;
  z-index:2;
}
.settings-delivery-map-search-field{
  height:42px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  display:flex;
  align-items:center;
  gap:6px;
  padding:0 8px 0 14px;
  overflow:hidden;
  transition:border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-map-search-field:focus-within{
  border-color:var(--color-primary);
  box-shadow:0 0 0 3px var(--primary-12);
}
.settings-delivery-map-search-field .settings-delivery-map-search-input--toolbar.control{
  flex:1 1 auto;
  min-width:0;
  height:100%;
  border:none;
  border-radius:0;
  background:transparent;
  color:var(--color-text);
  padding:0 6px 0 0;
  margin:0;
  outline:none;
  appearance:none;
  -webkit-appearance:none;
  line-height:1.2;
  box-shadow:none;
}
.settings-delivery-map-search-field .settings-delivery-map-search-input--toolbar.control:disabled{
  cursor:not-allowed;
  opacity:.55;
}
.settings-delivery-map-search-field .settings-delivery-map-search-input--toolbar.control:focus{
  border-color:transparent;
  box-shadow:none;
}
.settings-delivery-map-search-field:has(.settings-delivery-map-search-input--toolbar:disabled){
  opacity:.7;
}
.settings-delivery-map-search-clear{
  flex:0 0 28px;
  width:28px;
  height:28px;
  border:none;
  border-radius:999px;
  background:transparent;
  color:var(--color-text-muted);
  display:grid;
  place-items:center;
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  transform:scale(.9);
  transition:opacity var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-map-search-clear.is-visible{
  opacity:1;
  pointer-events:auto;
  transform:scale(1);
}
.settings-delivery-map-search-clear:hover{
  background:rgba(15, 23, 42, .06);
  color:var(--color-text);
}
.settings-delivery-map-search-clear i{
  font-size:12px;
}
.settings-delivery-map-search-popover{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  z-index:1220;
  width:min(420px, calc(100vw - 48px));
  max-width:420px;
  max-height:min(360px, calc(100vh - 180px));
  background:var(--color-surface);
  border:1px solid rgba(15,23,42,.08);
  border-radius:22px;
  box-shadow:0 12px 30px rgba(15,23,42,.22);
  padding:12px;
  display:grid;
  gap:8px;
  overflow:auto;
}
.settings-delivery-map-search-status.hidden,
.settings-delivery-map-search-popover.hidden{
  display:none!important;
}
.settings-delivery-map-info-wrap{
  position:relative;
  flex-shrink:0;
  z-index:2;
}
.settings-delivery-map-info-btn{
  width:42px;
  height:42px;
  border-radius:999px;
}
.settings-delivery-map-info-popover{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  z-index:1220;
  width:min(360px, calc(100vw - 48px));
  background:var(--color-surface);
  border:1px solid rgba(15,23,42,.08);
  border-radius:22px;
  box-shadow:0 12px 30px rgba(15,23,42,.22);
  padding:14px;
  display:grid;
  gap:8px;
}
.settings-delivery-map-info-title{
  font-size:16px;
  font-weight:900;
  color:var(--color-text);
}
.settings-delivery-map-info-text,
.settings-delivery-map-info-note{
  font-size:13px;
  line-height:1.45;
  color:var(--color-text-muted);
}
.settings-store-address-wrap{
  position:relative;
  z-index:3;
}
.settings-store-address-wrap.has-trigger .control{
  padding-right:44px;
}
.settings-store-address-wrap.has-trigger .control[readonly]{
  cursor:pointer;
}
.settings-store-address-trigger{
  position:absolute;
  top:50%;
  right:10px;
  transform:translateY(-50%);
  width:28px;
  height:28px;
  border:none;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:transparent;
  color:var(--color-muted);
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.settings-store-address-trigger:hover{
  background:var(--color-surface-2);
  color:var(--color-text);
}
#settingsStorePanel .settings-store-address-wrap.is-open .settings-store-address-trigger{
  transform:translateY(-50%) rotate(180deg);
  color:var(--primary);
}
.settings-store-address-trigger.hidden{
  display:none!important;
}
.settings-store-address-trigger i{
  pointer-events:none;
}
#settingsStorePanel .settings-site-field{
  position:relative;
  z-index:1;
}
#settingsStorePanel .control,
#settingsStorePanel .tenant-timezone-select{
  width:100%;
  min-height:48px;
  height:48px;
  padding:0 18px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:999px;
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:14px;
  font-weight:600;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
#settingsStorePanel .control:focus,
#settingsStorePanel .tenant-timezone-select:focus{
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12);
}
#settingsStorePanel .settings-store-address-wrap.has-trigger .control{
  padding-right:44px;
}
#settingsStorePanel .settings-list-subtitle{
  display:none!important;
}
#settingsStorePanel .settings-store-top-grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 140px;
  gap:12px;
  align-items:start;
}
#settingsStorePanel .settings-store-timezone-field{
  min-width:0;
  z-index:2;
}
#settingsStorePanel .settings-store-timezone-field.is-open{
  z-index:1600;
}
#settingsStorePanel .settings-store-timezone-selector{
  width:100%;
  position:relative;
  z-index:3;
}
#settingsStorePanel .settings-store-timezone-selector.is-open{
  z-index:1400;
}
#settingsStorePanel .settings-store-timezone-selector .new-order-right-select-trigger{
  width:100%;
  min-width:0;
  min-height:48px;
  height:48px;
  justify-content:space-between;
  padding:0 16px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:999px;
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:14px;
  font-weight:600;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
  transition:border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
#settingsStorePanel .settings-store-timezone-selector .new-order-right-select-trigger:hover{
  background:var(--color-surface);
  transform:translateY(-1px);
}
#settingsStorePanel .settings-store-timezone-selector .new-order-right-select-trigger:focus-visible{
  outline:none;
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12);
}
#settingsStorePanel .settings-store-timezone-selector .new-order-right-select-trigger:disabled{
  opacity:.6;
  cursor:not-allowed;
  transform:none;
}
#settingsStorePanel .settings-store-timezone-selector .cash-toolbar-filter-main{
  flex:1 1 auto;
  min-width:0;
  justify-content:flex-start;
}
#settingsStorePanel .settings-store-timezone-selector .cash-toolbar-filter-main span:last-child{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#settingsStorePanel .settings-store-timezone-selector .new-order-right-select-menu{
  display:none;
  left:0;
  transform:none;
  width:100%;
  max-height:220px;
  z-index:1401;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
#settingsStorePanel .settings-store-timezone-selector .new-order-right-select-menu::-webkit-scrollbar{
  width:0;
  height:0;
}
#settingsStorePanel .settings-store-timezone-selector.is-open .new-order-right-select-menu{
  display:grid;
}
#settingsStorePanel .settings-store-timezone-selector .new-order-right-select-option{
  justify-content:flex-start;
  padding:0 16px;
  font-size:14px;
  font-weight:700;
}
#settingsStorePanel .settings-store-timezone-selector.is-disabled .new-order-right-select-menu{
  display:none!important;
}
#settingsStorePanel .settings-store-compact-grid{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) repeat(3, minmax(0,.85fr));
  gap:8px;
  align-items:start;
}
#settingsStorePanel .settings-store-compact-field{
  min-width:0;
}
#settingsStorePanel .settings-store-compact-field .field-label{
  margin-bottom:4px;
}
#settingsStorePanel .settings-store-address-wrap.has-map-btn .control{
  padding-right:58px;
}
#settingsStorePanel .settings-store-map-icon-btn{
  position:absolute;
  top:50%;
  right:8px;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  border:none;
  border-radius:999px;
  background:var(--primary-12);
  color:var(--color-primary);
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth), opacity var(--dur-fast) var(--ease-smooth);
}
#settingsStorePanel .settings-store-map-icon-btn:hover{
  background:var(--primary-18);
  transform:translateY(-50%) scale(1.03);
}
#settingsStorePanel .settings-store-map-icon-btn:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px var(--primary-12);
}
#settingsStorePanel .settings-store-map-icon-btn:disabled{
  opacity:.52;
  cursor:not-allowed;
  transform:translateY(-50%);
}
#settingsStorePanel .settings-store-map-icon-btn i{
  pointer-events:none;
}
#settingsStorePanel .settings-store-map-hint{
  margin:6px 2px 0;
}
#settingsStorePanel .settings-site-field.is-address-suggest-open{
  z-index:1400;
}
#settingsStorePanel .settings-store-address-wrap{
  z-index:2;
}
#settingsStorePanel .settings-store-address-wrap:focus-within,
#settingsStorePanel .settings-store-address-wrap.is-open{
  z-index:1400;
}
.settings-store-address-popover{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  right:0;
  z-index:1220;
  max-height:min(360px, calc(100vh - 220px));
  background:var(--color-surface);
  border:1px solid rgba(15,23,42,.08);
  border-radius:26px;
  box-shadow:0 12px 30px rgba(15,23,42,.24);
  padding:12px;
  display:grid;
  gap:4px;
  overflow:auto;
}
#settingsStorePanel .settings-store-address-popover{
  z-index:1401;
}
.settings-store-address-popover.hidden,
.settings-store-address-status.hidden,
.settings-store-address-results.hidden{
  display:none!important;
}
.settings-store-address-status{
  font-size:13px;
  color:var(--color-muted);
  line-height:1.35;
  padding:2px 8px 6px;
}
.settings-store-address-status.is-error{
  color:var(--color-danger, #d35454);
}
.settings-store-address-status.is-loading{
  color:var(--primary);
}
.settings-store-address-results{
  display:grid;
  gap:4px;
}
.settings-store-address-result{
  width:100%;
  min-height:56px;
  border:none;
  border-radius:999px;
  background:transparent;
  text-align:left;
  padding:10px 14px;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
  display:grid;
  align-content:center;
  gap:4px;
}
.settings-store-address-result:hover,
.settings-store-address-result.is-active{
  background:var(--color-surface-2);
}
.settings-store-address-result-title{
  font-size:15px;
  font-weight:800;
  color:var(--color-text);
  line-height:1.2;
}
.settings-store-address-result-meta{
  font-size:12px;
  color:var(--color-muted);
  line-height:1.2;
}
.settings-store-map-field{
  display:grid;
  gap:10px;
}
.settings-store-map-open-btn{
  width:100%;
  justify-content:center;
}
.settings-store-map-hint{
  margin:0;
}
.settings-store-map-modal{
  position:fixed;
  inset:0;
  z-index:1700;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(15, 23, 42, .52);
}
.settings-store-map-modal.hidden{
  display:none!important;
}
.settings-store-map-modal__card{
  width:min(720px, 100%);
  max-height:min(88vh, 820px);
  background:var(--color-surface);
  border-radius:28px;
  box-shadow:0 24px 60px rgba(15, 23, 42, .35);
  padding:20px;
  display:grid;
  gap:14px;
}
.settings-store-map-modal__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.settings-store-map-modal__title{
  font-size:18px;
  font-weight:800;
  color:var(--color-text);
  line-height:1.2;
}
.settings-store-map-modal__subtitle{
  margin-top:4px;
  font-size:13px;
  line-height:1.4;
  color:var(--color-muted);
}
.settings-store-map-modal__status{
  font-size:13px;
  line-height:1.4;
  color:var(--color-muted);
}
.settings-store-map-modal__status.is-error{
  color:var(--color-danger, #d35454);
}
.settings-store-map-modal__canvas{
  width:100%;
  min-height:380px;
  border-radius:24px;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(15,23,42,.06), rgba(15,23,42,.02));
  border:1px solid rgba(15,23,42,.08);
}
.settings-store-map-modal__canvas.leaflet-container{
  background:#dfe7ef;
}
.settings-store-map-modal__coords{
  font-size:13px;
  line-height:1.4;
  color:var(--color-text-muted);
}
.settings-store-map-modal__actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
@media (max-width: 760px){
  .settings-store-map-modal{
    padding:12px;
    align-items:flex-end;
  }
  .settings-store-map-modal__card{
    width:100%;
    max-height:min(92vh, 760px);
    border-radius:24px;
    padding:16px;
  }
  .settings-store-map-modal__canvas{
    min-height:320px;
  }
  .settings-store-map-modal__actions{
    flex-direction:column-reverse;
    align-items:stretch;
  }
}
.settings-delivery-city-selector{
  position:relative;
  flex-shrink:0;
  z-index:2;
}
.settings-delivery-city-selector .new-order-right-select-menu{
  z-index:1220;
}
.settings-delivery-city-selector .new-order-right-select-trigger{
  width:auto;
  min-width:176px;
  justify-content:space-between;
  background:var(--color-surface);
}
.settings-delivery-city-selector .new-order-right-select-trigger i{
  transform:none !important;
  transition:none;
}
.settings-delivery-city-selector .cash-toolbar-filter-main{
  min-width:0;
}
.settings-delivery-city-selector .cash-toolbar-filter-main span:last-child{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.settings-delivery-city-selector .new-order-right-select-menu{
  display:none;
  left:0;
  transform:none;
  width:220px;
}
.settings-delivery-city-selector.is-open .new-order-right-select-menu{
  display:grid;
}
.settings-delivery-city-selector.new-order-right-select-wrap.is-open .new-order-right-select-trigger i{
  transform:none !important;
}
.chip-city{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 14px;
  border-radius:999px;
  background:none;
  border:1px solid var(--color-border);
  color:var(--color-text-muted);
  font-weight:600;
  font-size:.82rem;
  cursor:pointer;
  white-space:nowrap;
}
.chip-city-arrow{
  font-size:10px;
  transition:transform .2s;
}
.chip-city.is-open .chip-city-arrow{
  transform:rotate(180deg);
}
.chip-city-dropdown{
  position:absolute;
  top:calc(100% + 4px);
  right:0;
  min-width:180px;
  max-width:260px;
  max-height:300px;
  overflow-y:auto;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:8px;
  box-shadow:0 4px 12px var(--overlay-bg);
  z-index:100;
  padding:4px;
}
.chip-city-dropdown.hidden{
  display:none;
}
.chip-city-option{
  display:block;
  width:100%;
  padding:8px 12px;
  background:transparent;
  border:none;
  border-radius:4px;
  text-align:left;
  color:var(--color-text);
  font-size:.9rem;
  cursor:pointer;
  transition:background .15s;
}
.chip-city-option:hover{
  background:var(--color-surface-2);
}
.chip-city-option.is-selected{
  background:var(--primary-14);
  color:var(--primary);
  font-weight:600;
}
.new-order-toolbar{
  align-items:center;
}
.new-order-toolbar-left{
  flex:1 1 auto;
  min-width:0;
}
.new-order-toolbar-right{
  flex:0 0 auto;
  margin-left:auto;
}
.new-order-toolbar.is-checkout-screen .new-order-toolbar-title{
  display:none;
}
.settings-chat-subheader-switch{
  margin-right:4px;
}
.settings-chat-subheader-switch .switch-text{
  font-size:13px;
  font-weight:700;
  white-space:nowrap;
}
.settings-chat-assistant-main-switch{
  margin-left:auto;
  flex:0 0 auto;
}

.date-filter{position:relative}
.date-popover{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  width:260px;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:12px;
  box-shadow:var(--shadow-sm);
  padding:10px;
  display:grid;
  gap:8px;
  z-index:50;
}
.date-popover-header{display:flex;align-items:center;justify-content:space-between;gap:8px}
.date-popover-title{font-weight:700;font-size:14px;text-transform:capitalize}
.date-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;font-size:11px;color:var(--color-text-muted)}
.date-weekdays span{text-align:center}
.date-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.date-cell{
  height:32px;
  border-radius:8px;
  border:1px solid transparent;
  background:transparent;
  cursor:pointer;
  font-size:12px;
}
.date-cell:hover{background:var(--color-surface-2)}
.date-cell.is-in-range{background:var(--primary-14);border-color:var(--primary-25)}
.date-cell.is-start,.date-cell.is-end{background:var(--color-primary);border-color:transparent;color:var(--on-primary)}
.date-cell.is-today{border-color:var(--primary-25)}
.date-cell.is-past{opacity:0.35;cursor:default;pointer-events:none}
.date-empty{height:32px}
.date-popover-actions{display:flex;justify-content:flex-end}
/* ================= Buttons ================= */

.btn{
  height:40px;
  padding:0 12px;
  border-radius:10px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:10px;
  transition:background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.btn:hover{background:var(--color-surface-2);transform:translateY(-1px)}
.btn-primary{background:var(--color-primary);border-color:transparent;color:var(--on-primary)}
.btn-primary:hover{background:var(--color-primary-hover)}
.btn-icon{width:40px;padding:0;justify-content:center}
.btn-danger{
  border-color:#ef4444;
  color:#ef4444;
  background:transparent;
}
.btn-danger:hover{
  background:rgba(239,68,68,.08);
}
.btn-ghost{background:var(--color-surface);border-color:var(--color-border)}
.btn-ghost:hover{background:var(--color-surface-2)}
#ordersNotifyBtn.is-enabled{color:var(--color-primary)}
.btn-sm{height:34px;padding:0 10px;border-radius:8px;font-size:13px}
.btn-xs{height:32px;padding:0 10px;border-radius:8px;font-size:12px}
.icon-btn.btn-xs{width:32px;height:32px;border-radius:8px}

/* ================= Pills / badges ================= */

.pill{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
  color:var(--color-text);
}
.pill-strong{font-weight:900}

.badge{
  margin-left:auto;
  font-size:12px;
  padding:3px 8px;
  border-radius:999px;
  background:var(--color-surface-2);
  color:var(--color-text);
  border:1px solid var(--color-border);
}
.badge-warn{background:var(--primary-14);border-color:var(--primary-25)}

/* ================= Global Sidebar overlay ================= */

.sidebar-overlay{
  position:fixed;
  inset:0;
  background:var(--overlay-bg);
  opacity:0;
  pointer-events:none;
  transition:opacity var(--dur-med) var(--ease-smooth);
  z-index:25;
}
.sidebar-overlay.is-active{opacity:1;pointer-events:auto}

/* ================= Global Sidebar ================= */

.app-sidebar{
  position:relative;
  width:var(--sidebar-width);
  height:100%;
  display:flex;
  flex-direction:column;
  overflow:visible;
  transition:
    transform var(--dur-med) var(--ease-smooth),
    width var(--dur-med) var(--ease-smooth);
  will-change:transform,width;
}

/* Круглая оранжевая кнопка свернуть/развернуть — на границе между первым и вторым пунктами */
.sidebar-edge-toggle{
  position:absolute;
  top:31px;
  right:-13px;
  width:26px;
  height:26px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--color-primary);
  color:#fff;
  border:none;
  border-radius:50%;
  cursor:pointer;
  padding:0;
  z-index:3;
  box-shadow:0 2px 8px rgba(249,115,22,.35);
  transition:background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}
.sidebar-edge-toggle:hover{
  background:var(--color-primary-hover);
  box-shadow:0 3px 12px rgba(249,115,22,.45);
}
.sidebar-edge-toggle:active{
  transform:scale(0.96);
}
.sidebar-edge-toggle .sidebar-edge-icon{
  font-size:11px;
  font-weight:600;
}
.sidebar-edge-toggle .sidebar-edge-collapsed{display:none}
.sidebar-edge-toggle .sidebar-edge-expanded{display:block}
html[data-sidebar-collapsed="1"] .sidebar-edge-toggle .sidebar-edge-collapsed{display:block}
html[data-sidebar-collapsed="1"] .sidebar-edge-toggle .sidebar-edge-expanded{display:none}

/* Вкладка "Открыть меню" на мобильных, когда сайдбар закрыт */
.sidebar-open-tab{
  display:none;
  position:fixed;
  left:0;
  top:50%;
  transform:translateY(-50%);
  width:24px;
  height:56px;
  align-items:center;
  justify-content:center;
  background:var(--color-border);
  color:var(--color-text-muted);
  border-radius:0 8px 8px 0;
  cursor:pointer;
  z-index:25;
  transition:background var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth);
  box-shadow:2px 0 8px rgba(0,0,0,.08);
}
.sidebar-open-tab:hover{
  background:var(--primary-14);
  color:var(--color-text);
}
@media (max-width:768px){
  .sidebar-open-tab{
    display:flex;
    top:calc(var(--header-height) + 24px);
    bottom:24px;
    height:auto;
    min-height:56px;
    transform:none;
    align-items:center;
  }
  body.sidebar-open .sidebar-open-tab{display:none}
}

@media (max-width:768px){
  .app-sidebar{
    position:fixed;
    top:calc(var(--header-height) + 16px);
    left:16px;
    bottom:16px;
    height:auto;
    transform:translateX(calc(-100% - 24px));
    z-index:30;
  }
  .app-sidebar.is-open{transform:translateX(0)}
}

/* nav */
.app-sidebar-nav{flex:1;padding:8px;overflow-y:auto;min-height:0}
.app-sidebar-list{list-style:none;margin:0;padding:0;display:grid;gap:7px}

.nav-item{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  min-width:0;
  height:37.5px;
  font-weight:400;
  overflow:hidden;
  gap:8px;
  padding:0 10px;
  border-radius:10px;
  width:100%;
  box-sizing:border-box;
  border:1px solid var(--color-border);
  text-decoration:none;
  color:var(--color-text);
  transition:background var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth);
}
.nav-item:hover,
.nav-item:focus-visible,
.active-nav{
  background:var(--primary-14);
  border-color:var(--primary-25);
}
.nav-icon{
  width:22px;
  min-width:22px;
  text-align:center;
  color:var(--color-text-muted);
  box-sizing:border-box;
}
.nav-item:hover .nav-icon,
.nav-item:focus-visible .nav-icon,
.active-nav .nav-icon{color:var(--color-text)}
.nav-text{
  flex:1 1 0%;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  line-height:1.2;
  opacity:1;
  max-width:100%;
  transition:max-width var(--dur-med) var(--ease-smooth), opacity var(--dur-fast) var(--ease-smooth);
}
.active-nav{font-weight:700}

.nav-item--chat{
  position:relative;
  overflow:visible;
}

.sidebar-chat-unread{
  position:absolute;
  top:-10px;
  left:-6px;
  right:auto;
  transform:none;
  min-width:25px;
  height:25px;
  padding:0 6px;
  border-radius:999px;
  background:#ef4444;
  color:#fff;
  border:1px solid var(--color-surface);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  line-height:1;
  font-weight:700;
  box-sizing:border-box;
  pointer-events:none;
  z-index:1;
}

/* collapsed desktop (ровные иконки) */
@media (min-width:769px){
  html[data-sidebar-collapsed="1"] .app-sidebar{width:var(--sidebar-collapsed)}
  html[data-sidebar-collapsed="1"] .app-sidebar-nav{padding:8px}

  html[data-sidebar-collapsed="1"] .nav-item{
    width:100%;
    box-sizing:border-box;
    justify-content:center;
    gap:0;
    padding:0;
    border-radius:8px;
    border-color:transparent;
  }

  html[data-sidebar-collapsed="1"] .nav-item--chat{
    padding-right:0;
  }

  html[data-sidebar-collapsed="1"] .nav-item--chat .sidebar-chat-unread{
    top:-10px;
    left:-6px;
    right:auto;
    transform:none;
  }

  html[data-sidebar-collapsed="1"] .nav-icon{
    width:36px;
    min-width:36px;
    height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    box-sizing:border-box;
  }

  html[data-sidebar-collapsed="1"] .nav-item:hover,
  html[data-sidebar-collapsed="1"] .nav-item:focus-visible,
  html[data-sidebar-collapsed="1"] .active-nav{
    background:transparent;
    border-color:transparent;
  }

  html[data-sidebar-collapsed="1"] .nav-item:hover .nav-icon,
  html[data-sidebar-collapsed="1"] .nav-item:focus-visible .nav-icon,
  html[data-sidebar-collapsed="1"] .active-nav .nav-icon{
    background:var(--primary-14);
    border:1px solid var(--primary-25);
    color:var(--color-text);
  }

  html[data-sidebar-collapsed="1"] .nav-text{display:none;max-width:0;opacity:0}
}

/* ================= Admin Mobile Chrome ================= */

.admin-mobile-shell,
.admin-mobile-rail-shell{display:none}

.admin-mobile-shell,
.admin-mobile-rail-shell,
.admin-mobile-nav-shell,
.admin-mobile-rail,
.admin-mobile-nav{
  min-width:0;
  max-width:100%;
}

.admin-mobile-rail-shell{
  display:flex;
  width:100%;
}

.admin-mobile-rail-link{
  flex:0 0 auto;
  min-width:44px;
  height:48px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0;
  border:1px solid transparent;
  border-radius:14px;
  background:transparent;
  color:var(--color-text-muted);
  text-decoration:none;
  cursor:pointer;
  transition:
    color var(--dur-fast) var(--ease-smooth),
    background var(--dur-fast) var(--ease-smooth),
    border-color var(--dur-fast) var(--ease-smooth),
    transform var(--dur-fast) var(--ease-smooth);
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}

.admin-mobile-rail-link:hover,
.admin-mobile-rail-link:focus-visible{
  color:var(--color-text);
  background:var(--primary-12);
  border-color:var(--primary-25);
}

.admin-mobile-rail-link.is-active{
  color:var(--color-primary);
  background:var(--primary-14);
  border-color:var(--primary-25);
}

.admin-mobile-rail-link:active{
  transform:translateY(1px);
}

.admin-mobile-rail{
  width:100%;
  height:var(--admin-mobile-nav-h);
  min-height:var(--admin-mobile-nav-h);
  max-height:var(--admin-mobile-nav-h);
  display:flex;
  align-items:center;
  gap:8px;
  padding:0;
  overflow-x:auto;
  overflow-y:hidden;
  background:transparent;
  border:none;
  border-radius:0;
  box-shadow:none;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  scroll-behavior:smooth;
}

.admin-mobile-rail-link i{
  font-size:18px;
  line-height:1;
  color:inherit;
}

.admin-mobile-rail-link > img{
  width:20px;
  height:20px;
  display:block;
  object-fit:cover;
  border-radius:8px;
}

.admin-mobile-rail-link .stage-icon,
.admin-mobile-rail-link .order-icon,
.admin-mobile-rail-link .discount-row-icon{
  margin:0;
  flex:0 0 auto;
}

.admin-mobile-rail-link .stage-icon i,
.admin-mobile-rail-link .order-icon i,
.admin-mobile-rail-link .discount-row-icon i{
  font-size:inherit;
}

.admin-mobile-rail-label{
  max-width:0;
  margin-left:0;
  overflow:hidden;
  white-space:nowrap;
  opacity:0;
  font-size:13px;
  line-height:1;
  font-weight:700;
  transition:
    max-width var(--dur-med) var(--ease-smooth),
    opacity var(--dur-fast) var(--ease-smooth),
    margin-left var(--dur-med) var(--ease-smooth);
}

.admin-mobile-rail-link.is-active .admin-mobile-rail-label{
  max-width:140px;
  margin-left:8px;
  opacity:1;
}

.admin-mobile-nav{
  width:100%;
  height:var(--admin-mobile-nav-h);
  min-height:var(--admin-mobile-nav-h);
  max-height:var(--admin-mobile-nav-h);
  display:flex;
  align-items:center;
  gap:8px;
  padding:0;
  overflow-x:auto;
  overflow-y:hidden;
  background:transparent;
  border:none;
  border-radius:0;
  box-shadow:none;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  scroll-behavior:smooth;
}

.admin-mobile-nav-item{
  flex:0 0 auto;
}

.admin-mobile-nav-link{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:48px;
  min-width:48px;
  height:48px;
  border-radius:14px;
  text-decoration:none;
  color:var(--color-text-muted);
  transition:
    background var(--dur-fast) var(--ease-smooth),
    color var(--dur-fast) var(--ease-smooth),
    transform var(--dur-fast) var(--ease-smooth);
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}

.admin-mobile-nav-link i{
  font-size:20px;
  line-height:1;
  color:inherit;
}

.admin-mobile-nav-link:hover,
.admin-mobile-nav-link:focus-visible{
  background:var(--primary-14);
  color:var(--color-text);
}

.admin-mobile-nav-link.is-active{
  background:var(--primary-14);
  color:var(--color-primary);
}

.admin-mobile-nav-link:active{
  transform:translateY(1px);
}

.admin-mobile-nav-badge{
  position:absolute;
  top:2px;
  right:2px;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:999px;
  background:#ef4444;
  color:#fff;
  border:1px solid var(--color-surface);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  line-height:1;
  font-weight:700;
  box-sizing:border-box;
  pointer-events:none;
}

@media (max-width:768px){
  body[data-admin-active-page]{
    --admin-mobile-safe-bottom:calc(env(safe-area-inset-bottom) + var(--mobile-pwa-bottom-lift));
    --admin-mobile-shell-reserve:calc((var(--admin-mobile-nav-h) * 2) + var(--admin-mobile-nav-gap) + var(--admin-mobile-nav-bottom-gap) + var(--admin-mobile-safe-bottom));
    --admin-mobile-shell-courier-reserve:calc(var(--admin-mobile-shell-reserve) + 16px);
  }

  body[data-admin-active-page].admin-mobile-shell-collapsed{
    --admin-mobile-shell-reserve:calc((var(--admin-mobile-nav-h) * 2) + var(--admin-mobile-nav-gap) + var(--admin-mobile-nav-bottom-gap) + var(--admin-mobile-safe-bottom));
    --admin-mobile-shell-courier-reserve:calc(var(--admin-mobile-shell-reserve) + 16px);
  }

  html,
  body{
    overflow-x:hidden;
  }

  body:not(.page-chat){
    overflow-x:hidden;
    overflow-y:auto;
  }

  body.sidebar-open,
  body.sheet-open,
  body.modal-open{
    overflow:hidden;
  }

  .main-container{
    padding-bottom:var(--admin-mobile-shell-reserve);
  }

  body:not(.page-chat) .main-container{
    height:auto;
    min-height:calc(100dvh - var(--header-height));
  }

  .app-sidebar,
  .sidebar-open-tab,
  .sidebar-overlay,
  .page-col-left,
  .page-col-right{
    display:none !important;
  }

  .admin-mobile-shell{
    --admin-mobile-shell-base-offset:0px;
    --admin-mobile-shell-overlay-offset:0px;
    display:flex;
    flex-direction:column;
    gap:var(--admin-mobile-nav-gap);
    position:fixed;
    left:0;
    right:0;
    width:auto;
    max-width:none;
    margin-inline:0;
    bottom:0;
    z-index:24;
    overflow:hidden;
    box-sizing:border-box;
    padding-bottom:var(--admin-mobile-safe-bottom);
    background:var(--color-surface);
    border-radius:var(--admin-mobile-shell-top-radius) var(--admin-mobile-shell-top-radius) 0 0;
    box-shadow:0 -4px 6px -1px rgba(0,0,0,.10);
    overscroll-behavior:none;
    touch-action:pan-x;
    transform:translate3d(0, calc(var(--admin-mobile-shell-base-offset) + var(--admin-mobile-shell-overlay-offset)), 0);
    will-change:transform, opacity, box-shadow;
    backface-visibility:hidden;
    transition:
      opacity var(--admin-mobile-shell-fade-duration) var(--admin-mobile-shell-fade-ease),
      transform var(--admin-mobile-shell-snap-duration) var(--admin-mobile-shell-snap-ease),
      box-shadow var(--admin-mobile-shell-snap-duration) var(--admin-mobile-shell-snap-ease);
  }

  body.sidebar-open .admin-mobile-shell,
  body.sheet-open .admin-mobile-shell,
  body.modal-open .admin-mobile-shell{
    opacity:0;
    pointer-events:none;
    --admin-mobile-shell-overlay-offset:12px;
  }

  body.admin-mobile-shell-collapsed .admin-mobile-shell{
    --admin-mobile-shell-base-offset:0px;
    box-shadow:0 -2px 10px rgba(15,23,42,.09);
  }

  .admin-mobile-shell.is-shell-dragging{
    transition:none;
  }

  .admin-mobile-rail-shell,
  .admin-mobile-nav-shell{
    width:100%;
    transform-origin:center bottom;
    will-change:transform, opacity, filter;
    transition:
      opacity var(--admin-mobile-shell-fade-duration) var(--admin-mobile-shell-fade-ease),
      transform var(--admin-mobile-shell-snap-duration) var(--admin-mobile-shell-snap-ease),
      filter var(--admin-mobile-shell-snap-duration) var(--admin-mobile-shell-snap-ease);
  }

  .admin-mobile-nav-shell{
    box-sizing:border-box;
    padding-bottom:var(--admin-mobile-nav-bottom-gap);
  }

  body.admin-mobile-shell-collapsed .admin-mobile-rail-shell,
  body.admin-mobile-shell-collapsed .admin-mobile-nav-shell{
    opacity:1;
    transform:none;
    filter:none;
  }

  .admin-mobile-shell.is-shell-dragging .admin-mobile-rail-shell,
  .admin-mobile-shell.is-shell-dragging .admin-mobile-nav-shell{
    transition:none;
  }

  .admin-mobile-shell-handle{
    display:none !important;
  }

  .admin-mobile-shell-handle:active{
    cursor:grabbing;
  }

  .admin-mobile-shell-handle-bar{
    display:block;
    width:var(--admin-mobile-shell-handle-bar-w);
    height:var(--admin-mobile-shell-handle-bar-h);
    border-radius:999px;
    background:rgba(100, 116, 139, .92);
    border:1px solid rgba(255,255,255,.38);
    box-shadow:
      0 1px 2px rgba(15,23,42,.20),
      inset 0 1px 0 rgba(255,255,255,.32);
    transform-origin:center center;
    transition:
      width var(--admin-mobile-shell-snap-duration) var(--admin-mobile-shell-snap-ease),
      transform var(--admin-mobile-shell-snap-duration) var(--admin-mobile-shell-snap-ease),
      opacity var(--admin-mobile-shell-fade-duration) var(--admin-mobile-shell-fade-ease),
      background-color var(--admin-mobile-shell-fade-duration) var(--admin-mobile-shell-fade-ease);
  }

  body.admin-mobile-shell-collapsed .admin-mobile-shell-handle-bar{
    width:56px;
    opacity:.84;
    transform:scaleX(.92);
  }

  .admin-mobile-shell.is-shell-dragging .admin-mobile-shell-handle-bar{
    transition:none;
  }
}

@media (max-width:768px) and (display-mode:standalone){
  body[data-admin-active-page]{
    --mobile-pwa-bottom-lift:0px;
  }
}

/* ================= Stages ================= */

.stage-list{display:grid;gap:10px}
.stage-item{
  width:100%;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  border-radius:12px;
  padding:12px;
  cursor:pointer;

  display:grid;
  grid-template-columns:28px 1fr auto;
  align-items:center;
  gap:10px;
  text-align:left;

  transition:background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth);
}
.stage-item:hover{background:var(--color-surface-2);transform:translateY(-1px)}
.stage-item.is-dropover{background:var(--color-surface-2);transform:translateY(-1px)}
.stage-item.is-active{
  border-color:var(--primary-45);
  box-shadow:0 0 0 3px var(--primary-12);
  background:var(--primary-14);
}

.stage-icon{
  width:28px;height:28px;
  display:grid;place-items:center;
  border-radius:10px;
  background:var(--color-surface-2);
  color:var(--color-text);
  overflow:hidden;
}
.stage-icon i{color:inherit}
.stage-icon img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.category-icon{
  width:32px;
  height:32px;
  border-radius:10px;
  background:var(--color-surface-2);
  color:var(--color-text);
  display:grid;
  place-items:center;
  overflow:hidden;
}

.category-icon img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.category-picker-icon{
  width:40px;
  height:40px;
  min-width:40px;
  border-radius:10px;
  background:var(--color-surface-2);
  color:var(--color-text);
  display:grid;
  place-items:center;
  overflow:hidden;
}
.category-picker-icon img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.category-picker-icon i{
  font-size:18px;
  color:inherit;
}

.stage-text strong{display:block;font-weight:900;color:var(--color-text)}
.stage-text small{display:block;margin-top:2px;color:var(--color-text-muted);font-size:12px}

.stage-count{
  font-weight:900;
  font-size:12px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
}

/* ================= Lists (orders/products rows) ================= */

.orders-list{display:grid;gap:10px}

.order-row{
  color:var(--color-text);
  font:inherit;
  text-align:left;

  width:100%;
  box-sizing:border-box;

  cursor:pointer;
  user-select:none;

  border:1px solid var(--color-border);
  border-radius:12px;
  padding:10px 12px;
  background:var(--color-surface);

  display:grid;
  grid-template-columns:70px 70px minmax(180px,1.1fr) minmax(220px,1.4fr) 120px;
  gap:10px;
  align-items:center;

  transition:background var(--dur-fast) var(--ease-smooth),
             border-color var(--dur-fast) var(--ease-smooth),
             box-shadow var(--dur-fast) var(--ease-smooth),
             transform var(--dur-fast) var(--ease-smooth);
}
.order-row.shared-order-summary-row{
  grid-template-columns:70px 58px 170px minmax(0,1fr) max-content max-content;
  gap:8px;
}

.order-row.shared-order-summary-row.is-chat-header-loading .order-col{
  visibility:hidden;
}

.order-row.shared-order-summary-row .order-col.order-client.is-openable{
  cursor:pointer;
}

.order-row.shared-order-summary-row .order-col.order-client.is-openable:focus-visible{
  outline:2px solid var(--primary-45);
  outline-offset:2px;
  border-radius:8px;
}

.cash-order-row{
  grid-template-columns:70px minmax(260px,1fr) 120px;
}
.cash-order-row .order-main-line{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:nowrap;
}

.cash-day-section{
  border-radius:12px;
  border:1px solid var(--primary-25);
  padding:6px 8px 8px;
  background:var(--color-surface);
  box-shadow:0 0 0 1px var(--primary-12);
}
.cash-day-section + .cash-day-section{
  margin-top:8px;
}
.cash-day-header{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  background:transparent;
  border:none;
  padding:2px 4px 6px;
  cursor:pointer;
  font-size:13px;
  font-weight:600;
}
.cash-day-title{
  display:flex;
  align-items:center;
  gap:6px;
}
.cash-day-count{
  font-size:12px;
  color:var(--color-text-muted);
}
.cash-day-chevron{
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--color-text-muted);
  transition:transform var(--dur-fast) var(--ease-smooth);
}
.cash-day-chevron.is-collapsed{
  transform:rotate(-90deg);
}
.cash-day-panel{
  margin-top:4px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.cash-day-panel--orders{
  gap:10px;
}

/* Cash receipt preview (right column) — отступы как у товаров */
.cash-info.panel .panel-body{
  padding:8px;
}
.cash-tabs-header{
  padding:6px 10px;
  border-bottom:1px solid var(--color-border);
}
.cash-tabs{
  display:flex;
  align-items:center;
  gap:6px;
  overflow-x:auto;
  padding-bottom:2px;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.cash-tabs::-webkit-scrollbar{display:none;}
.cash-tab{
  width:100px;
  flex:0 0 100px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  padding:6px 8px;
  border-radius:10px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  cursor:pointer;
  user-select:none;
}
.cash-tab.is-active{
  background:var(--primary-14);
  border-color:var(--primary-25);
}
.cash-tab-title{
  font-size:12px;
  font-weight:600;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  flex:1 1 auto;
}
.cash-tab-close{
  border:none;
  background:transparent;
  color:var(--color-text-muted);
  width:16px;
  height:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
}
.cash-receipt-scroll{
  max-height:100%;
  overflow:auto;
  padding-top:6px;
}
.cash-receipt-box{
  margin:0 auto;
  max-width:320px;
  background:#fff;
  border-radius:10px;
  border:1px solid var(--color-border);
  padding:8px 10px;
  font-family:"Courier New",monospace;
  font-size:11px;
  line-height:1.4;
  color:#000;
}
.cash-balance-summary{
  display:grid;
  gap:10px;
  padding:4px 2px;
}
.cash-balance-card{
  border:1px solid var(--color-border);
  border-radius:12px;
  background:var(--color-surface);
  padding:10px;
}
.cash-balance-card-title{
  font-size:13px;
  font-weight:700;
  margin-bottom:8px;
}
.cash-balance-metrics{
  display:grid;
  gap:6px;
}
.cash-balance-metric{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:13px;
}
.cash-balance-metric span{
  color:var(--color-text-muted);
}
.cash-balance-metric strong{
  font-size:14px;
  color:var(--color-text);
  white-space:nowrap;
}
.cash-balance-actions{
  display:grid;
  gap:6px;
  margin-top:10px;
}

.cash-stage-balance-table{
  display:grid;
  gap:8px;
}

.cash-stage-balance-head,
.cash-stage-balance-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:10px;
  align-items:center;
}

.cash-stage-balance-head{
  font-size:11px;
  font-weight:800;
  color:var(--color-text-muted);
}

.cash-stage-balance-row{
  font-size:13px;
}

.cash-stage-balance-title{
  min-width:0;
}

.cash-balance-group{
  display:grid;
  gap:6px;
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid var(--color-border);
}

.cash-balance-group-title{
  font-size:12px;
  font-weight:800;
  color:var(--color-text-muted);
}

.cash-balance-action-btn{
  width:100%;
  justify-content:center;
}

/* Стили как в печатном чеке (orders.js) */
.receipt-header{
  text-align:center;
  font-weight:bold;
  font-size:14px;
  margin-bottom:6px;
}
.receipt-date{
  text-align:center;
  margin-bottom:6px;
  border-bottom:1px dashed #000;
  padding-bottom:6px;
}
.receipt-section{margin:6px 0;}
.receipt-section-title{font-weight:bold;margin-bottom:4px;}
.receipt-item{margin:4px 0;}
.receipt-item-row{
  display:flex;
  align-items:flex-start;
  gap:6px;
}
.receipt-item-qty{flex-shrink:0;}
.receipt-item-name{flex:1;min-width:0;word-wrap:break-word;}
.receipt-item-price{flex-shrink:0;text-align:right;}
.receipt-composition{margin:3px 0 3px 15px;font-size:10px;}
.receipt-composition-item{margin:2px 0;}
.receipt-total{
  text-align:center;
  font-weight:bold;
  font-size:13px;
  margin:10px 0;
  border-top:1px dashed #000;
  border-bottom:1px dashed #000;
  padding:6px 0;
}
.receipt-summary-row{
  display:flex;
  justify-content:space-between;
  gap:8px;
  margin-top:4px;
}
.receipt-summary-label{flex:1;}
.receipt-summary-value{flex-shrink:0;text-align:right;}
.receipt-divider{border-top:1px dashed #000;margin:6px 0;}
.receipt-when-block{font-weight:bold;}
.receipt-when-text{font-weight:bold;}
.order-row:hover{
  background:var(--color-surface-2);
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(0,0,0,.08),0 2px 4px rgba(0,0,0,.04);
}
.order-row.is-active{border-color:var(--primary-45);box-shadow:0 0 0 3px var(--primary-12)}
.order-row.is-active:hover{
  box-shadow:0 4px 12px rgba(0,0,0,.08),0 2px 4px rgba(0,0,0,.04),0 0 0 3px var(--primary-12);
}

.order-row[draggable="true"]{cursor:grab}
.order-row.is-dragging{opacity:.55;cursor:grabbing}
.order-row.is-multi-selected{
  border-color:var(--primary-45);
  box-shadow:0 0 0 2px var(--primary-12);
}

.order-drag-ghost-stack{
  position:fixed;
  top:-9999px;
  left:-9999px;
  pointer-events:none;
  z-index:9999;
}

.order-drag-ghost{
  position:absolute;
  width:56px;
  height:56px;
  border-radius:16px;
  border:2px solid rgba(15,23,42,.22);
  background:#fff;
  color:var(--color-text);
  font-size:18px;
  font-weight:900;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 10px 24px rgba(15,23,42,.16), 0 2px 6px rgba(15,23,42,.08);
}

.settings-list{display:grid;gap:12px;margin-top:10px}
.settings-list-header{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px}
.settings-list-title{font-weight:800}
.settings-list-subtitle{font-size:12px;color:var(--color-text-muted);width:100%}

.settings-row{
  cursor:grab;
  grid-template-columns:54px minmax(160px,1fr) minmax(140px,220px);
  align-items:center;
  gap:12px;
  position:relative;
}
.settings-row--time-option{
  grid-template-columns:56px minmax(160px,1fr) minmax(140px,220px);
}
.settings-row--no-icon{
  grid-template-columns:minmax(160px,1fr) minmax(140px,220px);
}
.settings-row.is-default::before{
  content:"";
  position:absolute;
  top:8px;
  bottom:8px;
  left:0;
  width:4px;
  border-radius:999px;
  background:var(--primary-45, #f97316);
}
.settings-row.is-dragging{cursor:grabbing}
.settings-row:hover{transform:none;box-shadow:none}
.settings-row-icon{display:grid;place-items:center}
.settings-icon-btn{
  width:48px;
  height:48px;
  border-radius:12px;
  border:1px dashed var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  overflow:hidden;
}
.settings-row--time-option .settings-icon-btn{
  width:50px;
  height:50px;
}
.settings-row--time-option .settings-row-title .control,
.settings-row--time-option + .settings-row-time-details .control{
  height:50px;
  min-height:50px;
}
.settings-icon-btn.is-filled{
  border-style:solid;
  color:var(--color-text);
}
.settings-icon-img{
  width:100%;
  height:100%;
  object-fit:contain;
  background:var(--color-surface);
}
.settings-row-title .control{width:100%}
.settings-row-switches{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}
.settings-row-switches .switch{margin:0}

.settings-row-wrapper {
  display: grid;
  gap: 10px;
  border: 1px solid var(--color-border);
  border-radius: 16px;
  padding: 12px;
  background: var(--color-surface);
  width: 100%;
  box-sizing: border-box;
}

.settings-row-wrapper .settings-row {
  border: none;
  box-shadow: none;
  background: transparent;
  padding: 0;
  cursor: default;
}

.settings-row-wrapper .settings-row-switches {
  flex-wrap: nowrap;
  gap: 10px;
}
.settings-row--delivery{
  grid-template-columns:54px minmax(160px,1fr);
  grid-template-areas:
    "icon title"
    "icon switches";
  align-items:start;
}
.settings-row--delivery .settings-row-icon{
  grid-area:icon;
}
.settings-row--delivery .settings-row-title{
  grid-area:title;
}
.settings-row--delivery .settings-row-switches{
  grid-area:switches;
  justify-content:flex-start;
  align-items:flex-start;
  flex-wrap:nowrap;
  gap:12px;
  margin-top:4px;
}
.settings-row--delivery .settings-row-switches .switch{
  align-items:flex-start;
  gap:4px;
}
.settings-row--delivery .settings-row-switches .switch-text{
  font-size:11px;
  font-weight:400;
  line-height:1.1;
}

.settings-row-wrapper .settings-row-time-details {
  display: grid;
  grid-template-columns: repeat(4, minmax(80px, 1fr));
  gap: 10px;
}

.settings-row-time-details {
  padding-left: 0;
}

.settings-row-time-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.settings-row-time-field-label {
  font-size: 12px;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.settings-row-time-field input[type="time"]::-webkit-calendar-picker-indicator,
.settings-row-time-field input[type="time"]::-webkit-inner-spin-button,
.settings-row-time-field input[type="time"]::-webkit-clear-button {
  display: none;
  -webkit-appearance: none;
}
.settings-row-time-field input[type="time"]::-moz-focus-inner {
  border: 0;
}

.order-col{min-width:0}
.order-id{display:grid;justify-items:center;gap:2px;font-weight:700}
.order-id-select-hit{
  width:100%;
  display:grid;
  justify-items:center;
  gap:2px;
  border-radius:8px;
  position:relative;
  cursor:pointer;
}
.order-id-select-checkbox{
  position:absolute;
  inset:0;
  opacity:0;
  pointer-events:none;
}
.order-id-num{font-weight:900;font-size:20px;line-height:1.2}
.order-id-time{font-size:12px;color:var(--color-text-muted)}

.order-indicators{display:grid;gap:6px;justify-items:center;align-items:center}
.order-time-icon{
  width:50px;
  height:50px;
  border-radius:12px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  display:grid;
  place-items:center;
  color:var(--color-text);
  overflow:hidden;
}
.order-time-icon i{
  font-size:16px;
  color:currentColor;
}
.order-row .order-time-icon img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  background:var(--color-surface);
}
.order-indicator{
  display:inline-flex;align-items:center;gap:6px;
  font-size:12px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
}
.order-indicator.urgent{
  background:var(--primary-14);
  border-color:var(--primary-25);
  color:var(--color-text);
  font-size:18px;
  padding:6px 10px;
}
.order-indicator-time{
  display:grid;
  gap:4px;
  justify-items:center;
  align-items:center;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:12px;
}
.order-indicator-time i{
  color:var(--color-text-muted);
  font-size:14px;
}
.order-indicator-time-text{
  font-size:11px;
  white-space:nowrap;
}

.order-client-name,.order-address-line,.order-address-comment,.order-address-courier{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.order-client-telegram{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.order-client-name{font-weight:700;display:flex;align-items:center;gap:6px}
.order-client-name i{color:var(--color-text-muted);font-size:14px}
.order-client-phone i,.order-client-telegram i,.order-address-line i,.order-address-comment i,.order-address-courier i{margin-right:6px;color:var(--color-text-muted)}

body.page-orders .orders-list .order-col.order-client,
body.page-courier-screen .orders-list .order-col.order-client,
body.page-cash #cashJournalList.orders-list .order-col.order-client{
  min-width:0;
  display:grid;
  row-gap:3px;
}
body.page-orders .orders-list .order-client-name,
body.page-orders .orders-list .order-client-phone,
body.page-orders .orders-list .order-client-telegram,
body.page-courier-screen .orders-list .order-client-name,
body.page-courier-screen .orders-list .order-client-phone,
body.page-courier-screen .orders-list .order-client-telegram,
body.page-cash #cashJournalList.orders-list .order-client-name,
body.page-cash #cashJournalList.orders-list .order-client-phone,
body.page-cash #cashJournalList.orders-list .order-client-telegram{
  display:grid;
  align-items:center;
  min-width:0;
  grid-template-columns:16px minmax(0,1fr);
  column-gap:6px;
  justify-content:start;
}
body.page-orders .orders-list .order-client-name,
body.page-orders .orders-list .order-client-telegram,
body.page-courier-screen .orders-list .order-client-name,
body.page-courier-screen .orders-list .order-client-telegram,
body.page-cash #cashJournalList.orders-list .order-client-name,
body.page-cash #cashJournalList.orders-list .order-client-telegram{
  grid-template-columns:16px minmax(0,1fr);
}
body.page-orders .orders-list .order-client-phone,
body.page-courier-screen .orders-list .order-client-phone,
body.page-cash #cashJournalList.orders-list .order-client-phone{
  grid-template-columns:16px auto;
}
body.page-orders .orders-list .order-client-name i,
body.page-orders .orders-list .order-client-phone i,
body.page-orders .orders-list .order-client-telegram i,
body.page-courier-screen .orders-list .order-client-name i,
body.page-courier-screen .orders-list .order-client-phone i,
body.page-courier-screen .orders-list .order-client-telegram i,
body.page-cash #cashJournalList.orders-list .order-client-name i,
body.page-cash #cashJournalList.orders-list .order-client-phone i,
body.page-cash #cashJournalList.orders-list .order-client-telegram i{
  margin-right:0;
  width:16px;
  min-width:16px;
  text-align:center;
  justify-self:center;
}
body.page-orders .orders-list .order-client-name-text,
body.page-orders .orders-list .order-client-telegram-text,
body.page-courier-screen .orders-list .order-client-name-text,
body.page-courier-screen .orders-list .order-client-telegram-text,
body.page-cash #cashJournalList.orders-list .order-client-name-text,
body.page-cash #cashJournalList.orders-list .order-client-telegram-text{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0;
}
body.page-orders .orders-list .order-client-phone-text,
body.page-courier-screen .orders-list .order-client-phone-text,
body.page-cash #cashJournalList.orders-list .order-client-phone-text{
  white-space:nowrap;
  min-width:max-content;
}
.order-client-phone-link{
  appearance:none;
  -webkit-appearance:none;
  border:none;
  background:none;
  color:inherit;
  font:inherit;
  margin:0;
  padding:0;
  width:fit-content;
  max-width:100%;
  cursor:pointer;
  text-align:left;
}
.order-client-phone-link:hover .order-client-phone-text,
.order-client-phone-link:focus-visible .order-client-phone-text{
  text-decoration:underline;
}
.order-client-phone-link:focus-visible{
  outline:none;
}

body.page-courier-screen .orders-list .order-row.js-order{
  grid-template-columns:70px minmax(0,1fr) minmax(320px,360px);
  grid-template-areas:
    "id client controls"
    "id address controls";
  gap:8px 10px;
  align-items:start;
}
body.page-courier-screen .orders-list .order-col.order-id{grid-area:id}
body.page-courier-screen .orders-list .order-col.order-indicators{grid-area:indicators}
body.page-courier-screen .orders-list .order-col.order-client{grid-area:client}
body.page-courier-screen .orders-list .order-col.order-address{grid-area:address}
body.page-courier-screen .orders-list .order-col.order-courier-controls{
  grid-area:controls;
  min-width:0;
  display:grid;
  gap:8px;
  align-content:start;
}
body.page-courier-screen .orders-list .order-courier-status-row,
body.page-courier-screen .orders-list .order-courier-action-row{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:8px;
}
body.page-courier-screen .orders-list .order-courier-status-row{
  grid-template-areas:"stage payment";
  align-items:stretch;
}
body.page-courier-screen .orders-list .order-courier-status-row .order-stage,
body.page-courier-screen .orders-list .order-courier-status-row .order-total{
  width:100%;
  min-width:0;
  align-self:stretch;
}
body.page-courier-screen .orders-list .order-courier-status-row .order-stage{
  grid-area:stage;
  justify-content:flex-start;
}
body.page-courier-screen .orders-list .order-courier-status-row .order-total{
  grid-area:payment;
  justify-content:flex-end;
}
body.page-courier-screen .orders-list .order-courier-status-row .order-stage-btn,
body.page-courier-screen .orders-list .order-courier-status-row .order-payment-btn{
  width:100%;
  min-width:0;
}
body.page-courier-screen .orders-list .order-courier-action-btn{
  min-width:0;
  height:50px;
  border-radius:12px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 12px;
  font-size:14px;
  font-weight:800;
  text-decoration:none;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth);
}
body.page-courier-screen .orders-list .order-courier-action-btn:hover{
  background:var(--primary-14);
  border-color:var(--primary-25);
  transform:translateY(-1px);
}
body.page-courier-screen .orders-list .order-courier-action-btn i{
  font-size:15px;
  color:currentColor;
}
body.page-courier-screen .orders-list .order-courier-action-btn--pickup{
  background:var(--color-primary);
  border-color:var(--color-primary);
  color:#fff;
}
body.page-courier-screen .orders-list .order-courier-action-btn--pickup:hover{
  background:var(--color-primary-hover);
  border-color:var(--color-primary-hover);
}
body.page-courier-screen .orders-list .order-courier-action-btn:disabled,
body.page-courier-screen .orders-list .order-courier-action-btn[aria-disabled="true"]{
  opacity:.6;
  cursor:default;
  transform:none;
}
body.page-courier-screen .orders-list .order-courier-action-btn--pickup:disabled,
body.page-courier-screen .orders-list .order-courier-action-btn--pickup[aria-disabled="true"]{
  background:var(--primary-14);
  border-color:var(--primary-25);
  color:var(--color-primary);
}

.order-address-courier{display:flex;align-items:center;gap:6px}
.order-courier-assign span{
  cursor:pointer;
  transition:text-decoration var(--dur-fast) var(--ease-smooth);
}
.order-courier-assign:hover span{text-decoration:underline}

.order-total{display:flex;justify-content:flex-end}
.order-stage{
  display:flex;
  justify-content:center;
  align-items:center;
}
.order-stage-btn{
  display:inline-flex;
  align-items:stretch;
  min-width:0;
  height:50px;
  border-radius:12px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
  overflow:hidden;
  padding:0;
  text-align:left;
}
.order-stage-btn:hover{
  background:var(--primary-14);
  border-color:var(--primary-25);
  transform:translateY(-1px);
}
.order-stage-btn:disabled{
  opacity:.6;
  cursor:default;
  transform:none;
}
.order-stage-btn-icon-wrap{
  width:50px;
  min-width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-right:none;
  background:transparent;
}
.order-stage-btn i{
  font-size:16px;
  color:currentColor;
}
.order-stage-btn-icon-wrap img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  background:transparent;
}
.order-stage-btn-content{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
  padding:0 10px;
  border-left:none;
}
.order-stage-btn-current,
.order-stage-btn-next{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.order-stage-btn-current{
  font-size:11px;
  font-weight:700;
  color:var(--color-text-muted);
}
.order-stage-btn-next{
  font-size:12px;
  font-weight:800;
  color:var(--color-text);
}
.order-stage-btn-arrow{
  color:var(--color-text);
}
.order-payment-btn{
  display:inline-flex;align-items:center;gap:10px;
  min-width:132px;
  padding:8px 12px;
  border-radius:12px;
  border:none;
  font-weight:700;
  cursor:pointer;
  transition:opacity var(--dur-fast) var(--ease-smooth);
  font-size:inherit;
  color:white;
}
.order-payment-btn-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  flex:0 0 26px;
  border-right:none;
}
.order-payment-btn-icon img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  background:transparent;
}
.order-payment-btn-icon i{
  font-size:18px;
  line-height:1;
}
.order-payment-btn-content{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  min-width:0;
  line-height:1.1;
  border-left:none;
}
.order-payment-btn-total{
  display:block;
  font-size:18px;
  font-weight:800;
  white-space:nowrap;
}
.order-payment-btn-status{
  display:block;
  margin-top:2px;
  font-size:11px;
  font-weight:700;
  line-height:1.15;
  color:rgba(255,255,255,.86);
  white-space:nowrap;
}
.order-payment-btn:hover{opacity:.9}
.order-payment-card{
  background:var(--color-primary);
}
.order-payment-cash{
  background:#10b981;
}
.order-col.order-total{
  display:flex;
  align-items:flex-end;
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn{
  align-items:stretch;
  min-width:0;
  height:50px;
  gap:0;
  padding:0;
  overflow:hidden;
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn-icon{
  display:grid;
  place-items:center;
  width:50px;
  min-width:50px;
  height:50px;
  flex:0 0 50px;
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn-content{
  justify-content:center;
  gap:2px;
  padding:0 10px;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn{
  background:var(--color-surface);
  transition:box-shadow .24s var(--ease-smooth), transform .24s cubic-bezier(.22,1,.36,1), border-color .24s var(--ease-smooth);
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn:hover{
  background:var(--color-surface);
  border-color:rgba(15,23,42,.08);
  box-shadow:0 8px 18px rgba(15,23,42,.10);
  transform:translateY(-1px);
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn.is-static:disabled{
  opacity:1;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-icon-shell{
  position:relative;
  width:50px;
  min-width:50px;
  height:50px;
  overflow:hidden;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-icon-wrap{
  position:absolute;
  inset:0;
  width:50px;
  min-width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:0;
  border-right:none;
  background:transparent;
  overflow:hidden;
  transition:opacity .28s var(--ease-smooth), transform .28s cubic-bezier(.22,1,.36,1);
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-content{
  box-sizing:border-box;
  width:100px;
  min-width:100px;
  flex:0 0 100px;
  position:relative;
  height:100%;
  overflow:hidden;
  padding:0;
  border-left:none;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-panel{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
  padding:0 12px 0 4px;
  transition:opacity .28s var(--ease-smooth), transform .28s cubic-bezier(.22,1,.36,1);
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-current,
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-next,
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-meta{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-current{
  font-size:13px;
  font-weight:800;
  color:var(--color-text);
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-next{
  font-size:13px;
  font-weight:800;
  color:var(--color-text);
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-meta{
  font-size:10px;
  font-weight:700;
  color:var(--color-text-muted);
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-icon-next,
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn-panel-next{
  opacity:0;
  transform:translateY(6px);
  pointer-events:none;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn.is-static .order-stage-btn-icon-next,
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn.is-static .order-stage-btn-panel-next{
  display:none;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn.order-stage-btn--schedule{
  cursor:default;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn.order-stage-btn--schedule:hover{
  background:var(--color-surface);
  border-color:rgba(15,23,42,.08);
  box-shadow:none;
  transform:none;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn.order-stage-btn--schedule:disabled{
  opacity:1;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn.order-stage-btn--schedule .order-stage-btn-content{
  width:auto;
  min-width:0;
  flex:1 1 auto;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn.order-stage-btn--schedule .order-stage-btn-panel{
  padding:0 12px 0 4px;
}
.order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn.order-stage-btn--schedule .order-stage-btn-current{
  font-size:13px;
  font-weight:800;
  color:var(--color-text);
}
@media (hover:hover) and (pointer:fine){
  .order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn:not(.is-static):hover .order-stage-btn-icon-current,
  .order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn:not(.is-static):hover .order-stage-btn-panel-current{
    opacity:0;
    transform:translateY(-6px);
  }
  .order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn:not(.is-static):hover .order-stage-btn-icon-next,
  .order-row.shared-order-summary-row .order-col.order-stage .order-stage-btn:not(.is-static):hover .order-stage-btn-panel-next{
    opacity:1;
    transform:translateY(0);
  }
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn{
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  cursor:pointer;
  transition:box-shadow .24s var(--ease-smooth), transform .24s cubic-bezier(.22,1,.36,1), border-color .24s var(--ease-smooth), background .24s var(--ease-smooth);
  text-align:left;
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn.order-payment-paid{
  background:rgba(16,185,129,.11);
  border-color:rgba(34,197,94,.20);
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn.order-payment-unpaid{
  background:rgba(239,68,68,.10);
  border-color:rgba(239,68,68,.18);
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn.order-payment-refund{
  background:var(--color-surface);
  border-color:var(--color-border);
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn-icon{
  background:transparent;
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn-icon img{
  width:24px;
  height:24px;
  object-fit:contain;
  display:block;
  background:transparent;
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn-total{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:18px;
  font-weight:800;
  color:var(--color-text);
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn-status{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:10px;
  font-weight:700;
  color:var(--color-text-muted);
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn:hover{
  border-color:rgba(15,23,42,.08);
  box-shadow:0 8px 18px rgba(15,23,42,.10);
  transform:translateY(-1px);
  opacity:1;
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn.order-payment-paid:hover{
  background:rgba(16,185,129,.14);
  border-color:rgba(34,197,94,.24);
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn.order-payment-unpaid:hover{
  background:rgba(239,68,68,.13);
  border-color:rgba(239,68,68,.22);
}
.order-row.shared-order-summary-row .order-col.order-total .order-payment-btn.order-payment-refund:hover{
  background:var(--color-surface);
  border-color:rgba(15,23,42,.08);
}
body.page-cash #cashJournalList.orders-list .order-stage-btn{
  background:var(--color-surface);
  transition:box-shadow .24s var(--ease-smooth), transform .24s cubic-bezier(.22,1,.36,1), border-color .24s var(--ease-smooth);
}
body.page-cash #cashJournalList.orders-list .order-stage-btn:hover{
  background:var(--color-surface);
  border-color:rgba(15,23,42,.08);
  box-shadow:0 8px 18px rgba(15,23,42,.10);
  transform:translateY(-1px);
}
body.page-cash #cashJournalList.orders-list .order-stage-btn.is-static:disabled{
  opacity:1;
}
body.page-cash #cashJournalList.orders-list .order-stage-btn-icon-shell{
  position:relative;
  width:50px;
  min-width:50px;
  height:50px;
  overflow:hidden;
}
body.page-cash #cashJournalList.orders-list .order-stage-btn-icon-wrap{
  position:absolute;
  inset:0;
  width:50px;
  min-width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:0;
  border-right:none;
  background:transparent;
  overflow:hidden;
  transition:opacity .28s var(--ease-smooth), transform .28s cubic-bezier(.22,1,.36,1);
}
body.page-cash #cashJournalList.orders-list .order-stage-btn-content{
  box-sizing:border-box;
  display:block;
  width:100px;
  min-width:100px;
  flex:0 0 100px;
  position:relative;
  height:100%;
  overflow:hidden;
  padding:0;
  border-left:none;
}
body.page-cash #cashJournalList.orders-list .order-stage-btn-panel{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
  padding:0 12px 0 4px;
  transition:opacity .28s var(--ease-smooth), transform .28s cubic-bezier(.22,1,.36,1);
}
body.page-cash #cashJournalList.orders-list .order-stage-btn-current,
body.page-cash #cashJournalList.orders-list .order-stage-btn-next,
body.page-cash #cashJournalList.orders-list .order-stage-btn-meta{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body.page-cash #cashJournalList.orders-list .order-stage-btn-current{
  font-size:13px;
  font-weight:800;
  color:var(--color-text);
}
body.page-cash #cashJournalList.orders-list .order-stage-btn-next{
  font-size:13px;
  font-weight:800;
  color:var(--color-text);
}
body.page-cash #cashJournalList.orders-list .order-stage-btn-meta{
  font-size:10px;
  font-weight:700;
  color:var(--color-text-muted);
}
body.page-cash #cashJournalList.orders-list .order-stage-btn-icon-next,
body.page-cash #cashJournalList.orders-list .order-stage-btn-panel-next{
  opacity:0;
  transform:translateY(6px);
  pointer-events:none;
}
body.page-cash #cashJournalList.orders-list .order-stage-btn.is-static .order-stage-btn-icon-next,
body.page-cash #cashJournalList.orders-list .order-stage-btn.is-static .order-stage-btn-panel-next{
  display:none;
}
body.page-cash #cashJournalList.orders-list .order-payment-btn{
  display:inline-flex;
  align-items:stretch;
  min-width:0;
  height:50px;
  padding:0;
  border-radius:12px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  cursor:pointer;
  transition:box-shadow .24s var(--ease-smooth), transform .24s cubic-bezier(.22,1,.36,1), border-color .24s var(--ease-smooth);
  text-align:left;
  overflow:hidden;
}
body.page-cash #cashJournalList.orders-list .order-payment-btn.order-payment-paid{
  background:rgba(16,185,129,.11);
  border-color:rgba(34,197,94,.20);
}
body.page-cash #cashJournalList.orders-list .order-payment-btn.order-payment-unpaid{
  background:rgba(239,68,68,.10);
  border-color:rgba(239,68,68,.18);
}
body.page-cash #cashJournalList.orders-list .order-payment-btn.order-payment-refund{
  background:var(--color-surface);
  border-color:var(--color-border);
}
body.page-cash #cashJournalList.orders-list .order-payment-btn-icon{
  display:grid;
  align-items:center;
  justify-content:center;
  width:50px;
  min-width:50px;
  height:50px;
  flex:0 0 50px;
  border-right:none;
  background:transparent;
}
body.page-cash #cashJournalList.orders-list .order-payment-btn-icon img{
  width:24px;
  height:24px;
  object-fit:contain;
  display:block;
  background:transparent;
}
body.page-cash #cashJournalList.orders-list .order-payment-btn-content{
  box-sizing:border-box;
  width:100px;
  min-width:100px;
  flex:0 0 100px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
  padding:0 12px 0 4px;
  border-left:none;
}
body.page-cash #cashJournalList.orders-list .order-payment-btn-total{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:18px;
  font-weight:800;
  color:var(--color-text);
}
body.page-cash #cashJournalList.orders-list .order-payment-btn-status{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:10px;
  font-weight:700;
  color:var(--color-text-muted);
}
body.page-cash #cashJournalList.orders-list .order-payment-btn:hover{
  border-color:rgba(15,23,42,.08);
  box-shadow:0 8px 18px rgba(15,23,42,.10);
  transform:translateY(-1px);
  opacity:1;
}
body.page-cash #cashJournalList.orders-list .order-payment-btn.order-payment-paid:hover{
  background:rgba(16,185,129,.14);
  border-color:rgba(34,197,94,.24);
}
body.page-cash #cashJournalList.orders-list .order-payment-btn.order-payment-unpaid:hover{
  background:rgba(239,68,68,.13);
  border-color:rgba(239,68,68,.22);
}
body.page-cash #cashJournalList.orders-list .order-payment-btn.order-payment-refund:hover{
  background:var(--color-surface);
  border-color:rgba(15,23,42,.08);
}
body.page-cash #cashJournalList.orders-list .order-payment-card,
body.page-cash #cashJournalList.orders-list .order-payment-cash{
  background:var(--color-surface);
}
@media (hover:hover) and (pointer:fine){
  body.page-cash #cashJournalList.orders-list .order-stage-btn:not(.is-static):hover .order-stage-btn-icon-current,
  body.page-cash #cashJournalList.orders-list .order-stage-btn:not(.is-static):hover .order-stage-btn-panel-current{
    opacity:0;
    transform:translateY(-6px);
  }
  body.page-cash #cashJournalList.orders-list .order-stage-btn:not(.is-static):hover .order-stage-btn-icon-next,
  body.page-cash #cashJournalList.orders-list .order-stage-btn:not(.is-static):hover .order-stage-btn-panel-next{
    opacity:1;
    transform:translateY(0);
  }
}
.order-total-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  font-weight:700;
  white-space:nowrap;
}

@media (max-width:1200px){
  body.page-orders .orders-list .order-row.js-order{
    grid-template-columns:70px 1fr max-content max-content;
    grid-template-areas:
      "id client stage total"
      "id address stage total";
    gap:8px 12px;
  }
  body.page-cash #cashJournalList.orders-list .order-row.js-order{
    grid-template-columns:70px 1fr max-content max-content;
    grid-template-areas:
      "id client stage total"
      "id address stage total";
    gap:8px 12px;
  }
  .order-col.order-id{grid-area:id}
  .order-col.order-client{grid-area:client}
  .order-col.order-address{grid-area:address}
  .order-col.order-stage{grid-area:stage}
  .order-col.order-total{grid-area:total}
  .order-col.order-indicators{display:none}
}

/* Products list variant */

[data-view-content="products"] .product-list-header,
[data-view-content="products"] .product-row{
  --product-row-switch-field-w:clamp(52px, 3.8vw, 64px);
  --product-row-field-w:clamp(74px, 5.6vw, 92px);
  --product-row-stock-field-w:clamp(84px, 6.4vw, 106px);
  --product-row-indicator-w:clamp(18px, 1.8vw, 22px);
  grid-template-columns:50px minmax(220px,1fr) repeat(2, var(--product-row-switch-field-w)) var(--product-row-stock-field-w) repeat(3, var(--product-row-field-w)) var(--product-row-indicator-w);
}
[data-view-content="products"] .product-list-header{
  position:sticky;
  top:-12px;
  z-index:5;
  display:grid;
  align-items:center;
  gap:6px;
  height:22px;
  min-height:22px;
  margin:-12px -12px 10px;
  padding:12px 24px 0 40px;
  box-sizing:border-box;
  color:var(--color-text-muted);
  background:var(--color-surface);
  font-size:9px;
  line-height:10px;
  pointer-events:none;
}
[data-view-content="products"] .product-list-header span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:center;
}
[data-view-content="products"] .product-list-header span:nth-child(-n+2){
  text-align:left;
}
[data-view-content="products"] .product-row{
  position:relative;
  align-items:center;
  gap:6px;
}
[data-view-content="products"] .order-row.product-row{
  width:calc(100% - 34px);
  margin-left:28px;
  padding:0 12px 0 0;
  overflow:visible;
}
.product-main-head{
  min-width:0;
  align-self:center;
}
.product-row-switch{
  display:inline-flex;
  align-self:center;
  justify-self:center;
  pointer-events:auto;
}
.product-row-switch-field{
  width:100%;
  min-width:0;
  justify-self:end;
  align-self:center;
  text-align:center;
}
.product-row-field{
  width:100%;
  min-width:0;
  justify-self:end;
  align-self:center;
}
.product-row-field--stock{
  width:100%;
}
.product-row-stock-input-wrap{
  position:relative;
}
.product-row-stock-input-wrap .product-row-input{
  padding-right:28px;
}
.product-row-stock-unit-hint{
  position:absolute;
  top:50%;
  right:8px;
  transform:translateY(-50%);
  color:var(--color-text-muted);
  font-size:11px;
  line-height:1;
  pointer-events:none;
  opacity:0;
}
.product-row-stock-input-wrap:focus-within .product-row-stock-unit-hint:not(:empty){
  opacity:1;
}
.product-row .control.product-row-input{
  pointer-events:auto;
  height:28px;
  min-height:28px;
  padding:2px 8px;
  border-color:transparent;
  background:transparent;
  box-shadow:none;
  font-size:14px;
  font-weight:700;
  border-radius:8px;
  text-align:center;
  transition:border-color var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}
.product-row .control.product-row-input:hover{
  background:var(--color-surface-2);
}
.product-row .control.product-row-input:focus{
  border-color:var(--color-primary);
  background:var(--color-surface);
  box-shadow:0 0 0 2px rgba(255, 122, 0, 0.12);
}
.product-row .field-label{
  white-space:nowrap;
  font-size:10px;
}
.product-row-variants-indicator{
  width:var(--product-row-indicator-w);
  min-width:0;
  justify-self:start;
  align-self:center;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--color-primary);
  font-size:12px;
  line-height:1;
  pointer-events:auto;
}
.product-row-variants-toggle{
  border:0;
  background:transparent;
  color:var(--color-primary);
  width:18px;
  height:18px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  pointer-events:auto;
}
.product-row-variants-toggle i{
  font-size:12px;
  line-height:1;
}
.product-row-variants-inline{
  grid-column:1 / -1;
  margin:4px 8px 8px 8px;
}
.product-row-variants-list{
  border:1px solid var(--color-border);
  border-radius:12px;
  background:var(--color-surface);
  padding:6px 10px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.product-row-variants-item{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  line-height:1.3;
  color:var(--color-text);
  min-width:0;
  width:100%;
}
.product-row-variant-default-btn{
  width:20px;
  height:20px;
  border:0;
  background:transparent;
  color:var(--color-text-muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  cursor:pointer;
  flex:0 0 20px;
}
.product-row-variant-default-btn i{
  font-size:14px;
  line-height:1;
}
.product-row-variant-default-btn.is-active{
  color:var(--color-primary);
}
.product-row-variant-default-btn.is-disabled{
  cursor:default;
  opacity:.6;
}
.product-row-variant-default-btn:disabled{
  opacity:.6;
  cursor:wait;
}
.product-row-variants-item.is-muted{
  color:var(--color-text-muted);
}
.product-row-variants-text{
  flex:1 1 auto;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  word-break:normal;
  overflow-wrap:normal;
}
.product-row-variants-photo{
  width:40px;
  height:40px;
  border-radius:8px;
  object-fit:cover;
  display:block;
  flex:0 0 40px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
}
.product-row-variants-photo-placeholder{
  display:block;
}

@media (max-width:1680px){
  [data-view-content="products"] .product-list-header,
  [data-view-content="products"] .product-row{
    --product-row-switch-field-w:clamp(50px, 3.6vw, 58px);
    --product-row-field-w:clamp(70px, 5.2vw, 86px);
    --product-row-stock-field-w:clamp(80px, 6.1vw, 100px);
    --product-row-indicator-w:clamp(16px, 1.7vw, 20px);
    grid-template-columns:50px minmax(180px,1fr) repeat(2, var(--product-row-switch-field-w)) var(--product-row-stock-field-w) repeat(3, var(--product-row-field-w)) var(--product-row-indicator-w);
    gap:5px;
  }
}

@media (max-width:1400px){
  [data-view-content="products"] .product-list-header,
  [data-view-content="products"] .product-row{
    --product-row-switch-field-w:clamp(46px, 3.4vw, 54px);
    --product-row-field-w:clamp(64px, 4.8vw, 78px);
    --product-row-stock-field-w:clamp(74px, 5.6vw, 92px);
    --product-row-indicator-w:clamp(14px, 1.5vw, 18px);
    grid-template-columns:50px minmax(150px,1fr) repeat(2, var(--product-row-switch-field-w)) var(--product-row-stock-field-w) repeat(3, var(--product-row-field-w)) var(--product-row-indicator-w);
    gap:4px;
  }
}

.product-row .product-thumb,
.product-row .product-avatar{
  align-self:center;
}

.product-row-photo-select{
  position:relative;
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:11px 0 0 11px;
  background:var(--primary-14);
  border:0;
  border-right:1px solid var(--primary-25);
  overflow:hidden;
  cursor:pointer;
}
.product-row .product-thumb,
.product-row .product-avatar{
  width:100%;
  height:100%;
  border:0;
  border-radius:0;
  background:transparent;
}
.product-row .product-thumb{
  object-fit:contain;
  object-position:center center;
}
.product-row .product-avatar{
  font-size:18px;
}
.product-row-select-input{
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  cursor:pointer;
}
.product-row-select-control{
  position:absolute;
  left:-26px;
  top:50%;
  z-index:2;
  width:18px;
  height:18px;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  cursor:pointer;
}
.product-row-select-box,
.products-bulk-toggle-all-box{
  position:relative;
  display:block;
  width:16px;
  height:16px;
  box-sizing:border-box;
  border:1.5px solid var(--color-border-strong, var(--color-border));
  border-radius:5px;
  background:var(--color-surface);
  transition:background var(--dur-fast) var(--ease-smooth),
             border-color var(--dur-fast) var(--ease-smooth),
             box-shadow var(--dur-fast) var(--ease-smooth);
}
.product-row-select-box::after,
.products-bulk-toggle-all-box::after{
  display:none;
}
.product-row-select-control:hover .product-row-select-box{
  border-color:var(--color-primary);
}
.product-row-select-input:focus-visible + .product-row-select-box,
.products-bulk-toggle-all-input:focus-visible + .products-bulk-toggle-all-box{
  box-shadow:0 0 0 3px rgba(255, 122, 0, 0.16);
}
.product-row-select-input:checked + .product-row-select-box,
.products-bulk-toggle-all-input:checked + .products-bulk-toggle-all-box{
  border-color:var(--color-primary);
  background:var(--color-primary);
}
.product-row-select-input:checked + .product-row-select-box::after,
.products-bulk-toggle-all-input:checked + .products-bulk-toggle-all-box::after{
  display:none;
}
.products-bulk-toggle-all-input:indeterminate + .products-bulk-toggle-all-box{
  border-color:var(--color-primary);
  background:rgba(255, 122, 0, 0.12);
}
.products-bulk-toggle-all-input:indeterminate + .products-bulk-toggle-all-box::after{
  display:none;
}
.order-row.product-row.is-active{
  border:1px solid var(--color-border);
  box-shadow:none;
}
.order-row.product-row.is-active:hover{
  border-color:var(--color-border);
  box-shadow:none;
  transform:none;
}
.order-row.product-row.is-selected{
  border:1px solid var(--color-border);
  box-shadow:none;
}
.order-row.product-row.is-selected:hover{
  border-color:var(--color-border);
  box-shadow:none;
  transform:none;
}
.order-row.product-row.is-active .product-row-photo-select .product-thumb,
.order-row.product-row.is-selected .product-row-photo-select .product-thumb,
.order-row.product-row.is-active .product-row-photo-select .product-avatar,
.order-row.product-row.is-selected .product-row-photo-select .product-avatar{
  box-shadow:none;
}
.order-row.product-row.is-active .product-row-photo-select,
.order-row.product-row.is-selected .product-row-photo-select{
  border:0;
  border-right:1px solid var(--primary-25);
}
.product-rows-drag-placeholder{
  width:calc(100% - 36px);
  margin-left:28px;
  height:0;
  border-top:2px solid var(--color-primary);
  border-radius:999px;
  margin-top:2px;
  margin-bottom:2px;
  box-sizing:border-box;
}

.products-bulk-footer-actions{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
}
.products-bulk-footer-count{
  margin-right:auto;
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:700;
}
.products-bulk-toggle-all{
  position:relative;
  width:20px;
  height:20px;
  display:grid;
  place-items:center;
  cursor:pointer;
}
.products-bulk-toggle-all-input{
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  cursor:pointer;
}
.products-bulk-toggle-all-box{
  border-color:var(--color-primary);
}
.products-bulk-actions{
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
}
.products-bulk-actions .icon-btn{
  min-width:36px;
  height:36px;
  padding:0 10px;
  border-radius:999px;
  font-size:18px;
  line-height:1;
}
.products-bulk-actions-count{
  font-size:13px;
  color:var(--color-text-muted);
  white-space:nowrap;
}
.products-bulk-menu-wrap{
  position:relative;
}
.products-bulk-menu{
  position:absolute;
  right:0;
  bottom:calc(100% + 8px);
  width:min(320px, calc(100vw - 40px));
  padding:8px;
  border:1px solid var(--color-border);
  border-radius:14px;
  background:var(--color-surface);
  box-shadow:0 12px 30px rgba(0,0,0,.16);
  z-index:40;
}
.products-bulk-menu-item{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:42px;
  padding:0 12px;
  border:1px solid var(--primary-20);
  border-radius:12px;
  cursor:pointer;
  user-select:none;
  color:var(--color-text);
  transition:border-color var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth);
}
.products-bulk-menu-item + .products-bulk-menu-item{
  margin-top:8px;
}
.products-bulk-menu-item:hover{
  border-color:var(--color-primary);
  background:var(--primary-10);
}
.products-bulk-menu-item input[type="checkbox"]{
  width:16px;
  height:16px;
  accent-color:var(--color-primary);
  margin:0;
}
@media (max-width: 1200px){
  .products-bulk-footer-actions{
    flex-wrap:wrap;
  }
  .products-bulk-footer-count{
    width:100%;
    margin-right:0;
  }
  .products-bulk-actions{
    width:100%;
    justify-content:flex-end;
  }
  .products-bulk-menu{
    right:0;
    left:auto;
  }
}

/* Комбо-набор в списке — одна строка, сетка 2×2 как в карточке */
.order-row.combo-row{
  padding:8px 12px;
  grid-template-columns:52px 1fr auto;
  min-height:auto;
}
.combo-row-photo-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:2px;
  width:44px;
  height:44px;
  border-radius:8px;
  overflow:hidden;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
}
.combo-row-photo-grid-cell{
  min-width:0;
  min-height:0;
  background:var(--color-surface-2);
}
.combo-row-photo-grid-cell img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.combo-row-photo-grid-cell-empty{
  background:var(--color-surface-2);
}
.order-row.combo-row .combo-row-content{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;
  min-width:0;
}
.order-row.combo-row .combo-row-content .product-title{
  flex:0 1 auto;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.order-row.combo-row .combo-row-pill{
  flex-shrink:0;
  font-size:11px;
  opacity:.9;
}
.order-row.combo-row .combo-row-muted{
  flex-shrink:0;
  font-size:11px;
}

.product-avatar{
  width:44px;
  height:44px;
  border-radius:14px;
  background:var(--primary-14);
  border:1px solid var(--primary-25);

  display:grid;
  place-items:center;

  font-weight:900;
  font-size:18px;
  color:var(--color-text);
}

.product-avatar i{
  line-height:1;
  display:inline-block;
}
.product-avatar--image{
  border-radius:16px;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
}
.product-avatar-img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.product-title{font-weight:500}
.product-right{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  justify-content:flex-end;
}

/* ================= Right info cards ================= */

.info-card{
  border:1px solid var(--color-border);
  border-radius:12px;
  padding:12px;
  background:var(--color-surface);
  display:grid;
  gap:8px;
}
/* В редакторе блока комбо список товаров визуально входит в основной контейнер,
   поэтому убираем дополнительную карточку-обертку */
#comboInfo .info-card.info-accordion{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
}
.info-title{font-weight:900}
.info-text{color:var(--color-text-muted);font-size:14px}
.info-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.info-label{color:var(--color-text-muted);font-size:13px}
.info-value{font-weight:600;text-align:right;word-break:break-word}
.tenant-profile-card .info-row{padding:6px 0;border-bottom:1px dashed var(--color-border)}
.tenant-profile-card .info-row:last-child{border-bottom:none}
.settings-cards{margin-bottom:12px}
.settings-card{border:1px solid var(--color-border)}
.settings-home-card{
  width:100%;
  min-width:0;
  box-sizing:border-box;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  border-radius:26px;
  background:var(--color-surface);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
  color:var(--color-text);
  font:inherit;
  text-align:left;
  cursor:pointer;
  user-select:none;
  transition:
    background var(--dur-fast) var(--ease-smooth),
    border-color var(--dur-fast) var(--ease-smooth),
    box-shadow var(--dur-fast) var(--ease-smooth),
    transform var(--dur-fast) var(--ease-smooth),
    opacity var(--dur-fast) var(--ease-smooth);
}
.settings-home-card:hover{
  background:var(--color-surface-2);
  transform:translateY(-1px);
}
.settings-home-card:focus-visible{
  outline:none;
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12), inset 0 1px 0 rgba(255,255,255,.55);
}
.settings-home-card.is-active{
  border-color:var(--primary-45);
  background:var(--color-surface);
  box-shadow:0 0 0 4px var(--primary-12), inset 0 1px 0 rgba(255,255,255,.55);
}
.site-panel .settings-home-card.is-active{
  border-color:var(--color-border);
  background:var(--color-surface);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
  transform:none;
}
.site-panel .settings-home-card.is-active:hover{
  background:var(--color-surface-2);
}
.site-panel .settings-home-card:hover{
  background:var(--color-surface-2);
  transform:none;
}
.settings-home-card.is-disabled{
  opacity:.86;
}
.settings-home-card > .product-avatar{
  font-size:16px;
}
.settings-home-card > .order-col{
  min-width:0;
}
.settings-home-card > .order-col:first-of-type{
  display:grid;
  gap:2px;
  align-self:center;
}
.settings-home-card > .order-col:last-child{
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.settings-home-card .product-title{
  min-width:0;
  font-size:15px;
  font-weight:900;
  line-height:1.2;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.settings-home-card .muted{
  min-width:0;
  font-size:12px;
  line-height:1.3;
  color:var(--color-text-muted);
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.settings-home-card .badge{
  white-space:nowrap;
}
@media (max-width:1400px){
  .settings-home-card{
    gap:10px;
    padding:9px 12px;
  }
}
.stores-list .settings-right-panel .info-row{align-items:center;justify-content:flex-start}
.settings-right-panel .info-label{min-width:120px}
.settings-right-panel .control{flex:1 1 auto}
.settings-right-body{
  display:flex;
  flex-direction:column;
  min-height:0;
  overflow:hidden;
}
.panel > .panel-body.settings-right-body{
  display:flex;
  flex-direction:column;
}
.panel > .panel-body.settings-right-body::after{
  content:none;
  display:none;
}
.settings-right-body > .settings-right-panel{
  flex:1 1 auto;
  min-height:0;
}
.settings-right-panel{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.settings-right-panel-fixed-footer{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
  gap:0;
}
.settings-right-panel-fixed-footer .settings-panel-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding-bottom:8px;
}
.settings-right-panel-fixed-footer > .panel-footer{
  flex:0 0 auto;
  margin-top:auto;
  position:static;
  z-index:2;
  background:var(--color-surface);
  border-top:none;
}
#sitePanel{
  flex:1 1 auto;
  min-height:0;
}
#sitePanel > .panel-body{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
}
#settingsPrintApiPanel{
  overflow:hidden;
}
#settingsPrintApiPanel > .panel-footer{
  border-top:1px solid var(--color-border);
  border-bottom-left-radius:16px;
  border-bottom-right-radius:16px;
  margin-top:auto;
}
.settings-delivery-home-empty{
  border:1px dashed var(--color-border);
  border-radius:16px;
  background:var(--color-surface-2);
  padding:20px;
  display:grid;
  gap:6px;
}
.settings-delivery-home-section{
  display:grid;
  gap:12px;
}
.settings-delivery-home-section + .settings-delivery-home-section{
  padding-top:8px;
  border-top:1px solid var(--color-border);
}
.settings-delivery-home-section-head{
  display:grid;
  gap:4px;
}
.settings-delivery-home-section-title{
  font-size:14px;
  font-weight:900;
  color:var(--color-text);
}
.settings-delivery-home-section-text{
  font-size:12px;
  color:var(--color-text-muted);
  line-height:1.4;
}
.product-tabs-home.is-active{
  color:var(--color-text);
  border-color:var(--color-primary);
  background:var(--primary-12);
}
#settingsDeliveryHome .settings-panel-scroll{
  display:grid;
  gap:12px;
}
#settingsDeliveryTabsHeader{
  flex:0 0 auto;
}
#settingsDeliveryHome,
#settingsDeliveryPanel,
#settingsDeliveryZonePanel{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
  gap:0;
}
#settingsDeliveryHome{
  flex:1 1 auto;
  min-height:0;
  height:100%;
  overflow:hidden;
}
#settingsDeliveryPanel{
  flex:1 1 auto;
  min-height:0;
}
#settingsDeliveryZonePanel{
  flex:1 1 auto;
  min-height:0;
}
#settingsDeliveryHome .settings-panel-scroll,
#settingsDeliveryPanel .settings-panel-scroll,
#settingsDeliveryZonePanel .settings-panel-scroll{
  padding:0;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
#settingsDeliveryHome .settings-panel-scroll{
  flex:1 1 auto;
  min-height:0;
  height:100%;
  max-height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  align-content:start;
}
#settingsDeliveryHomeList{
  min-width:0;
  width:100%;
}
.delivery-home-card{
  width:100%;
  min-width:0;
  box-sizing:border-box;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:26px;
  background:var(--color-surface);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
  cursor:pointer;
  transition:border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth), opacity var(--dur-fast) var(--ease-smooth);
}
.delivery-home-card:hover{
  background:var(--color-surface-2);
  transform:translateY(-1px);
}
.delivery-home-card:focus-visible{
  outline:none;
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12), inset 0 1px 0 rgba(255,255,255,.55);
}
.delivery-home-card.is-active{
  border-color:var(--primary-45);
  background:var(--color-surface);
  box-shadow:0 0 0 4px var(--primary-12), inset 0 1px 0 rgba(255,255,255,.55);
}
.delivery-home-card.is-disabled{
  opacity:.86;
}
.delivery-home-card-info{
  min-width:0;
  display:grid;
  gap:2px;
}
.delivery-home-card-title{
  min-width:0;
  font-size:15px;
  font-weight:900;
  line-height:1.2;
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.delivery-home-card-meta{
  min-width:0;
  font-size:12px;
  color:var(--color-text-muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.delivery-home-card-action{
  margin-left:auto;
  min-width:max-content;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
#settingsDeliveryHome .delivery-home-card .badge,
#settingsDeliveryZonesHomeList .delivery-home-card .badge{
  display:none;
}
.settings-delivery-home-status-switch{
  margin:0;
  gap:0;
}
.settings-delivery-home-status-switch .switch-text{
  display:none;
}
.settings-delivery-home-status-switch .switch-ui{
  box-shadow:0 8px 18px rgba(15,23,42,.08), inset 0 1px 2px rgba(0,0,0,.04);
}
.settings-delivery-home-card-avatar{
  width:44px;
  height:44px;
  border-radius:999px;
  border-color:rgba(249,115,22,.18);
  background:var(--primary-12);
  color:var(--color-primary);
}
.settings-delivery-home-card-avatar i{
  font-size:16px;
}
.settings-delivery-home-card-avatar--zone{
  border-color:color-mix(in srgb, var(--delivery-home-zone-color, var(--color-primary)) 18%, rgba(15,23,42,.08));
  background:color-mix(in srgb, var(--delivery-home-zone-color, var(--color-primary)) 12%, var(--color-surface));
}
.delivery-home-card-swatch{
  width:28px;
  height:28px;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.92);
  box-shadow:0 0 0 1px rgba(15,23,42,.1), 0 6px 16px rgba(15,23,42,.14);
}
#settingsDeliveryPanel .settings-panel-scroll,
#settingsDeliveryZonePanel .settings-panel-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding-bottom:0;
}
#settingsDeliveryHome .settings-panel-scroll::-webkit-scrollbar,
#settingsDeliveryPanel .settings-panel-scroll::-webkit-scrollbar,
#settingsDeliveryZonePanel .settings-panel-scroll::-webkit-scrollbar{
  width:0;
  height:0;
}
#settingsDeliveryFooter{
  flex:0 0 auto;
}
#settingsDeliveryZoneFooter{
  flex:0 0 auto;
}
#settingsDeliveryFooter .stores-form-actions.settings-footer-actions{
  margin-top:0;
  padding-top:0;
}
#settingsDeliveryZoneFooter .stores-form-actions.settings-footer-actions{
  margin-top:0;
  padding-top:0;
}
#settingsDomainPanel{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
  gap:0;
}
#settingsDomainPanel .settings-panel-scroll{
  padding:0;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
#settingsDomainPanel .settings-panel-scroll::-webkit-scrollbar{
  width:0;
  height:0;
}
#settingsDomainPanel > .panel-footer{
  padding:0;
  border-top:none;
}
#settingsDomainPanel .domain-new-actions{
  justify-content:flex-end;
}
#settingsTelegramAppPanel{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
  gap:0;
}
#settingsTelegramAppPanel .settings-panel-scroll{
  padding:0;
  align-content:start;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
#settingsTelegramAppPanel .settings-panel-scroll::-webkit-scrollbar{
  width:0;
  height:0;
}
#settingsTelegramAppPanel > .panel-footer{
  padding:0;
  border-top:none;
}
#settingsMaxAppPanel{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
  gap:0;
}
#settingsMaxAppPanel .settings-panel-scroll{
  padding:0;
  align-content:start;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
#settingsMaxAppPanel .settings-panel-scroll::-webkit-scrollbar{
  width:0;
  height:0;
}
#settingsMaxAppPanel > .panel-footer{
  padding:0;
  border-top:none;
}
#settingsStorePanel{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
  gap:0;
  overflow:hidden;
  flex:1 1 auto;
  min-height:0;
}
#settingsStorePanel .settings-panel-scroll{
  padding:0;
  align-content:start;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
#settingsStorePanel .settings-panel-scroll::-webkit-scrollbar{
  width:0;
  height:0;
}
#settingsStorePanel > .panel-footer{
  padding:0;
  border-top:none;
}
#settingsSitePanel{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
  gap:0;
  overflow:hidden;
  flex:1 1 auto;
  min-height:0;
}
#settingsSitePanel .settings-panel-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding:0;
  align-content:start;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
#settingsSitePanel .settings-panel-scroll::-webkit-scrollbar{
  width:0;
  height:0;
}
#settingsSitePanel > .panel-footer{
  padding:0;
  border-top:none;
}
#settingsPrintApiPanel > .panel-footer,
#settingsSoundsPanel > .panel-footer,
#settingsChatAssistantNamePanel > .panel-footer,
#settingsChatOperatorNamePanel > .panel-footer,
#settingsChatMessageSettingsPanel > .panel-footer{
  padding:0;
  border-top:none;
}
#settingsChatMessageSettingsPanel .settings-panel-scroll{
  align-content:start;
}
#settingsSystemTelegramBotPanel{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
  gap:0;
}
#settingsSystemMaxBotPanel{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
  gap:0;
}
#settingsSystemMapPanel{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
  gap:0;
}
#settingsSystemMapPanel .settings-panel-scroll{
  padding:0;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
#settingsSystemMapPanel .settings-panel-scroll::-webkit-scrollbar{
  width:0;
  height:0;
}
#settingsSystemMapPanel > .panel-footer{
  padding:0;
  border-top:none;
}
.settings-system-map-layout{
  width:100%;
  display:grid;
  gap:14px;
  align-content:start;
}
.settings-system-map-group{
  display:grid;
  gap:10px;
}
.settings-system-map-grid{
  display:grid;
  gap:10px;
  grid-template-columns:repeat(2, minmax(0, 1fr));
}
.settings-system-map-grid--triple{
  grid-template-columns:repeat(3, minmax(0, 1fr));
}
.settings-system-map-group .settings-site-field,
.settings-system-map-grid .settings-site-field{
  display:grid;
  gap:4px;
}
.settings-system-map-group .settings-site-field .field-label,
.settings-system-map-grid .settings-site-field .field-label{
  margin-bottom:0;
}
.settings-system-map-group-title{
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  color:var(--color-text-muted);
}
#settingsSystemTelegramBotPanel .settings-panel-scroll{
  padding:0;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
#settingsSystemMaxBotPanel .settings-panel-scroll{
  padding:0;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
#settingsSystemTelegramBotPanel .settings-panel-scroll::-webkit-scrollbar{
  width:0;
  height:0;
}
#settingsSystemMaxBotPanel .settings-panel-scroll::-webkit-scrollbar{
  width:0;
  height:0;
}
#settingsSystemTelegramBotPanel > .panel-footer{
  padding:0;
  border-top:none;
}
#settingsSystemMaxBotPanel > .panel-footer{
  padding:0;
  border-top:none;
}
.settings-system-telegram-layout{
  width:100%;
  display:grid;
  gap:14px;
  align-content:start;
}
.settings-system-telegram-group{
  display:grid;
  gap:10px;
}
.settings-system-telegram-group .settings-site-field{
  display:grid;
  gap:4px;
}
.settings-system-telegram-group .settings-site-field .field-label{
  margin-bottom:0;
}
.settings-system-telegram-switch-field{
  align-items:start;
}
.settings-system-telegram-switch-copy{
  display:grid;
  gap:4px;
}
.settings-system-telegram-switch-copy .field-label{
  margin-bottom:0;
}
.settings-system-telegram-switch-field .switch{
  margin-top:2px;
}
.settings-right-panel .stores-form-actions.settings-footer-actions{
  margin-top:auto;
  padding-top:12px;
}
.delivery-panel{
  flex:1;
  min-height:0;
}
.delivery-panel > .panel-body{
  display:flex;
  flex-direction:column;
  min-height:0;
  padding:0;
  overflow:hidden;
}
.delivery-panel > .panel-body::after{
  height:0;
}
.settings-delivery-map-card{
  margin-top:0;
  border:none;
  border-radius:0;
  background:transparent;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:0;
  flex:1 1 auto;
  min-height:0;
  position:relative;
  overflow:hidden;
}
.settings-delivery-map-header{
  display:grid;
  gap:4px;
}
.settings-delivery-map-toolbar{
  display:grid;
  gap:10px;
}
.settings-delivery-map-search-row{
  display:grid;
  gap:10px;
  grid-template-columns:minmax(0, 1fr) auto;
}
.settings-delivery-map-search-input{
  min-width:0;
}
.settings-delivery-map-search-btn{
  min-width:120px;
  border:none;
  border-radius:14px;
  background:var(--primary);
  color:#fff;
  font-weight:800;
  padding:0 18px;
  cursor:pointer;
  transition:filter var(--dur-fast) var(--ease-smooth), opacity var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-map-search-btn:hover{
  filter:brightness(.97);
}
.settings-delivery-map-search-btn:disabled{
  cursor:not-allowed;
  opacity:.55;
}
.settings-delivery-map-search-status{
  font-size:13px;
  color:var(--color-muted);
  line-height:1.35;
  padding:2px 2px 0;
}
.settings-delivery-map-search-status.is-error{
  color:var(--color-danger, #d35454);
}
.settings-delivery-map-search-status.is-loading{
  color:var(--primary);
}
.settings-delivery-map-results{
  display:grid;
  gap:8px;
}
.settings-delivery-map-result{
  width:100%;
  border:1px solid var(--color-border);
  border-radius:14px;
  background:var(--color-surface-2);
  text-align:left;
  padding:12px 14px;
  cursor:pointer;
  transition:border-color var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-map-result:hover{
  border-color:var(--primary-35);
  background:var(--primary-12);
}
.settings-delivery-map-result-title{
  font-size:14px;
  font-weight:700;
  color:var(--color-text);
}
.settings-delivery-map-result-meta{
  margin-top:4px;
  font-size:12px;
  color:var(--color-muted);
}
.settings-delivery-map-title{
  font-size:18px;
  font-weight:800;
  color:var(--color-text);
}
.settings-delivery-map-subtitle{
  font-size:13px;
  color:var(--color-muted);
}
.settings-delivery-map-empty{
  flex:1 1 auto;
  min-height:0;
  border:none;
  border-radius:0;
  background:var(--color-surface-2);
  display:grid;
  align-content:center;
  justify-items:center;
  gap:8px;
  text-align:center;
  padding:24px;
}
.settings-delivery-map-empty-title{
  font-size:18px;
  font-weight:800;
  color:var(--color-text);
}
.settings-delivery-map-empty-text{
  max-width:540px;
  font-size:14px;
  color:var(--color-muted);
}
.settings-delivery-map-canvas{
  flex:1 1 auto;
  min-height:0;
  border:none;
  border-radius:0;
  overflow:hidden;
  background:var(--color-surface-2);
  position:relative;
  height:calc(100% + 34px);
  margin-bottom:-34px;
}
.settings-delivery-map-canvas.leaflet-container,
.settings-delivery-map-canvas .leaflet-container{
  width:100%;
  min-height:0;
  height:100%;
  border-radius:0;
  position:relative;
}
.settings-delivery-map-canvas::after{
  display:none;
}
.settings-delivery-map-accounts-note{
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface-2);
  padding:14px 16px;
  font-size:13px;
  line-height:1.5;
  color:var(--color-muted);
}
.settings-delivery-map-account-add-btn{
  width:100%;
  justify-content:center;
  gap:8px;
}
.settings-delivery-map-account-editor{
  border:1px solid var(--color-border);
  border-radius:18px;
  background:var(--color-surface-2);
  padding:14px;
  display:grid;
  gap:12px;
}
.settings-delivery-map-account-editor-grid{
  display:grid;
  gap:12px;
  grid-template-columns:1fr;
}
.settings-delivery-map-account-editor-actions{
  display:flex;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:8px;
}
.settings-delivery-map-account-action-btn{
  min-width:140px;
}
.settings-delivery-map-account-list{
  display:grid;
  gap:12px;
}
.settings-delivery-map-account-card{
  border:1px solid var(--color-border);
  border-radius:18px;
  background:var(--color-surface-2);
  padding:14px;
  display:grid;
  gap:12px;
}
.settings-delivery-map-account-card.is-active{
  border-color:var(--primary-35);
  box-shadow:0 0 0 1px var(--primary-12) inset;
}
.settings-delivery-map-account-row{
  display:grid;
  gap:12px;
  grid-template-columns:auto minmax(0, 1fr) auto;
  align-items:start;
}
.settings-delivery-map-account-radio{
  margin-top:4px;
}
.settings-delivery-map-account-main{
  min-width:0;
  display:grid;
  gap:8px;
}
.settings-delivery-map-account-key{
  font-size:15px;
  font-weight:800;
  color:var(--color-text);
  word-break:break-word;
}
.settings-delivery-map-account-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.settings-delivery-map-account-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  background:var(--color-bg);
  color:var(--color-muted);
  font-size:12px;
  font-weight:700;
}
.settings-delivery-map-account-pill.is-active{
  background:var(--primary-12);
  color:var(--primary);
}
.settings-delivery-map-account-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}
.settings-delivery-map-account-actions .btn{
  white-space:nowrap;
}
.settings-delivery-map-account-icon-btn{
  width:34px;
  min-width:34px;
}
.settings-delivery-map-account-reveal,
.settings-delivery-map-account-edit{
  border-top:1px dashed var(--color-border);
  padding-top:12px;
}
.settings-delivery-map-account-reveal-grid{
  display:grid;
  gap:12px;
  grid-template-columns:1fr;
}
.settings-delivery-map-account-reveal-grid .control{
  background:var(--color-bg);
}
.settings-delivery-map-account-reveal-empty{
  margin:0;
}
.settings-delivery-map-account-inline-actions{
  margin-top:12px;
  display:flex;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:8px;
}
.settings-delivery-map-account-inline-actions .btn{
  min-width:140px;
}
.settings-delivery-zone-header{
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}
.settings-delivery-zone-header-main{
  min-width:0;
  flex:1 1 auto;
  display:grid;
  gap:4px;
}
.settings-delivery-zone-title-row{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.settings-delivery-zone-title-row .settings-list-title{
  flex:0 1 auto;
}
.settings-delivery-zone-info-wrap{
  position:relative;
  flex:0 0 auto;
}
.settings-delivery-zone-info-btn{
  width:28px;
  height:28px;
  border:1px solid var(--color-border);
  border-radius:999px;
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:14px;
  font-weight:800;
  line-height:1;
  transition:background var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-info-btn:hover{
  background:var(--color-surface);
  color:var(--color-text);
  transform:translateY(-1px);
}
.settings-delivery-zone-info-btn[aria-expanded="true"]{
  background:var(--primary-12);
  color:var(--color-primary);
  border-color:var(--primary-45);
}
.settings-delivery-zone-info-btn:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px var(--primary-12);
}
.settings-delivery-zone-info-popover{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  z-index:1220;
  width:min(320px, calc(100vw - 48px));
  background:var(--color-surface);
  border:1px solid rgba(15,23,42,.08);
  border-radius:26px;
  box-shadow:0 12px 30px rgba(15,23,42,.22);
  padding:14px;
}
.settings-delivery-zone-info-popover.hidden{
  display:none!important;
}
.settings-delivery-zone-info-text{
  font-size:13px;
  line-height:1.5;
  color:var(--color-text-muted);
  white-space:pre-line;
}
.settings-delivery-zone-header-switch{
  margin-left:auto;
  flex:0 0 auto;
  padding-top:2px;
}
.settings-delivery-zone-header-switch .switch-text{
  font-weight:700;
}
.settings-delivery-zone-map-overlay{
  position:absolute;
  top:16px;
  right:16px;
  z-index:1250;
  display:grid;
  gap:10px;
  width:min(340px, calc(100% - 32px));
  pointer-events:none;
}
.settings-delivery-zone-map-overlay.hidden{
  display:none;
}
.settings-delivery-zone-map-hint,
.settings-delivery-zone-map-actions{
  pointer-events:auto;
}
.settings-delivery-zone-map-hint{
  border:1px solid rgba(15,23,42,.08);
  border-radius:16px;
  background:rgba(255,255,255,.94);
  box-shadow:0 14px 28px rgba(15,23,42,.14);
  padding:12px 14px;
  font-size:13px;
  line-height:1.45;
  color:var(--color-text);
  backdrop-filter:blur(8px);
}
.settings-delivery-zone-map-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}
.settings-delivery-zone-map-action-btn{
  box-shadow:0 10px 22px rgba(15,23,42,.12);
}
.settings-delivery-zone-point-menu{
  position:absolute;
  top:0;
  left:0;
  z-index:1260;
  min-width:220px;
  display:grid;
  gap:4px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:16px;
  background:rgba(255,255,255,.97);
  box-shadow:0 16px 32px rgba(15,23,42,.18);
  padding:6px;
  backdrop-filter:blur(10px);
}
.settings-delivery-zone-point-menu.hidden{
  display:none;
}
.settings-delivery-zone-point-menu-item{
  width:100%;
  border:none;
  border-radius:12px;
  background:transparent;
  color:var(--color-text);
  text-align:left;
  font-size:14px;
  font-weight:600;
  padding:10px 12px;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth), opacity var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-point-menu-item:hover{
  background:var(--color-surface-2);
}
.settings-delivery-zone-point-menu-item:disabled{
  opacity:.48;
  cursor:not-allowed;
}
.settings-delivery-zone-point-menu-item.is-danger{
  color:var(--color-danger, #d35454);
}
.settings-delivery-zone-context-menu{
  position:absolute;
  top:0;
  left:0;
  z-index:1265;
  min-width:190px;
  display:grid;
  gap:4px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:16px;
  background:rgba(255,255,255,.98);
  box-shadow:0 18px 34px rgba(15,23,42,.2);
  padding:6px;
  backdrop-filter:blur(10px);
}
.settings-delivery-zone-context-menu.hidden{
  display:none;
}
.settings-delivery-zone-context-menu-item{
  width:100%;
  border:none;
  border-radius:12px;
  background:transparent;
  color:var(--color-text);
  text-align:left;
  font-size:14px;
  font-weight:600;
  padding:10px 12px;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-context-menu-item:hover{
  background:var(--color-surface-2);
}
.settings-delivery-zone-context-menu-item.is-danger{
  color:var(--color-danger, #d35454);
}
.settings-delivery-zone-handle{
  background:transparent;
  border:none;
  display:flex;
  align-items:center;
  justify-content:center;
}
.settings-delivery-zone-handle-dot{
  --handle-color:var(--color-primary);
  display:block;
  width:100%;
  height:100%;
  border-radius:999px;
  background:#fff;
  border:2px solid var(--handle-color);
  box-shadow:0 3px 10px rgba(15,23,42,.2);
}
.settings-delivery-zone-handle--main .settings-delivery-zone-handle-dot{
  width:16px;
  height:16px;
  border-width:3px;
}
.settings-delivery-zone-handle--main.is-last .settings-delivery-zone-handle-dot{
  --handle-color:#facc15;
}
.settings-delivery-zone-handle--midpoint .settings-delivery-zone-handle-dot{
  width:12px;
  height:12px;
  background:rgba(255,255,255,.96);
  border-width:2px;
  opacity:.95;
}
.settings-delivery-zone-handle--passive .settings-delivery-zone-handle-dot{
  opacity:.82;
}
.settings-delivery-map-card.is-zone-placing .settings-delivery-map-canvas,
.settings-delivery-map-card.is-zone-placing .settings-delivery-map-canvas .leaflet-container{
  cursor:crosshair;
}
.settings-delivery-zone-grid{
  display:grid;
  grid-template-columns:minmax(120px, 160px) minmax(0, 1fr);
  gap:12px;
}
.settings-delivery-setting-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
.settings-delivery-zone-pill-control,
#settingsDeliveryPanel .settings-delivery-zone-pill-control,
#settingsDeliveryZonePanel .settings-delivery-zone-pill-control,
#settingsDeliveryPanel .settings-delivery-zone-tier-row--zone .control,
#settingsDeliveryZonePanel .settings-delivery-zone-tier-row--zone .control{
  width:100%;
  border:1px solid rgba(15,23,42,.08);
  border-radius:999px;
  min-height:48px;
  height:48px;
  padding:0 18px;
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:14px;
  font-weight:600;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
#settingsDeliveryPanel .settings-delivery-zone-tier-row--zone .control:focus,
#settingsDeliveryZonePanel .settings-delivery-zone-tier-row--zone .control:focus,
.settings-delivery-zone-pill-control:focus,
#settingsDeliveryPanel .settings-delivery-zone-pill-control:focus,
#settingsDeliveryZonePanel .settings-delivery-zone-pill-control:focus{
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12);
}
.settings-delivery-zone-color-wrap{
  position:relative;
}
.settings-delivery-zone-color-native{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.settings-delivery-zone-color-trigger{
  width:100%;
  min-height:48px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:999px;
  background:var(--color-surface-2);
  color:var(--color-text);
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 14px;
  cursor:pointer;
  transition:border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-color-trigger:hover{
  background:var(--color-surface);
  transform:translateY(-1px);
}
.settings-delivery-zone-color-trigger:focus-visible{
  outline:none;
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12);
}
.settings-delivery-zone-color-preview{
  width:24px;
  height:24px;
  border-radius:999px;
  flex:0 0 auto;
  background:var(--color-primary);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.4), 0 6px 14px rgba(15,23,42,.12);
}
.settings-delivery-zone-color-value{
  flex:1 1 auto;
  min-width:0;
  text-align:left;
  font-size:14px;
  font-weight:700;
  letter-spacing:.02em;
}
.settings-delivery-zone-color-trigger i{
  flex:0 0 auto;
  font-size:10px;
  color:var(--color-text-muted);
  transition:transform var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-color-trigger[aria-expanded="true"] i{
  transform:rotate(180deg);
}
.settings-delivery-zone-color-popover{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  z-index:1220;
  width:min(292px, calc(100vw - 48px));
  display:grid;
  gap:10px;
  background:var(--color-surface);
  border:1px solid rgba(15,23,42,.08);
  border-radius:26px;
  box-shadow:0 12px 30px rgba(15,23,42,.24);
  padding:12px;
}
.settings-delivery-zone-color-popover.hidden{
  display:none!important;
}
.settings-delivery-zone-color-presets{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:8px;
}
.settings-delivery-zone-color-swatch{
  width:100%;
  aspect-ratio:1 / 1;
  border:none;
  border-radius:16px;
  background:transparent;
  padding:4px;
  cursor:pointer;
  position:relative;
  transition:transform var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-color-swatch::before{
  content:"";
  display:block;
  width:100%;
  height:100%;
  border-radius:999px;
  background:var(--zone-swatch-color, var(--color-primary));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.4);
}
.settings-delivery-zone-color-swatch:hover{
  transform:translateY(-1px);
  background:var(--color-surface-2);
}
.settings-delivery-zone-color-swatch.is-selected{
  background:var(--primary-12);
  box-shadow:0 0 0 1px var(--primary-45);
}
.settings-delivery-zone-color-custom-btn{
  width:100%;
  min-height:42px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:999px;
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-color-custom-btn:hover{
  background:var(--color-surface);
  transform:translateY(-1px);
}
.settings-delivery-zone-color-editor{
  display:grid;
  gap:10px;
}
.settings-delivery-zone-color-editor-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.settings-delivery-zone-color-editor-back,
.settings-delivery-zone-color-editor-done{
  min-height:36px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:999px;
  background:var(--color-surface-2);
  color:var(--color-text);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 14px;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-color-editor-back:hover,
.settings-delivery-zone-color-editor-done:hover{
  background:var(--color-surface);
  transform:translateY(-1px);
}
.settings-delivery-zone-color-editor-back:focus-visible,
.settings-delivery-zone-color-editor-done:focus-visible{
  outline:none;
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12);
}
.settings-delivery-zone-color-editor-preview-row{
  min-height:54px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:24px;
  background:var(--color-surface-2);
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
}
.settings-delivery-zone-color-editor-preview{
  width:26px;
  height:26px;
  border-radius:999px;
  flex:0 0 auto;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.45), 0 8px 20px rgba(15,23,42,.12);
}
.settings-delivery-zone-color-editor-value{
  font-size:14px;
  font-weight:800;
  letter-spacing:.03em;
  color:var(--color-text);
}
.settings-delivery-zone-color-editor-fields{
  display:grid;
  gap:8px;
}
.settings-delivery-zone-color-editor-field{
  display:grid;
  grid-template-columns:20px minmax(0, 1fr) 62px;
  align-items:center;
  gap:10px;
}
.settings-delivery-zone-color-editor-field-name{
  font-size:13px;
  font-weight:800;
  color:var(--color-text-muted);
  text-align:center;
}
.settings-delivery-zone-color-editor-range{
  --zone-range-color:#ff7a00;
  width:100%;
  height:8px;
  border:none;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(15,23,42,.12), var(--zone-range-color));
  appearance:none;
  cursor:pointer;
}
.settings-delivery-zone-color-editor-range::-webkit-slider-runnable-track{
  height:8px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(15,23,42,.12), var(--zone-range-color));
}
.settings-delivery-zone-color-editor-range::-webkit-slider-thumb{
  appearance:none;
  width:16px;
  height:16px;
  border:none;
  border-radius:999px;
  background:#fff;
  box-shadow:0 0 0 2px var(--zone-range-color), 0 4px 12px rgba(15,23,42,.18);
  margin-top:-4px;
}
.settings-delivery-zone-color-editor-range::-moz-range-track{
  height:8px;
  border:none;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(15,23,42,.12), var(--zone-range-color));
}
.settings-delivery-zone-color-editor-range::-moz-range-thumb{
  width:16px;
  height:16px;
  border:none;
  border-radius:999px;
  background:#fff;
  box-shadow:0 0 0 2px var(--zone-range-color), 0 4px 12px rgba(15,23,42,.18);
}
.settings-delivery-zone-color-editor-number{
  min-height:38px;
  height:38px;
  padding:0 12px;
  border-radius:999px;
  border-color:rgba(15,23,42,.08);
  background:var(--color-surface);
  text-align:center;
  font-weight:700;
}
.settings-delivery-zone-color-editor-number:focus{
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12);
}
.settings-delivery-zone-color-editor-range:focus-visible{
  outline:none;
}
.settings-delivery-zone-stores-wrap{
  display:grid;
  gap:10px;
}
.settings-delivery-zone-stores-trigger{
  width:100%;
  min-height:48px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:999px;
  background:var(--color-surface-2);
  color:var(--color-text);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:16px;
  transition:border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-stores-trigger:hover{
  background:var(--color-surface);
  transform:translateY(-1px);
}
.settings-delivery-zone-stores-trigger i{
  pointer-events:none;
}
.settings-delivery-zone-stores-trigger:focus-visible{
  outline:none;
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12);
}
.settings-delivery-zone-stores-list{
  display:grid;
  gap:8px;
}
.settings-delivery-zone-store-empty{
  min-height:48px;
  border:1px dashed var(--color-border);
  border-radius:24px;
  background:var(--color-surface-2);
  padding:12px 16px;
  font-size:13px;
  color:var(--color-text-muted);
  display:flex;
  align-items:center;
}
.settings-delivery-zone-store-pill{
  min-height:52px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:26px;
  background:var(--color-surface-2);
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
}
.settings-delivery-zone-store-pill-icon{
  width:32px;
  height:32px;
  border-radius:999px;
  background:var(--primary-12);
  color:var(--color-primary);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
.settings-delivery-zone-store-pill-content{
  flex:1 1 auto;
  min-width:0;
  display:grid;
  gap:2px;
}
.settings-delivery-zone-store-pill-title{
  font-size:14px;
  font-weight:700;
  color:var(--color-text);
}
.settings-delivery-zone-store-pill-meta{
  font-size:12px;
  color:var(--color-text-muted);
}
.settings-delivery-zone-store-pill-remove{
  border:none;
  background:transparent;
  color:var(--color-text-muted);
  width:24px;
  height:24px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  border-radius:999px;
  flex:0 0 auto;
  transition:color var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-store-pill-remove:hover{
  color:var(--color-text);
  background:rgba(15,23,42,.05);
  transform:scale(1.04);
}
.settings-delivery-zone-store-pill-remove:focus-visible{
  outline:none;
  color:var(--color-text);
  background:rgba(15,23,42,.06);
  box-shadow:0 0 0 4px var(--primary-12);
}
.settings-delivery-zone-tier-head{
  display:grid;
  gap:8px;
  margin-bottom:10px;
}
#settingsDeliveryPanel .settings-delivery-zone-tier-head .btn,
#settingsDeliveryZonePanel .settings-delivery-zone-tier-head .btn{
  width:100%;
  min-height:42px;
  border-radius:999px;
  padding-inline:14px;
  font-weight:700;
  background:var(--color-surface-2);
  justify-content:center;
}
.settings-delivery-zone-tier-list{
  display:grid;
  gap:10px;
}
.settings-delivery-zone-tier-empty{
  border:1px dashed var(--color-border);
  border-radius:14px;
  background:var(--color-surface-2);
  padding:12px 14px;
  font-size:13px;
  color:var(--color-text-muted);
}
.settings-delivery-zone-tier-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;
  gap:10px;
  align-items:end;
  border:1px solid rgba(15,23,42,.08);
  border-radius:24px;
  background:var(--color-surface-2);
  padding:14px;
}
.settings-delivery-zone-tier-row--zone{
  border:none;
  border-radius:0;
  background:transparent;
  padding:0;
  gap:8px;
}
#settingsDeliveryPanel .settings-delivery-zone-tier-remove,
#settingsDeliveryZonePanel .settings-delivery-zone-tier-remove{
  width:24px;
  height:24px;
  padding:0;
  border:none;
  border-radius:999px;
  background:transparent;
  color:var(--color-text-muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  align-self:center;
  justify-self:center;
  cursor:pointer;
  transition:color var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
#settingsDeliveryPanel .settings-delivery-zone-tier-remove:hover,
#settingsDeliveryZonePanel .settings-delivery-zone-tier-remove:hover{
  color:var(--color-text);
  background:rgba(15,23,42,.05);
  transform:scale(1.04);
}
#settingsDeliveryPanel .settings-delivery-zone-tier-remove:focus-visible,
#settingsDeliveryZonePanel .settings-delivery-zone-tier-remove:focus-visible{
  outline:none;
  color:var(--color-text);
  background:rgba(15,23,42,.06);
  box-shadow:0 0 0 4px var(--primary-12);
}
#settingsDeliveryPanel .settings-delivery-zone-tier-field,
#settingsDeliveryZonePanel .settings-delivery-zone-tier-field{
  margin-bottom:0;
}
.settings-delivery-default-store-selector{
  width:100%;
  z-index:3;
}
.settings-delivery-default-store-selector .new-order-right-select-trigger{
  width:100%;
  min-height:48px;
  height:48px;
  justify-content:space-between;
  padding:0 18px;
  border:1px solid rgba(15,23,42,.08);
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:14px;
  font-weight:600;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
  transition:border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-default-store-selector .new-order-right-select-trigger:hover{
  background:var(--color-surface);
  transform:translateY(-1px);
}
.settings-delivery-default-store-selector .new-order-right-select-trigger:focus-visible{
  outline:none;
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12);
}
.settings-delivery-default-store-selector .new-order-right-select-trigger:disabled{
  opacity:.6;
  cursor:not-allowed;
  transform:none;
}
.settings-delivery-default-store-selector .cash-toolbar-filter-main{
  flex:1 1 auto;
  min-width:0;
  justify-content:flex-start;
}
.settings-delivery-default-store-selector .cash-toolbar-filter-main span:last-child{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.settings-delivery-default-store-selector .new-order-right-select-menu{
  display:none;
  left:0;
  transform:none;
  width:100%;
  max-height:220px;
}
.settings-delivery-default-store-selector.is-open .new-order-right-select-menu{
  display:grid;
}
.settings-delivery-default-store-selector .new-order-right-select-option{
  justify-content:flex-start;
  padding:0 16px;
  font-size:14px;
  font-weight:700;
}
.settings-delivery-default-store-selector.is-disabled .new-order-right-select-menu{
  display:none!important;
}
.settings-delivery-setting-note{
  margin-top:6px;
}
.settings-delivery-zone-tier-caption{
  font-size:12px;
  color:var(--color-text-muted);
}
.settings-delivery-zone-stores-modal{
  display:grid;
  gap:12px;
}
.settings-delivery-zone-stores-modal-note{
  font-size:13px;
  line-height:1.45;
  color:var(--color-text-muted);
}
.settings-delivery-zone-stores-modal-list{
  display:grid;
  gap:10px;
}
.settings-delivery-zone-stores-modal-empty{
  border:1px dashed var(--color-border);
  border-radius:24px;
  background:var(--color-surface-2);
  padding:14px 16px;
  font-size:13px;
  color:var(--color-text-muted);
}
.settings-delivery-zone-stores-modal-item{
  width:100%;
  border:1px solid rgba(15,23,42,.08);
  border-radius:26px;
  background:var(--color-surface);
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:12px;
  padding:12px 14px;
  text-align:left;
  cursor:pointer;
  transition:border-color var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-stores-modal-item:hover{
  background:var(--color-surface-2);
  transform:translateY(-1px);
}
.settings-delivery-zone-stores-modal-item.is-selected{
  border-color:var(--primary-45);
  background:var(--primary-12);
  box-shadow:0 12px 28px rgba(15,23,42,.08);
}
.settings-delivery-zone-stores-modal-item-marker{
  width:22px;
  height:22px;
  border-radius:999px;
  border:2px solid var(--color-border);
  background:var(--color-surface);
  flex:0 0 auto;
  transition:border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}
.settings-delivery-zone-stores-modal-item.is-selected .settings-delivery-zone-stores-modal-item-marker{
  border-color:var(--color-primary);
  box-shadow:inset 0 0 0 4px var(--color-surface), inset 0 0 0 10px var(--color-primary);
}
.settings-delivery-zone-stores-modal-item-content{
  min-width:0;
  display:grid;
  gap:2px;
}
.settings-delivery-zone-stores-modal-item-title{
  font-size:14px;
  font-weight:800;
  color:var(--color-text);
}
.settings-delivery-zone-stores-modal-item-meta{
  font-size:12px;
  color:var(--color-text-muted);
}
.settings-delivery-zone-stores-modal-body{
  padding-bottom:4px!important;
}
.settings-delivery-map-card .leaflet-pm-toolbar{
  display:none !important;
}
.settings-logo-grid{
  display:grid;
  gap:16px;
  grid-template-columns:repeat(2, minmax(0, 1fr));
}
@media (max-width: 920px){
  .settings-logo-grid{grid-template-columns:1fr}
  .settings-system-map-grid{grid-template-columns:1fr}
  .settings-system-map-grid--triple{grid-template-columns:1fr}
  .settings-delivery-map-search-toolbar{
    width:220px;
    min-width:180px;
  }
  .settings-delivery-map-search-popover{
    width:min(360px, calc(100vw - 32px));
  }
  .settings-delivery-city-selector .new-order-right-select-trigger{
    min-width:160px;
  }
  .settings-delivery-map-info-popover{
    width:min(320px, calc(100vw - 32px));
  }
  .settings-delivery-map-empty,
  .settings-delivery-map-canvas,
  .settings-delivery-map-canvas .leaflet-container{
    min-height:0;
  }
  .settings-delivery-map-account-editor-grid,
  .settings-delivery-map-account-reveal-grid,
  .settings-delivery-map-account-row{
    grid-template-columns:1fr;
  }
  .settings-delivery-zone-map-overlay{
    left:12px;
    right:12px;
    top:12px;
    width:auto;
  }
  .settings-delivery-zone-map-actions{
    justify-content:stretch;
  }
  .settings-delivery-zone-map-action-btn{
    flex:1 1 calc(50% - 4px);
    justify-content:center;
  }
  .settings-delivery-zone-grid,
  .settings-delivery-zone-tier-row--zone{
    grid-template-columns:1fr;
  }
  .settings-delivery-zone-header{
    flex-direction:column;
    align-items:stretch;
  }
  .settings-delivery-zone-header-switch{
    margin-left:0;
    padding-top:0;
  }
  .settings-delivery-zone-info-popover,
  .settings-delivery-zone-color-popover{
    width:min(292px, calc(100vw - 48px));
  }
  .settings-delivery-map-account-actions{
    justify-content:flex-start;
  }
  .settings-delivery-map-account-editor-actions,
  .settings-delivery-map-account-inline-actions{
    flex-direction:column;
  }
  .settings-delivery-map-account-action-btn,
  .settings-delivery-map-account-inline-actions .btn{
    width:100%;
    min-width:0;
  }
}
.settings-logo-tile{display:grid;gap:8px}
.settings-logo-title{font-weight:700}
.settings-logo-box{
  border:1px dashed var(--color-border);
  border-radius:14px;
  background:var(--color-surface-2);
  display:grid;
  place-items:center;
  aspect-ratio:1/1;
  min-height:160px;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth);
}
.settings-logo-box:hover{background:var(--primary-12);border-color:var(--primary-25)}
.settings-logo-preview{max-width:70%;max-height:70%;object-fit:contain}
.settings-logo-hint{font-size:12px;color:var(--color-text-muted);text-align:center;padding:0 8px}
.settings-logo-actions{display:flex;gap:8px}
.settings-sounds-grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.settings-sound-tile{display:grid;gap:8px}
.settings-sound-title{font-weight:700}
.settings-sound-hint{font-size:12px;color:var(--color-text-muted)}
.settings-sound-box{
  border:1px dashed var(--color-border);
  border-radius:14px;
  padding:12px;
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.settings-sound-label{font-size:13px;color:var(--color-text-muted);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.settings-sound-actions{display:flex;gap:8px}
.settings-site-form{display:grid;gap:12px}
.settings-site-field .field-label{margin-bottom:6px;display:block}
.settings-site-inline-switch{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.settings-site-inline-switch .field-label{
  margin-bottom:0;
}
.settings-site-inline-switch .switch{
  margin-left:auto;
  flex:0 0 auto;
}
.settings-site-field.is-disabled{
  opacity:.68;
}
.settings-chat-questions-grid.is-disabled{
  opacity:.68;
}
.settings-auth-photo-box{
  width:120px;
  aspect-ratio:1 / 1;
  border:1px dashed var(--color-border);
  border-radius:30px;
  background:var(--color-surface-2);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.settings-auth-photo-img{
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:30px;
}
.settings-auth-top{
  margin-bottom:12px;
  display:grid;
  grid-template-columns:minmax(120px, 140px) 1fr;
  gap:12px 18px;
  align-items:start;
}
.settings-auth-photo-column{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.settings-auth-meta-column{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.settings-auth-meta-column .settings-site-field{
  margin-bottom:0;
}
.settings-auth-top .settings-site-field{
  margin-bottom:0;
}
@media (max-width: 960px){
  .settings-auth-top{
    grid-template-columns:1fr;
  }
}
.settings-auth-photo-icon{
  width:72px;
  height:72px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
}
.settings-auth-photo-icon--telegram{
  background:#2aabee;
  color:#fff;
  font-size:34px;
}
.settings-auth-photo-icon--max{
  background:#111;
  color:#f59a3c;
  font-size:24px;
  letter-spacing:0.5px;
}
.settings-chat-panel-actions{margin-top:4px}
.settings-right-panel .stores-form-actions.settings-footer-actions.settings-chat-panel-actions{
  margin-top:auto;
  padding-top:12px;
}
#settingsChatAssistantNamePanel{
  overflow:hidden;
}
#settingsChatAssistantNamePanel .settings-site-form{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  align-content:start;
  -ms-overflow-style:none;
  scrollbar-width:none;
}
#settingsChatAssistantNamePanel .settings-site-form::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}
#settingsChatAssistantNamePanel .stores-form-actions.settings-footer-actions.settings-chat-panel-actions{
  flex:0 0 auto;
}
.settings-chat-questions-grid{
  display:grid;
  gap:10px;
  grid-template-columns:1fr;
}
.settings-chat-question-row{
  border:1px solid var(--color-border);
  border-radius:12px;
  background:#ffffff;
  padding:10px 12px;
  display:grid;
  gap:8px;
  transition:background var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}
.settings-chat-question-row:hover{background:#f8f8f9}
.settings-chat-question-row:focus-within{
  border-color:var(--primary-45);
  box-shadow:0 0 0 3px var(--primary-12);
}
.settings-chat-question-row.is-system{
  background:#fff9f2;
}
.settings-chat-question-row-head{
  display:flex;
  align-items:center;
  gap:10px;
}
.settings-chat-welcome-label{
  margin-bottom:0 !important;
  flex:1 1 auto;
}
.settings-chat-quick-questions-head{
  padding:0 12px 0 0;
  margin-bottom:6px;
}
.settings-chat-quick-questions-label{
  margin-bottom:0 !important;
  flex:1 1 auto;
  min-width:0;
  padding-right:14px;
}
.settings-chat-question-row-controls{
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
  margin-left:auto;
}
.settings-chat-question-row.is-system .settings-chat-question-row-controls::after{
  content:"";
  display:block;
  width:30px;
  height:30px;
  flex:0 0 30px;
}
.settings-chat-question-expand-btn{
  width:30px;
  height:30px;
  border:1px solid var(--color-border);
  border-radius:10px;
  background:#fff;
  color:#7f8a99;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  flex:0 0 auto;
  transition:color var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth);
}
.settings-chat-question-expand-btn i{
  font-size:12px;
  transition:transform var(--dur-fast) var(--ease-smooth);
}
.settings-chat-question-row.is-expanded .settings-chat-question-expand-btn i{
  transform:rotate(180deg);
}
.settings-chat-question-expand-btn:hover{
  color:#4d5a6b;
  border-color:#d7dce4;
  background:#f7f9fc;
}
.settings-chat-question-row-body{
  display:grid;
  gap:8px;
}
.settings-chat-question-row.is-collapsed .settings-chat-question-row-body{
  display:none;
}
.settings-chat-question-input{
  flex:1 1 auto;
  min-width:0;
  width:auto;
  border:none !important;
  background:transparent !important;
  padding:0 !important;
  height:auto !important;
  text-align:left;
  font-size:15px;
  font-weight:700;
  color:#2f3137;
}
.settings-chat-question-input.is-readonly{
  pointer-events:none;
  color:#1f2d3d;
}
.settings-chat-question-input:focus{
  outline:none;
  box-shadow:none !important;
}
.settings-chat-question-answer{
  min-height:68px;
  resize:vertical;
}
.settings-chat-question-switch{
  gap:0;
}
.settings-chat-question-switch .switch-text{
  display:none;
}
.settings-chat-question-delete-btn{
  width:30px;
  height:30px;
  border:1px solid var(--color-border);
  border-radius:10px;
  background:#fff;
  color:#7f8a99;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:color var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth);
}
.settings-chat-question-delete-btn:hover{
  color:#e24a4a;
  border-color:#f1b9b9;
  background:#fff5f5;
}
.settings-chat-question-add-wrap{
  display:flex;
  justify-content:center;
  align-items:center;
  margin-top:10px;
  margin-bottom:2px;
  width:54px;
  height:54px;
  margin-left:auto;
  margin-right:auto;
  border:1px solid #e3e6eb;
  border-radius:12px;
  background:#f6f7f9;
}
.settings-chat-question-add-btn{
  width:32px;
  height:32px;
  border:none;
  border-radius:50%;
  background:#ff8a00;
  color:#fff;
  display:inline-grid;
  place-items:center;
  font-size:0;
  font-weight:400;
  line-height:1;
  cursor:pointer;
  padding:0;
  transition:background var(--dur-fast) var(--ease-smooth), opacity var(--dur-fast) var(--ease-smooth);
  box-shadow:none;
}
.settings-chat-question-add-btn:hover{
  background:#f57c00;
}
.settings-chat-question-add-btn i{
  font-size:13px;
  line-height:1;
  color:inherit;
  display:block;
  margin:0;
}
.settings-chat-question-add-btn[disabled]{
  opacity:.5;
  cursor:not-allowed;
  background:#ff8a00;
}
.settings-chat-gender-options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:4px;
}
.settings-chat-gender-option{
  position:relative;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:flex-start;
  padding:10px 12px;
  border:1px solid var(--color-border);
  border-radius:12px;
  background:#fff;
}
.settings-chat-gender-input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.settings-chat-gender-dot{
  width:18px;
  height:18px;
  border-radius:999px;
  border:2px solid var(--color-border);
  background:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 18px;
  transition:border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}
.settings-chat-gender-dot::after{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--color-primary);
  transform:scale(0);
  transition:transform var(--dur-fast) var(--ease-smooth);
}
.settings-chat-gender-input:checked + .settings-chat-gender-dot{
  border-color:var(--color-primary);
}
.settings-chat-gender-input:checked + .settings-chat-gender-dot::after{
  transform:scale(1);
}
.settings-chat-gender-input:focus-visible + .settings-chat-gender-dot{
  box-shadow:0 0 0 3px var(--primary-12);
}
.settings-chat-gender-label{
  font-size:14px;
  font-weight:700;
}
.settings-print-api-token-actions{margin-top:8px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.settings-password-grid{display:grid;gap:8px}
.settings-password-grid .btn{justify-self:start}
.settings-site-link{margin-top:6px;display:flex;gap:6px;align-items:center;font-size:12px;color:var(--color-text-muted)}
.settings-site-link-url{color:var(--color-primary);text-decoration:none;font-weight:600}
.settings-site-link-url:hover{text-decoration:underline}
.field-hint{font-size:12px;color:var(--color-text-muted)}
.control-with-action{position:relative;margin-top:6px}
.control-with-action .control{width:100%;padding-right:36px}
.control-inline-btn{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:none;border-radius:var(--radius-sm);background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--color-text-muted);transition:color .15s,background .15s}
.control-inline-btn:hover{color:var(--color-primary);background:var(--color-bg-hover)}
.site-name-row{display:flex;align-items:flex-start;gap:10px}
.site-name-row .control{flex:1}
.site-favicon-box{position:relative;display:flex;flex-direction:column;align-items:center;flex:0 0 auto}
.site-favicon-btn{width:40px;height:40px;border:1px dashed var(--color-border);border-radius:8px;background:var(--color-surface-2);display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;padding:0;transition:border-color var(--dur-fast)}
.site-favicon-btn:hover{border-color:var(--color-primary)}
.site-favicon-preview{width:100%;height:100%;object-fit:cover;border-radius:7px}
.site-favicon-preview:not(.hidden)~.site-favicon-plus{display:none}
.site-favicon-plus{font-size:18px;color:var(--color-text-muted);line-height:1}
.site-favicon-delete{position:absolute;top:-5px;right:-5px;width:16px;height:16px;border-radius:50%;border:none;background:var(--color-danger,#e74c3c);color:#fff;font-size:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;line-height:1;opacity:0;transition:opacity .15s}
.site-favicon-box:hover .site-favicon-delete:not(.hidden){opacity:1}
.site-favicon-label{font-size:10px;color:var(--color-text-muted);margin-top:2px;text-align:center}
.control-subdomain-wrap{display:flex;align-items:center;border:1px solid var(--color-border);border-radius:10px;background:var(--color-surface-2);padding:0 12px;height:40px;cursor:text;overflow:hidden;transition:border-color var(--dur-fast) var(--ease-smooth),box-shadow var(--dur-fast) var(--ease-smooth)}
.control-subdomain-wrap:focus-within{border-color:var(--primary-45);box-shadow:0 0 0 4px var(--primary-12)}
.control-subdomain-prefix,.control-subdomain-suffix{font-size:inherit;color:var(--color-text-muted);white-space:nowrap;user-select:none;pointer-events:none;flex:0 0 auto}
.control-subdomain-input{border:none;outline:none;background:transparent;color:var(--color-text);padding:0;flex:1 1 auto;min-width:40px;font:inherit}
.settings-subdomain-actions{display:flex;gap:6px;margin-top:6px}
.settings-subdomain-actions:empty{display:none}
.domain-instructions{background:var(--color-surface-2);border-radius:10px;padding:12px 14px}
.domain-instructions .domain-dns-hint{font-size:13px;color:var(--color-text-muted);line-height:1.5;margin:0}
.domain-instructions .domain-dns-hint.muted{margin-top:8px;font-size:12px}
.domain-step-list{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.domain-step{display:flex;align-items:flex-start;gap:10px}
.domain-step-index{width:20px;height:20px;border-radius:999px;background:var(--primary-12);color:var(--color-primary);font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:0 0 auto;margin-top:1px}
.domain-step-text{font-size:13px;color:var(--color-text);line-height:1.45}
.domain-record-list{display:flex;flex-direction:column;gap:8px}
.domain-record-item{display:grid;grid-template-columns:56px 52px minmax(0,1fr) 24px;align-items:center;gap:8px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:8px;padding:8px 10px}
.domain-record-item .control-inline-btn{position:static;transform:none;justify-self:end}
.domain-record-host,.domain-record-type{font-size:13px;font-weight:700;color:var(--color-text)}
.domain-record-value{font-size:13px;font-weight:600;color:var(--color-text);min-width:0;overflow-wrap:anywhere}
.domain-managed-list{display:flex;flex-direction:column;gap:8px}
.domain-managed-list:empty{display:none}
.domain-managed-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--color-border);border-radius:10px;background:var(--color-surface-2);cursor:pointer}
.domain-managed-item.is-selected{border-color:var(--color-primary);box-shadow:0 0 0 1px var(--color-primary)}
.domain-managed-item.is-disabled{border-style:dashed;background:color-mix(in srgb, var(--color-surface-2), #f5efe4 42%)}
.domain-managed-meta{display:grid;gap:2px;min-width:0}
.domain-managed-domain{font-size:13px;font-weight:700;color:var(--color-text);overflow-wrap:anywhere}
.domain-managed-ascii{font-size:11px;color:var(--color-text-muted);overflow-wrap:anywhere}
.domain-managed-status{font-size:11px;font-weight:600;color:var(--color-text-muted)}
.domain-managed-status.is-disabled{color:var(--color-warning,#f39c12)}
.domain-managed-actions{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.domain-managed-switch{gap:0}
.domain-managed-btn{width:28px;height:28px;border-radius:8px;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text-muted);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background var(--dur-fast) var(--ease-smooth),color var(--dur-fast) var(--ease-smooth),border-color var(--dur-fast) var(--ease-smooth)}
.domain-managed-btn:hover{border-color:var(--primary-25);color:var(--color-primary);background:var(--primary-12)}
.domain-managed-btn.is-danger:hover{border-color:rgba(231,76,60,.35);color:#e74c3c;background:rgba(231,76,60,.08)}
.domain-managed-btn.is-hidden-ghost{visibility:hidden;pointer-events:none}
.domain-managed-empty{padding:12px;border:1px dashed var(--color-border);border-radius:10px;background:var(--color-surface-2);font-size:13px;color:var(--color-text-muted)}
.domain-action-row{display:flex;flex-wrap:wrap;gap:8px}
.domain-action-row .btn{flex:0 0 auto}
.domain-ns-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.domain-ns-item{display:flex;align-items:center;gap:8px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:8px;padding:6px 10px}
.domain-ns-value{font-size:13px;font-weight:600;color:var(--color-text);flex:1}
.domain-ns-item .control-inline-btn{position:static;transform:none;width:24px;height:24px;flex:0 0 auto}
.domain-check-list{display:flex;flex-direction:column;gap:6px}
.domain-check-item{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--color-surface-2);border-radius:8px}
.domain-check-icon{font-size:8px;flex:0 0 auto;color:var(--color-text-muted)}
.domain-check-icon.is-ok{color:var(--color-success,#27ae60)}
.domain-check-icon.is-fail{color:var(--color-danger,#e74c3c)}
.domain-check-icon.is-pending{color:var(--color-warning,#f39c12)}
.domain-check-text{font-size:13px;color:var(--color-text);flex:1}
.domain-check-status{font-size:12px;color:var(--color-text-muted);flex:0 0 auto}
.domain-check-status.is-strong{color:var(--color-text);font-weight:600}
.domain-pwa-card{display:grid;gap:12px;padding:12px;border:1px solid var(--color-border);border-radius:12px;background:var(--color-surface-2)}
.domain-pwa-top{display:grid;gap:8px}
.domain-pwa-select{width:100%}
.domain-pwa-actions{display:flex;flex-wrap:wrap;gap:8px}
.domain-pwa-preview{display:grid;grid-template-columns:132px minmax(0,1fr);gap:14px;align-items:center}
.domain-pwa-qr-wrap{display:flex;align-items:center;justify-content:center;padding:10px;border-radius:12px;background:var(--color-surface);border:1px solid var(--color-border);min-height:132px}
.domain-pwa-qr-image{display:flex;align-items:center;justify-content:center;width:112px;height:112px;max-width:100%}
.domain-pwa-qr-image>img,.domain-pwa-qr-image>canvas{display:block;width:112px!important;height:112px!important;max-width:100%;max-height:100%}
.domain-pwa-meta{display:grid;gap:6px;min-width:0}
.domain-pwa-title{font-size:14px;font-weight:700;color:var(--color-text)}
.domain-pwa-url{font-size:12px;line-height:1.45;color:var(--color-text-muted);overflow-wrap:anywhere}
.domain-pwa-empty{padding:12px;border:1px dashed var(--color-border);border-radius:10px;background:var(--color-surface);font-size:13px;color:var(--color-text-muted)}
.tenant-qr-inline-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(76px,92px);gap:10px;align-items:stretch}
.tenant-qr-inline-col{min-width:0}
.tenant-qr-color-input{padding:4px 6px;height:38px}
.tenant-qr-ratio-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:8px}
.tenant-qr-ratio-btn{
  height:38px;border-radius:12px;border:1px solid var(--color-border);background:var(--color-surface);
  color:var(--color-text);font-size:13px;font-weight:700;cursor:pointer;transition:all .16s ease
}
.tenant-qr-ratio-btn:hover{border-color:var(--color-primary);transform:translateY(-1px)}
.tenant-qr-ratio-btn.is-active{background:var(--primary-12);border-color:var(--primary-25);color:var(--color-primary)}
.tenant-qr-swatch-row{display:flex;flex-wrap:wrap;gap:10px}
.tenant-qr-swatch{
  position:relative;width:34px;height:34px;border-radius:999px;border:2px solid rgba(255,255,255,.85);
  box-shadow:0 8px 20px rgba(15,23,42,.1), 0 0 0 1px var(--color-border);cursor:pointer;transition:transform .16s ease, box-shadow .16s ease
}
.tenant-qr-swatch:hover{transform:translateY(-1px)}
.tenant-qr-swatch.is-active{box-shadow:0 10px 24px rgba(15,23,42,.14), 0 0 0 2px var(--color-primary)}
.tenant-qr-swatch--bg{width:34px;height:34px}
.tenant-qr-toolbar{display:flex;flex-wrap:wrap;gap:8px}
.tenant-qr-toolbar>.btn{justify-content:center}
.tenant-qr-upload-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:8px}
.tenant-qr-upload-row>.btn{width:100%;min-width:0;justify-content:center}
.tenant-qr-designer-preview-field{display:grid;gap:10px;min-width:0}
.tenant-qr-inline-grid--bg-controls{
  grid-template-columns:minmax(0,1fr) minmax(76px,92px);
  align-items:start;
}
.tenant-qr-inline-grid--bg-controls .tenant-qr-inline-col:first-child{
  display:grid;
  align-content:start;
}
.tenant-qr-ratio-inline-field{
  display:grid;
  gap:8px;
  min-width:0;
}
.tenant-qr-preview-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(188px,232px);
  gap:10px;
  align-items:start;
}
.tenant-qr-preview-side{
  display:grid;
  gap:10px;
  align-content:start;
  min-width:0;
}
#settingsPwaQrPanel{
  flex:1 1 auto;
  min-height:0;
  gap:8px;
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
  box-shadow:none;
}
#settingsPwaQrPanel .settings-list-header{
  flex:0 0 auto;
}
#settingsPwaQrPanel > .tenant-qr-designer-preview-field{
  flex:0 0 auto;
  margin-bottom:2px;
}
#settingsPwaQrPanel .settings-panel-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  overflow-x:hidden;
  padding-right:4px;
  overscroll-behavior:contain;
}
#settingsPwaQrPanel .settings-site-field,
#settingsPwaQrPanel .tenant-qr-inline-grid,
#settingsPwaQrPanel .tenant-qr-swatch-row,
#settingsPwaQrPanel .tenant-qr-upload-row,
#settingsPwaQrPanel .tenant-qr-designer-preview-field,
#settingsPwaQrPanel .tenant-qr-linkbox,
#settingsPwaQrPanel .tenant-qr-actions,
#settingsPwaQrPanel .tenant-qr-logo-toggle-field,
#settingsPwaQrPanel .tenant-qr-stepper-field{
  min-width:0;
}
.tenant-qr-card-stage{
  position:relative;
  display:flex;align-items:flex-start;justify-content:flex-start;min-height:0;padding:8px;border-radius:14px;
  border:none;background:transparent;
  overflow:visible;overscroll-behavior:contain;-ms-overflow-style:none;scrollbar-width:none
}
.tenant-qr-card-stage--trigger{
  cursor:zoom-in;
}
.tenant-qr-card-stage--trigger[aria-expanded="true"]{
  cursor:zoom-out;
}
.tenant-qr-card-stage--trigger:hover{
  transform:translateY(-1px);
}
.tenant-qr-card-stage--trigger:focus-visible{
  outline:2px solid rgba(249,115,22,.42);
  outline-offset:3px;
}
.tenant-qr-card-stage::-webkit-scrollbar{display:none}
.tenant-qr-card{
  position:relative;width:280px;height:280px;border-radius:var(--tenant-qr-card-radius,30px);overflow:hidden;
  box-shadow:none;isolation:isolate;flex:0 0 auto;
  --tenant-qr-content-scale:1;
  --tenant-qr-shell-size:160px;
  --tenant-qr-card-radius:30px;
  --tenant-qr-shell-radius:16px
}
.tenant-qr-card__bg,.tenant-qr-card__overlay{
  position:absolute;inset:0
}
.tenant-qr-card__bg{
  background:linear-gradient(135deg,#fff7ed 0%,#ffedd5 100%);
  background-size:cover;background-position:center
}
.tenant-qr-card__overlay{background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.03))}
.tenant-qr-card__content{
  position:relative;z-index:1;height:100%;
  padding:calc(22px * var(--tenant-qr-content-scale,1));
  color:var(--tenant-qr-card-text,#111827)
}
.tenant-qr-card__layout{
  display:grid;grid-template-columns:minmax(0,1fr);align-items:center;justify-items:center;
  gap:calc(18px * var(--tenant-qr-content-scale,1));height:100%;width:100%
}
.tenant-qr-card.is-vertical .tenant-qr-card__content{
  padding:
    calc(20px * var(--tenant-qr-content-scale,1))
    calc(18px * var(--tenant-qr-content-scale,1))
    calc(18px * var(--tenant-qr-content-scale,1))
}
.tenant-qr-card.is-vertical .tenant-qr-card__layout{
  grid-template-rows:auto minmax(0,1fr);
  align-items:stretch;
  justify-items:stretch;
  gap:calc(14px * var(--tenant-qr-content-scale,1))
}
.tenant-qr-card.is-vertical .tenant-qr-card__meta{align-content:start}
.tenant-qr-card.is-vertical-tall .tenant-qr-card__content{
  padding:
    calc(18px * var(--tenant-qr-content-scale,1))
    calc(16px * var(--tenant-qr-content-scale,1))
    calc(16px * var(--tenant-qr-content-scale,1))
}
.tenant-qr-card.is-square .tenant-qr-card__content{
  padding:
    calc(18px * var(--tenant-qr-content-scale,1))
    calc(18px * var(--tenant-qr-content-scale,1))
    calc(16px * var(--tenant-qr-content-scale,1))
}
.tenant-qr-card.is-vertical-tall .tenant-qr-card__layout{gap:calc(12px * var(--tenant-qr-content-scale,1))}
.tenant-qr-card.is-square .tenant-qr-card__layout{
  grid-template-rows:auto minmax(0,1fr);
  align-items:stretch;
  justify-items:stretch;
  gap:calc(10px * var(--tenant-qr-content-scale,1))
}
.tenant-qr-card.is-vertical-tall .tenant-qr-card__meta{gap:calc(8px * var(--tenant-qr-content-scale,1))}
.tenant-qr-card.is-square .tenant-qr-card__meta{gap:calc(8px * var(--tenant-qr-content-scale,1))}
.tenant-qr-card__meta{
  display:grid;justify-items:center;align-content:start;
  gap:calc(10px * var(--tenant-qr-content-scale,1));width:100%;min-width:0;text-align:center
}
.tenant-qr-card__eyebrow{
  display:inline-flex;align-items:center;justify-content:center;
  box-sizing:border-box;
  max-width:100%;
  min-width:0;
  padding:
    calc(8px * var(--tenant-qr-content-scale,1))
    calc(12px * var(--tenant-qr-content-scale,1));
  border-radius:999px;
  font-size:calc(11px * var(--tenant-qr-content-scale,1));
  font-weight:900;letter-spacing:.08em;text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  background:var(--tenant-qr-chip-bg,rgba(255,255,255,.52));color:var(--tenant-qr-chip-text,#7c2d12);
  backdrop-filter:blur(10px);
  cursor:text
}
.tenant-qr-card__eyebrow-text{
  display:block;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}
.tenant-qr-card__eyebrow-input{
  width:100%;
  min-width:0;
  border:none;
  outline:none;
  background:transparent;
  color:inherit;
  font:inherit;
  letter-spacing:inherit;
  text-transform:inherit;
  text-align:center;
  padding:0;
  margin:0
}
.tenant-qr-card__eyebrow.is-editing{
  width:min(100%, 100%);
  box-shadow:inset 0 0 0 1px rgba(249,115,22,.45)
}
.tenant-qr-card__eyebrow.is-editing .tenant-qr-card__eyebrow-text{
  display:none
}
.tenant-qr-card.is-square .tenant-qr-card__eyebrow{
  padding:
    calc(7px * var(--tenant-qr-content-scale,1))
    calc(11px * var(--tenant-qr-content-scale,1));
  font-size:calc(10px * var(--tenant-qr-content-scale,1));
  letter-spacing:.05em
}
.tenant-qr-card.is-horizontal .tenant-qr-card__eyebrow{
  padding:
    calc(6px * var(--tenant-qr-content-scale,1))
    calc(10px * var(--tenant-qr-content-scale,1));
  font-size:calc(9px * var(--tenant-qr-content-scale,1));
  letter-spacing:.03em
}
.tenant-qr-card__title{
  width:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:var(--tenant-qr-title-size,32px);line-height:1.04;font-weight:900
}
.tenant-qr-card__qr-shell{
  width:min(var(--tenant-qr-shell-size,160px),100%);max-width:100%;aspect-ratio:1/1;
  padding:calc(8px * var(--tenant-qr-content-scale,1));
  border-radius:var(--tenant-qr-shell-radius,22px);
  background:rgba(255,255,255,.96);
  box-shadow:0 20px 35px rgba(15,23,42,.18);display:flex;align-items:center;justify-content:center;overflow:hidden
}
.tenant-qr-card.is-vertical .tenant-qr-card__qr-shell{
  justify-self:center;
  align-self:end;
  padding:calc(8px * var(--tenant-qr-content-scale,1));
  border-radius:var(--tenant-qr-shell-radius,20px)
}
.tenant-qr-card.is-vertical-tall .tenant-qr-card__qr-shell{
  padding:calc(7px * var(--tenant-qr-content-scale,1));
  border-radius:var(--tenant-qr-shell-radius,18px)
}
.tenant-qr-card.is-square .tenant-qr-card__qr-shell{
  justify-self:center;
  align-self:end
}
.tenant-qr-card__qr{
  width:94%;height:94%;display:flex;align-items:center;justify-content:center;
  min-width:0;min-height:0;overflow:hidden
}
.tenant-qr-card__qr.is-loading::before{
  content:"";
  width:42%;
  height:42%;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(226,232,240,.9),rgba(203,213,225,.65));
  animation:tenantQrPreviewPulse 1s ease-in-out infinite;
}
.tenant-qr-card__qr.is-empty::before{
  content:"";
  width:44%;
  height:44%;
  border-radius:18px;
  border:2px dashed rgba(148,163,184,.55);
  background:linear-gradient(135deg,rgba(248,250,252,.95),rgba(226,232,240,.72));
}
.tenant-qr-card__qr > *{
  max-width:100%!important;
  max-height:100%!important;
  flex:0 0 auto
}
.tenant-qr-expanded-layer{
  position:fixed;
  left:0;
  top:0;
  width:0;
  height:0;
  z-index:1305;
  pointer-events:auto;
}
.tenant-qr-expanded-viewport{
  position:relative;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  border-radius:26px;
  background:linear-gradient(180deg,rgba(15,23,42,.58),rgba(15,23,42,.72));
  backdrop-filter:blur(10px);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
  pointer-events:auto;
}
.tenant-qr-expanded-shell{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  max-width:100%;
  max-height:100%;
  padding:14px;
  pointer-events:auto;
}
.tenant-qr-card-stage.is-expanded{
  position:absolute;
  left:50%;
  top:50%;
  margin:0;
  cursor:default;
  transform-origin:center center;
  transition:none!important;
  z-index:1;
}
.tenant-qr-card-stage.is-expanded .tenant-qr-card{
  box-shadow:0 30px 70px rgba(15,23,42,.22);
}
.tenant-qr-expanded-close{
  position:absolute;
  top:14px;
  right:14px;
  width:44px;
  height:44px;
  padding:0;
  border:none;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.96);
  color:var(--color-text);
  box-shadow:0 18px 32px rgba(15,23,42,.18);
  cursor:pointer;
  pointer-events:auto;
  transition:box-shadow .18s ease,background-color .18s ease;
  z-index:5;
}
.tenant-qr-expanded-close:hover{
  box-shadow:0 22px 36px rgba(15,23,42,.22);
}
.tenant-qr-expanded-close:focus-visible{
  outline:2px solid rgba(249,115,22,.42);
  outline-offset:2px;
}
.tenant-qr-expanded-close i{
  pointer-events:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0;
  line-height:1;
  font-size:14px;
}
.tenant-qr-card__qr canvas,.tenant-qr-card__qr svg{display:block!important;width:100%!important;height:100%!important}
@keyframes tenantQrPreviewPulse{
  0%,100%{opacity:.42;transform:scale(.92)}
  50%{opacity:.9;transform:scale(1)}
}
.tenant-qr-card__domain{
  width:100%;font-size:calc(13px * var(--tenant-qr-content-scale,1));line-height:1.4;font-weight:700;overflow-wrap:anywhere;
  color:var(--tenant-qr-card-muted,rgba(17,24,39,.7))
}
.tenant-qr-card.is-square .tenant-qr-card__domain{
  font-size:calc(11px * var(--tenant-qr-content-scale,1));
  line-height:1.24;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}
.tenant-qr-card.is-vertical-tall .tenant-qr-card__domain{
  font-size:calc(12px * var(--tenant-qr-content-scale,1));
  line-height:1.32
}
.tenant-qr-card.is-horizontal .tenant-qr-card__content{
  padding:
    calc(18px * var(--tenant-qr-content-scale,1))
    calc(20px * var(--tenant-qr-content-scale,1))
}
.tenant-qr-card.is-horizontal .tenant-qr-card__layout{
  grid-template-columns:minmax(120px,42%) minmax(0,1fr);
  gap:calc(18px * var(--tenant-qr-content-scale,1));
  justify-items:stretch
}
.tenant-qr-card.is-horizontal .tenant-qr-card__meta{
  order:2;
  justify-items:start;
  align-content:center;
  text-align:left
}
.tenant-qr-card.is-horizontal .tenant-qr-card__eyebrow{justify-self:start}
.tenant-qr-card.is-horizontal .tenant-qr-card__qr-shell{
  order:1;
  justify-self:start;
  align-self:center;
  padding:calc(8px * var(--tenant-qr-content-scale,1));
  border-radius:var(--tenant-qr-shell-radius,20px)
}
.tenant-qr-card.is-horizontal .tenant-qr-card__domain{text-align:left}
.tenant-qr-card.is-horizontal .tenant-qr-card__title{line-height:1}
@media (max-width:768px){
  .tenant-qr-expanded-layer.is-mobile{
    left:0!important;
    width:100%!important;
    background:transparent;
  }
  .tenant-qr-expanded-viewport{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:min(76dvh, calc(100% - 8px));
    min-height:min(420px, calc(100% - 8px));
    max-height:calc(100% - 8px);
    padding:56px 16px 20px;
    border-radius:22px 22px 0 0;
    background:var(--color-surface);
    border:1px solid var(--color-border);
    box-shadow:var(--shadow-sm);
    backdrop-filter:none;
  }
  .tenant-qr-expanded-viewport::before{
    content:"";
    position:absolute;
    left:50%;
    top:10px;
    width:44px;
    height:5px;
    border-radius:999px;
    transform:translateX(-50%);
    background:var(--color-border);
  }
  .tenant-qr-expanded-shell{
    width:100%;
    height:100%;
    padding:0;
  }
  .tenant-qr-expanded-close{
    top:12px;
    right:12px;
    background:var(--color-surface-2);
    box-shadow:none;
  }
}
.tenant-qr-linkbox{
  display:grid;gap:6px;padding:12px 14px;border-radius:14px;background:var(--color-surface-2);border:1px solid var(--color-border);min-width:0
}
.tenant-qr-linkbox__label{font-size:12px;font-weight:800;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.06em}
.tenant-qr-linkbox__row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
}
.tenant-qr-linkbox__url{
  font-size:13px;line-height:1.55;color:var(--color-primary);overflow-wrap:anywhere;word-break:break-word;
  text-decoration:none;min-width:0
}
.tenant-qr-linkbox__url:hover{text-decoration:underline}
.tenant-qr-linkbox__copy{
  width:36px;
  min-width:36px;
  height:36px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto
}
.tenant-qr-linkbox__copy i{margin:0}
.tenant-qr-linkbox--compact{
  gap:0;
  padding:10px 12px;
}
.tenant-qr-linkbox__compact-row{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  min-width:0;
}
.tenant-qr-linkbox__label--inline{
  white-space:nowrap;
}
.tenant-qr-linkbox__url--single-line{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  line-height:1.2;
}
.tenant-qr-logo-toggle-field{
  align-items:center;
  padding:12px 14px;
  border-radius:14px;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
}
.tenant-qr-logo-toggle-field .field-label{
  color:var(--color-text);
}
.tenant-qr-logo-toggle-field .switch{
  margin-left:auto;
}
.tenant-qr-stepper-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.tenant-qr-stepper-head .field-label{
  margin:0;
}
.tenant-qr-stepper-field{
  gap:8px;
}
.tenant-qr-stepper-field .discount-stepper{
  --qty-pill-h:36px;
  --qty-pill-side:32px;
  grid-template-columns:var(--qty-pill-side) 56px var(--qty-pill-side);
  min-width:auto;
  height:var(--qty-pill-h);
  border:none;
  background:transparent;
  box-shadow:none;
  justify-content:flex-end;
}
.tenant-qr-stepper-field .discount-stepper:focus-within{
  border-color:transparent;
  box-shadow:none;
}
.tenant-qr-stepper-field .discount-stepper-input{
  width:56px;
  min-width:56px;
  max-width:56px;
  padding:0 4px;
  font-size:13px;
}
.tenant-qr-stepper-field .discount-stepper-btn{
  width:30px;
  height:30px;
  min-width:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  touch-action:manipulation;
}
.tenant-qr-stepper-field .discount-stepper-btn span{
  display:block;
  width:100%;
  text-align:center;
  line-height:1;
  transform:translateY(-1px);
}
.tenant-qr-actions{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:8px;
  align-content:start;
}
.tenant-qr-actions>.btn{
  width:100%;
  min-width:0;
  min-height:40px;
  justify-content:center;
}
.tenant-qr-ratio-grid--inline{
  grid-template-columns:repeat(7,minmax(0,1fr));
}
@media (max-width: 640px){
  .domain-pwa-preview{grid-template-columns:1fr}
  .domain-pwa-qr-wrap{min-height:160px}
  .domain-pwa-qr-image{width:136px;height:136px}
  .domain-pwa-qr-image>img,.domain-pwa-qr-image>canvas{width:136px!important;height:136px!important}
  .tenant-qr-inline-grid{grid-template-columns:1fr}
  .tenant-qr-inline-grid--bg-controls{grid-template-columns:1fr}
  .tenant-qr-ratio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tenant-qr-toolbar{display:grid;grid-template-columns:1fr}
  .tenant-qr-preview-top{grid-template-columns:1fr}
  .tenant-qr-upload-row,
  .tenant-qr-actions{grid-template-columns:1fr}
  #settingsPwaQrPanel .settings-panel-scroll{padding-right:0}
  #settingsPwaQrPanel{gap:8px}
  #settingsPwaQrPanel > .tenant-qr-designer-preview-field{margin-bottom:0}
  .tenant-qr-card-stage{min-height:0;padding:6px;justify-content:center;overflow:visible}
  .tenant-qr-card{border-radius:var(--tenant-qr-card-radius,24px)}
  .tenant-qr-card__content{padding:18px 16px 16px}
  .tenant-qr-card__layout{gap:14px}
  .tenant-qr-card__qr-shell{width:min(76%,204px);padding:8px}
  .tenant-qr-card.is-vertical .tenant-qr-card__qr-shell{width:min(70%,182px)}
  .tenant-qr-card.is-vertical-tall .tenant-qr-card__qr-shell{width:min(66%,152px);padding:7px}
  .tenant-qr-card.is-horizontal .tenant-qr-card__content{padding:16px}
  .tenant-qr-card.is-horizontal .tenant-qr-card__layout{
    grid-template-columns:minmax(96px,38%) minmax(0,1fr);
    gap:14px
  }
  .tenant-qr-card.is-horizontal .tenant-qr-card__qr-shell{max-width:138px;padding:8px}
}

.empty-state{
  height:100%;
  min-height:260px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:10px;
}
.empty-icon{
  width:72px;height:72px;border-radius:999px;
  background:var(--color-surface-2);
  display:grid;place-items:center;
  color:var(--color-text-muted);
  font-size:22px;
}
.empty-title{font-weight:900;font-size:16px}
.empty-text{color:var(--color-text-muted);font-size:13px;max-width:300px}

.order-info-cards{display:grid;gap:12px}
:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) .order-info-cards > .info-card{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
}
body.page-cash #cashOrdersRightPane .order-info-cards > .info-card{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
}
#clientOrderInfoWrap .order-info-cards > .info-card{
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
}
.order-info-head .order-head-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.order-head-title-row{display:grid;gap:4px;align-items:start}
.order-head-title{font-weight:900;font-size:16px}
.order-head-meta{font-size:13px}
.order-refund-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--primary-25);
  background:var(--primary-12);
  color:var(--color-text);
  font-size:12px;
  font-weight:800;
  line-height:1;
}
.order-refund-badge.is-full{
  background:rgba(16,185,129,.12);
  border-color:rgba(16,185,129,.25);
}
:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) .order-info-head .order-head-top{justify-content:center}
:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) .order-head-title-row{justify-items:center;align-items:center;text-align:center}
.order-head-row{display:flex;align-items:center;gap:12px}
.order-head-field{flex:1}
.order-head-select{width:100%;height:36px;padding:0 10px;border-radius:8px;border:1px solid var(--color-border);background:var(--color-surface);font-size:14px;cursor:pointer}
.status-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;border:1px solid var(--color-border);background:var(--color-surface-2);font-size:12px}
.order-head-actions{display:flex;align-items:center;gap:8px}
.order-info-footer{
  display:block;
  padding:10px 12px;
}
.order-footer-actions{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  flex-wrap:nowrap;
}
.order-footer-status-pill{
  flex:1 1 auto;
  min-width:0;
  height:52px;
  padding:0 16px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:16px;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}
.order-footer-status-pill:hover{
  background:var(--primary-14);
  border-color:var(--primary-25);
  transform:translateY(-1px);
}
.order-footer-status-pill:disabled{
  opacity:.6;
  cursor:default;
  transform:none;
}
.order-footer-status-pill > span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.order-footer-mobile-icon{
  display:none;
}
@media (min-width:769px){
  .order-footer-status-pill .order-footer-mobile-icon{
    display:none !important;
  }
  .order-footer-status-pill > span{
    display:inline !important;
  }
}
.order-payment-pill{
  background:var(--color-primary);
  border-color:var(--color-primary);
  color:#fff;
}
.order-payment-pill:hover{
  background:var(--color-primary-hover);
  border-color:var(--color-primary-hover);
}
.order-payment-pill:disabled{
  opacity:1;
  cursor:default;
  transform:none;
  background:var(--primary-14);
  border-color:var(--primary-25);
  color:var(--color-primary);
}
.order-footer-icon-actions{
  flex:0 0 auto;
  gap:10px;
}
.order-footer-icon-btn{
  width:52px;
  height:52px;
  border-radius:999px;
  flex:0 0 52px;
}
.order-footer-icon-btn i{
  font-size:16px;
}
.order-footer-icon-btn:disabled{
  opacity:.6;
  cursor:default;
}

@media (max-width:768px){
  .order-footer-status-pill{
    padding:0;
  }
  .order-footer-status-pill > span{
    display:none;
  }
  .order-footer-status-pill .order-footer-mobile-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
    line-height:1;
  }
}
.client-row{display:flex;align-items:center;gap:12px}
.client-avatar{width:44px;height:44px;border-radius:999px;background:var(--primary-14);border:1px solid var(--primary-25);display:grid;place-items:center;font-weight:800}
.client-name{font-weight:700}
.client-phone{text-decoration:none;color:var(--color-text)}
.client-phone:hover{text-decoration:underline}
.pay-left{display:flex;align-items:center;gap:10px}
.pay-right{text-align:right}
.pay-delivery-row{display:flex;flex-direction:column;align-items:flex-end;gap:2px;margin-bottom:4px}
.pay-delivery{font-weight:600}
.pay-total{font-weight:900;font-size:18px}
.order-summary{display:flex;flex-direction:column;gap:6px}
.order-summary-title{font-weight:700;margin-bottom:2px}
.order-summary-row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.order-summary-label{color:var(--color-text-muted)}
.order-summary-value{text-align:right;display:flex;align-items:center;gap:6px;justify-content:flex-end}
.order-summary-pay-icon{color:var(--color-text-muted)}
.order-summary-divider{border-top:1px dashed var(--color-border);margin:6px 0 4px}
.order-summary-discount{color:var(--color-success, #22c55e)}
.order-summary-discount-label-wrap{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-width:0;
}
.order-summary-discount-info-btn{
  width:18px;
  height:18px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text-muted);
  display:inline-grid;
  place-items:center;
  padding:0;
  cursor:pointer;
  flex:0 0 auto;
}
.order-summary-discount-info-btn i{font-size:10px}
.order-summary-discount-info-btn:hover{
  border-color:var(--color-success, #22c55e);
  color:var(--color-success, #22c55e);
}
.order-summary-discount-info-btn:focus-visible{
  outline:2px solid var(--color-primary);
  outline-offset:1px;
}
.discount-help-info-btn{
  width:24px;
  height:24px;
  margin-top:0;
  align-self:center;
  flex:0 0 auto;
}
.discount-help-info-btn i{
  font-size:11px;
}
.discount-help-popover{
  position:fixed;
  z-index:1200;
  width:min(280px, calc(100vw - 24px));
  padding:10px 12px;
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface);
  box-shadow:0 18px 40px rgba(15,23,42,.16);
}
.discount-help-popover-text{
  font-size:13px;
  line-height:1.45;
  color:var(--color-text);
}
.order-summary-discount-breakdown{
  display:none;
  margin-top:2px;
  margin-bottom:2px;
  padding:8px 10px;
  border-radius:10px;
  border:1px dashed var(--color-border);
  background:var(--color-surface-2);
}
.order-summary-discount-breakdown.is-open{
  display:grid;
  gap:6px;
}
.order-summary-discount-breakdown-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:8px;
  font-size:13px;
}
.order-summary-discount-breakdown-label{color:var(--color-text-muted)}
.order-summary-discount-breakdown-value{
  color:var(--color-success, #22c55e);
  font-weight:600;
}
.order-summary-discount-breakdown-note{
  margin-top:2px;
  font-size:12px;
  line-height:1.3;
  color:var(--color-text-muted);
}
.order-summary-total-row{display:flex;justify-content:space-between;align-items:center;gap:8px;font-weight:700}
.order-summary-total-label{}
.order-summary-total-value{font-size:1.125rem;font-weight:800}
.order-summary-refund{font-weight:800}
.order-refund-history{
  display:grid;
  gap:10px;
  margin-top:14px;
  padding-top:14px;
  border-top:1px dashed var(--color-border);
}
.order-refund-history-title{
  font-size:13px;
  font-weight:900;
  color:var(--color-text);
}
.order-refund-history-list{
  display:grid;
  gap:10px;
}
.order-refund-history-item{
  display:grid;
  gap:8px;
  padding:12px;
  border-radius:16px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
}
.order-refund-history-item-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.order-refund-history-item-top strong{
  font-size:13px;
  font-weight:900;
}
.order-refund-history-item-top span,
.order-refund-history-item-meta,
.order-refund-history-item-note{
  font-size:12px;
  color:var(--color-text-muted);
}
.order-refund-history-item-lines{
  display:grid;
  gap:6px;
}
.order-refund-history-item-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:13px;
}
.order-refund-history-item-row strong{
  font-size:13px;
  font-weight:800;
}
.order-refund-history-item .order-item{
  margin:0;
  padding:0;
  border:none;
  background:transparent;
  box-shadow:none;
}
.order-refund-history-item .order-item-line{
  align-items:flex-start;
}
.order-refund-history-item .order-item-content{
  min-height:0;
}
.order-summary-thanks{margin-top:12px;text-align:center;font-size:13px;color:var(--color-text-muted)}
.order-client-cards{display:grid;gap:12px}
.order-client-list{
  display:grid;
  gap:8px;
}
.order-client-list-item{
  border:1px solid var(--color-border);
  border-radius:12px;
  background:var(--color-surface);
  padding:8px 10px;
  display:grid;
  gap:4px;
}
.order-client-list-item-title{
  font-weight:700;
  line-height:1.3;
}
.order-client-list-item-meta{
  color:var(--color-text-muted);
  font-size:13px;
  line-height:1.3;
}
.order-client-list-item-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.order-client-list-item-value{
  font-weight:700;
  white-space:nowrap;
}
.order-client-list-empty,
.order-client-list-loading{
  color:var(--color-text-muted);
  font-size:13px;
  padding:2px 0;
}
.order-client-history-card{
  cursor:pointer;
}
.order-client-history-card:hover{
  border-color:var(--primary-25);
}
:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) #clientEditNameBtn,
:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) #clientAddrToggleBtn,
:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) #clientAddrFormCard,
:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) #clientAddresses .shop-address-actions,
body.page-cash #clientEditNameBtn,
body.page-cash #clientAddrToggleBtn,
body.page-cash #clientAddrFormCard,
body.page-cash #clientAddresses .shop-address-actions{
  display:none !important;
}
@media (max-width:768px){
  .order-summary-discount-breakdown{padding:8px}
  .order-summary-discount-breakdown-row{font-size:12px}
}
.delivery-chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;border:1px solid var(--color-border);background:var(--color-surface-2);font-size:12px}
.chip-warn{background:var(--primary-14);border-color:var(--primary-25)}
.order-info-delivery{display:grid;gap:14px}
.delivery-kv{display:grid;gap:8px}
.delivery-kv-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:start;
  gap:12px;
}
.delivery-kv-label{color:var(--color-text-muted)}
.delivery-kv-value{text-align:right;font-weight:600}
.delivery-kv-link{color:var(--color-text);text-decoration:none}
.delivery-kv-link:hover{text-decoration:underline}
.delivery-kv-value-status{
  position:relative;
  display:flex;
  justify-content:flex-end;
  align-items:center;
}
.order-status-inline{
  position:relative;
  display:inline-flex;
  align-items:center;
}
.order-status-inline-trigger{
  border:none;
  background:transparent;
  color:var(--color-text);
  font:inherit;
  font-weight:600;
  padding:0;
  margin:0;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
}
.order-status-inline-trigger:hover{
  text-decoration:none;
  box-shadow:inset 0 -1px 0 currentColor;
}
.order-status-inline-trigger:focus-visible{
  outline:2px solid var(--primary-25);
  outline-offset:2px;
  border-radius:6px;
}
.order-status-inline-chevron{
  font-size:11px;
  color:var(--color-text-muted);
  transition:transform var(--dur-fast) var(--ease-smooth);
}
.order-status-inline.is-open .order-status-inline-chevron{
  transform:rotate(180deg);
}
.order-status-inline-dropdown{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  min-width:220px;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
  padding:4px 0;
  z-index:200;
  overflow:hidden;
}
.order-status-inline-dropdown.hidden{
  display:none;
}
.order-status-inline-option{
  width:100%;
  border:none;
  background:transparent;
  color:var(--color-text);
  text-align:left;
  font-size:14px;
  font-weight:500;
  padding:10px 14px;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth);
}
.order-status-inline-option:hover{
  background:var(--color-surface-2);
}
.order-status-inline-option.is-selected{
  color:var(--color-primary);
  font-weight:700;
  background:var(--primary-12);
}
.delivery-kv-value-urgent{color:var(--color-warning, #d97706);font-weight:700}
.delivery-address-block{display:grid;gap:6px}
.delivery-section-title{font-weight:700}
.delivery-address{font-weight:600;line-height:1.35}
.delivery-address-comment,.order-comment-block{line-height:1.35}
@media (max-width:560px){
  .delivery-kv-row{grid-template-columns:1fr;gap:2px}
  .delivery-kv-value{text-align:left}
  .delivery-kv-value-status{justify-content:flex-start}
  .order-status-inline-dropdown{
    left:0;
    right:auto;
  }
}
.order-items{display:grid;gap:12px}
.order-item{
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface);
  padding:10px;
}
.order-item-line{
  display:flex;
  gap:12px;
  align-items:stretch;
}
.order-item-photo-small{
  flex-shrink:0;
  width:88px;
  height:88px;
  border-radius:14px;
  overflow:hidden;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
}
.order-item-photo-small img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.order-item-photo-col{
  flex-shrink:0;
}
.order-item-content{
  flex:1;
  min-width:0;
  min-height:88px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.order-item-title{
  font-weight:800;
  font-size:17px;
  line-height:1.25;
}
.order-item-sublist{margin-top:4px;display:grid;gap:4px;font-size:12px;color:var(--color-text-muted)}
.order-item-options{
  margin-top:6px;
  padding-left:16px;
  display:grid;
  gap:4px;
  font-size:12px;
  color:var(--color-text-muted);
  border-left:2px solid var(--color-border);
}
.order-item-option{
  line-height:1.4;
}
.order-item-ingredients{
  margin-top:6px;
  padding-left:16px;
  display:grid;
  gap:4px;
  font-size:12px;
  color:var(--color-text-muted);
  border-left:2px solid var(--color-border);
}
.order-item-ingredient{
  line-height:1.4;
}
.order-item-composition{
  margin-top:0;
  padding-left:0;
  display:grid;
  gap:3px;
  font-size:13px;
  color:var(--color-text-muted);
  border-left:none;
}
.order-item-composition-item{
  line-height:1.4;
}
.order-item-composition-item-primary{
  font-weight:700;
  color:var(--color-text);
}
.order-item-composition-item-sub{
  margin-left:14px;
}
.order-item-footer{
  margin-top:auto;
  display:flex;
  justify-content:flex-end;
}
.order-item-price{
  display:inline-flex;
  align-items:baseline;
  gap:6px;
  white-space:nowrap;
}
.order-item-price-current{
  font-weight:800;
  font-size:17px;
  color:var(--color-text);
}
@media (max-width:560px){
  .order-item{padding:8px}
  .order-item-photo-small{
    width:72px;
    height:72px;
    border-radius:12px;
  }
  .order-item-content{
    min-height:72px;
    gap:4px;
  }
  .order-item-title{font-size:16px}
  .order-item-price-current{font-size:16px}
  .order-item-composition{font-size:12px}
}

/* Фото товаров в заказе */
.order-item-photos{
  display:grid;
  gap:8px;
}

.order-item-photo-main{
  position:relative;
  width:80px;
  height:80px;
  border-radius:12px;
  overflow:hidden;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
}

.order-item-photo-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.order-item-photo-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:24px;
  height:24px;
  border-radius:50%;
  background:rgba(0,0,0,0.6);
  color:white;
  border:none;
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:10px;
  opacity:0;
  transition:opacity 0.2s, background 0.2s;
  z-index:2;
}

.order-item-photo-main:hover .order-item-photo-nav{
  opacity:1;
}

.order-item-photo-nav:hover{
  background:rgba(0,0,0,0.8);
}

.order-item-photo-prev{
  left:4px;
}

.order-item-photo-next{
  right:4px;
}

.order-item-photo-thumbs-wrapper{
  display:flex;
  align-items:center;
  gap:4px;
}

.order-item-photo-thumbs{
  flex:1;
  display:flex;
  gap:4px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
}

.order-item-photo-thumbs::-webkit-scrollbar{
  height:4px;
}

.order-item-photo-thumbs::-webkit-scrollbar-track{
  background:transparent;
}

.order-item-photo-thumbs::-webkit-scrollbar-thumb{
  background:var(--color-border);
  border-radius:2px;
}

.order-item-photo-thumb{
  flex-shrink:0;
  width:32px;
  height:32px;
  border-radius:8px;
  border:2px solid var(--color-border);
  overflow:hidden;
  cursor:pointer;
  padding:0;
  background:var(--color-surface);
  transition:border-color 0.2s;
}

.order-item-photo-thumb:hover{
  border-color:var(--color-primary);
}

.order-item-photo-thumb.is-active{
  border-color:var(--color-primary);
  box-shadow:0 0 0 2px var(--primary-12);
}

.order-item-photo-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.order-item-thumbs-nav{
  flex-shrink:0;
  width:20px;
  height:20px;
  border-radius:50%;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
  color:var(--color-text);
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:10px;
  transition:background 0.2s, border-color 0.2s;
}

.order-item-thumbs-nav:hover{
  background:var(--color-primary);
  border-color:var(--color-primary);
  color:white;
}

.order-item-thumbs-nav:disabled{
  opacity:0.4;
  cursor:not-allowed;
}
/* ================= Products accordion helpers ================= */

/* Отступы между аккордеонами */
.products-accordion {
  display: flex;
  flex-direction: column;
  gap: 7px; /* 6-8px среднее значение */
}

.products-accordion .stage-item{min-height:52px}

/* Выделение цветом заголовков аккордеонов */
.products-accordion .acc-trigger {
  background: var(--primary-14);
  border-color: var(--primary-25);
}

.products-accordion .acc-trigger .stage-text b {
  color: var(--color-text);
  font-weight: 700;
}

.products-accordion .acc-trigger:hover {
  background: var(--primary-18);
}

/* Убрать подписи (small) из всех пунктов меню */
.products-accordion .stage-text small {
  display: none;
}

.acc-panel{
  max-height:0;
  overflow:hidden;
  transition:max-height var(--dur-med) var(--ease-smooth);
}

/* В редакторе блока комбо секция "Товары в блоке" всегда раскрыта,
   поэтому панель не должна схлопываться */
#comboInfo .acc-panel{
  max-height:none;
  overflow:visible;
}

/* Отступы между пунктами меню внутри аккордеона */
.acc-panel-inner{
  margin-top:10px;
  display: flex;
  flex-direction: column;
  gap: 5px; /* 4-6px среднее значение - отступ между stage-item */
}

.acc-header{
  display:flex;
  align-items:center;
  gap:8px;
}
.acc-header .acc-trigger{flex:1}

.acc-chevron{
  width:28px;height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  color:var(--color-text-muted);
  transition:transform var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth);
}
.acc-trigger:hover .acc-chevron{background:var(--color-surface-2)}
.acc-trigger.is-open .acc-chevron{transform:rotate(180deg)}
.acc-spacer{width:28px;height:28px}
.acc-add{border-style:dashed}

/* ================= BottomSheet ================= */

.sheet-backdrop{
  position:fixed;
  inset:0;
  background:var(--overlay-bg);
  opacity:0;
  pointer-events:none;
  transition:opacity var(--dur-med) var(--ease-smooth);
  z-index:82;
}
.sheet-backdrop.is-active{opacity:1;pointer-events:auto}

.sheet{
  position:fixed;
  left:0;right:0;bottom:0;
  height:calc(100dvh - var(--header-height));
  transform:translateY(110%);
  transition:transform var(--dur-med) var(--ease-smooth);

  background:var(--color-surface);
  border-top-left-radius:var(--radius-lg);
  border-top-right-radius:var(--radius-lg);
  border:1px solid var(--color-border);
  box-shadow:var(--shadow-sm);
  z-index:88;

  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.sheet.is-open{transform:translateY(0)}
.sheet-header{
  padding:12px;
  border-bottom:1px solid var(--color-border);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.sheet-title{font-weight:900}
.sheet-body{
  padding:12px;
  overflow-y:auto;
  flex:1;
  min-height:0;
}
.sheet-body::after{content:"";display:block;height:var(--column-scroll-pad)}

@media (min-width:769px){
  .sheet,.sheet-backdrop{display:none}
}

/* ================= Mobile placement ================= */

@media (max-width:768px){
  .app-grid{
    grid-template-columns:1fr;
  }

  body:not(.page-chat) .app-grid{
    height:auto;
    min-height:0;
    align-items:start;
  }

  .app-sidebar{grid-column:1;grid-row:1}
  .page-col-center{grid-column:1;grid-row:1}

  body:not(.page-chat) .page-col,
  body:not(.page-chat) .app-grid > .panel,
  body:not(.page-chat) .page-col > .panel,
  body:not(.page-chat) .center-stack,
  body:not(.page-chat) .center-stack > .panel,
  body:not(.page-chat) #ordersCenterPane > .center-stack,
  body:not(.page-chat) #ordersCheckoutCenterPane > .center-stack{
    height:auto;
    min-height:0;
  }

  body:not(.page-chat) .main-container .panel-body,
  body:not(.page-chat) .main-container .center-stack > .panel:last-child > .panel-body,
  body:not(.page-chat) #ordersCenterPane > .center-stack > .panel:last-child > .panel-body,
  body:not(.page-chat) #ordersCheckoutCenterPane > .center-stack > .panel:last-child > .panel-body{
    overflow:visible !important;
    min-height:0;
  }

  body:not(.page-chat) .main-container .panel-body::after{
    height:72px;
  }

  body.page-orders .main-container,
  body.page-courier-screen .main-container{
    min-height:calc(100dvh - var(--header-height));
    padding:0;
    background:transparent;
  }

  body.page-orders .page-col-center,
  body.page-courier-screen .page-col-center{
    min-height:calc(100dvh - var(--header-height));
    background:var(--color-surface);
    border-radius:22px 22px 0 0;
    overflow:visible;
  }

  body.page-orders .page-col-center{
    padding-bottom:var(--admin-mobile-shell-reserve);
    width:100%;
    max-width:100%;
    align-items:stretch;
  }

  body.page-courier-screen .page-col-center{
    padding-bottom:var(--admin-mobile-shell-courier-reserve);
  }

  body.page-orders #ordersCenterPane > .center-stack,
  body.page-courier-screen #ordersCenterPane > .center-stack{
    gap:0;
  }

  body.page-orders #ordersCenterPane,
  body.page-orders #ordersCenterPane > .center-stack,
  body.page-orders #ordersCenterPane > .center-stack > .panel{
    width:100%;
    max-width:100%;
    min-width:0;
    align-self:stretch;
  }

  body.page-orders #ordersCenterPane > .center-stack > .orders-center-panel,
  body.page-courier-screen #ordersCenterPane > .center-stack > .orders-center-panel{
    border:none;
    border-radius:0;
    box-shadow:none;
    background:transparent;
    overflow:visible;
  }

  body.page-orders #ordersCenterPane,
  body.page-orders #ordersCenterPane > .center-stack,
  body.page-orders #ordersCenterPane > .center-stack > .orders-center-panel > .panel-body,
  body.page-courier-screen #ordersCenterPane,
  body.page-courier-screen #ordersCenterPane > .center-stack,
  body.page-courier-screen #ordersCenterPane > .center-stack > .orders-center-panel > .panel-body{
    background:transparent;
  }

  body.page-orders #ordersCenterPane > .center-stack > .orders-center-panel > .panel-body::after{
    height:var(--admin-mobile-shell-reserve);
  }

  body.page-courier-screen #ordersCenterPane > .center-stack > .orders-center-panel > .panel-body::after{
    height:var(--admin-mobile-shell-courier-reserve);
  }

  body.page-orders #ordersRightPane .orders-info > .order-info-footer{
    padding-bottom:calc(10px + var(--admin-mobile-shell-reserve));
  }

  body.page-courier-screen #ordersRightPane .orders-info > .order-info-footer{
    padding-bottom:calc(10px + var(--admin-mobile-shell-courier-reserve));
  }

  body.page-chat.chat-mobile-right-open.chat-right-order-mode #ordersRightPane .orders-info > .order-info-footer{
    padding-bottom:calc(10px + var(--admin-mobile-shell-reserve));
  }

  body.page-orders #ordersNotifyBtn,
  body.page-orders #ordersAddBtn{
    display:none;
  }

  body.page-orders .orders-list,
  body.page-courier-screen .orders-list{
    overflow-x:clip;
  }

  body.page-orders .orders-list .order-row.js-order{
    grid-template-columns:70px minmax(0,1fr);
    grid-template-areas:
      "id client"
      "id address"
      "controls controls";
    gap:8px 10px;
    align-items:start;
  }

  body.page-courier-screen .orders-list .order-row.js-order{
    grid-template-columns:70px minmax(0,1fr);
    grid-template-areas:
      "id client"
      "id address"
      "controls controls";
    gap:8px 10px;
    align-items:start;
  }

  body.page-orders .orders-list .order-col.order-indicators{
    display:none;
  }

  body.page-courier-screen .orders-list .order-col.order-indicators{
    grid-area:indicators;
    display:flex;
    justify-content:flex-end;
    align-items:flex-start;
    min-width:0;
  }

  body.page-orders .orders-list .order-col.order-client,
  body.page-orders .orders-list .order-col.order-address,
  body.page-orders .orders-list .order-col.order-orders-mobile-controls,
  body.page-courier-screen .orders-list .order-col.order-client,
  body.page-courier-screen .orders-list .order-col.order-address,
  body.page-courier-screen .orders-list .order-col.order-courier-controls{
    min-width:0;
    width:100%;
  }

  body.page-orders .orders-list .order-col.order-orders-mobile-controls{
    grid-area:controls;
    min-width:0;
    display:grid;
    gap:8px;
    align-content:start;
  }

  body.page-orders .orders-list .order-orders-mobile-status-row{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    grid-template-areas:"stage total";
    gap:8px;
    align-items:stretch;
  }

  body.page-orders .orders-list .order-orders-mobile-status-row .order-stage,
  body.page-orders .orders-list .order-orders-mobile-status-row .order-total{
    width:100%;
    min-width:0;
    align-self:stretch;
  }

  body.page-orders .orders-list .order-orders-mobile-status-row .order-stage{
    justify-content:flex-start;
  }

  body.page-orders .orders-list .order-orders-mobile-status-row .order-total{
    justify-content:flex-end;
  }

  body.page-orders .orders-list .order-orders-mobile-status-row .order-stage-btn,
  body.page-orders .orders-list .order-orders-mobile-status-row .order-payment-btn{
    width:100%;
    min-width:0;
  }

  body.page-courier-screen .orders-list .order-col.order-courier-controls{
    grid-area:controls;
  }

  body.page-orders .orders-list .order-client-phone,
  body.page-courier-screen .orders-list .order-client-phone{
    grid-template-columns:16px minmax(0,1fr);
  }

  body.page-orders .orders-list .order-client-name-text,
  body.page-orders .orders-list .order-client-phone-text,
  body.page-orders .orders-list .order-client-telegram-text,
  body.page-orders .orders-list .order-address-line,
  body.page-orders .orders-list .order-address-comment,
  body.page-courier-screen .orders-list .order-client-name-text,
  body.page-courier-screen .orders-list .order-client-phone-text,
  body.page-courier-screen .orders-list .order-client-telegram-text,
  body.page-courier-screen .orders-list .order-address-line,
  body.page-courier-screen .orders-list .order-address-comment{
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    overflow-wrap:anywhere;
  }

  body.page-orders .orders-list .order-stage-btn,
  body.page-orders .orders-list .order-payment-btn,
  body.page-courier-screen .orders-list .order-stage-btn,
  body.page-courier-screen .orders-list .order-payment-btn,
  body.page-courier-screen .orders-list .order-courier-action-btn{
    width:100%;
    min-width:0;
  }

  body.page-orders .orders-list .order-payment-btn-content,
  body.page-courier-screen .orders-list .order-payment-btn-content{
    min-width:0;
  }

  body.page-orders .orders-list .order-payment-btn-total,
  body.page-orders .orders-list .order-payment-btn-status,
  body.page-courier-screen .orders-list .order-payment-btn-total,
  body.page-courier-screen .orders-list .order-payment-btn-status{
    white-space:normal;
  }

  body.page-courier-screen .sheet{
    height:calc(100dvh - var(--header-height));
    max-height:calc(100dvh - var(--header-height));
  }

  body.page-orders .sheet .order-info-footer,
  body.page-courier-screen .sheet .order-info-footer{
    padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  }

  body.page-orders .sheet .order-info-footer--payment-only,
  body.page-courier-screen .sheet .order-info-footer--payment-only{
    padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  }

  body.page-orders .sheet .order-footer-actions{
    flex-wrap:nowrap;
    gap:8px;
  }

  body.page-courier-screen .sheet .order-footer-actions{
    flex-wrap:wrap;
    gap:8px;
  }

  body.page-orders .sheet .order-footer-actions--payment-only,
  body.page-courier-screen .sheet .order-footer-actions--payment-only{
    flex-wrap:nowrap;
  }

  body.page-orders .sheet .order-footer-status-pill{
    flex:1 1 0;
    min-width:0;
    height:48px;
    padding:0;
    font-size:14px;
  }

  body.page-courier-screen .sheet .order-footer-status-pill{
    flex:1 1 calc(50% - 4px);
    min-width:0;
    height:48px;
    padding:0 12px;
    font-size:14px;
  }

  body.page-orders .sheet .order-footer-actions--payment-only .order-footer-status-pill,
  body.page-courier-screen .sheet .order-footer-actions--payment-only .order-footer-status-pill{
    flex:1 1 100%;
  }

  body.page-orders .sheet .order-footer-icon-actions{
    width:auto;
    justify-content:flex-start;
    flex:0 0 auto;
  }

  body.page-courier-screen .sheet .order-footer-icon-actions{
    width:100%;
    justify-content:flex-end;
  }

  body.page-orders .sheet .order-footer-icon-btn,
  body.page-courier-screen .sheet .order-footer-icon-btn{
    width:48px;
    height:48px;
    flex:0 0 48px;
  }
}

/* ================= Universal Modal ================= */

.modal-backdrop{
  position:fixed;
  inset:0;
  background:var(--overlay-bg);
  opacity:0;
  pointer-events:none;
  transition:opacity var(--dur-med) var(--ease-smooth);
  z-index:82;
}
.modal-backdrop.is-active{opacity:1;pointer-events:auto}

/* ================= New Order ================= */
.new-order-products-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.new-order-checkout-editor{
  min-height:100%;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  gap:12px;
}

.new-order-checkout-block-chips{
  display:flex;
  align-items:center;
  gap:8px;
  flex:1 1 auto;
  min-width:0;
  max-width:none;
  overflow-x:auto;
  overflow-y:hidden;
  padding:0;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.new-order-checkout-block-chips::-webkit-scrollbar{
  display:none;
}

.new-order-toolbar.is-checkout-screen .new-order-checkout-block-chips{
  padding-right:4px;
}

.new-order-checkout-block-chip{
  height:30px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:13px;
  font-weight:700;
  line-height:1;
  padding:0 12px;
  white-space:nowrap;
  cursor:pointer;
}

.new-order-checkout-block-chip:hover{
  border-color:var(--color-primary);
  color:var(--color-primary);
}

.new-order-right-content{
  display:block;
  min-height:0;
}

.new-order-right-order-stub{
  border:1px dashed var(--color-border);
  border-radius:12px;
  padding:12px;
  color:var(--color-text-muted);
  font-size:14px;
  font-weight:600;
}

.new-order-right-form{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  gap:12px;
  padding:8px;
  min-height:auto;
}

.new-order-right-form-row{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.new-order-right-form-row.is-three-cols{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.new-order-right-form-row.is-payment-three-cols{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.new-order-right-address-body.is-map-mode .new-order-right-form-row.is-address-map-details{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.new-order-right-form-field{
  min-width:0;
  display:grid;
  gap:6px;
}

.new-order-right-form-field.is-comment{
  grid-column:1 / -1;
}

.new-order-right-form-label{
  font-size:13px;
  font-weight:700;
  color:var(--color-text);
}

.new-order-right-form .new-order-right-form-label{
  display:none;
}

.new-order-right-form .control{
  height:42px;
  border-radius:20px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  padding:0 14px;
}

.new-order-right-phone{
  font-weight:800;
  letter-spacing:.04em;
}

.new-order-right-comment{
  display:block;
  width:100%;
  min-height:40px;
  height:40px;
  max-height:150px;
  resize:none;
  overflow-y:hidden;
  overflow-x:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
  line-height:1.25;
  padding:10px 14px !important;
  white-space:nowrap;
  text-overflow:ellipsis;
  border-radius:999px !important;
}

.new-order-right-comment::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}

.new-order-right-comment.is-expanded{
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  word-break:break-word;
  overflow-y:auto;
  text-overflow:clip;
  border-radius:16px !important;
}

.new-order-right-address-wrap{
  position:relative;
  display:block;
}

.new-order-right-address-wrap .control{
  width:100%;
  padding-right:44px;
}

.new-order-right-address-edit{
  position:absolute;
  top:50%;
  right:10px;
  transform:translateY(-50%);
  width:28px;
  height:28px;
  border:none;
  border-radius:999px;
  background:transparent;
  color:var(--color-text-muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.new-order-right-address-edit:hover{
  color:var(--color-primary);
}

.new-order-right-select-wrap{
  position:relative;
}

.new-order-right-select-trigger{
  width:100%;
  height:42px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:16px;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 14px;
  cursor:pointer;
}

.new-order-right-select-trigger i{
  font-size:10px;
  color:var(--color-text-muted);
  transition:transform .18s ease;
}

.new-order-right-select-wrap.is-open .new-order-right-select-trigger i{
  transform:rotate(180deg);
}

.new-order-right-select-menu{
  position:absolute;
  left:50%;
  top:calc(100% + 8px);
  transform:translateX(-50%);
  z-index:15;
  width:min(220px, 100%);
  max-height:230px;
  overflow-y:auto;
  overflow-x:hidden;
  background:var(--color-surface);
  border:1px solid rgba(15,23,42,.08);
  border-radius:26px;
  box-shadow:0 12px 30px rgba(15,23,42,.24);
  padding:12px;
  display:grid;
  gap:4px;
}

.new-order-right-select-wrap.is-drop-up .new-order-right-select-menu{
  top:auto;
  bottom:calc(100% + 8px);
}

.new-order-right-select-option{
  height:42px;
  border:none;
  border-radius:999px;
  background:transparent;
  color:var(--color-text);
  font-size:16px;
  font-weight:800;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.new-order-right-select-option:hover,
.new-order-right-select-option.is-selected{
  background:var(--color-surface-2);
}

.new-order-right-change-input{
  margin-top:0;
}

.new-order-right-time-hint{
  height:84px;
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface-2);
  display:grid;
  grid-template-rows:1fr 1fr;
  overflow:hidden;
}

.new-order-right-time-hint.is-single{
  height:42px;
  grid-template-rows:1fr;
  border-radius:999px;
}

.new-order-right-time-hint span{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  font-weight:800;
  color:var(--color-text);
}

.new-order-right-time-hint span + span{
  border-top:1px solid var(--color-border);
}

.new-order-right-divider{
  height:1px;
  background:var(--color-border);
  margin:2px 0 4px;
}

.new-order-right-cart{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-height:auto;
}

.new-order-right-cart-list{
  display:grid;
  gap:8px;
  padding-left:18px;
  padding-bottom:8px;
}

#ordersCheckoutLeftPane,
#ordersCheckoutCenterPane,
#ordersCheckoutRightPane{
  height:100%;
  min-height:0;
}

#ordersCheckoutRightPane{
  display:flex;
  flex-direction:column;
}

:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode).orders-checkout-mode #ordersCheckoutRightPane{
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}

:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode).orders-checkout-mode #ordersCheckoutRightPane > .panel-header{
  flex:0 0 auto;
}

:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode).orders-checkout-mode #ordersCheckoutRightPane > #newOrderRightPanel{
  border:none;
  border-radius:0;
  box-shadow:none;
  background:transparent;
  overflow:hidden;
}

#ordersLeftPane,
#ordersCenterPane,
#ordersRightPane{
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
}

#cashOrdersRightPane{
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
}

#ordersLeftPane > .panel,
#ordersRightPane > .panel,
#ordersCheckoutLeftPane > .panel,
#ordersCheckoutRightPane > .panel{
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
}

#cashOrdersRightPane > .panel{
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
}

:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) #ordersCheckoutRightPane > .panel{
  height:auto;
}

#ordersCenterPane > .center-stack,
#ordersCheckoutCenterPane > .center-stack{
  height:100%;
  min-height:0;
  flex:1 1 auto;
}

:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) #ordersRightPane .orders-info > .panel-header{
  flex:0 0 auto;
}

body.page-cash #cashOrdersRightPane .orders-info > .panel-header{
  flex:0 0 auto;
}

:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) #ordersCheckoutRightPane #orderTabsHeaderCheckout{
  flex:0 0 auto;
}

:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) #ordersCheckoutRightPane #newOrderTabsHeader{
  display:none !important;
}

:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) #ordersRightPane .orders-info > .panel-body{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
}

body.page-cash #cashOrdersRightPane .orders-info > .panel-body{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
}

:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode) #ordersRightPane .orders-info > .order-info-footer{
  margin-top:auto;
  flex:0 0 auto;
}

body.page-cash #cashOrdersRightPane .orders-info > .order-info-footer,
body.page-cash #cashOrdersRightPane .orders-info > #cashPaymentFooter{
  margin-top:auto;
  flex:0 0 auto;
}

body.page-cash #cashOrdersRightPane .orders-info > #cashPaymentFooter{
  padding:0 12px 12px;
}

.page-new-order .page-col-right .panel-body,
:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode).orders-checkout-mode #ordersCheckoutRightPane .panel-body{
  display:flex;
  flex-direction:column;
  min-height:0;
}

.page-new-order .page-col-right .panel-body::after,
:is(body.page-orders, body.page-courier-screen, body.page-chat.chat-right-order-mode).orders-checkout-mode #ordersCheckoutRightPane .panel-body::after{
  content:none;
  display:none;
}

.panel-footer.new-order-right-footer{
  display:flex;
  flex-direction:column;
  gap:0;
  padding:8px 10px 10px;
  align-items:stretch;
  justify-content:flex-start;
}

.panel-footer.new-order-right-footer .shop-cart-delivery-progress{
  order:1;
  margin:0;
  padding:0 8px 6px;
  flex-shrink:0;
}

.panel-footer.new-order-right-footer .shop-cart-footer{
  order:2;
  margin-top:0;
  padding:8px 8px 0;
  border-top:1px solid var(--color-border);
  background:transparent;
  display:block;
  justify-content:initial;
}

.panel-footer.new-order-right-footer .shop-cart-footer-actions{
  width:100%;
  margin:0;
  align-items:flex-end;
}

.panel-footer.new-order-right-footer .shop-cart-footer-actions .shop-checkout-btn{
  min-width:0;
  flex:1 1 0;
  white-space:normal;
  text-align:center;
  line-height:1.15;
  padding-inline:16px;
}

.panel-footer.new-order-right-footer .new-order-right-footer-benefits-btn{
  width:52px;
  height:52px;
  padding:0;
  border-radius:50%;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--shop-buy);
  display:grid;
  place-items:center;
  flex:0 0 auto;
  cursor:pointer;
  transition:all var(--dur-fast) var(--ease-smooth);
}

.panel-footer.new-order-right-footer .new-order-right-footer-benefits-btn:hover{
  background:var(--primary-14);
  border-color:var(--shop-buy);
}

.panel-footer.new-order-right-footer .new-order-right-footer-benefits-btn i{
  font-size:20px;
  line-height:1;
}

.panel-footer.new-order-right-footer .shop-cart-footer-actions .shop-checkout-btn--payment{
  flex:1.2 1 0;
}

.panel-footer.new-order-right-footer .shop-cart-footer-actions .shop-checkout-btn--secondary{
  background:var(--color-surface);
  color:var(--color-text);
  border-color:var(--color-border);
}

.panel-footer.new-order-right-footer .shop-cart-footer-actions .shop-checkout-btn--secondary:hover{
  background:var(--color-surface-2);
  border-color:var(--color-border);
}

.panel-footer.new-order-right-footer .new-order-right-footer-status-wrap{
  flex:0 0 148px;
  min-width:148px;
}

.panel-footer.new-order-right-footer .new-order-right-footer-status-trigger{
  height:52px;
  justify-content:center;
}

.panel-footer.new-order-right-footer .new-order-right-footer-status-wrap .new-order-right-select-menu{
  width:min(220px, calc(100vw - 40px));
  z-index:32;
}

.new-order-right-cart-item-wrap{
  position:relative;
}

.new-order-right-cart-item-tools{
  position:absolute;
  left:-22px;
  top:10px;
  display:flex;
  flex-direction:column;
  gap:6px;
  z-index:2;
}

.new-order-right-cart-item-delete,
.new-order-right-cart-item-copy,
.new-order-right-cart-item-split{
  border:0;
  background:transparent;
  color:var(--color-text-muted);
  padding:0;
  width:18px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.new-order-right-cart-item-delete i,
.new-order-right-cart-item-copy i,
.new-order-right-cart-item-split i{
  font-size:15px;
}

.new-order-right-cart-item-delete{
  color:var(--color-text-muted);
}

.new-order-right-cart-item-delete:hover{
  color:#b91c1c;
}

.new-order-right-cart-item-copy{
  color:var(--color-text-muted);
}

.new-order-right-cart-item-copy:hover{
  color:#1d4ed8;
}

.new-order-right-cart-item-split{
  color:var(--color-text-muted);
}

.new-order-right-cart-item-split:hover{
  color:#6d28d9;
}

.new-order-right-cart-empty{
  border:1px dashed var(--color-border);
  border-radius:12px;
  padding:12px;
  font-size:13px;
  color:var(--color-text-muted);
}

.new-order-right-cart-item{
  border:1px solid var(--color-border);
  border-radius:12px;
  padding:10px 12px;
  display:grid;
  grid-template-columns:74px 1fr auto;
  gap:8px 12px;
  align-items:start;
  background:var(--color-surface);
  transition:transform var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}

.new-order-right-cart-left{
  display:grid;
  gap:4px;
  justify-items:center;
  align-content:start;
  margin-left:-8px;
  margin-top:-2px;
}

.new-order-right-cart-thumb{
  width:64px;
  height:64px;
  border-radius:10px;
  overflow:hidden;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  display:grid;
  place-items:center;
}

.new-order-right-cart-qty{
  --qty-pill-h: 24px;
  --qty-pill-side: 24px;
  height: var(--qty-pill-h);
  border-radius: 999px;
  background: var(--color-surface-2);
  color: var(--color-text);
  border: 1px solid var(--color-border);
  display: inline-flex;
  align-items: center;
  width: max-content;
  overflow: hidden;
  user-select: none;
}

.new-order-right-cart-qty,
.new-order-right-cart-qty *{
  border: 0;
  outline: none;
  box-shadow: none;
}

.new-order-right-cart-qty::before,
.new-order-right-cart-qty::after{
  content:none !important;
}

.new-order-right-cart-qty .qty-pill__btn{
  width: var(--qty-pill-side);
  height: 100%;
  background: transparent;
  color: inherit;
  font-weight: 900;
  font-size: 15px;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
}

.new-order-right-cart-qty .qty-pill__btn:hover{
  background: var(--shop-hover-dark);
  color: var(--color-text);
}

.new-order-right-cart-qty .qty-pill__btn.is-disabled{
  opacity:.35;
  pointer-events:none;
}

.new-order-right-cart-qty .qty-pill__center{
  min-width: 16px;
  width: 16px;
  padding: 0;
  text-align: center;
  font-weight: 700;
  font-size: 12px;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.new-order-right-cart-thumb-placeholder{
  color:var(--color-text-muted);
  font-size:14px;
}

.new-order-right-cart-thumb-single{
  width:100%;
  height:100%;
  object-fit:cover;
}

.new-order-right-cart-thumb-grid{
  width:100%;
  height:100%;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:1px;
  background:var(--color-border);
}

.new-order-right-cart-thumb-grid img{
  width:100%;
  height:100%;
  object-fit:cover;
  background:var(--color-surface-2);
}

.new-order-right-cart-thumb-cell-empty{
  display:block;
  width:100%;
  height:100%;
  background:var(--color-surface-2);
}

.new-order-right-cart-item-title{
  font-size:15px;
  font-weight:800;
  color:var(--color-text);
  line-height:1.2;
}

.new-order-right-cart-item-meta{
  font-size:13px;
  color:var(--color-text-muted);
}

.new-order-right-cart-item-sub{
  margin-top:2px;
  font-size:12px;
  color:var(--color-text-muted);
  line-height:1.35;
}

.new-order-right-cart-composition-row{
  display:grid;
  gap:4px;
}

.new-order-right-cart-combo-section{
  display:grid;
  gap:4px;
}

.new-order-right-cart-combo-section.is-separated{
  margin-top:6px;
  padding-top:6px;
  border-top:1px dashed var(--color-border);
}

.new-order-right-cart-combo-title{
  font-size:13px;
  font-weight:700;
  color:var(--color-text);
}

.new-order-right-cart-ingredients{
  display:grid;
  gap:4px;
}

.new-order-right-cart-ing-row{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
}

.new-order-right-cart-ing-name{
  min-width:0;
  flex:1 1 auto;
  font-size:12px;
  color:var(--color-text-muted);
  line-height:1.2;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  line-clamp:2;
  overflow:hidden;
  text-overflow:ellipsis;
  max-height:calc(1.2em * 2);
}

.new-order-right-cart-ing-controls{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;
}

.new-order-right-cart-ing-btn{
  width:22px;
  height:22px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text-muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:13px;
  line-height:1;
}

.new-order-right-cart-ing-btn.is-disabled{
  opacity:.45;
  cursor:default;
}

.new-order-right-cart-ing-qty{
  font-size:12px;
  font-weight:700;
  color:var(--color-text);
}

.new-order-right-cart-variant-scroll{
  width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.new-order-right-cart-variant-scroll::-webkit-scrollbar{
  display:none;
}

.new-order-right-cart-variant-row{
  display:flex;
  gap:6px;
  width:max-content;
  min-width:100%;
}

.new-order-right-cart-variant-chip{
  height:28px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  font-size:12px;
  font-weight:700;
  padding:0 10px;
  white-space:nowrap;
  cursor:pointer;
}

.new-order-right-cart-variant-chip.is-selected{
  border-color:var(--color-primary);
  background:var(--color-primary);
  color:#fff;
}

.new-order-right-cart-variant-remove{
  width:28px;
  min-width:28px;
  padding:0;
  font-size:16px;
  line-height:1;
  color:#ef4444;
}

.new-order-right-cart-variant-remove:hover{
  border-color:#ef4444;
  background:rgba(239,68,68,.08);
}

.new-order-right-cart-variant-option-icon{
  width:28px;
  min-width:28px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  color:var(--color-text-muted);
}

.new-order-right-cart-variant-option-icon i{
  font-size:12px;
  line-height:1;
}

.new-order-right-cart-variant-option-icon:hover{
  border-color:var(--color-primary);
  color:var(--color-primary);
  background:rgba(255,122,26,.08);
}

.new-order-right-cart-option-title{
  font-size:12px;
  color:var(--color-text-muted);
  line-height:1.2;
}

.new-order-right-cart-option-controls-row{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
}

.new-order-right-cart-option-controls-row .new-order-right-cart-variant-scroll{
  flex:1 1 auto;
  min-width:0;
}

.new-order-right-cart-item-sum{
  font-size:16px;
  font-weight:800;
  color:var(--color-text);
  white-space:nowrap;
}

.new-order-right-cart-item-sum-wrap{
  display:grid;
  justify-items:end;
  align-content:start;
  gap:2px;
}

.new-order-right-cart-item-sum-old{
  font-size:12px;
  line-height:1.1;
  color:var(--color-text-muted);
  text-decoration:line-through;
  white-space:nowrap;
}

.new-order-right-cart-item-discount{
  font-size:11px;
  line-height:1.1;
  font-weight:700;
  color:var(--color-primary);
  background:rgba(255,122,26,.12);
  border:1px solid rgba(255,122,26,.28);
  border-radius:999px;
  padding:1px 6px;
  white-space:nowrap;
}

.new-order-right-cart-total{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 2px 0;
  border-top:1px solid var(--color-border);
  font-size:15px;
  font-weight:700;
}

.new-order-right-select-trigger.is-static{
  cursor:default;
  opacity:1;
}

.new-order-right-calendar{
  position:absolute;
  left:50%;
  top:calc(100% + 8px);
  transform:translateX(-50%);
  z-index:20;
  width:min(320px, 96vw);
  background:var(--color-surface);
  border:1px solid rgba(15,23,42,.08);
  border-radius:22px;
  box-shadow:0 12px 30px rgba(15,23,42,.22);
  padding:12px;
  display:grid;
  gap:8px;
}

.new-order-right-calendar-head{
  display:grid;
  grid-template-columns:32px 1fr 32px;
  align-items:center;
  gap:6px;
}

.new-order-right-calendar-title{
  text-align:center;
  font-size:22px;
  font-weight:800;
  color:var(--color-text);
  text-transform:capitalize;
}

.new-order-right-calendar-nav{
  width:32px;
  height:32px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.new-order-right-calendar-weekdays{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:4px;
}

.new-order-right-calendar-weekdays span{
  text-align:center;
  font-size:12px;
  font-weight:700;
  color:var(--color-text-muted);
}

.new-order-right-calendar-grid{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:4px;
}

.new-order-right-calendar-cell{
  width:36px;
  height:36px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:14px;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0 auto;
  cursor:pointer;
}

.new-order-right-calendar-cell.is-empty{
  border:none;
  background:transparent;
  pointer-events:none;
}

.new-order-right-calendar-cell.is-selected{
  background:var(--color-primary);
  border-color:var(--color-primary);
  color:var(--on-primary);
}

.new-order-right-calendar-cell:disabled{
  opacity:.4;
  cursor:not-allowed;
}

@media (max-width: 1200px){
  .new-order-right-form-row{
    grid-template-columns:1fr;
  }
  .new-order-right-form-row.is-three-cols{
    grid-template-columns:1fr;
  }
  .new-order-right-form-row.is-payment-three-cols{
    grid-template-columns:1fr;
  }
  .new-order-right-address-body.is-map-mode .new-order-right-form-row.is-address-map-details{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

.new-order-checkout-editor.is-empty{
  align-items:center;
  justify-content:center;
}

.new-order-checkout-content{
  display:grid;
  gap:12px;
}

.new-order-checkout-category-block{
  position:relative;
  border:1px solid var(--color-border);
  border-radius:12px;
  background:var(--color-surface);
  padding:8px;
  overflow:visible;
  transition:transform var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}

.new-order-checkout-constructor-block{
  position:relative;
  display:grid;
  gap:10px;
}

.new-order-checkout-block-title{
  position:absolute;
  top:-16px;
  left:50%;
  transform:translateX(-50%);
  padding:0 10px;
  background:var(--color-surface);
  font-size:16px;
  font-weight:800;
  color:var(--color-text);
  line-height:1.1;
  white-space:nowrap;
  max-width:60%;
  overflow:hidden;
  text-overflow:ellipsis;
  text-align:center;
  z-index:2;
}

.new-order-checkout-block-actions{
  position:absolute;
  top:-16px;
  right:8px;
  display:flex;
  align-items:center;
  gap:6px;
  background:var(--color-surface);
  padding:0 2px;
}

.new-order-checkout-block-action-btn{
  width:26px;
  height:26px;
  border-radius:8px;
  border:none;
  background:transparent;
  color:var(--color-text-muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.new-order-checkout-block-drag-handle{
  cursor:grab;
}

.new-order-checkout-block-drag-handle:active{
  cursor:grabbing;
}

.new-order-checkout-constructor-block.is-dragging{
  opacity:.65;
}

.new-order-checkout-block-action-btn:hover{
  background:var(--color-surface-2);
  color:var(--color-primary);
}

.new-order-checkout-block-action-btn.is-danger:hover{
  background:rgba(239,68,68,.08);
  color:#ef4444;
}

.new-order-checkout-category-section{
  position:relative;
  display:grid;
  gap:8px;
  border-top:1px solid var(--color-border);
  padding-top:14px;
  border-radius:10px;
}

.new-order-checkout-constructor-block .new-order-checkout-category-section:first-of-type{
  border-top:none;
  padding-top:8px;
}

.new-order-checkout-category-section:not(:last-child){
  padding-bottom:8px;
  border-bottom:none;
}

.new-order-checkout-add-to-cart-btn{
  height:36px;
  border-radius:999px;
  border:1px solid transparent;
  background:var(--color-primary);
  color:var(--on-primary);
  font-size:13px;
  font-weight:800;
  padding:0 14px;
  cursor:pointer;
}

.new-order-checkout-block-total{
  font-size:15px;
  font-weight:800;
  color:var(--color-text);
  white-space:nowrap;
}

.new-order-checkout-inline-actions{
  margin-left:8px;
  display:flex;
  align-items:center;
  gap:12px;
  flex:0 0 auto;
}

.new-order-checkout-merged-preview{
  margin-top:6px;
  padding:8px;
  border:1px dashed var(--color-border);
  border-radius:10px;
  display:grid;
  gap:6px;
}

.new-order-checkout-merged-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.new-order-checkout-merged-title{
  min-width:0;
  font-size:13px;
  font-weight:700;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.new-order-checkout-merged-price{
  flex:0 0 auto;
  font-size:13px;
  font-weight:700;
  color:var(--color-text);
}

.new-order-checkout-category-title{
  margin:0;
  position:absolute;
  top:-16px;
  left:0;
  padding:0 10px 0 0;
  background:var(--color-surface);
  font-size:16px;
  font-weight:800;
  color:var(--color-text);
}

.new-order-checkout-products-scroll{
  width:100%;
  overflow-x:auto;
  overflow-y:visible;
  overscroll-behavior-x:contain;
  overscroll-behavior-y:contain;
  scrollbar-width:none;
  -ms-overflow-style:none;
  padding-bottom:2px;
}

.new-order-checkout-products-scroll::-webkit-scrollbar{
  display:none;
}

.new-order-checkout-products-row{
  display:flex;
  gap:8px;
  width:max-content;
  min-width:100%;
}

.new-order-checkout-product-item{
  width:200px;
  min-width:200px;
  max-width:200px;
  border:1px solid var(--color-border);
  border-radius:12px;
  background:var(--color-surface);
  padding:0;
  display:flex;
  align-items:center;
  gap:8px;
  position:relative;
  overflow:visible;
  transition:transform var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}

.new-order-checkout-product-item.is-unavailable{
  background:var(--color-surface-2);
  border-color:var(--color-border);
  opacity:.58;
  filter:grayscale(.45);
  cursor:default;
}

.new-order-checkout-product-item.is-unavailable,
.new-order-checkout-product-item.is-unavailable *{
  pointer-events:none;
}

.new-order-checkout-product-item.is-selected{
  border-color:var(--color-primary);
  box-shadow:0 0 0 1px color-mix(in srgb, var(--color-primary), #fff 70%);
}

@media (hover:hover) and (pointer:fine){
  .new-order-checkout-category-block:hover{
    border-color:var(--primary-25);
    box-shadow:0 6px 14px rgba(15,23,42,.06);
  }

  .new-order-checkout-product-item:not(.is-selected):hover{
    transform:translateY(-1px);
    border-color:var(--primary-25);
    box-shadow:0 6px 14px rgba(15,23,42,.08);
  }

  .new-order-right-cart-item:hover{
    transform:translateY(-1px);
    background:var(--primary-18);
    border-color:var(--primary-25);
    box-shadow:0 6px 14px rgba(15,23,42,.08);
  }
}

.new-order-checkout-product-photo-wrap{
  width:52px;
  height:52px;
  border-radius:12px;
  border:none;
  background:transparent;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  flex:0 0 auto;
  color:var(--color-text-muted);
}

.new-order-checkout-product-photo{
  width:100%;
  height:100%;
  object-fit:cover;
}

.new-order-checkout-product-photo-placeholder{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.new-order-checkout-product-name{
  min-width:0;
  font-size:14px;
  font-weight:700;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  line-clamp:2;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.2;
  max-height:calc(1.2em * 2);
}

.new-order-checkout-product-item.has-composition .new-order-checkout-product-name{
  padding-right:26px;
}

.new-order-checkout-composition-btn{
  position:absolute;
  right:6px;
  bottom:6px;
  width:22px;
  height:22px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text-muted);
  font-size:13px;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.new-order-checkout-composition-btn:hover{
  border-color:var(--color-primary);
  color:var(--color-primary);
}

.new-order-checkout-composition-popover{
  position:fixed;
  z-index:4000;
  width:200px;
  max-width:200px;
  border:1px solid var(--color-border);
  border-radius:12px;
  background:var(--color-surface);
  box-shadow:0 10px 24px rgba(15,23,42,.18);
  padding:8px;
  display:grid;
  gap:6px;
}

.new-order-checkout-composition-popover-head{
  font-size:13px;
  font-weight:800;
  color:var(--color-text);
  padding:0 2px;
}

.new-order-checkout-composition-list{
  max-height:210px;
  overflow:auto;
  display:grid;
  gap:6px;
}

.new-order-checkout-ing-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
}

.new-order-checkout-ing-name{
  font-size:12px;
  color:var(--color-text);
  line-height:1.2;
  min-width:0;
  flex:1 1 auto;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  line-clamp:2;
  overflow:hidden;
  text-overflow:ellipsis;
  max-height:calc(1.2em * 2);
}

.new-order-checkout-ing-controls{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
  white-space:nowrap;
}

.new-order-checkout-ing-btn{
  width:22px;
  height:22px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text-muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:13px;
}

.new-order-checkout-ing-btn.is-disabled{
  opacity:.45;
  cursor:default;
}

.new-order-checkout-ing-qty{
  font-size:12px;
  font-weight:700;
  color:var(--color-text);
}

.new-order-checkout-products-empty{
  font-size:13px;
  color:var(--color-text-muted);
  padding:8px 2px;
}

.new-order-checkout-variants-wrap{
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  justify-content:flex-start;
  align-items:center;
  gap:10px;
  min-height:32px;
}

.new-order-checkout-variants-wrap.has-inline-actions{
  grid-template-columns:88px minmax(0,1fr) auto;
}

.new-order-checkout-variants-wrap.has-stock{
  grid-template-columns:88px auto minmax(0,1fr);
}

.new-order-checkout-variants-wrap.has-inline-actions.has-stock{
  grid-template-columns:88px auto minmax(0,1fr) auto;
}

.new-order-checkout-variants-price{
  width:88px;
  font-size:14px;
  font-weight:800;
  color:var(--color-text);
  white-space:nowrap;
  text-align:left;
}

.new-order-checkout-variants-stock{
  font-size:12px;
  font-weight:700;
  color:var(--color-text-muted);
  white-space:nowrap;
}

.new-order-checkout-variants-scroll{
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  overscroll-behavior-x:contain;
  overscroll-behavior-y:contain;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.new-order-checkout-variants-scroll::-webkit-scrollbar{
  display:none;
}

.new-order-checkout-variants-row{
  display:flex;
  gap:8px;
  width:max-content;
  min-width:100%;
  min-height:32px;
  align-items:center;
}

.new-order-checkout-variant-chip{
  height:30px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  font-size:13px;
  font-weight:700;
  padding:0 10px;
  white-space:nowrap;
  cursor:pointer;
}

.new-order-checkout-variant-chip.is-selected{
  background:var(--color-primary);
  border-color:transparent;
  color:var(--on-primary);
}

.new-order-checkout-variants-placeholder{
  display:inline-block;
  width:1px;
  height:30px;
  opacity:0;
  pointer-events:none;
}

.new-order-checkout-add-btn{
  width:64px;
  height:64px;
  border-radius:16px;
  border:1px dashed var(--color-primary);
  background:var(--color-surface);
  color:var(--color-primary);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}

.new-order-checkout-add-btn i{
  font-size:22px;
}

.new-order-checkout-add-btn:hover{
  background:var(--color-surface-2);
  transform:translateY(-1px);
}

.new-order-checkout-editor:not(.is-empty) .new-order-checkout-add-btn{
  align-self:flex-start;
  width:42px;
  height:42px;
  border-radius:12px;
}

.new-order-checkout-editor:not(.is-empty) .new-order-checkout-add-btn i{
  font-size:16px;
}

.new-order-checkout-editor.is-readonly .new-order-checkout-add-btn{
  display:none;
}

.new-order-product-card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:7px;
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface);
  aspect-ratio:16/9;
  min-height:156px;
  overflow:hidden;
}

.new-order-product-card.is-unavailable{
  background:var(--color-surface-2);
  border-color:var(--color-border);
  opacity:.58;
  filter:grayscale(.45);
  cursor:default;
}

.new-order-product-card.is-unavailable,
.new-order-product-card.is-unavailable *{
  pointer-events:none;
}

.new-order-card-discount-badge{
  position:absolute;
  top:8px;
  right:8px;
  margin:0;
  z-index:3;
  border-radius:999px;
  padding:3px 8px;
  font-size:11px;
  line-height:1;
  pointer-events:none;
}

.new-order-product-content{
  display:grid;
  grid-template-columns:72px 1fr;
  column-gap:7px;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.new-order-product-content::-webkit-scrollbar{
  display:none;
}

.new-order-product-photo-wrap{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:8px;
}

.new-order-product-photo,
.new-order-product-photo-placeholder{
  width:100%;
  aspect-ratio:1/1;
  border-radius:12px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
}

.new-order-product-photo{
  object-fit:cover;
}

.new-order-product-photo-placeholder{
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--color-text-muted);
}

.new-order-product-bottom .qty-pill{
  --qty-pill-h: 28px;
  --qty-pill-side: 32px;
  height: var(--qty-pill-h);
  border-radius: 999px;
  background: var(--color-surface-2);
  color: var(--color-text);
  border: 1px solid var(--color-border);
  display: inline-flex;
  align-items: center;
  width: max-content;
  max-width: 100%;
  overflow: hidden;
  user-select: none;
}

.new-order-product-bottom .qty-pill,
.new-order-product-bottom .qty-pill *{
  border: 0;
  outline: none;
  box-shadow: none;
}

.new-order-product-bottom .qty-pill::before,
.new-order-product-bottom .qty-pill::after{ content:none !important; }

.new-order-product-bottom .qty-pill__btn{
  width: var(--qty-pill-side);
  height: 100%;
  background: transparent;
  color: inherit;
  font-weight: 900;
  font-size: 18px;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
}

.new-order-product-bottom .qty-pill__btn:hover{
  background: var(--shop-hover-dark);
  color: var(--color-text);
}

.new-order-product-bottom .qty-pill__btn:active{ transform: scale(.98); }

.new-order-product-bottom .qty-pill__btn.is-disabled{
  opacity: .35;
  pointer-events: none;
}

.new-order-product-bottom .qty-pill__center{
  min-width: 24px;
  width: 24px;
  padding: 0;
  text-align: center;
  font-weight: 700;
  font-size: 13px;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.new-order-product-main{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:6px;
  padding-right:2px;
}

.new-order-product-title{
  font-weight:700;
  line-height:1.15;
  font-size:13px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
}

.new-order-product-variants{
  display:flex;
  align-items:flex-start;
  gap:6px;
  overflow-x:auto;
  overflow-y:hidden;
  white-space:nowrap;
  padding-bottom:4px;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  -ms-overflow-style:none;
  cursor:grab;
}

.new-order-product-variants::-webkit-scrollbar{
  display:none;
}

.new-order-product-variants:active{
  cursor:grabbing;
}

.new-order-variant-chip{
  appearance:none;
  flex-shrink:0;
  max-width:100%;
  padding:6px 12px;
  border-radius:16px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  font-size:13px;
  cursor:pointer;
  transition:all .2s;
  line-height:1.2;
}

.new-order-variant-chip:hover{
  border-color:var(--color-primary);
}

.new-order-variant-chip.is-selected{
  background:var(--color-primary);
  color:#fff;
  border-color:var(--color-primary);
}

.new-order-ingredients{
  display:grid;
  gap:6px;
  max-height:none;
  overflow:visible;
}

.new-order-ingredient-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-width:0;
}

.new-order-ingredient-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  color:var(--color-text-muted);
}

.new-order-ingredient-controls{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
}

.new-order-ingredient-btn{
  width:22px;
  height:22px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:14px;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.new-order-ingredient-btn:hover{
  border-color:var(--color-primary);
}

.new-order-ingredient-btn.is-disabled{
  opacity:.45;
  pointer-events:none;
}

.new-order-ingredient-qty{
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
  color:var(--color-text);
}

.new-order-options{
  grid-column:1 / -1;
  grid-row:2;
  display:flex;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  white-space:nowrap;
  padding-bottom:2px;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.new-order-options::-webkit-scrollbar{ display:none; }

.new-order-option-block{
  flex:0 0 auto;
  display:grid;
  gap:1px;
}

.new-order-option-title{
  font-size:12px;
  font-weight:700;
  color:var(--color-text);
  line-height:1.1;
}

.new-order-option-scroll{
  display:flex;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  padding-bottom:2px;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.new-order-option-scroll::-webkit-scrollbar{ display:none; }

.new-order-option-tile{
  flex:0 0 auto;
  width:150px;
  aspect-ratio:16/9;
  min-height:56px;
  border-radius:12px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  padding:8px;
  text-align:left;
  cursor:pointer;
}
.new-order-option-tile:hover{ border-color:var(--color-primary); }
.new-order-option-tile.is-selected{
  border-color:var(--color-primary);
  box-shadow:0 0 0 1px var(--color-primary);
}

.new-order-option-tile--add{
  align-items:center;
  justify-content:center;
}

.new-order-option-add-plus{
  font-size:26px;
  line-height:1;
  font-weight:700;
  color:var(--color-primary);
}

.new-order-option-tile-name{
  width:100%;
  font-size:12px;
  font-weight:700;
  line-height:1.2;
  min-height:2.4em;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  text-overflow:ellipsis;
}

.new-order-option-tile-price{
  width:100%;
  min-height:1.2em;
  font-size:12px;
  font-weight:700;
  line-height:1.2;
  color:var(--color-text-muted);
}

.new-order-option-tile-qty{
  width:100%;
  margin-top:auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}

.new-order-option-tile-qty-btn{
  width:30px;
  height:30px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:20px;
  font-weight:700;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
}

.new-order-option-tile-qty-btn:hover{
  border-color:var(--color-primary);
}

.new-order-option-tile-qty-btn[data-action="option-quick-qty-plus"]{
  background:var(--color-primary);
  border-color:var(--color-primary);
  color:#fff;
}

.new-order-option-tile-qty-btn[data-action="option-quick-qty-plus"]:hover{
  filter:brightness(.96);
}

.new-order-option-tile-qty-btn.is-disabled{
  opacity:.45;
  pointer-events:none;
}

.new-order-option-tile-qty-value{
  min-width:16px;
  text-align:center;
  font-size:20px;
  font-weight:800;
  line-height:1;
  color:var(--color-text);
}

.new-order-option-tile-variants{
  width:100%;
  margin-top:auto;
  display:flex;
  gap:4px;
  overflow-x:auto;
  overflow-y:hidden;
  white-space:nowrap;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.new-order-option-tile-variants::-webkit-scrollbar{ display:none; }

.new-order-option-tile-variant{
  appearance:none;
  flex:0 0 auto;
  max-width:100%;
  padding:6px 12px;
  border-radius:16px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  font-size:13px;
  font-weight:400;
  transition:all .2s;
  line-height:1.2;
  cursor:pointer;
  user-select:none;
}

.new-order-option-tile-variant:hover{
  border-color:var(--color-primary);
}

.new-order-option-tile-variant.is-selected{
  background:var(--color-primary);
  color:#fff;
  border-color:var(--color-primary);
}

.new-order-option-tile.is-placeholder{
  width:100%;
  aspect-ratio:auto;
  min-height:40px;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
}
.new-order-option-tile-edit{
  font-size:12px;
  color:var(--color-text-muted);
  white-space:nowrap;
}

.new-order-option-select{
  width:100%;
  min-height:38px;
  border-radius:12px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 10px;
  cursor:pointer;
}

.new-order-option-select:hover{
  border-color:var(--color-primary);
}

.new-order-option-left{
  color:var(--color-text-muted);
  font-weight:700;
  flex:0 0 auto;
}

.new-order-option-value{
  font-size:13px;
  color:var(--color-text-muted);
  flex:1 1 auto;
  text-align:left;
  min-width:0;
}

.new-order-option-edit{
  font-size:12px;
  color:var(--color-text-muted);
  white-space:nowrap;
  flex:0 0 auto;
}

.new-order-option-overlay{
  --shop-chat-mobile-keyboard-inset: 0px;
  --shop-chat-scroll-down-composer-extra: 0px;
  position:fixed;
  inset:0;
  background: rgba(15, 23, 42, 0.66);
  z-index:140;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  padding:20px;
  overscroll-behavior: none;
  transition: opacity 220ms ease, visibility 0s linear 220ms;
}

#adminBenefitsOverlay{
  z-index:4000;
}

.new-order-option-sheet{
  width:min(486px, calc(100vw - 40px));
  height:calc(100dvh - 40px);
  max-height:calc(100vh - 40px);
  overflow:hidden;
  border-radius:34px;
  background:var(--color-surface);
  box-shadow:0 20px 60px rgba(15, 23, 42, 0.35);
  display:flex;
  flex-direction:column;
  overscroll-behavior: contain;
}

.new-order-option-sheet-head{
  min-height:74px;
  padding:12px 16px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  border-bottom:0;
}

.new-order-option-sheet-back{
  position:absolute;
  left:14px;
  top:14px;
  width:42px;
  height:42px;
  border-radius:999px;
  border:0;
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
  font-size:17px;
}

.new-order-option-sheet-title{
  margin:0;
  font-size:22px;
  line-height:1.2;
  font-weight:700;
  color:var(--color-text);
  white-space:nowrap;
}

.new-order-option-sheet-list{
  padding:10px 16px 14px;
  flex:1;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  display:grid;
  gap:8px;
  align-content:start;
  align-items:start;
  grid-auto-rows:max-content;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.new-order-option-sheet-list::-webkit-scrollbar{ display:none; }

.new-order-benefits-sheet{
  width:min(560px, calc(100vw - 40px));
}

.new-order-benefits-head{
  min-height:116px;
  padding-bottom:16px;
  display:grid;
  align-content:start;
  gap:12px;
}

.new-order-benefits-head-top{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.new-order-benefits-mode-toggle{
  justify-self:center;
}

.new-order-benefits-head .shop-delivery-toggle{
  display:inline-flex;
  border-radius:999px;
  background:var(--color-surface-2);
  padding:0;
  gap:0;
}

.new-order-benefits-head .shop-delivery-toggle-btn{
  border:none;
  outline:none;
  cursor:pointer;
  padding:8px 18px;
  border-radius:999px;
  font-size:14px;
  font-weight:600;
  transition:background .2s, color .2s, box-shadow .2s;
  background:transparent;
  color:var(--color-text-muted);
}

.new-order-benefits-head .shop-delivery-toggle-btn.is-active{
  background:var(--color-primary);
  color:var(--color-white);
  box-shadow:0 1px 4px var(--overlay-bg);
}

#newOrderBenefitsCloseBtn{
  left:auto;
  right:14px;
}

.new-order-benefits-body{
  padding:6px 16px 18px;
}

.new-order-benefits-body > .admin-benefits-scroll-frame{
  align-self:stretch;
  justify-self:stretch;
  min-height:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  margin:-6px -16px -18px;
}

.new-order-benefits-body > .admin-benefits-scroll-frame .shop-checkout-benefits-modal-scroll,
.new-order-benefits-body > .admin-benefits-scroll-frame .shop-checkout-benefit-detail-scroll{
  flex:1;
  min-height:0;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  padding:12px 16px 18px;
}

.new-order-benefits-body > .admin-benefits-scroll-frame .shop-checkout-benefits-modal-footer,
.new-order-benefits-body > .admin-benefits-scroll-frame .shop-checkout-benefit-detail-footer{
  flex:0 0 auto;
  padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  border-top:1px solid var(--color-border);
  background:var(--color-surface);
}

.new-order-benefits-body > .admin-benefits-scroll-frame .shop-checkout-benefits-modal-footer .shop-checkout-benefits-promo-entry{
  margin:0;
}

.new-order-benefits-body > .admin-benefits-scroll-frame .shop-checkout-benefit-detail-footer .shop-checkout-benefit-claim-confirm{
  width:100%;
}

.new-order-benefits-body .shop-checkout-benefits-sheet{
  display:grid;
  gap:14px;
  align-content:start;
}

.new-order-benefits-body .shop-checkout-benefits-section{
  display:grid;
  gap:10px;
}

.new-order-benefits-body .shop-checkout-benefits-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.new-order-benefits-body .shop-checkout-benefits-list{
  display:grid;
  gap:12px;
}

.new-order-benefits-body .shop-checkout-benefits-list--horizontal{
  display:flex;
  gap:12px;
  overflow-x:auto;
  padding-bottom:4px;
  scrollbar-width:none;
  -ms-overflow-style:none;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  touch-action:pan-x;
  cursor:grab;
  scroll-behavior:smooth;
}

.new-order-benefits-body .shop-checkout-benefits-list--horizontal > *{
  flex:0 0 162px;
}

.new-order-benefits-body .shop-checkout-benefits-list--horizontal::-webkit-scrollbar{
  display:none;
}

.new-order-benefits-body .shop-checkout-benefits-list--horizontal.is-dragging{
  cursor:grabbing;
  scroll-behavior:auto;
  user-select:none;
}

.new-order-benefits-body .shop-checkout-benefits-list--horizontal.is-dragging *{
  user-select:none;
}

.new-order-benefits-body .shop-checkout-benefit-progress-reward-pane{
  display:grid;
  gap:8px;
  align-content:start;
}

.new-order-benefits-body .shop-checkout-benefit-progress-main{
  display:grid;
  gap:10px;
  min-width:0;
}

.new-order-benefits-body .shop-checkout-benefit-progress-wrap{
  display:grid;
  gap:0;
  min-width:0;
}

.new-order-benefits-body .shop-checkout-benefit-progress-visual,
.new-order-benefits-body .shop-checkout-benefit-progress-amount-layout{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.new-order-benefits-body .shop-checkout-benefit-progress-amount-layout{
  width:100%;
}

.new-order-benefits-body .shop-checkout-benefit-progress-amount-layout .shop-checkout-benefit-progress-amount{
  flex:1 1 auto;
}

.new-order-benefits-body .shop-checkout-benefit-progress-slots{
  display:flex;
  gap:8px;
  width:100%;
  min-width:0;
  overflow-x:auto;
  padding:4px 2px 2px;
  scrollbar-width:none;
  -ms-overflow-style:none;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  touch-action:pan-x;
  cursor:grab;
  scroll-behavior:smooth;
}

.new-order-benefits-body .shop-checkout-benefit-progress-slots::-webkit-scrollbar{
  display:none;
}

.new-order-benefits-body .shop-checkout-benefit-progress-slots.is-dragging{
  cursor:grabbing;
  scroll-behavior:auto;
  user-select:none;
}

.new-order-benefits-body .shop-checkout-benefit-progress-slots.is-dragging *{
  user-select:none;
}

.new-order-benefits-body .shop-checkout-benefit-progress-slot{
  position:relative;
  flex:0 0 56px;
  width:56px;
  height:56px;
  border:1px solid var(--color-border);
  border-radius:18px;
  background:linear-gradient(180deg, var(--color-surface), rgba(148, 163, 184, 0.08));
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--color-text-muted);
  box-shadow:0 0 0 3px var(--color-surface);
}

.new-order-benefits-body .shop-checkout-benefit-progress-slot.is-item.is-filled,
.new-order-benefits-body .shop-checkout-benefit-progress-slot.is-order.is-filled{
  border-color:rgba(255, 122, 0, 0.24);
  background:rgba(255, 122, 0, 0.08);
  color:var(--shop-buy);
}

.new-order-benefits-body .shop-checkout-benefit-progress-slot.is-empty{
  background:var(--color-surface-2);
}

.new-order-benefits-body .shop-checkout-benefit-progress-slot-media{
  width:100%;
  height:100%;
  border-radius:inherit;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}

.new-order-benefits-body .shop-checkout-benefit-progress-slot-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.new-order-benefits-body .shop-checkout-benefit-progress-slot-placeholder{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  font-weight:700;
  color:inherit;
}

.new-order-benefits-body .shop-checkout-benefit-progress-reward{
  position:relative;
  width:74px;
  height:74px;
  border-radius:22px;
  border:1px solid rgba(255, 122, 0, 0.24);
  background:rgba(255, 122, 0, 0.06);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--shop-buy);
  overflow:hidden;
}

.new-order-benefits-body .shop-checkout-benefit-progress-reward.is-static{
  cursor:default;
}

.new-order-benefits-body .shop-checkout-benefit-progress-reward.is-claimable{
  box-shadow:0 0 0 4px rgba(255, 122, 0, 0.12);
}

.new-order-benefits-body .shop-checkout-benefit-progress-reward-media{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  position:relative;
}

.new-order-benefits-body .shop-checkout-benefit-progress-reward-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.new-order-benefits-body .shop-checkout-benefit-progress-reward-media i{
  font-size:28px;
}

.new-order-benefits-body .shop-checkout-benefit-progress-reward-badge{
  position:absolute;
  right:-8px;
  bottom:-8px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border-radius:999px;
  background:var(--shop-buy);
  color:#fff;
  font-size:12px;
  font-weight:700;
  line-height:1;
  box-shadow:0 10px 18px rgba(255, 122, 0, 0.22);
  pointer-events:none;
}

.new-order-benefits-body .shop-checkout-benefit-progress-reward-badge-count{
  min-width:10px;
  text-align:center;
}

.new-order-benefits-body .shop-checkout-benefit-progress-reward-badge i{
  font-size:12px;
}

.shop-checkout-benefit-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  max-width:100%;
  padding:4px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  line-height:1.15;
  white-space:nowrap;
}

.shop-checkout-benefit-badge--accent{
  background:linear-gradient(135deg, var(--shop-buy), #ffb15a);
  color:var(--shop-buy-text);
  box-shadow:0 8px 18px rgba(20, 29, 48, 0.16);
}

.shop-checkout-benefit-badge--neutral{
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  border:1px solid var(--color-border);
}

.new-order-benefits-claim-screen{
  display:grid;
  gap:14px;
}

.new-order-benefits-claim-list{
  display:grid;
  gap:12px;
}

.new-order-benefits-claim-card{
  display:grid;
  grid-template-columns:88px 1fr auto;
  gap:14px;
  align-items:center;
  padding:12px;
}

.new-order-benefits-claim-media{
  width:88px;
  height:88px;
  border-radius:18px;
  background:var(--color-surface-2);
  overflow:hidden;
  display:grid;
  place-items:center;
  color:var(--shop-buy);
}

.new-order-benefits-claim-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.new-order-benefits-claim-title{
  font-size:18px;
  line-height:1.25;
  font-weight:700;
  color:var(--color-text);
}

.new-order-benefits-claim-controls{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.new-order-benefits-claim-step{
  width:38px;
  height:38px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  font-size:22px;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.new-order-benefits-claim-step:disabled{
  opacity:.45;
  cursor:default;
}

.new-order-benefits-claim-qty{
  min-width:22px;
  text-align:center;
  font-size:18px;
  line-height:1;
  font-weight:700;
  color:var(--color-text);
}

.new-order-benefits-claim-footer{
  position:sticky;
  bottom:0;
  padding-top:8px;
  background:linear-gradient(180deg, rgba(255,255,255,0) 0%, var(--color-surface) 24%);
}

@media (max-width: 640px){
  .new-order-benefits-sheet{
    width:min(100vw - 24px, 560px);
    height:calc(100dvh - 24px);
    max-height:calc(100vh - 24px);
    border-radius:26px;
  }

  .new-order-benefits-head{
    min-height:128px;
  }

  .new-order-benefits-head .shop-delivery-toggle-btn{
    padding:8px 14px;
    font-size:13px;
  }

  .new-order-benefits-claim-card{
    grid-template-columns:72px 1fr;
  }

  .new-order-benefits-claim-controls{
    grid-column:1 / -1;
    justify-content:flex-end;
  }

  .new-order-benefits-claim-media{
    width:72px;
    height:72px;
  }

  .new-order-benefits-body > .admin-benefits-scroll-frame.has-footer .shop-checkout-benefits-modal-scroll,
  .new-order-benefits-body > .admin-benefits-scroll-frame.admin-benefits-scroll-frame--detail .shop-checkout-benefit-detail-scroll{
    padding-bottom:132px;
  }
}

.new-order-option-sheet-item{
  width:100%;
  border-radius:12px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  text-align:left;
  cursor:pointer;
}
.new-order-option-sheet-card{
  border:1px solid color-mix(in srgb, var(--color-border), transparent 8%);
  border-radius:14px;
  padding:0 12px;
  background:var(--color-surface);
}
.new-order-option-sheet-card.is-selected{
  border-color: color-mix(in srgb, var(--color-primary), #fff 64%);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-primary), #fff 78%);
}
.new-order-option-sheet-item-row{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:38px;
  padding:8px 0;
  margin:0;
  cursor:pointer;
}

.new-order-option-sheet-item:hover{
  border-color:var(--primary-25);
}

.new-order-option-sheet-item.is-selected{
  border-color:var(--color-primary);
  box-shadow:0 0 0 1px var(--color-primary);
}

.new-order-option-sheet-item-thumb{
  width:42px;
  height:42px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  color:var(--color-text-muted);
  flex:0 0 auto;
}

.new-order-option-sheet-item-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.new-order-option-sheet-item-main{
  min-width:0;
  display:grid;
  gap:1px;
  align-content:center;
}

.new-order-option-sheet-item-title{
  font-size:14px;
  font-weight:700;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.new-order-option-sheet-item-meta{
  font-size:12px;
  color:var(--color-text-muted);
}

.new-order-option-sheet-empty{
  font-size:13px;
  color:var(--color-text-muted);
  padding:10px 2px;
}

.new-order-checkout-category-checkbox{
  position:absolute;
  opacity:0;
  pointer-events:none;
  width:0;
  height:0;
}

.new-order-checkout-categories-actions{
  padding:10px 16px 16px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  border-top:1px solid var(--color-border);
  background:var(--color-surface);
}

.new-order-checkout-categories-footer{
  padding:8px 16px 16px;
  border-top:1px solid var(--color-border);
  background:var(--color-surface);
  display:grid;
  gap:10px;
}

.new-order-checkout-categories-switch{
  width:100%;
  min-height:40px;
  padding:0 4px;
  justify-content:space-between;
}

.new-order-checkout-categories-switch .switch-text{
  font-size:13px;
  font-weight:700;
  color:var(--color-text);
}

.new-order-checkout-categories-action-btn{
  height:44px;
  border-radius:999px;
  border:1px solid var(--color-border);
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}

.new-order-checkout-categories-action-btn.is-save{
  border-color:transparent;
  background:var(--color-primary);
  color:var(--on-primary);
}

.new-order-checkout-categories-action-btn.is-save:hover{
  background:var(--color-primary-hover);
  transform:translateY(-1px);
}

.new-order-checkout-categories-action-btn.is-cancel{
  background:var(--color-surface);
  color:var(--color-text);
}

.new-order-checkout-categories-action-btn.is-cancel:hover{
  background:var(--color-surface-2);
  transform:translateY(-1px);
}

.new-order-right-address-sheet{
  width:min(500px, calc(100vw - 40px));
}

.new-order-right-address-body{
  gap:10px;
}

.new-order-right-address-footer{
  padding-top:10px;
}

.new-order-right-address-list-wrap{
  display:grid;
  gap:8px;
  margin-bottom:4px;
}

.new-order-right-address-list-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}

.new-order-right-address-list-title{
  font-size:14px;
  font-weight:800;
  color:var(--color-text);
}

.new-order-right-address-new-btn{
  height:34px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  padding:0 12px;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
}

.new-order-right-address-list{
  display:grid;
  gap:8px;
}

.new-order-right-address-row{
  display:grid;
  grid-template-columns:20px 1fr auto;
  align-items:center;
  gap:10px;
  padding:10px 0;
  border-bottom:1px solid var(--color-border);
}

.new-order-right-address-radio{
  width:20px;
  height:20px;
  border-radius:999px;
  border:2px solid var(--color-border);
  background:var(--color-surface);
  cursor:pointer;
}

.new-order-right-address-row.is-selected .new-order-right-address-radio{
  border-color:var(--color-primary);
  box-shadow:inset 0 0 0 4px var(--color-surface), inset 0 0 0 10px var(--color-primary);
}

.new-order-right-address-row-main{
  min-width:0;
  font-size:14px;
  font-weight:500;
  color:var(--color-text);
  line-height:1.35;
  white-space:normal;
  overflow-wrap:anywhere;
}

.new-order-right-address-row-actions{
  display:flex;
  align-items:center;
  gap:8px;
}

.new-order-right-address-row-btn{
  width:34px;
  height:34px;
  border-radius:999px;
  border:none;
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.new-order-right-address-row-btn.is-danger{
  color:#e35b5b;
}

.new-order-opt-gear{
  width:30px;
  height:30px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  flex:0 0 auto;
  margin-left:auto;
}
.new-order-opt-gear.is-disabled{
  opacity:.45;
  pointer-events:none;
}
.new-order-opt-gear:hover{ border-color:var(--color-primary); color:var(--color-primary); }

.new-order-opt-check{
  width:34px;
  height:34px;
  border-radius:999px;
  border:2px solid #9ca3af;
  background:transparent;
  cursor:pointer;
  flex:0 0 auto;
}
.new-order-opt-check.is-selected{
  border-color:var(--color-primary);
  box-shadow:inset 0 0 0 6px #fff, inset 0 0 0 999px var(--color-primary);
}

.new-order-opt-qty{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:auto;
}
.new-order-opt-qty-btn{
  width:30px;
  height:30px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:18px;
  line-height:1;
  cursor:pointer;
}
.new-order-opt-qty-btn.is-plus{
  background:var(--color-primary);
  border-color:var(--color-primary);
  color:#fff;
}
.new-order-opt-qty-value{
  min-width:14px;
  text-align:center;
  font-weight:700;
}

.new-order-opt-variants-row{
  display:flex;
  gap:8px;
  margin-top:6px;
  overflow-x:auto;
  padding-top:6px;
  padding-bottom:6px;
  border-top:1px solid var(--color-border);
}
.new-order-opt-variants-row::-webkit-scrollbar{ display:none; }
.new-order-opt-variant-btn{
  flex:0 0 auto;
  border:1px solid var(--color-border);
  border-radius:999px;
  background:var(--color-surface-2);
  color:var(--color-text);
  font-size:12px;
  padding:5px 10px;
  cursor:pointer;
}
.new-order-opt-variant-btn.is-selected{
  background:var(--color-primary);
  border-color:var(--color-primary);
  color:#fff;
}

.new-order-product-sheet{
  width:min(560px, 100%);
  height:calc(100dvh - 40px);
  max-height:calc(100vh - 40px);
  display:flex;
  flex-direction:column;
}

.new-order-product-sheet-list{
  flex:1 1 auto;
  min-height:0;
  max-height:none;
  padding:12px;
  display:grid;
  gap:12px;
  align-content:start;
  overflow:auto;
}

.new-order-product-sheet-headbox{
  display:grid;
  gap:10px;
}

.new-order-product-sheet-photo-wrap{
  width:min(350px, 100%);
  margin:0 auto;
  border-radius:16px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  overflow:hidden;
  aspect-ratio:1/1;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}

.new-order-product-sheet-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.new-order-product-sheet-photo-placeholder{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--color-text-muted);
}

.new-order-product-sheet-photo-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:40px;
  height:40px;
  border-radius:14px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  display:grid;
  place-items:center;
  cursor:pointer;
}

.new-order-product-sheet-photo-nav.is-prev{ left:10px; }
.new-order-product-sheet-photo-nav.is-next{ right:10px; }

.new-order-product-sheet-photo-dots{
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:4px;
}

.new-order-product-sheet-photo-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  border:0;
  background:var(--color-border);
  opacity:.8;
  cursor:pointer;
}

.new-order-product-sheet-photo-dot.is-active{
  background:var(--color-text-muted);
  opacity:1;
}

.new-order-product-sheet-name{
  font-size:30px;
  line-height:1.08;
  font-weight:900;
  color:var(--color-text);
}

.new-order-product-sheet-variants{
  display:flex;
  align-items:flex-start;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  white-space:nowrap;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.new-order-product-sheet-variants::-webkit-scrollbar{
  display:none;
}

.new-order-product-sheet-section-title{
  font-size:15px;
  font-weight:800;
  color:var(--color-text);
}

.new-order-product-sheet-ingredients{
  display:grid;
  gap:8px;
}

.new-order-product-sheet-ingredients .new-order-ingredient-row{
  border:1px solid var(--color-border);
  border-radius:14px;
  padding:8px 10px;
  background:var(--color-surface);
}

.new-order-product-sheet-ing-card{
  border:1px solid var(--color-border);
  border-radius:14px;
  padding:8px 10px;
  background:var(--color-surface);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.new-order-product-sheet-ing-left{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
  flex:1 1 auto;
}

.new-order-product-sheet-ing-photo-wrap{
  width:34px;
  height:34px;
  border-radius:999px;
  overflow:hidden;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  display:grid;
  place-items:center;
  flex:0 0 auto;
}

.new-order-product-sheet-ing-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.new-order-product-sheet-ing-photo-placeholder{
  color:var(--color-text-muted);
  font-size:12px;
}

.new-order-product-sheet-ing-name{
  min-width:0;
  font-size:22px;
  font-weight:700;
  line-height:1.1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.new-order-product-sheet-ing-controls{
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
}

.new-order-product-sheet-ing-qty{
  font-size:26px;
  font-weight:800;
  line-height:1;
  min-width:80px;
  text-align:center;
}

.new-order-product-sheet-options{
  display:grid;
  gap:8px;
}

.new-order-product-sheet-options-group{
  display:grid;
  gap:8px;
}

.new-order-product-sheet-options-list{
  display:grid;
  gap:8px;
}

.new-order-product-sheet-option-btn{
  border:1px solid var(--color-border);
  border-radius:14px;
  background:var(--color-surface);
  color:var(--color-text);
  min-height:40px;
  padding:0 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  cursor:pointer;
  font-size:14px;
  font-weight:700;
}

.new-order-product-sheet-option-btn:hover{
  border-color:var(--color-primary);
  color:var(--color-primary);
}

.new-order-product-sheet-footer{
  display:flex;
  align-items:center;
  gap:10px;
  padding:4px 12px;
  background:var(--color-surface);
}

.new-order-product-sheet-qty{
  flex:0 0 132px;
  --qty-pill-h:52px;
  --qty-pill-side:52px;
  height:var(--qty-pill-h);
  justify-content:center;
  background:var(--color-surface-2);
  color:var(--color-text);
  border:1px solid var(--color-border);
}

.new-order-product-sheet-add{
  min-height:52px;
  height:52px;
  border-radius:999px;
  flex:1 1 auto;
  background:var(--color-primary);
  border:1px solid var(--color-primary);
  color:#fff;
}

.new-order-product-sheet-add:hover{
  filter:brightness(0.96);
}

@media (min-width: 769px){
  .new-order-product-sheet-footer .qty-pill{
    --qty-pill-h:52px;
    --qty-pill-side:52px;
  }
}

/* Override shared shop footer behavior: in this modal qty must stay narrow like client product modal */
.new-order-product-sheet-footer .new-order-product-sheet-qty{
  flex:0 0 132px !important;
}

/* 1:1 with shop product footer controls */
.new-order-product-sheet-footer .qty-pill{
  height: var(--qty-pill-h);
  border-radius:999px;
  background: var(--color-surface-2);
  color: var(--color-text);
  border: 1px solid var(--color-border);
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  overflow:hidden;
  user-select: none;
}

.new-order-product-sheet-footer .qty-pill,
.new-order-product-sheet-footer .qty-pill *{
  border: 0;
  outline: none;
  box-shadow: none;
}

.new-order-product-sheet-footer .qty-pill::before,
.new-order-product-sheet-footer .qty-pill::after{
  content:none !important;
}

.new-order-product-sheet-footer .qty-pill__btn{
  width: var(--qty-pill-side);
  height: 100%;
  background: transparent;
  color: inherit;
  font-weight: 900;
  font-size: 18px;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
}

.new-order-product-sheet-footer .qty-pill__btn:hover{
  background: var(--shop-hover-dark);
}

.new-order-product-sheet-footer .qty-pill__btn:active{
  transform: scale(.98);
}

.new-order-product-sheet-footer .qty-pill__btn.is-disabled{
  opacity: .35;
  pointer-events: none;
}

.new-order-product-sheet-footer .qty-pill__center{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-align: center;
  font-weight: 700;
  font-size: 14px;
  white-space: nowrap;
  padding: 0 10px;
}

.new-order-product-sheet-footer .new-order-product-sheet-add.shop-checkout-btn.shop-pd-action{
  height: 52px;
  border-radius: 999px;
  padding: 0 18px;
  width: 100%;
  flex: 1 1 auto;
  background: var(--shop-buy);
  color: var(--shop-buy-text);
  border: 1px solid var(--shop-buy);
  font-weight: 800;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
}

.new-order-product-sheet-footer .new-order-product-sheet-add.shop-checkout-btn.shop-pd-action:hover{
  background: var(--shop-buy-hover);
  border-color: var(--shop-buy-hover);
  filter: none;
}

.new-order-product-sheet-footer .shop-pd-action-prices{
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  white-space: nowrap;
}

.new-order-product-sheet-footer .shop-pd-action-old{
  font-size: 13px;
  color: var(--shop-buy-text);
  text-decoration: line-through;
  opacity: 0.8;
}

.new-order-product-sheet-footer .shop-pd-action-price,
.new-order-product-sheet-footer .shop-checkout-total{
  font-weight: 900;
  font-size: inherit;
  line-height: 1.2;
}

.new-order-product-sheet-footer .shop-pd-action-label{
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  opacity: 0.9;
}

/* Product modal header/footer must be only as tall as controls */
.new-order-product-sheet .new-order-option-sheet-head{
  min-height:0;
  height:auto;
  padding:8px 12px;
  justify-content:flex-start;
}

.new-order-product-sheet .new-order-option-sheet-back{
  position:static;
  left:auto;
  top:auto;
  width:42px;
  height:42px;
}

.new-order-product-sheet .shop-pd-option-edit{
  appearance:none;
  -webkit-appearance:none;
  border:none;
  background:none;
  color:var(--color-text-muted);
  font-size:13px;
  font-weight:500;
  line-height:1.2;
  padding:4px 8px;
  cursor:pointer;
  text-decoration:none;
}

.new-order-product-sheet .shop-pd-option-edit:hover{
  color:var(--color-text);
}

.new-order-product-sheet .shop-pd-option-variant-scroll{
  justify-content:flex-start;
}

.new-order-product-sheet .shop-pd-option-variant-btn{
  flex:0 0 auto;
  width:auto;
  max-width:max-content;
  white-space:nowrap;
}

/* Combo modal styles (ported from shop) */
.shop-sheet-discount-badge{
  margin:0 auto;
  padding:4px 10px;
  border-radius:8px;
  background:var(--shop-buy);
  color:var(--shop-buy-text);
  font-size:14px;
  font-weight:700;
  line-height:1.2;
}

.shop-pd-meta{
  min-width:0;
  display:grid;
  gap:6px;
}

.shop-pd-title{
  font-weight:900;
  font-size:1.2em;
  color:var(--color-text);
  line-height:1.15;
  display:-webkit-box;
  -webkit-line-clamp:2;
  line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.cart-row{
  border:1px solid var(--color-border);
  background:var(--color-surface);
  border-radius:16px;
  padding:12px;
  display:grid;
  grid-template-columns:92px 1fr auto;
  gap:12px;
  align-items:flex-start;
  margin-bottom:10px;
}

.cart-thumb{
  width:70px;
  height:70px;
  border-radius:14px;
  object-fit:cover;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  flex-shrink:0;
}

.cart-mid{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:6px;
  min-height:92px;
  align-self:stretch;
}

.cart-title{
  font-weight:900;
  color:var(--color-text);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.cart-sub{
  font-size:12px;
  color:var(--color-text-muted);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-height:1.2em;
}

.cart-sub-container{
  font-size:12px;
  color:var(--color-text-muted);
  min-height:1.2em;
}

.cart-sub-details{
  margin-top:4px;
  padding-left:8px;
}

.cart-sub-detail-item{
  font-size:.9em;
  color:var(--color-text-muted);
  margin-top:2px;
  line-height:1.4;
}

.cart-combo-thumb{
  width:70px;
  height:70px;
  border-radius:14px;
  overflow:hidden;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:2px;
  background:var(--color-surface-2);
  flex-shrink:0;
}

.cart-combo-thumb__cell{
  overflow:hidden;
  background:var(--color-surface-2);
}

.cart-combo-thumb__cell--empty{
  background:var(--color-border);
}

.cart-combo-thumb__cell .cart-thumb{
  width:100%;
  height:100%;
  border-radius:0;
  border:none;
}

.cart-row--combo .cart-sub-detail-item{
  font-size:.9em;
  color:var(--color-text-muted);
  margin-top:2px;
}

.cart-combo-details{
  margin-top:4px;
}

.cart-combo-detail-block{
  margin-top:6px;
}

.cart-combo-detail-block:first-child{
  margin-top:0;
}

.cart-combo-detail-name{
  font-size:.9em;
  color:var(--color-text);
  padding-left:8px;
  font-weight:700;
}

.cart-combo-detail-block .cart-sub-details{
  padding-left:8px;
  margin-top:2px;
  display:block;
}

.cart-right{
  text-align:right;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:nowrap;
  align-self:end;
}

.cart-price-group{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}

.cart-price-stack{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:2px;
}

.cart-old{
  font-size:11px;
  color:var(--color-text-muted);
  text-decoration:line-through;
}

.cart-old.hidden{display:none}

.cart-price{
  font-weight:900;
  font-size:13px;
  color:var(--color-text);
  white-space:nowrap;
}

.cart-discount-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:20px;
  padding:4px 8px;
  border-radius:999px;
  background:var(--shop-buy, #ff7a00);
  color:#fff;
  font-size:11px;
  line-height:1;
  font-weight:700;
  white-space:nowrap;
}

.cart-discount-badge.hidden{display:none}

.shop-combo-detail{
  padding:var(--sp-pad,12px);
  display:flex;
  flex-direction:column;
  gap:16px;
}

.shop-combo-view{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:0;
  overflow:hidden;
}

.shop-combo-detail-scroll{
  flex:1;
  min-height:0;
  overflow:auto;
  padding:var(--sp-pad,12px);
}

.shop-combo-detail-caption{
  font-size:14px;
  color:var(--color-text-muted);
  line-height:1.35;
  margin-top:-8px;
}

.shop-combo-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.shop-combo-row{
  margin-bottom:0;
  cursor:default;
  position:relative;
  grid-template-columns:92px 1fr;
}

.shop-combo-row .shop-combo-mid{
  padding-right:0;
}

.shop-combo-row .cart-title{
  font-weight:800;
  white-space:normal;
  display:-webkit-box;
  -webkit-line-clamp:2;
  line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
}

.shop-combo-picker-row .cart-title{
  white-space:normal;
  display:-webkit-box;
  -webkit-line-clamp:2;
  line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
  min-width:0;
  max-width:100%;
}

.shop-combo-row .cart-sub,
.shop-combo-picker-row .cart-sub{
  white-space:normal;
  display:-webkit-box;
  -webkit-line-clamp:2;
  line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.shop-combo-mid{
  display:flex;
  flex-direction:column;
  min-height:0;
}

.shop-combo-row-bottom{
  margin-top:auto;
  padding-top:8px;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;
}

.shop-combo-replace{
  height:32px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  cursor:pointer;
  font-weight:700;
  font-size:13px;
}

.shop-combo-replace:hover{
  background:var(--shop-hover-dark);
}

.shop-combo-old{
  font-size:13px;
  color:var(--color-text-muted);
  text-decoration:line-through;
  margin-left:auto;
  white-space:nowrap;
}

.shop-combo-price{
  font-size:15px;
  font-weight:900;
  color:var(--color-text);
  white-space:nowrap;
  margin-left:auto;
}

.shop-combo-old + .shop-combo-price{
  margin-left:0;
}

.shop-combo-picker-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.shop-combo-picker-row{
  width:100%;
  text-align:left;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  cursor:pointer;
  position:relative;
  grid-template-columns:92px 1fr;
  grid-template-rows:92px auto;
}

.shop-combo-picker-row.is-selected{
  border-color:var(--shop-buy);
}

.shop-combo-picker-row > .cart-thumb{
  grid-row:1;
  grid-column:1;
  align-self:start;
}

.shop-combo-picker-row > .shop-combo-picker-mid{
  grid-row:1;
  grid-column:2;
  align-self:start;
  min-height:0;
}

.shop-combo-picker-row > .shop-combo-picker-bottom{
  grid-row:2;
  grid-column:2;
  align-self:end;
}

.shop-combo-picker-mid{
  display:flex;
  flex-direction:column;
  min-height:0;
}

.shop-combo-picker-bottom{
  padding-top:6px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.shop-combo-picker-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}

.shop-combo-picker-price{
  display:flex;
  align-items:baseline;
  gap:8px;
}

.shop-combo-picker-gear{
  width:36px;
  height:36px;
  border:none;
  border-radius:50%;
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  cursor:pointer;
  display:grid;
  place-items:center;
  flex-shrink:0;
  padding:0;
  transition:background var(--dur-fast) var(--ease-smooth),color var(--dur-fast) var(--ease-smooth),transform .3s ease;
}

.shop-combo-picker-gear:hover{
  background:var(--shop-hover-dark);
  color:var(--color-text);
}

.shop-combo-picker-gear svg{
  display:block;
  width:18px;
  height:18px;
}

.shop-combo-picker-gear.is-open{
  color:var(--color-primary);
  transform:rotate(180deg);
}

.shop-combo-radio{
  width:36px;
  height:36px;
  border-radius:50%;
  border:2px solid var(--overlay-bg);
  margin-left:0;
  flex:0 0 auto;
  align-self:center;
  position:relative;
  cursor:pointer;
  display:grid;
  place-items:center;
}

.shop-combo-radio.is-selected{
  border-color:var(--shop-buy);
  background:var(--shop-buy);
}

.shop-combo-radio.is-selected::after{
  content:"\2713";
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:var(--shop-buy-text);
  font-size:18px;
  font-weight:900;
}

.shop-combo-picker-expand{
  margin-top:0;
  border-top:1px solid var(--color-border);
  background:var(--color-surface);
  grid-row:3;
  grid-column:1 / -1;
  min-width:0;
  overflow-x:hidden;
}

.shop-combo-picker-expand-loading{
  padding:20px;
  text-align:center;
  color:var(--color-text-muted);
  font-size:14px;
}

.shop-combo-picker-expand-inner{
  padding:12px 0 14px;
  background:var(--color-surface);
  min-width:0;
  overflow-x:hidden;
}

.shop-combo-picker-expand-title{
  font-weight:700;
  font-size:14px;
  color:var(--color-text);
  margin-bottom:10px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.shop-combo-picker-variants{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:16px;
}

.shop-combo-picker-variants:last-child{
  margin-bottom:0;
}

.shop-combo-picker-variants-row{
  display:flex;
  flex-wrap:nowrap;
  gap:8px;
  overflow-x:auto;
  padding-bottom:4px;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.shop-combo-picker-variants-row::-webkit-scrollbar{
  display:none;
}

.shop-combo-picker-variant-btn{
  padding:10px 16px;
  border-radius:12px;
  border:2px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  flex:0 0 auto;
  transition:border-color .15s ease,color .15s ease,background .15s ease;
}

.shop-combo-picker-variant-btn:hover{
  border-color:var(--color-text-muted);
  color:var(--color-text);
}

.shop-combo-picker-variant-btn.is-active{
  border-color:var(--color-primary);
  color:var(--color-primary);
  background:var(--primary-12);
}

.shop-combo-picker-ingredients{
  margin-top:4px;
}

.shop-combo-picker-ingredients .shop-combo-picker-expand-title{
  margin-bottom:10px;
}

.shop-combo-picker-ingredient-row{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 0;
  border-bottom:1px solid var(--color-border);
}

.shop-combo-picker-ingredient-row:last-child{
  border-bottom:none;
}

.shop-combo-picker-ingredient-img{
  width:40px;
  height:40px;
  border-radius:50%;
  overflow:hidden;
  flex-shrink:0;
  background:var(--color-surface-2);
}

.shop-combo-picker-ingredient-img img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.shop-combo-picker-ingredient-name{
  flex:1;
  min-width:0;
  font-size:14px;
  color:var(--color-text);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.shop-combo-picker-ingredient-qty{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}

.shop-combo-picker-ingredient-qty-val{
  min-width:44px;
  text-align:center;
  font-size:14px;
  color:var(--color-text);
}

.shop-combo-picker-ingredient-btn{
  width:32px;
  height:32px;
  border-radius:50%;
  border:1px solid var(--shop-buy);
  background:var(--shop-buy);
  color:#fff;
  font-size:20px;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  display:grid;
  place-items:center;
  transform:scale(1);
  box-shadow:0 4px 10px rgba(255,136,0,.24);
  transition:background .15s ease,border-color .15s ease,transform .14s ease,box-shadow .14s ease,color .14s ease,filter .14s ease;
}

.shop-combo-picker-ingredient-btn:hover{
  filter:brightness(1.03);
  box-shadow:0 6px 12px rgba(255,136,0,.3);
}

.shop-combo-picker-ingredient-btn:active,
.shop-combo-picker-ingredient-btn.is-pressed{
  background:#ef7600;
  border-color:#ef7600;
  color:#fff;
  transform:scale(1.12);
  box-shadow:0 0 0 4px rgba(255,136,0,.2),0 8px 14px rgba(255,136,0,.36);
}

.shop-combo-picker-ingredient-btn:disabled{
  background:#eef0f3;
  border-color:#e0e5ea;
  color:#9ca3ad;
  transform:none;
  box-shadow:none;
  filter:none;
  cursor:default;
}

.shop-combo-picker-empty{
  border:1px dashed var(--color-border);
  border-radius:12px;
  padding:16px;
  color:var(--color-text-muted);
  text-align:center;
  font-size:14px;
}

.shop-combo-detail--picker .shop-combo-detail-title{
  display:none;
}

.shop-combo-detail--picker{
  padding-top:0;
}

.new-order-product-prices{
  display:none;
}

.new-order-product-bottom{
  margin-top:auto;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  flex:0 0 auto;
}

.new-order-options-btn{
  height:30px;
  border:1px solid var(--color-border);
  border-radius:999px;
  background:var(--color-surface-2);
  color:var(--color-text);
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:0 10px;
  cursor:pointer;
  font-weight:700;
  font-size:12px;
  line-height:1;
  white-space:nowrap;
}

.new-order-options-btn i{
  font-size:12px;
  color:var(--color-text-muted);
}

.new-order-options-btn:hover{
  border-color:var(--color-primary);
  color:var(--color-primary);
}

.new-order-options-btn:hover i{
  color:var(--color-primary);
}

.new-order-product-old{
  color:var(--color-text-muted);
  text-decoration:line-through;
  font-size:12px;
}

.new-order-product-price{
  font-size:18px;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
}

.new-order-add-btn{
  margin-left:auto;
  height: 30px;
  border: 1px solid var(--color-primary);
  border-radius: 999px;
  background: var(--color-primary);
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  cursor: pointer;
  font-weight: 700;
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
}

.new-order-add-btn:hover{
  filter: brightness(0.96);
}

.new-order-add-old{
  opacity: .72;
  text-decoration: line-through;
  font-size: 12px;
}

.new-order-add-price{
  font-size: 13px;
  font-weight: 700;
}

.new-order-add-plus{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 10px;
  font-size: 14px;
  font-weight: 700;
}

@media (max-width:1700px){
  .new-order-products-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:920px){
  .new-order-products-grid{grid-template-columns:1fr}
}

.app-modal{
  position:fixed;
  top:50%;
  left:50%;
  width:500px;
  max-width:calc(100vw - 24px);
  /* фиксируем формат: 500×1000 на десктопе, но не выходим за пределы экрана */
  height:min(1000px, calc(100vh - 90px));
  max-height:calc(100vh - 90px);
  transform:translate(-50%,-46%) scale(.98);
  opacity:0;
  pointer-events:none;
  transition:transform var(--dur-med) var(--ease-smooth), opacity var(--dur-med) var(--ease-smooth);

  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);
  z-index:90;

  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.app-modal.is-open{
  opacity:1;
  pointer-events:auto;
  transform:translate(-50%,-50%) scale(1);
}

.app-modal-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 12px;
  min-height:45px;
}
.app-modal-header .btn{height:40px}
.app-modal-header .btn-icon{width:40px}
.app-modal-title{
  font-weight: 900;
  flex: 1;
  text-align: center;
}
.app-modal-back-btn{
  flex-shrink: 0;
  margin-right: auto;
}
.app-modal-actions{
  display:flex;
  align-items:center;
  gap:8px;
}

.app-modal-body{
  padding:0 12px 12px;
  overflow-y:auto;
  flex:1;
  min-height:0;
}
.app-modal-body::after{content:"";display:block;height:24px}

.app-modal-footer{
  padding:12px;
  border-top:1px solid var(--color-border);
  display:flex;
  justify-content:flex-end;
  gap:10px;
}

@media (max-width:768px){
  .app-modal{
    left:0;
    right:0;
    top:auto;
    bottom:0;
    width:100%;
    max-width:100%;
    height:calc(100vh - var(--header-height));
    max-height:calc(100vh - var(--header-height));
    border-radius:var(--radius-lg) var(--radius-lg) 0 0;
    transform:translateY(110%);
    opacity:1;
  }
  .app-modal.is-open{transform:translateY(0)}
}

/* ================= Forms ================= */

.form-grid{display:grid;gap:12px}
.form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.form-row-pcs-converter{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}
.form-row-pcs-converter.hidden{display:none}

.field-label{font-size:12px;color:var(--color-text-muted);margin-bottom:6px;display:block}

/* Подпись на границе инпута (как в составе: Кол-во, Ед., Цена, Себест.) */
.field-wrap{position:relative}
.field-wrap .field-label{
  position:absolute;
  top:-7px;
  left:8px;
  padding:0 4px;
  font-size:10px;
  color:var(--color-text-muted);
  background:var(--color-surface);
  margin-bottom:0;
  line-height:1;
  pointer-events:none;
}

.control,
.textarea{
  width:100%;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  border-radius:10px;
  padding:10px 12px;
  outline:none;
  transition:border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}
.control{height:40px}
.textarea{min-height:96px;resize:vertical}

.control:focus,
.textarea:focus{
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12);
}

/* Custom select */
.custom-select{position:relative}
.custom-select-trigger{
  display:flex;
  align-items:center;
  justify-content:space-between;
  cursor:pointer;
  text-align:left;
  font-size:inherit;
  font-weight:inherit;
}
.custom-select-trigger.control{padding-right:12px}
.custom-select-value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.custom-select-arrow{font-size:.6rem;color:var(--color-text-muted);flex-shrink:0;margin-left:8px;transition:transform .15s}
.custom-select.is-open .custom-select-arrow{transform:rotate(180deg)}
.custom-select-dropdown{
  position:absolute;
  top:calc(100% + 4px);
  left:0;right:0;
  z-index:100;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
  padding:4px 0;
  max-height:200px;
  overflow-y:auto;
}
.custom-select-dropdown.hidden{display:none}
.custom-select-option{
  display:block;
  width:100%;
  padding:10px 14px;
  border:none;
  background:none;
  text-align:left;
  font-size:.9rem;
  color:var(--color-text);
  cursor:pointer;
  transition:background .1s;
}
.custom-select-option:hover{background:var(--color-surface-2)}
.custom-select-option.is-selected{font-weight:700}

/* Disabled states (buttons) */
.btn:disabled,
.icon-btn:disabled{
  opacity:.55;
  cursor:not-allowed;
  pointer-events:none;
  transform:none;
}

/* ================= Remove number spinners ================= */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button{
  -webkit-appearance:none;
  appearance:none;
  margin:0;
}
input[type=number]{ -moz-appearance:textfield; appearance:textfield; }

/* ================= Chips ================= */
.chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:32px;
  padding:0 12px;
  border-radius:999px;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
  color:var(--color-text);
  font-weight:700;
  font-size:13px;
}
.chip-plus{
  cursor:pointer;
  background:var(--primary-14);
  border-color:var(--primary-25);
}
.chip-plus i{font-size:12px}
.chip-remove{
  border:none;
  background:transparent;
  width:18px;
  height:18px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--color-text-muted);
  cursor:pointer;
  padding:0;
}
.chip-remove i{font-size:10px}
.chip-remove:hover{
  color:var(--color-text);
  background:var(--color-surface-2);
}

/* ================= Inline modal (категории внутри модалки) ================= */
.inline-backdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.25);
  z-index:2000;
}
.inline-modal{
  position:fixed;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(420px, calc(100vw - 32px));
  max-height:min(70vh, 520px);
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:16px;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
  z-index:2001;
}

/* ================= Options ================= */
.options-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.options-row{
  display:grid;
  grid-template-columns:1.5fr 1fr .8fr .7fr .7fr;
  gap:10px;
  align-items:center;
  padding:12px 14px;
  border-radius:12px;
  background:#fff;
  border:1px solid var(--color-border);
  cursor:pointer;
  transition:box-shadow .2s ease,border-color .2s ease;
}
.options-row.is-active{
  border-color:var(--primary-25);
  box-shadow:0 6px 20px rgba(249,115,22,.12);
}
.options-row-title{font-weight:600;}
.options-row-meta{font-size:12px;color:#6b7280;}
.auto-add-row{grid-template-columns:1.6fr .7fr .7fr .9fr 1.4fr;}
.auto-add-actions{display:flex;gap:6px;justify-content:flex-end;align-items:center;flex-wrap:wrap;}
.auto-add-items{display:flex;flex-direction:column;gap:8px;margin:8px 0 16px;}
.option-item-row.auto-add-item-card{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.auto-add-item-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.auto-add-item-title{
  min-width:0;
  flex:1;
}
.auto-add-item-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}
.auto-add-item-selected{
  font-size:12px;
  color:#6b7280;
}
.auto-add-item-row{
  margin-top:4px;
}
.auto-add-empty{padding:8px 12px;color:#6b7280;font-size:12px;}
.auto-add-pick-row{grid-template-columns:1fr;}
.auto-add-search-results .options-row{cursor:pointer;}
.auto-add-search-results{margin-top:8px;}
.option-group-section{
  background:var(--color-surface-2);
  border-radius:14px;
  padding:14px;
  border:1px solid var(--color-border);
}

#unitLevelGroup{
  padding:12px;
  display:grid;
  gap:12px;
}
.option-group-row{
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 12px;
  align-items: start;
}
.option-group-title-field{ min-width: 0; }
.option-group-select-field{ width: 220px; }

#optionGroupLimitsRow{
  grid-column: 1 / -1;
}

.option-group-title-field .control{
  min-width:0;
  text-overflow:ellipsis;
  overflow:hidden;
  white-space:nowrap;
}

.options-row-active .switch-text{
  font-size:12px;
}
.option-group-section+.option-group-section{margin-top:16px;}
.section-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:10px;
}
.section-title{font-weight:600;font-size:14px;}
.option-items-table,.option-assignments-table{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.option-item-row,.option-assignment-row{
  gap:10px;
  align-items:center;
  padding:10px;
  padding-right:36px;
  border-radius:10px;
  background:#fff;
  border:1px solid var(--color-border);
  min-width:0;
  position:relative;
  overflow:hidden;
}
.option-item-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto auto;
}
.variant-item-row{
  grid-template-columns:auto minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  width:100%;
}
.variant-item-row .option-item-col{
  min-width:0;
}
.option-assignment-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-width:0;
}
.option-item-title{
  min-width:0;
}
.option-item-title .options-row-title{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.option-assignment-title{
  flex:1;
  min-width:0;
}
.option-assignment-title .options-row-title{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.option-item-qty{
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
  min-width:0;
}
.option-item-qty-field{
  position:relative;
  display:flex;
  align-items:center;
  gap:4px;
  font-size:11px;
  color:#6b7280;
  white-space:nowrap;
  padding-top:6px;
}
.option-item-qty-label{
  text-transform:lowercase;
  position:absolute;
  top:-6px;
  left:6px;
  padding:0 4px;
  background:#fff;
  font-size:10px;
  color:#9ca3af;
}
.option-item-price{
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
  min-width:0;
  justify-content:flex-end;
  white-space:nowrap;
  justify-self:end;
}
.option-item-price-value{
  display:inline-block;
  max-width:120px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:right;
  font-size:12px;
}
.option-item-price-value.is-accent{
  font-weight:600;
  color:#111827;
  font-size:14px;
}
.option-item-price-value.is-muted{
  color:#9ca3af;
  font-size:12px;
}
.option-item-row .control,.option-assignment-row .control{width:100%;}
.option-item-qty .control{
  width:54px;
  padding:4px 6px;
}
.option-item-price .control{
  width:90px;
}
.option-item-row .muted{font-size:12px;}
.option-item-row.is-disabled{opacity:.5;}
.option-assignment-row.is-disabled{opacity:.5;}
.option-section-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.option-actions{
  display:flex;
  align-items:center;
  gap:12px;
}

/* Ingredients section */
.product-ingredients-card{
  margin-top: 20px;
}

.product-ingredients-card .option-section-header{
  margin-bottom: 12px;
}
.ingredient-acc-trigger{
  display:flex;
  align-items:center;
  gap:12px;
}
.ingredient-acc-photo{
  flex-shrink:0;
  width:48px;
  height:48px;
  border-radius:8px;
  overflow:hidden;
  background:var(--color-surface-2);
  display:flex;
  align-items:center;
  justify-content:center;
}
.ingredient-acc-photo img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.ingredient-acc-trigger .stage-meta{
  flex:1;
  min-width:0;
}
.ingredient-acc-controls{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;
  white-space:nowrap;
}
.ingredient-acc-controls .switch{margin:0}
.ingredient-fields-row{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}
.ingredient-fields-compact{
  padding:8px 0;
}
.ingredient-inline-row{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:2px;
}
.ingredient-field{
  display:flex;
  align-items:center;
  flex:1 1 0;
  min-width:0;
}
.ingredient-control-wrap{
  position:relative;
  width:100%;
  min-width:0;
}
.ingredient-control-label{
  position:absolute;
  top:-7px;
  left:8px;
  padding:0 4px;
  font-size:10px;
  color:#6b7280;
  background:var(--color-surface);
  line-height:1;
  pointer-events:none;
}
.ingredient-field-qty,
.ingredient-field-unit,
.ingredient-field-price,
.ingredient-field-cost,
.ingredient-field-min,
.ingredient-field-max,
.ingredient-field-step{
  flex:1 1 0;
  min-width:0;
}
.ingredient-control-wrap .control{
  width:100%;
  padding:6px 8px;
}
.ingredient-remove-btn{
  border:none;
  background:transparent;
  box-shadow:none;
  padding:4px;
  line-height:1;
  cursor:pointer;
}
.ingredient-remove-btn:hover{
  background:var(--color-surface-2);
}

.units-card .units-form{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap:8px;
  align-items:center;
}
.unit-row{
  display:grid;
  grid-template-columns: 2fr 1fr 1fr 0.7fr auto auto auto;
  gap:8px;
  align-items:center;
  padding:8px 10px;
  border:1px solid var(--color-border);
  border-radius:10px;
  background:var(--color-surface);
  margin-bottom:8px;
}
.unit-input{
  min-width:0;
}
.unit-delete{
  border:none;
  background:transparent;
  box-shadow:none;
}
.conversion-row{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr auto auto;
  gap:8px;
  align-items:center;
  padding:8px 10px;
  border:1px solid var(--color-border);
  border-radius:10px;
  background:var(--color-surface);
  margin-bottom:8px;
}

.input-with-suffix{
  display:flex;
  align-items:center;
  gap:8px;
}
.input-with-suffix .control{
  flex:1 1 auto;
}
.input-suffix{
  white-space:nowrap;
  color:#6b7280;
  font-size:12px;
}
.option-row-remove{
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  border:none;
  background:transparent;
  color:#9ca3af;
  padding:4px;
  cursor:pointer;
}
.option-row-remove:hover{
  color:#ef4444;
}
.option-row-remove:focus-visible{
  outline:2px solid var(--primary-25);
  outline-offset:2px;
}
.btn-ghost{
  border:none;
  background:transparent;
  box-shadow:none;
}
.option-item-row .control.is-invalid{
  border-color:#fca5a5;
}
.option-assignment-row .control.is-invalid{
  border-color:#fca5a5;
}
.app-toast{
  position:fixed;
  right:20px;
  bottom:20px;
  background:#111827;
  color:#fff;
  padding:10px 14px;
  border-radius:10px;
  box-shadow:0 10px 24px rgba(15,23,42,.24);
  font-size:13px;
  z-index:3000;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .2s ease, transform .2s ease;
  pointer-events:none;
}
.app-toast.is-visible{
  opacity:1;
  transform:translateY(0);
}
.app-toast.is-error{
  background:#ef4444;
}
.option-picker-tabs{
  display:flex;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  flex-wrap:nowrap;
  padding-bottom:8px;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.option-picker-tabs::-webkit-scrollbar{
  height:0;
  display:none;
}
.option-picker-tabs.is-dragging{
  cursor:grabbing;
}
.option-picker-tab{
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:#fff;
  font-size:12px;
  cursor:pointer;
  white-space:nowrap;
}
.option-picker-tab.is-active{
  background:var(--primary-12);
  border-color:var(--primary-25);
  color:var(--color-primary);
}
.option-picker-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
}
.option-picker-row{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  padding:10px;
  border-radius:10px;
  border:1px solid var(--color-border);
  background:#fff;
  cursor:pointer;
  user-select:none;
  min-width:0;
}
.option-picker-photo{
  flex-shrink:0;
  width:40px;
  height:40px;
  border-radius:6px;
  overflow:hidden;
  background:var(--color-surface-2);
  display:flex;
  align-items:center;
  justify-content:center;
}
.option-picker-photo img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.option-picker-row.is-selected{
  border-color:var(--primary-25);
  background:var(--primary-12);
}
.option-picker-product-card{
  border:1px solid color-mix(in srgb, var(--color-border), transparent 8%);
  border-radius:14px;
  padding:0 12px;
  background:var(--color-surface);
}
.option-picker-product-card.is-selected{
  border-color:color-mix(in srgb, var(--color-primary), #fff 64%);
  box-shadow:0 0 0 1px color-mix(in srgb, var(--color-primary), #fff 78%);
}
.option-picker-product-header{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:38px;
  padding:8px 0;
  margin:0;
  cursor:pointer;
}
.option-picker-product-header .new-order-option-sheet-item-main{
  flex:1 1 auto;
}
.option-picker-product-card .new-order-opt-gear.is-open{
  border-color:var(--color-primary);
  color:var(--color-primary);
  background:var(--primary-12);
}
.option-picker-product-checkbox{
  flex:0 0 auto;
  width:16px;
  height:16px;
  margin:0;
  accent-color:var(--color-primary);
}
.option-picker-product-variants{
  padding:0 0 10px;
}
.option-picker-product-variant-group + .option-picker-product-variant-group{
  margin-top:6px;
}
.option-picker-product-variant-title{
  margin-left:68px;
  margin-bottom:2px;
  font-size:12px;
  color:var(--color-text-muted);
}
.option-picker-product-card .new-order-opt-variants-row{
  margin-top:0;
  margin-left:68px;
}
.option-picker-product-variants-loading{
  margin-left:68px;
  padding:6px 0 2px;
  font-size:12px;
  color:var(--color-text-muted);
}
.option-picker-product-ingredients{
  padding:0 0 10px;
}
.option-picker-product-ingredient-title{
  margin:2px 0 6px 68px;
  font-size:12px;
  color:var(--color-text-muted);
}
.option-picker-product-ingredient-row{
  margin-left:68px;
  padding:2px 0;
}
.option-picker-product-ingredient-row .combo-block-ingredient-name{
  font-size:13px;
}
.option-picker-product-ingredient-row .combo-block-ingredient-meta{
  display:block;
  margin-top:2px;
  font-size:11px;
  line-height:1.35;
  color:var(--color-text-muted);
}
.option-picker-product-ingredient-row .combo-block-ingredient-btn[disabled]{
  opacity:.45;
  cursor:default;
  pointer-events:none;
}
.option-picker-title{
  flex:1;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.option-picker-price{
  flex:0 0 auto;
  margin-left:auto;
  text-align:right;
  white-space:nowrap;
  font-size:12px;
  color:#6b7280;
}
.option-picker-controls{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:10px;
  min-width:0;
}
.option-picker-search{
  flex:1;
  min-width:0;
}
.option-picker-select-all{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  color:#374151;
  white-space:nowrap;
}
.option-picker-select-all input{
  margin:0;
}
.option-picker-config-mode{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  flex:1 1 auto;
}
.option-picker-config-mode-btn{
  border:1px solid var(--color-border);
  background:#fff;
  color:#344054;
  border-radius:999px;
  padding:8px 12px;
  font:inherit;
  line-height:1;
  cursor:pointer;
  transition:border-color .18s ease, background-color .18s ease, color .18s ease;
}
.option-picker-config-mode-btn.is-active{
  border-color:var(--color-primary);
  background:rgba(255,122,26,.12);
  color:var(--color-primary);
}
.option-picker-panel{
  overflow-x:hidden;
}
.inline-modal-footer{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:12px 16px;
  border-top:1px solid var(--color-border);
}
.option-group-meta{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.option-picker-checkbox{
  position:absolute;
  opacity:0;
  pointer-events:none;
  width:1px;
  height:1px;
}
.option-summary-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.option-summary-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:8px 10px;
  border-radius:10px;
  border:1px solid var(--color-border);
  background:#fff;
}
.option-summary-title{font-weight:600;}
.option-summary-meta{font-size:12px;color:#6b7280;}
.option-summary-price{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  font-size:12px;
  gap:4px;
}
.option-summary-price-wrap{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:auto;
}
.option-summary-row.is-removable .option-row-remove{
  position:static;
  right:auto;
  top:auto;
  transform:none;
  flex-shrink:0;
}
.product-header-actions{
  display:flex;
  align-items:center;
  gap:8px;
}

/* ================= Product tabs header ================= */

.product-tabs-header{
  padding:8px 12px;
  border-bottom:1px solid var(--color-border);
}

.client-mobile-sheet-close{
  display:none;
  flex:0 0 auto;
}

#clientMobileSheetCloseBtn{
  display:none !important;
}

.product-tabs-header-inner{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.chat-mobile-right-back{
  display:none;
}

body.page-chat #chatRightTabsHeader .chat-mobile-right-back{
  display:none !important;
}

.product-tabs-home{
  width:32px;
  height:32px;
  flex:0 0 32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  cursor:pointer;
}

.product-tabs-home:hover{
  color:var(--color-text);
  border-color:var(--color-primary);
}

.product-tabs{
  display:flex;
  align-items:center;
  gap:8px;
  overflow-x:auto;
  padding-bottom:2px;
  min-width:0;
  flex:1 1 auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.product-tabs::-webkit-scrollbar{
  display:none;
}

.product-tab{
  width:100px;
  flex:0 0 100px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  padding:6px 8px;
  border-radius:10px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  cursor:pointer;
  user-select:none;
}

.product-tab.is-active{
  background:var(--primary-14);
  border-color:var(--primary-25);
}

.product-tab-title{
  font-size:12px;
  font-weight:600;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  flex:1 1 auto;
}

.product-tab-close{
  border:none;
  background:transparent;
  color:var(--color-text-muted);
  width:16px;
  height:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
}

.product-tab-close:hover{
  color:var(--color-text);
}

/* ================= Product info title ================= */

.product-info-title{
  margin-bottom:12px;
}

.product-title-text{
  font-weight:800;
  font-size:16px;
  line-height:1.2;
}

.product-title-sku{
  font-size:12px;
}
.info-accordion .stage-item{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
}
.info-accordion .stage-item .stage-meta{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.info-accordion .acc-panel-inner{margin-top:10px;}

/* Option accordion in product editor - title + description left, actions right */
#peOptionAccordion .stage-item.acc-trigger {
  justify-content: space-between;
  flex-wrap: nowrap;
  cursor: pointer;
  align-items: center;
  gap: 12px;
}

#peOptionAccordion .stage-item.acc-trigger .stage-meta {
  flex: 1;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

#peOptionAccordion .stage-item.acc-trigger .stage-meta b {
  display: block;
  font-weight: 600;
}

#peOptionAccordion .stage-item.acc-trigger .stage-meta small {
  display: block;
  margin-left: 0;
  font-weight: normal;
}

#peOptionAccordion .stage-item.acc-trigger .option-actions-inline {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  flex-grow: 0;
  margin-left: auto;
}

#peOptionAccordion .stage-item.acc-trigger .option-actions-inline button.btn {
  border: none;
  background: transparent;
  box-shadow: none;
  outline: none;
}

#peVariantAccordion .stage-item.acc-trigger .option-actions-inline button.btn,
#peVariantManageBtn,
#peOptionManageBtn {
  border: none;
  box-shadow: none;
  outline: none;
}

#peOptionAccordion .stage-item.acc-trigger .option-actions-inline button.btn:hover {
  background: var(--color-surface-2);
  border: none;
  box-shadow: none;
}

#peVariantAccordion .stage-item.acc-trigger .option-actions-inline button.btn:hover,
#peVariantManageBtn:hover,
#peOptionManageBtn:hover {
  border: none;
  box-shadow: none;
}

#peOptionAccordion .stage-item.acc-trigger .option-actions-inline button.btn:focus {
  border: none;
  box-shadow: none;
  outline: none;
}

#peVariantAccordion .stage-item.acc-trigger .option-actions-inline button.btn:focus,
#peVariantManageBtn:focus,
#peOptionManageBtn:focus {
  border: none;
  box-shadow: none;
  outline: none;
}

#peOptionAccordion .stage-item.acc-trigger .option-actions-inline .acc-chevron {
  flex-shrink: 0;
  pointer-events: none;
}

.inline-modal-header{
  padding:10px 12px;
  border-bottom:1px solid var(--color-border);
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.inline-modal-title{font-weight:900}
.inline-modal-body{padding:12px;padding-bottom:200px;overflow:auto}

.picker-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid var(--color-border);
  border-radius:12px;
  background:var(--color-surface);
  margin-bottom:10px;
  min-height:64px;
}
.picker-row.is-selected{
  background:var(--primary-14);
  border-color:var(--primary-25);
}
.picker-title{font-weight:900}

/* ================= Switch (Apple, ровный) ================= */
.switch{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  line-height:1;
  vertical-align:middle;
  min-height:var(--switch-h);
}

.switch-input{
  position:absolute;
  opacity:0;
  width:1px;
  height:1px;
  pointer-events:none;
}

.switch-ui{
  width:var(--switch-w);
  height:var(--switch-h);
  border-radius:12px;
  background:var(--switch-off-bg);
  border:1px solid var(--switch-off-border);
  box-sizing:border-box;
  display:inline-block;
  position:relative;
  flex:0 0 auto;
  cursor:pointer;
  transition:
    background var(--dur-fast) var(--ease-smooth),
    border-color var(--dur-fast) var(--ease-smooth);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.05);
}

.switch-ui::after{
  content:"";
  position:absolute;
  top:var(--switch-pad);
  left:var(--switch-pad);
  width:calc(var(--switch-h) - (var(--switch-pad) * 2) - 2px);
  height:calc(var(--switch-h) - (var(--switch-pad) * 2) - 2px);
  border-radius:10px;
  background:var(--switch-knob);
  box-shadow: 0 1px 3px rgba(0,0,0,0.2);
  transform:translateX(0);
  transition:transform var(--dur-fast) var(--ease-smooth);
  will-change:transform;
  box-sizing:border-box;
}

.switch-input:checked + .switch-ui{
  background:var(--switch-on);
  border-color:transparent;
}
.switch-input:checked + .switch-ui::after{
  transform:translateX(calc(var(--switch-w) - var(--switch-h) + 2px));
}

.switch-input:focus-visible + .switch-ui{
  box-shadow:0 0 0 3px var(--primary-12);
}

.switch-input:disabled + .switch-ui{
  opacity:.55;
  cursor:not-allowed;
}

.switch-text{color:var(--color-text);font-weight:600}

.settings-row-switches .switch{
  flex-direction:column;
  align-items:center;
  gap:6px;
}
.settings-row-switches .switch-text{
  font-size:12px;
  color:var(--color-text-muted);
  font-weight:600;
}

/* ================= Product editor header (150x150) ================= */
.product-editor-top{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:12px;
  align-items:start;
}

.product-photo-main{
  width:150px;
  height:150px;
  border-radius:16px;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
  overflow:hidden;
  position:relative;
  display:grid;
  place-items:center;
  transition:border-color 0.2s, box-shadow 0.2s;
}

.product-photo-main.drag-over{
  border-color:var(--color-primary);
  box-shadow:0 0 0 3px var(--primary-12);
  background:var(--primary-14);
}

.photo-main-wrapper{
  width:100%;
  height:100%;
  position:relative;
  display:grid;
  place-items:center;
  overflow:visible;
}

.category-icon-upload{
  display:grid;
  gap:8px;
}

.category-icon-preview{
  width:120px;
  height:120px;
}

.category-editor-layout{
  display:grid;
  grid-template-columns:160px 1fr;
  gap:16px;
  align-items:start;
}

.category-editor-photo{
  display:grid;
  gap:8px;
}

.category-editor-fields{
  display:grid;
  gap:12px;
  align-content:start;
}

.category-editor-preview{
  width:160px;
  height:160px;
  border-radius:16px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  display:grid;
  place-items:center;
  overflow:hidden;
}

.category-editor-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.category-editor-actions{
  display:grid;
  gap:8px;
}

@media (max-width:640px){
  .category-editor-layout{
    grid-template-columns:1fr;
  }
  .category-editor-preview{
    width:100%;
    max-width:200px;
  }
}

.product-photo-placeholder{
  color:var(--color-text-muted);
  font-size:12px;
  text-align:center;
  padding:10px;
}

/* В этом месте (под 150x150) миниатюры поменьше */
.product-photo-thumbs-wrapper{
  margin-top:8px;
  display:flex;
  align-items:center;
  gap:4px;
}
.product-photo-thumbs{
  flex:1;
  display:flex;
  flex-wrap:nowrap;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
}
.product-photo-thumbs::-webkit-scrollbar{
  height:4px;
}
.product-photo-thumbs::-webkit-scrollbar-track{
  background:transparent;
}
.product-photo-thumbs::-webkit-scrollbar-thumb{
  background:var(--color-border);
  border-radius:2px;
}

/* JS рисует .img-thumb — делаем их 40x40 только в этом контейнере */
.img-thumb-wrapper{
  position:relative;
  cursor:move;
}

.img-thumb-wrapper.is-dragging{
  opacity:0.5;
}

.img-thumb-wrapper.drag-over{
  transform:translateY(-2px);
}

.product-photo-thumbs .img-thumb{
  flex-shrink:0;
  width:40px;
  height:40px;
  border-radius:12px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  overflow:hidden;
  position:relative;
  cursor:pointer;
  padding:0;
  transition:border-color 0.2s, box-shadow 0.2s;
}

.product-photo-thumbs .img-thumb:hover{
  border-color:var(--color-primary);
}

.product-photo-thumbs .img-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.product-photo-thumbs .img-thumb.is-active{
  border-color:var(--color-primary);
  box-shadow:0 0 0 3px var(--primary-12);
}
.product-thumbs-nav{
  flex-shrink:0;
  width:24px;
  height:24px;
  border-radius:50%;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
  color:var(--color-text);
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:10px;
  transition:background 0.2s, border-color 0.2s, color 0.2s;
}
.product-thumbs-nav:hover{
  background:var(--color-primary);
  border-color:var(--color-primary);
  color:white;
}
.product-thumbs-nav:disabled{
  opacity:0.4;
  cursor:not-allowed;
}

.img-del{
  position:absolute;
  top:2px;
  right:2px;
  width:18px;
  height:18px;
  border-radius:50%;
  background:rgba(220,53,69,0.9);
  color:white;
  display:grid;
  place-items:center;
  font-size:10px;
  cursor:pointer;
  opacity:0;
  transition:opacity 0.2s;
  z-index:2;
}

.img-thumb:hover .img-del{
  opacity:1;
}

.img-del:hover{
  background:rgba(220,53,69,1);
}

.img-drag-handle{
  position:absolute;
  bottom:2px;
  left:2px;
  width:18px;
  height:18px;
  border-radius:4px;
  background:rgba(0,0,0,0.6);
  color:white;
  display:grid;
  place-items:center;
  font-size:10px;
  cursor:grab;
  opacity:0;
  transition:opacity 0.2s;
  z-index:2;
}

.img-thumb:hover .img-drag-handle{
  opacity:1;
}

.img-drag-handle:active{
  cursor:grabbing;
}

/* верхние кнопки фото */
.product-photo-tools{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:8px;
}

.product-editor-view .product-photo-tools,
.product-editor-view .chip-remove,
.product-editor-view .chip-plus,
.product-editor-view .img-del,
.product-editor-view .img-drag-handle,
.product-editor-view .option-actions,
.product-editor-view .option-actions-inline button,
.product-editor-view .ingredient-acc-controls .ingredient-variable-switch,
.product-editor-view .ingredient-acc-controls .ingredient-remove-btn{
  display:none !important;
}

.product-editor-view .img-thumb-wrapper{
  cursor:default;
}

/* правая часть в топе */
.product-editor-meta{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}

/* Product editor blocks in right column must span full available width */
#productEditorForm #peVariantBlock,
#productEditorForm #peOptionBlock,
#productEditorForm #peIngredientBlock,
#productEditorForm #pePromotionsBlock{
  width:calc(100% + 24px);
  min-width:0;
  grid-column:1 / -1;
  margin-left:-12px;
  margin-right:-12px;
}

/* Для img main используем существующий класс, но в этом месте он должен быть 150x150 */
.product-photo-main .img-main{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.img-main.hidden{display:none}

/* Стрелки навигации фото */
.photo-nav-btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:32px;
  height:32px;
  border-radius:999px;
  background:rgba(0,0,0,0.5);
  color:#fff;
  border:0;
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:14px;
  opacity:1;
  box-shadow:none;
  transition:background .2s;
  z-index:3;
}

.photo-nav-btn:hover{
  background:rgba(0,0,0,0.7);
}

.photo-nav-prev{
  left:8px;
}

.photo-nav-next{
  right:8px;
}

.photo-nav-btn.hidden{
  display:none;
}

/* Product editor: force one consistent arrow style (avoid overrides from other bundles) */
#pePhotoMainContainer .photo-nav-btn,
#pePhotoPrev,
#pePhotoNext{
  position:absolute;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:32px;
  height:32px;
  border-radius:999px;
  background:rgba(17,24,39,.62) !important;
  color:#fff;
  border:0;
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:14px;
  line-height:1 !important;
  font-family:inherit !important;
  opacity:1;
  box-shadow:none;
  transition:none;
  z-index:3;
}

#pePhotoMainContainer .photo-nav-btn:hover,
#pePhotoPrev:hover,
#pePhotoNext:hover{
  background:rgba(17,24,39,.78) !important;
}

#pePhotoPrev{ left:8px; }
#pePhotoNext{ right:8px; }

#pePhotoMainContainer .photo-nav-btn i,
#pePhotoPrev i,
#pePhotoNext i{
  display:block;
  line-height:1 !important;
  margin:0 !important;
  transform:none !important;
}

/* Product editor: fixed 1:1 frame + show full image (no crop) */
#pePhotoMainContainer{
  width:150px !important;
  height:150px !important;
  overflow:hidden;
  background:var(--color-surface-2);
}

#pePhotoMainContainer .photo-main-wrapper{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  overflow:hidden;
}

#pePhotoMain{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:var(--color-surface-2);
}

/* Точки-индикаторы */
.photo-dots{
  position:absolute;
  bottom:8px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:6px;
  z-index:3;
}

.photo-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:rgba(255,255,255,0.5);
  cursor:pointer;
  transition:background 0.2s, transform 0.2s;
}

.photo-dot:hover{
  background:rgba(255,255,255,0.8);
  transform:scale(1.2);
}

.photo-dot.is-active{
  background:white;
  transform:scale(1.3);
}

.photo-dots.hidden{
  display:none;
}

/* мобилка: в колонку */
@media (max-width:520px){
  .product-editor-top{
    grid-template-columns:1fr;
  }
}
/* ================= Fix: product photo in list ================= */
/* Фото в списке товаров всегда маленькое (как аватар), не влияет на высоту строки */
.product-thumb{
  width:44px;
  height:44px;
  border-radius:14px;
  object-fit:cover;
  display:block;
  background:var(--primary-14);
  border:1px solid var(--primary-25);
}

/* Блок комбо: строка товара с фото, шеврон слева, звезда и крестик справа */
.combo-block-product-row-wrapper{
  display:flex;
  flex-direction:column;
  gap:0;
}
.combo-block-product-row-wrapper:has(.combo-block-product-details:not([hidden])) .option-item-row.combo-block-product-row{
  border-radius:10px 10px 0 0;
}
.option-item-row.combo-block-product-row{
  position:relative;
  grid-template-columns:auto auto minmax(0, 1fr) auto auto auto;
  padding-right:36px;
}
#comboBlockProductsList.is-view-mode .option-item-row.combo-block-product-row{
  grid-template-columns:auto auto minmax(0, 1fr) auto;
  padding-right:10px;
}
.combo-block-product-chevron{
  border:none;
  background:transparent;
  color:#9ca3af;
  padding:4px 6px;
  cursor:pointer;
  align-self:center;
}
.combo-block-product-chevron:hover{
  color:var(--primary);
}
.combo-block-product-chevron i{
  display:block;
  transition:transform 0.2s;
}
.combo-block-product-price{
  margin-left:auto;
  font-weight:600;
  color:var(--primary, #e85d04);
  white-space:nowrap;
}
.combo-block-product-star{
  margin-left:8px;
}
.option-item-row.combo-block-product-row .option-row-remove{
  right:8px;
}
.combo-block-product-thumb{
  width:44px;
  height:44px;
  border-radius:10px;
  object-fit:cover;
  display:block;
  background:var(--color-border);
  border:1px solid var(--color-border);
}
.combo-block-product-thumb-placeholder{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#9ca3af;
  font-size:18px;
}
.option-item-actions .fa-star.is-default{
  color:var(--primary);
}
/* Область списка товаров в блоке комбо: скролл и отступ снизу, чтобы раскрытый контент не уходил под футер */
.combo-block-products-panel-inner{
  max-height:min(55vh, 480px);
  overflow-y:auto;
  padding-bottom:80px;
  /* общий контейнер со скроллом, но без видимого скроллбара */
  scrollbar-width:none; /* Firefox */
}
.combo-block-products-panel-inner::-webkit-scrollbar{
  display:none; /* WebKit */
}
/* Внутри блока комбо убираем "рамку" вокруг товаров — остаётся общий контейнер */
.combo-block-products-panel-inner .option-item-row.combo-block-product-row{
  background:transparent;
  border:none;
}
.combo-block-product-details{
  padding:8px 10px 10px 36px;
  background:var(--color-bg);
  border:1px solid var(--color-border);
  border-top:none;
  border-radius:0 0 10px 10px;
  font-size:13px;
}
.combo-block-product-detail{
  padding:2px 0;
}
.combo-block-product-detail .muted{
  margin-right:6px;
}
.combo-block-detail-section{
  margin-bottom:10px;
}
.combo-block-detail-section:last-child{
  margin-bottom:0;
}
.combo-block-detail-label{
  font-weight:600;
  margin-bottom:6px;
  font-size:13px;
}
.combo-block-detail-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.combo-block-detail-chip{
  display:inline-block;
  padding:6px 12px;
  border-radius:10px;
  border:1px solid var(--color-border);
  background:var(--color-bg);
  font-size:13px;
  color:var(--color-text);
  cursor:pointer;
  transition:border-color .15s, background .15s;
}
.combo-block-detail-chip:hover{
  border-color:var(--primary, #e85d04);
}
.combo-block-detail-chip.is-selected{
  border-color:var(--primary, #e85d04);
  background:rgba(232,93,4,.08);
  color:var(--primary, #e85d04);
}
.combo-block-detail-ingredients{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.combo-block-detail-ingredient-row{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  color:var(--color-text);
  padding:6px 0;
}
.combo-block-ingredient-thumb{
  width:40px;
  height:40px;
  border-radius:8px;
  object-fit:cover;
  background:var(--color-border);
  flex-shrink:0;
}
.combo-block-ingredient-thumb-placeholder{
  width:40px;
  height:40px;
  border-radius:8px;
  background:var(--color-border);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#9ca3af;
  font-size:16px;
}
.combo-block-ingredient-name{
  flex:1;
  min-width:0;
}
.combo-block-ingredient-qty-wrap{
  display:flex;
  align-items:center;
  gap:6px;
}
.combo-block-ingredient-btn{
  width:28px;
  height:28px;
  border-radius:8px;
  border:1px solid var(--color-border);
  background:var(--color-bg);
  font-size:16px;
  line-height:1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--color-text);
}
.combo-block-ingredient-btn:hover{
  border-color:var(--primary);
  color:var(--primary);
}
.combo-block-ingredient-qty{
  min-width:3em;
  text-align:center;
}

/* на всякий случай: если где-то попадёт img в row без класса */
.order-row img{
  max-width:100%;
  height:auto;
}
/* ================= Header: logo near burger ================= */
.header-left{
  display:flex;
  align-items:center;
  gap:12px;
}

/* ================= Product info header (title + sku + actions) ================= */
.product-info-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.product-info-header-left{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.product-header-title{
  max-width:300px;           /* как ты просил */
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.product-header-sku{
  font-size:12px;
  line-height:1.2;
}

.product-info-header-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
}

/* ================= Product info body: photo left, card right ================= */
.product-info-top{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:12px;
  align-items:start;
}

.product-info-photoCol{
  display:flex;
  flex-direction:column;
}

/* если у тебя эти классы уже есть — этот блок просто “перебьёт” */
.product-photo-main{
  width:150px;
  height:150px;
  border-radius:16px;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
  overflow:hidden;
  position:relative;
  display:grid;
  place-items:center;
}

.product-photo-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.product-photo-placeholder{
  color:var(--color-text-muted);
  font-size:12px;
  text-align:center;
  padding:10px;
}

/* Сетка 4 фото из первых блоков комбо (когда своих фото нет) */
.combo-set-photo-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:6px;
  width:100%;
  max-width:200px;
  aspect-ratio:1;
  margin:0 auto 8px;
}
.combo-set-photo-grid-cell{
  border-radius:8px;
  overflow:hidden;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
}
.combo-set-photo-grid-cell img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.combo-set-photo-grid-cell-empty{
  min-height:0;
}
.combo-set-photo-grid-hint{
  display:block;
  color:var(--color-text-muted);
  font-size:12px;
  text-align:center;
}

.product-photo-thumbs-wrapper{
  margin-top:8px;
  display:flex;
  align-items:center;
  gap:4px;
}
.product-photo-thumbs{
  flex:1;
  display:flex;
  flex-wrap:nowrap;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
}
.product-photo-thumbs::-webkit-scrollbar{
  height:4px;
}
.product-photo-thumbs::-webkit-scrollbar-track{
  background:transparent;
}
.product-photo-thumbs::-webkit-scrollbar-thumb{
  background:var(--color-border);
  border-radius:2px;
}

/* поддержка двух вариантов миниатюр (если JS рисует img-thumb или product-photo-thumb) */
#infoPhotoThumbs .img-thumb,
#infoPhotoThumbs .product-photo-thumb{
  width:40px;
  height:40px;
  border-radius:12px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  overflow:hidden;
  cursor:pointer;
  flex:0 0 auto;
}
#infoPhotoThumbs .img-thumb img,
#infoPhotoThumbs .product-photo-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

@media (max-width:520px){
  .product-info-top{ grid-template-columns:1fr; }
}
/* ================= Fix: Center column main panel should stretch and scroll ================= */
/* center-stack содержит 2 панели: toolbar + контент. Контентная панель должна занимать остаток высоты. */
.center-stack{
  flex: 1;
  min-height: 0;
}

.center-stack > .panel{
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* верхняя панель (toolbar) — по контенту */
.center-stack > .panel:first-child{
  flex: 0 0 auto;
}

/* нижняя панель (основной контент) — заполняет всё оставшееся */
.center-stack > .panel:last-child{
  flex: 1 1 auto;
  min-height: 0;
}

/* panel-body внутри нижней панели — скроллится */
.center-stack > .panel:last-child > .panel-body{
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}

/* ================= Fix: Hide product info header when nothing selected ================= */
/* Работает автоматически через :has() (Chrome/Edge/Safari). */
#productInfoPanel:has(#productEmpty:not(.hidden)) .product-info-header,
#productInfoPanel:has(#categoryEmpty:not(.hidden)) .product-info-header,
#productInfoPanel:has(#optionEmpty:not(.hidden)) .product-info-header{
  display: none !important;
}
#productInfoPanel:has(#productInfo:not(.hidden)) .product-info-header,
#productInfoPanel:has(#categoryInfo:not(.hidden)) .product-info-header,
#productInfoPanel:has(#optionGroupInfo:not(.hidden)) .product-info-header{
  display: flex !important;
}

/* подсказки (используется в админке и витрине) */
.empty-hint{
  margin-top:10px;
  padding:12px;
  border:1px dashed var(--color-border);
  border-radius:12px;
  background:var(--color-surface);
  color:var(--color-text-muted);
  text-align:center;
  font-weight:600;
}

/* Picker overlay - перекрывает header */
.picker-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--color-surface);
  z-index: 10;
  display: flex;
  flex-direction: column;
}

.picker-overlay-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.picker-overlay-header {
  padding: 16px;
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface);
  flex-shrink: 0;
}

.picker-overlay-header .panel-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--color-text);
}

.picker-overlay-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  padding-bottom: 200px;
}

/* Footer закреплен внизу */
#productInfoPanel {
  display: flex;
  flex-direction: column;
  min-height: 0;
  position: relative; /* Для позиционирования .picker-overlay внутри панели */
}

#productInfoPanel .panel-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}

/* Когда открыт комбо — контент с самого верха, без пустого поля сверху */
#productInfoPanel:has(#comboSetInfo:not(.hidden)) .panel-body {
  padding-top: 0;
}

/* Для редактора товара сохраняем такой же верхний отступ, как в режиме просмотра */
#productInfoPanel:has(.product-editor-wrapper) .panel-body {
  padding-top: 12px;
}
#productInfoPanel:has(#comboSetInfo:not(.hidden)) {
  background: #fff;
}
#productInfoPanel:has(#comboSetInfo:not(.hidden)) .panel-body {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  background: #fff;
  padding: 6px;
}
#productInfoPanel:has(#comboSetInfo:not(.hidden)) #comboSetInfo {
  flex: 0 0 auto;
  align-self: stretch;
  margin-top: 0;
  background: #fff;
}
/* Когда открыт комбо — показываем только #comboSetInfo, остальные дети body скрыты (убирает пустое место сверху) */
#productInfoPanel:has(#comboSetInfo:not(.hidden)) #productInfoBody > *:not(#comboSetInfo) {
  display: none !important;
}

/* Просмотр товара/категории: отступы */
#productInfoPanel #productInfo:not(.hidden),
#productInfoPanel #categoryInfo:not(.hidden) {
  padding: 12px 1px;
}

/* Комбо-набор: минимальные отступы по периметру, ближе к краям */
#productInfoPanel #comboSetInfo:not(.hidden) {
  padding: 6px 4px;
}
/* Режим просмотра комбо: скрыть кнопки добавления и удаления */
#comboSetInfo.combo-set-view-mode #comboSetCategoryChipPlus,
#comboSetInfo.combo-set-view-mode .chip-remove,
#comboSetInfo.combo-set-view-mode #comboSetBlocksAddBtn,
#comboSetInfo.combo-set-view-mode [data-remove-combo-set-block],
#comboSetInfo.combo-set-view-mode #comboSetAddPhotosBtn,
#comboSetInfo.combo-set-view-mode .combo-set-photo-grid-hint {
  display: none !important;
}
#comboSetInfo.combo-set-view-mode .product-photo-main {
  pointer-events: none;
}
#productInfoPanel #comboSetInfo .combo-set-blocks-section {
  margin-top: 12px;
}
.combo-set-blocks-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}
/* Карточка заголовка секции «Блоки в наборе»: белый фон, рамка, скругления, шеврон справа по образцу */
.combo-set-blocks-header-card {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  background: #fff;
  border: 1px solid var(--color-border, #e5e7eb);
  border-radius: 10px;
  min-height: 48px;
  justify-content: center;
}
.combo-set-blocks-header-card b {
  display: block;
  font-weight: 700;
  font-size: 15px;
  color: var(--color-text, #1f2937);
  line-height: 1.3;
}
.combo-set-blocks-header-card .muted {
  display: block;
  font-size: 13px;
  font-weight: 400;
  color: var(--color-text-muted, #6b7280);
  line-height: 1.35;
  margin-top: 0;
}
/* Строка блока в наборе: карточка как на образце — белый фон, рамка, шеврон справа, крестик внутри */
#comboSetBlocksList .combo-set-block-acc-item .combo-set-block-acc-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: #fff;
  border: 1px solid var(--color-border, #e5e7eb);
  border-radius: 10px;
  margin-bottom: 0;
}
#comboSetBlocksList .combo-set-block-acc-item .acc-panel[data-acc-panel] {
  border: none;
  border-radius: 0 0 10px 10px;
  margin-top: 0;
}
#comboSetBlocksList .combo-set-block-acc-item .acc-trigger {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0;
  border: none;
  background: transparent;
  text-align: left;
  cursor: pointer;
  color: inherit;
  font: inherit;
}
#comboSetBlocksList .combo-set-block-acc-item .acc-trigger .combo-set-block-trigger-text {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
#comboSetBlocksList .combo-set-block-acc-item .acc-trigger .option-item-title {
  font-weight: 600;
  color: var(--color-text, #1f2937);
}
#comboSetBlocksList .combo-set-block-acc-item .acc-trigger .option-item-meta {
  color: var(--color-text-muted, #6b7280);
  font-size: 13px;
}
#comboSetBlocksList .combo-set-block-acc-item .acc-chevron {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  color: var(--color-text-muted, #6b7280);
  transition: transform var(--dur-fast, 0.2s) ease, background 0.15s ease;
}
#comboSetBlocksList .combo-set-block-acc-item .acc-trigger:hover .acc-chevron {
  background: var(--color-surface-2, #f3f4f6);
}
#comboSetBlocksList .combo-set-block-acc-item .acc-trigger.is-open .acc-chevron {
  transform: rotate(180deg);
}
#comboSetBlocksList .combo-set-block-acc-item .option-row-remove {
  position: static;
  flex-shrink: 0;
  margin-left: 0;
  color: var(--color-text-muted);
  transition: none;
  transform: none;
}
#comboSetBlocksList .combo-set-block-acc-item .option-row-remove:hover {
  color: #ef4444;
  transition: none;
}
#comboSetBlocksList .combo-set-block-acc-item .acc-panel-inner {
  padding: 0;
  margin: 0;
  background: #fff;
}
#comboSetBlocksList .combo-set-block-acc-item + .combo-set-block-acc-item {
  margin-top: 8px;
}
/* Список товаров — ровно друг под другом, без смещения */
#comboSetBlocksList .combo-set-block-panel-inner .combo-set-block-products-list {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  width: 100%;
  padding: 0;
  margin: 0;
}
#comboSetBlocksList .combo-set-block-panel-inner .combo-block-product-row-wrapper {
  border-radius: 10px;
  border: none;
  background: #fff;
  padding: 14px 12px;
  margin: 0 !important;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  box-shadow: none;
  flex-shrink: 0;
}
/* Фиксированная сетка — шеврон, фото, название, цена (старая/новая) ровно друг под другом */
#comboSetBlocksList .combo-set-block-panel-inner .option-item-row.combo-block-product-row {
  display: grid;
  grid-template-columns: 32px 44px minmax(0, 1fr) minmax(90px, auto);
  align-items: center;
  gap: 10px;
  padding: 0;
  min-height: 56px;
}
#comboSetBlocksList .combo-set-block-panel-inner .combo-block-product-chevron {
  width: 32px;
  min-width: 32px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
#comboSetBlocksList .combo-set-block-panel-inner .combo-block-product-thumb,
#comboSetBlocksList .combo-set-block-panel-inner .combo-block-product-thumb-placeholder {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 10px;
  object-fit: cover;
  flex-shrink: 0;
}
#comboSetBlocksList .combo-set-block-panel-inner .option-item-row.combo-block-product-row .option-item-title {
  font-size: 14px;
  line-height: 1.35;
}
#comboSetBlocksList .combo-set-block-panel-inner .combo-block-product-thumb-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-border, #e5e7eb);
  color: #9ca3af;
}
#comboSetBlocksList .combo-set-block-panel-inner .combo-set-price-cell {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: nowrap;
}
#comboSetBlocksList .combo-set-block-panel-inner .combo-set-price-old {
  text-decoration: line-through;
  color: var(--color-text-muted, #6b7280);
  font-size: 13px;
  white-space: nowrap;
}
#comboSetBlocksList .combo-set-block-panel-inner .combo-block-product-price {
  color: var(--primary, #e85d04);
  font-weight: 600;
  font-size: 14px;
  white-space: nowrap;
  text-align: right;
  justify-self: end;
}
#comboSetBlocksList .combo-set-block-panel-inner .combo-block-product-details {
  margin-top: 10px;
  margin-left: 0;
  padding: 8px 0 4px 12px;
  border-radius: 8px;
}

#productInfoFooter {
  margin-top: auto;
  flex: 0 0 auto;
}

/* Adjust footer position when in picker mode */
#productInfoPanel:has(.picker-overlay) #productInfoFooter {
  position: sticky;
  bottom: 0;
  z-index: 35;
  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
}

/* Unit conversion row styles */
.unit-conversions-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.unit-conversion-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--color-surface-2);
  border-radius: 8px;
}

.unit-conversion-from,
.unit-conversion-to {
  font-weight: 500;
  color: var(--color-text);
  min-width: 40px;
  text-align: center;
}

.unit-conversion-arrow {
  color: var(--color-text-muted);
  font-size: 14px;
}

.unit-conversion-factor {
  flex: 1;
  max-width: 120px;
}

.unit-conversion-delete {
  margin-left: auto;
  color: var(--color-text-muted);
}

.unit-conversion-delete:hover {
  color: var(--color-primary);
}

/* store hours */
.store-hours-grid {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.store-hours-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
}
.store-hours-row .store-hours-day {
  font-size: 0.95rem;
  font-weight: 600;
  color: #222;
  width: 42px;
}
.store-hours-inputs {
  display: flex;
  gap: 6px;
  align-items: center;
}
.store-hours-input {
  width: 110px;
  max-width: 110px;
  font-size: 0.9rem;
  padding: 6px 8px;
  border-radius: 6px;
  background: #fff;
  border: 1px solid #d9d9d9;
  box-sizing: border-box;
}
.store-hours-switch-control {
  margin: 0;
}
.store-hours-switch-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin-left: auto;
}
.store-hours-switch-wrap .switch {
  margin: 0;
}
.store-hours-switch-text {
  font-size: 0.8rem;
  color: #555;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
@media (max-width: 640px) {
  .store-hours-row {
    flex-direction: row;
  }
  .store-hours-switch-control {
    margin-left: 0;
  }
}
.store-hours-row--global {
  gap: 12px;
}

.store-hours-row--global .store-hours-day {
  width: auto;
  font-size: 1rem;
  font-weight: 600;
  min-width: 90px;
}

.store-hours-row--global .store-hours-inputs {
  flex: 1;
}

/* ================= Global Telegram Notifications ================= */

.settings-section {
  margin-bottom: 20px;
}
.settings-section-title {
  font-weight: 700;
  margin-bottom: 8px;
}
.settings-divider {
  border: none;
  border-top: 1px solid var(--color-border);
  margin: 20px 0;
}

/* Global Telegram Bindings - Compact Design */
.global-telegram-add-toggle {
  margin-left: auto;
}
#globalTelegramBindings,
#settingsStoreTelegramList {
  margin-top: 12px;
}
.global-telegram-binding {
  padding: 10px 12px;
  margin-bottom: 8px;
  border-radius: var(--radius-md);
  background: var(--color-bg-secondary);
  border: 1px solid var(--color-border);
}
.global-telegram-binding:last-child {
  margin-bottom: 0;
}
.global-telegram-header {
  display: flex;
  align-items: center;
  gap: 12px;
}
.global-telegram-api-key {
  flex: 1;
  font-size: 14px;
  color: var(--color-text);
  font-weight: 500;
}
.global-telegram-actions {
  display: flex;
  align-items: center;
  gap: 4px;
}
.global-telegram-gear i {
  transition: transform 0.2s;
  display: inline-block;
}
.global-telegram-gear.active {
  color: var(--color-primary);
}
.global-telegram-gear.active i {
  transform: rotate(90deg);
}
.btn-danger-text {
  color: var(--color-danger);
}
.btn-danger-text:hover {
  color: var(--color-danger);
  opacity: 0.8;
}
.global-telegram-stores {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--color-border);
}
.global-telegram-stores.hidden {
  display: none;
}
.global-telegram-stores-list {
  display: grid;
  gap: 8px;
}
.global-telegram-store-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.global-telegram-store-row .store-name {
  font-size: 14px;
}
.global-telegram-connect {
  margin-bottom: 16px;
  padding: 12px;
  background: var(--color-bg-secondary);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
}
.global-telegram-connect.hidden {
  display: none;
}
.global-telegram-connect .field-group {
  margin-bottom: 12px;
}
.global-telegram-form-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}

/* Toggle Switch */
.toggle-switch {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 24px;
  flex-shrink: 0;
}
.toggle-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.toggle-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--color-border);
  transition: 0.2s;
  border-radius: 24px;
}
.toggle-slider:before {
  position: absolute;
  content: "";
  height: 18px;
  width: 18px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  transition: 0.2s;
  border-radius: 50%;
}
.toggle-switch input:checked + .toggle-slider {
  background-color: var(--color-primary);
}
.toggle-switch input:checked + .toggle-slider:before {
  transform: translateX(20px);
}

/* ================= Admin Client Profile (shop-style) ================= */
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-top{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:16px;
  align-items:start;
  padding:12px;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-photo-wrap{display:block;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-photo{
  width:120px;
  height:120px;
  border-radius:16px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  display:grid;
  place-items:center;
  overflow:hidden;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-photo-img{
  width:100%;height:100%;object-fit:cover;display:block;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-photo-placeholder{
  font-size:12px;color:var(--color-text-muted);text-align:center;padding:8px;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-info{display:grid;gap:8px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-line{display:grid;gap:4px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-line-title{font-size:12px;color:var(--color-text-muted);}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-line-value{font-weight:800;color:var(--color-text);}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-name-value{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-name-edit{
  width:28px;height:28px;font-size:.75rem;color:var(--color-text-muted);flex-shrink:0;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-name-edit:hover{color:var(--color-primary);}

:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-tabs{
  display:flex;gap:8px;border-bottom:1px solid var(--color-border);padding:0 12px;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-tab{
  padding:10px 12px;border:0;background:transparent;cursor:pointer;
  font-weight:700;color:var(--color-text-muted);border-bottom:2px solid transparent;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-tab.is-active{
  color:var(--color-text);border-color:var(--color-primary);
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-tab-panel{display:none;padding:12px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-tab-panel.is-active{display:grid;gap:12px;}

:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-list{display:grid;gap:10px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-card{
  border:1px solid var(--color-border);border-radius:14px;padding:10px 12px;background:var(--color-surface);
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-card--compact{padding:10px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-benefit-sections{display:grid;gap:14px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-benefit-section{display:grid;gap:10px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-benefit-section-header{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-benefit-section-title{
  font-size:.95rem;font-weight:800;color:var(--color-text);
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-benefit-section-count{
  min-width:22px;height:22px;padding:0 7px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--color-surface-2);color:var(--color-text-muted);font-size:12px;font-weight:800;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-benefit-list{display:grid;gap:10px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-benefit-empty-card{
  color:var(--color-text-muted);font-size:.9rem;line-height:1.45;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-empty.hidden{display:none;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-discount-header,
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-promo-header{
  display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-discount-title,
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-promo-title{
  font-weight:800;font-size:.95rem;line-height:1.3;color:var(--color-text);
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-discount-desc{
  margin-top:6px;font-size:.88rem;line-height:1.45;color:var(--color-text-muted);
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-discount-details{
  margin-top:8px;display:grid;gap:4px;font-size:.82rem;line-height:1.4;color:var(--color-text-muted);
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .sp-discount-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:24px;padding:4px 10px;border-radius:999px;
  background:color-mix(in srgb, var(--color-primary) 14%, var(--color-surface));
  color:var(--color-primary);font-size:12px;font-weight:800;white-space:nowrap;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-promo-card{
  border-color:color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
  background:linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 4%, var(--color-surface)) 0%, var(--color-surface) 100%);
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-promo-title-wrap{display:grid;gap:4px;min-width:0;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-promo-status{
  font-size:12px;font-weight:700;color:var(--color-text-muted);
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-promo-code-row{
  margin-top:10px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-promo-code{
  padding:10px 12px;border-radius:12px;background:var(--color-surface-2);
  border:1px dashed color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  font-size:1rem;font-weight:900;letter-spacing:.08em;color:var(--color-text);
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-profile-promo-copy-btn{
  white-space:nowrap;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-card{
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex:1;min-width:0;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-card-main{min-width:0;flex:1;display:grid;gap:4px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-card-title{font-weight:500;font-size:.9rem;line-height:1.3;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-card-sub{
  font-size:12px;color:var(--color-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-actions--compact{display:flex;gap:6px;margin-top:0;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-action-icon{
  width:32px;height:32px;border-radius:10px;border:1px solid var(--color-border);
  background:var(--color-surface);display:grid;place-items:center;cursor:pointer;
  color:var(--color-text-muted);
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-action-icon:hover{background:var(--color-surface-2);}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-action-icon.is-default{color:var(--color-text-muted);}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-action-icon.is-default.is-active{color:#f59e0b;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-action-icon.is-danger{color:#e53935;}

:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-chip-btn{
  display:inline-flex;align-items:center;gap:6px;padding:8px 14px;
  border:1px solid var(--color-border);border-radius:20px;background:var(--color-surface);
  cursor:pointer;font-weight:700;font-size:.85rem;color:var(--color-text);
}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-chip-btn:hover{background:var(--color-surface-2);}

:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-form-grid{display:grid;gap:12px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-form-row{display:grid;gap:6px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-form-row--grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-form-field{display:grid;gap:6px;min-width:0;}
:is(.page-clients, .page-orders, .page-courier-screen, .page-chat, .page-cash) .shop-address-form-field .control{width:100%;min-width:0;}

/* --- Order detail back button --- */
.cl-order-detail-back{
  display:flex;align-items:center;gap:8px;padding:0 0 8px;cursor:pointer;font-weight:700;
}
.cl-order-detail-back .icon-btn{
  width:32px;height:32px;border-radius:10px;border:1px solid var(--color-border);
  background:var(--color-surface);display:grid;place-items:center;cursor:pointer;
}

/* --- Order detail card --- */
.cl-order-detail{display:grid;gap:16px;}
.cl-od-header{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding-bottom:12px;border-bottom:1px solid var(--color-border);
}
.cl-od-title{font-size:18px;font-weight:700;}
.cl-od-status{font-size:14px;color:var(--color-text-muted);padding:4px 8px;border-radius:8px;background:var(--color-surface-2);}

.cl-od-info{display:grid;gap:10px;}
.cl-od-row{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.cl-od-label{font-size:14px;color:var(--color-text-muted);}
.cl-od-value{font-size:14px;font-weight:500;text-align:right;}

.cl-od-section{
  display:grid;gap:8px;padding:12px;border-radius:12px;
  border:1px solid var(--color-border);background:var(--color-surface);
}
.cl-od-section-title{font-size:14px;font-weight:600;}

/* --- Order items --- */
.cl-od-items{display:grid;gap:10px;}
.cl-order-item{
  display:grid;grid-template-columns:72px 1fr auto;gap:10px;align-items:start;
  padding:10px;border-radius:14px;border:1px solid var(--color-border);background:var(--color-surface);
}
.cl-order-item-photo{
  width:72px;height:72px;border-radius:12px;object-fit:cover;
  border:1px solid var(--color-border);background:var(--color-surface-2);
}
.cl-order-item-photo--empty{
  display:grid;place-items:center;
}
.cl-order-item-mid{min-width:0;display:grid;gap:2px;}
.cl-order-item-title{font-weight:700;font-size:.9rem;line-height:1.3;}
.cl-order-item-sub{font-size:12px;color:var(--color-text-muted);line-height:1.4;}
.cl-order-item-right{text-align:right;display:grid;gap:2px;align-self:end;}
.cl-order-item-qty{font-size:12px;color:var(--color-text-muted);}
.cl-order-item-price{font-weight:700;}

/* --- Summary --- */
.cl-od-summary{display:flex;flex-direction:column;gap:8px;}
.cl-od-summary-title{font-weight:700;margin-bottom:2px;}
.cl-od-summary-row{display:flex;justify-content:space-between;align-items:center;gap:12px;}
.cl-od-summary-divider{border-top:1px dashed var(--color-border);margin:6px 0 2px;}
.cl-od-summary-total{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  font-weight:700;font-size:16px;
}

/* ── Clients toolbar: expandable search ── */
.cl-search-wrap{
  display:flex;
  align-items:center;
  position:relative;
  flex-direction:row;
}
.cl-search-toggle{
  position:relative;
  z-index:2;
  flex-shrink:0;
  order:2;
}
.cl-search-input{
  width:0;
  height:36px;
  padding:0;
  border:1px solid transparent;
  border-radius:8px;
  background:var(--color-surface);
  font-size:14px;
  color:var(--color-text);
  outline:none;
  opacity:0;
  order:1;
  margin-right:0;
  transition:width 0.25s ease, padding 0.25s ease, border-color 0.25s ease, opacity 0.2s ease, margin 0.25s ease;
}
.cl-search-wrap.is-open .cl-search-input{
  width:180px;
  padding:0 10px;
  border-color:var(--color-border);
  opacity:1;
  margin-right:8px;
}
.cl-search-input:focus{border-color:var(--color-primary);}
.cl-search-input::placeholder{color:var(--color-text-muted);opacity:.6;}

/* Courier offline banner */
.courier-connection-banner{
  position:fixed;
  left:12px;
  right:12px;
  top:calc(var(--header-height, 56px) + 8px);
  z-index:980;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 14px;
  border-radius:16px;
  box-shadow:0 8px 24px rgba(15, 23, 42, 0.14);
  transition:opacity .2s ease, transform .2s ease;
}
.courier-connection-banner.hidden{
  display:none;
}
.courier-connection-banner--offline,
.courier-connection-banner--syncing,
.courier-connection-banner--online,
.courier-connection-banner--error{
  color:var(--color-white);
}
.courier-connection-banner--offline{
  background:#ef6c00;
}
.courier-connection-banner--syncing{
  background:#1e88e5;
}
.courier-connection-banner--online{
  background:#2e7d32;
}
.courier-connection-banner--error{
  background:#c62828;
}
.courier-connection-banner__text{
  flex:1;
  min-width:0;
  font-size:14px;
  font-weight:700;
  line-height:1.35;
}
.courier-connection-banner__retry{
  flex-shrink:0;
  min-height:34px;
  padding:0 14px;
  border:1px solid rgba(255, 255, 255, 0.34);
  border-radius:999px;
  background:rgba(255, 255, 255, 0.12);
  color:inherit;
  font-weight:700;
}
.courier-connection-banner__retry.hidden{
  display:none;
}
@media (max-width: 768px){
  .courier-connection-banner{
    left:8px;
    right:8px;
    top:calc(var(--header-height, 56px) + 6px);
    padding:10px 12px;
    gap:10px;
  }
  .courier-connection-banner__text{
    font-size:13px;
  }
  .courier-connection-banner__retry{
    min-height:32px;
    padding:0 12px;
  }
}

/* ── Clients toolbar: sort dropdown ── */
.cl-sort-wrap{position:relative;}
#clientsSortToggle{
  display:flex;
  align-items:center;
  gap:0;
}
#clientsSortToggle i{
  font-size:12px;
  line-height:1;
}
#clientsSortToggle i:first-child{
  margin-right:-2px;
}
.cl-sort-dropdown{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
  display:grid;
  min-width:200px;
  z-index:50;
  overflow:hidden;
  padding:4px 0;
}
.cl-sort-dropdown.hidden{display:none;}
.cl-sort-option{
  padding:10px 14px;
  text-align:left;
  background:transparent;
  border:0;
  cursor:pointer;
  font-size:14px;
  font-weight:500;
  color:var(--color-text);
  transition:background var(--dur-fast) ease;
}
.cl-sort-option:hover{background:var(--color-surface-2);}
.cl-sort-option.is-active{
  color:var(--color-primary);
  font-weight:600;
  background:var(--primary-12);
}

/* ── Clients accordion ── */
.clients-accordion{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.clients-accordion .acc-trigger{
  background:var(--primary-14);
  border-color:var(--primary-25);
}
.clients-accordion .acc-trigger .stage-text b{
  color:var(--color-text);
  font-weight:700;
}
.clients-accordion .acc-trigger:hover{
  background:var(--primary-18);
}
.clients-accordion .acc-panel-inner{
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.clients-accordion .acc-panel-inner .stage-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.clients-accordion .acc-panel-inner .stage-item .stage-meta{
  flex:1;
  min-width:0;
}
.clients-accordion .acc-panel-inner .stage-item .stage-count{
  flex-shrink:0;
  margin-left:auto;
}

/* ── Filter Editor Form ── */
#filterEditorForm .control{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
}
#filterEditorForm select.control{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M3 4.5L6 7.5L9 4.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  padding-right:32px;
  cursor:pointer;
}
.filter-rule-row{
  display:flex;
  gap:8px;
  align-items:center;
  margin-bottom:8px;
}
.filter-rule-row .control{
  height:36px;
  font-size:13px;
}
.filter-rule-row .rule-field{flex:2;min-width:0;}
.filter-rule-row .rule-operator{flex:1;min-width:60px;}
.filter-rule-row .rule-value{flex:2;min-width:0;}
.filter-rule-row .rule-value.hidden{display:none;}
.filter-rule-row .rule-date-input{
  flex:2;
  display:flex;
  align-items:center;
  gap:4px;
}
.filter-rule-row .rule-date-input.hidden{display:none;}
.filter-rule-row .rule-value-days{
  width:80px;
  flex-shrink:0;
}
.filter-rule-row .rule-date-suffix{
  font-size:12px;
  color:var(--color-text-muted);
  white-space:nowrap;
}
.filter-rule-row .rule-remove{
  flex-shrink:0;
  width:32px;
  height:32px;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* Panel footer for filter editor */
.panel-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 16px;
  border-top:1px solid var(--color-border);
  background:var(--color-surface);
}
.panel-footer .btn-danger{
  margin-right:auto;
}
.panel-footer .btn-primary{
  margin-left:auto;
}

/* ── Custom Select Component (modern dropdown style) ── */
.custom-select{
  position:relative;
  display:inline-flex;
  min-width:0;
}
.custom-select .cs-trigger{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  width:100%;
  text-align:left;
  cursor:pointer;
  background:var(--color-surface);
}
.custom-select .cs-value{
  flex:1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.custom-select .cs-arrow{
  font-size:10px;
  color:var(--color-text-muted);
  flex-shrink:0;
  transition:transform .15s;
}
.custom-select.is-open .cs-arrow{
  transform:rotate(180deg);
}
.custom-select .cs-dropdown{
  position:absolute;
  top:calc(100% + 4px);
  left:0;
  right:0;
  min-width:100%;
  z-index:200;
  background:#fff;
  border:1px solid var(--color-border);
  border-radius:12px;
  box-shadow:0 4px 20px rgba(0,0,0,.12);
  padding:4px 0;
  max-height:220px;
  overflow-y:auto;
}
.custom-select .cs-dropdown.hidden{
  display:none;
}
.custom-select .cs-option{
  display:block;
  width:100%;
  padding:10px 14px;
  border:none;
  background:none;
  text-align:left;
  font-size:14px;
  color:var(--color-text);
  cursor:pointer;
  transition:background .12s;
  border-bottom:1px solid var(--color-border);
}
.custom-select .cs-option:last-child{
  border-bottom:none;
}
.custom-select .cs-option:hover{
  background:var(--primary-10);
}
.custom-select .cs-option.is-selected{
  color:var(--color-primary);
  font-weight:600;
  background:var(--primary-12);
}

/* Filter rule row adjustments for custom select */
.filter-rule-row .custom-select.rule-field{flex:2;min-width:0;}
.filter-rule-row .custom-select.rule-operator{flex:1;min-width:60px;}
.filter-rule-row .custom-select.rule-value-select{flex:2;min-width:0;}
.filter-rule-row .custom-select .cs-trigger{
  height:36px;
  font-size:13px;
  padding:0 10px;
}

/* Logic select full width */
.custom-select.logic-select{
  display:flex;
  width:100%;
}
.custom-select.logic-select .cs-trigger{
  height:40px;
}

/* ================= Clients filter editor ================= */

.client-info-panel #clientInfoBody{
  padding:16px;
}

.client-info-panel > .panel-body::after{
  display:none;
  content:none;
  height:0;
}

/* Client card: unified scroll behavior across all pages */
.client-info-panel #clientInfoBody{
  display:flex;
  flex-direction:column;
  min-height:0;
  overflow:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.client-info-panel #clientInfoBody::-webkit-scrollbar{
  display:none;
  width:0;
  height:0;
}

.client-info-panel #clientInfoWrap{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0 !important;
  height:100%;
}

.client-info-panel #clientTabOrders.shop-profile-tab-panel.is-active{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0 !important;
  height:100%;
  overflow:hidden;
}

.client-info-panel #clientOrdersListView{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0 !important;
  height:100%;
  overflow:hidden;
}

.client-info-panel #clientOrdersList{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0 !important;
  height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.client-info-panel #clientOrdersList::-webkit-scrollbar{
  display:none;
  width:0;
  height:0;
}

.client-info-panel #clientTabAddresses.shop-profile-tab-panel.is-active{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  align-content:start;
  gap:12px;
  min-height:0;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.client-info-panel #clientTabAddresses.shop-profile-tab-panel.is-active::-webkit-scrollbar{
  display:none;
  width:0;
  height:0;
}

.client-info-panel #clientTabAddresses #clientAddresses{
  flex:0 0 auto;
  align-content:start;
}

.client-info-panel #clientAddrToggleBtn{
  align-self:flex-start;
  margin-top:0;
}

@media (min-width: 1025px){
  :is(body.page-clients, body.page-orders, body.page-courier-screen, body.page-cash, body.page-chat) .client-info-panel > .panel-body{
    display:flex;
    flex-direction:column;
    min-height:0;
    overflow:hidden;
  }

  :is(body.page-clients, body.page-orders, body.page-courier-screen, body.page-cash, body.page-chat) .client-info-panel #clientInfoWrap{
    display:grid;
    grid-template-rows:auto auto minmax(0, 1fr);
    gap:0;
    flex:1 1 auto;
    min-height:0;
    height:100%;
  }

  :is(body.page-clients, body.page-orders, body.page-courier-screen, body.page-cash, body.page-chat) .client-info-panel #clientTabOrders.shop-profile-tab-panel.is-active{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    padding-bottom:0;
  }

  :is(body.page-clients, body.page-orders, body.page-courier-screen, body.page-cash, body.page-chat) .client-info-panel #clientOrdersListView{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
  }

  :is(body.page-clients, body.page-orders, body.page-courier-screen, body.page-cash, body.page-chat) .client-info-panel #clientOrdersList{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    gap:10px;
    min-height:0;
    height:100%;
    overflow-y:auto;
    overflow-x:hidden;
    padding-right:2px;
  }

  :is(body.page-clients, body.page-orders, body.page-courier-screen, body.page-cash, body.page-chat) .client-info-panel #clientOrdersList > *{
    flex:0 0 auto;
  }
}

.client-info-panel #filterEditorWrap:not(.hidden),
.client-info-panel #discountEditorWrap:not(.hidden),
.client-info-panel #discountInfoWrap:not(.hidden),
.client-info-panel #clientInfoWrap:not(.hidden),
.client-info-panel #clientOrderInfoWrap:not(.hidden){
  display:flex;
  flex-direction:column;
  gap:16px;
  min-height:100%;
}

/* Client order card (right panel): match chat/orders scroll behavior */
.client-info-panel #clientOrderInfoWrap:not(.hidden){
  gap:0;
  min-height:0;
  height:100%;
  overflow:hidden;
}

.client-info-panel #clientOrderInfoWrap [data-info="content"]{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.client-info-panel #clientOrderInfoWrap [data-info="content"]::-webkit-scrollbar{
  display:none;
  width:0;
  height:0;
}

/* Client profile layout must not inherit generic 100%-min-height + gap,
   otherwise orders tab loses scroll area. */
.client-info-panel #clientInfoWrap:not(.hidden){
  gap:0;
  min-height:0;
  height:100%;
}

.client-info-panel #clientTabOrders.shop-profile-tab-panel.is-active{
  min-height:0;
  height:100%;
}

.client-info-panel #clientOrdersListView{
  min-height:0;
  height:100%;
}

.client-info-panel #clientOrdersList{
  overflow-y:auto !important;
}

.client-info-panel #filterEditorForm,
.client-info-panel #discountEditorForm{
  gap:18px;
}

.client-info-panel #filterEditorForm .field-wrap,
.client-info-panel #discountEditorForm .field-wrap{
  display:grid;
  gap:8px;
  align-content:start;
}

.client-info-panel #filterEditorForm .field-wrap > .field-label,
.client-info-panel #discountEditorForm .field-wrap > .field-label{
  position:static;
  top:auto;
  left:auto;
  padding:0;
  margin:0;
  background:transparent;
  font-size:12px;
  line-height:1.25;
  color:var(--color-text-muted);
}

.client-info-panel #filterEditorForm .form-row-2,
.client-info-panel #discountEditorForm .form-row-2{
  align-items:start;
}

.client-info-panel #filterRulesContainer{
  display:grid;
  gap:12px;
}

.client-info-panel .filter-rule-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(108px, .78fr) 32px;
  gap:8px;
  align-items:start;
  margin-bottom:0;
}

.client-info-panel .filter-rule-row .rule-field{
  grid-column:1 / 4;
}

.client-info-panel .filter-rule-row .rule-operator{
  grid-column:1;
}

.client-info-panel .filter-rule-row .custom-select.rule-value-select{
  grid-column:2;
  min-width:0;
}

.client-info-panel .filter-rule-row .rule-value,
.client-info-panel .filter-rule-row .rule-date-input{
  min-width:0;
}

.client-info-panel .filter-rule-row .rule-value{
  grid-column:2;
}

.client-info-panel .filter-rule-row .rule-date-input{
  grid-column:2 / 4;
  min-height:36px;
  min-width:0;
}

.client-info-panel .filter-rule-row .rule-remove{
  grid-column:3;
  grid-row:2;
  align-self:center;
  justify-self:end;
}

.client-info-panel .panel-footer{
  padding:14px 16px;
}

@media (max-width: 1480px){
  .client-info-panel .filter-rule-row{
    grid-template-columns:minmax(0, 1fr) minmax(96px, .72fr) 32px;
  }
}

/* ── Filter category row (compact single line) ── */
.filter-category-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:10px;
  cursor:pointer;
  transition:background .12s, border-color .12s;
}
.filter-category-row:hover{
  background:var(--color-surface-2);
}
.filter-category-row.is-active{
  border-color:var(--color-primary);
  background:var(--primary-10);
}
.filter-category-row .filter-cat-icon{
  font-size:14px;
  color:var(--color-primary);
  flex-shrink:0;
}
.filter-category-row .filter-cat-title{
  flex:1;
  font-weight:500;
  font-size:14px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.filter-category-row .filter-cat-count{
  flex-shrink:0;
  font-size:12px;
  color:var(--color-text-muted);
  background:var(--color-surface-2);
  padding:2px 8px;
  border-radius:12px;
}

/* ── Discount Editor Form ── */
#discountEditorForm .control{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
}
#discountEditorForm select.control{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M3 4.5L6 7.5L9 4.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  padding-right:32px;
  cursor:pointer;
}
.weekdays-selector{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  justify-content:center;
}
.discount-restrictions-inline-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(132px, 1fr));
  gap:8px;
  width:100%;
  min-width:0;
}
.discount-restrictions-inline-grid > .field-wrap{
  min-width:0;
}
.discount-restrictions-inline-grid .field-label{
  white-space:nowrap;
  font-size:12px;
  margin-bottom:6px;
}
.discount-restrictions-inline-grid .control{
  width:100%;
  min-width:0;
  padding-left:12px;
  padding-right:12px;
}
.discount-restriction-chip-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:min(100%, var(--discount-editor-center-max));
  margin:14px auto 0;
  min-width:0;
}
.discount-restriction-chip{
  min-height:36px;
  white-space:nowrap;
  border-color:var(--color-border);
  background:var(--color-surface);
}
.discount-restriction-chip.is-active,
.discount-restriction-chip[aria-pressed="true"]{
  border-color:var(--shop-buy);
  background:var(--color-surface);
  color:var(--color-text);
  box-shadow:0 0 0 1px var(--shop-buy);
}

.order-items .cart-row--readonly-order{
  margin-bottom:0;
  grid-template-columns:92px minmax(0,1fr);
  grid-template-areas:
    "thumb mid"
    "thumb right";
  align-items:start;
}

.order-items .cart-row--readonly-order > .cart-thumb,
.order-items .cart-row--readonly-order > .cart-combo-thumb{
  grid-area:thumb;
}

.order-items .cart-row--readonly-order .cart-mid{
  grid-area:mid;
  min-height:0;
}

.order-items .cart-row--readonly-order .cart-right{
  grid-area:right;
  justify-self:end;
  align-self:start;
  margin-top:6px;
}

.order-items .cart-row--readonly-order .cart-title{
  white-space:normal;
  display:-webkit-box;
  -webkit-line-clamp:2;
  line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
}

.order-items .cart-row--readonly-order.cart-row--combo .cart-combo-details{
  margin-right:0;
  padding-right:0;
}

.order-items .cart-row--readonly-order .cart-sub-detail-item{
  overflow-wrap:anywhere;
}

.order-items .cart-row--readonly-order .cart-price{
  font-size:20px;
  line-height:1.05;
}

.order-items .cart-row--readonly-order .cart-old{
  font-size:13px;
  line-height:1.1;
}
.discount-restriction-fields{
  width:min(100%, var(--discount-editor-center-max));
  margin:10px auto 0;
  min-width:0;
  padding-left:0;
}
.discount-restriction-group{
  display:flex;
  justify-content:center;
}
.discount-restriction-main-row{
  display:flex;
  justify-content:center;
  align-items:flex-start;
  gap:18px;
  flex-wrap:wrap;
}
.discount-restriction-main-row > .discount-restriction-group{
  flex:0 0 auto;
}
.discount-restriction-main-row > .discount-restriction-group .discount-restriction-fields{
  margin:10px 0 0;
}
.discount-restriction-group--period{
  order:1;
}
.discount-restriction-group--time{
  order:2;
}
.discount-restriction-group--weekdays{
  order:3;
  flex:0 0 100%;
}
#de_period_fields,
#de_weekdays_fields,
#de_time_fields{
  width:fit-content;
  max-width:100%;
}
#de_period_fields .field-wrap,
#de_weekdays_fields,
#de_time_fields .field-wrap{
  display:grid;
  justify-items:center;
}
#de_period_fields .field-label,
#de_weekdays_fields .field-label,
#de_time_fields .field-label{
  text-align:center;
}
.discount-period-filter{
  width:min(100%, 340px);
  margin-inline:auto;
}
.discount-period-filter .date-popover{
  position:fixed;
  top:0;
  left:0;
  right:auto;
  width:min(260px, calc(100vw - 32px));
  max-height:none;
  overflow:visible;
}
.discount-period-trigger{
  width:100%;
  min-width:0;
  height:42px;
  border-radius:20px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 14px;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
}
.discount-period-trigger i{
  color:var(--primary-45);
  flex:0 0 auto;
}
.discount-period-trigger span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.discount-period-trigger[aria-expanded="true"]{
  border-color:var(--primary-45);
  box-shadow:0 0 0 3px rgba(248,122,31,.10);
}
.weekday-checkbox{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:42px;
  min-height:38px;
  padding:0 12px;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:14px;
  cursor:pointer;
  font-size:13px;
  font-weight:700;
  transition:background .12s, border-color .12s, color .12s, box-shadow .12s;
}
.weekday-checkbox:hover{
  background:var(--color-surface-3);
}
.weekday-checkbox input{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
}
.weekday-checkbox span{
  color:var(--color-text);
}
.weekday-checkbox input:checked + span{
  color:var(--color-text);
}
.weekday-checkbox:has(input:checked){
  border-color:var(--primary-45);
  background:var(--color-surface-2);
  box-shadow:0 0 0 3px rgba(248,122,31,.10);
}
#discountEditorForm .discount-restriction-fields .discount-time-input{
  width:112px;
  min-width:112px;
  height:42px;
  border-radius:20px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  padding:0 14px;
  font-size:15px;
  font-weight:600;
  letter-spacing:.02em;
  text-align:center;
}
#discountEditorForm .discount-restriction-fields .discount-time-input:focus,
.discount-period-trigger:focus{
  outline:none;
  border-color:var(--primary-45);
  box-shadow:0 0 0 3px rgba(248,122,31,.10);
}
#de_time_fields .form-row-2{
  display:flex;
  justify-content:center;
  align-items:start;
  gap:16px;
}
#de_time_fields .field-wrap{
  width:112px;
  min-width:112px;
}
.field-hint{
  font-size:12px;
  color:var(--color-text-muted);
  margin-top:4px;
}

/* ── Discount Info Panel ── */
.discount-info-header{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
}
.discount-info-badges{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.discount-info-icon{
  width:48px;
  height:48px;
  background:var(--primary-14);
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  color:var(--color-primary);
}
.discount-info-title{
  flex:1;
  font-size:18px;
  font-weight:600;
  color:var(--color-text);
}
.discount-info-badge{
  padding:4px 10px;
  font-size:12px;
  font-weight:500;
  border-radius:12px;
  background:var(--color-success-bg, #dcfce7);
  color:var(--color-success, #16a34a);
}
.discount-info-badge.inactive{
  background:var(--color-surface-2);
  color:var(--color-text-muted);
}
.discount-info-badge--benefits{
  background:var(--primary-10);
  color:var(--color-primary);
}
.discount-info-stats{
  display:flex;
  gap:16px;
  margin-bottom:16px;
}
.discount-info-stat{
  flex:1;
  background:var(--color-surface-2);
  border-radius:10px;
  padding:12px;
  text-align:center;
}
.discount-info-stat-value{
  font-size:20px;
  font-weight:700;
  color:var(--color-primary);
}
.discount-info-stat-label{
  font-size:12px;
  color:var(--color-text-muted);
  margin-top:4px;
}
.discount-info-details{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.discount-info-row{
  display:flex;
  justify-content:space-between;
  padding:8px 0;
  border-bottom:1px solid var(--color-border);
}
.discount-info-row:last-child{
  border-bottom:none;
}
.discount-info-row-label{
  font-size:13px;
  color:var(--color-text-muted);
}
.discount-info-row-value{
  font-size:13px;
  font-weight:500;
  color:var(--color-text);
}

/* ── Discount row (list item) ── */
.discount-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:10px;
  cursor:pointer;
  transition:background .12s, border-color .12s;
}
.discount-row:hover{
  background:var(--color-surface-2);
}
.discount-row.is-active{
  border-color:var(--color-primary);
  background:var(--primary-10);
}
.discount-row .discount-row-icon{
  width:36px;
  height:36px;
  background:var(--primary-14);
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  color:var(--color-primary);
  flex-shrink:0;
}
.discount-row .discount-row-info{
  flex:1;
  min-width:0;
}
.discount-row .discount-row-title-wrap{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.discount-row .discount-row-title{
  flex:1 1 auto;
  min-width:0;
  font-weight:500;
  font-size:14px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.discount-row .discount-row-badge{
  flex:0 0 auto;
  padding:2px 8px;
  border-radius:999px;
  background:var(--primary-10);
  color:var(--color-primary);
  font-size:11px;
  font-weight:600;
  white-space:nowrap;
}
.discount-row .discount-row-meta{
  font-size:12px;
  color:var(--color-text-muted);
  margin-top:2px;
}
.discount-row .discount-row-value{
  flex-shrink:0;
  font-size:14px;
  font-weight:600;
  color:var(--color-primary);
}
.discount-row .discount-row-status{
  flex-shrink:0;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--color-success, #16a34a);
}
.discount-row .discount-row-status.inactive{
  background:var(--color-text-muted);
}
.discount-row .discount-row-actions{
  display:flex;
  align-items:center;
  gap:6px;
  margin-left:8px;
}
.discount-row .discount-row-action-btn{
  width:28px;
  height:28px;
  border:1px solid var(--color-border);
  border-radius:999px;
  background:var(--color-surface);
  color:var(--color-text-muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background .12s, border-color .12s, color .12s;
}
.discount-row .discount-row-action-btn:hover{
  background:var(--color-danger-soft, rgba(239, 68, 68, .08));
  border-color:var(--color-danger, #ef4444);
  color:var(--color-danger, #ef4444);
}
.discount-switch-hint{
  margin-top:8px;
  font-size:12px;
  line-height:1.4;
  color:var(--color-text-muted);
}

/* История применения скидки: одна строка на запись */
.clients-panel .order-row.discount-order-row{
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 12px;
  align-items: center;
}
.discount-order-row .order-row-info{
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
}
.discount-order-row .order-row-title{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}
.discount-order-row .order-row-meta{
  flex: 0 0 auto;
  white-space: nowrap;
  color: var(--color-text-muted);
}
.discount-order-row .order-row-right{
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  white-space: nowrap;
}
.discount-order-row .order-row-total{
  white-space: nowrap;
  font-weight: 600;
}
.discount-order-row .order-row-discount{
  white-space: nowrap;
  color: var(--color-success);
  font-size: 12px;
}

.discount-progress-customer-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:14px 16px;
  border:1px solid var(--color-border);
  border-radius:18px;
  background:#fff;
  margin-bottom:12px;
}

.discount-progress-customer-meta{
  min-width:0;
  flex:0 1 220px;
  display:grid;
  gap:2px;
}

.discount-progress-customer-name{
  min-width:0;
  font-size:15px;
  font-weight:700;
  color:var(--color-text);
}

.discount-progress-customer-phone{
  min-width:0;
  font-size:13px;
  color:var(--color-text-muted);
}

.discount-progress-customer-card{
  display:grid;
}

.discount-progress-customer-card .shop-checkout-benefit-progress-card{
  margin:0;
}

.discount-progress-inline-card{
  flex:1 1 auto;
  min-width:0;
  margin:0;
  padding:0;
  border:none;
  background:transparent;
  box-shadow:none;
}

.discount-progress-inline{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
}

.discount-progress-summary-badges{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:8px;
}

.discount-progress-summary-badge{
  gap:6px;
}

.discount-progress-summary-badge-label{
  opacity:0.9;
}

.discount-progress-summary-badge-value{
  font-weight:900;
}

.discount-progress-summary-badge i{
  font-size:12px;
}

.discount-progress-inline-visual{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  align-items:center;
}

.discount-progress-inline-visual .shop-checkout-benefit-progress-visual,
.discount-progress-inline-visual .shop-checkout-benefit-progress-amount-layout{
  width:100%;
}

.discount-progress-available-badge{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:var(--shop-buy);
  color:#fff;
  font-size:12px;
  font-weight:700;
  line-height:1;
  box-shadow:0 10px 18px rgba(255, 122, 0, 0.22);
}

.discount-progress-available-badge-count{
  min-width:10px;
  text-align:center;
}

.discount-progress-available-badge i{
  font-size:12px;
}

.discount-progress-history-more{
  width:100%;
  margin-top:4px;
  border:none;
  border-radius:16px;
  padding:12px 14px;
  background:rgba(255,122,0,0.1);
  color:var(--shop-buy);
  font-weight:700;
  cursor:pointer;
}

.discount-progress-history-more:disabled{
  opacity:0.6;
  cursor:default;
}

/* ── Discount chips (product/customer selection) ── */
.discount-chips-wrap{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:flex-start;
}
.discount-chips{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
  flex:1;
  min-width:0;
}
.discount-chip{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:4px 8px 4px 10px;
  background:var(--primary-14);
  border-radius:16px;
  font-size:12px;
  color:var(--color-text);
  max-width:180px;
}
.discount-chip-text{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.discount-chip-remove{
  cursor:pointer;
  color:var(--color-text-muted);
  font-size:10px;
  flex-shrink:0;
  width:14px;
  height:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  transition:background .12s, color .12s;
}
.discount-chip-remove:hover{
  color:var(--color-danger);
  background:rgba(239,68,68,0.1);
}
.discount-chip.is-category{
  background:var(--color-info-bg, #dbeafe);
  color:var(--color-info, #2563eb);
}
.discount-chip.is-combo{
  background:var(--color-warning-bg, #fef3c7);
  color:var(--color-warning, #d97706);
}
.discount-chips-empty{
  font-size:12px;
  color:var(--color-text-muted);
  font-style:italic;
}
.discount-entity-picker-row{
  display:flex;
  align-items:flex-start;
  gap:12px;
  flex-wrap:nowrap;
  overflow-x:auto;
  overflow-y:hidden;
  padding-bottom:4px;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
}
.discount-entity-picker-row::-webkit-scrollbar{
  width:0;
  height:0;
}
.discount-entity-picker-row .discount-entity-tiles{
  display:flex;
  align-items:flex-start;
  gap:12px;
  flex-wrap:nowrap;
  flex:0 0 auto;
  min-width:auto;
}
.discount-chip.discount-entity-tile{
  position:relative;
  display:grid;
  grid-template-rows:96px auto;
  align-items:start;
  gap:8px;
  width:96px;
  min-width:96px;
  max-width:96px;
  padding:0;
  border-radius:22px;
  background:transparent;
  color:var(--color-text);
}
.discount-entity-tile-media{
  position:relative;
  width:96px;
  height:96px;
  border-radius:24px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.discount-entity-tile-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.discount-entity-tile-placeholder{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  color:var(--color-text-muted);
  background:linear-gradient(180deg, rgba(148,163,184,.14), rgba(148,163,184,.08));
}
.discount-chip.discount-entity-tile.is-category .discount-entity-tile-placeholder{
  color:var(--color-info, #2563eb);
}
.discount-chip.discount-entity-tile.is-combo .discount-entity-tile-placeholder{
  color:var(--color-warning, #d97706);
}
.discount-entity-tile-title{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:normal;
  line-height:1.2;
  text-align:center;
  font-size:12px;
  font-weight:700;
  min-height:30px;
}
.discount-chip.discount-entity-tile .discount-chip-remove{
  position:absolute;
  top:-4px;
  right:-4px;
  width:22px;
  height:22px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.08);
  background:var(--color-surface);
  box-shadow:0 6px 16px rgba(15,23,42,.12);
  font-size:12px;
  color:var(--color-text-muted);
  z-index:1;
}
.discount-entity-add-tile{
  width:96px;
  min-width:96px;
  border:none;
  background:transparent;
  color:var(--color-text);
  display:grid;
  grid-template-rows:96px auto;
  gap:8px;
  align-items:start;
  justify-items:center;
  padding:0;
  cursor:pointer;
  transition:color .16s ease;
}
.discount-entity-add-tile-box{
  width:96px;
  height:96px;
  border:1px dashed var(--color-border);
  border-radius:24px;
  background:var(--color-surface);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}
.discount-entity-add-tile i{
  font-size:28px;
  margin:0;
}
.discount-entity-add-tile-text{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:normal;
  line-height:1.2;
  text-align:center;
  font-size:12px;
  font-weight:700;
  min-height:30px;
}
.discount-entity-add-tile:hover .discount-entity-add-tile-box,
.discount-entity-add-tile:focus-visible .discount-entity-add-tile-box{
  border-color:var(--primary-45);
  background:var(--color-surface-2);
  color:var(--color-text);
}
.discount-entity-add-tile:focus-visible{
  outline:none;
}
.discount-buy-visual-card{
  display:grid;
  gap:12px;
  padding:14px;
  border:1px solid var(--color-border);
  border-radius:22px;
  background:linear-gradient(180deg, rgba(148,163,184,.08), rgba(148,163,184,.03));
}
.discount-selection-visual-card{
  margin-bottom:10px;
}
.discount-buy-visual-card-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.discount-buy-visual-card-title{
  font-size:14px;
  font-weight:800;
  color:var(--color-text);
}
.discount-buy-visual-card-meta{
  font-size:12px;
  color:var(--color-text-muted);
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}
.discount-buy-visual-legend{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.discount-buy-visual-legend-item{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  background:var(--color-surface);
  color:var(--color-text);
}
.discount-buy-visual-legend-item.is-buy{
  background:rgba(249,115,22,.12);
}
.discount-buy-visual-legend-item.is-reward{
  background:rgba(59,130,246,.12);
}
.discount-buy-visual-rows{
  display:grid;
  gap:14px;
  justify-items:center;
}
.discount-buy-visual-row{
  position:relative;
  display:flex;
  align-items:center;
  gap:var(--discount-buy-slot-gap, 14px);
  flex-wrap:nowrap;
  width:max-content;
  max-width:100%;
  padding:4px 0;
}
.discount-buy-visual-row::before{
  content:"";
  position:absolute;
  left:25px;
  right:25px;
  top:50%;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(148,163,184,.4), rgba(148,163,184,.24));
  transform:translateY(-50%);
  pointer-events:none;
}
.discount-buy-visual-row::before,
.discount-threshold-slot-row::before{
  display:none;
}
.discount-buy-visual-row[data-slot-count="1"]::before{
  display:none;
}
.discount-buy-slot{
  position:relative;
  z-index:1;
  width:50px;
  min-width:50px;
  height:50px;
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface);
  padding:0;
  appearance:none;
  font:inherit;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--color-text);
  cursor:pointer;
  box-shadow:0 0 0 4px var(--color-surface);
  transition:border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
}
.discount-buy-slot.is-buy{
  border-color:rgba(249,115,22,.22);
  background:rgba(249,115,22,.05);
}
.discount-buy-slot.is-reward{
  border-color:rgba(59,130,246,.2);
  background:rgba(59,130,246,.05);
}
.discount-buy-slot.is-gift-reward{
  overflow:visible;
}
.discount-buy-slot-gift-badge{
  position:absolute;
  top:0;
  left:50%;
  transform:translate(-50%, -50%);
  width:18px;
  height:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--color-surface);
  color:var(--color-primary-hover, #f97316);
  border:1px solid rgba(249,115,22,.24);
  border-radius:999px;
  box-shadow:0 2px 8px rgba(15,23,42,.08);
  pointer-events:none;
  z-index:2;
}
.discount-buy-slot-gift-badge i{
  font-size:10px;
  margin:0;
}
.discount-buy-slot:hover,
.discount-buy-slot:focus-visible{
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--color-surface), 0 0 0 6px var(--primary-12);
  outline:none;
}
.discount-buy-slot:active{
  transform:translateY(1px);
}
.discount-buy-slot-media{
  position:relative;
  width:100%;
  height:100%;
  border-radius:15px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.discount-buy-slot-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.discount-buy-slot-placeholder{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg, rgba(148,163,184,.16), rgba(148,163,184,.08));
  color:var(--color-text-muted);
}
.discount-buy-slot-placeholder i{
  font-size:18px;
}
.discount-buy-slot-badge{
  position:absolute;
  top:-6px;
  right:-6px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:999px;
  background:rgba(15,23,42,.82);
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  font-weight:800;
}
#de_progress_status_filter_wrap{
  width:100%;
}
#de_buy_visual_rows .discount-buy-visual-row::before,
#de_progress_counts_visual_rows .discount-buy-visual-row::before{
  left:38px;
  right:38px;
}
#de_buy_visual_card .discount-buy-slot,
#de_progress_counts_visual_rows .discount-buy-slot{
  width:75px;
  min-width:75px;
  height:75px;
  border-radius:20px;
}
#de_buy_visual_card .discount-buy-slot-placeholder i,
#de_progress_counts_visual_rows .discount-buy-slot-placeholder i{
  font-size:22px;
}
.discount-buy-slot--amount{
  cursor:default;
  padding:8px;
  overflow:hidden;
}
#de_progress_counts_visual_rows .discount-buy-slot--amount{
  width:118px;
  min-width:118px;
  height:52px;
  padding:0 14px;
  border-radius:999px;
}
#de_progress_counts_visual_rows .discount-buy-visual-row:has(.discount-buy-slot--amount)::before{
  left:59px;
}
.discount-buy-slot-amount-input{
  width:100%;
  height:100%;
  border:0;
  background:transparent;
  color:var(--color-text);
  text-align:center;
  font-size:16px;
  font-weight:700;
  padding:6px 18px 4px 6px;
  outline:none;
  appearance:textfield;
}
#de_progress_counts_visual_rows .discount-buy-slot--amount .discount-buy-slot-amount-input{
  font-size:15px;
  padding:0 20px 0 6px;
}
.discount-buy-slot-amount-input::-webkit-outer-spin-button,
.discount-buy-slot-amount-input::-webkit-inner-spin-button{
  -webkit-appearance:none;
  margin:0;
}
.discount-buy-slot-amount-currency{
  position:absolute;
  right:10px;
  bottom:10px;
  font-size:11px;
  font-weight:700;
  color:var(--color-text-muted);
  pointer-events:none;
}
#de_progress_counts_visual_rows .discount-buy-slot--amount .discount-buy-slot-amount-currency{
  top:50%;
  right:14px;
  bottom:auto;
  transform:translateY(-50%);
  font-size:12px;
}
.discount-threshold-slot-rows{
  display:grid;
  gap:18px;
  justify-items:center;
}
.discount-threshold-slot-row{
  position:relative;
  display:flex;
  align-items:flex-start;
  gap:var(--discount-threshold-slot-gap, 14px);
  flex-wrap:nowrap;
  width:max-content;
  max-width:100%;
  padding:4px 0;
}
.discount-threshold-slot-row::before{
  content:"";
  position:absolute;
  left:38px;
  right:38px;
  top:78px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(148,163,184,.4), rgba(148,163,184,.24));
  pointer-events:none;
}
.discount-threshold-slot-row[data-slot-count="1"]::before{
  display:none;
}
.discount-threshold-slot-item{
  position:relative;
  z-index:1;
  width:75px;
  display:grid;
  gap:6px;
  justify-items:center;
}
.discount-threshold-slot-input{
  width:75px;
  min-width:75px;
  height:34px;
  text-align:center;
  padding-inline:2px;
  font-size:10px;
  font-weight:600;
  line-height:1.1;
}
.discount-threshold-slot-item .discount-buy-slot{
  width:75px;
  min-width:75px;
  height:75px;
  border-radius:20px;
}
.discount-threshold-slot-item .discount-buy-slot-placeholder i{
  font-size:22px;
}
.discount-stepper{
  --qty-pill-h:42px;
  --qty-pill-side:42px;
  display:grid;
  grid-template-columns:var(--qty-pill-side) 72px var(--qty-pill-side);
  align-items:center;
  justify-content:center;
  width:auto;
  max-width:100%;
  min-width:calc(var(--qty-pill-side) * 2 + 72px);
  height:var(--qty-pill-h);
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  overflow:visible;
  gap:0;
}
.discount-stepper-input{
  width:72px;
  min-width:72px;
  max-width:72px;
  height:100%;
  border:none;
  background:transparent;
  box-shadow:none;
  padding:0 8px;
  text-align:center;
  font-size:14px;
  font-weight:800;
  display:block;
}
.discount-stepper-btn{
  appearance:none;
  -webkit-appearance:none;
  width:32px;
  height:32px;
  min-width:32px;
  border:1px solid var(--shop-buy);
  border-radius:999px;
  background:var(--shop-buy);
  color:#fff;
  box-shadow:0 4px 10px rgba(255,136,0,.24);
  font-size:20px;
  font-weight:900;
  display:grid;
  place-items:center;
  padding:0;
  justify-self:center;
  transition:background .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.discount-stepper-btn:first-child{
  border-right:none;
}
.discount-stepper-btn:last-child{
  border-left:none;
}
.discount-stepper-btn:hover{
  filter:brightness(1.03);
  box-shadow:0 6px 12px rgba(255,136,0,.30);
  color:#fff;
}
.discount-stepper-btn:active,
.discount-stepper-btn.is-pressed{
  transform:scale(1.08);
  background:#ef7600;
  border-color:#ef7600;
  color:#fff;
  box-shadow:0 0 0 4px rgba(255,136,0,.20),0 8px 14px rgba(255,136,0,.36);
}
.discount-stepper:focus-within{
  border-color:var(--primary-45);
  box-shadow:0 0 0 3px rgba(248,122,31,.10);
}
.discount-stepper-input:focus{
  box-shadow:none;
}
.discount-stepper-input::-webkit-outer-spin-button,
.discount-stepper-input::-webkit-inner-spin-button{
  margin:0;
}
.discount-threshold-reward-picker{
  position:fixed;
  z-index:80;
  width:min(320px, calc(100vw - 24px));
}
.discount-threshold-reward-picker-card{
  display:grid;
  gap:12px;
  padding:14px;
  border:1px solid var(--color-border);
  border-radius:20px;
  background:var(--color-surface);
  box-shadow:0 18px 40px rgba(15, 23, 42, .18);
}
.discount-threshold-reward-picker-title{
  font-size:13px;
  font-weight:800;
  color:var(--color-text);
}
.discount-threshold-reward-picker-types{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.discount-threshold-reward-picker-list{
  display:grid;
  gap:8px;
  max-height:280px;
  overflow:auto;
  padding-right:2px;
}
.discount-threshold-source-option{
  width:100%;
  border:1px solid var(--color-border);
  border-radius:18px;
  background:var(--color-surface);
  padding:12px 14px;
  text-align:left;
  display:grid;
  gap:4px;
  color:var(--color-text);
  cursor:pointer;
  transition:border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.discount-threshold-source-option:hover,
.discount-threshold-source-option:focus-visible{
  border-color:var(--primary-45);
  background:var(--color-surface-2);
  box-shadow:0 0 0 4px var(--primary-12);
  outline:none;
}
.discount-threshold-source-option.is-active{
  border-color:var(--primary-45);
  background:var(--color-surface-2);
}
.discount-threshold-source-option-title{
  font-size:13px;
  font-weight:700;
  color:var(--color-text);
}
.discount-threshold-source-option-code{
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  color:var(--color-primary-hover, #f97316);
}
.discount-threshold-source-option-meta{
  font-size:12px;
  color:var(--color-text-muted);
}
.discount-audience-toolbar{
  display:flex;
  align-items:center;
  width:100%;
  margin-top:8px;
}
.discount-entity-toolbar{
  display:flex;
  align-items:center;
  width:100%;
  margin-top:8px;
}
.discount-audience-add-btn{
  width:100%;
  min-height:56px;
  border:1px dashed var(--color-border);
  border-radius:18px;
  background:var(--color-surface);
  color:var(--color-text);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  cursor:pointer;
  transition:border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}
.discount-audience-add-btn.hidden{
  display:none;
}
.discount-audience-add-btn-main{
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
  flex:1 1 auto;
}
.discount-audience-add-btn-icon{
  width:30px;
  height:30px;
  min-width:30px;
  border-radius:999px;
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
  display:grid;
  place-items:center;
  color:var(--color-text);
}
.discount-audience-add-btn-icon i{
  font-size:14px;
}
.discount-audience-add-btn-copy{
  min-width:0;
  display:grid;
  gap:2px;
  text-align:left;
}
.discount-audience-add-btn-title{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:14px;
  font-weight:700;
  color:var(--color-text);
}
.discount-audience-add-btn-meta{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  color:var(--color-text-muted);
}
.discount-audience-add-btn-caret{
  width:20px;
  min-width:20px;
  display:grid;
  place-items:center;
  color:var(--color-text-muted);
  transition:transform .16s ease, color .16s ease;
}
.discount-audience-add-btn.is-empty .discount-audience-add-btn-caret{
  opacity:.35;
}
.discount-audience-add-btn.is-filled{
  border-style:solid;
  background:var(--color-surface-2);
}
.discount-audience-add-btn.is-expanded .discount-audience-add-btn-caret{
  transform:rotate(180deg);
}
.discount-audience-add-btn:hover,
.discount-audience-add-btn:focus-visible{
  border-color:var(--primary-45);
  background:var(--color-surface-2);
  color:var(--color-text);
  box-shadow:0 10px 24px rgba(15, 23, 42, .06);
}
.discount-audience-add-btn:focus-visible{
  outline:none;
}
.discount-audience-list{
  display:grid;
  gap:8px;
  margin-top:10px;
}
.discount-audience-list.is-collapsed{
  display:none;
}
.discount-entity-list{
  display:grid;
  gap:10px;
  margin-top:10px;
}
.discount-entity-list.is-collapsed{
  display:none;
}
.discount-entity-accordion-tiles{
  display:flex;
  align-items:flex-start;
  gap:12px;
  flex-wrap:wrap;
}
.discount-promo-codes-toggle{
  margin-bottom:10px;
}
.discount-promo-codes-toggle.is-empty .discount-audience-add-btn-caret{
  opacity:.35;
}
.discount-promo-list.is-collapsed{
  display:none;
}
.discount-audience-inline-add{
  width:100%;
  min-height:44px;
  border:1px dashed var(--color-border);
  border-radius:16px;
  background:var(--color-surface);
  color:var(--color-text);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:0 14px;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  transition:border-color .16s ease, background .16s ease, color .16s ease;
}
.discount-audience-inline-add:hover,
.discount-audience-inline-add:focus-visible{
  border-color:var(--primary-45);
  background:var(--color-surface-2);
}
.discount-audience-inline-add:focus-visible{
  outline:none;
}
.discount-audience-item{
  width:100%;
  max-width:none;
  min-height:48px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface);
  color:var(--color-text);
}
.discount-audience-item.is-category{
  background:var(--color-info-bg, #dbeafe);
  color:var(--color-text);
}
.discount-audience-item-meta{
  min-width:0;
  display:grid;
  gap:2px;
  flex:1 1 auto;
}
.discount-audience-item-title{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
  font-weight:700;
}
.discount-audience-item-secondary{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  color:var(--color-text-muted);
}
.discount-audience-item .discount-chip-remove{
  margin-top:2px;
}
.discount-audience-empty{
  min-height:48px;
  display:flex;
  align-items:center;
  padding:0 12px;
  border:1px dashed var(--color-border);
  border-radius:16px;
  color:var(--color-text-muted);
  background:var(--color-surface);
  font-size:13px;
}
.discount-progress-promo-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
}
.discount-progress-promo-summary{
  display:grid;
  gap:4px;
  padding:12px 14px;
  border:1px solid var(--color-border);
  border-radius:18px;
  background:var(--color-surface);
}
.discount-progress-promo-summary-text{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
  font-weight:700;
  color:var(--color-text);
}
.discount-progress-promo-picker{
  display:grid;
  gap:8px;
}
.discount-progress-promo-list{
  display:grid;
  gap:8px;
}
.discount-progress-promo-option{
  width:100%;
  border:1px solid var(--color-border);
  border-radius:18px;
  background:var(--color-surface);
  padding:12px 14px;
  text-align:left;
  display:grid;
  gap:4px;
  color:var(--color-text);
  cursor:pointer;
  transition:border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.discount-progress-promo-option:hover,
.discount-progress-promo-option:focus-visible{
  border-color:var(--primary-45);
  background:var(--color-surface-2);
  box-shadow:0 0 0 4px var(--primary-12);
  outline:none;
}
.discount-progress-promo-option.is-active{
  border-color:var(--primary-45);
  background:var(--color-surface-2);
}
.discount-progress-promo-option-title{
  font-size:13px;
  font-weight:700;
  color:var(--color-text);
}
.discount-progress-promo-option-code{
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  color:var(--color-primary-hover, #f97316);
}
.discount-progress-promo-option-meta{
  font-size:12px;
  color:var(--color-text-muted);
}

/* ── Discount info sections ── */
.discount-info-section{
  margin-top:16px;
}
.discount-info-section-title{
  font-size:13px;
  font-weight:600;
  margin-bottom:8px;
  color:var(--color-text);
}

/* ── Order item old price (strikethrough) ── */
.discount-promo-panel{
  border:none;
  border-radius:0;
  background:transparent;
  padding:0;
  display:grid;
  gap:12px;
}
.discount-promo-panel.is-promo-shared{
  grid-template-columns:minmax(0, .72fr) minmax(0, 1.08fr) minmax(0, .8fr);
}
.discount-promo-panel.is-promo-unique{
  grid-template-columns:minmax(0, .72fr) minmax(0, 1.28fr);
}
#clientInfoBody,
#discountEditorWrap,
#discountEditorForm,
.discount-editor-section,
.discount-promo-panel,
.discount-promo-panel .field-wrap{
  min-width:0;
}
#clientInfoBody,
#discountEditorWrap,
#discountEditorForm{
  overflow-x:hidden;
  --discount-editor-center-max:560px;
}
#discountEditorForm .field-label{
  font-size:13px;
  font-weight:600;
  margin-bottom:8px;
  line-height:1.25;
}
#discountEditorForm .field-wrap .field-label{
  position:static;
  top:auto;
  left:auto;
  padding:0;
  background:transparent;
  margin-bottom:8px;
  pointer-events:auto;
}
#discountEditorForm{
  width:100%;
  max-width:100%;
}
#discountEditorForm .field-wrap,
#discountEditorForm .discount-editor-section > *{
  min-width:0;
  max-width:100%;
}
.discount-editor-section{
  display:grid;
  gap:12px;
}
#de_loyalty_progress_wrap,
#de_progress_reward_discount_wrap,
#de_progress_promo_wrap{
  display:grid;
  gap:12px;
}
#de_simple_regular_wrap{
  display:grid;
  gap:12px;
}
.discount-editor-section-title{
  font-size:13px;
  font-weight:700;
  color:var(--color-text);
  margin-top:4px;
}
.discount-promo-panel-title{
  font-size:14px;
  font-weight:600;
  color:var(--color-text);
  grid-column:1 / -1;
}
.discount-promo-panel-text{
  font-size:12px;
  color:var(--color-text-muted);
  margin-top:-6px;
}
.discount-promo-panel > .field-wrap:first-of-type,
#de_promo_shared_wrap,
#de_promo_unique_wrap{
  min-width:0;
}
#de_promo_shared_wrap,
#de_promo_unique_wrap{
  display:grid;
  gap:8px;
}
.discount-promo-panel.is-promo-shared > #de_promo_shared_wrap{
  grid-column:1 / -1;
}
.discount-promo-panel.is-promo-unique > #de_promo_unique_wrap{
  grid-column:1 / -1;
}
#de_promo_code_mode_chips{
  grid-column:1 / -1;
}
#de_promo_code_mode_wrap,
#de_promo_reward_type_wrap,
#de_promo_discount_row,
#de_promo_reward_row,
#de_promo_product_discount_row,
#de_promo_products_wrap{
  grid-column:1 / -1;
}
#de_promo_shared_wrap > .discount-editor-inline-row{
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
}
#de_promo_unique_wrap > .discount-editor-inline-row--generator{
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  justify-content:stretch;
}
#de_promo_wrap > .field-wrap:first-of-type{
  position:relative;
}
#de_promo_wrap > .field-wrap:first-of-type .discount-editor-select-host,
#de_promo_wrap > .field-wrap:first-of-type .custom-select.discount-editor-select{
  width:100%;
}
#de_promo_wrap > .field-wrap:first-of-type .custom-select.discount-editor-select .cs-dropdown{
  left:0;
  right:0;
  top:calc(100% + 6px);
  transform:none;
  width:100%;
  min-width:100%;
  border-radius:20px;
  padding:8px;
  box-shadow:0 10px 24px rgba(15,23,42,.16);
}
#de_promo_wrap > .field-wrap:first-of-type .custom-select.discount-editor-select .cs-option{
  justify-content:flex-start;
  text-align:left;
  padding:0 16px;
}
#de_promo_shared_wrap .field-hint,
#de_promo_unique_wrap .field-hint,
#de_promo_generate_hint,
#de_promo_codes_wrap,
#de_promo_reward_row,
#de_promo_discount_row,
#de_promo_product_discount_row,
#de_promo_products_wrap{
  grid-column:1 / -1;
}
.discount-editor-select-host{
  display:flex;
  width:100%;
  min-width:0;
}
.custom-select.discount-editor-select{
  display:flex;
  width:100%;
  min-width:0;
  position:relative;
}
.custom-select.discount-editor-select .cs-trigger{
  width:100%;
  height:42px;
  min-height:42px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  box-shadow:none;
  font-size:16px;
  font-weight:800;
  color:var(--color-text);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-align:center;
  cursor:pointer;
}
.custom-select.discount-editor-select .cs-trigger:hover{
  background:var(--color-surface-2);
}
.custom-select.discount-editor-select.is-open .cs-trigger,
.custom-select.discount-editor-select .cs-trigger:focus-visible{
  border-color:var(--primary-45);
  box-shadow:0 0 0 4px var(--primary-12);
  outline:none;
}
.custom-select.discount-editor-select .cs-arrow{
  font-size:10px;
  color:var(--color-text-muted);
  flex-shrink:0;
  transition:transform .18s ease;
}
.custom-select.discount-editor-select.is-open .cs-arrow{
  transform:rotate(180deg);
}
.custom-select.discount-editor-select .cs-dropdown{
  left:50%;
  right:auto;
  top:calc(100% + 8px);
  transform:translateX(-50%);
  width:min(220px, 100%);
  max-height:230px;
  overflow-y:auto;
  overflow-x:hidden;
  background:var(--color-surface);
  border:1px solid rgba(15,23,42,.08);
  border-radius:26px;
  box-shadow:0 12px 30px rgba(15,23,42,.24);
  padding:12px;
  display:grid;
  gap:4px;
}
.custom-select.discount-editor-select .cs-option{
  height:42px;
  padding:0 14px;
  border:none;
  border-radius:999px;
  font-size:16px;
  font-weight:800;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  margin:0;
}
.custom-select.discount-editor-select .cs-option:last-child{
  border-bottom:none;
}
.custom-select.discount-editor-select .cs-option:hover{
  background:var(--color-surface-2);
}
.custom-select.discount-editor-select .cs-option.is-selected{
  color:var(--color-text);
  font-weight:800;
  background:var(--color-surface-2);
}
.discount-editor-inline-row{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
  align-items:end;
}
.discount-editor-inline-row--value{
  grid-template-columns:minmax(0, 1fr);
  justify-content:center;
}
.discount-editor-inline-row--generator{
  grid-template-columns:minmax(0, 1fr) minmax(0, .8fr) auto;
}
#de_promo_product_discount_row{
  grid-template-columns:minmax(0, 1fr) minmax(0, .78fr);
}
#de_simple_regular_wrap,
#de_simple_value_row,
#de_promo_reward_row,
#de_buy_reward_discount_wrap > .discount-editor-inline-row--value,
#de_progress_reward_discount_wrap > .discount-editor-inline-row--value,
#de_products_wrap,
#de_promo_products_wrap,
#de_progress_discount_products_wrap,
#de_customers_wrap{
  width:100%;
  max-width:100%;
}
#de_simple_value_row,
#de_promo_reward_row,
#de_buy_reward_discount_wrap > .discount-editor-inline-row--value,
#de_progress_reward_discount_wrap > .discount-editor-inline-row--value{
  grid-template-columns:minmax(0, 1fr);
}
#de_promo_reward_row{
  grid-template-columns:minmax(0, 1fr);
}
#de_promo_reward_variant_product_wrap{
  grid-column:1 / -1;
}
#de_promo_discount_row{
  display:grid;
  gap:8px;
}
.discount-promo-apply-chips{
  display:flex;
  flex-wrap:nowrap;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  padding-bottom:4px;
  gap:8px;
  scrollbar-width:none;
}
.discount-promo-mode-chips{
  display:flex;
  flex-wrap:nowrap;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  padding-bottom:4px;
  gap:8px;
  scrollbar-width:none;
}
.discount-promo-reward-chips{
  display:flex;
  flex-wrap:nowrap;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  padding-bottom:4px;
  gap:8px;
  grid-column:1 / -1;
  scrollbar-width:none;
}
.discount-promo-apply-chips::-webkit-scrollbar,
.discount-promo-mode-chips::-webkit-scrollbar,
.discount-promo-reward-chips::-webkit-scrollbar{
  width:0;
  height:0;
}
.discount-promo-apply-chip{
  min-height:36px;
  padding:8px 14px;
  flex:0 0 auto;
  white-space:nowrap;
}
.discount-promo-apply-chip.is-active,
.discount-promo-apply-chip[aria-pressed="true"]{
  border-color:var(--shop-buy);
  background:var(--color-surface);
  color:var(--color-text);
  box-shadow:0 0 0 1px var(--shop-buy);
}
.discount-help-row{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
}
.discount-help-row > .discount-choice-scroll,
.discount-help-row > .discount-promo-apply-chips,
.discount-help-row > .discount-promo-mode-chips,
.discount-help-row > .discount-promo-reward-chips,
.discount-help-row > .discount-restriction-chip-row{
  min-width:0;
  flex:1 1 auto;
}
.discount-help-row > .discount-choice-scroll{
  width:100%;
}
.discount-editor-section--centered > .field-wrap,
.discount-editor-section--centered > .discount-help-row,
.discount-editor-section--centered > .discount-editor-inline-row,
.discount-editor-section--centered > .form-row-2,
.discount-editor-section--centered > .discount-buy-visual-card,
.discount-editor-section--centered > .discount-selection-visual-card,
.discount-editor-section--centered > .discount-editor-section-title,
.discount-editor-section--centered > .discount-promo-panel-title,
.discount-editor-section--centered > .discount-promo-panel-text,
.discount-editor-section--centered > .discount-promo-apply-row,
.discount-editor-centered-flow > .field-wrap,
.discount-editor-centered-flow > .discount-help-row,
.discount-editor-centered-flow > .discount-editor-inline-row,
.discount-editor-centered-flow > .form-row-2,
.discount-editor-centered-flow > .discount-buy-visual-card,
.discount-editor-centered-flow > .discount-selection-visual-card{
  width:min(100%, var(--discount-editor-center-max));
  margin-inline:auto;
}
#de_promo_wrap > #de_promo_shared_wrap,
#de_promo_wrap > #de_promo_unique_wrap,
#de_promo_wrap > #de_promo_codes_wrap,
#de_customers_wrap{
  width:100%;
  margin-inline:auto;
}
.discount-editor-section--centered .discount-promo-apply-chips,
.discount-editor-section--centered .discount-promo-mode-chips,
.discount-editor-section--centered .discount-promo-reward-chips,
.discount-editor-centered-flow .discount-promo-apply-chips,
.discount-editor-centered-flow .discount-promo-mode-chips,
.discount-editor-centered-flow .discount-promo-reward-chips{
  justify-content:center;
}
#de_audience_mode_chips,
.discount-editor-section--centered #de_audience_mode_chips{
  justify-content:center;
}
#de_buy_x_get_y_wrap > .form-row-2 > .field-wrap,
#de_loyalty_progress_wrap > .form-row-2 > .field-wrap,
#de_threshold_wrap > .field-wrap{
  display:grid;
  justify-items:center;
  text-align:center;
}
#de_buy_x_get_y_wrap > .form-row-2 .field-label,
#de_loyalty_progress_wrap > .form-row-2 .field-label,
#de_threshold_wrap > .field-wrap .field-label{
  text-align:center;
}
.discount-editor-section--centered .discount-restriction-chip-row,
.discount-editor-section--centered .discount-restriction-fields{
  width:min(100%, var(--discount-editor-center-max));
  margin-inline:auto;
}
.discount-inline-value-field{
  width:100%;
}
.discount-inline-value-control{
  min-height:48px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:5px 6px 5px 16px;
  border:1px solid var(--color-border);
  border-radius:999px;
  background:var(--color-surface);
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.discount-inline-value-control:focus-within{
  border-color:var(--primary-45);
  box-shadow:0 0 0 3px rgba(248,122,31,.10);
  background:var(--color-surface);
}
.discount-inline-value-input.control{
  flex:1 1 auto;
  min-width:0;
  height:36px;
  border:none;
  background:transparent;
  box-shadow:none;
  padding:0;
}
.discount-inline-value-input.control:focus{
  box-shadow:none;
}
.discount-inline-value-input.control::-webkit-outer-spin-button,
.discount-inline-value-input.control::-webkit-inner-spin-button{
  margin:0;
}
.discount-inline-value-toggle{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:4px;
  padding-left:8px;
  border-left:1px solid var(--color-border);
}
.discount-inline-value-type{
  width:34px;
  height:34px;
  min-width:34px;
  border:none;
  border-radius:999px;
  background:transparent;
  color:var(--color-text-muted);
  display:grid;
  place-items:center;
  padding:0;
  cursor:pointer;
  transition:background .16s ease, color .16s ease, box-shadow .16s ease;
}
.discount-inline-value-type:hover,
.discount-inline-value-type:focus-visible{
  background:var(--color-surface-2);
  color:var(--color-text);
}
.discount-inline-value-type:focus-visible{
  outline:none;
}
.discount-inline-value-type.is-active{
  background:var(--primary-14);
  color:var(--color-primary);
  box-shadow:inset 0 0 0 1px rgba(248,122,31,.18);
}
.discount-inline-value-type.hidden{
  display:none;
}
.discount-inline-value-type-symbol,
.discount-inline-value-type i{
  font-size:14px;
  line-height:1;
  font-weight:800;
}
#de_promo_generate_count{
  text-align:center;
}
.discount-editor-inline-row > .field-wrap,
.discount-editor-inline-row > .discount-editor-action-cell,
#discountEditorForm .form-row-2 > .field-wrap,
.discount-restrictions-inline-grid > .field-wrap{
  min-width:0;
}
.discount-editor-action-cell{
  display:flex;
  align-items:flex-end;
}
.discount-editor-icon-btn{
  width:42px;
  min-width:42px;
  height:42px;
  padding:0;
  border-radius:10px;
  display:grid;
  place-items:center;
}
.discount-editor-icon-btn i{
  margin:0;
}
#discountEditorForm input.control:not(.hidden):not(.discount-inline-value-input):not(.discount-stepper-input):not([type="datetime-local"]):not([type="time"]):not([type="checkbox"]),
#discountEditorForm textarea.control:not(.hidden){
  height:42px;
  border-radius:20px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  color:var(--color-text);
  padding:0 14px;
}
#discountEditorForm textarea.control:not(.hidden){
  min-height:42px;
  height:auto;
  padding:10px 14px;
  border-radius:20px;
}
.discount-choice-scroll{
  display:flex;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  padding-bottom:4px;
  scrollbar-width:none;
}
.discount-choice-scroll::-webkit-scrollbar{
  width:0;
  height:0;
}
.discount-choice-grid{
  display:flex;
  gap:14px;
  flex-wrap:nowrap;
  width:max-content;
  min-width:max-content;
}
.discount-choice-grid .discount-choice-pill{
  min-width:116px;
  flex:0 0 auto;
}
.discount-choice-grid .cash-payment-method-pill-icon{
  width:84px;
  height:84px;
  border-radius:22px;
  font-size:30px;
}
.discount-choice-grid .cash-payment-method-pill-title{
  font-size:14px;
  white-space:nowrap;
  max-width:none;
}
.discount-promo-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.discount-promo-generate{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.discount-promo-generate .control{
  width:110px;
}
.discount-promo-hint{
  font-size:12px;
  color:var(--color-text-muted);
}
.discount-promo-codes{
  display:grid;
  gap:8px;
}
.discount-promo-list{
  display:grid;
  gap:8px;
}
.discount-promo-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:12px;
  padding:12px;
  border:1px solid var(--color-border);
  border-radius:10px;
  background:var(--color-surface);
  align-items:center;
}
.discount-promo-row--history{
  cursor:pointer;
}
.discount-promo-row--history.is-active{
  border-color:var(--primary-45);
  box-shadow:0 0 0 3px var(--primary-12);
}
.discount-promo-main{
  min-width:0;
}
.discount-promo-code{
  font-size:14px;
  font-weight:700;
  letter-spacing:.06em;
  color:var(--color-text);
}
.discount-promo-assigned{
  margin-top:4px;
  font-size:13px;
  font-weight:600;
  color:var(--color-text);
}
.discount-promo-meta{
  margin-top:4px;
  font-size:12px;
  color:var(--color-text-muted);
}
.discount-promo-actions{
  display:flex;
  align-items:center;
  gap:8px;
  justify-content:flex-end;
}
.discount-promo-status{
  font-size:12px;
  font-weight:600;
  color:var(--color-success, #16a34a);
}
.discount-promo-status.is-inactive{
  color:var(--color-text-muted);
}
.discount-promo-empty{
  font-size:12px;
  color:var(--color-text-muted);
  padding:10px 0;
}
.discount-threshold-list{
  display:grid;
  gap:10px;
}
.discount-threshold-tier{
  border:1px solid var(--color-border);
  border-radius:12px;
  background:var(--color-surface-2);
  padding:12px;
  display:grid;
  gap:10px;
}
.discount-threshold-tier-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.discount-threshold-tier-title{
  font-size:13px;
  font-weight:700;
  color:var(--color-text);
}

.order-item-old-price{
  text-decoration:line-through;
  color:var(--color-text-muted, #999);
  margin-right:6px;
}

/* ================= Stock Documents ================= */
.stock-doc-row{grid-template-columns:1.5fr .6fr .6fr .8fr .6fr}
.chip-success{background:#ecfdf5;border-color:#6ee7b7;color:#047857}
.chip-draft{background:#fef3c7;border-color:#fcd34d;color:#92400e}
.stock-items-list{display:grid;gap:6px}
.stock-item-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;border:1px solid var(--color-border);background:#fff}
.stock-item-photo{width:36px;height:36px;border-radius:8px;object-fit:cover;flex-shrink:0}
.stock-item-photo-empty{width:36px;height:36px;border-radius:8px;background:var(--color-surface-2);display:flex;align-items:center;justify-content:center;color:var(--color-text-muted);flex-shrink:0;font-size:14px}
.stock-item-info{flex:1;min-width:0}
.stock-item-name{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stock-item-meta{font-size:12px;color:#6b7280}
.stock-item-del{flex-shrink:0}
.stock-item-editable{flex-direction:column;align-items:stretch;gap:6px}
.stock-item-header{display:flex;align-items:center;gap:10px}
.stock-item-header .stock-item-name{flex:1;min-width:0}
.stock-item-fields{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:6px}
.stock-item-field .field-label{font-size:11px;margin-bottom:2px;color:#6b7280}
.stock-item-field .control-sm{height:32px;font-size:13px;padding:4px 8px}

/* ================= Chat page ================= */
body.page-chat{
  --chat-wallpaper-base:#f0f3eb;
  --chat-wallpaper-pattern:url("/static/assets/chat-wallpaper-desktop.webp?v=20260320b");
  --chat-wallpaper-size:cover;
  position:relative;
  overscroll-behavior-y:none;
}

@media (max-width:768px){
  body.page-chat{
    --chat-wallpaper-pattern:url("/static/assets/chat-wallpaper-mobile.webp?v=20260320d");
    --chat-wallpaper-size:auto 112%;
  }
}

body.page-chat .page-col{
  min-height:0;
}

body.page-chat .panel{
  min-height:0;
}

/* Left: clients with open chats */
.chat-clients-panel{
  display:flex;
  flex-direction:column;
  min-height:calc(100vh - var(--header-height) - var(--column-bottom-gap));
}

.chat-clients-body{
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  gap:10px;
  overflow-y:auto;
  overflow-x:hidden;
  min-height:0;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-y:contain;
  touch-action:pan-y;
  -ms-overflow-style:none;
  scrollbar-width:none;
}

.chat-clients-body::after{
  display:none;
}

.chat-clients-body::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}

.chat-clients-search{
  position:relative;
  display:block;
  padding:0 2px;
  color:var(--color-text-muted);
}

.chat-clients-search > i{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  font-size:16px;
  pointer-events:none;
  z-index:2;
}

.chat-clients-search .control{
  min-width:0;
  padding-left:34px;
  font-size:16px;
}

.chat-clients-search .control::placeholder{
  font-size:12px;
  color:var(--color-text-muted);
  opacity:.9;
}

.chat-clients-list{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  flex:0 0 auto;
  width:100%;
  gap:6px;
  min-width:0;
  min-height:auto;
  max-height:none;
  overflow:visible;
  padding-right:0;
}

.chat-client-row{
  flex:0 0 auto;
  width:100%;
  min-width:0;
  box-sizing:border-box;
  background:transparent;
  border:0;
  border-radius:12px;
  padding:0;
  display:block;
  position:relative;
  overflow:hidden;
  color:var(--color-text);
  text-align:left;
  transition:background var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth);
}

.chat-client-row-main{
  appearance:none;
  width:100%;
  min-width:0;
  box-sizing:border-box;
  border:0;
  border-radius:12px;
  background:transparent;
  padding:8px 8px;
  display:block;
  position:relative;
  z-index:1;
  text-align:left;
  color:inherit;
  cursor:pointer;
  touch-action:pan-y;
  -webkit-tap-highlight-color:transparent;
  transition:
    transform 160ms cubic-bezier(.2,.8,.25,1),
    background var(--dur-fast) var(--ease-smooth),
    color var(--dur-fast) var(--ease-smooth);
}

.chat-client-row:hover .chat-client-row-main,
.chat-client-row-main:focus-visible{
  background:color-mix(in srgb, var(--color-surface-2), transparent 8%);
}

.chat-client-row.is-active .chat-client-row-main{
  background:color-mix(in srgb, var(--color-surface-2), #94a3b8 10%);
}

.chat-client-row.is-swipe-dragging .chat-client-row-main{
  transition:none;
}

.chat-client-row-actions{
  position:absolute;
  inset:0;
  display:flex;
  justify-content:flex-end;
  align-items:stretch;
  z-index:0;
  opacity:0;
  pointer-events:none;
  transition:opacity 120ms ease;
}

.chat-client-row.is-swipe-open .chat-client-row-actions,
.chat-client-row.is-swipe-dragging .chat-client-row-actions{
  opacity:1;
  pointer-events:auto;
}

.chat-client-row-action{
  width:92px;
  min-width:92px;
  border:0;
  border-radius:0;
  display:grid;
  place-items:center;
  padding:10px 8px;
  font-size:13px;
  font-weight:700;
  line-height:1.05;
  color:#fff;
  cursor:pointer;
}

.chat-client-row-action.is-clear{
  background:#d7942b;
}

.chat-client-row-action.is-delete{
  background:#df4b3b;
}

.chat-client-main{
  min-width:0;
  display:grid;
  gap:2px;
}

.chat-client-top{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:start;
  gap:8px;
}

.chat-client-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:700;
  font-size:16px;
  line-height:1.22;
}

.chat-client-time-wrap{
  margin-top:1px;
  display:inline-flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;
  overflow:visible;
  flex-shrink:0;
}

.chat-client-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#8b949e;
  transform:translateY(.5px);
}

.chat-client-status .chat-message-status-icon{
  width:22px;
  height:16px;
}

.chat-client-status .chat-message-status-icon path{
  stroke-width:2;
}

.chat-client-status--read{
  color:#22c55e;
}

.chat-client-status--sent,
.chat-client-status--delivered{
  color:#8b949e;
}

.chat-client-time{
  flex-shrink:0;
  overflow:visible;
  text-overflow:clip;
  font-size:13px;
  color:var(--color-text-muted);
  white-space:nowrap;
  line-height:1.2;
}

.chat-client-bottom{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:8px;
}

.chat-client-preview{
  min-width:0;
  max-width:100%;
  display:block;
  font-size:14px;
  color:var(--color-text-muted);
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.chat-client-preview.is-draft{
  color:var(--color-text-muted);
}

.chat-client-preview-draft-label{
  color:var(--color-danger, #d35454);
  font-weight:700;
}

.chat-client-preview-draft-text{
  color:inherit;
}


.chat-client-preview.is-typing{
  color:var(--accent-primary);
  font-weight:600;
  display:inline-flex;
  align-items:center;
}

.chat-client-preview.is-typing::after{
  content:"";
  display:inline-block;
  min-width:1.8em;
  margin-left:2px;
  text-align:left;
  animation:chat-typing-indicator-dots 1.1s steps(1, end) infinite;
}

.chat-client-unread{
  flex-shrink:0;
  min-width:24px;
  height:24px;
  border-radius:999px;
  background:#b8bec6;
  color:#fff;
  font-size:13px;
  font-weight:700;
  display:grid;
  place-items:center;
  padding:0 7px;
  line-height:1;
}

/* Center: chat */
.chat-center-stack > .panel{
  min-height:0;
}

.chat-center-stack > .panel:first-child{
  flex:0 0 auto;
}

.chat-center-stack > .panel.chat-header-island,
.chat-center-stack > .panel.chat-footer-island{
  flex:0 0 auto;
}

.chat-center-stack{
  position:relative;
  gap:0;
  --chat-mobile-keyboard-inset:0px;
  --chat-scroll-down-composer-extra:0px;
  --chat-android-viewport-shift:0px;
}

.chat-center-stack > .panel.chat-main-panel{
  flex:1 1 auto;
  min-height:0;
}

.chat-main-panel{
  display:flex;
  flex-direction:column;
  position:relative;
  overflow:hidden;
}

.chat-main-panel > .panel-body{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
}

.chat-startup-splash{
  position:fixed;
  inset:0;
  z-index:99999;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:1;
  pointer-events:auto;
  transition:opacity .3s ease;
}

@media (max-width: 900px){
  body.page-chat.chat-startup-splash-active > *:not(#chatStartupSplash){
    visibility:hidden !important;
  }

  body.page-chat.chat-startup-splash-active #chatStartupSplash{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
}

.chat-startup-splash.hidden{
  display:none;
}

.chat-startup-splash.is-done{
  opacity:0;
  pointer-events:none;
}

.chat-startup-splash__inner{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
}

.chat-startup-splash__track{
  width:48px;
  height:3px;
  background:#eee;
  border-radius:2px;
  overflow:hidden;
}

.chat-startup-splash__bar{
  width:40%;
  height:100%;
  background:#f60;
  border-radius:2px;
  animation:chat-startup-splash-bar 1.2s ease-in-out infinite;
}

@keyframes chat-startup-splash-bar{
  0%{transform:translateX(-100%)}
  50%{transform:translateX(150%)}
  100%{transform:translateX(-100%)}
}

.chat-bootstrap-loader{
  position:absolute;
  inset:0;
  z-index:9;
  display:grid;
  align-content:center;
  gap:18px;
  padding:20px;
  background:
    radial-gradient(circle at 16% 12%, color-mix(in srgb, var(--primary-14), transparent 58%), transparent 40%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface-2), transparent 24%), color-mix(in srgb, var(--color-surface), #fff 4%));
  transition:opacity .2s ease, visibility .2s ease;
}

.chat-bootstrap-loader.hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.chat-bootstrap-loader-row{
  display:flex;
  align-items:center;
  gap:10px;
  max-width:280px;
}

.chat-bootstrap-loader-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background:color-mix(in srgb, var(--color-primary), #fff 12%);
  box-shadow:0 0 0 7px color-mix(in srgb, var(--primary-14), transparent 45%);
}

.chat-bootstrap-loader-line{
  height:12px;
  border-radius:999px;
  flex:1 1 auto;
  min-width:0;
  background:
    linear-gradient(90deg,
      color-mix(in srgb, var(--color-border), transparent 15%) 25%,
      color-mix(in srgb, #fff, var(--color-border) 35%) 50%,
      color-mix(in srgb, var(--color-border), transparent 15%) 75%);
  background-size:240% 100%;
  animation:chat-bootstrap-shimmer 1.35s ease-in-out infinite;
}

.chat-bootstrap-loader-bubbles{
  display:grid;
  gap:10px;
  max-width:min(560px, 100%);
}

.chat-bootstrap-loader-bubble{
  height:56px;
  border-radius:16px;
  background:
    linear-gradient(90deg,
      color-mix(in srgb, var(--color-surface-2), transparent 5%) 25%,
      color-mix(in srgb, #fff, var(--color-surface-2) 48%) 50%,
      color-mix(in srgb, var(--color-surface-2), transparent 5%) 75%);
  background-size:220% 100%;
  animation:chat-bootstrap-shimmer 1.5s ease-in-out infinite;
}

.chat-bootstrap-loader-bubble:nth-child(2){
  width:82%;
}

.chat-bootstrap-loader-bubble:nth-child(3){
  width:66%;
}

@keyframes chat-bootstrap-shimmer{
  0%{background-position:100% 0;}
  100%{background-position:-100% 0;}
}

.chat-mobile-clients-back,
.chat-mobile-clients-close{
  display:none;
  width:40px;
  height:40px;
  border:0;
  border-radius:50%;
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.chat-clients-panel .panel-header .panel-title{
  order:1;
}

.chat-mobile-clients-close{
  order:2;
  margin-left:auto;
}

.chat-mobile-clients-back:hover,
.chat-mobile-clients-close:hover{
  color:var(--color-text);
}

.chat-header-island{
  flex:0 0 auto;
  border:0;
  box-shadow:none;
}

@media (min-width:769px){
  body.page-chat .chat-center-stack > .panel.chat-header-island{
    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-sm);
    overflow:visible;
  }
}

.chat-header-toolbar{
  justify-content:stretch;
  align-items:center;
  width:100%;
}

.chat-mobile-subheader{
  display:none;
}

.chat-mobile-subheader-btn{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  color:var(--color-text);
}

.chat-mobile-subheader-loading{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.chat-main-user{
  min-width:0;
  display:grid;
  gap:2px;
}

.chat-main-user-name{
  font-size:16px;
  font-weight:700;
  color:var(--color-text);
}

.chat-main-user-meta{
  font-size:13px;
  color:var(--color-text-muted);
}

.chat-main-order.order-row{
  flex:1 1 auto;
  min-width:0;
  width:100%;
  cursor:default;
  user-select:text;
  transform:none !important;
  box-shadow:none !important;
  grid-template-columns:70px 58px 220px minmax(0,1fr) auto 120px;
  gap:8px;
}

.chat-main-order.order-row.is-order-openable{
  cursor:pointer;
  user-select:none;
}

.chat-main-order.order-row.is-order-openable:focus-visible{
  outline:2px solid var(--primary-45);
  outline-offset:2px;
}

.chat-main-order.order-row:hover{
  transform:none;
  box-shadow:none;
  background:var(--color-surface);
}

.chat-main-order .order-col{
  min-width:0;
}

.chat-desktop-order-header.order-row{
  position:relative;
  flex:1 1 auto;
  min-width:0;
  width:100%;
  cursor:default;
  user-select:text;
  transform:none !important;
  box-shadow:none !important;
  border:0;
  border-radius:0;
  background:transparent;
  padding:0;
  grid-template-columns:70px 58px 170px minmax(0,1fr) max-content max-content;
  gap:8px;
}

.chat-desktop-order-header.order-row.is-order-openable{
  cursor:pointer;
  user-select:none;
}

.chat-desktop-order-header.order-row.is-order-openable:focus-visible{
  outline:2px solid var(--primary-45);
  outline-offset:2px;
}

.chat-desktop-order-header.order-row:hover{
  transform:none;
  box-shadow:none;
  background:transparent;
}

.chat-desktop-order-header .order-col{
  min-width:0;
}

.chat-desktop-order-header .order-col.order-client{
  min-width:170px;
}

.chat-desktop-order-header .order-client-name,
.chat-desktop-order-header .order-client-name-text,
.chat-desktop-order-header .order-client-phone,
.chat-desktop-order-header .order-client-phone-text,
.chat-desktop-order-header .order-address-line,
.chat-desktop-order-header .order-address-line span,
.chat-desktop-order-header .order-address-comment,
.chat-desktop-order-header .order-address-comment span{
  min-width:0;
}

.chat-desktop-order-header .order-client-name-text,
.chat-desktop-order-header .order-client-phone-text,
.chat-desktop-order-header .order-address-line span,
.chat-desktop-order-header .order-address-comment span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.chat-desktop-order-header .order-col.order-address{
  padding-left:4px;
}

.chat-desktop-order-header .order-client-phone{
  display:grid;
  grid-template-columns:16px minmax(0,1fr);
  align-items:center;
  column-gap:6px;
}

.chat-desktop-order-header .order-client-phone i{
  width:16px;
  margin-right:0;
  text-align:center;
}

.chat-main-order-top,
.chat-main-order-bottom{
  display:contents;
}

.chat-main-order .order-col.order-client{
  min-width:200px;
}

.chat-main-order .order-client-name{
  min-width:0;
}

.chat-main-order .order-client-name-text{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.chat-header-client-link{
  flex:1 1 auto;
  min-width:0;
  max-width:100%;
  overflow:hidden;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  line-height:inherit;
  text-align:left;
  display:inline-flex;
  align-items:center;
  cursor:default;
}

.chat-header-client-link .order-client-name-text{
  display:block;
  max-width:100%;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.chat-header-client-link.is-openable{
  cursor:pointer;
}

.chat-header-client-link.is-openable:hover .order-client-name-text,
.chat-header-client-link.is-openable:focus-visible .order-client-name-text{
  color:var(--color-primary);
}

.chat-header-client-link:focus-visible{
  outline:none;
}

.chat-header-client-link:disabled{
  opacity:1;
}

.chat-main-order .order-col.order-address{
  padding-left:4px;
}

.chat-main-order .order-client-phone{
  display:grid;
  grid-template-columns:16px minmax(0,1fr);
  align-items:center;
  column-gap:6px;
}

.chat-main-order .order-client-phone i{
  width:16px;
  margin-right:0;
  text-align:center;
}

.chat-main-order .order-client-phone-text{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.chat-header-loading{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  display:inline-flex;
  align-items:center;
  gap:10px;
  z-index:3;
  pointer-events:none;
}

.chat-header-loading-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:color-mix(in srgb, var(--color-text-muted), #64748b 22%);
  opacity:.52;
  animation:chat-header-loading-dot 1.05s ease-in-out infinite;
}

.chat-header-loading-dot:nth-child(2){
  animation-delay:.14s;
}

.chat-header-loading-dot:nth-child(3){
  animation-delay:.28s;
}

@keyframes chat-header-loading-dot{
  0%, 80%, 100%{
    transform:translateY(0) scale(.88);
    opacity:.34;
  }
  40%{
    transform:translateY(-3px) scale(1.16);
    opacity:.96;
  }
}

.chat-main-order.order-row{
  position:relative;
}

.chat-main-order.order-row.is-chat-header-loading .order-col,
.chat-main-order.order-row.is-chat-header-loading .chat-mobile-clients-back{
  visibility:hidden;
}

.chat-main-order-idcol{
  text-align:center;
}

.chat-main-order .order-stage{
  justify-content:center;
}

.chat-main-order .chat-main-order-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:0 15px;
  border-radius:999px;
  border:1px solid var(--color-border);
  font-size:14px;
  font-weight:700;
  line-height:1;
  color:var(--color-text);
  white-space:nowrap;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}

.chat-main-order .chat-main-order-status-icon{
  display:none;
  flex:0 0 auto;
  width:14px;
  height:14px;
  object-fit:contain;
}

.chat-main-order .chat-main-order-status-text{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}

.chat-main-order .chat-main-order-status.is-empty{
  color:var(--color-text-muted);
  background:var(--color-surface-2);
}

.chat-main-order .chat-main-order-total{
  cursor:default;
  pointer-events:none;
  min-width:0;
  min-height:32px;
  padding:0 12px;
  border-radius:8px;
  font-size:14px;
  font-weight:700;
  line-height:1;
}

.chat-main-order .chat-main-order-total.is-empty{
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
  color:var(--color-text-muted);
}

.chat-desktop-order-header.order-row.is-chat-header-loading .order-col{
  visibility:hidden;
}

.chat-desktop-order-header .order-stage{
  justify-content:center;
}

.chat-desktop-order-header .chat-main-order-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:0 15px;
  border-radius:999px;
  border:1px solid var(--color-border);
  font-size:14px;
  font-weight:700;
  line-height:1;
  color:var(--color-text);
  white-space:nowrap;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}

.chat-desktop-order-header .chat-main-order-status.is-empty{
  color:var(--color-text-muted);
  background:var(--color-surface-2);
}

.chat-desktop-order-header .chat-order-header-total{
  cursor:default;
  pointer-events:none;
  min-width:0;
  min-height:32px;
  padding:0 12px;
  border-radius:8px;
  font-size:14px;
  font-weight:700;
  line-height:1;
}

.chat-desktop-order-header .chat-order-header-total.is-empty{
  background:var(--color-surface-2);
  border:1px solid var(--color-border);
  color:var(--color-text-muted);
}

.chat-desktop-order-header .chat-order-header-total .order-payment-btn-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
}

.chat-desktop-order-header .chat-order-header-total .order-payment-btn-content{
  gap:1px;
}

.chat-desktop-order-header .chat-order-header-total .order-payment-btn-total{
  font-size:14px;
}

.chat-desktop-order-header .chat-order-header-total .order-payment-btn-status{
  margin-top:1px;
  font-size:10px;
}

.chat-main-body{
  flex:1;
  min-height:0;
  position:relative;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
  --chat-tail-cut-bg:var(--chat-wallpaper-base);
  background-color:var(--chat-wallpaper-base);
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.40), rgba(255,255,255,.58)),
    var(--chat-wallpaper-pattern),
    radial-gradient(circle at 16% 10%, rgba(255,255,255,.16), transparent 36%),
    radial-gradient(circle at 84% 14%, rgba(245,225,138,.08), transparent 32%),
    linear-gradient(180deg, #f7f8f4 0%, #f0f3eb 42%, #ebefe5 100%);
  background-position:0 0, center center, 0 0, 0 0, 0 0;
  background-repeat:no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
  background-size:100% 100%, var(--chat-wallpaper-size), 100% 100%, 100% 100%, 100% 100%;
}

.chat-main-body.is-bootstrap-loading{
  overflow:hidden;
}

.chat-main-body.is-bootstrap-loading .chat-empty-state,
.chat-main-body.is-bootstrap-loading .chat-messages{
  visibility:hidden;
}

.chat-main-body > .chat-empty-state,
.chat-main-body > .chat-messages{
  transform:none;
  will-change:auto;
}

.chat-main-body:focus{
  outline:none;
}

.chat-main-body::after{
  display:none;
}

#chatHeaderOrder.is-order-empty::after{
  content:"Выберите клиента";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  font-size:16px;
  font-weight:800;
  color:var(--color-text);
  pointer-events:none;
  white-space:nowrap;
  z-index:2;
}

#chatHeaderOrder.is-order-empty > *{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

/* Must stay hidden even when shop.css is loaded later by clients.js */
body.page-chat .chat-main-panel > .chat-main-body.panel-body::after{
  content:none !important;
  display:none !important;
  height:0 !important;
}

body.page-chat .chat-main-panel > .chat-main-body{
  padding-bottom:0 !important;
}

body.page-chat .chat-main-panel > .chat-main-body > .chat-messages{
  margin-bottom:0 !important;
  padding-bottom:12px !important;
}

.chat-main-body.is-selection-mode::before{
  display:none;
}

.chat-main-body.is-image-drop-target::before{
  content:"\041F\0435\0440\0435\0442\0430\0449\0438\0442\0435\0020\0438\0437\043E\0431\0440\0430\0436\0435\043D\0438\044F\0020\0441\044E\0434\0430\A\0414\043B\044F\0020\0431\044B\0441\0442\0440\043E\0439\0020\043E\0442\043F\0440\0430\0432\043A\0438";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  width:min(560px, calc(100% - 56px));
  min-height:176px;
  padding:24px 20px;
  box-sizing:border-box;
  z-index:7;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  white-space:pre-line;
  font-size:20px;
  line-height:1.28;
  font-weight:700;
  color:color-mix(in srgb, var(--color-primary), #1e293b 24%);
  border:2px dashed color-mix(in srgb, var(--color-primary), #fff 16%);
  border-radius:20px;
  background:color-mix(in srgb, var(--primary-14), transparent 36%);
  pointer-events:none;
}

.chat-empty-state{
  min-height:100%;
}

.chat-messages{
  min-height:100%;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:8px;
  padding:12px;
  position:relative;
  z-index:2;
}

.chat-main-body.is-selection-mode .chat-messages{
  padding-left:42px;
}

.chat-scroll-down{
  position:absolute;
  right:18px;
  bottom:28px;
  width:44px;
  height:44px;
  border-radius:50%;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text-muted);
  box-shadow:0 10px 24px rgba(15, 23, 42, 0.12);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transform:translateY(0);
  filter:blur(0);
  will-change:transform, opacity, filter;
  transition:
    right 280ms cubic-bezier(.22,.76,.24,1),
    bottom 280ms cubic-bezier(.22,.76,.24,1),
    opacity 260ms cubic-bezier(.22,.61,.36,1),
    transform 280ms cubic-bezier(.22,.61,.36,1),
    filter 260ms cubic-bezier(.22,.61,.36,1);
  z-index:5;
  touch-action:manipulation;
}

.chat-scroll-down.hidden{
  opacity:0;
  pointer-events:none;
  transform:translateY(30px) scale(.82);
  filter:blur(2px);
  animation:chat-scroll-down-hide 240ms cubic-bezier(.4,0,.2,1) both;
}

.chat-scroll-down:not(.hidden){
  animation:chat-scroll-down-rise 320ms cubic-bezier(.2,.8,.2,1) both;
}

@keyframes chat-scroll-down-rise{
  0%{
    opacity:0;
    transform:translateY(34px) scale(.72);
    filter:blur(2px);
  }
  70%{
    opacity:1;
    transform:translateY(-4px) scale(1.06);
    filter:blur(0);
  }
  100%{
    opacity:1;
    transform:translateY(0) scale(1);
    filter:blur(0);
  }
}

@keyframes chat-scroll-down-hide{
  0%{
    opacity:1;
    transform:translateY(0) scale(1);
    filter:blur(0);
  }
  100%{
    opacity:0;
    transform:translateY(30px) scale(.82);
    filter:blur(2px);
  }
}

.chat-typing-indicator{
  align-self:flex-start;
  max-width:min(86%, 520px);
  padding:0;
  border:none;
  background:transparent;
  color:var(--color-text-muted);
  font-size:13px;
  font-weight:500;
  line-height:1.35;
  min-height:20px;
  padding-left:14px;
  padding-right:14px;
  display:inline-flex;
  align-items:center;
  pointer-events:none;
  opacity:1;
  transform:translateY(0);
  transition:opacity 180ms ease, transform 180ms ease;
}

.chat-typing-indicator::after{
  content:"";
  display:inline-block;
  min-width:1.8em;
  margin-left:2px;
  text-align:left;
  animation:chat-typing-indicator-dots 1.1s steps(1, end) infinite;
}

.chat-typing-indicator.is-hidden{
  display:none;
  opacity:0;
  transform:translateY(8px);
}

.chat-typing-indicator.is-hidden::after{
  content:"";
  animation:none;
}

@keyframes chat-typing-indicator-dots{
  0%, 20%{ content:""; }
  40%{ content:"."; }
  60%{ content:".."; }
  80%, 100%{ content:"..."; }
}

.chat-scroll-down-badge{
  position:absolute;
  top:-6px;
  right:-6px;
  min-width:24px;
  height:24px;
  padding:0 6px;
  border-radius:999px;
  border:2px solid var(--color-surface);
  background:#22c55e;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  line-height:1;
  font-weight:700;
  box-sizing:border-box;
}

.chat-scroll-down-badge.is-count-tick{
  animation:chat-scroll-down-badge-tick 180ms cubic-bezier(.2,.8,.2,1);
}

@keyframes chat-scroll-down-badge-tick{
  0%{ transform:scale(.72); }
  62%{ transform:scale(1.14); }
  100%{ transform:scale(1); }
}

.chat-scroll-down-badge.hidden{
  display:none;
}

.chat-local-empty{
  margin:auto;
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--color-text-muted);
  font-size:13px;
}

.chat-day-separator{
  align-self:center;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  min-height:28px;
  padding:4px 12px;
  border-radius:999px;
  background:rgba(112, 150, 95, .78);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
  font-size:12px;
  font-weight:700;
  line-height:1.2;
  margin:8px 0 6px;
  box-shadow:0 8px 18px rgba(73, 104, 61, .14);
  backdrop-filter:blur(6px) saturate(135%);
  -webkit-backdrop-filter:blur(6px) saturate(135%);
}

.chat-message{
  display:grid;
  gap:4px;
  max-width:min(86%, 520px);
  position:relative;
  transition:transform .15s ease;
  -webkit-touch-callout:none;
}

.chat-message *{
  -webkit-touch-callout:none;
}

.chat-message.is-mobile-context-source-hidden{
  visibility:hidden;
}

.chat-message--in{
  align-self:flex-start;
}

.chat-message--out{
  align-self:flex-end;
}

.chat-message-bubble{
  border-radius:18px;
  padding:12px 14px 8px;
  font-size:16px;
  line-height:1.35;
  border:0;
  background:var(--color-surface-2);
  color:var(--color-text);
  word-break:break-word;
  position:relative;
  display:grid;
  gap:6px;
  box-shadow:none;
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  user-select:none;
}

.chat-message-bubble.is-swipe-active{
  transition:none;
}

.chat-message-bubble.is-swipe-returning{
  transition:transform 160ms cubic-bezier(.2,.8,.25,1);
}

.chat-message-text{
  min-width:0;
  word-break:break-word;
  overflow-wrap:anywhere;
  padding-right:72px;
}

.chat-auto-link{
  color:inherit;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:2px;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.chat-message-bubble--order-card .chat-message-text{
  padding-right:0;
}

.chat-message-bubble--order-card{
  padding-bottom:26px;
}

.chat-message-order-cards{
  margin-top:8px;
  display:flex;
  align-items:stretch;
  gap:8px;
  min-width:0;
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:none;
  touch-action:pan-x;
  overscroll-behavior-x:contain;
  cursor:grab;
}

.chat-message-order-cards::-webkit-scrollbar{
  width:0;
  height:0;
}

.chat-message-order-cards.is-mouse-dragging{
  cursor:grabbing;
  user-select:none;
  scroll-snap-type:none;
}

.chat-message-order-cards.is-mouse-dragging *{
  user-select:none;
}

.chat-message-order-card{
  margin-top:0;
  width:172px;
  min-width:172px;
  max-width:172px;
  flex:0 0 auto;
  border:1px solid var(--color-border);
  border-radius:12px;
  background:var(--color-surface);
  color:var(--color-text);
  padding:8px 9px;
  display:grid;
  gap:4px;
  text-align:left;
  cursor:pointer;
  transition:border-color .16s ease, transform .16s ease, background .16s ease;
  scroll-snap-align:start;
}

.chat-message-order-card:hover{
  border-color:color-mix(in srgb, var(--color-primary), var(--color-border) 55%);
  background:color-mix(in srgb, var(--color-surface), var(--color-primary) 4%);
  transform:translateY(-1px);
}

.chat-message-order-card:focus-visible{
  outline:2px solid color-mix(in srgb, var(--color-primary), #fff 40%);
  outline-offset:2px;
}

.chat-message-order-card__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}

.chat-message-order-card__title{
  font-size:14px;
  font-weight:800;
  line-height:1.2;
  color:var(--color-text);
  min-width:0;
  flex:1 1 auto;
}

.chat-message-order-card__status{
  font-size:11px;
  line-height:1.2;
  font-weight:700;
  color:var(--color-primary);
  text-align:right;
  white-space:nowrap;
  flex:0 0 auto;
}

.chat-message-order-card__total{
  font-size:14px;
  font-weight:700;
  color:var(--color-text);
}

.chat-message-attachment{
  position:relative;
  max-width:min(214px, 47vw) !important;
  border-radius:12px;
  overflow:hidden;
}

.chat-message-attachment-image{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  cursor:zoom-in;
  -webkit-touch-callout:none;
  -webkit-user-drag:none;
  user-drag:none;
  pointer-events:none;
}

.chat-image-viewer-overlay{
  position:fixed;
  inset:0;
  z-index:171;
  padding:18px;
  display:grid;
  place-items:center;
  background:rgba(15,23,42,.36);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
}

.chat-image-viewer-card{
  width:min(var(--chat-image-viewer-target-width, 1280px), var(--chat-image-viewer-max-width, calc(100vw - 36px)));
  height:min(var(--chat-image-viewer-target-height, 920px), var(--chat-image-viewer-max-height, calc(100vh - 36px)));
  max-width:var(--chat-image-viewer-max-width, calc(100vw - 36px));
  max-height:var(--chat-image-viewer-max-height, calc(100vh - 36px));
  position:relative;
  display:grid;
  place-items:center;
}

.chat-image-viewer-image{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  border-radius:14px;
  background:#090b10;
  box-shadow:0 22px 48px rgba(15,23,42,.28);
  image-rendering:auto;
}

.chat-image-viewer-close{
  position:absolute;
  top:10px;
  right:10px;
  width:38px;
  height:38px;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.88);
  color:var(--color-text);
  display:grid;
  place-items:center;
  cursor:pointer;
  z-index:1;
}

.chat-image-viewer-close:hover{
  background:#fff;
}

.chat-message-reply-snippet{
  min-width:0;
  margin:0 0 2px;
  padding:7px 10px 6px;
  padding-right:72px;
  border-radius:10px;
  border-left:3px solid #6366f1;
  background:rgba(99,102,241,.12);
  display:grid;
  gap:2px;
}

.chat-message.is-edited .chat-message-text,
.chat-message.is-edited .chat-message-reply-snippet{
  padding-right:104px;
}

.chat-message--in .chat-message-text,
.chat-message--in .chat-message-reply-snippet{
  padding-right:46px;
}

.chat-message--in.is-edited .chat-message-text,
.chat-message--in.is-edited .chat-message-reply-snippet{
  padding-right:78px;
}

.chat-message-bubble.has-attachment .chat-message-meta{
  right:8px;
  bottom:6px;
  border-radius:999px;
  padding:2px 6px;
  background:rgba(15,23,42,.24);
  backdrop-filter:blur(2px);
}

.chat-message-bubble.has-attachment-only{
  padding:4px;
}

.chat-message--out .chat-message-bubble.has-attachment-only{
  padding:0;
  overflow:hidden;
}

.chat-message--out .chat-message-bubble.has-attachment-only.has-reaction{
  overflow:visible;
}

.chat-message--out .chat-message-bubble.has-attachment-only .chat-message-attachment{
  border-radius:inherit;
}

.chat-message--in .chat-message-bubble.has-attachment-only{
  padding:0;
  overflow:hidden;
}

.chat-message--in .chat-message-bubble.has-attachment-only.has-reaction{
  overflow:visible;
}

.chat-message--in .chat-message-bubble.has-attachment-only .chat-message-attachment{
  border-radius:inherit;
}

.chat-message-reply-snippet[data-chat-scroll-to-message]{
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}

.chat-message-reply-snippet[data-chat-scroll-to-message]:hover{
  background:rgba(99,102,241,.16);
  transform:translateY(-1px);
}

.chat-message-reply-name{
  min-width:0;
  font-size:13px;
  line-height:1.2;
  font-weight:700;
  color:#4f46e5;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.chat-message-reply-line{
  min-width:0;
  font-size:14px;
  line-height:1.2;
  color:var(--color-text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.chat-message--out .chat-message-bubble{
  background:#5f6167;
  color:#fff;
  border-bottom-right-radius:0;
}

.chat-message--out .chat-message-reply-snippet{
  border-left-color:#86efac;
  background:rgba(255,255,255,.18);
}

.chat-message--out .chat-message-reply-snippet[data-chat-scroll-to-message]:hover{
  background:rgba(255,255,255,.26);
}

.chat-message--out .chat-message-reply-name{
  color:#dcfce7;
}

.chat-message--out .chat-message-reply-line{
  color:rgba(255,255,255,.96);
}

.chat-message--in .chat-message-bubble{
  background:#ffffff;
  border-bottom-left-radius:0;
}

.chat-message-time{
  font-size:12px;
  color:#a5a5ab;
  padding:0;
}


.chat-message-meta{
  display:inline-flex;
  align-items:center;
  gap:4px;
  position:absolute;
  right:10px;
  bottom:8px;
  justify-content:flex-end;
  min-height:0;
  line-height:1;
}

.chat-message-meta-main{
  display:inline-flex;
  align-items:center;
  gap:4px;
}

.chat-message--out .chat-message-time{
  text-align:right;
}

.chat-message--out .chat-message-meta{
  justify-content:flex-end;
}

.chat-message-pin{
  font-size:11px;
  color:var(--color-text-muted);
}

.chat-message-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:22px;
  height:16px;
  line-height:1;
  color:var(--color-text-muted);
  transform:none;
}

.chat-message-status-icon{
  width:22px;
  height:16px;
  display:block;
}

.chat-message-status-icon path{
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.chat-message-status--sent{
  color:#94a3b8;
}

.chat-message-status--delivered{
  color:#94a3b8;
}

.chat-message-status--read{
  color:#38bdf8;
}

.chat-message--out .chat-message-time{
  color:rgba(255,255,255,.75);
}

.chat-message-reaction-pill{
  margin-top:0;
  position:relative;
  transform:none;
  transform-origin:center;
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:26px;
  min-width:26px;
  padding:0 2px;
  border-radius:0;
  border:0;
  background:transparent;
  box-shadow:none;
  font-size:23px;
  line-height:1;
  cursor:pointer;
  outline:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  transition:
    opacity var(--dur-fast) var(--ease-smooth),
    transform var(--dur-fast) var(--ease-smooth);
  will-change:transform, filter, opacity;
  z-index:1;
}

.chat-message-reaction-pill.is-reaction-pop{
  animation:chat-reaction-pill-pop 520ms cubic-bezier(.16,1.18,.3,1) both;
  animation-delay:var(--reaction-pop-delay, 0ms);
}

.chat-message-reaction-pill.is-reaction-pop::after{
  content:none;
  animation:none;
}

.chat-message-reaction-pill.is-reaction-leave{
  pointer-events:none;
  animation:chat-reaction-pill-leave 240ms cubic-bezier(.42,0,.2,1) both;
  animation-delay:var(--reaction-leave-delay, 0ms);
}

.chat-message-reactions{
  position:absolute;
  right:auto;
  left:auto;
  bottom:6px;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:0;
  max-width:none;
}

.chat-message--out .chat-message-reactions{
  right:calc(100% + 6px) !important;
  left:auto !important;
  flex-direction:row-reverse;
}

.chat-mobile-context-scene__clone.chat-message--out .chat-message-reactions{
  right:calc(100% + 6px) !important;
  left:auto !important;
  flex-direction:row-reverse;
}

.chat-message--in .chat-message-reactions{
  left:calc(100% + 6px) !important;
  right:auto !important;
  flex-direction:row;
}

.chat-mobile-context-scene__clone.chat-message--in .chat-message-reactions{
  left:calc(100% + 6px) !important;
  right:auto !important;
  flex-direction:row;
}

.chat-message--in .chat-message-reaction-pill + .chat-message-reaction-pill{
  margin-left:-9px;
}

.chat-mobile-context-scene__clone.chat-message--in .chat-message-reaction-pill + .chat-message-reaction-pill{
  margin-left:-9px;
}

.chat-message--out .chat-message-reaction-pill + .chat-message-reaction-pill{
  margin-right:-9px;
}

.chat-mobile-context-scene__clone.chat-message--out .chat-message-reaction-pill + .chat-message-reaction-pill{
  margin-right:-9px;
}

.chat-message-reaction-pill:hover{
  opacity:.92;
  transform:scale(1.08);
}

.chat-message-reaction-pill:active{
  transform:scale(.96);
  background:transparent !important;
  box-shadow:none !important;
  outline:none !important;
  -webkit-tap-highlight-color:transparent;
}

.chat-message-reaction-pill:focus-visible{
  outline:none;
  box-shadow:none;
  opacity:.9;
}

.chat-message-reaction-pill:focus{
  outline:none;
  box-shadow:none;
}

.chat-message--out .chat-message-reaction-pill{
  right:auto;
  left:auto;
}

@keyframes chat-reaction-pill-pop{
  0%{
    opacity:0;
    transform:translateY(14px) scale(.36) rotate(-16deg);
  }
  38%{
    opacity:1;
    transform:translateY(-9px) scale(1.42) rotate(8deg);
  }
  62%{
    opacity:1;
    transform:translateY(2px) scale(.9) rotate(-5deg);
  }
  82%{
    opacity:1;
    transform:translateY(-2px) scale(1.12) rotate(2deg);
  }
  100%{
    opacity:1;
    transform:translateY(0) scale(1) rotate(0deg);
  }
}

@keyframes chat-reaction-pill-leave{
  0%{
    opacity:1;
    transform:translateY(0) scale(1) rotate(0deg);
  }
  100%{
    opacity:0;
    transform:translateY(-8px) scale(.52) rotate(10deg);
  }
}

@media (prefers-reduced-motion: reduce){
  .chat-message-reaction-pill.is-reaction-pop{
    animation:none;
    opacity:1;
    transform:none;
  }
  .chat-message-reaction-pill.is-reaction-pop::after{
    animation:none;
    content:none;
  }
  .chat-message-reaction-pill.is-reaction-leave{
    animation:none;
    opacity:0;
  }
}

.chat-message-bubble.is-emoji-only{
  background:transparent !important;
  box-shadow:none;
  border-radius:0;
  padding:0;
}

.chat-message-bubble.is-emoji-only .chat-message-text{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  gap:2px;
  line-height:1.05;
  padding-right:0;
}

.chat-message-bubble.is-emoji-only-single .chat-message-text{
  font-size:76px;
  line-height:1;
}

.chat-message-bubble.is-emoji-only-few .chat-message-text{
  font-size:62px;
  line-height:1;
}

.chat-message-bubble.is-emoji-only-many .chat-message-text{
  font-size:52px;
  line-height:1;
}

.chat-message-bubble.is-emoji-only .chat-message-meta{
  position:static;
  display:flex;
  width:max-content;
  margin-top:4px;
  margin-left:auto;
  justify-content:flex-end;
  min-height:14px;
}

.chat-message-bubble.is-emoji-only .chat-message-time{
  color:var(--color-text-muted);
}

.chat-message-bubble.is-emoji-only-single .chat-message-meta{
  gap:4px;
  flex-direction:column;
  align-items:flex-end;
}

.chat-message-bubble.is-emoji-only-single .chat-message-meta-main{
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  gap:4px;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(112,150,95,.78);
  box-shadow:0 8px 18px rgba(73,104,61,.14);
  backdrop-filter:blur(6px) saturate(135%);
  -webkit-backdrop-filter:blur(6px) saturate(135%);
}


.chat-message-bubble.is-emoji-only-single .chat-message-time{
  color:#fff;
}

.chat-message-bubble.is-emoji-only-single .chat-message-status--sent,
.chat-message-bubble.is-emoji-only-single .chat-message-status--delivered{
  color:rgba(255,255,255,.92);
}

.chat-message-bubble.is-emoji-only-single .chat-message-status--read{
  color:#d7f0ff;
}

.chat-message--out .chat-message-bubble.is-emoji-only .chat-message-status--sent,
.chat-message--out .chat-message-bubble.is-emoji-only .chat-message-status--delivered{
  color:#94a3b8;
}

.chat-message--out .chat-message-bubble.is-emoji-only .chat-message-status--read{
  color:#38bdf8;
}

.chat-message-bubble.is-emoji-only-single .chat-emoji-glyph--inline{
  width:76px;
  height:76px;
  margin:0 1px;
  vertical-align:0;
}

.chat-message-bubble.is-emoji-only-few .chat-emoji-glyph--inline{
  width:62px;
  height:62px;
  margin:0 1px;
  vertical-align:0;
}

.chat-message-bubble.is-emoji-only-many .chat-emoji-glyph--inline{
  width:52px;
  height:52px;
  margin:0 1px;
  vertical-align:0;
}

.chat-message.is-selection-mode{
  cursor:pointer;
}

.chat-message.is-selected .chat-message-bubble{
  box-shadow:
    0 0 0 2px rgba(34,197,94,.24),
    0 2px 8px rgba(15,23,42,.05);
}

.chat-message.is-jump-highlight .chat-message-bubble{
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--color-primary), transparent 40%),
    0 6px 18px color-mix(in srgb, var(--color-primary), transparent 78%);
}

.chat-message.is-selected{
  transform:translateY(-1px);
}

.chat-message-select-badge{
  position:absolute;
  left:-30px;
  bottom:8px;
  width:22px;
  height:22px;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.95);
  background:rgba(255,255,255,.25);
  color:#fff;
  display:none;
  align-items:center;
  justify-content:center;
  font-size:11px;
  box-shadow:0 2px 8px rgba(15,23,42,.18);
}

.chat-message.is-selection-mode .chat-message-select-badge{
  display:flex;
}

.chat-message.is-selection-mode .chat-message-select-badge i{
  opacity:0;
}

.chat-message.is-selected .chat-message-select-badge{
  background:#22c55e;
  border-color:#fff;
}

.chat-message.is-selected .chat-message-select-badge i{
  opacity:1;
}

.chat-main-composer{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  width:100%;
  gap:8px;
  min-height:58px;
  padding:8px 10px;
  border:0;
  border-radius:14px;
  background:var(--color-surface-2);
  transition:border-color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth);
}

.chat-main-composer #chatAttachBtn{
  order:1;
  flex:0 0 auto;
}

.chat-main-composer .chat-emoji-wrap{
  order:3;
  flex:0 0 auto;
}

.chat-main-composer #chatSendBtn{
  order:4;
  flex:0 0 auto;
}

.chat-composer-reply{
  order:0;
  flex:1 0 100%;
  min-width:0;
  display:flex;
  align-items:stretch;
  gap:8px;
  padding:6px 8px 6px 6px;
  border-radius:10px;
  background:color-mix(in srgb, var(--color-surface), #c7d2fe 22%);
}

.chat-composer-reply-bar{
  flex:0 0 3px;
  width:3px;
  border-radius:3px;
  background:#6366f1;
}

.chat-composer-reply-content{
  min-width:0;
  flex:1 1 auto;
  display:grid;
  gap:2px;
}

.chat-composer-reply-name{
  min-width:0;
  font-size:13px;
  line-height:1.2;
  font-weight:700;
  color:#4f46e5;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.chat-composer-reply-text{
  min-width:0;
  font-size:14px;
  line-height:1.2;
  color:var(--color-text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.chat-composer-reply-close{
  width:26px;
  height:26px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--color-text-muted);
  display:grid;
  place-items:center;
  cursor:pointer;
  flex-shrink:0;
}

.chat-composer-reply-close:hover{
  color:var(--color-text);
  background:rgba(15,23,42,.08);
}

.chat-main-composer:focus-within{
  border-color:var(--color-border);
  box-shadow:none;
}

.chat-footer-island{
  flex:0 0 auto;
  padding:10px 12px;
  overflow:visible;
  position:relative;
  z-index:12;
  border:0;
  box-shadow:none;
}

.chat-selection-toolbar{
  position:relative;
  margin:0 12px 12px;
  min-height:56px;
  border:1px solid color-mix(in srgb, var(--color-border), transparent 5%);
  border-radius:18px;
  background:color-mix(in srgb, var(--color-surface), #fff 20%);
  box-shadow:var(--shadow-md);
  backdrop-filter:blur(10px);
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  z-index:4;
}

.chat-center-stack.is-selection-mode .chat-footer-island{
  display:none;
}

.chat-selection-close{
  width:36px;
  height:36px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--color-text-muted);
  display:grid;
  place-items:center;
  cursor:pointer;
  flex-shrink:0;
}

.chat-selection-close:hover{
  background:var(--color-surface-2);
  color:var(--color-text);
}

.chat-selection-count{
  min-width:0;
  font-size:18px;
  font-weight:700;
  color:var(--color-text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.chat-selection-actions{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:6px;
}

.chat-selection-action{
  width:36px;
  height:36px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--color-text-muted);
  display:grid;
  place-items:center;
  cursor:pointer;
  flex-shrink:0;
}

.chat-selection-action:hover{
  background:var(--color-surface-2);
  color:var(--color-text);
}

.chat-selection-action.is-danger{
  color:#ef4444;
}

.chat-selection-action.is-danger:hover{
  background:rgba(239,68,68,.1);
}

.chat-main-composer .chat-composer-btn{
  width:45px;
  height:45px;
  border-radius:10px;
  border:0;
  background:transparent;
  color:var(--color-text-muted);
}

.chat-main-composer .chat-composer-btn:hover{
  background:transparent;
  color:var(--color-text);
  transform:none;
}

.chat-main-composer .chat-composer-btn i{
  font-size:22px;
  pointer-events:none;
}

.chat-emoji-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
}

.chat-emoji-popover{
  position:absolute;
  bottom:46px;
  right:0;
  left:auto;
  width:298px;
  max-height:352px;
  overflow:hidden;
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:12px;
  box-shadow:var(--shadow-md);
  display:flex;
  flex-direction:column;
  gap:0;
  padding:8px;
  z-index:20;
}

.chat-emoji-popover.is-mobile-sheet{
  position:fixed;
  left:max(8px, env(safe-area-inset-left));
  right:max(8px, env(safe-area-inset-right));
  bottom:calc(8px + env(safe-area-inset-bottom));
  width:auto;
  height:clamp(220px, 41vh, 290px);
  max-height:clamp(220px, 41vh, 290px);
  min-height:220px;
  border-radius:18px;
  padding:8px 10px 10px;
  z-index:1705;
  animation:chat-emoji-sheet-up .26s cubic-bezier(.22,.76,.24,1);
}

.chat-emoji-popover.is-mobile-sheet::before{
  content:"";
  width:36px;
  height:4px;
  border-radius:999px;
  background:color-mix(in srgb, var(--color-text-muted), transparent 40%);
  margin:1px auto 8px;
  flex-shrink:0;
}

.chat-emoji-popover.is-attach-preview{
  position:fixed;
  left:50%;
  right:auto;
  bottom:26px;
  transform:translateX(-50%);
  z-index:220;
}

.chat-emoji-popover.is-mobile-sheet.is-attach-preview{
  left:max(8px, env(safe-area-inset-left));
  right:max(8px, env(safe-area-inset-right));
  bottom:calc(8px + env(safe-area-inset-bottom));
  transform:none;
}

.chat-emoji-categories{
  display:grid;
  grid-template-columns:repeat(9, minmax(0, 1fr));
  gap:4px;
  border-bottom:1px solid var(--color-border);
  padding-bottom:7px;
}

.chat-emoji-category-btn{
  height:28px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:var(--color-text-muted);
  font-size:15px;
  cursor:pointer;
}

.chat-emoji-category-btn:hover{
  background:var(--color-surface-2);
  border-color:var(--color-border);
  color:var(--color-text);
}

.chat-emoji-category-btn.is-active{
  background:var(--color-surface-2);
  border-color:var(--color-border);
  color:var(--color-text);
}

.chat-emoji-category-btn.is-disabled{
  opacity:.35;
  cursor:default;
}

.chat-emoji-category-btn.is-disabled:hover{
  background:transparent;
  border-color:transparent;
  color:var(--color-text-muted);
}

.chat-emoji-body{
  margin-top:6px;
  min-height:170px;
  max-height:272px;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:none;
}

.chat-emoji-popover.is-mobile-sheet .chat-emoji-body{
  margin-top:8px;
  min-height:0;
  max-height:none;
  flex:1 1 auto;
  display:flex;
  align-items:flex-start;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x proximity;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x;
  overscroll-behavior-x:contain;
}

.chat-emoji-body::-webkit-scrollbar{
  width:0;
  height:0;
}

.chat-emoji-title{
  font-size:12px;
  line-height:1.2;
  color:var(--color-text-muted);
  margin-bottom:6px;
}

.chat-emoji-section + .chat-emoji-section{
  margin-top:10px;
}

.chat-emoji-popover.is-mobile-sheet .chat-emoji-section{
  width:max-content;
  min-width:max-content;
  max-width:none;
  flex:0 0 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  scroll-snap-align:start;
  scroll-snap-stop:always;
}

.chat-emoji-popover.is-mobile-sheet .chat-emoji-section + .chat-emoji-section{
  margin-left:0;
  margin-top:0;
}

.chat-emoji-grid{
  display:grid;
  grid-template-columns:repeat(7, minmax(0, 1fr));
  gap:4px;
}

.chat-emoji-popover.is-mobile-sheet .chat-emoji-grid{
  flex:0 0 auto;
  min-height:auto;
  display:grid;
  grid-auto-flow:column;
  grid-template-rows:repeat(4, 40px);
  grid-auto-columns:40px;
  justify-content:start;
  align-content:start;
  width:max-content;
  overflow:hidden;
  gap:6px;
  padding-top:2px;
  padding-bottom:8px;
}

.chat-emoji-empty{
  min-height:110px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--color-text-muted);
  font-size:12px;
}

.chat-emoji-btn{
  width:100%;
  min-height:34px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  cursor:pointer;
  font-size:24px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
}

@keyframes chat-emoji-sheet-up{
  0%{
    opacity:0;
    transform:translateY(16px);
  }
  100%{
    opacity:1;
    transform:translateY(0);
  }
}

.chat-emoji-glyph{
  display:block;
  width:24px;
  height:24px;
  font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;
  font-style:normal;
  font-weight:400;
  font-variant-emoji:emoji;
  line-height:1;
  white-space:nowrap;
  object-fit:contain;
  image-rendering:auto;
  pointer-events:none;
  margin:0 auto;
}

.chat-emoji-glyph--picker{
  width:24px;
  height:24px;
}

.chat-emoji-glyph--reaction{
  width:21px;
  height:21px;
  display:block;
  overflow:visible;
  filter:none !important;
  -webkit-filter:none !important;
  text-shadow:none !important;
  box-shadow:none !important;
  outline:none !important;
}

.chat-emoji-glyph--pill{
  width:26px;
  height:26px;
  display:block;
  border-radius:999px;
  background-color:transparent !important;
  overflow:visible;
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
  -webkit-tap-highlight-color:transparent;
}

.chat-emoji-glyph--composer{
  width:30px;
  height:30px;
}

.chat-emoji-glyph--composer-inline{
  display:inline-block;
  width:24px;
  height:24px;
  margin:0 1px;
  vertical-align:-0.14em;
}

.chat-emoji-glyph--input-inline{
  display:inline-block;
  width:1.22em;
  height:1.22em;
  margin:0 .03em;
  vertical-align:-0.14em;
}

.chat-emoji-glyph--preview{
  display:inline-block;
  width:1.12em;
  height:1.12em;
  margin:0 .02em;
  vertical-align:-0.12em;
}

.chat-client-preview .chat-emoji-glyph,
.chat-client-preview .chat-emoji-glyph--preview{
  display:inline-block;
  width:1.12em;
  height:1.12em;
  margin:0 .02em;
  vertical-align:-0.12em;
}

.chat-emoji-glyph--inline{
  display:inline-block;
  width:1.22em;
  height:1.22em;
  margin:0 .04em;
  vertical-align:-0.16em;
}

.chat-main-composer .chat-composer-btn.has-emoji-content{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:2px;
}

.chat-input-rich-wrap{
  order:2;
  min-width:0;
  flex:1 1 auto;
  width:auto;
  min-height:45px;
  max-height:160px;
  position:relative;
  display:block;
}

.chat-input-rich-wrap .chat-message-input{
  width:100%;
  min-height:45px;
  max-height:160px;
  position:relative;
  z-index:2;
  display:block;
  box-sizing:border-box;
  margin:0;
}

.chat-input-rich-preview{
  position:absolute;
  inset:0;
  padding:9px 6px 8px;
  display:block;
  white-space:pre-wrap;
  word-break:break-word;
  overflow-wrap:anywhere;
  overflow:hidden;
  pointer-events:none;
  z-index:1;
  color:var(--color-text);
  font-size:16px;
  line-height:1.25;
}

.chat-message-input.is-rich-emoji-preview{
  color:transparent;
  caret-color:var(--color-text);
}

.chat-emoji-btn:hover{
  background:var(--color-surface-2);
  border-color:var(--color-border);
}

.chat-message-input{
  min-width:0;
  height:45px;
  min-height:45px;
  max-height:160px;
  border:0;
  background:transparent;
  padding:9px 6px 8px;
  font-size:16px;
  text-align:left;
  box-shadow:none;
  line-height:1.25;
  white-space:pre-wrap;
  word-break:break-word;
  overflow-wrap:anywhere;
  resize:none;
  overflow-x:hidden;
  overflow-y:hidden;
  display:block;
  box-sizing:border-box;
  margin:0;
}

.chat-input-rich-preview .chat-emoji-glyph,
.chat-input-rich-preview .chat-emoji-glyph--input-inline{
  display:inline-block !important;
}

.chat-message-input:focus{
  border:0;
  box-shadow:none;
  outline:none;
}

.chat-message-input:focus-visible{
  outline:none;
}

.chat-message-input::placeholder{
  text-align:left;
  line-height:1.45;
  transform:translateY(2px);
  color:var(--color-text-muted);
}

.chat-send-btn{
  width:45px;
  height:45px;
  min-width:45px;
  padding:0;
  display:grid;
  place-items:center;
  border-radius:10px;
  border:0;
  background:transparent;
  color:var(--color-primary);
  line-height:1;
  flex-shrink:0;
  appearance:none;
  -webkit-appearance:none;
  -webkit-tap-highlight-color:transparent;
}

.chat-send-btn.btn-primary,
.chat-send-btn.btn-primary:hover{
  background:transparent;
  border:0;
  color:var(--color-primary);
}

.chat-send-btn:focus,
.chat-send-btn:focus-visible,
.chat-send-btn:active,
.chat-send-btn.btn-primary:focus,
.chat-send-btn.btn-primary:focus-visible,
.chat-send-btn.btn-primary:active{
  background:transparent;
  border:0;
  color:var(--color-primary);
  outline:none;
  box-shadow:none;
}

.chat-send-btn:hover{
  background:transparent;
  color:var(--color-primary-hover);
  border:0;
  transform:none;
}

.chat-send-btn i{
  margin:0;
  font-size:22px;
  line-height:1;
  pointer-events:none;
}

.chat-send-btn.btn-sm{
  height:45px;
  min-width:45px;
  padding:0;
}

.chat-send-btn.is-editing{
  background:transparent;
  color:var(--color-primary-hover);
}

.chat-attach-preview-overlay{
  position:fixed;
  inset:0;
  z-index:170;
  padding:18px;
  display:grid;
  place-items:center;
  background:rgba(15,23,42,.36);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
  border-radius:0;
}

.chat-attach-preview-card{
  width:min(680px, 100%);
  max-height:100%;
  border-radius:20px;
  border:1px solid color-mix(in srgb, var(--color-border), transparent 15%);
  background:var(--color-surface);
  box-shadow:0 22px 48px rgba(15,23,42,.28);
  display:grid;
  grid-template-rows:auto minmax(220px, 1fr) auto auto;
  overflow:hidden;
}

.chat-attach-preview-head{
  display:grid;
  grid-template-columns:44px minmax(0, 1fr);
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-bottom:1px solid color-mix(in srgb, var(--color-border), transparent 20%);
}

.chat-attach-preview-title{
  min-width:0;
  text-align:left;
  font-size:22px;
  font-weight:700;
  line-height:1.2;
  color:var(--color-text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.chat-attach-preview-icon-btn{
  width:36px;
  height:36px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--color-text-muted);
  display:grid;
  place-items:center;
  cursor:pointer;
}

.chat-attach-preview-icon-btn:hover{
  background:var(--color-surface-2);
  color:var(--color-text);
}

.chat-attach-preview-media-wrap{
  background:#090b10;
  display:grid;
  place-items:center;
  min-height:220px;
  max-height:min(60vh, 520px);
}

.chat-attach-preview-image{
  max-width:100%;
  max-height:min(60vh, 520px);
  object-fit:contain;
  display:block;
}

.chat-attach-preview-thumbs{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  overflow-x:auto;
  border-top:1px solid color-mix(in srgb, var(--color-border), transparent 20%);
  background:color-mix(in srgb, var(--color-surface), #fff 12%);
}

.chat-attach-preview-thumb{
  width:54px;
  height:54px;
  border:2px solid transparent;
  border-radius:12px;
  background:transparent;
  padding:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  cursor:pointer;
  flex:0 0 auto;
}

.chat-attach-preview-thumb.is-active{
  border-color:var(--color-primary);
}

.chat-attach-preview-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.chat-attach-preview-foot{
  display:grid;
  grid-template-columns:36px minmax(0, 1fr) auto;
  align-items:center;
  gap:8px;
  padding:10px 12px 12px;
}

.chat-attach-preview-caption{
  width:100%;
  min-width:0;
  height:42px;
  border:1px solid color-mix(in srgb, var(--color-border), transparent 8%);
  border-radius:12px;
  padding:0 12px;
  font-size:17px;
  line-height:1;
  color:var(--color-text);
  background:var(--color-surface-2);
  outline:none;
}

.chat-attach-preview-caption:focus{
  border-color:color-mix(in srgb, var(--color-primary), transparent 45%);
  box-shadow:0 0 0 2px color-mix(in srgb, var(--color-primary), transparent 82%);
}

.chat-attach-preview-send{
  height:42px;
  padding:0 18px;
  border:0;
  border-radius:14px;
  background:#3b82f6;
  color:#fff;
  font-size:16px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.2px;
  cursor:pointer;
}

.chat-attach-preview-send:hover{
  background:#2563eb;
}

.chat-attach-preview-send:disabled,
.chat-attach-preview-caption:disabled,
.chat-attach-preview-icon-btn:disabled{
  opacity:.6;
  cursor:default;
}

.chat-reaction-bar{
  position:fixed;
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:3px;
  padding:3px 5px;
  max-width:min(250px, calc(100vw - 16px));
  border-radius:999px;
  border:1px solid color-mix(in srgb, var(--color-border), transparent 22%);
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--color-surface), #fff 42%),
      color-mix(in srgb, var(--color-surface-2), #fff 26%)
    );
  box-shadow:
    0 14px 32px rgba(15,23,42,.2),
    inset 0 1px 0 rgba(255,255,255,.58);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  z-index:122;
}

.chat-reaction-btn.chat-reaction-extra{
  display:none;
}

.chat-reaction-bar.is-expanded .chat-reaction-btn.chat-reaction-extra{
  display:grid;
}

.chat-reaction-bar.is-expanded{
  display:grid;
  grid-template-columns:repeat(8, 26px);
  justify-content:start;
  align-content:start;
  gap:3px;
  width:min(244px, calc(100vw - 16px));
  max-height:min(44vh, 236px);
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  border-radius:14px;
  padding:6px;
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb, var(--color-border), transparent 12%) transparent;
}

.chat-reaction-btn{
  width:26px;
  height:26px;
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  border-radius:6px;
  display:grid;
  place-items:center;
  font-size:17px;
  line-height:1;
  cursor:pointer;
  outline:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  box-shadow:none;
  transition:
    opacity var(--dur-fast) var(--ease-smooth),
    transform var(--dur-fast) var(--ease-smooth);
}

.chat-reaction-btn:focus,
.chat-reaction-btn:focus-visible{
  outline:none;
  box-shadow:none;
}

.chat-reaction-btn:hover{
  background:transparent;
  border-color:transparent;
  box-shadow:none;
  opacity:.92;
  transform:scale(1.08);
}

.chat-reaction-btn.is-active{
  background:transparent;
  border-color:transparent;
  box-shadow:none;
  transform:scale(1.08);
}

.chat-reaction-close{
  width:26px;
  height:26px;
  border:0;
  background:transparent;
  border-radius:999px;
  display:grid;
  place-items:center;
  color:var(--color-text-muted);
  cursor:pointer;
  box-shadow:none;
  transition:
    opacity var(--dur-fast) var(--ease-smooth),
    transform var(--dur-fast) var(--ease-smooth);
}

.chat-reaction-close:hover{
  color:var(--color-text);
  border-color:transparent;
  background:transparent;
  box-shadow:none;
  opacity:.92;
  transform:scale(1.08);
}

.chat-reaction-more i{
  transition:transform var(--dur-fast) var(--ease-smooth);
}

.chat-reaction-bar.is-expanded .chat-reaction-more i{
  transform:rotate(180deg);
}

.chat-reaction-more{
  color:#6b7280;
  background:color-mix(in srgb, var(--color-surface-2), #cbd5e1 22%);
  border:1px solid color-mix(in srgb, var(--color-border), transparent 10%);
  border-radius:999px;
}

.chat-reaction-btn[data-chat-reaction-slot="quick"]{
  order:1;
}

.chat-reaction-more{
  order:2;
}

.chat-reaction-btn.chat-reaction-extra{
  order:3;
}

.chat-reaction-bar.is-expanded::-webkit-scrollbar{
  width:6px;
}

.chat-reaction-bar.is-expanded::-webkit-scrollbar-thumb{
  background:color-mix(in srgb, var(--color-border), transparent 12%);
  border-radius:999px;
}

.chat-reaction-bar:not(.hidden){
  animation:chat-reaction-pop .24s cubic-bezier(.22,.76,.24,1);
}

.chat-reaction-bar.is-expanded{
  animation:chat-reaction-expand .22s cubic-bezier(.22,.76,.24,1);
}

.chat-reaction-bar.is-expanded .chat-reaction-btn.chat-reaction-extra,
.chat-reaction-bar.is-expanded .chat-reaction-btn[data-chat-reaction-slot="extra-all"]{
  animation:chat-reaction-extra-in .18s cubic-bezier(.2,.88,.28,1) both;
  transform-origin:center;
  will-change:transform, opacity;
}

@keyframes chat-reaction-pop{
  from{
    opacity:0;
    transform:translateY(10px) scale(.93);
  }
  72%{
    opacity:1;
    transform:translateY(-1px) scale(1.01);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes chat-reaction-extra-in{
  from{
    opacity:0;
    transform:translateY(6px) scale(.72);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes chat-reaction-expand{
  from{
    opacity:.72;
    transform:translateY(4px) scale(.97);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@media (max-width: 768px){
  .chat-attach-preview-overlay{
    padding:10px;
    border-radius:0;
  }

  .chat-image-viewer-overlay{
    padding:10px;
    border-radius:0;
  }

  .chat-attach-preview-card{
    border-radius:18px;
    grid-template-rows:auto minmax(180px, 1fr) auto auto;
  }

  .chat-attach-preview-title{
    font-size:18px;
  }

  .chat-attach-preview-media-wrap{
    min-height:180px;
    max-height:48vh;
  }

  .chat-attach-preview-image{
    max-height:48vh;
  }

  .chat-attach-preview-foot{
    grid-template-columns:34px minmax(0, 1fr) auto;
    gap:6px;
    padding:8px 10px 10px;
  }

  .chat-attach-preview-caption{
    height:38px;
    font-size:15px;
  }

  .chat-attach-preview-send{
    height:38px;
    padding:0 14px;
    font-size:14px;
  }
}

.chat-message-menu{
  position:fixed;
  min-width:246px;
  max-height:min(420px, calc(100dvh - 24px));
  background:color-mix(in srgb, var(--color-surface), #fff 30%);
  border:1px solid color-mix(in srgb, var(--color-border), transparent 8%);
  border-radius:28px;
  box-shadow:var(--shadow-md);
  backdrop-filter:blur(12px);
  padding:10px 10px 12px;
  z-index:121;
  display:grid;
  gap:2px;
  overflow:hidden;
}

.chat-message-menu:not(.hidden){
  animation:none;
}

.chat-mobile-context-scene{
  position:fixed;
  inset:0;
  z-index:120;
  pointer-events:none;
}

.chat-mobile-context-scene__backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.34);
  backdrop-filter:blur(14px) saturate(118%);
  -webkit-backdrop-filter:blur(14px) saturate(118%);
  opacity:0;
  pointer-events:auto;
  transition:opacity .34s cubic-bezier(.22,.61,.36,1);
}

.chat-mobile-context-scene.is-open .chat-mobile-context-scene__backdrop{
  opacity:1;
}

.chat-mobile-context-scene__clone{
  position:fixed;
  left:0;
  top:0;
  width:0;
  pointer-events:none;
  opacity:1;
  transform:translate3d(0,0,0);
  transition:
    transform .68s cubic-bezier(.22,.61,.36,1);
  will-change:transform;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transform-style:preserve-3d;
  contain:layout paint style;
}

.chat-mobile-context-scene__clone > .chat-message-bubble{
  width:100%;
  max-width:none;
  box-shadow:none;
}

.chat-mobile-context-scene__clone.chat-message--out > .chat-message-bubble{
  background:#5f6167;
  color:#fff;
  border-bottom-right-radius:0;
}

.chat-mobile-context-scene__clone.chat-message--in > .chat-message-bubble{
  background:#ffffff;
  border-bottom-left-radius:0;
}

.chat-mobile-context-scene__clone.chat-message--out .chat-message-time{
  color:rgba(255,255,255,.75);
}

.chat-mobile-context-scene__clone > .chat-message-bubble.is-emoji-only-single{
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

@keyframes chat-message-menu-pop{
  from{
    opacity:0;
    transform:translateY(10px) scale(.95);
  }
  72%{
    opacity:1;
    transform:translateY(-1px) scale(1.01);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

.chat-message-menu-reactions{
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  gap:3px;
  padding:2px;
  overflow:hidden;
}

.chat-message-menu-reaction{
  width:26px;
  height:26px;
  border:0;
  background:transparent;
  border-radius:6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:17px;
  transition:transform var(--dur-fast) var(--ease-smooth), opacity var(--dur-fast) var(--ease-smooth);
}

.chat-message-menu-reaction:hover{
  transform:scale(1.08);
  opacity:.92;
}

.chat-message-menu-reaction--extra{
  display:none;
}

.chat-message-menu.is-reactions-expanded .chat-message-menu-reaction--extra{
  display:inline-flex;
}

.chat-message-menu.is-reactions-expanded .chat-message-menu-reactions{
  display:grid;
  grid-template-columns:repeat(8, 26px);
  justify-content:start;
  align-content:start;
  gap:3px;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  max-height:min(24vh, 136px);
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  padding:2px;
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb, var(--color-border), transparent 12%) transparent;
  transform-origin:bottom center;
  animation:chat-message-menu-reactions-expand .46s cubic-bezier(.22,.61,.36,1);
  animation-delay:0s;
  animation-fill-mode:both;
}

.chat-message-menu-reaction--toggle{
  color:#6b7280;
  background:color-mix(in srgb, var(--color-surface-2), #cbd5e1 22%);
  border:1px solid color-mix(in srgb, var(--color-border), transparent 10%);
  border-radius:999px;
}

.chat-message-menu-reaction--toggle i{
  pointer-events:none;
  transition:transform var(--dur-fast) var(--ease-smooth);
}

.chat-message-menu.is-reactions-expanded .chat-message-menu-reaction--toggle i{
  transform:rotate(180deg);
}

.chat-message-menu-reaction[data-chat-msg-reaction-slot="quick"]{
  order:1;
}

.chat-message-menu-reaction--toggle{
  order:2;
}

.chat-message-menu-reaction--extra{
  order:3;
}

.chat-message-menu.is-reactions-expanded .chat-message-menu-reaction--extra,
.chat-message-menu.is-reactions-expanded .chat-message-menu-reaction[data-chat-msg-reaction-slot="extra-all"]{
  animation:chat-message-menu-extra-in .46s cubic-bezier(.22,.61,.36,1) both;
  animation-delay:0s;
  transform-origin:center;
  will-change:transform, opacity;
}

.chat-message-menu.is-reactions-expanded .chat-message-menu-reactions::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}

.chat-message-menu.is-reactions-expanded .chat-message-menu-reactions::-webkit-scrollbar-thumb{
  background:color-mix(in srgb, var(--color-border), transparent 12%);
  border-radius:999px;
}

.chat-message-menu.is-reactions-expanded .chat-message-menu-reactions{
  scrollbar-width:none;
  -ms-overflow-style:none;
}

@keyframes chat-message-menu-reactions-expand{
  from{
    opacity:.95;
    transform:translateY(2px) scale(.998);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes chat-message-menu-extra-in{
  from{
    opacity:.72;
    transform:translateY(2px) scale(.98);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

.chat-message-menu-btn{
  width:100%;
  border:1px solid transparent;
  background:transparent;
  border-radius:14px;
  min-height:46px;
  padding:0 12px;
  display:flex;
  align-items:center;
  gap:10px;
  font-size:16px;
  color:var(--color-text);
  cursor:pointer;
  text-align:left;
}

.chat-message-menu-btn i{
  width:22px;
  text-align:center;
  font-size:20px;
  color:inherit;
}

.chat-message-menu-btn span{
  flex:1;
}

.chat-message-menu-btn:hover{
  background:var(--color-surface-2);
  border-color:color-mix(in srgb, var(--color-border), transparent 20%);
}

.chat-message-menu-btn.is-danger{
  color:#dc2626;
}

.chat-message-menu-btn.is-danger i{
  color:#dc2626;
}

.chat-message-menu-btn.is-disabled{
  opacity:.45;
  pointer-events:none;
}

.chat-message-menu-divider{
  height:1px;
  background:color-mix(in srgb, var(--color-border), transparent 15%);
  margin:8px 4px;
}

.chat-delete-confirm-overlay{
  position:fixed;
  inset:0;
  padding:14px;
  display:grid;
  place-items:center;
  background:rgba(15,23,42,.36);
  backdrop-filter:blur(2px);
  opacity:0;
  pointer-events:none;
  z-index:180;
  transition:opacity .16s ease;
}

.chat-delete-confirm-overlay.is-open{
  opacity:1;
  pointer-events:auto;
}

.chat-delete-confirm-card{
  width:min(92vw, 372px);
  border-radius:20px;
  background:var(--color-surface);
  color:var(--color-text);
  border:1px solid color-mix(in srgb, var(--color-border), transparent 6%);
  padding:18px 18px 14px;
  box-shadow:0 20px 42px rgba(15,23,42,.24);
  transform:translateY(8px) scale(.98);
  transition:transform .16s ease;
}

.chat-delete-confirm-overlay.is-open .chat-delete-confirm-card{
  transform:translateY(0) scale(1);
}

.chat-delete-confirm-title{
  font-size:17px;
  line-height:1.2;
  font-weight:700;
}

.chat-delete-confirm-text{
  margin-top:10px;
  font-size:15px;
  line-height:1.32;
  color:var(--color-text);
}

.chat-delete-confirm-check{
  margin-top:14px;
  display:flex;
  align-items:center;
  gap:10px;
  cursor:pointer;
  user-select:none;
}

.chat-delete-confirm-checkbox{
  appearance:none;
  position:relative;
  width:20px;
  height:20px;
  border-radius:6px;
  border:2px solid color-mix(in srgb, var(--color-primary), #fff 62%);
  background:var(--color-surface);
  flex-shrink:0;
  cursor:pointer;
}

.chat-delete-confirm-checkbox::after{
  content:"";
  position:absolute;
  left:5px;
  top:1px;
  width:5px;
  height:10px;
  border-right:2px solid #fff;
  border-bottom:2px solid #fff;
  transform:rotate(45deg) scale(0);
  transform-origin:center;
  transition:transform .12s ease;
}

.chat-delete-confirm-checkbox:checked{
  background:var(--color-primary);
  border-color:var(--color-primary);
}

.chat-delete-confirm-checkbox:checked::after{
  transform:rotate(45deg) scale(1);
}

.chat-delete-confirm-check-text{
  font-size:15px;
  line-height:1.24;
  color:var(--color-text);
}

.chat-delete-confirm-actions{
  margin-top:14px;
  display:flex;
  justify-content:flex-end;
  gap:8px;
}

.chat-delete-confirm-btn{
  appearance:none;
  border:1px solid color-mix(in srgb, var(--color-border), transparent 8%);
  background:var(--color-surface-2);
  color:var(--color-text);
  border-radius:10px;
  padding:8px 12px;
  font-size:13px;
  line-height:1;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
  cursor:pointer;
}

.chat-delete-confirm-btn--cancel{
  color:var(--color-text-muted);
}

.chat-delete-confirm-btn--danger{
  color:#ef4444;
  border-color:color-mix(in srgb, #ef4444, transparent 70%);
  background:color-mix(in srgb, #ef4444, transparent 92%);
}

.chat-delete-confirm-btn:hover{
  filter:brightness(.98);
}

@media (max-width:768px){
  body.page-chat{
    --admin-mobile-shell-handle-zone-h:0px;
    --chat-ios-page-height:calc(100dvh - var(--header-height));
    --chat-ios-overlay-shift:0px;
    --chat-mobile-bottom-ui-offset:max(0px, env(safe-area-inset-bottom));
    --chat-mobile-header-overlap:8px;
    --chat-mobile-header-offset:8px;
    --chat-mobile-shell-gap:8px;
    --chat-mobile-keyboard-footer-gap:var(--chat-mobile-shell-gap);
    --chat-mobile-nav-top-radius:var(--admin-mobile-shell-top-radius);
    --chat-mobile-nav-reserve:max(
      0px,
      calc(
        var(--admin-mobile-nav-h)
        + var(--chat-mobile-bottom-ui-offset)
        - var(--chat-mobile-nav-top-radius)
      )
    );
    --chat-mobile-nav-panel-bottom:calc(
      var(--admin-mobile-shell-visible-height)
      + var(--chat-mobile-shell-gap)
    );
    --chat-mobile-footer-offset:10px;
    isolation:isolate;
    background-color:var(--chat-wallpaper-base);
    overflow:hidden;
  }

  body.page-chat::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:0;
    pointer-events:none;
    background-color:var(--chat-wallpaper-base);
    background-image:
      linear-gradient(180deg, rgba(255,255,255,.40), rgba(255,255,255,.58)),
      var(--chat-wallpaper-pattern),
      radial-gradient(circle at 16% 10%, rgba(255,255,255,.16), transparent 36%),
      radial-gradient(circle at 84% 14%, rgba(245,225,138,.08), transparent 32%),
      linear-gradient(180deg, #f7f8f4 0%, #f0f3eb 42%, #ebefe5 100%);
    background-position:0 0, center top, 0 0, 0 0, 0 0;
    background-repeat:no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
    background-size:100% 100%, var(--chat-wallpaper-size), 100% 100%, 100% 100%, 100% 100%;
    transform:translateZ(0);
  }

  body.page-chat .main-container{
    position:relative;
    z-index:1;
  }

  body.page-chat.admin-mobile-shell-collapsed{
    --chat-mobile-nav-reserve:calc(var(--admin-mobile-shell-collapsed-visible-h) + var(--chat-mobile-bottom-ui-offset));
  }

  body.page-chat > header{
    box-shadow:none;
  }

  body.page-chat .main-container{
    margin-top:calc(var(--header-height) - var(--chat-mobile-header-overlap));
    height:calc(100dvh - var(--header-height) + var(--chat-mobile-header-overlap));
    min-height:calc(100dvh - var(--header-height) + var(--chat-mobile-header-overlap));
    max-height:calc(100dvh - var(--header-height) + var(--chat-mobile-header-overlap));
    padding:0;
    overflow:hidden;
  }

  body.page-chat.chat-mobile-keyboard-open .main-container{
    padding-bottom:0;
  }

  body.page-chat.is-ios-chat-viewport-locked .main-container,
  body.page-chat.is-ios-chat-viewport-locked .main-container.app-grid{
    height:calc(100dvh - var(--header-height) + var(--chat-mobile-header-overlap));
    min-height:calc(100dvh - var(--header-height) + var(--chat-mobile-header-overlap));
    max-height:calc(100dvh - var(--header-height) + var(--chat-mobile-header-overlap));
  }

  body.page-chat .app-grid,
  body.page-chat .page-col-center{
    min-height:0;
    max-height:100%;
  }

  body.page-chat .main-container.app-grid{
    box-sizing:border-box;
    height:calc(100dvh - var(--header-height) + var(--chat-mobile-header-overlap));
    min-height:calc(100dvh - var(--header-height) + var(--chat-mobile-header-overlap));
    max-height:calc(100dvh - var(--header-height) + var(--chat-mobile-header-overlap));
  }

  body.page-chat .page-col-center{
    height:100%;
  }

  body.page-chat .page-col-center{
    box-sizing:border-box;
    background:transparent;
    height:100%;
    max-height:100%;
    padding-bottom:0;
    overflow:visible;
  }

  body.page-chat .main-container,
  body.page-chat .main-container.app-grid,
  body.page-chat .app-grid,
  body.page-chat .page-col{
    background:transparent;
  }

  body.page-chat.chat-mobile-keyboard-open .page-col-center{
    height:100%;
    max-height:100%;
    padding-bottom:0;
  }

  body.page-chat.chat-mobile-left-open{
    overflow:hidden;
  }

  body.page-chat .chat-center-stack > .panel.chat-header-island{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:auto;
    z-index:12;
    align-self:auto;
    margin:0;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
    overflow:visible;
    padding:calc(max(8px, env(safe-area-inset-top)) + var(--chat-mobile-header-offset)) 10px 0;
    pointer-events:none;
  }

  body.page-chat .chat-header-island::before{
    display:none;
  }

  body.page-chat .chat-header-island > *{
    pointer-events:auto;
    overscroll-behavior:none;
    touch-action:none;
  }

  body.page-chat .chat-header-toolbar--desktop{
    display:none;
  }

  body.page-chat .chat-mobile-subheader{
    display:grid;
    grid-template-columns:48px minmax(0, 1fr) 48px;
    gap:4px;
    width:100%;
    align-items:stretch;
  }

  body.page-chat .chat-mobile-subheader-btn{
    position:relative;
    min-width:0;
    min-height:48px;
    padding:0 14px;
    border:1px solid var(--chat-mobile-glass-control-border);
    border-radius:999px;
    background:var(--chat-mobile-glass-control-bg);
    color:var(--color-text);
    box-shadow:none;
    backdrop-filter:blur(14px) saturate(155%);
    -webkit-backdrop-filter:blur(14px) saturate(155%);
    text-align:center;
    transition:
      background var(--dur-fast) var(--ease-smooth),
      border-color var(--dur-fast) var(--ease-smooth),
      transform var(--dur-fast) var(--ease-smooth);
  }

  body.page-chat .chat-mobile-subheader-btn:active{
    transform:translateY(1px);
  }

  body.page-chat .chat-mobile-subheader-btn[aria-disabled="true"]{
    opacity:.78;
  }

  body.page-chat .chat-mobile-subheader-btn--back{
    display:grid;
    place-items:center;
    width:48px;
    min-width:48px;
    height:48px;
    padding:0;
  }

  body.page-chat .chat-mobile-subheader-btn--back i{
    font-size:18px;
    line-height:1;
  }

  body.page-chat .chat-mobile-subheader-btn--client{
    display:grid;
    align-content:center;
    justify-items:center;
    text-align:center;
    max-width:100%;
    overflow:hidden;
  }

  body.page-chat .chat-mobile-subheader-client-text{
    min-width:0;
    display:grid;
    gap:2px;
    width:100%;
    max-width:100%;
    justify-items:center;
  }

  body.page-chat .chat-mobile-subheader-client-name{
    display:block;
    width:100%;
    max-width:100%;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:15px;
    line-height:1.1;
    font-weight:800;
    color:var(--color-text);
  }

  body.page-chat .chat-mobile-subheader-client-phone{
    display:block;
    width:100%;
    max-width:100%;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:12px;
    line-height:1.1;
    color:var(--color-text-muted);
  }

  body.page-chat .chat-mobile-subheader-loading{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    pointer-events:none;
  }

  body.page-chat .chat-mobile-subheader-btn--client.is-loading .chat-mobile-subheader-client-text{
    opacity:0;
  }

  body.page-chat .chat-mobile-subheader-btn--order{
    display:grid;
    align-content:center;
    justify-items:center;
    width:48px;
    min-width:48px;
    max-width:48px;
    height:48px;
    min-height:48px;
    max-height:48px;
    padding:5px 4px;
    text-align:center;
    gap:1px;
    overflow:hidden;
    justify-self:end;
  }

  body.page-chat .chat-mobile-subheader-order-id{
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:11px;
    line-height:1.1;
    font-weight:800;
    color:var(--color-text);
  }

  body.page-chat .chat-mobile-subheader-order-time{
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:10px;
    line-height:1.1;
    color:var(--color-text-muted);
  }

  body.page-chat .chat-center-stack{
    --chat-mobile-glass-control-border:rgba(255,255,255,.86);
    --chat-mobile-glass-control-bg:rgba(255,255,255,.68);
    --chat-mobile-header-overlay-height:calc(72px + var(--chat-mobile-header-offset));
    --chat-mobile-footer-shell-clearance:var(--chat-mobile-nav-panel-bottom);
    --chat-mobile-footer-overlay-height:calc(86px + var(--chat-mobile-footer-shell-clearance));
    --chat-mobile-overlay-lift:0px;
    --chat-mobile-thread-top-inset:0px;
    --chat-mobile-thread-bottom-inset:0px;
    display:grid;
    grid-template-columns:minmax(0, 1fr);
    grid-template-rows:minmax(0, 1fr);
    position:relative;
    box-sizing:border-box;
    height:100%;
    min-height:0;
    max-height:100%;
    gap:0;
    padding-bottom:0;
    overflow:visible;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    isolation:auto;
  }

  body.page-chat .chat-center-stack::before{
    display:none;
  }

  body.page-chat .chat-center-stack > .panel{
    grid-column:1;
    grid-row:1;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
  }

  body.page-chat .chat-center-stack > .panel.chat-main-panel{
    position:absolute;
    inset:0;
    z-index:1;
    align-self:auto;
    flex:1 1 auto;
    min-height:0;
    height:auto;
    background:transparent;
    overflow:visible;
  }

  body.page-chat .chat-main-body{
    --chat-tail-cut-bg:var(--chat-wallpaper-base);
    background:transparent;
    overflow:visible;
  }

  body.page-chat .chat-main-body::after{
    display:none;
  }

  body.page-chat .chat-main-body > .chat-empty-state,
  body.page-chat .chat-main-body > .chat-messages{
    transform:none;
    will-change:auto;
  }

  body.page-chat .chat-main-panel > .panel-body{
    position:relative;
    z-index:1;
    height:100%;
    padding:0;
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-y:contain;
    touch-action:pan-y;
    background:transparent;
    scroll-padding-top:calc(var(--chat-mobile-header-overlay-height) + 12px);
    scroll-padding-bottom:calc(var(--chat-mobile-footer-overlay-height) + 12px);
    -webkit-mask-image:linear-gradient(
      to bottom,
      transparent 0,
      #000 var(--chat-mobile-header-overlay-height),
      #000 calc(100% - var(--chat-mobile-footer-overlay-height)),
      transparent 100%
    );
    mask-image:linear-gradient(
      to bottom,
      transparent 0,
      #000 var(--chat-mobile-header-overlay-height),
      #000 calc(100% - var(--chat-mobile-footer-overlay-height)),
      transparent 100%
    );
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
    -webkit-mask-size:100% 100%;
    mask-size:100% 100%;
  }

  body.page-chat .chat-main-panel > .panel-body::after{
    display:none;
  }

  body.page-chat .chat-empty-state{
    min-height:100%;
    box-sizing:border-box;
    position:relative;
    z-index:1;
    padding:
      calc(var(--chat-mobile-thread-top-inset) + 20px)
      22px
      calc(max(var(--chat-mobile-thread-bottom-inset), var(--chat-mobile-footer-overlay-height)) + 20px);
  }

  body.page-chat .chat-messages{
    min-height:calc(100% + 1px);
    box-sizing:border-box;
    margin:0;
    padding:
      calc(var(--chat-mobile-thread-top-inset) + 8px)
      10px
      calc(max(var(--chat-mobile-thread-bottom-inset), var(--chat-mobile-footer-overlay-height)) + 8px);
    touch-action:pan-y;
  }

  body.page-chat .chat-message,
  body.page-chat .chat-message-bubble{
    touch-action:pan-y;
  }

  body.page-chat .chat-header-island{
    transform:translate3d(0, var(--chat-android-viewport-shift), 0);
    will-change:transform;
  }

  body.page-chat .chat-main-panel{
    transform:none;
    will-change:auto;
    transition:none;
  }

  body.page-chat.chat-mobile-keyboard-open .chat-main-panel,
  body.page-chat .chat-center-stack.is-mobile-keyboard-open .chat-main-panel,
  body.page-chat .chat-center-stack.is-emoji-sheet-open .chat-main-panel,
  body.page-chat.is-ios-chat-viewport-locked .chat-main-panel{
    transform:translate3d(
      0,
      calc(var(--chat-android-viewport-shift) - var(--chat-mobile-overlay-lift)),
      0
    );
    will-change:transform;
    transition:transform 72ms linear;
  }

  body.page-chat .chat-footer-island,
  body.page-chat .chat-selection-toolbar{
    transform:translate3d(
      0,
      calc(var(--chat-android-viewport-shift) - var(--chat-mobile-overlay-lift)),
      0
    );
    will-change:transform;
    transition:transform 72ms linear, opacity var(--dur-fast) var(--ease-smooth);
  }

  body.page-chat.chat-mobile-keyboard-viewport-syncing .chat-main-panel,
  body.page-chat.chat-mobile-keyboard-viewport-syncing .chat-footer-island,
  body.page-chat.chat-mobile-keyboard-viewport-syncing .chat-selection-toolbar,
  body.page-chat.chat-mobile-keyboard-viewport-syncing .admin-mobile-shell,
  body.page-chat.chat-mobile-keyboard-viewport-syncing .admin-mobile-rail-shell,
  body.page-chat.chat-mobile-keyboard-viewport-syncing .admin-mobile-nav-shell,
  body.page-chat.chat-mobile-keyboard-viewport-syncing .admin-mobile-shell-handle-bar{
    transition:none !important;
  }

  body.page-chat .chat-center-stack,
  body.page-chat .chat-center-stack.is-mobile-keyboard-open{
    transition:none;
  }

  body.page-chat .chat-center-stack.is-mobile-keyboard-open{
    --chat-mobile-footer-shell-clearance:var(--chat-mobile-keyboard-footer-gap);
    --chat-mobile-overlay-lift:var(--chat-mobile-keyboard-inset);
  }

  body.page-chat.chat-mobile-keyboard-open .chat-center-stack{
    --chat-mobile-footer-shell-clearance:var(--chat-mobile-keyboard-footer-gap);
  }

  body.page-chat.is-ios-chat-viewport-locked .chat-center-stack.is-mobile-keyboard-open{
    --chat-mobile-overlay-lift:var(--chat-mobile-keyboard-inset);
  }

  body.page-chat.is-ios-chat-viewport-locked .chat-main-panel,
  body.page-chat.is-ios-chat-viewport-locked .chat-footer-island,
  body.page-chat.is-ios-chat-viewport-locked .chat-selection-toolbar{
    transform:translate3d(
      0,
      calc(var(--chat-android-viewport-shift) - var(--chat-mobile-overlay-lift)),
      0
    );
  }

  body.page-chat .chat-center-stack > .panel.chat-footer-island{
    position:relative;
    left:auto;
    right:auto;
    inset:auto;
    z-index:26;
    align-self:end;
    margin:0;
    padding:0 10px var(--chat-mobile-footer-shell-clearance);
    background:transparent;
    border:0;
    box-shadow:none;
    pointer-events:auto;
    overscroll-behavior:none;
    touch-action:manipulation;
  }

  body.page-chat .chat-footer-island::before{
    display:none;
  }

  body.page-chat .chat-footer-island > *{
    pointer-events:auto;
    overscroll-behavior:none;
  }

  body.page-chat.chat-mobile-keyboard-open .chat-footer-island{
    bottom:auto;
  }

  body.page-chat .chat-selection-toolbar{
    position:absolute;
    left:10px;
    right:10px;
    bottom:var(--chat-mobile-footer-shell-clearance);
    z-index:26;
  }

  body.page-chat.chat-mobile-keyboard-open .chat-selection-toolbar{
    bottom:auto;
  }

  body.page-chat .chat-center-stack.is-emoji-sheet-open{
    --chat-mobile-overlay-lift:max(
      var(--chat-mobile-keyboard-inset),
      calc(clamp(220px, 41vh, 290px) + 12px + env(safe-area-inset-bottom))
    );
  }

  body.page-chat .chat-center-stack.is-emoji-sheet-open .chat-scroll-down{
    bottom:calc(27px + var(--chat-scroll-down-composer-extra));
  }

  body.page-chat .admin-mobile-shell{
    bottom:var(--chat-mobile-bottom-ui-offset);
  }

  body.page-chat .admin-mobile-shell.is-single-row{
    bottom:0;
  }

  body.page-chat.chat-mobile-keyboard-open .admin-mobile-shell{
    --admin-mobile-shell-snap-duration:220ms;
    --admin-mobile-shell-fade-duration:180ms;
    opacity:1;
    pointer-events:auto;
    --admin-mobile-shell-overlay-offset:calc(var(--chat-android-viewport-shift) - var(--chat-mobile-keyboard-inset));
  }

  body.page-chat .page-col-left{
    display:flex !important;
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:var(--chat-mobile-nav-panel-bottom);
    padding:0;
    align-items:stretch;
    overflow:hidden;
    z-index:23;
    transform:translateX(calc(-100% - 18px));
    opacity:1;
    visibility:hidden;
    pointer-events:none;
    transition:
      transform var(--dur-med) var(--ease-smooth),
      visibility 0s linear var(--dur-med);
  }

  body.page-chat.chat-mobile-left-open .page-col-left{
    transform:translateX(0);
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition:
      transform var(--dur-med) var(--ease-smooth),
      visibility 0s linear 0s;
  }

  body.page-chat.chat-mobile-left-dragging .page-col-left{
    opacity:1;
    visibility:visible;
    pointer-events:none;
    transition:none;
  }

  body.page-chat.chat-mobile-left-open .chat-footer-island,
  body.page-chat.chat-mobile-left-dragging .chat-footer-island,
  body.page-chat.chat-mobile-left-open .chat-selection-toolbar{
    opacity:0;
    pointer-events:none;
  }

  body.page-chat.chat-mobile-left-dragging .chat-selection-toolbar{
    opacity:0;
    pointer-events:none;
  }

  body.page-chat .page-col-left > .chat-clients-panel{
    flex:1 1 auto;
    width:100%;
    height:100%;
    min-height:100%;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    box-shadow:var(--shadow-md);
    border-radius:0;
  }

  body.page-chat .page-col-left > .chat-clients-panel > .chat-clients-body{
    flex:1 1 auto;
    min-height:0;
  }

  body.page-chat .page-col-right{
    display:flex !important;
    position:fixed;
    inset:var(--header-height) 0 var(--admin-mobile-shell-reserve) 0;
    z-index:88;
    padding:0;
    background:var(--color-surface);
    overflow:hidden;
    transform:translateX(calc(100% + 18px));
    visibility:hidden;
    pointer-events:none;
    transition:
      transform var(--dur-med) var(--ease-smooth),
      visibility 0s linear var(--dur-med);
  }

  body.page-chat.chat-mobile-right-open .page-col-right{
    transform:translateX(0);
    visibility:visible;
    pointer-events:auto;
    transition:
      transform var(--dur-med) var(--ease-smooth),
      visibility 0s linear 0s;
  }

  body.page-chat .page-col-right > .client-info-panel{
    display:flex;
    flex-direction:column;
    height:100%;
    min-height:0;
    width:100%;
    background:var(--color-surface);
    border-top-left-radius:var(--radius-lg);
    border-top-right-radius:var(--radius-lg);
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
    box-shadow:var(--shadow-sm);
    overflow:hidden;
  }

  body.page-chat .page-col-right > #ordersRightPane,
  body.page-chat .page-col-right > #ordersCheckoutRightPane{
    display:none;
    flex-direction:column;
    height:100%;
    min-height:0;
    width:100%;
    background:var(--color-surface);
    border-top-left-radius:var(--radius-lg);
    border-top-right-radius:var(--radius-lg);
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
    box-shadow:var(--shadow-sm);
    overflow:hidden;
  }

  body.page-chat.chat-right-order-mode .page-col-right > .client-info-panel{
    display:none;
  }

  body.page-chat.chat-right-order-mode .page-col-right > #ordersRightPane,
  body.page-chat.chat-right-order-mode .page-col-right > #ordersCheckoutRightPane:not(.hidden){
    display:flex;
  }

body.page-chat .page-col-right > .client-info-panel > .panel-body{
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
  padding-bottom:88px;
}

  body.page-chat .page-col-right #clientInfoWrap{
    display:grid;
    grid-template-rows:auto auto minmax(0, 1fr);
    gap:0;
    min-height:100%;
    height:100%;
  }

  body.page-chat .page-col-right #clientTabOrders.shop-profile-tab-panel.is-active{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    padding-bottom:0;
  }

  body.page-chat .page-col-right #clientTabAddresses.shop-profile-tab-panel.is-active{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:12px;
    min-height:0;
    overflow:auto;
    scrollbar-width:none;
    -ms-overflow-style:none;
  }

  body.page-chat .page-col-right #clientTabAddresses.shop-profile-tab-panel.is-active::-webkit-scrollbar{
    display:none;
    width:0;
    height:0;
  }

  body.page-chat .page-col-right #clientAddrToggleBtn{
    align-self:flex-start;
    margin-top:0;
  }

  body.page-chat .page-col-right #clientTabAddresses #clientAddresses{
    flex:0 0 auto;
    align-content:start;
  }

  body.page-chat .page-col-right #clientOrdersListView{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
  }

  body.page-chat .page-col-right #clientOrdersList{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    gap:10px;
    min-height:0;
    height:100%;
    overflow-y:auto;
    padding-right:2px;
    padding-bottom:96px;
    align-content:flex-start;
    scrollbar-width:none;
    -ms-overflow-style:none;
  }

  body.page-chat .page-col-right #clientOrdersList > *{
    flex:0 0 auto;
  }

  body.page-chat .page-col-right #clientOrdersList::-webkit-scrollbar{
    display:none;
    width:0;
    height:0;
  }

  body.page-chat .page-col-right #clientBenefitsFooter{
    position:fixed;
    right:12px;
    bottom:calc(var(--chat-mobile-nav-panel-bottom) + 10px);
    z-index:95;
    margin:0;
    padding:0;
    background:transparent;
    border-top:0;
    width:auto;
  }

  body.page-chat .page-col-right #clientBenefitsFooter .shop-cart-footer{
    margin:0;
    padding:0;
    border-top:0;
    background:transparent;
  }

  body.page-chat .page-col-right #clientBenefitsFooter .shop-cart-footer-actions{
    justify-content:flex-end;
    gap:8px;
    margin:0;
  }

  body.page-chat .page-col-right #clientTabsHeader,
  body.page-chat .page-col-right #clientTabsHeader.hidden{
    display:flex !important;
    flex:0 0 auto;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    min-height:56px;
    padding:12px;
    background:var(--color-surface);
    border-bottom:1px solid var(--color-border);
  }

  body.page-chat .page-col-right #clientTabsHeader .product-tabs{
    display:none;
  }

  body.page-chat .page-col-right #clientTabsHeader .client-mobile-sheet-close{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    width:40px;
    height:40px;
    min-width:40px;
    margin-left:auto;
    opacity:1;
    visibility:visible;
    color:var(--color-text);
    background:var(--color-surface);
    border:1px solid var(--color-border);
    box-shadow:var(--shadow-sm);
  }

  body.page-chat .page-col-right #clientTabsHeader .client-mobile-sheet-close i{
    font-size:16px;
    line-height:1;
    pointer-events:none;
  }

  body.page-chat .page-col-right #chatRightTabsHeader .chat-mobile-right-back{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    width:40px;
    height:40px;
    min-width:40px;
    flex:0 0 40px;
  }

  body.page-chat .page-col-right #chatRightTabsHeader .product-tabs{
    display:none;
  }

  /* Chat right column uses its own tab strip (#chatRightTabsHeader). Force-hide legacy tab headers. */
  body.page-chat .page-col-right #orderTabsHeader,
  body.page-chat .page-col-right #orderTabsHeaderCheckout,
  body.page-chat .page-col-right #clientTabsHeader,
  body.page-chat .page-col-right #clientTabsHeader.hidden{
    display:none !important;
  }

  .chat-delete-confirm-overlay{
    padding:10px;
  }

  .chat-delete-confirm-card{
    width:min(96vw, 360px);
    border-radius:18px;
    padding:16px 14px 12px;
  }

  .chat-header-toolbar{
    flex-direction:row;
    justify-content:stretch;
    align-items:center;
    gap:0;
    padding:0;
  }

  .chat-mobile-clients-back,
  .chat-mobile-clients-close{
    display:inline-flex;
  }

  .chat-main-order.order-row{
    flex:1 1 auto;
    width:auto;
    min-width:0;
    grid-template-columns:minmax(0, 1fr);
    grid-template-rows:auto auto;
    grid-template-areas:
      "top"
      "bottom";
    gap:4px;
    align-items:stretch;
    padding:4px 8px;
  }

  .chat-main-order-top{
    grid-area:top;
    display:grid;
    grid-template-columns:28px 64px minmax(0, 1fr) 28px max-content max-content;
    grid-template-areas:"back id . time stage total";
    align-items:start;
    column-gap:4px;
    row-gap:0;
    min-width:0;
  }

  .chat-main-order-bottom{
    grid-area:bottom;
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas:"client address";
    gap:8px;
    min-width:0;
    align-items:start;
  }

  .chat-main-order .chat-mobile-clients-back{
    grid-area:back;
    width:28px;
    height:28px;
    border-radius:8px;
    align-self:start;
    justify-self:start;
    margin-top:0;
  }

  .chat-main-order .order-col.order-id{
    grid-area:id;
    align-self:start;
    width:64px;
    min-width:64px;
    display:grid;
    justify-items:center;
    justify-self:start;
    text-align:center;
    margin-top:0;
  }

  .chat-main-order .order-col.order-client{
    grid-area:client;
    min-width:0;
    display:grid;
    gap:1px;
    align-self:start;
    justify-self:stretch;
    width:100%;
    padding-top:0;
  }

  .chat-main-order .order-col.order-address{
    grid-area:address;
    min-width:0;
    padding-left:0;
    display:grid;
    grid-template-rows:1fr 1fr;
    align-self:start;
    justify-self:stretch;
    width:100%;
    margin-top:0;
  }

  .chat-main-order .order-col.order-stage{
    grid-area:stage;
    width:auto;
    min-width:0;
    display:flex;
    justify-content:center;
    justify-self:end;
    align-self:start;
    margin-top:0;
  }

  .chat-main-order .order-col.order-total{
    grid-area:total;
    width:auto;
    min-width:0;
    display:flex;
    justify-content:center;
    justify-self:end;
    align-self:start;
    margin-top:0;
  }

  .chat-main-order .order-col.order-indicators{
    grid-area:time;
    display:flex;
    justify-content:center;
    align-items:center;
    min-width:28px;
    justify-self:end;
    align-self:start;
    margin-top:0;
  }

  .chat-main-order.order-row .order-id-num{
    font-size:16px;
    line-height:1;
  }

  .chat-main-order.order-row .order-id-time,
  .chat-main-order.order-row .order-client-phone,
  .chat-main-order.order-row .order-address-comment{
    font-size:9px;
    line-height:1.1;
  }

  .chat-main-order.order-row .order-id-time{
    display:block;
    text-align:center;
  }

  .chat-main-order .order-client-name,
  .chat-main-order .order-client-phone,
  .chat-main-order .order-address-line,
  .chat-main-order .order-address-comment{
    display:grid;
    grid-template-columns:12px minmax(0, 1fr);
    align-items:center;
    column-gap:4px;
    min-height:0;
  }

  .chat-main-order .order-client-name{
    font-size:13px;
    line-height:1.05;
    width:100%;
  }

  .chat-main-order .order-address-line{
    font-size:13px;
    line-height:1.05;
    width:100%;
  }

  .chat-main-order .order-client-phone,
  .chat-main-order .order-address-comment{
    display:grid;
  }

  .chat-main-order .order-client-name i,
  .chat-main-order .order-client-phone i,
  .chat-main-order .order-address-line i,
  .chat-main-order .order-address-comment i{
    width:12px;
    margin-right:0;
    text-align:center;
    font-size:11px;
  }

  .chat-main-order .order-address-line span,
  .chat-main-order .order-client-name-text,
  .chat-main-order .order-address-comment span{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .chat-main-order .order-col.order-address{
    padding-left:0;
  }

  .chat-main-order .order-indicators .order-time-icon{
    width:28px;
    height:28px;
    min-width:28px;
    border-radius:8px;
    border-width:1px;
  }

  .chat-main-order .order-indicators .order-time-icon i{
    font-size:13px;
  }

  .chat-main-order .order-indicators .order-time-icon.is-empty{
    visibility:hidden;
    border-color:transparent;
    background:transparent;
  }

  .chat-main-order .chat-main-order-status{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:28px;
    min-height:28px;
    width:auto;
    min-width:0;
    max-width:100%;
    padding:0 8px;
    border-radius:8px;
    font-size:11px;
    line-height:1.05;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .chat-main-order .chat-main-order-status-icon{
    display:none;
  }

  .chat-main-order .chat-main-order-status-text{
    display:block;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .chat-main-order.order-row.is-order-empty .order-col.order-id,
  .chat-main-order.order-row.is-order-empty .order-col.order-indicators,
  .chat-main-order.order-row.is-order-empty .order-col.order-stage,
  .chat-main-order.order-row.is-order-empty .order-col.order-total{
    opacity:0;
    pointer-events:none;
  }

  .chat-main-order .chat-main-order-total{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:auto;
    height:28px;
    min-height:28px;
    min-width:0;
    max-width:none;
    font-size:10px;
    padding:0 6px;
    border-radius:8px;
    line-height:1.05;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .chat-main-composer{
    display:grid;
    grid-template-columns:48px minmax(0, 1fr) 48px;
    align-items:end;
    column-gap:4px;
    row-gap:8px;
    width:100%;
    box-sizing:border-box;
    min-height:0;
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    overscroll-behavior:none;
    touch-action:manipulation;
  }

  .chat-selection-toolbar{
    margin:0;
    padding:8px 10px;
    border:1px solid color-mix(in srgb, var(--color-border), transparent 10%);
    border-radius:20px;
    background:color-mix(in srgb, var(--color-surface), transparent 44%);
    box-shadow:
      0 10px 24px rgba(15,23,42,.12),
      inset 0 1px 0 rgba(255,255,255,.48);
    backdrop-filter:blur(18px) saturate(150%);
    -webkit-backdrop-filter:blur(18px) saturate(150%);
  }

  .chat-selection-count{
    font-size:15px;
  }

  .chat-footer-island{
    padding:0 0 calc(max(6px, env(safe-area-inset-bottom)));
    border:0;
    box-shadow:none;
    background:transparent;
  }

  .chat-scroll-down{
    right:18px;
    bottom:calc(
      27px + var(--chat-scroll-down-composer-extra)
    );
    width:38px;
    height:38px;
    overscroll-behavior:none;
    touch-action:none;
  }

  .chat-input-rich-wrap{
    box-sizing:border-box;
    min-height:48px;
    max-height:168px;
    overflow:hidden;
    border:1px solid var(--chat-mobile-glass-control-border);
    border-radius:24px;
    background:var(--chat-mobile-glass-control-bg);
    box-shadow:none;
    backdrop-filter:blur(14px) saturate(150%);
    -webkit-backdrop-filter:blur(14px) saturate(150%);
  }

  .chat-input-rich-wrap .chat-message-input{
    min-height:46px;
    max-height:166px;
  }

  .chat-input-rich-preview{
    padding:12px 14px 12px 10px;
  }

  .chat-message-input{
    height:46px;
    min-height:46px;
    padding:12px 14px 12px 10px;
    font-size:16px;
  }

  .chat-message-input::placeholder{
    line-height:1.25;
    transform:none;
  }

  .chat-composer-reply{
    grid-column:1 / -1;
    margin:0 0 2px;
    padding:8px 12px 8px 8px;
    border:1px solid color-mix(in srgb, var(--color-border), transparent 12%);
    border-radius:20px;
    background:color-mix(in srgb, var(--color-surface), transparent 58%);
    box-shadow:
      0 12px 28px rgba(15,23,42,.12),
      inset 0 1px 0 rgba(255,255,255,.5);
    backdrop-filter:blur(18px) saturate(150%);
    -webkit-backdrop-filter:blur(18px) saturate(150%);
  }

  .chat-main-composer #chatAttachBtn,
  .chat-main-composer #chatSendBtn,
  .chat-main-composer .chat-input-rich-wrap{
    align-self:end;
  }

  .chat-main-composer #chatAttachBtn{
    box-sizing:border-box;
    width:48px;
    height:48px;
    min-width:48px;
    border:1px solid var(--chat-mobile-glass-control-border);
    border-radius:999px;
    background:var(--chat-mobile-glass-control-bg);
    color:var(--color-text-muted);
    box-shadow:none;
    backdrop-filter:blur(14px) saturate(150%);
    -webkit-backdrop-filter:blur(14px) saturate(150%);
  }

  .chat-main-composer .chat-composer-btn,
  .chat-send-btn,
  .chat-send-btn.btn-sm{
    box-sizing:border-box;
    width:48px;
    height:48px;
    min-width:48px;
    padding:0;
  }

  .chat-send-btn,
  .chat-send-btn.btn-sm{
    margin-left:0;
    border:0;
    border-radius:999px;
    color:var(--on-primary);
    background:#f68b2c;
    background-image:linear-gradient(180deg, #ff9b3d 0%, #f57c1f 100%);
    box-shadow:0 8px 18px rgba(245,124,31,.28);
  }

  .chat-main-composer #chatSendBtn,
  .chat-send-btn:hover,
  .chat-send-btn.btn-primary:hover,
  .chat-send-btn.is-editing,
  .chat-main-composer #chatSendBtn:hover,
  .chat-main-composer #chatSendBtn:focus,
  .chat-main-composer #chatSendBtn:focus-visible,
  .chat-main-composer #chatSendBtn:active,
  .chat-main-composer #chatSendBtn.is-editing,
  .chat-main-composer #chatSendBtn:disabled,
  .chat-main-composer #chatSendBtn[disabled]{
    color:var(--on-primary);
    background:#f68b2c;
    background-image:linear-gradient(180deg, #ff9b3d 0%, #f57c1f 100%);
    border:0;
    box-shadow:0 8px 18px rgba(245,124,31,.28);
    opacity:1;
    -webkit-text-fill-color:currentColor;
  }

  .chat-send-btn:focus,
  .chat-send-btn:focus-visible,
  .chat-send-btn:active,
  .chat-send-btn.btn-primary:focus,
  .chat-send-btn.btn-primary:focus-visible,
  .chat-send-btn.btn-primary:active,
  .chat-send-btn.btn-sm:focus,
  .chat-send-btn.btn-sm:focus-visible,
  .chat-send-btn.btn-sm:active{
    color:var(--on-primary);
    background:#f68b2c;
    background-image:linear-gradient(180deg, #ff9b3d 0%, #f57c1f 100%);
    border:0;
    outline:none;
    box-shadow:0 8px 18px rgba(245,124,31,.28);
    transform:none;
    opacity:1;
    -webkit-text-fill-color:currentColor;
  }

  .chat-main-composer .chat-composer-btn i,
  .chat-send-btn i{
    font-size:18px;
  }

  .chat-main-composer .chat-emoji-wrap{
    display:none;
  }

  .chat-message-menu{
    min-width:224px;
    max-height:min(420px, calc(100dvh - 140px));
    border-radius:24px;
  }
}
.product-photo-grid-modal-overlay{
  position: fixed;
  inset: 0;
  z-index: 10030;
  background: rgba(17, 24, 39, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.product-photo-grid-modal-card{
  width: min(920px, calc(100vw - 32px));
  height: min(680px, calc(100vh - 32px));
  background: var(--color-surface, #fff);
  border: 1px solid var(--color-border);
  border-radius: 16px;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.28);
  display: grid;
  grid-template-rows: 56px minmax(0, 1fr) 64px;
  overflow: hidden;
}

.product-photo-grid-modal-head{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  border-bottom: 1px solid var(--color-border);
}

.product-photo-grid-modal-close{
  width: 36px;
  height: 36px;
  margin-left: auto;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  color: var(--color-text);
  cursor: pointer;
}

.product-photo-grid-modal-title{
  font-size: 28px;
  font-weight: 800;
  color: var(--color-text);
}

.product-photo-grid-modal-body{
  position: relative;
  min-height: 0;
  overflow: auto;
  padding: 14px;
}

.product-photo-grid-modal-drop-hint{
  position: absolute;
  inset: 14px;
  border-radius: 12px;
  border: 2px dashed color-mix(in srgb, var(--color-primary), transparent 35%);
  background: transparent;
  color: transparent;
  font-size: 0;
  line-height: 0;
  display: block;
  padding: 0;
  opacity: 0;
  pointer-events: none;
  transform: scale(0.99);
  transition: opacity .15s ease, transform .15s ease;
  z-index: 3;
}

.product-photo-grid-modal-card.is-file-drag-over .product-photo-grid-modal-drop-hint{
  opacity: 1;
  transform: scale(1);
}

.product-photo-grid-modal-grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.product-photo-grid-modal-item{
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.product-photo-grid-modal-item.is-dragging{
  opacity: 0.45;
}

.product-photo-grid-modal-item.is-drop-target .product-photo-grid-modal-tile{
  outline: 2px solid var(--color-primary);
  outline-offset: -2px;
}

.product-photo-grid-modal-tile{
  position: relative;
  aspect-ratio: 1 / 1;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  background: var(--color-surface-2);
  overflow: hidden;
}

.product-photo-grid-modal-remove{
  position: absolute;
  top: 8px;
  right: 8px;
  width: 24px;
  height: 24px;
  border: none;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  transition: opacity .15s ease, background .15s ease;
  z-index: 2;
}

.product-photo-grid-modal-tile:hover .product-photo-grid-modal-remove{
  opacity: 1;
}

.product-photo-grid-modal-remove:hover{
  background: rgba(220, 38, 38, 0.95);
}

.product-photo-grid-modal-tile img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.product-photo-grid-modal-tile.is-uploading img{
  filter: blur(2px) brightness(0.7);
}

.product-photo-grid-modal-loader{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.2);
  pointer-events: none;
}

.product-photo-grid-modal-spinner{
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 3px solid rgba(255,255,255,0.35);
  border-top-color: #fff;
  animation: product-photo-grid-spin .8s linear infinite;
}

@keyframes product-photo-grid-spin{
  to { transform: rotate(360deg); }
}

.product-photo-grid-modal-size{
  min-height: 16px;
  font-size: 12px;
  line-height: 1.2;
  color: var(--color-text-muted);
  text-align: center;
}

.product-photo-grid-modal-tile.is-empty{
  background: var(--color-surface-2);
}

.product-photo-grid-modal-tile--add{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-style: dashed;
  color: var(--color-text-muted);
  font-size: 24px;
  background: var(--color-surface);
}

.product-photo-grid-modal-tile--add:hover{
  border-color: var(--color-primary);
  color: var(--color-primary);
  background: var(--primary-12);
}

.product-photo-grid-modal-empty{
  grid-column: 1 / -1;
  padding: 24px 8px;
  text-align: center;
  color: var(--color-text-muted);
}

.product-photo-grid-modal-foot{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-top: 1px solid var(--color-border);
}

/* ================= Cashier Workspace V1 ================= */

body.page-new-order .page-col-left{
  gap:10px;
}

body.page-new-order .page-col-left > .panel{
  height:auto;
}

body.page-new-order .page-col-left > #cashierQueuePanel{
  flex:0 0 auto;
}

body.page-new-order .page-col-left > .panel:not(#cashierQueuePanel){
  flex:1 1 auto;
  min-height:0;
}

.cashier-toolbar-meta{
  flex:1 1 auto;
  min-width:220px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.cashier-toolbar-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:34px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  font-size:13px;
  font-weight:800;
  color:var(--color-text);
}

.cashier-toolbar-chip.is-open{
  border-color:rgba(16,185,129,.28);
  background:rgba(16,185,129,.1);
}

.cashier-toolbar-chip.is-closed{
  border-color:rgba(239,68,68,.2);
  background:rgba(239,68,68,.08);
}

.cashier-toolbar-chip-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#10b981;
}

.cashier-toolbar-chip.is-closed .cashier-toolbar-chip-dot{
  background:#ef4444;
}

.cashier-toolbar-stat{
  display:grid;
  gap:2px;
  min-width:120px;
}

.cashier-toolbar-stat span{
  font-size:11px;
  color:var(--color-text-muted);
}

.cashier-toolbar-stat strong{
  font-size:14px;
  color:var(--color-text);
}

.cashier-toolbar-actions{
  display:flex;
  align-items:center;
  gap:8px;
}

.cashier-queue-panel .panel-body.cashier-queue-body{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.cashier-shift-card{
  display:grid;
  gap:10px;
  padding:12px;
  border-radius:16px;
  border:1px solid var(--color-border);
  background:linear-gradient(160deg,var(--color-surface),var(--color-surface-2));
}

.cashier-shift-card.is-open{
  border-color:rgba(16,185,129,.28);
}

.cashier-shift-card.is-closed{
  border-color:rgba(239,68,68,.16);
}

.cashier-shift-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.cashier-shift-card-title{
  font-size:14px;
  font-weight:900;
  color:var(--color-text);
}

.cashier-shift-card-sub{
  font-size:12px;
  color:var(--color-text-muted);
}

.cashier-shift-card-badge{
  min-width:42px;
  height:26px;
  padding:0 10px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:900;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
}

.cashier-shift-metrics{
  display:grid;
  gap:8px;
}

.cashier-shift-metric{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:13px;
}

.cashier-shift-metric span{
  color:var(--color-text-muted);
}

.cashier-shift-metric strong{
  color:var(--color-text);
}

.cashier-queue-tabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
}

.cashier-queue-tab{
  height:38px;
  border:none;
  border-radius:12px;
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  font-size:13px;
  font-weight:800;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease-smooth),color var(--dur-fast) var(--ease-smooth),transform var(--dur-fast) var(--ease-smooth);
}

.cashier-queue-tab.is-active{
  background:var(--color-primary);
  color:#fff;
}

.cashier-queue-search{
  position:relative;
  display:block;
}

.cashier-queue-search i{
  position:absolute;
  top:50%;
  left:12px;
  transform:translateY(-50%);
  color:var(--color-text-muted);
  font-size:13px;
}

.cashier-queue-search .control{
  width:100%;
  height:40px;
  padding-left:36px;
  border-radius:12px;
  background:var(--color-surface-2);
}

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

.cashier-queue-item{
  width:100%;
  border:1px solid var(--color-border);
  border-radius:14px;
  background:var(--color-surface);
  color:var(--color-text);
  padding:12px;
  text-align:left;
  display:grid;
  gap:8px;
  cursor:pointer;
  transition:transform var(--dur-fast) var(--ease-smooth),border-color var(--dur-fast) var(--ease-smooth),box-shadow var(--dur-fast) var(--ease-smooth);
}

.cashier-queue-item:hover{
  transform:translateY(-1px);
  border-color:var(--primary-25);
  box-shadow:0 8px 18px rgba(15,23,42,.06);
}

.cashier-queue-item.is-active{
  border-color:var(--primary-45);
  box-shadow:0 0 0 3px var(--primary-12);
}

.cashier-queue-item-head,
.cashier-queue-item-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.cashier-queue-item-head strong,
.cashier-queue-item-foot strong{
  font-weight:900;
}

.cashier-queue-item-title{
  font-weight:800;
  color:var(--color-text);
}

.cashier-queue-item-sub{
  font-size:12px;
  color:var(--color-text-muted);
}

.cashier-queue-badge{
  height:24px;
  padding:0 9px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:900;
}

.cashier-queue-badge.is-paid{
  border-color:rgba(16,185,129,.25);
  background:rgba(16,185,129,.1);
  color:#047857;
}

.cashier-queue-badge.is-pending{
  border-color:rgba(249,115,22,.24);
  background:rgba(249,115,22,.1);
  color:#c2410c;
}

.cashier-queue-placeholder{
  border:1px dashed var(--color-border);
  border-radius:14px;
  padding:16px;
  text-align:center;
  color:var(--color-text-muted);
}

.cashier-order-controls{
  display:grid;
  gap:10px;
}

.cashier-order-card{
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface-2);
  padding:12px;
  display:grid;
  gap:10px;
}

.cashier-order-card--compact{
  background:var(--color-surface);
}

.cashier-order-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.cashier-order-card-title{
  font-size:14px;
  font-weight:900;
  color:var(--color-text);
}

.cashier-order-card-sub{
  font-size:12px;
  color:var(--color-text-muted);
}

.cashier-order-status{
  height:26px;
  padding:0 10px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:900;
  border:1px solid var(--color-border);
}

.cashier-order-status.is-ready{
  border-color:rgba(16,185,129,.25);
  background:rgba(16,185,129,.12);
  color:#047857;
}

.cashier-order-status.is-blocked{
  border-color:rgba(239,68,68,.2);
  background:rgba(239,68,68,.08);
  color:#b42318;
}

.cashier-order-status.is-paid{
  border-color:rgba(59,130,246,.22);
  background:rgba(59,130,246,.1);
  color:#1d4ed8;
}

.cashier-payment-methods{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(92px,1fr));
  gap:8px;
}

.cashier-payment-method{
  height:40px;
  border:1px solid var(--color-border);
  border-radius:12px;
  background:var(--color-surface);
  color:var(--color-text);
  font-weight:800;
  cursor:pointer;
  transition:border-color var(--dur-fast) var(--ease-smooth),background var(--dur-fast) var(--ease-smooth),color var(--dur-fast) var(--ease-smooth);
}

.cashier-payment-method.is-active{
  border-color:var(--color-primary);
  background:var(--primary-12);
  color:var(--color-primary);
}

.cashier-cash-receipt{
  display:grid;
  gap:10px;
}

.cashier-cash-quick{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.cashier-quick-chip{
  height:32px;
  padding:0 10px;
  border:none;
  border-radius:999px;
  background:var(--color-surface);
  color:var(--color-text);
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}

.cashier-received-field{
  display:grid;
  gap:6px;
}

.cashier-received-field span{
  font-size:12px;
  font-weight:700;
  color:var(--color-text-muted);
}

.cashier-cash-summary{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.cashier-cash-summary div,
.cashier-compact-metrics div{
  padding:10px 12px;
  border-radius:12px;
  background:var(--color-surface);
  display:grid;
  gap:4px;
}

.cashier-cash-summary span,
.cashier-compact-metrics span{
  font-size:12px;
  color:var(--color-text-muted);
}

.cashier-cash-summary strong,
.cashier-compact-metrics strong{
  font-size:14px;
  color:var(--color-text);
}

.cashier-cash-hint,
.cashier-paid-note{
  font-size:12px;
  line-height:1.45;
  color:var(--color-text-muted);
  padding:10px 12px;
  border-radius:12px;
  background:var(--color-surface);
}

.cashier-pay-btn{
  width:100%;
  min-height:44px;
  justify-content:center;
}

.cashier-compact-metrics{
  display:grid;
  gap:8px;
}

.cashier-compact-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
}

.cash-page-shift-shell{
  display:grid;
  gap:10px;
  padding:12px;
  border-radius:16px;
  border:1px solid var(--color-border);
  background:linear-gradient(160deg,var(--color-surface),var(--color-surface-2));
}

.cash-page-shift-shell.is-open{
  border-color:rgba(16,185,129,.28);
}

.cash-page-shift-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.cash-page-shift-title{
  font-size:14px;
  font-weight:900;
}

.cash-page-shift-sub{
  font-size:12px;
  color:var(--color-text-muted);
}

.cash-page-shift-badge{
  min-width:44px;
  height:26px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:900;
}

.cash-page-shift-metrics{
  display:grid;
  gap:8px;
}

.cash-page-shift-metrics div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:13px;
}

.cash-page-shift-metrics span{
  color:var(--color-text-muted);
}

.cash-summary-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-bottom:12px;
}

.cash-summary-card{
  min-height:84px;
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface);
  padding:12px;
  display:grid;
  gap:6px;
}

.cash-summary-card span{
  font-size:12px;
  color:var(--color-text-muted);
}

.cash-summary-card strong{
  font-size:20px;
  font-weight:900;
  color:var(--color-text);
}

.cash-journal-list{
  display:grid;
  gap:8px;
}
.cash-journal-list--orders{
  gap:10px;
}

.cash-journal-entry{
  width:100%;
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface);
  color:var(--color-text);
  padding:12px;
  display:grid;
  grid-template-columns:40px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  text-align:left;
  cursor:pointer;
  transition:border-color var(--dur-fast) var(--ease-smooth),box-shadow var(--dur-fast) var(--ease-smooth),transform var(--dur-fast) var(--ease-smooth);
}

.cash-journal-entry:hover{
  transform:translateY(-1px);
  border-color:var(--primary-25);
  box-shadow:0 10px 24px rgba(15,23,42,.06);
}

.cash-journal-entry.is-active{
  border-color:var(--primary-45);
  box-shadow:0 0 0 3px var(--primary-12);
}

.cash-journal-entry--static{
  cursor:default;
}

.cash-journal-entry--static:hover{
  transform:none;
  border-color:var(--color-border);
  box-shadow:none;
}

.cash-journal-entry-icon{
  width:40px;
  height:40px;
  border-radius:12px;
  background:var(--color-surface-2);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--color-primary);
}

.cash-journal-entry-main{
  min-width:0;
  display:grid;
  gap:4px;
}

.cash-journal-entry-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.cash-journal-entry-top strong{
  font-size:14px;
  font-weight:900;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.cash-journal-entry-top span,
.cash-journal-entry-sub,
.cash-journal-entry-meta{
  font-size:12px;
  color:var(--color-text-muted);
}

.cash-journal-entry-sub{
  font-size:13px;
}

.cash-journal-entry-amount{
  font-size:16px;
  font-weight:900;
  white-space:nowrap;
}

.cash-toolbar-filter{
  min-width:176px;
}

.cash-toolbar-filter .new-order-right-select-trigger{
  width:auto;
  min-width:176px;
  justify-content:space-between;
  background:var(--color-surface);
}

.cash-toolbar-filter-main{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.cash-toolbar-filter-main i{
  font-size:14px;
  color:var(--color-text-muted);
}

.cash-toolbar-filter .new-order-right-select-menu{
  display:none;
  left:0;
  transform:none;
  width:220px;
}

.cash-toolbar-filter.is-open .new-order-right-select-menu{
  display:grid;
}

.cash-operation-card{
  margin:0 auto;
  max-width:340px;
  display:grid;
  gap:10px;
  padding:14px;
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface);
}

.cash-operation-card-title{
  font-size:16px;
  font-weight:900;
}

.cash-operation-card-meta,
.cash-operation-card-note{
  font-size:13px;
  color:var(--color-text-muted);
}

.cash-operation-card-amount{
  font-size:22px;
  font-weight:900;
}

.cash-operation-card-breakdown{
  display:grid;
  gap:6px;
  padding-top:4px;
}

.cash-operation-card-breakdown-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:13px;
}

.cash-modal-form{
  display:grid;
  gap:12px;
  padding:4px 2px;
}

.cash-modal-field{
  display:grid;
  gap:6px;
}

.cash-modal-label{
  font-size:13px;
  font-weight:800;
  color:var(--color-text);
}

.cash-modal-note{
  padding:12px;
  border-radius:14px;
  background:var(--color-surface-2);
  color:var(--color-text-muted);
  font-size:13px;
  line-height:1.45;
}

.cash-modal-textarea{
  min-height:96px;
  padding:10px 14px !important;
  border-radius:16px !important;
  resize:vertical;
}

.cash-modal-error{
  padding:10px 12px;
  border-radius:12px;
  background:rgba(239,68,68,.1);
  color:#b42318;
  font-size:13px;
  line-height:1.4;
}

.app-modal.cash-payment-app-modal{
  width:560px !important;
  max-width:calc(100vw - 24px) !important;
  height:min(860px, calc(100vh - 56px)) !important;
  max-height:calc(100vh - 56px) !important;
  border-radius:28px !important;
  box-shadow:0 28px 80px rgba(15,23,42,.18) !important;
}

.app-modal.cash-payment-app-modal .app-modal-header{
  min-height:64px !important;
  padding:12px 16px 4px !important;
}

.app-modal.cash-payment-app-modal .app-modal-title{
  text-align:left !important;
  font-size:22px !important;
  font-weight:900 !important;
}

.app-modal.cash-payment-app-modal .app-modal-actions .btn-icon{
  width:48px !important;
  height:48px !important;
  border-radius:999px !important;
  background:var(--color-surface-2) !important;
  border:1px solid var(--color-border) !important;
}

.app-modal.cash-payment-app-modal .app-modal-body{
  padding:0 16px 16px !important;
}

.app-modal.cash-payment-app-modal .app-modal-body::after{
  display:none !important;
}

.app-modal.cash-payment-app-modal .app-modal-footer{
  padding:12px 16px 16px !important;
  border-top:0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1.45fr) !important;
  gap:12px !important;
}

.app-modal.cash-payment-app-modal .app-modal-footer .btn{
  height:56px !important;
  border-radius:999px !important;
  font-weight:800 !important;
  padding-inline:20px !important;
}

@media (max-width:768px){
  .app-modal.cash-payment-app-modal{
    left:0 !important;
    right:0 !important;
    top:auto !important;
    bottom:0 !important;
    width:100% !important;
    max-width:100% !important;
    height:calc(100dvh - var(--header-height)) !important;
    max-height:calc(100dvh - var(--header-height)) !important;
    border-radius:28px 28px 0 0 !important;
    transform:translateY(110%) !important;
  }

  .app-modal.cash-payment-app-modal.is-open{
    transform:translateY(0) !important;
  }

  .app-modal.cash-payment-app-modal .app-modal-body{
    padding:0 16px 16px !important;
    overflow-y:auto !important;
  }

  .app-modal.cash-payment-app-modal .app-modal-footer{
    grid-template-columns:minmax(0,1fr) minmax(0,1.45fr) !important;
    flex-shrink:0 !important;
    padding:12px 16px calc(16px + env(safe-area-inset-bottom)) !important;
    background:var(--color-surface) !important;
  }
}

.cash-payment-modal{
  display:grid;
  gap:16px;
}

.cash-payment-order-card{
  display:grid;
  gap:10px;
  padding:18px;
  border-radius:26px;
  border:1px solid var(--color-border);
  background:
    radial-gradient(circle at top right, var(--primary-12), transparent 42%),
    linear-gradient(180deg, #fff, var(--color-surface-2));
}

.cash-payment-order-kicker{
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--color-text-muted);
}

.cash-payment-order-meta{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
}

.cash-payment-order-main{
  display:grid;
  gap:4px;
}

.cash-payment-order-number{
  font-size:24px;
  font-weight:900;
  line-height:1.1;
  color:var(--color-text);
}

.cash-payment-order-subtitle{
  font-size:13px;
  color:var(--color-text-muted);
}

.cash-payment-order-total-wrap{
  display:grid;
  gap:4px;
  text-align:right;
}

.cash-payment-order-total-wrap span{
  font-size:12px;
  color:var(--color-text-muted);
}

.cash-payment-order-total-wrap strong{
  font-size:30px;
  font-weight:900;
  line-height:1;
  color:var(--color-text);
}

.cash-payment-section{
  display:grid;
  gap:10px;
}

.cash-payment-section-title{
  font-size:14px;
  font-weight:900;
  color:var(--color-text);
}

.cash-payment-customer-card{
  display:grid;
  gap:10px;
  padding:14px 16px;
  border-radius:20px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
}

.cash-payment-customer-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.cash-payment-customer-row span{
  font-size:12px;
  font-weight:700;
  color:var(--color-text-muted);
}

.cash-payment-customer-row strong{
  font-size:15px;
  font-weight:800;
  color:var(--color-text);
  text-align:right;
}

.cash-payment-method-carousel{
  display:flex;
  align-items:stretch;
  gap:12px;
  overflow-x:auto;
  overflow-y:hidden;
  padding:2px 0 4px;
  --cash-payment-side-pad: 8px;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
}

.cash-payment-method-carousel::-webkit-scrollbar{
  width:0;
  height:0;
}

.cash-payment-method-spacer{
  flex:0 0 var(--cash-payment-side-pad);
  pointer-events:none;
}

.cash-payment-method-pill{
  appearance:none;
  border:0;
  background:transparent;
  min-width:116px;
  padding:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  text-align:center;
  color:var(--color-text);
  cursor:pointer;
  scroll-snap-align:center;
  scroll-snap-stop:always;
}

.cash-payment-method-pill-icon{
  width:92px;
  height:92px;
  border-radius:24px;
  background:var(--color-surface-2);
  display:grid;
  place-items:center;
  overflow:hidden;
  color:var(--color-text-muted);
  font-size:38px;
  transition:background-color var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth), box-shadow var(--dur-fast) var(--ease-smooth), transform var(--dur-fast) var(--ease-smooth);
}

.cash-payment-method-pill-icon img{
  width:100%;
  height:100%;
  object-fit:contain;
}

.cash-payment-method-pill-title{
  font-size:15px;
  font-weight:800;
  line-height:1.2;
  color:var(--color-text-muted);
  white-space:nowrap;
  transition:color var(--dur-fast) var(--ease-smooth);
}

.cash-payment-method-pill:hover .cash-payment-method-pill-icon{
  background:var(--primary-12);
  color:var(--color-primary-hover);
}

.cash-payment-method-pill.is-active .cash-payment-method-pill-icon{
  background:color-mix(in srgb, var(--color-primary-hover) 14%, var(--color-surface-2));
  color:var(--color-primary-hover);
  box-shadow:0 10px 24px rgba(107,114,128,.32);
  transform:translateY(-2px);
}

.cash-payment-method-pill.is-active .cash-payment-method-pill-title{
  color:var(--color-text);
}

.cash-payment-change-grid{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.cash-payment-change-pill{
  appearance:none;
  border:1px solid var(--color-border);
  background:#fff;
  border-radius:999px;
  padding:10px 14px;
  font-size:13px;
  font-weight:800;
  color:var(--color-text);
  cursor:pointer;
  transition:border-color var(--dur-fast) var(--ease-smooth), background var(--dur-fast) var(--ease-smooth), color var(--dur-fast) var(--ease-smooth);
}

.cash-payment-change-pill:hover{
  border-color:var(--primary-45);
  background:var(--primary-12);
}

.cash-payment-change-pill.is-active{
  border-color:var(--primary-45);
  background:var(--primary-14);
  color:var(--color-text);
}

.cash-payment-change-pill.is-disabled{
  opacity:.45;
  cursor:not-allowed;
}

.cash-payment-input-card{
  display:grid;
  gap:6px;
  padding:14px 16px;
  border-radius:20px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
}

.cash-payment-input-label{
  font-size:12px;
  font-weight:800;
  color:var(--color-text-muted);
}

.cash-payment-input-card .control{
  height:48px;
  border-radius:16px;
  background:#fff;
}

.cash-payment-amount-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.cash-payment-amount-card{
  display:grid;
  gap:4px;
  padding:12px 14px;
  border-radius:18px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
}

.cash-payment-amount-card-primary{
  background:linear-gradient(180deg,#fff,var(--color-surface-2));
}

.cash-payment-amount-card span{
  font-size:12px;
  font-weight:700;
  color:var(--color-text-muted);
}

.cash-payment-amount-card strong{
  font-size:18px;
  font-weight:900;
  color:var(--color-text);
}
.cash-refund-list{
  display:grid;
  gap:10px;
}
.cash-refund-item{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:12px;
  align-items:flex-start;
  padding:12px;
  border-radius:18px;
  border:1px solid var(--color-border);
  background:var(--color-surface-2);
}
.cash-refund-item.is-selected{
  border-color:var(--primary-25);
  background:color-mix(in srgb, var(--primary-12) 52%, var(--color-surface-2));
}
.cash-refund-toggle{
  width:28px;
  height:28px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:transparent;
  display:grid;
  place-items:center;
  cursor:pointer;
}
.cash-refund-toggle.is-selected{
  border-color:var(--color-primary);
  background:var(--color-primary);
  color:#fff;
}
.cash-refund-main{
  display:grid;
  gap:8px;
  min-width:0;
}
.cash-refund-order-card{
  padding:0;
  border:none;
  background:transparent;
}
.cash-refund-order-card .order-item-content{
  min-height:0;
}
.cash-refund-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.cash-refund-top strong{
  font-size:14px;
  font-weight:900;
}
.cash-refund-top span,
.cash-refund-meta{
  font-size:12px;
  color:var(--color-text-muted);
}
.cash-refund-qty{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.cash-refund-qty-btn{
  width:32px;
  height:32px;
  border-radius:10px;
  border:1px solid var(--color-border);
  background:var(--color-surface);
  color:var(--color-text);
  display:grid;
  place-items:center;
  cursor:pointer;
  font-size:16px;
  font-weight:900;
}
.cash-refund-qty-value{
  min-width:24px;
  text-align:center;
  font-size:14px;
  font-weight:800;
}
.cash-refund-note{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:12px 14px;
  border-radius:16px;
  border:1px dashed var(--primary-25);
  background:var(--primary-12);
  color:var(--color-text);
  font-size:13px;
}
.cash-refund-empty{
  padding:14px 16px;
  border-radius:16px;
  border:1px dashed var(--color-border);
  color:var(--color-text-muted);
  font-size:13px;
}
.cash-refund-textarea{
  min-height:96px;
  resize:vertical;
}
.cash-journal-entry--refund{
  border-color:rgba(239,68,68,.18);
  background:rgba(239,68,68,.04);
}
.cash-journal-entry--refund .cash-journal-entry-icon{
  background:rgba(239,68,68,.1);
  color:#b42318;
}

@media (max-width:640px){
  .cash-payment-order-meta{
    display:grid;
    grid-template-columns:1fr;
    align-items:start;
  }

  .cash-payment-order-total-wrap{
    text-align:left;
  }

  .cash-payment-amount-grid{
    grid-template-columns:1fr;
  }

  .cash-payment-method-pill{
    min-width:102px;
  }

  .cash-payment-method-pill-icon{
    width:84px;
    height:84px;
    border-radius:22px;
    font-size:34px;
  }
}

.cash-recount-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.cash-recount-row{
  display:grid;
  gap:6px;
}

.cash-recount-denomination{
  font-size:12px;
  font-weight:800;
  color:var(--color-text-muted);
}

.cash-recount-input{
  text-align:center;
}

.cash-recount-summary{
  display:grid;
  gap:8px;
}

.cash-recount-summary-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  background:var(--color-surface-2);
}

.is-negative{
  color:#b42318 !important;
}

.is-positive{
  color:#047857 !important;
}

@media (max-width:768px){
  .new-order-toolbar{
    align-items:flex-start;
  }

  .cashier-toolbar-meta{
    width:100%;
    justify-content:flex-start;
  }

  .cashier-toolbar-stat{
    min-width:0;
  }

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

  .cashier-compact-actions{
    grid-template-columns:1fr;
  }

  .cash-journal-entry{
    grid-template-columns:40px minmax(0,1fr);
  }

  .cash-journal-entry-amount{
    grid-column:2;
  }

  .cash-recount-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:560px){
  .cashier-queue-tabs,
  .cashier-cash-summary,
  .cash-summary-grid{
    grid-template-columns:1fr;
  }

  .cashier-payment-methods{
    grid-template-columns:1fr;
  }

  .cashier-queue-item-head,
  .cashier-queue-item-foot,
  .cash-journal-entry-top{
    align-items:flex-start;
    flex-direction:column;
  }
}