@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;900&display=swap');
:root{
  --bg:#0d1117;--sur:#161b22;--card:#1c2330;--brd:#30363d;--acc:#2f81f7;--grn:#3fb950;--org:#d29922;--red:#f85149;--pur:#8b5cf6;--cyn:#06b6d4;--txt:#e6edf3;--mut:#8b949e;--tag:#21262d;--sidebar:200px;
  --chip-bg:#1f2937;--chip-txt:#60a5fa;--overlay:rgba(0,0,0,.8);
}
:root[data-theme="light"]{
  --bg:#f4f6f9;--sur:#ffffff;--card:#eef1f6;--brd:#e2e8f0;--acc:#2563eb;--grn:#16a34a;--org:#d97706;--red:#dc2626;--pur:#7c3aed;--cyn:#0891b2;--txt:#1e293b;--mut:#64748b;--tag:#eef1f5;
  --chip-bg:#e8edf5;--chip-txt:#2563eb;--overlay:rgba(15,23,42,.45);
}
*{margin:0;padding:0;box-sizing:border-box;}
html,body{overflow-x:hidden;}
body{font-family:'Cairo',sans-serif;background:var(--bg);color:var(--txt);min-height:100vh;transition:background .2s ease,color .2s ease;}
body.no-scroll{overflow:hidden;}
.app{display:flex;min-height:100vh;direction:rtl;}
.sidebar{width:var(--sidebar);background:var(--sur);border-left:1px solid var(--brd);display:flex;flex-direction:column;position:fixed;top:0;right:0;bottom:0;z-index:50;overflow-y:auto;transition:transform .3s ease,background .2s ease;}
.main{flex:1;margin-right:var(--sidebar);display:flex;flex-direction:column;min-height:100vh;min-width:0;}
@media(max-width:768px){
  :root{--sidebar:270px;}
  .sidebar{transform:translateX(100%);box-shadow:-6px 0 24px rgba(0,0,0,.35);}
  .sidebar.mobile-open{transform:translateX(0);}
  .main{margin-right:0!important;}
  .mobile-menu-btn{display:flex!important;}
  .page{padding:10px;}
  .cards{gap:8px;}
  .card{min-width:calc(50% - 4px);}
  .tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .form-grid{grid-template-columns:1fr;}
  .mo-box{border-radius:14px 14px 0 0;position:fixed;bottom:0;left:0;right:0;max-height:88vh;width:100%;max-width:100%;}
  .mo{align-items:flex-end;padding:0;}
  .toolbar{gap:6px;}
  .search-box{max-width:100%;}
  .two-col-compare{grid-template-columns:1fr!important;}
}
@media(max-width:420px){
  .cards{gap:6px;}
  .card{min-width:100%;padding:12px 14px;}
  .card .num{font-size:22px;}
  .topbar{padding:10px 12px;}
  .topbar-title{font-size:14px;}
  .page{padding:8px;}
  .tbl-wrap tbody td,.tbl-wrap thead th{padding:7px 8px;font-size:11px;}
  .mo-box{max-height:92vh;}
  .form-grid{gap:8px;}
  .section-head{padding:12px 14px;}
  .section-body{padding:12px 14px;}
  .drv-header{padding:16px 12px;}
}
.sidebar-logo{padding:16px;border-bottom:1px solid var(--brd);display:flex;align-items:center;gap:10px;}
.logo-icon{width:36px;height:36px;background:var(--acc);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;}
.logo-text{font-size:13px;font-weight:900;}.logo-sub{font-size:10px;color:var(--mut);}
.nav{flex:1;padding:10px 0;}
.nav-item{display:flex;align-items:center;gap:10px;padding:10px 14px;font-size:13px;font-weight:600;color:var(--mut);cursor:pointer;transition:all .15s;border-right:3px solid transparent;}
.nav-item:hover{color:var(--txt);background:var(--card);}.nav-item.active{color:var(--acc);background:rgba(47,129,247,.08);border-color:var(--acc);}
.nav-item .icon{font-size:16px;width:20px;text-align:center;flex-shrink:0;}
.sidebar-user{padding:12px 14px;border-top:1px solid var(--brd);}
.user-name{font-size:12px;font-weight:700;margin-bottom:2px;}.user-role{font-size:10px;color:var(--mut);}
.sidebar-overlay{position:fixed;inset:0;background:var(--overlay);z-index:49;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease;}
.sidebar-overlay.on{opacity:1;visibility:visible;}
.topbar{background:var(--sur);border-bottom:1px solid var(--brd);padding:12px 18px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:40;gap:10px;}
.topbar-title{font-size:16px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mobile-menu-btn{display:none;background:none;border:none;color:var(--txt);font-size:22px;cursor:pointer;padding:4px 8px;border-radius:6px;flex-shrink:0;}
.theme-toggle-btn{background:var(--card);border:1px solid var(--brd);color:var(--txt);width:34px;height:34px;min-width:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer;transition:all .15s;flex-shrink:0;}
.notif-badge{position:absolute;top:-4px;left:-4px;background:var(--red);color:#fff;font-size:10px;font-weight:700;min-width:17px;height:17px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 3px;border:2px solid var(--sur);}
.theme-toggle-btn:hover{border-color:var(--acc);transform:scale(1.07);}
.btn{display:inline-flex;align-items:center;gap:5px;padding:7px 13px;border-radius:8px;font-family:'Cairo',sans-serif;font-size:12px;font-weight:700;cursor:pointer;border:none;transition:all .12s;white-space:nowrap;}
.bp{background:var(--acc);color:#fff;}.bp:hover{opacity:.85;}.bg{background:var(--grn);color:#000;}.bg:hover{opacity:.85;}
.br{background:transparent;color:var(--red);border:1px solid var(--red);}.br:hover{background:var(--red);color:#fff;}
.bs{background:transparent;color:var(--mut);border:1px solid var(--brd);}.bs:hover{border-color:var(--acc);color:var(--acc);}
.bo{background:var(--org);color:#000;}.bo:hover{opacity:.85;}.btn:disabled{opacity:.4;pointer-events:none;}
.page{padding:18px;flex:1;min-width:0;}.page-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:18px;}
.page-title{font-size:18px;font-weight:900;}
.cards{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px;}
.card{flex:1;min-width:130px;background:var(--sur);border:1px solid var(--brd);border-radius:10px;padding:14px 16px;}
.card .num{font-size:26px;font-weight:900;margin-bottom:2px;}.card .lbl{font-size:11px;color:var(--mut);}
.c-acc .num{color:var(--acc);}.c-grn .num{color:var(--grn);}.c-org .num{color:var(--org);}.c-red .num{color:var(--red);}.c-pur .num{color:var(--pur);font-size:18px;}
.tbl-wrap{background:var(--sur);border:1px solid var(--brd);border-radius:12px;overflow:auto;}
.tbl-wrap table{width:100%;border-collapse:collapse;min-width:800px;}
.tbl-wrap thead th{background:var(--card);padding:10px 12px;font-size:11px;font-weight:700;color:var(--mut);text-align:right;white-space:nowrap;border-bottom:1px solid var(--brd);position:sticky;top:0;z-index:1;}
.tbl-wrap tbody tr{border-bottom:1px solid var(--brd);transition:background .1s;}
.tbl-wrap tbody tr:last-child{border-bottom:none;}.tbl-wrap tbody tr:hover{background:var(--card);}
.tbl-wrap tbody td{padding:9px 12px;font-size:12px;vertical-align:middle;}
.sb{padding:2px 9px;border-radius:9px;font-size:11px;font-weight:700;white-space:nowrap;display:inline-block;}
.s-delivered{background:rgba(63,185,80,.15);color:var(--grn);}.s-pending{background:rgba(210,153,34,.15);color:var(--org);}
.s-return{background:rgba(248,81,73,.15);color:var(--red);}.s-new{background:rgba(47,129,247,.15);color:var(--acc);}.s-none{background:var(--tag);color:var(--mut);}
.bc{font-family:monospace;font-size:11px;background:var(--chip-bg);color:var(--chip-txt);padding:2px 6px;border-radius:4px;white-space:nowrap;}
.day-badge{padding:2px 9px;border-radius:9px;font-size:11px;font-weight:700;white-space:nowrap;display:inline-block;}
.day-ok{background:rgba(63,185,80,.15);color:var(--grn);}
.day-mid{background:rgba(210,153,34,.15);color:var(--org);}
.day-warn{background:rgba(240,120,30,.18);color:#f0781e;}
.day-danger{background:rgba(248,81,73,.15);color:var(--red);}
.sortable-th{cursor:pointer;user-select:none;}
.sortable-th:hover{color:var(--acc);}
.bco{background:var(--chip-bg);color:var(--acc);padding:2px 7px;border-radius:8px;font-size:11px;white-space:nowrap;}
.bco-cyn{background:var(--chip-bg);color:var(--cyn);padding:2px 7px;border-radius:8px;font-size:11px;font-weight:700;white-space:nowrap;display:inline-block;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.field{display:flex;flex-direction:column;gap:5px;}.field label{font-size:12px;font-weight:700;color:var(--mut);}
.field input,.field select,.field textarea{background:var(--bg);border:1px solid var(--brd);color:var(--txt);font-family:'Cairo',sans-serif;font-size:13px;border-radius:8px;padding:8px 12px;outline:none;transition:border-color .15s;width:100%;}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--acc);}.field input::placeholder{color:var(--mut);}
.field select option{background:var(--card);color:var(--txt);}.field textarea{resize:vertical;min-height:80px;}
.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.search-box{display:flex;align-items:center;gap:7px;background:var(--sur);border:1px solid var(--brd);border-radius:8px;padding:7px 12px;flex:1;min-width:200px;max-width:340px;}
.search-box input{background:none;border:none;color:var(--txt);font-family:'Cairo',sans-serif;font-size:13px;outline:none;width:100%;}
.search-box input::placeholder{color:var(--mut);}
.chip{padding:4px 11px;border-radius:14px;font-size:11px;font-weight:700;cursor:pointer;border:1px solid var(--brd);background:transparent;color:var(--mut);font-family:'Cairo',sans-serif;transition:all .12s;}
.chip:hover,.chip.on{background:var(--acc);border-color:var(--acc);color:#fff;}
.section{background:var(--sur);border:1px solid var(--brd);border-radius:12px;margin-bottom:16px;}
.section-head{padding:14px 18px;border-bottom:1px solid var(--brd);display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.section-head h2{font-size:14px;font-weight:700;}.section-body{padding:16px 18px;}
.alert{padding:10px 14px;border-radius:8px;font-size:13px;margin-bottom:12px;}
.alert-info{background:rgba(47,129,247,.1);border:1px solid rgba(47,129,247,.3);color:var(--acc);}
.alert-warn{background:rgba(210,153,34,.1);border:1px solid rgba(210,153,34,.3);color:var(--org);}
.alert-err{background:rgba(248,81,73,.1);border:1px solid rgba(248,81,73,.3);color:var(--red);}
.alert-ok{background:rgba(63,185,80,.1);border:1px solid rgba(63,185,80,.3);color:var(--grn);}
.mo{display:none;position:fixed;inset:0;background:var(--overlay);z-index:200;align-items:center;justify-content:center;padding:16px;}
.mo.on{display:flex;}
.mo-box{background:var(--sur);border:1px solid var(--brd);border-radius:14px;max-width:600px;width:100%;max-height:90vh;overflow-y:auto;}
.mo-head{padding:16px 20px;border-bottom:1px solid var(--brd);display:flex;justify-content:space-between;align-items:center;}
.mo-head h3{font-size:15px;font-weight:700;}.mo-close{background:none;border:none;color:var(--mut);font-size:22px;cursor:pointer;}
.mo-body{padding:20px;}.mo-foot{padding:14px 20px;border-top:1px solid var(--brd);display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--card);border:1px solid var(--brd);border-radius:10px;padding:12px 20px;font-size:13px;font-weight:600;transition:transform .25s;z-index:300;white-space:nowrap;box-shadow:0 4px 20px rgba(0,0,0,.4);color:var(--txt);}
.toast.show{transform:translateX(-50%) translateY(0);}.toast.ok{border-color:var(--grn);color:var(--grn);}.toast.err{border-color:var(--red);color:var(--red);}
.role-badge{padding:2px 8px;border-radius:10px;font-size:10px;font-weight:700;}
.role-admin{background:rgba(248,81,73,.15);color:var(--red);}.role-manager{background:rgba(210,153,34,.15);color:var(--org);}
.role-driver{background:rgba(63,185,80,.15);color:var(--grn);}.role-writer{background:rgba(47,129,247,.15);color:var(--acc);}
.role-viewer{background:var(--tag);color:var(--mut);}
.empty{text-align:center;padding:48px;color:var(--mut);}.empty .icon{font-size:40px;margin-bottom:12px;}
.loading{display:flex;align-items:center;justify-content:center;padding:48px;color:var(--mut);gap:10px;font-size:14px;}
.spin{animation:spin .8s linear infinite;display:inline-block;}@keyframes spin{to{transform:rotate(360deg);}}
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);padding:20px;position:relative;}
.login-box{background:var(--sur);border:1px solid var(--brd);border-radius:16px;padding:36px 32px;width:100%;max-width:380px;}
.login-logo{text-align:center;margin-bottom:28px;}.login-logo .icon{font-size:48px;margin-bottom:10px;}
.login-logo h1{font-size:22px;font-weight:900;}.login-logo p{font-size:12px;color:var(--mut);}
.drv-header{background:linear-gradient(135deg,var(--acc),#1a56b0);padding:20px 18px;text-align:center;color:#fff;}
.parcel-card{background:var(--sur);border:1px solid var(--brd);border-radius:12px;margin:8px 14px;padding:14px;}
.status-btn{padding:8px 6px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;border:2px solid var(--brd);background:transparent;font-family:'Cairo',sans-serif;color:var(--mut);transition:all .15s;text-align:center;width:100%;}
.sel-delivered{border-color:var(--grn)!important;background:rgba(63,185,80,.15)!important;color:var(--grn)!important;}
.sel-pending{border-color:var(--org)!important;background:rgba(210,153,34,.15)!important;color:var(--org)!important;}
.sel-noans{border-color:var(--red)!important;background:rgba(248,81,73,.15)!important;color:var(--red)!important;}
.sel-return{border-color:var(--pur)!important;background:rgba(139,92,246,.15)!important;color:var(--pur)!important;}
.choice-card,.delivery-card,.format-card{border:2px solid var(--brd);border-radius:12px;padding:24px;text-align:center;cursor:pointer;transition:all .2s;}
.choice-card:hover,.delivery-card:hover,.format-card:hover{border-color:var(--acc);}
@media(max-width:768px){
  .choice-card,.delivery-card,.format-card{padding:16px;}
  #importWizard div[style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr!important;max-width:100%!important;}
  /* Responsive "card" tables: stack rows instead of horizontal scrolling */
  .tbl-wrap table.responsive-cards{min-width:0;width:100%;}
  .tbl-wrap table.responsive-cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;}
  .tbl-wrap table.responsive-cards,
  .tbl-wrap table.responsive-cards tbody,
  .tbl-wrap table.responsive-cards tr,
  .tbl-wrap table.responsive-cards td{display:block;width:100%;}
  .tbl-wrap table.responsive-cards tr{background:var(--card);border:1px solid var(--brd);border-radius:10px;margin:0 0 8px;padding:6px 10px;}
  .tbl-wrap table.responsive-cards tr:hover{background:var(--card);}
  .tbl-wrap table.responsive-cards td{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 2px;border-bottom:1px solid var(--brd);font-size:12px;white-space:normal;text-align:left;}
  .tbl-wrap table.responsive-cards td:last-child{border-bottom:none;}
  .tbl-wrap table.responsive-cards td::before{content:attr(data-label);font-weight:700;color:var(--mut);font-size:11px;flex-shrink:0;}
  .tbl-wrap table.responsive-cards td:empty,
  .tbl-wrap table.responsive-cards td[data-label=""]{display:none;}
}
