/* OrderFlow 5.2 – production light SaaS interface */
:root{
  --of-primary:#1769ff;
  --of-primary-soft:color-mix(in srgb,var(--of-primary) 9%,white);
  --of-ink:#111c32;
  --of-text:#4e5c73;
  --of-muted:#8a96a9;
  --of-bg:#f5f7fb;
  --of-card:#fff;
  --of-border:#e4e9f2;
  --of-green:#12a66a;
  --of-amber:#d78b05;
  --of-red:#e34f64;
  --of-purple:#7957e8;
  --of-cyan:#1199b6;
  --of-shadow:0 8px 28px rgba(22,42,82,.065);
  --of-shadow-lg:0 28px 80px rgba(15,31,62,.23);
}
*{box-sizing:border-box}
html,body{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--of-ink);background:var(--of-bg);font-size:14px}
body{letter-spacing:-.006em}.ui-icon{fill:currentColor;display:block}
.app-shell{min-height:100vh}.sidebar{width:250px;background:#fff;border-right:1px solid var(--of-border);box-shadow:3px 0 24px rgba(24,42,75,.025);display:flex;flex-direction:column}
.sidebar-head{height:76px;padding:0 22px;border-bottom:1px solid #eef1f6;display:flex;align-items:center}.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-mark{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,var(--of-primary),#0752d6);color:#fff;font-size:17px;font-weight:800;box-shadow:0 8px 18px color-mix(in srgb,var(--of-primary) 25%,transparent)}.brand-copy strong{font-size:20px;letter-spacing:-.04em;color:#101a2f}.brand-copy small{display:none}
.nav-list{flex:1;padding:18px 14px;overflow:auto}.nav-group{margin-bottom:22px}.nav-group-label{display:block!important;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#a4adbb;padding:0 11px 7px}.nav-item{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 12px;border-radius:11px;color:#607089;font-size:13px;font-weight:600;margin:3px 0;text-decoration:none;transition:.18s ease}.nav-item:hover{background:#f6f8fc;color:#263a5d;transform:translateX(2px)}.nav-item.active{background:var(--of-primary-soft);color:var(--of-primary);box-shadow:inset 3px 0 0 var(--of-primary)}.nav-icon{width:20px;color:#7787a1}.nav-item.active .nav-icon{color:var(--of-primary)}
.sidebar-bottom{padding:14px;border-top:1px solid #edf1f6}.sidebar-logout{height:44px;border:1px solid var(--of-border);border-radius:11px;display:flex;align-items:center;gap:11px;padding:0 13px;color:#6b7689;text-decoration:none;font-weight:650}.sidebar-logout:hover{background:#fff2f4;color:#d83c55;border-color:#ffd8de}
.main-area{margin-left:250px;min-width:0}.topbar{height:70px;position:sticky;top:0;z-index:80;background:rgba(255,255,255,.93);backdrop-filter:blur(18px);border-bottom:1px solid var(--of-border);display:grid;grid-template-columns:auto minmax(260px,450px) 1fr;align-items:center;gap:20px;padding:0 28px}.sidebar-control{display:grid!important;width:42px;height:42px;border-radius:11px}.global-search{grid-column:2;max-width:none;width:100%;height:42px}.global-search input{font-size:13px}.top-actions{justify-self:end;display:flex;align-items:center;gap:14px}.top-user{display:flex;align-items:center;gap:9px;padding-left:14px;border-left:1px solid var(--of-border)}.top-user>span:last-child{display:flex;flex-direction:column}.top-user strong{font-size:12px}.top-user small{font-size:10px;color:var(--of-muted)}.top-user-avatar{width:36px;height:36px;border-radius:11px;background:var(--of-primary-soft);color:var(--of-primary);display:grid;place-items:center;font-weight:800}.top-new-order{min-height:39px;border-radius:10px}
.content{max-width:1460px;width:100%;margin:0 auto;padding:30px 32px 52px}.page-heading{margin:0 0 20px;padding:0;background:transparent!important;border:0!important;box-shadow:none!important}.page-heading h1{margin:0;font-size:28px;line-height:1.15;letter-spacing:-.045em;font-weight:780;color:#101b31}.app-footer{display:none}
.card,.list-card{background:#fff;border:1px solid var(--of-border);border-radius:15px;box-shadow:0 5px 18px rgba(28,48,88,.035);transition:box-shadow .2s ease,transform .2s ease}.card:hover{box-shadow:var(--of-shadow)}
.btn{font-size:12px;font-weight:700;border-radius:10px;min-height:40px;padding:0 15px;display:inline-flex;align-items:center;justify-content:center;gap:7px}.btn-primary{background:var(--of-primary);border-color:var(--of-primary);box-shadow:0 6px 14px color-mix(in srgb,var(--of-primary) 20%,transparent)}.btn-primary:hover{filter:brightness(.97);transform:translateY(-1px)}.btn-whatsapp{background:#18ae68!important;border-color:#18ae68!important;color:#fff!important}.btn-light{background:#fff;border-color:var(--of-border);color:#526077}.btn-light:hover{background:#f7f9fc;border-color:#cfd7e5}.btn-sm{min-height:34px;padding:0 11px;font-size:11px}
input,select,textarea{font-family:inherit;font-size:13px;border:1px solid #dfe5ef;border-radius:10px;background:#fff;min-height:43px;color:#26364f;padding:10px 12px;transition:.18s ease}input:focus,select:focus,textarea:focus{border-color:color-mix(in srgb,var(--of-primary) 50%,white);box-shadow:0 0 0 4px color-mix(in srgb,var(--of-primary) 9%,transparent);outline:0}label{font-size:11px;font-weight:700;color:#5b687d;gap:7px}textarea{line-height:1.5}
.alert{border-radius:12px;margin-bottom:16px}
.page-action-bar,.orders-page-header,.list-page-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:-58px 0 24px;min-height:42px}.page-action-bar{justify-content:flex-end}.period-summary{display:flex;align-items:center;gap:8px;color:#66748a;font-size:12px;background:#fff;border:1px solid var(--of-border);height:40px;padding:0 13px;border-radius:10px}.filter-launch{position:relative}.filter-count{display:grid;width:17px;height:17px;border-radius:50%;place-items:center;background:var(--of-primary);color:#fff;font-size:9px;margin-left:2px}
/* Overview */
.overview-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}.summary-card{min-height:122px;padding:20px;display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--of-border);border-radius:15px;box-shadow:0 5px 18px rgba(28,48,88,.035);position:relative;overflow:hidden}.summary-card:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--tone)}.summary-card-icon{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:var(--tone);background:color-mix(in srgb,var(--tone) 10%,white)}.summary-card small{display:block;color:#77849a;font-size:11px;font-weight:700;margin-bottom:8px}.summary-card strong{font-size:21px;letter-spacing:-.03em}.tone-green{--tone:var(--of-green)}.tone-blue{--tone:var(--of-primary)}.tone-indigo{--tone:#596fe8}.tone-amber{--tone:var(--of-amber)}
.overview-status-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:16px}.overview-status-card{background:#fff;border:1px solid var(--of-border);border-radius:13px;padding:15px;text-decoration:none;color:#637087;transition:.18s ease}.overview-status-card:hover{transform:translateY(-2px);box-shadow:var(--of-shadow)}.overview-status-card span{display:block;font-size:11px;font-weight:700}.overview-status-card strong{display:block;font-size:20px;color:#152039;margin-top:9px}.overview-status-card.status-pending{border-top:3px solid #e6a52a}.overview-status-card.status-confirmed{border-top:3px solid #20ad71}.overview-status-card.status-processing{border-top:3px solid #ec8b24}.overview-status-card.status-packed{border-top:3px solid #7e5be9}.overview-status-card.status-shipped{border-top:3px solid #159ab4}.overview-status-card.status-delivered{border-top:3px solid #159766}
.overview-analytics-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.85fr);gap:16px;margin-bottom:16px}.chart-panel,.source-panel{min-height:330px}.card-header{padding:18px 20px;border-bottom:1px solid #edf1f6}.card-header h2{font-size:15px;letter-spacing:-.02em}.panel-period{font-size:11px;color:var(--of-primary);background:var(--of-primary-soft);border-radius:999px;padding:6px 10px;font-weight:700}.sales-bars-v6{height:250px;padding:22px 24px 16px;display:flex;align-items:flex-end;gap:10px}.sales-bar-item{flex:1;min-width:12px;text-align:center}.sales-bar-track{height:205px;border-radius:8px;background:linear-gradient(to top,#f3f6fb,#fafbfd);position:relative;overflow:hidden}.sales-bar-track i{position:absolute;left:22%;right:22%;bottom:0;background:linear-gradient(180deg,#62a0ff,var(--of-primary));border-radius:7px 7px 3px 3px;min-height:4px}.sales-bar-item small{display:block;color:#929caf;font-size:9px;margin-top:7px}.source-list-v6{padding:18px 20px}.source-list-v6>div{display:grid;grid-template-columns:120px 1fr 42px;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #eef1f5}.source-list-v6>div:last-child{border-bottom:0}.source-list-v6 span strong,.source-list-v6 span small{display:block}.source-list-v6 span strong{font-size:12px}.source-list-v6 span small{font-size:10px;color:var(--of-muted);margin-top:3px}.source-progress{height:7px;border-radius:999px;background:#edf1f7;overflow:hidden}.source-progress i{display:block;height:100%;border-radius:999px;background:var(--of-primary)}.source-list-v6 b{font-size:11px;color:#65728a}.top-products-panel{margin-bottom:20px}.clean-table td small,.customer-table-v6 td small,.product-table-v6 td small,.order-table-v6 td small{display:block;color:#909bad;font-size:10px;margin-top:4px}
/* Orders */
.orders-page-header>div:last-child{display:flex;gap:9px}.orders-tabs{display:flex;padding:4px;background:#fff;border:1px solid var(--of-border);border-radius:11px}.orders-tabs a{padding:9px 17px;border-radius:8px;text-decoration:none;color:#68758a;font-size:12px;font-weight:700}.orders-tabs a.active{background:var(--of-primary-soft);color:var(--of-primary)}.order-status-tabs{display:flex;gap:8px;overflow:auto;margin-bottom:14px;padding-bottom:2px}.order-status-tabs a{display:flex;align-items:center;gap:10px;min-width:max-content;text-decoration:none;background:#fff;border:1px solid var(--of-border);color:#69768b;border-radius:11px;padding:10px 13px;font-size:11px;font-weight:700}.order-status-tabs a b{color:#172238}.order-status-tabs a.active{background:var(--of-primary-soft);border-color:color-mix(in srgb,var(--of-primary) 32%,white);color:var(--of-primary);box-shadow:0 5px 14px color-mix(in srgb,var(--of-primary) 9%,transparent)}.order-status-tabs .status-pending.active{background:#fff7e8;color:#9e6500;border-color:#f5d28a}.order-status-tabs .status-confirmed.active{background:#ebf9f2;color:#087f50;border-color:#b5e8ce}.order-status-tabs .status-processing.active{background:#fff3e8;color:#aa5905;border-color:#ffd0a5}.order-status-tabs .status-packed.active{background:#f3efff;color:#6743c5;border-color:#d4c7ff}.order-status-tabs .status-shipped.active,.order-status-tabs .status-out_for_delivery.active{background:#eaf8f8;color:#087977;border-color:#afe1df}.orders-search-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;color:#8a95a8;font-size:11px}.inline-search{width:min(420px,100%)}.orders-list-card{overflow:hidden}.order-table-v6 th{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:#929daf;background:#fbfcfe;padding:13px 15px}.order-table-v6 td{padding:14px 15px;vertical-align:middle}.order-table-v6 tbody tr:hover{background:#fbfdff}.order-id-link{color:var(--of-primary);font-weight:750;text-decoration:none}.person-cell{display:flex;align-items:center;gap:10px}.person-cell>span:last-child{min-width:0}.person-avatar{width:33px;height:33px;border-radius:50%;display:grid;place-items:center;background:#eaf3ff;color:var(--of-primary);font-size:10px;font-weight:800;flex:0 0 auto}.date-cell{font-size:11px}.status-picker-button{border:0;background:transparent;display:inline-flex;align-items:center;gap:5px;padding:3px;border-radius:9px;cursor:pointer}.status-picker-button:hover{background:#f2f5fa}.row-actions{display:flex;gap:7px;white-space:nowrap}
/* List pages */
.list-page-toolbar{margin:-58px 0 22px;justify-content:flex-end}.list-search{margin-right:auto;display:flex;align-items:center;gap:8px}.list-search>span{margin-right:-38px;z-index:1;color:#8a96a9}.list-search input{width:330px;padding-left:38px}.list-search select{width:235px}.list-card{overflow:hidden}.customer-table-v6 th,.product-table-v6 th,.courier-table-v6 th{font-size:10px;text-transform:uppercase;letter-spacing:.05em;background:#fbfcfe;color:#929daf;padding:13px 15px}.customer-table-v6 td,.product-table-v6 td,.courier-table-v6 td{padding:14px 15px;vertical-align:middle}.customer-table-v6 tbody tr:hover,.product-table-v6 tbody tr:hover,.courier-table-v6 tbody tr:hover{background:#fbfdff}.positive-text{color:var(--of-green)}.product-name-cell{display:flex;align-items:center;gap:11px}.product-name-cell>span{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#f1f5fb;color:#687995}.courier-avatar{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--of-primary-soft);color:var(--of-primary);font-size:11px;font-weight:800}.courier-table-v6 code{display:block;max-width:520px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.toolbar-note{margin-right:auto;display:flex;flex-direction:column}.toolbar-note strong{font-size:13px}.toolbar-note span{font-size:10px;color:var(--of-muted);margin-top:3px}
/* Centred modals */
body.modal-open{overflow:hidden}.modal-shell.modal-center,.modal-shell{position:fixed!important;inset:0!important;z-index:10000!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:22px!important}.modal-shell[hidden]{display:none!important}.modal-backdrop{position:absolute;inset:0;background:rgba(19,31,53,.48);backdrop-filter:blur(5px)}.modal-dialog{position:relative!important;z-index:1;width:min(590px,calc(100vw - 32px));max-height:88vh;overflow:auto;background:#fff;border:1px solid rgba(255,255,255,.78);border-radius:18px;box-shadow:var(--of-shadow-lg);animation:modalPop .18s ease-out}.filter-dialog{width:min(650px,calc(100vw - 32px))}.compact-dialog{width:min(500px,calc(100vw - 32px))}@keyframes modalPop{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}.modal-head{padding:20px 22px 16px;border-bottom:1px solid #edf1f5;display:flex;align-items:flex-start;justify-content:space-between}.modal-head h3{margin:0;font-size:18px;letter-spacing:-.03em}.modal-head p{margin:5px 0 0;font-size:11px;color:var(--of-muted)}.modal-close{width:36px;height:36px;border:1px solid var(--of-border);border-radius:10px;background:#fff;color:#6c788c;font-size:20px;cursor:pointer}.modal-body{padding:21px 22px 23px}.modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.modal-grid .full{grid-column:1/-1}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:3px}.preset-row{display:flex;gap:7px;flex-wrap:wrap}.preset-btn{border:1px solid var(--of-border);background:#fff;border-radius:9px;padding:8px 12px;color:#67748a;font-size:11px;font-weight:700;cursor:pointer}.preset-btn.active{background:var(--of-primary-soft);border-color:color-mix(in srgb,var(--of-primary) 28%,white);color:var(--of-primary)}.whatsapp-toggle{display:flex;align-items:center;padding:13px 14px;border:1px solid #c8ead9;background:#f1fbf6;border-radius:11px}.whatsapp-toggle input{min-height:auto}.whatsapp-toggle span{display:flex;align-items:center;gap:8px;color:#128855;font-size:12px}
.shipping-status-fields{display:none!important;grid-template-columns:1fr 1fr;gap:14px;padding:15px;background:#f7f9fc;border:1px solid var(--of-border);border-radius:12px}.shipping-status-fields.visible{display:grid!important}
/* Settings */
.settings-layout{display:grid;grid-template-columns:230px minmax(0,760px);gap:18px;align-items:start}.settings-nav{background:#fff;border:1px solid var(--of-border);border-radius:14px;padding:8px;box-shadow:0 5px 18px rgba(28,48,88,.035);position:sticky;top:92px}.settings-nav a{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:9px;text-decoration:none;color:#66738a;font-size:12px;font-weight:650;margin:2px 0}.settings-nav a:hover{background:#f6f8fc}.settings-nav a.active{background:var(--of-primary-soft);color:var(--of-primary)}.settings-content{padding:0;overflow:hidden}.settings-section-head{padding:22px 24px 17px;border-bottom:1px solid #edf1f5}.settings-section-head h2{margin:0;font-size:18px;letter-spacing:-.03em}.settings-section-head p{margin:5px 0 0;color:var(--of-muted);font-size:11px}.settings-form{display:grid;gap:16px;padding:24px}.settings-form.two-column{grid-template-columns:1fr 1fr}.settings-form .full{grid-column:1/-1}.settings-form>.btn{justify-self:start;min-width:160px}.switch-line{display:flex;align-items:center;gap:10px;min-height:45px;border:1px solid var(--of-border);padding:0 13px;border-radius:10px}.switch-line input{min-height:auto;width:16px;height:16px}.settings-note{font-size:11px;color:#68758a;background:#f6f8fc;border:1px solid var(--of-border);border-radius:10px;padding:12px}
/* Sidebar collapsed */
body.sidebar-collapsed .sidebar{width:78px}body.sidebar-collapsed .main-area{margin-left:78px}body.sidebar-collapsed .brand-copy,body.sidebar-collapsed .nav-label,body.sidebar-collapsed .nav-group-label,body.sidebar-collapsed .sidebar-logout span{display:none!important}body.sidebar-collapsed .sidebar-head{padding:0 18px}body.sidebar-collapsed .nav-item{justify-content:center;padding:0}body.sidebar-collapsed .sidebar-logout{justify-content:center;padding:0}
@media(max-width:1150px){.overview-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.overview-status-row{grid-template-columns:repeat(3,minmax(0,1fr))}.overview-analytics-grid{grid-template-columns:1fr}.content{padding:26px 24px}.customer-table-v6,.order-table-v6,.product-table-v6{min-width:980px}.settings-layout{grid-template-columns:200px 1fr}}
@media(max-width:900px){.sidebar{transform:translateX(-100%);z-index:1000;transition:.2s ease}.main-area,body.sidebar-collapsed .main-area{margin-left:0}.sidebar-open .sidebar{transform:translateX(0)}.topbar{grid-template-columns:auto 1fr auto;padding:0 15px}.global-search{grid-column:2}.top-user>span:last-child,.top-new-order span{display:none}.content{padding:22px 16px}.page-action-bar,.orders-page-header,.list-page-toolbar{margin:0 0 18px}.page-heading{margin-bottom:16px}.page-action-bar{justify-content:space-between}.orders-page-header{align-items:flex-start}.overview-status-row{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-layout{grid-template-columns:1fr}.settings-nav{position:static;display:flex;overflow:auto}.settings-nav a{white-space:nowrap}.list-search{flex-wrap:wrap}.list-search input{width:260px}.list-search select{width:210px}}
@media(max-width:620px){.topbar{gap:10px}.global-search{display:none}.topbar{grid-template-columns:auto 1fr}.top-actions{grid-column:2}.page-heading h1{font-size:24px}.overview-summary-grid,.overview-status-row{grid-template-columns:1fr 1fr}.summary-card{min-height:104px;padding:15px}.summary-card-icon{width:40px;height:40px}.summary-card strong{font-size:17px}.modal-grid,.settings-form.two-column{grid-template-columns:1fr}.modal-grid .full,.settings-form .full{grid-column:1}.modal-shell{padding:12px!important}.orders-page-header{flex-direction:column}.orders-page-header>div:last-child{width:100%}.orders-page-header>div:last-child .btn{flex:1}.list-page-toolbar{align-items:stretch;flex-direction:column}.list-search{width:100%}.list-search input,.list-search select{width:100%}.list-page-toolbar>.btn{align-self:flex-end}.overview-analytics-grid{display:block}.chart-panel{margin-bottom:14px}.sales-bars-v6{padding-left:12px;padding-right:12px}.top-user{border:0;padding:0}.period-summary{display:none}}
.brand-mark img{width:100%;height:100%;object-fit:cover;border-radius:13px}
.sidebar:before,.sidebar:after,.brand-mark:before,.brand-mark:after{display:none!important;content:none!important}

/* V5.2.1 login reliability */
.login-form-wrap form button[type=submit]{position:relative;z-index:2;pointer-events:auto}.login-form-wrap form button[type=submit]:disabled{opacity:.72;cursor:wait;transform:none}.login-form-wrap input:invalid:not(:placeholder-shown){border-color:#e4e9f2}.login-form-wrap .alert{font-size:12px;line-height:1.45}
