/* === ISROTEL COLLECTION THEME === */
:root {
  --bg-deep:    #08112b;
  --bg-main:    #0d1b3e;
  --bg-card:    #142050;
  --bg-input:   #0a1428;
  --bg-hover:   #1a2d6b;
  --border:     #1e3a7a;
  --border-lg:  #2d5bb8;
  --accent:     #4a7fd4;
  --accent-lt:  #7aaee8;
  --accent-sky: #a8c8e8;
  --gold:       #c9a84c;
  --gold-lt:    #e8cc7a;
  --white:      #ffffff;
  --text-main:  #e8f0fb;
  --text-sub:   #7a9acc;
  --text-muted: #3d5a8a;
  --green:      #1a7a4a;
  --green-lt:   #22a860;
  --red:        #c0392b;
  --orange:     #d4691a;
  --radius:     8px;
  --radius-lg:  14px;
  --shadow:     0 4px 24px rgba(0,0,0,.45);
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:'Segoe UI',Arial,sans-serif;
  background:var(--bg-deep);
  color:var(--text-main);
  min-height:100vh;
  direction:rtl;
  font-size:14px;
  line-height:1.5;
}

/* ROLE SCREEN */
#roleScreen,#multiRoleScreen{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px;
  background:radial-gradient(ellipse at 60% 40%, #0d2060 0%, #08112b 70%)}
.role-box{
  background:rgba(20,32,80,.85);
  border:1px solid var(--border-lg);
  border-radius:var(--radius-lg);
  padding:40px 36px;
  width:480px;max-width:100%;
  text-align:center;
  box-shadow:var(--shadow);
  backdrop-filter:blur(8px);
}
.role-box .hotel-brand{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--accent-sky);margin-bottom:8px;font-weight:600}
.role-box h1{font-size:26px;color:var(--white);margin-bottom:4px;font-weight:700;letter-spacing:.5px}
.role-box p{color:var(--text-sub);font-size:13px;margin-bottom:28px}
.role-btn{
  display:block;width:100%;padding:16px;
  border-radius:var(--radius);border:none;cursor:pointer;
  font-size:15px;font-weight:700;margin-bottom:10px;
  transition:all .2s;text-align:center;letter-spacing:.3px;
}
.role-admin{background:linear-gradient(135deg,#1a3a8f,#2d5bb8);color:#fff;border:1px solid #3d6bc8}
.role-admin:hover{background:linear-gradient(135deg,#2d5bb8,#4a7fd4);transform:translateY(-1px);box-shadow:0 6px 20px rgba(45,91,184,.4)}
.role-chef{background:linear-gradient(135deg,#7c2010,#b83020);color:#fff;border:1px solid #c84040}
.role-chef:hover{background:linear-gradient(135deg,#b83020,#d44030);transform:translateY(-1px)}
.role-area{background:linear-gradient(135deg,#1a4a3a,#2a7a5a);color:#fff;border:1px solid #3a8a6a}
.role-area:hover{background:linear-gradient(135deg,#2a7a5a,#3a9a6a);transform:translateY(-1px)}
.role-warehouse{background:linear-gradient(135deg,#4a1060,#7a2090);color:#fff;border:1px solid #8a30a0}
.role-warehouse:hover{background:linear-gradient(135deg,#7a2090,#9a30b0);transform:translateY(-1px);box-shadow:0 6px 20px rgba(120,30,150,.4)}

/* AREA SELECT */
#areaSelectScreen{display:none;align-items:center;justify-content:center;min-height:100vh;padding:20px;
  background:radial-gradient(ellipse at 60% 40%, #0d2060 0%, #08112b 70%)}
.area-select-wrap{width:min(980px,100%);padding:24px}
.area-select-head{text-align:center;margin-bottom:22px}
.area-select-icon{font-size:34px;margin-bottom:8px}
.area-select-head h2{color:#52b788;font-size:22px;margin:0;font-weight:800}
.area-select-head p{color:#94a3b8;font-size:13px;margin-top:6px}
.area-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;margin-top:16px;max-height:68vh;overflow-y:auto;padding:2px 4px 8px}
.area-grid.one-section{grid-template-columns:minmax(0,560px);justify-content:center}
.area-section{background:rgba(20,32,80,.42);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;display:flex;flex-direction:column;gap:12px;min-width:0}
.area-section-title{font-size:13px;font-weight:800;color:var(--accent-sky);text-align:right;padding:0 2px 8px;border-bottom:1px solid rgba(255,255,255,.08);letter-spacing:0}
.area-button-grid{display:grid;grid-template-columns:1fr;gap:9px}
.area-card{
  background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--radius);padding:12px 14px;cursor:pointer;
  transition:all .2s;text-align:right;min-height:54px;width:100%;
  display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;
}
.area-card:hover{border-color:var(--accent);background:var(--bg-hover);transform:translateY(-1px)}
.area-card .ac-name{font-size:14px;font-weight:700;color:var(--text-main)}
.area-card .ac-type{font-size:11px;color:var(--text-sub);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:3px 8px}
.area-card.kitchen{border-color:#7c2010}
.area-card.kitchen:hover{border-color:#d44030;background:#1c0a08}
.area-card.kitchen .ac-type{color:#fed7aa;background:rgba(124,32,16,.28);border-color:rgba(212,64,48,.35)}
.area-back-btn{width:100%;margin-top:16px}

/* TOPBAR */
.topbar{
  background:linear-gradient(90deg,var(--bg-main) 0%,#0f1f50 100%);
  border-bottom:2px solid var(--border-lg);
  padding:12px 24px;
  display:flex;align-items:center;justify-content:space-between;
  position:sticky;top:0;z-index:100;gap:10px;flex-wrap:wrap;
  box-shadow:0 2px 12px rgba(0,0,0,.4);
}
.logo{font-size:16px;font-weight:700;color:var(--accent-sky);letter-spacing:.5px}
.logo-sub{font-size:10px;color:var(--text-muted);letter-spacing:1px;text-transform:uppercase;margin-top:1px}
.area-badge{background:rgba(74,127,212,.2);color:var(--accent-lt);border-radius:6px;padding:4px 12px;font-size:12px;font-weight:700;border:1px solid rgba(74,127,212,.3)}
.area-badge.kitchen{background:rgba(180,50,30,.2);color:#fb923c;border-color:rgba(180,50,30,.3)}
.sync-badge{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-sub);background:rgba(0,0,0,.3);padding:4px 12px;border-radius:20px;border:1px solid var(--border)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--green-lt);flex-shrink:0}
.dot.s{background:var(--orange);animation:pulse 1s infinite}
.dot.e{background:var(--red)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* BUTTONS */
.btn{padding:7px 16px;border-radius:var(--radius);border:none;cursor:pointer;font-size:13px;font-weight:600;white-space:nowrap;transition:all .15s;letter-spacing:.2px}
.bg{background:linear-gradient(135deg,#1a5a3a,#22804a);color:#fff;box-shadow:0 2px 8px rgba(34,128,74,.3)}
.bg:hover{background:linear-gradient(135deg,#22804a,#2aa058)}
.bb{background:linear-gradient(135deg,#1a3a8f,#2d5bb8);color:#fff;box-shadow:0 2px 8px rgba(45,91,184,.3)}
.bb:hover{background:linear-gradient(135deg,#2d5bb8,#4a7fd4)}
.bgh{background:rgba(255,255,255,.05);color:var(--text-sub);border:1px solid var(--border)}
.bgh:hover{background:rgba(255,255,255,.1);color:var(--text-main)}
.bor{background:linear-gradient(135deg,#7c2010,#b83020);color:#fff}
.bor:hover{background:linear-gradient(135deg,#b83020,#d44030)}
.bp{background:linear-gradient(135deg,#4a1060,#7a2090);color:#fff}
.bp:hover{background:linear-gradient(135deg,#7a2090,#9a30b0)}
.borange{background:linear-gradient(135deg,#8a3010,#c25020);color:#fff}
.borange:hover{background:linear-gradient(135deg,#c25020,#e06030)}
.bgold{background:linear-gradient(135deg,#8a6010,var(--gold));color:#fff}
.bgold:hover{background:linear-gradient(135deg,var(--gold),var(--gold-lt))}

/* TABS */
.tabs{display:flex;gap:0;background:var(--bg-main);border-bottom:1px solid var(--border)}
.tab{padding:12px 22px;font-size:13px;font-weight:600;color:var(--text-muted);cursor:pointer;border-bottom:2px solid transparent;transition:all .15s;letter-spacing:.3px}
.tab:hover{color:var(--text-main)}
.tab.active{color:var(--accent-sky);border-bottom-color:var(--accent)}

.tab-content{display:none}
.tab-content.active{display:block}

/* AREA ORDER FORM */
.order-content{padding:20px 24px;max-width:720px;margin:0 auto}
.search-section{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;margin-bottom:16px;box-shadow:var(--shadow)}
.search-section h2{font-size:15px;color:var(--accent-sky);margin-bottom:14px;font-weight:700;letter-spacing:.5px}
.search-row{display:flex;gap:10px;align-items:flex-end;margin-bottom:10px}
.sf{flex:1}
.sf label{display:block;font-size:11px;color:var(--text-sub);margin-bottom:5px;font-weight:600;text-transform:uppercase;letter-spacing:.8px}
.sf input,.sf select{width:100%;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-main);padding:10px 14px;font-size:14px;outline:none}
.sf input:focus,.sf select:focus{border-color:var(--accent);background:rgba(74,127,212,.06)}
.sf input.found{border-color:var(--green-lt);background:rgba(26,122,74,.08)}
.sf input.notfound{border-color:var(--red)}
#AreaSearchResults{display:none;background:var(--bg-card);border:1px solid var(--accent);border-radius:var(--radius);max-height:240px;overflow-y:auto;margin-bottom:10px;box-shadow:var(--shadow)}
.sr-item{padding:12px 16px;cursor:pointer;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:8px}
.sr-item:hover{background:var(--bg-hover)}
.sr-item:last-child{border-bottom:none}
.sr-left .sr-code{font-family:monospace;font-size:11px;color:var(--accent-lt);margin-bottom:2px}
.sr-left .sr-name{font-size:14px;font-weight:600;color:var(--text-main)}
.sr-left .sr-sup{font-size:11px;color:var(--text-sub)}
.sr-stock{font-size:15px;font-weight:700;white-space:nowrap}
.prod-preview{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);padding:14px;margin-bottom:10px;display:none}
.prod-preview.show{display:block}
.pv-name{font-size:16px;font-weight:700;color:var(--white);margin-bottom:3px}
.pv-meta{font-size:12px;color:var(--text-sub);margin-bottom:6px}
.pv-stock{font-size:13px}
.sv{font-weight:700;font-size:16px}
.sv.ok{color:#3dd68c}.sv.low{color:#f6ad55}.sv.zero{color:#f87171}
.btn-add-big{width:100%;padding:13px;background:linear-gradient(135deg,#1a5a3a,#22804a);color:#fff;border:none;border-radius:var(--radius);font-size:15px;font-weight:700;cursor:pointer;letter-spacing:.3px;box-shadow:0 3px 12px rgba(34,128,74,.3)}
.btn-add-big:hover{background:linear-gradient(135deg,#22804a,#2aa058)}
.btn-add-big:disabled{background:rgba(255,255,255,.05);color:var(--text-muted);cursor:not-allowed;box-shadow:none}

/* ORDER LIST */
.order-list-section{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px;margin-bottom:16px}
.order-list-section h3{font-size:14px;color:var(--text-sub);margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;font-weight:600;letter-spacing:.5px;text-transform:uppercase}
.ol-item{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--bg-input);border-radius:var(--radius);margin-bottom:6px;border:1px solid var(--border);gap:8px}
.ol-left{flex:1;min-width:0}
.ol-code{font-family:monospace;font-size:10px;color:var(--accent-lt)}
.ol-name{font-size:14px;font-weight:600;color:var(--text-main);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ol-qty-wrap{display:flex;align-items:center;gap:6px}
.ol-qty{font-size:15px;font-weight:700;color:var(--gold-lt);white-space:nowrap}
.ol-unit{font-size:11px;color:var(--text-sub)}
.ol-del{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:16px;padding:2px 6px;flex-shrink:0}
.ol-del:hover{color:#f87171}
.no-items{text-align:center;color:var(--text-muted);font-size:13px;padding:24px}
.notes-field{width:100%;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-main);padding:10px 14px;font-size:14px;outline:none;direction:rtl;resize:vertical;min-height:64px;margin-bottom:12px}
.notes-field:focus{border-color:var(--accent)}
.btn-submit-big{width:100%;padding:15px;background:linear-gradient(135deg,#1a3a8f,#2d5bb8);color:#fff;border:none;border-radius:var(--radius);font-size:16px;font-weight:700;cursor:pointer;letter-spacing:.5px;box-shadow:0 4px 16px rgba(45,91,184,.4)}
.btn-submit-big:hover{background:linear-gradient(135deg,#2d5bb8,#4a7fd4)}
.btn-submit-big:disabled{background:rgba(255,255,255,.05);color:var(--text-muted);cursor:not-allowed;box-shadow:none}
.urgency-row{display:flex;gap:8px;margin-bottom:12px}
.urgency-btn{flex:1;padding:9px;border-radius:var(--radius);border:2px solid var(--border);background:var(--bg-input);color:var(--text-sub);cursor:pointer;font-size:13px;font-weight:600;transition:all .15s}
.urgency-btn.selected.normal{border-color:var(--green-lt);background:rgba(26,122,74,.1);color:var(--green-lt)}
.urgency-btn.selected.urgent{border-color:#f97316;background:rgba(180,80,20,.15);color:#f97316}

/* HISTORY */
.hist-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:10px}
.hi-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;flex-wrap:wrap;gap:6px}
.hi-date{font-size:11px;color:var(--text-muted)}
.hi-area{font-size:13px;font-weight:700;color:var(--accent-lt)}
.status-badge{border-radius:4px;padding:3px 9px;font-size:11px;font-weight:700;letter-spacing:.3px}
.st-pending{background:rgba(180,100,20,.2);color:#f6ad55;border:1px solid rgba(180,100,20,.3)}
.st-chef{background:rgba(180,80,20,.2);color:#fb923c;border:1px solid rgba(180,80,20,.3)}
.st-approved{background:rgba(26,122,74,.2);color:#3dd68c;border:1px solid rgba(26,122,74,.3)}
.st-ready{background:rgba(74,127,212,.2);color:var(--accent-lt);border:1px solid rgba(74,127,212,.3)}
.st-delivered{background:rgba(100,80,200,.2);color:#a78bfa;border:1px solid rgba(100,80,200,.3)}
.st-rejected{background:rgba(180,40,30,.2);color:#f87171;border:1px solid rgba(180,40,30,.3)}
.hi-items{font-size:12px;color:var(--text-sub);margin-bottom:6px}
.hi-note{font-size:11px;color:var(--text-muted);font-style:italic}

/* CHEF SCREEN */
.chef-order-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px;margin-bottom:12px;box-shadow:var(--shadow)}
.coc-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap;gap:8px}
.coc-area{font-size:15px;font-weight:700;color:#fb923c}
.coc-date{font-size:11px;color:var(--text-muted)}
.coc-urgency{background:rgba(180,80,20,.2);color:#fb923c;border-radius:4px;padding:3px 8px;font-size:11px;font-weight:700;border:1px solid rgba(180,80,20,.3)}
.coc-urgency.normal{background:rgba(26,122,74,.15);color:#3dd68c;border-color:rgba(26,122,74,.3)}
.coc-item-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border);gap:8px}
.coc-item-row:last-child{border-bottom:none}
.coc-item-name{font-size:14px;color:var(--text-main);flex:1}
.coc-item-code{font-family:monospace;font-size:10px;color:var(--text-muted);margin-left:6px}
.coc-qty-edit{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--gold-lt);padding:5px 7px;width:72px;font-size:14px;font-weight:700;text-align:center;outline:none;direction:ltr}
.coc-qty-edit:focus{border-color:var(--gold)}
.coc-unit{font-size:11px;color:var(--text-sub);margin-right:4px;white-space:nowrap}
.coc-note{font-size:12px;color:var(--text-sub);font-style:italic;margin-bottom:10px;padding:8px 10px;background:var(--bg-input);border-radius:var(--radius);border-right:3px solid var(--accent)}
.coc-actions{display:flex;gap:8px;margin-top:12px}

/* ADMIN ORDERS */
.admin-order-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;margin-bottom:10px}
.aoc-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.aoc-area{font-size:14px;font-weight:700;color:var(--accent-lt)}
.aoc-date{font-size:11px;color:var(--text-muted)}
.aoc-actions{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}

/* ADMIN TABLE */
#adminScreen{height:100vh;flex-direction:column;overflow:hidden}
.toolbar{background:var(--bg-main);border-bottom:1px solid var(--border);padding:10px 24px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
input.sb{flex:1;min-width:150px;max-width:260px;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-main);padding:8px 12px;font-size:13px;outline:none}
input.sb.code-range{flex:0 0 92px;min-width:92px;max-width:110px;text-align:left;font-family:monospace}
input.sb:focus{border-color:var(--accent)}
input.sb::placeholder{color:var(--text-muted)}
select.fs{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-main);padding:7px 10px;font-size:13px;outline:none;cursor:pointer}
select.fs:focus{border-color:var(--accent)}
.tw{padding:0 24px 14px;overflow:auto;flex:1;min-height:0}
table{width:100%;border-collapse:collapse;font-size:14px;min-width:820px}
thead tr{background:var(--bg-main);border-bottom:2px solid var(--border-lg)}
thead th{position:sticky;top:0;z-index:3;background:var(--bg-main);padding:11px 10px;text-align:right;font-weight:700;color:var(--text-sub);white-space:nowrap;font-size:11px;text-transform:uppercase;cursor:pointer;letter-spacing:.8px}
thead th:hover{color:var(--accent-sky)}
tbody tr{border-bottom:1px solid var(--border)}
tbody tr:hover{background:rgba(74,127,212,.06)}
tbody tr.rs{border-right:3px solid #3dd68c}
tbody tr.ls{border-right:3px solid #f6ad55}
tbody tr.ns{border-right:3px solid #f87171}
td{padding:9px 10px;vertical-align:middle}
thead th:nth-child(1),tbody td:nth-child(1){width:92px;text-align:right}
thead th:nth-child(2),tbody td:nth-child(2){width:30%;text-align:right}
thead th:nth-child(3),tbody td:nth-child(3){width:70px;text-align:center}
thead th:nth-child(4),tbody td:nth-child(4){width:190px;text-align:right}
thead th:nth-child(5),tbody td:nth-child(5){width:140px;text-align:center}
thead th:nth-child(6),tbody td:nth-child(6){width:88px;text-align:center}
thead th:nth-child(7),tbody td:nth-child(7){width:88px;text-align:center}
thead th:nth-child(8),tbody td:nth-child(8){width:88px;text-align:center}
thead th:nth-child(9),tbody td:nth-child(9){width:44px;text-align:center}
.cb{background:rgba(74,127,212,.12);border:1px solid rgba(74,127,212,.25);border-radius:4px;padding:2px 8px;font-family:monospace;font-size:12px;color:var(--accent-lt);white-space:nowrap}
.pn{font-weight:600;color:var(--text-main);max-width:none;overflow:visible;text-overflow:clip;white-space:normal;font-size:14px;line-height:1.35;word-break:normal;overflow-wrap:anywhere}
.spn{color:var(--text-sub);font-size:12px;max-width:140px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.spc{color:var(--text-muted);font-size:10px;font-family:monospace}
.db{background:rgba(74,127,212,.12);color:var(--accent-lt);border-radius:4px;padding:2px 8px;font-size:11px;white-space:nowrap;display:inline-block;border:1px solid rgba(74,127,212,.2)}
.db.em{color:var(--text-muted);background:transparent;border-color:transparent}
.uv{color:var(--text-sub);font-size:12px;background:rgba(255,255,255,.06);border-radius:4px;padding:2px 7px;display:inline-block;border:1px solid var(--border)}
.ei{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-main);padding:4px 6px;width:64px;font-size:14px;font-weight:700;text-align:center;outline:none;direction:ltr}
.ei:focus{border-color:var(--accent);background:rgba(74,127,212,.08)}
.oi{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--gold-lt);padding:4px 6px;width:64px;font-size:14px;font-weight:700;text-align:center;outline:none;direction:ltr}
.oi:focus{border-color:var(--gold)}
.oi.hv{background:rgba(180,130,20,.1);border-color:var(--gold);color:var(--gold-lt)}
.sgh{background:rgba(10,20,60,.6);border-bottom:1px solid var(--border)}
.sgh td{padding:6px 10px;font-size:11px;color:var(--text-sub);font-weight:700;text-transform:uppercase;letter-spacing:.8px}
.es{text-align:center;padding:60px 20px;color:var(--text-muted);font-size:32px}
.stats{display:flex;gap:16px;font-size:13px;color:var(--text-sub);flex-wrap:wrap}
.sn{color:var(--accent-sky);font-weight:700}

/* WORKER FORM */
.worker-form{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;margin-bottom:16px}
.worker-form h2{font-size:15px;color:var(--accent-sky);margin-bottom:16px;font-weight:700;letter-spacing:.5px}
.wf-row{display:flex;gap:10px;align-items:flex-end;margin-bottom:12px}
.wf-field{flex:1}
.wf-field label{display:block;font-size:11px;color:var(--text-sub);margin-bottom:5px;font-weight:600;text-transform:uppercase;letter-spacing:.8px}
.wf-field input{width:100%;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-main);padding:10px 14px;font-size:15px;outline:none}
.wf-field input:focus{border-color:var(--accent);background:rgba(74,127,212,.06)}
.wf-field input.found{border-color:var(--green-lt);background:rgba(26,122,74,.08)}
.wf-field input.notfound{border-color:var(--red)}
.product-preview{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);padding:14px;margin-bottom:12px;display:none}
.product-preview.show{display:block}
.pp-name{font-size:16px;font-weight:700;color:var(--white);margin-bottom:4px}
.pp-meta{font-size:12px;color:var(--text-sub);margin-bottom:6px}
.pp-stock{font-size:13px}
.pending-list{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px;margin-bottom:16px}
.pending-list h3{font-size:14px;color:var(--text-sub);margin-bottom:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.pending-item{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--bg-input);border-radius:var(--radius);margin-bottom:6px;border:1px solid var(--border);gap:8px}
.pi-left{flex:1}
.pi-code{font-family:monospace;font-size:11px;color:var(--accent-lt)}
.pi-name{font-size:14px;font-weight:600;color:var(--text-main)}
.pi-qty{font-size:15px;font-weight:700;color:var(--gold-lt);margin:0 12px;white-space:nowrap}
.pi-del{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:17px;padding:2px 6px}
.pi-del:hover{color:#f87171}
.btn-add-item{width:100%;padding:13px;background:linear-gradient(135deg,#1a5a3a,#22804a);color:#fff;border:none;border-radius:var(--radius);font-size:15px;font-weight:700;cursor:pointer;margin-top:4px;box-shadow:0 3px 12px rgba(34,128,74,.3)}
.btn-add-item:hover{background:linear-gradient(135deg,#22804a,#2aa058)}
.btn-add-item:disabled{background:rgba(255,255,255,.05);color:var(--text-muted);cursor:not-allowed;box-shadow:none}
.btn-submit{width:100%;padding:15px;background:linear-gradient(135deg,#1a3a8f,#2d5bb8);color:#fff;border:none;border-radius:var(--radius);font-size:16px;font-weight:700;cursor:pointer;margin-top:8px;letter-spacing:.3px;box-shadow:0 4px 16px rgba(45,91,184,.4)}
.btn-submit:disabled{background:rgba(255,255,255,.05);color:var(--text-muted);cursor:not-allowed;box-shadow:none}
.worker-badge{background:rgba(74,127,212,.1);border:1px solid rgba(74,127,212,.2);border-radius:var(--radius);padding:10px 16px;font-size:13px;color:var(--accent-sky);margin-bottom:16px;text-align:center;font-weight:600}

/* MODALS */
.mo{display:none;position:fixed;inset:0;background:rgba(0,0,0,.8);z-index:200;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.mo.open{display:flex}
.mb{background:var(--bg-card);border:1px solid var(--border-lg);border-radius:var(--radius-lg);padding:28px;width:460px;max-width:95vw;max-height:90vh;overflow-y:auto;direction:rtl;box-shadow:var(--shadow)}
.mb h2{font-size:17px;color:var(--accent-sky);margin-bottom:18px;font-weight:700;letter-spacing:.5px}
.mf{margin-bottom:14px}
.mf label{display:block;font-size:11px;color:var(--text-sub);margin-bottom:5px;font-weight:600;text-transform:uppercase;letter-spacing:.8px}
.mf input,.mf select{width:100%;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-main);padding:10px 12px;font-size:14px;outline:none;direction:rtl}
.mf input:focus,.mf select:focus{border-color:var(--accent)}
.ma{display:flex;gap:10px;margin-top:18px;justify-content:flex-end}
.orders-list{max-height:60vh;overflow-y:auto}

/* LOADING / TOAST */
.lo{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:400;align-items:center;justify-content:center;flex-direction:column;gap:16px;backdrop-filter:blur(4px)}
.lo.open{display:flex}
.sp{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent-sky);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.lt{color:var(--text-sub);font-size:14px;letter-spacing:.5px}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(80px);background:linear-gradient(135deg,#1a5a3a,#22804a);color:#fff;padding:11px 22px;border-radius:var(--radius);font-size:14px;font-weight:600;transition:transform .3s;z-index:500;pointer-events:none;white-space:nowrap;box-shadow:0 4px 20px rgba(0,0,0,.4)}
.toast.show{transform:translateX(-50%) translateY(0)}
.toast.er{background:linear-gradient(135deg,#7c1010,#b82020)}
.toast.warn{background:linear-gradient(135deg,#7c4010,#b86020)}

/* LINKS PANEL */
.links-panel{padding:20px}
.link-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:14px 18px;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.link-name{font-size:14px;font-weight:700;color:var(--text-main)}
.link-type{font-size:10px;color:var(--text-sub);margin-top:2px;letter-spacing:.5px;text-transform:uppercase}
.link-url{font-family:monospace;font-size:11px;color:var(--accent-lt);background:rgba(74,127,212,.1);padding:4px 10px;border-radius:4px;cursor:pointer;max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid rgba(74,127,212,.2)}
.link-url:hover{border-color:var(--accent)}

/* WAREHOUSE SCREEN */
#warehouseScreen .order-content{max-width:640px}

@media(max-width:600px){
  .stats{display:none}
  .topbar,.toolbar,.tw,.order-content,.links-panel{padding-left:14px;padding-right:14px}
  .area-select-wrap{padding:14px;width:100%}
  .area-grid{grid-template-columns:1fr;gap:14px;max-height:70vh}
  .area-section{padding:12px}
  table{font-size:13px;min-width:1040px}
  thead th:nth-child(2),tbody td:nth-child(2){width:280px;min-width:280px}
  .pn{font-size:13px;line-height:1.3;overflow-wrap:normal;word-break:normal}
}
@media print{
  body{background:#fff;color:#000;font-family:Arial,sans-serif}
  .no-print{display:none!important}
  .print-page{page-break-before:always}
}