:root{
    --navy:#0c1d3a;
    --navy-light:#14294c;
    --blue:#2864dc;
    --blue-dark:#1e4fb3;
    --blue-soft:#eaf1ff;
    --cyan-soft:#e9f7fb;
    --green:#16875e;
    --green-soft:#e9f7f1;
    --amber:#b87714;
    --amber-soft:#fff5df;
    --red:#c34242;
    --red-soft:#fff0f0;
    --bg:#f4f7fb;
    --white:#fff;
    --text:#182133;
    --muted:#667085;
    --faint:#98a2b3;
    --line:#e4e9f1;
    --line-light:#edf0f5;
    --shadow:0 1px 3px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.035);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    background:var(--bg);
    color:var(--text);
    font-synthesis:none;
}

*{box-sizing:border-box}
body{min-height:100vh;margin:0;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
button,input,select{font:inherit}
a,button{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid rgba(40,100,220,.18);outline-offset:2px}

.brand-tile{width:38px;height:38px;display:grid;place-items:center;flex:0 0 auto;overflow:hidden;border-radius:10px;background:#fff}
.brand-tile img{width:100%;height:100%;object-fit:cover}
.section-label{display:block;margin-bottom:10px;color:var(--blue);font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}

.btn{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:8px;padding:9px 15px;font-size:.78rem;font-weight:700;line-height:1;cursor:pointer;transition:.15s ease;white-space:nowrap}
.btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.btn-primary{background:var(--blue);color:#fff;box-shadow:0 1px 2px rgba(16,24,40,.08)}
.btn-primary:hover:not(:disabled){background:var(--blue-dark)}
.btn-primary:disabled{opacity:.55;cursor:wait}
.btn-outline{border-color:#d6dce6;background:#fff;color:#344054}
.btn-outline:hover{border-color:#b9c1cd;background:#f9fafb}
.btn-full{width:100%;min-height:44px}
.alert{padding:12px 14px;border-radius:8px;font-size:.78rem}
.alert-danger{background:var(--red-soft);color:#9f3131}
.alert-success{margin-bottom:20px;background:var(--green-soft);color:#116846}

/* Login */
.login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(430px,.95fr) minmax(480px,1.05fr);background:#fff}
.login-showcase{position:relative;min-height:100vh;display:flex;flex-direction:column;overflow:hidden;padding:48px clamp(38px,5vw,76px);background:linear-gradient(150deg,#0b1b36 0%,#102a54 62%,#17417c 100%);color:#fff}
.login-showcase::before,.login-showcase::after{content:"";position:absolute;border:1px solid rgba(255,255,255,.08);border-radius:50%;pointer-events:none}
.login-showcase::before{width:560px;height:560px;right:-240px;top:-180px}
.login-showcase::after{width:360px;height:360px;right:-130px;top:-80px}
.login-brand{position:relative;z-index:1;display:flex;align-items:center;gap:12px}
.login-brand strong,.login-brand small{display:block}
.login-brand strong{font-size:.92rem}.login-brand small{margin-top:2px;color:#9eacc2;font-size:.68rem}
.showcase-copy{position:relative;z-index:1;width:min(100%,560px);margin:auto 0;padding:72px 0}
.showcase-label{display:block;margin-bottom:20px;color:#88adf6;font-size:.7rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.showcase-copy h1{margin:0;font-size:clamp(2.7rem,4.5vw,5.1rem);font-weight:500;letter-spacing:-.065em;line-height:.98}
.showcase-copy>p{max-width:460px;margin:25px 0 0;color:#b9c6d9;font-size:.96rem;line-height:1.7}
.showcase-points{display:grid;gap:17px;margin-top:45px}
.showcase-points>div{display:flex;align-items:flex-start;gap:14px}
.showcase-points>div>span{width:29px;height:29px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.18);border-radius:7px;color:#9dbaf1;font-size:.6rem;font-weight:700}
.showcase-points p,.showcase-points strong,.showcase-points small{display:block;margin:0}
.showcase-points strong{font-size:.78rem}.showcase-points small{margin-top:4px;color:#94a6c0;font-size:.68rem}
.showcase-status{position:relative;z-index:1;display:flex;align-items:center;gap:10px;color:#aebcd0;font-size:.7rem}
.showcase-status i{width:8px;height:8px;border-radius:50%;background:#50d09b;box-shadow:0 0 0 5px rgba(80,208,155,.12)}
.login-panel{display:grid;place-items:center;padding:52px;background:#fff}
.login-form-wrap{width:min(100%,410px)}
.login-mobile-brand{display:none;align-items:center;gap:11px;margin-bottom:65px}
.login-mobile-brand strong{font-size:.9rem}
.login-form-wrap h2{margin:0;font-size:2rem;font-weight:600;letter-spacing:-.04em}
.login-intro{margin:9px 0 31px;color:var(--muted);font-size:.83rem}
.login-form{display:grid;gap:9px}
.login-form label{margin-top:6px;color:#344054;font-size:.73rem;font-weight:700}
.login-form input{height:46px;border:1px solid #d7dde7;border-radius:8px;padding:10px 13px;background:#fff;color:var(--text);font-size:.8rem;outline:0;transition:.15s}
.login-form input::placeholder{color:#a7aeb9}.login-form input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(40,100,220,.1)}
.login-form .btn{margin-top:14px}
.login-footnote{margin:25px 0 0;color:var(--faint);font-size:.65rem;text-align:center}

/* CRM shell */
.crm-shell{min-height:100vh;display:grid;grid-template-columns:250px minmax(0,1fr)}
.crm-sidebar{height:100vh;position:sticky;top:0;display:flex;flex-direction:column;padding:22px 15px 18px;background:var(--navy);color:#fff}
.sidebar-brand{display:flex;align-items:center;gap:11px;margin:0 7px 30px;color:#fff;text-decoration:none}
.sidebar-brand strong,.sidebar-brand small{display:block}.sidebar-brand strong{font-size:.87rem}.sidebar-brand small{margin-top:2px;color:#8290a8;font-size:.65rem}
.sidebar-nav{display:grid;gap:4px}
.nav-heading{display:block;margin:0 11px 8px;color:#65748f;font-size:.59rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.nav-heading-secondary{margin-top:27px}
.nav-item{min-height:43px;display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:10px;padding:8px 11px;border-radius:8px;color:#9eacc1;font-size:.76rem;font-weight:600;text-decoration:none}
.nav-item svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}
.nav-item.active{background:var(--blue);color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.12)}
.nav-item b{padding:3px 7px;border-radius:999px;background:rgba(255,255,255,.15);font-size:.6rem}
.nav-item em{color:#65748f;font-size:.55rem;font-style:normal;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.nav-item.disabled{cursor:default}
.sidebar-connections{margin-top:auto;padding-top:9px;border-top:1px solid rgba(255,255,255,.08)}
.sidebar-connection{display:flex;align-items:center;gap:10px;padding:7px 10px}
.connection-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:rgba(255,255,255,.07)}
.connection-icon span{width:9px;height:9px;border-radius:50%;background:#4bd19b;box-shadow:0 0 0 4px rgba(75,209,155,.11)}
.connection-icon.woo span{background:#b895e8;box-shadow:0 0 0 4px rgba(184,149,232,.11)}
.sidebar-connection strong,.sidebar-connection small{display:block}.sidebar-connection strong{font-size:.7rem}.sidebar-connection small{margin-top:2px;color:#74849f;font-size:.61rem}
.crm-main{min-width:0}
.crm-topbar{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,3vw,42px);border-bottom:1px solid var(--line);background:#fff}
.mobile-brand{display:none;align-items:center;gap:9px}.mobile-brand strong{font-size:.8rem}
.breadcrumb{display:flex;align-items:center;gap:9px;color:var(--faint);font-size:.71rem}.breadcrumb b{font-weight:400}.breadcrumb strong{color:#475467;font-weight:600}
.topbar-account{display:flex;align-items:center;gap:9px}
.account-avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--blue-soft);color:var(--blue);font-size:.72rem;font-weight:700}
.account-details strong,.account-details span{display:block}.account-details strong{font-size:.7rem}.account-details span{margin-top:2px;color:var(--faint);font-size:.59rem}
.logout-button{margin-left:5px;border:0;background:transparent;color:var(--muted);font-size:.65rem;font-weight:600;cursor:pointer}.logout-button:hover{color:var(--red)}
.crm-content{padding:34px clamp(24px,3vw,42px) 50px}
.page-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:25px}
.page-heading h1{margin:0;font-size:1.62rem;font-weight:700;letter-spacing:-.035em}.page-heading p{margin:7px 0 0;color:var(--muted);font-size:.78rem}

.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:20px}
.kpi-card{min-height:126px;display:flex;align-items:flex-start;gap:14px;padding:20px;border:1px solid var(--line);border-radius:11px;background:#fff;box-shadow:var(--shadow)}
.kpi-icon{width:39px;height:39px;display:grid;place-items:center;flex:0 0 auto;border-radius:9px}
.kpi-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.icon-total{background:#eef2f8;color:#53657e}.icon-new{background:var(--blue-soft);color:var(--blue)}.icon-ready{background:var(--amber-soft);color:var(--amber)}.icon-shipped{background:var(--green-soft);color:var(--green)}
.kpi-card span,.kpi-card strong,.kpi-card small{display:block}.kpi-card span{color:var(--muted);font-size:.7rem;font-weight:600}.kpi-card strong{margin:7px 0 4px;font-size:1.65rem;font-weight:700;letter-spacing:-.045em}.kpi-card small{color:var(--faint);font-size:.61rem}

.data-card{overflow:hidden;border:1px solid #dfe4ec;border-radius:9px;background:#fff;box-shadow:0 1px 2px rgba(16,24,40,.025)}
.data-card-header{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 20px;border-bottom:1px solid var(--line)}
.data-card-header h2{margin:0;font-size:1rem;font-weight:650;letter-spacing:-.015em}.data-card-header p{margin:5px 0 0;color:#7c8798;font-size:.72rem}.data-card-header p span{padding:0 3px;color:#b2bac5}
.api-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:6px;background:var(--green-soft);color:#196b50;font-size:.69rem;font-weight:600}.api-pill i{width:6px;height:6px;border-radius:50%}.api-pill i.online{background:var(--green)}.api-pill i.offline{background:var(--red)}
.filter-bar{display:flex;align-items:center;gap:8px;padding:11px 20px;border-bottom:1px solid var(--line);background:#fff}
.search-control{width:290px;height:36px;display:flex;align-items:center;gap:8px;border:1px solid #d7dde7;border-radius:6px;padding:0 10px;background:#fff}
.search-control svg{width:16px;height:16px;fill:none;stroke:#8e99aa;stroke-width:1.8;stroke-linecap:round}.search-control input{width:100%;border:0;outline:0;color:var(--text);font-size:.76rem}.search-control input::placeholder{color:#8d97a6}
.filter-bar select{height:36px;min-width:150px;border:1px solid #d7dde7;border-radius:6px;padding:0 28px 0 10px;background:#fff;color:#394456;font-size:.74rem;outline:0}.filter-bar select:focus,.search-control:focus-within{border-color:#7ca3ed;box-shadow:0 0 0 3px rgba(40,100,220,.07)}
.filter-bar .btn{min-height:36px;border-radius:6px;padding:8px 14px;font-size:.72rem}
.clear-filter{color:var(--muted);font-size:.65rem}
.table-scroll{overflow-x:auto}
.orders-table{width:100%;min-width:900px;border-collapse:collapse;table-layout:auto}
.orders-table th{height:42px;padding:10px 18px;border-bottom:1px solid #dfe4ec;background:#f8f9fb;color:#536074;font-size:.71rem;font-weight:600;letter-spacing:0;text-align:left;text-transform:none;white-space:nowrap}
.orders-table th:nth-child(4),.orders-table td.number-cell{text-align:center}
.orders-table td{height:58px;padding:11px 18px;border-bottom:1px solid #eaedf2;color:#4a5567;font-size:.76rem;vertical-align:middle}
.orders-table tbody tr{transition:background .12s}.orders-table tbody tr:hover{background:#fafcff}.orders-table tbody tr:last-child td{border-bottom:0}
.order-reference{color:#1f293b;font-size:.78rem;font-weight:650;font-variant-numeric:tabular-nums}
.date-cell{white-space:nowrap;font-variant-numeric:tabular-nums}.date-cell span,.date-cell small{display:inline!important}.date-cell small{margin:0!important;color:#8a94a3!important;font-size:.69rem!important}.date-cell small:not(:empty)::before{content:" · ";color:#b0b7c2}
.tracking-cell{color:#7a8493!important;font-size:.73rem!important}.id-cell{color:#657084!important;font-size:.72rem!important;font-variant-numeric:tabular-nums}
.status-badge{display:inline-flex;align-items:center;gap:7px;padding:5px 8px;border-radius:5px;background:#f2f4f7;color:#4f5b6d;font-size:.68rem;font-weight:600;white-space:nowrap}.status-badge i{width:6px;height:6px;border-radius:50%;background:#8d96a5}
.badge-label-ready{background:var(--blue-soft);color:var(--blue)}.badge-label-ready i{background:var(--blue)}
.badge-manifested{background:var(--amber-soft);color:var(--amber)}.badge-manifested i{background:var(--amber)}
.badge-shipped{background:var(--green-soft);color:var(--green)}.badge-shipped i{background:var(--green)}
.empty-table{padding:52px!important;text-align:center}.empty-table strong,.empty-table span{display:block}.empty-table span{margin-top:5px;color:var(--faint)}
.table-pagination{display:flex;align-items:center;justify-content:space-between;padding:13px 18px;border-top:1px solid var(--line);color:var(--faint);font-size:.62rem}.table-pagination div{display:flex;gap:7px}.table-pagination a,.table-pagination .disabled{padding:6px 9px;border:1px solid var(--line);border-radius:6px;color:#475467;text-decoration:none}.table-pagination a:hover{border-color:#aeb7c4;background:#f8fafc}.table-pagination .disabled{color:#b2b8c2}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media(max-width:1150px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.filter-bar{flex-wrap:wrap}.search-control{flex:1;min-width:230px}}
@media(max-width:820px){.login-shell{display:block}.login-showcase{display:none}.login-panel{min-height:100vh;padding:32px 22px}.login-mobile-brand{display:flex}.crm-shell{display:block}.crm-sidebar{display:none}.crm-topbar{height:64px;padding:0 17px}.mobile-brand{display:flex}.breadcrumb{display:none}.crm-content{padding:25px 15px 40px}.page-heading{align-items:flex-start;flex-direction:column}.kpi-grid{grid-template-columns:1fr 1fr}.filter-bar{display:grid;grid-template-columns:1fr}.search-control,.filter-bar select{width:100%;min-width:0}.filter-bar .btn{width:100%}}
@media(max-width:480px){.kpi-grid{grid-template-columns:1fr}.account-details{display:none}.page-heading h1{font-size:1.45rem}}

/* Manage Orders */
.manage-content{max-width:1600px;margin:0 auto}
.manage-heading{margin-bottom:20px}
.manage-card{overflow:hidden;border:1px solid #dfe4ec;border-radius:9px;background:#fff;box-shadow:0 1px 2px rgba(16,24,40,.025)}
.manage-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 18px;border-bottom:1px solid var(--line)}
.manage-search{width:min(430px,45%);height:40px;display:flex;align-items:center;gap:9px;border:1px solid #d7dde7;border-radius:7px;padding:0 11px;background:#fff}
.manage-search:focus-within{border-color:#7ca3ed;box-shadow:0 0 0 3px rgba(40,100,220,.07)}
.manage-search svg{width:17px;height:17px;fill:none;stroke:#8e99aa;stroke-width:1.8;stroke-linecap:round}
.manage-search input{width:100%;border:0;outline:0;color:var(--text);font-size:.76rem}.manage-search input::placeholder{color:#8d97a6}
.period-tabs{display:flex;align-items:center;padding:3px;border:1px solid #dfe4ec;border-radius:7px;background:#f7f9fc}
.period-tabs button{height:31px;border:0;border-radius:5px;padding:0 12px;background:transparent;color:#667085;font-size:.68rem;font-weight:600;cursor:pointer}
.period-tabs button:hover{color:#344054}.period-tabs button.active{background:#fff;color:var(--blue);box-shadow:0 1px 3px rgba(16,24,40,.08)}
.manage-filters{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding:11px 18px;border-bottom:1px solid var(--line);background:#fbfcfe}
.date-range{display:flex;align-items:flex-end;gap:8px}.date-range>span{padding-bottom:8px;color:#98a2b3;font-size:.66rem}
.date-range label,.status-select{display:grid;gap:4px;color:#667085;font-size:.61rem;font-weight:600}
.date-range input,.status-select select{height:34px;border:1px solid #d7dde7;border-radius:6px;padding:0 9px;background:#fff;color:#344054;font-size:.68rem;outline:0}
.status-select select{min-width:145px}.date-range input:focus,.status-select select:focus{border-color:#7ca3ed}
.small-button{height:34px;border:1px solid #cfd6e1;border-radius:6px;padding:0 12px;background:#fff;color:#344054;font-size:.65rem;font-weight:700;cursor:pointer}.small-button:hover{border-color:#aeb8c7;background:#f8fafc}
.manage-result-meta{min-height:47px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid var(--line)}
.manage-result-meta strong{font-size:.73rem;font-weight:650}.manage-result-meta span{color:#7b8494;font-size:.66rem}
.ajax-table-wrap{overflow-x:auto}
.ajax-orders-table{width:100%;min-width:980px;border-collapse:collapse}
.ajax-orders-table th{height:41px;padding:10px 16px;border-bottom:1px solid #dfe4ec;background:#f8f9fb;color:#536074;font-size:.69rem;font-weight:600;text-align:left;white-space:nowrap}
.ajax-orders-table th:last-child{width:60px;text-align:center}
.ajax-orders-table td{height:61px;padding:10px 16px;border-bottom:1px solid #eaedf2;color:#4a5567;font-size:.73rem;vertical-align:middle}
.ajax-orders-table tbody tr:hover{background:#fafcff}.ajax-orders-table tbody tr:last-child td{border-bottom:0}
.ajax-orders-table td strong,.ajax-orders-table td small{display:block}.ajax-orders-table td strong{color:#253044;font-size:.75rem;font-weight:600}.ajax-orders-table td small{margin-top:4px;color:#8a94a3;font-size:.64rem}
.ajax-reference{font-variant-numeric:tabular-nums}.ajax-date,.ajax-total{font-variant-numeric:tabular-nums}.ajax-total{color:#344054!important;font-weight:600}
.source-chip{display:inline-flex;padding:4px 7px;border-radius:5px;font-size:.62rem;font-weight:600}.source-woocommerce{background:#f0eafb;color:#67449a}.source-etsy{background:#fff0e8;color:#a94f22}.source-clickdrop{background:#eef2f6;color:#586579}
.package-count{display:inline-grid;min-width:25px;height:25px;place-items:center;border:1px solid #dfe4ec;border-radius:6px;background:#f8fafc;color:#475467;font-size:.67rem;font-weight:650}.tracking-value{display:block;max-width:165px;overflow:hidden;color:#526075;font-size:.68rem;font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap}
.view-cell{text-align:center}.view-order{width:32px;height:32px;display:grid;place-items:center;margin:auto;border:1px solid #d9dfe8;border-radius:6px;background:#fff;color:#566175;cursor:pointer}.view-order:hover{border-color:#89a9e8;background:var(--blue-soft);color:var(--blue)}.view-order svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.loading-row,.empty-ajax{height:180px!important;text-align:center!important;color:#7a8493!important}.loading-row span,.drawer-loading span{width:16px;height:16px;display:inline-block;margin-right:8px;border:2px solid #d8e0ee;border-top-color:var(--blue);border-radius:50%;vertical-align:middle;animation:order-spin .8s linear infinite}.empty-ajax strong,.empty-ajax span{display:block}.empty-ajax strong{color:#344054!important}.empty-ajax span{margin-top:5px}
@keyframes order-spin{to{transform:rotate(360deg)}}
.ajax-pagination{display:flex;align-items:center;justify-content:space-between;min-height:54px;padding:0 18px;border-top:1px solid var(--line);color:#7a8493;font-size:.65rem}.ajax-pagination>div{display:flex;align-items:center;gap:8px}.ajax-pagination button{height:30px;border:1px solid #d7dde7;border-radius:6px;padding:0 10px;background:#fff;color:#475467;font-size:.63rem;font-weight:600;cursor:pointer}.ajax-pagination button:hover:not(:disabled){border-color:#aeb8c7;background:#f8fafc}.ajax-pagination button:disabled{color:#b4bbc5;cursor:not-allowed}.ajax-pagination #page-number{min-width:80px;text-align:center}

.drawer-backdrop{position:fixed;inset:0;z-index:80;background:rgba(12,29,58,.38);backdrop-filter:blur(1px)}
.order-drawer{position:fixed;z-index:90;top:0;right:0;width:min(560px,100%);height:100vh;overflow-y:auto;background:#fff;box-shadow:-20px 0 50px rgba(10,25,50,.15);transform:translateX(100%);transition:transform .22s ease}
.order-drawer[aria-hidden="false"]{transform:translateX(0)}body.drawer-open{overflow:hidden}
.drawer-loading{height:100%;display:grid;place-items:center;align-content:center;color:#667085;font-size:.76rem}.drawer-loading span{margin:0 0 12px}
.drawer-header{height:87px;display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid var(--line)}
.drawer-kicker{display:block;margin-bottom:4px;color:#7c8797;font-size:.61rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.drawer-header h2{margin:0;font-size:1.2rem;font-weight:650;letter-spacing:-.02em}.drawer-close{width:34px;height:34px;border:1px solid #dfe4ec;border-radius:7px;background:#fff;color:#667085;font-size:1.3rem;line-height:1;cursor:pointer}.drawer-close:hover{background:#f6f8fb;color:#1f2937}
.drawer-status-row{display:flex;align-items:center;justify-content:space-between;padding:13px 24px;border-bottom:1px solid var(--line);background:#fafbfc;color:#7a8493;font-size:.65rem}
.drawer-body{padding:22px 24px 40px}.detail-summary{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-bottom:26px;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:var(--line)}.detail-summary>div{padding:14px;background:#fff}.detail-summary span,.detail-summary strong{display:block}.detail-summary span{color:#7a8493;font-size:.61rem}.detail-summary strong{margin-top:5px;color:#344054;font-size:.75rem;font-weight:650;font-variant-numeric:tabular-nums}
.detail-section{padding:22px 0;border-top:1px solid var(--line)}.detail-section h3{margin:0 0 14px;font-size:.8rem;font-weight:700}.detail-list{margin:0}.detail-list>div{display:grid;grid-template-columns:125px 1fr;gap:14px;padding:6px 0}.detail-list dt{color:#7a8493;font-size:.67rem}.detail-list dd{margin:0;color:#344054;font-size:.7rem;overflow-wrap:anywhere}.detail-empty{margin:0;color:#8a94a3;font-size:.69rem;line-height:1.55}.detail-section address{font-style:normal;color:#344054;font-size:.72rem;line-height:1.6}.detail-section address span{display:block}.delivery-method{display:flex;gap:20px;margin:13px 0 0;padding-top:12px;border-top:1px dashed var(--line);color:#344054;font-size:.69rem}.delivery-method span{min-width:55px;color:#8a94a3}
.detail-items{display:grid}.detail-items>div{display:grid;grid-template-columns:35px 1fr auto;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid var(--line-light)}.detail-items>div:last-child{border-bottom:0}.item-qty{color:#7a8493;font-size:.68rem}.detail-items strong{font-size:.7rem;font-weight:600}.item-total{color:#475467;font-size:.68rem;font-variant-numeric:tabular-nums}
.detail-packages{display:grid;gap:8px}.detail-packages>div{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:11px 12px;border:1px solid #e5e9f0;border-radius:7px;background:#fafbfc}.detail-packages span{color:#7a8493;font-size:.67rem}.detail-packages strong{color:#344054;font-size:.69rem;font-weight:600;font-variant-numeric:tabular-nums}.api-data-note{padding:14px 15px;border:1px solid #dce7fb;border-radius:8px;background:#f5f8ff}.api-data-note strong{color:#315a9f;font-size:.68rem}.api-data-note p{margin:5px 0 0;color:#63718a;font-size:.65rem;line-height:1.5}
.drawer-error{height:100%;display:grid;place-items:center;align-content:center;gap:14px}.drawer-error button{border:1px solid var(--line);border-radius:6px;padding:7px 11px;background:#fff;cursor:pointer}

@media(max-width:900px){.manage-toolbar{align-items:stretch;flex-direction:column}.manage-search{width:100%}.period-tabs{align-self:flex-start}.manage-filters{align-items:flex-start;flex-direction:column}.status-select select{min-width:200px}}
@media(max-width:600px){.period-tabs{width:100%;overflow-x:auto}.period-tabs button{flex:1;min-width:max-content}.date-range{width:100%;align-items:stretch;flex-wrap:wrap}.date-range label{flex:1;min-width:130px}.date-range input{width:100%}.status-select,.status-select select{width:100%}.order-drawer{width:100%}.drawer-body{padding-right:18px;padding-left:18px}}