/* ============================================================
   YABOX OS — THEME KIT  (yabox-theme.css)
   Couche présentation uniquement. Aucune dépendance backend.
   Tokens: clair par défaut via :root, nuit via data-theme="nuit".
   Switch : document.documentElement.setAttribute('data-theme','nuit')
   Bilingue FR + AR (.ar = RTL + police Cairo).
   ============================================================ */

/* Theme variables come from yabox-tokens.css. */`r`n*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
:root{--yabox-sidebar-width:280px}
body{
  font-family:'Sora',-apple-system,BlinkMacSystemFont,sans-serif;
  background:var(--bg);color:var(--text);
  -webkit-font-smoothing:antialiased;
  transition:background .25s ease,color .25s ease;
}

/* Delivery Companies Hub */
.delivery-companies-page .module-head,
.module-page .module-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}
.delivery-companies-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
}
.delivery-company-card {
  display: flex;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--white);
  box-shadow: var(--shadow);
}
.delivery-company-logo {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  flex: 0 0 44px;
  border-radius: 12px;
  color: #fff;
  background: var(--accent);
  font-weight: 800;
  letter-spacing: 0;
}
.delivery-company-body {
  min-width: 0;
  flex: 1;
}
.delivery-company-title {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: flex-start;
}
.delivery-company-title h3 {
  margin: 0;
  font-size: 16px;
  color: var(--text);
}
.delivery-company-card p,
.delivery-meta {
  color: var(--text2);
  font-size: 13px;
}
.delivery-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0;
}
.delivery-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.delivery-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 4px;
}
.pill {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: var(--bg-hover);
  color: var(--text2);
  font-size: 11px;
  font-weight: 700;
}
.pill.green { background: rgba(22,163,74,.12); color: var(--green); }
.pill.blue { background: rgba(33,85,224,.12); color: var(--blue); }
.pill.red { background: rgba(239,68,68,.12); color: var(--red); }
.pill.muted { background: var(--bg-hover); color: var(--text2); }
.topbar-btn {
  position: relative;
}
.notif-bell {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.notif-bell svg {
  display: block;
}
.notif-badge {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--red);
  color: var(--on-accent);
  border: 2px solid var(--white);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
}
.inline-error { color: var(--red); font-size: 13px; }
.success-text { color: var(--green); font-size: 13px; }
.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(0,0,0,.45);
}
.modal-card {
  width: min(520px, 100%);
  max-height: 90vh;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--white);
  color: var(--text);
  box-shadow: var(--shadow);
}
.modal-head,
.modal-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
}
.modal-actions {
  border-top: 1px solid var(--border);
  border-bottom: 0;
  justify-content: flex-end;
}
.modal-body {
  display: grid;
  gap: 12px;
  padding: 16px;
}
.modal-body label {
  display: grid;
  gap: 6px;
  color: var(--text2);
  font-size: 12px;
  font-weight: 700;
}
.modal-body .check-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
}
.insight-list {
  display: grid;
  gap: 8px;
}
.insight-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-hover);
}
@media (max-width: 720px) {
  .delivery-company-card,
  .delivery-company-title,
  .module-page .module-head {
    flex-direction: column;
  }
  .insight-row {
    grid-template-columns: 1fr;
  }
}
.ar{font-family:'Cairo',sans-serif;direction:rtl;color:var(--ar-color)}

/* ============ LAYOUT ============ */
.shell{display:flex;min-height:100vh}

@media (min-width: 901px) {
  #app .sidebar,
  .app-shell .sidebar {
    width: var(--yabox-sidebar-width) !important;
    flex: 0 0 var(--yabox-sidebar-width) !important;
  }
  #app .main-area,
  #app .main-content,
  .app-shell .main-area,
  .app-shell .main-content {
    margin-left: var(--yabox-sidebar-width) !important;
    width: calc(100% - var(--yabox-sidebar-width)) !important;
    max-width: none !important;
    min-width: 0 !important;
  }
}

@media (max-width: 900px) {
  #app .main-area,
  #app .main-content,
  .app-shell .main-area,
  .app-shell .main-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
}

/* SIDEBAR */
.sidebar{
  width:var(--sidebar-w);background:var(--bg-sidebar);
  border-right:1px solid var(--border);display:flex;flex-direction:column;
  position:fixed;inset:0 auto 0 0;z-index:40;
  transition:transform .28s cubic-bezier(.4,0,.2,1);
}
.sidebar__brand{
  height:var(--topbar-h);display:flex;align-items:center;gap:11px;
  padding:0 20px;border-bottom:1px solid var(--border);flex-shrink:0;
}
.brand__mark{
  width:30px;height:30px;border-radius:8px;flex-shrink:0;
  background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 55%,var(--text)));
  display:grid;place-items:center;color:var(--on-accent);font-weight:800;font-size:15px;
  box-shadow:0 2px 10px var(--accent-soft);
}
.brand__name{font-weight:800;font-size:17px;letter-spacing:-.4px}
.brand__name span{color:var(--accent)}

.nav{flex:1;overflow-y:auto;padding:14px 12px;scrollbar-width:thin}
.nav::-webkit-scrollbar{width:6px}
.nav::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
.nav__section{
  font-size:10.5px;font-weight:700;letter-spacing:.9px;text-transform:uppercase;
  color:var(--text-faint);padding:16px 12px 7px;
}
.nav__item{
  display:flex;align-items:center;gap:12px;padding:10px 12px;margin-bottom:2px;
  border-radius:10px;cursor:pointer;color:var(--text-dim);text-decoration:none;
  position:relative;transition:background .15s,color .15s;
}
.nav__item:hover{background:var(--bg-hover);color:var(--text)}
.nav__item.is-active{background:var(--bg-active);color:var(--accent)}
.nav__item.is-active::before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:3px;height:20px;border-radius:0 3px 3px 0;background:var(--accent);
}
.nav__icon{width:20px;height:20px;flex-shrink:0;display:grid;place-items:center}
.nav__icon svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.9}
.nav__labels{display:flex;flex-direction:column;line-height:1.15;flex:1;min-width:0}
.nav__fr{font-size:14px;font-weight:500;white-space:nowrap}
.nav__ar{font-size:11.5px}
.nav__badge{
  font-size:10px;font-weight:700;padding:2px 7px;border-radius:20px;
  background:var(--danger);color:var(--on-accent);font-family:'JetBrains Mono',monospace;
}
.nav__badge--soft{background:var(--accent-soft);color:var(--accent)}
.nav__footer{border-top:1px solid var(--border);padding:10px 12px;flex-shrink:0}

/* MAIN */
.main{flex:1;margin-left:var(--sidebar-w);min-width:0;display:flex;flex-direction:column}
.topbar{
  height:var(--topbar-h);background:color-mix(in srgb,var(--bg-elev) 80%,transparent);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--border);
  display:flex;align-items:center;gap:14px;padding:0 22px;position:sticky;top:0;z-index:30;
}
.burger{
  display:none;width:38px;height:38px;border-radius:9px;border:1px solid var(--border);
  background:var(--bg-elev);color:var(--text);cursor:pointer;place-items:center;
}
.burger svg{width:20px;height:20px;stroke:currentColor;stroke-width:2;fill:none}
.topbar__title{font-weight:700;font-size:16px;margin-right:auto}
.topbar__title small{display:block;font-weight:400;font-size:11px;color:var(--text-dim)}
.search{
  display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--border);
  border-radius:9px;padding:7px 12px;width:230px;max-width:32vw;
}
.search input{border:none;background:none;outline:none;color:var(--text);font-size:13px;width:100%;font-family:inherit}
.search svg{width:16px;height:16px;stroke:var(--text-dim);fill:none;stroke-width:2;flex-shrink:0}
.icon-btn{
  width:38px;height:38px;border-radius:9px;flex-shrink:0;border:1px solid var(--border);
  background:var(--bg-elev);color:var(--text-dim);cursor:pointer;display:grid;place-items:center;transition:.15s;
}
.icon-btn:hover{color:var(--accent);border-color:var(--accent)}
.icon-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.9}
.avatar{
  width:38px;height:38px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 50%,var(--text)));
  color:var(--on-accent);display:grid;place-items:center;font-weight:700;font-size:13px;cursor:pointer;
}
.content{padding:26px 22px;flex:1}

/* COMPONENTS RÉUTILISABLES */
.card{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.card h1{font-size:22px;font-weight:800;letter-spacing:-.5px;margin-bottom:6px}
.card p{color:var(--text-dim);font-size:14px;line-height:1.6}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-top:24px}
.kpi{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:16px}
.kpi__label{font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.6px;font-weight:700}
.kpi__value{font-size:26px;font-weight:800;margin-top:6px;font-family:'JetBrains Mono',monospace}
.kpi__value.ok{color:var(--success)}
.kpi__value.warn{color:var(--warn)}
.kpi__value.bad{color:var(--danger)}
.btn{
  display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:9px;
  border:1px solid var(--accent);background:var(--accent);color:var(--on-accent);font-weight:600;
  font-size:13px;cursor:pointer;font-family:inherit;transition:.15s;
}
.btn:hover{filter:brightness(1.08)}
.btn--ghost{background:transparent;color:var(--accent)}
.skeleton{background:linear-gradient(90deg,var(--bg-hover) 25%,var(--border) 50%,var(--bg-hover) 75%);background-size:200% 100%;animation:sk 1.3s infinite;border-radius:8px}
@keyframes sk{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* BACKDROP MOBILE */
.backdrop{display:none;position:fixed;inset:0;z-index:35;background:rgba(0,0,0,.5);backdrop-filter:blur(2px)}

/* RESPONSIVE */
@media(max-width:980px){
  .sidebar{transform:translateX(-100%)}
  body.nav-open .sidebar{transform:translateX(0);box-shadow:var(--shadow)}
  body.nav-open .backdrop{display:block}
  .main{margin-left:0}
  .burger{display:grid}
  .search{display:none}
}

/* YABOX OS KIT - compatibility layer for the existing vanilla SPA.
   UI-only: tokens, shell polish, responsive behavior, and cards. */
.yabox-os-kit {
}

.yabox-os-kit body,
body.yabox-os-kit,
.yabox-os-kit #app,
.yabox-os-kit .main-area,
.yabox-os-kit .content,
.yabox-os-kit #cnt {
  background: var(--kit-bg);
  color: var(--kit-text);
}

.yabox-os-kit .topbar {
  background: var(--bg-elev) !important;
  border-bottom: 1px solid var(--kit-border) !important;
  color: var(--kit-text);
  backdrop-filter: blur(12px);
}

.yabox-os-kit .topbar-title,
.yabox-os-kit #page-title {
  color: var(--kit-text);
  letter-spacing: 0;
}

.yabox-os-kit .page-sub,
.yabox-os-kit #page-sub {
  color: var(--kit-muted);
}

.yabox-os-kit .sidebar {
  background: var(--bg-sidebar);
  border-right: 1px solid var(--kit-border);
}

.yabox-os-kit .nav-section[data-kit-section="1"] {
  margin: 0;
}

.yabox-os-kit .nav-section-title {
  color: var(--text3);
  font-family: var(--font-mono, monospace);
  letter-spacing: .12em;
}

.yabox-os-kit .nav-item {
  border-radius: 0;
  transition: background .16s ease, color .16s ease, border-color .16s ease;
}

.yabox-os-kit .nav-item:hover {
  background: var(--bg-hover);
}

.yabox-os-kit .nav-item.active {
  background: var(--accent-soft);
  border-left-color: var(--kit-accent);
}

.yabox-os-kit .kpi,
.yabox-os-kit .kpi-card,
.yabox-os-kit .card,
.yabox-os-kit .cbox,
.yabox-os-kit .yabox-card,
.yabox-os-kit .empty-state,
.yabox-os-kit .modal-card {
  background: var(--kit-panel) !important;
  border-color: var(--kit-border) !important;
  color: var(--kit-text);
  box-shadow: none;
}

.yabox-os-kit .data-table,
.yabox-os-kit table {
  background: var(--kit-panel);
  color: var(--kit-text);
}

.yabox-os-kit .data-table th,
.yabox-os-kit table th {
  background: var(--kit-panel-2);
  color: var(--kit-muted);
}

.yabox-os-kit .data-table td,
.yabox-os-kit table td {
  border-color: var(--kit-border);
}

.yabox-os-kit .yabox-input,
.yabox-os-kit .ninp,
.yabox-os-kit .cinp,
.yabox-os-kit .linp,
.yabox-os-kit select,
.yabox-os-kit textarea {
  background: var(--kit-panel-2) !important;
  border-color: var(--kit-border) !important;
  color: var(--kit-text) !important;
}

.yabox-os-kit .yabox-input::placeholder,
.yabox-os-kit .ninp::placeholder,
.yabox-os-kit .cinp::placeholder,
.yabox-os-kit .linp::placeholder,
.yabox-os-kit textarea::placeholder {
  color: var(--kit-muted);
}

.yabox-os-kit .filters,
.yabox-os-kit .filters-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.yabox-os-kit .filters .yabox-input,
.yabox-os-kit .filters select,
.yabox-os-kit .filters input,
.yabox-os-kit .filters-row .yabox-input,
.yabox-os-kit .filters-row select,
.yabox-os-kit .filters-row input {
  width: auto !important;
  flex: 0 0 auto !important;
  min-width: 140px;
  max-width: 220px;
}

@media (min-width: 901px) {
  .yabox-os-kit .filters,
  .yabox-os-kit .filters-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: thin;
  }
}

@media (max-width: 900px) {
  .yabox-os-kit .sidebar {
    position: fixed;
    left: -250px;
    top: 0;
    bottom: 0;
    height: 100vh;
    z-index: 100;
    transition: left .2s ease;
  }

  .yabox-os-kit .sidebar.open {
    left: 0;
  }

  .yabox-os-kit .content {
    padding: 14px;
  }

  .yabox-os-kit .topbar {
    padding-inline: 12px;
  }
}

/* V3400 UI migration layout guard: variables come from yabox-tokens.css. */`r`n.yabox-os-kit #app {
  display: flex;
  width: 100%;
  min-height: 100vh;
  overflow-x: hidden;
}

.yabox-os-kit .sidebar {
  width: var(--yabox-sidebar-width) !important;
  min-width: var(--yabox-sidebar-width) !important;
  flex: 0 0 var(--yabox-sidebar-width) !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  height: 100vh !important;
  z-index: 100 !important;
  transform: none !important;
}

.yabox-os-kit .main-area {
  margin-left: var(--yabox-sidebar-width) !important;
  width: calc(100% - var(--yabox-sidebar-width)) !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
  overflow-x: hidden !important;
}

.yabox-os-kit .topbar,
.yabox-os-kit .content,
.yabox-os-kit #cnt {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 900px) {
  .yabox-os-kit #app {
    display: block;
  }

  .yabox-os-kit .sidebar {
    width: var(--yabox-sidebar-width) !important;
    min-width: var(--yabox-sidebar-width) !important;
    left: 0 !important;
    transform: translateX(-100%) !important;
    transition: transform .2s ease !important;
  }

  body.nav-open .yabox-os-kit .sidebar,
  .yabox-os-kit .sidebar.open {
    transform: translateX(0) !important;
  }

  .yabox-os-kit .main-area {
    margin-left: 0 !important;
    width: 100% !important;
  }
}

/* V3400 responsive containment guard:
   prevents inner legacy blocks from keeping viewport-sized widths after
   the sidebar has reserved desktop space. */
.yabox-os-kit .main-area,
.yabox-os-kit .topbar,
.yabox-os-kit .content,
.yabox-os-kit #cnt,
.yabox-os-kit .kpis,
.yabox-os-kit .filters,
.yabox-os-kit .filters-row,
.yabox-os-kit .cbox,
.yabox-os-kit .yabox-card,
.yabox-os-kit .ocard,
.yabox-os-kit .sec-wrap {
  box-sizing: border-box;
  max-width: 100% !important;
}

.yabox-os-kit .content {
  width: 100% !important;
  overflow-x: clip !important;
}

.yabox-os-kit #cnt {
  width: 100% !important;
  overflow-x: visible !important;
  transform: none !important;
}

.yabox-os-kit .kpis {
  width: 100% !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  overflow: hidden !important;
}

.yabox-os-kit .kpi {
  min-width: 0 !important;
}

.yabox-os-kit .filters,
.yabox-os-kit .filters-row {
  width: 100% !important;
  justify-content: flex-start !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

.yabox-os-kit .filters > *,
.yabox-os-kit .filters-row > * {
  max-width: min(220px, 100%) !important;
}

.yabox-os-kit .ocard {
  width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: var(--text) !important;
}

.yabox-os-kit .ocard .otop {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 12px !important;
  width: 100% !important;
}

.yabox-os-kit .ocard .oinfo {
  min-width: 0 !important;
  max-width: 100% !important;
}

.yabox-os-kit .ocard .ometa,
.yabox-os-kit .ocard .oprod,
.yabox-os-kit .ocard .odetails,
.yabox-os-kit .ocard .olast {
  color: var(--text) !important;
  max-width: 100% !important;
}

.yabox-os-kit .ocard .oprod,
.yabox-os-kit .ocard .ometa {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

.yabox-os-kit .ocard .owner-meta {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin-top: 4px !important;
  padding: 3px 8px !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  background: var(--bg-hover) !important;
  color: var(--text2) !important;
  font-size: 11px !important;
}

.yabox-os-kit .ocard .octas {
  min-width: 92px !important;
}

@media (max-width: 1200px) {
  .yabox-os-kit .kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  .yabox-os-kit .kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .yabox-os-kit .ocard .otop {
    grid-template-columns: 1fr !important;
  }

  .yabox-os-kit .ocard .octas {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    min-width: 0 !important;
  }

  .yabox-os-kit .ocard .octa {
    flex: 1 1 96px !important;
  }
}

/* ============================================================
   YABOX v3710 - MODERN THEME OVERRIDES
   ============================================================ */
.sidebar,#sidebar,.yabox-sidebar{background:#0F172A!important;border-right:1px solid rgba(255,255,255,.06)!important}.nav-item,.sd-item{border-radius:8px!important;margin:2px 8px!important;transition:all 150ms cubic-bezier(.16,1,.3,1)!important}.nav-item:hover,.sd-item:hover{background:rgba(255,255,255,.06)!important;color:#fff!important}.nav-item.active,.sd-item.active{background:rgba(232,64,12,.15)!important;color:#E8400C!important;border-left:3px solid #E8400C!important;margin-left:8px!important}.nav-icon,.sd-ico{color:#94A3B8!important;font-size:16px!important}.nav-item.active .nav-icon,.sd-item.active .sd-ico{color:#E8400C!important}
.topbar,.app-header,#topbar{background:rgba(255,255,255,.86)!important;backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important;border-bottom:1px solid rgba(15,23,42,.06)!important;height:60px!important}
.cbox,.card,.yabox-card,.yabox-card-flat,.ocard,.an-card,.dispatch-card,.finance-card,.printing-panel,.cai-section,.blitz-order-card,[data-order-id],.wms-card,.wms-panel{background:#fff!important;border:1px solid rgba(15,23,42,.06)!important;border-radius:14px!important;box-shadow:0 1px 3px rgba(15,23,42,.06),0 1px 2px rgba(15,23,42,.04)!important;transition:all 250ms cubic-bezier(.16,1,.3,1)!important}.cbox:hover,.card:hover,.yabox-card:hover,.ocard:hover,.wms-card:hover{box-shadow:0 12px 32px rgba(15,23,42,.10),0 4px 8px rgba(15,23,42,.04)!important;transform:translateY(-2px)!important;border-color:rgba(15,23,42,.10)!important}
.wms-table,.smart-table{border-radius:14px!important;overflow:hidden!important;border:1px solid rgba(15,23,42,.06)!important}.wms-table th,.smart-table th{background:#FAFBFC!important;color:#94A3B8!important;font-size:11px!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.06em!important;padding:14px 16px!important;border-bottom:1px solid rgba(15,23,42,.06)!important}.wms-table td,.smart-table td{padding:14px 16px!important;border-bottom:1px solid rgba(15,23,42,.06)!important;font-size:13px!important;color:#0F172A!important;transition:background 150ms!important}.wms-table tr:hover td,.smart-table tr:hover td{background:rgba(15,23,42,.03)!important}
.wms-badge,.badge,.pill,.status-pill,.tag{border-radius:9999px!important;font-size:11px!important;font-weight:700!important;padding:4px 10px!important;display:inline-flex!important;align-items:center!important;gap:6px!important}.wms-badge.green,.badge.green,.pill.green{background:rgba(22,163,74,.10)!important;color:#16A34A!important;border:1px solid rgba(22,163,74,.20)!important}.wms-badge.amber,.badge.amber,.pill.amber{background:rgba(245,158,11,.10)!important;color:#D97706!important;border:1px solid rgba(245,158,11,.20)!important}.wms-badge.red,.badge.red,.pill.red{background:rgba(239,68,68,.10)!important;color:#EF4444!important;border:1px solid rgba(239,68,68,.20)!important}
.obtn,.wms-btn,.yabox-btn,.topbar-btn,.dbtn,.lbtn{border-radius:10px!important;font-weight:700!important;transition:all 150ms cubic-bezier(.16,1,.3,1)!important;cursor:pointer!important}.obtn:hover,.wms-btn:hover,.yabox-btn:hover{transform:translateY(-1px)!important;box-shadow:0 1px 3px rgba(15,23,42,.06)!important}.obtn-primary,.wms-btn.primary,.lbtn{background:#E8400C!important;color:#fff!important;border:none!important;box-shadow:0 1px 3px rgba(232,64,12,.30)!important}.obtn-primary:hover,.wms-btn.primary:hover,.lbtn:hover{background:#D13A0B!important;box-shadow:0 4px 12px rgba(232,64,12,.35)!important}
.kpi,.kpi-card,.wms-card{position:relative!important;overflow:hidden!important}.kpi::before,.kpi-card::before,.wms-card::before{content:''!important;position:absolute!important;top:0!important;left:0!important;right:0!important;height:3px!important;background:linear-gradient(90deg,#E8400C,#FF5A1F)!important;opacity:0!important;transition:opacity 150ms!important}.kpi:hover::before,.kpi-card:hover::before,.wms-card:hover::before{opacity:1!important}
.modal,.mbox,.mbody,.mhdr,.mfooter{border-radius:14px!important;background:rgba(255,255,255,.72)!important;backdrop-filter:blur(20px) saturate(1.8)!important;-webkit-backdrop-filter:blur(20px) saturate(1.8)!important;border:1px solid rgba(15,23,42,.10)!important;box-shadow:0 12px 32px rgba(15,23,42,.10),0 4px 8px rgba(15,23,42,.04)!important}.ninp,.yabox-input,.linp,.wms-input,input[type="text"],input[type="number"],select,textarea{border-radius:10px!important;border:1px solid rgba(15,23,42,.06)!important;background:#fff!important;transition:all 150ms!important}.ninp:focus,.yabox-input:focus,.linp:focus,input:focus,select:focus,textarea:focus{outline:none!important;border-color:#7C3AED!important;box-shadow:0 0 0 3px rgba(124,58,237,.25)!important}
.loading-skeleton,.skeleton{background:linear-gradient(90deg,#fff 0%,rgba(15,23,42,.03) 50%,#fff 100%)!important;background-size:200% 100%!important;animation:shimmer 1.5s infinite!important;border-radius:10px!important}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.context-menu{background:rgba(255,255,255,.72)!important;backdrop-filter:blur(20px) saturate(1.8)!important;-webkit-backdrop-filter:blur(20px) saturate(1.8)!important;border:1px solid rgba(15,23,42,.10)!important;border-radius:10px!important;box-shadow:0 12px 32px rgba(15,23,42,.10),0 4px 8px rgba(15,23,42,.04)!important;padding:6px!important;min-width:180px!important}.context-menu-item{padding:8px 12px!important;border-radius:6px!important;font-size:13px!important;font-weight:600!important;color:#475569!important;cursor:pointer!important;transition:all 150ms!important;display:flex!important;align-items:center!important;gap:8px!important}.context-menu-item:hover{background:rgba(232,64,12,.08)!important;color:#E8400C!important}
.command-bar{height:52px!important;background:#fff!important;border-bottom:1px solid rgba(15,23,42,.06)!important;display:flex!important;align-items:center!important;gap:12px!important;padding:0 24px!important;position:sticky!important;top:0!important;z-index:20!important}.chat-bubble{max-width:70%!important;padding:12px 16px!important;border-radius:14px!important;font-size:13px!important;line-height:1.5!important;animation:bubbleIn .3s cubic-bezier(.16,1,.3,1)!important}.chat-bubble.incoming{align-self:flex-start!important;background:#fff!important;border:1px solid rgba(15,23,42,.06)!important;color:#0F172A!important;border-bottom-left-radius:4px!important}.chat-bubble.outgoing{align-self:flex-end!important;background:linear-gradient(135deg,#DCF8C6,#C8F0A8)!important;color:#1A3A0A!important;border-bottom-right-radius:4px!important}@keyframes bubbleIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.timeline{position:relative!important;padding-left:30px!important}.timeline::before{content:''!important;position:absolute!important;left:10px!important;top:0!important;bottom:0!important;width:2px!important;background:rgba(15,23,42,.06)!important}.timeline-item{position:relative!important;padding:12px 16px!important;background:#fff!important;border:1px solid rgba(15,23,42,.06)!important;border-radius:10px!important;margin-bottom:12px!important;margin-left:30px!important;transition:all 150ms!important;cursor:pointer!important}.timeline-item::before{content:''!important;position:absolute!important;left:-36px!important;top:18px!important;width:10px!important;height:10px!important;border-radius:50%!important;background:#fff!important;border:2px solid rgba(15,23,42,.06)!important}.timeline-item.entry::before{border-color:#0D9488;background:#0D9488}.timeline-item.output::before{border-color:#EF4444;background:#EF4444}.timeline-item.adjust::before{border-color:#F59E0B;background:#F59E0B}
.phone-mockup{width:260px!important;border:12px solid #1a1a1a!important;border-radius:36px!important;background:#fff!important;overflow:hidden!important;box-shadow:0 12px 32px rgba(15,23,42,.10),0 4px 8px rgba(15,23,42,.04)!important}.phone-notch{width:80px!important;height:20px!important;background:#1a1a1a!important;border-radius:0 0 12px 12px!important;margin:0 auto!important}.phone-screen{height:400px!important;overflow-y:auto!important;background:linear-gradient(180deg,#E5DDD5 0%,#D4CFC7 100%)!important;padding:16px!important;display:flex!important;flex-direction:column!important;gap:8px!important}.phone-msg{max-width:85%!important;padding:8px 12px!important;border-radius:14px!important;font-size:12px!important;line-height:1.5!important;background:#fff!important;box-shadow:0 1px 2px rgba(0,0,0,.08)!important;align-self:flex-start!important}.empty-state{text-align:center!important;padding:48px 24px!important;background:#fff!important;border:1px solid rgba(15,23,42,.06)!important;border-radius:14px!important}.empty-state-icon{font-size:44px!important;margin-bottom:12px!important;opacity:.8!important}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}