:root{
  --bg:#f7f8fb;--panel:#fff;--text:#172033;--muted:#7e8798;--line:#e8ebf1;
  --primary:#d94f7c;--primary-soft:#fff0f5;--green:#20b779;--orange:#f59e0b;
  --red:#e5484d;--blue:#4f7cff;--shadow:0 10px 30px rgba(24,32,51,.07);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Tahoma","Arial",sans-serif;background:var(--bg);color:var(--text)}
body{direction:rtl}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(140deg,#fff6fa,#f7f8fb 60%,#f0f6ff)}
.login-card{width:min(430px,100%);background:#fff;border:1px solid var(--line);border-radius:28px;padding:34px;box-shadow:var(--shadow)}
.login-card h1{margin:16px 0 8px;text-align:center}
.login-card p{text-align:center;color:var(--muted);line-height:1.8;margin:0 0 26px}
.login-card label{display:block;margin:14px 0 7px;font-weight:700}
input,select,textarea{width:100%;border:1px solid #dfe3ea;border-radius:13px;padding:12px 14px;background:#fff;outline:none}
input:focus,select:focus,textarea:focus{border-color:#e78fac;box-shadow:0 0 0 3px #fff1f6}
textarea{min-height:90px;resize:vertical}
.brand-mark{width:70px;height:70px;border-radius:22px;display:grid;place-items:center;margin:auto;background:linear-gradient(145deg,#f5a8c1,#d94f7c);color:#fff;font-size:34px;font-weight:900}
.brand-mark.small{width:46px;height:46px;border-radius:15px;font-size:23px;margin:0}
.primary,.soft,.danger-soft,.logout{border:0;border-radius:13px;padding:11px 18px;font-weight:800}
.primary{background:linear-gradient(135deg,#e85f8e,#c94370);color:#fff;box-shadow:0 7px 18px rgba(217,79,124,.22)}
.soft{background:#f5f6f9;color:#344056;border:1px solid #e3e6ec}
.danger-soft{background:#fff0f1;color:#c9343c;border:1px solid #ffd4d6}
.error-text{color:var(--red);font-size:13px;margin-top:10px;min-height:18px}
.app-shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}
.sidebar{position:sticky;top:0;height:100vh;background:#fff;border-left:1px solid var(--line);padding:20px 14px;display:flex;flex-direction:column;gap:18px}
.brand{display:flex;align-items:center;gap:12px;padding:3px 8px 18px;border-bottom:1px solid var(--line)}
.brand strong{display:block;font-size:19px}
.brand span{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.sidebar nav{display:flex;flex-direction:column;gap:6px}
.sidebar nav button{border:0;background:transparent;text-align:right;padding:12px 14px;border-radius:12px;color:#566075;font-weight:700}
.sidebar nav button:hover{background:#f7f8fb}
.sidebar nav button.active{background:var(--primary-soft);color:var(--primary)}
.logout{margin-top:auto;background:#fff;color:#a33a57;border:1px solid #f2cfdb}
.main{min-width:0;padding:22px 28px 36px}
.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.topbar h2{margin:0 0 6px;font-size:26px}
.live-status{font-size:12px;color:var(--green)}
.top-actions{display:flex;gap:10px}
.page{display:none}
.page.active{display:block}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:18px}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:16px}
.panel-head.wrap{flex-wrap:wrap}
.panel-head h3{margin:0;font-size:19px}
.panel-head p{margin:5px 0 0;color:var(--muted);font-size:13px}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
.stat-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--shadow)}
.stat-card .label{color:var(--muted);font-size:13px}
.stat-card .value{font-size:28px;font-weight:900;margin-top:9px}
.stat-card .hint{font-size:12px;color:#8d96a5;margin-top:4px}
.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.muted{color:var(--muted)}
.filters{display:grid;grid-template-columns:minmax(220px,1fr) 190px auto;gap:10px;margin-bottom:15px}
.filters button{white-space:nowrap}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px}
table{width:100%;border-collapse:collapse;min-width:780px;background:#fff}
th,td{padding:12px 13px;border-bottom:1px solid #eef0f4;text-align:right;font-size:13px;vertical-align:middle}
th{background:#fafbfc;color:#626d7e;font-weight:800;position:sticky;top:0}
tr:last-child td{border-bottom:0}
tr:hover td{background:#fffafd}
.badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:800}
.badge.online{background:#eaf9f2;color:#158e5e}
.badge.busy{background:#fff5df;color:#b87200}
.badge.offline{background:#f1f3f5;color:#70798a}
.badge.suspended,.badge.banned{background:#fff0f1;color:#c9343c}
.badge.requested{background:#eef3ff;color:#3d66cd}
.badge.completed{background:#eaf9f2;color:#158e5e}
.badge.cancelled{background:#fff0f1;color:#c9343c}
.icon-btn{border:1px solid #e3e6ec;background:#fff;border-radius:10px;padding:7px 10px;color:#344056}
.icon-btn.primary-outline{border-color:#f0bad0;color:#bd416b;background:#fff8fb}
.icon-btn.danger{border-color:#ffd2d5;color:#c9343c;background:#fff7f7}
.row-actions{display:flex;gap:6px;flex-wrap:wrap}
.small-btn{padding:9px 14px}
.map-panel{padding:0;overflow:hidden}
.map-panel .panel-head{padding:18px;margin:0}
.map{height:680px;background:#edf2f6}
.live-map-head{align-items:flex-start}
.live-map-summary{margin-top:8px;font-size:12px;color:#7a8494;font-weight:700}
.live-map-toolbar{display:flex;gap:8px;flex-wrap:wrap;padding:0 18px 14px;border-bottom:1px solid var(--line);background:#fff}
.live-filter{border:1px solid #eadde3;background:#fff;color:#596274;border-radius:999px;padding:9px 14px;font-size:12px;font-weight:800;cursor:pointer}
.live-filter:hover{background:#fff7fa;border-color:#e6b4c5}
.live-filter.active{background:#fbe8ef;border-color:#eaa2b9;color:#be3f69;box-shadow:0 4px 12px rgba(190,63,105,.08)}
.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:#5d6678}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-left:4px}
.dot.online{background:var(--green)}.dot.busy{background:var(--orange)}.dot.customer{background:#8b5cf6}.dot.request{background:var(--blue)}
.zone-swatch{display:inline-block;width:15px;height:10px;margin-left:4px;border:2px solid #d35d83;background:rgba(233,130,163,.12);border-radius:3px;vertical-align:-1px}
.live-car-divicon,.live-customer-divicon,.live-request-divicon{background:transparent!important;border:0!important}
.live-car-shell{position:relative;width:28px;height:38px;filter:drop-shadow(0 2px 3px rgba(34,45,64,.22))}
.live-car-shell svg{display:block;width:24px;height:36px;margin:1px auto 0;overflow:visible}
.live-car-shell .car-body{fill:var(--car-color);stroke:#ffffff;stroke-width:1.15}
.live-car-shell .car-wheel{fill:#2d3541}
.live-car-shell .car-glass{fill:#d8eef4;stroke:rgba(255,255,255,.9);stroke-width:.7}
.live-car-shell .car-glass.rear{fill:#cbe3e9}
.live-car-shell .car-roof{fill:rgba(255,255,255,.22)}
.live-car-shell .car-light{fill:#fff4b5;stroke:#fff;stroke-width:.35}
.live-car-shell .car-status{position:absolute;right:0;top:0;width:7px;height:7px;border-radius:50%;background:var(--status-color);border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.2);z-index:2}
.live-customer-pin{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#fff;border:3px solid #8b5cf6;box-shadow:0 3px 9px rgba(58,43,96,.25);font-size:15px}
.live-request-pin{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#4f7cff;color:#fff;border:3px solid #fff;box-shadow:0 3px 9px rgba(44,77,158,.3);font-size:9px;font-weight:900}
.popup-color-row{display:flex!important;align-items:center;gap:7px}
.popup-color-row i{display:inline-block;width:16px;height:16px;border-radius:50%;border:1px solid rgba(0,0,0,.13)}
.zone-live-tooltip{direction:rtl;font-weight:800;color:#9d3155}
.leaflet-popup-content{direction:rtl;text-align:right;min-width:220px}
.map-popup strong{display:block;font-size:15px;margin-bottom:6px}
.map-popup div{margin:4px 0}
.zones-layout{grid-template-columns:.8fr 1.2fr}
.zone-map{height:470px;border-radius:14px;overflow:hidden}
.zone-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.zone-form textarea{grid-column:1/-1;min-height:60px}
.zone-form .actions{grid-column:1/-1;display:flex;gap:10px}
.zone-list-item{border:1px solid var(--line);border-radius:13px;padding:12px;margin-bottom:9px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.zone-list-item strong{display:block;margin-bottom:4px}
.zone-list-item span{color:var(--muted);font-size:12px}
.support-layout{display:grid;grid-template-columns:360px 1fr;gap:16px;min-height:690px}
.tabs{display:flex;gap:8px;margin-bottom:12px}
.tab{border:1px solid var(--line);background:#fff;padding:8px 13px;border-radius:10px;font-weight:800}
.tab.active{background:var(--primary-soft);border-color:#f3c4d4;color:var(--primary)}
.support-item{border:1px solid var(--line);border-radius:13px;padding:12px;margin-bottom:9px;cursor:pointer}
.support-item:hover,.support-item.active{background:#fff6f9;border-color:#f3c4d4}
.support-item .line{display:flex;justify-content:space-between;gap:8px}
.support-item .last{font-size:12px;color:var(--muted);margin-top:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.unread{background:var(--primary);color:#fff;border-radius:999px;padding:2px 7px;font-size:11px}
.chat-panel{display:flex;flex-direction:column}
.chat-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:12px}
.chat-head span{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.messages{flex:1;overflow:auto;padding:16px 0;max-height:560px}
.message{max-width:78%;padding:10px 12px;border-radius:14px;margin:8px 0;line-height:1.7;font-size:13px}
.message.admin{margin-right:auto;background:#eef3ff}
.message.user{margin-left:auto;background:#fff0f5}
.message small{display:block;color:#8c95a5;margin-top:3px}
.chat-compose{display:grid;grid-template-columns:1fr auto;gap:8px;border-top:1px solid var(--line);padding-top:12px}
.empty{display:grid;place-items:center;min-height:500px;color:var(--muted)}
.settings-panel{max-width:900px}
.app-update-card{border:1px solid var(--line);background:#fff9fb;border-radius:18px;padding:18px;margin:14px 0}
.app-update-card h4{margin:0 0 14px;font-size:16px;color:#3f3340}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.settings-grid label{font-weight:800;font-size:13px}
.settings-grid label input,.settings-grid label select,.settings-grid label textarea{margin-top:7px;font-weight:400}
.settings-grid .wide{grid-column:1/-1}
hr{border:0;border-top:1px solid var(--line);margin:28px 0}
.modal{position:fixed;inset:0;background:rgba(18,24,35,.45);display:grid;place-items:center;padding:20px;z-index:3000}
.modal-card{position:relative;width:min(760px,96vw);max-height:90vh;overflow:auto;background:#fff;border-radius:22px;padding:24px;box-shadow:0 25px 70px rgba(0,0,0,.22)}
.modal-close{position:absolute;left:14px;top:12px;border:0;background:#f4f5f7;border-radius:10px;width:36px;height:36px;font-size:24px}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.detail-item{border:1px solid var(--line);border-radius:12px;padding:11px}
.detail-item span{display:block;color:var(--muted);font-size:11px;margin-bottom:4px}
.detail-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.toast{position:fixed;left:22px;bottom:22px;background:#1f2937;color:#fff;padding:12px 16px;border-radius:12px;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s;z-index:4000}
.toast.show{opacity:1;transform:none}
.list-line{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.list-line:last-child{border-bottom:0}
.money{font-weight:900;color:#b13f67}
.loading{padding:30px;text-align:center;color:var(--muted)}
.leaflet-control-attribution{font-size:9px!important}
@media(max-width:1100px){
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .two-cols,.support-layout,.zones-layout{grid-template-columns:1fr}
  .support-layout{min-height:auto}
  .map{height:560px}
}
@media(max-width:780px){
  .app-shell{grid-template-columns:1fr}
  .sidebar{position:relative;height:auto;border-left:0;border-bottom:1px solid var(--line)}
  .sidebar nav{display:grid;grid-template-columns:repeat(2,1fr)}
  .logout{margin-top:0}
  .main{padding:16px}
  .stats-grid{grid-template-columns:1fr 1fr}
  .filters{grid-template-columns:1fr}
  .zone-form,.settings-grid,.detail-grid{grid-template-columns:1fr}
  .zone-form textarea,.zone-form .actions,.settings-grid .wide{grid-column:auto}
}
@media(max-width:500px){
  .stats-grid{grid-template-columns:1fr}
  .sidebar nav{grid-template-columns:1fr 1fr}
  .topbar{align-items:flex-start}
  .legend{display:none}
}