/* =====================================================================
   mikmik post — بنەما: گۆڕاوەکان، ئایکۆنەکان، ستایلی گشتی
   ===================================================================== */

/* =====================================================================
   mikmik post — ستایلی سەرەکی
   ئایکۆنەکان لە assets/icons/ دان و بە mask دەخوێندرێنەوە،
   بۆیە ڕەنگیان لە CSS ـەوە کۆنترۆڵ دەکرێت.
   ===================================================================== */

.svgi{
  display:inline-block;flex:none;
  background-color:currentColor;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain;
}
.i-bell{-webkit-mask-image:url(../icons/bell.svg);mask-image:url(../icons/bell.svg)}
.i-box{-webkit-mask-image:url(../icons/box.svg);mask-image:url(../icons/box.svg)}
.i-calendar{-webkit-mask-image:url(../icons/calendar.svg);mask-image:url(../icons/calendar.svg)}
.i-check{-webkit-mask-image:url(../icons/check.svg);mask-image:url(../icons/check.svg)}
.i-check-square{-webkit-mask-image:url(../icons/check-square.svg);mask-image:url(../icons/check-square.svg)}
.i-chevron-back{-webkit-mask-image:url(../icons/chevron-back.svg);mask-image:url(../icons/chevron-back.svg)}
.i-chevron-down{-webkit-mask-image:url(../icons/chevron-down.svg);mask-image:url(../icons/chevron-down.svg)}
.i-chevron-down-bold{-webkit-mask-image:url(../icons/chevron-down-bold.svg);mask-image:url(../icons/chevron-down-bold.svg)}
.i-clock{-webkit-mask-image:url(../icons/clock.svg);mask-image:url(../icons/clock.svg)}
.i-copy{-webkit-mask-image:url(../icons/copy.svg);mask-image:url(../icons/copy.svg)}
.i-dollar{-webkit-mask-image:url(../icons/dollar.svg);mask-image:url(../icons/dollar.svg)}
.i-dollar-circle{-webkit-mask-image:url(../icons/dollar-circle.svg);mask-image:url(../icons/dollar-circle.svg)}
.i-download{-webkit-mask-image:url(../icons/download.svg);mask-image:url(../icons/download.svg)}
.i-eye{-webkit-mask-image:url(../icons/eye.svg);mask-image:url(../icons/eye.svg)}
.i-grid{-webkit-mask-image:url(../icons/grid.svg);mask-image:url(../icons/grid.svg)}
.i-home{-webkit-mask-image:url(../icons/home.svg);mask-image:url(../icons/home.svg)}
.i-kpi-box{-webkit-mask-image:url(../icons/kpi-box.svg);mask-image:url(../icons/kpi-box.svg)}
.i-kpi-check{-webkit-mask-image:url(../icons/kpi-check.svg);mask-image:url(../icons/kpi-check.svg)}
.i-kpi-clock{-webkit-mask-image:url(../icons/kpi-clock.svg);mask-image:url(../icons/kpi-clock.svg)}
.i-kpi-money{-webkit-mask-image:url(../icons/kpi-money.svg);mask-image:url(../icons/kpi-money.svg)}
.i-lock{-webkit-mask-image:url(../icons/lock.svg);mask-image:url(../icons/lock.svg)}
.i-login{-webkit-mask-image:url(../icons/login.svg);mask-image:url(../icons/login.svg)}
.i-logout{-webkit-mask-image:url(../icons/logout.svg);mask-image:url(../icons/logout.svg)}
.i-mail{-webkit-mask-image:url(../icons/mail.svg);mask-image:url(../icons/mail.svg)}
.i-nav-dash{-webkit-mask-image:url(../icons/nav-dash.svg);mask-image:url(../icons/nav-dash.svg)}
.i-nav-posts{-webkit-mask-image:url(../icons/nav-posts.svg);mask-image:url(../icons/nav-posts.svg)}
.i-nav-users{-webkit-mask-image:url(../icons/nav-users.svg);mask-image:url(../icons/nav-users.svg)}
.i-phone{-webkit-mask-image:url(../icons/phone.svg);mask-image:url(../icons/phone.svg)}
.i-plus{-webkit-mask-image:url(../icons/plus.svg);mask-image:url(../icons/plus.svg)}
.i-route-arrow{-webkit-mask-image:url(../icons/route-arrow.svg);mask-image:url(../icons/route-arrow.svg)}
.i-scan{-webkit-mask-image:url(../icons/scan.svg);mask-image:url(../icons/scan.svg)}
.i-search{-webkit-mask-image:url(../icons/search.svg);mask-image:url(../icons/search.svg)}
.i-search-empty{-webkit-mask-image:url(../icons/search-empty.svg);mask-image:url(../icons/search-empty.svg)}
.i-shield-user{-webkit-mask-image:url(../icons/shield-user.svg);mask-image:url(../icons/shield-user.svg)}
.i-sort{-webkit-mask-image:url(../icons/sort.svg);mask-image:url(../icons/sort.svg)}
.i-status-swap{-webkit-mask-image:url(../icons/status-swap.svg);mask-image:url(../icons/status-swap.svg)}
.i-tag{-webkit-mask-image:url(../icons/tag.svg);mask-image:url(../icons/tag.svg)}
.i-trash{-webkit-mask-image:url(../icons/trash.svg);mask-image:url(../icons/trash.svg)}
.i-van{-webkit-mask-image:url(../icons/van.svg);mask-image:url(../icons/van.svg)}
.i-wallet{-webkit-mask-image:url(../icons/wallet.svg);mask-image:url(../icons/wallet.svg)}
.i-way-arrow{-webkit-mask-image:url(../icons/way-arrow.svg);mask-image:url(../icons/way-arrow.svg)}

:root{
  /* =====================================================================
     پاڵێتی ڕەنگ — ڕەش · شین · زەرد · سوور
     ئیلهام لە DHL · Wolt · Careem — ڕەنگی بەهێز و ڕوون،
     هەر بەشێک ڕەنگی خۆی هەیە و بۆ چاو ئاسانە.
     ===================================================================== */
  --bg:#F5F6F8;            /* پاشبنەمای نەرمی شینی سووک */
  --card:#ffffff;
  --ink:#0F1219;           /* ڕەشێکی نەرمتر، ئاسانتر بۆ چاو */
  --muted:#6B7280;
  --line:#E7EAF0;

  --yellow:#1D4ED8;        /* ڕەنگی سەرەکی — ئیندیگۆ */
  --yellow-soft:#DCE7FE;
  --navy:#0F1219;
  --navy-2:#080A0F;

  /* ---- ڕەنگە هاوکارەکان ---- */
  --red:#E63946;           /* گوڵەبی */
  --teal:#0E9F6E;          /* زمروودی */
  --blue:#1D4ED8;
  --sky:#38BDF8;
  --amber:#FFB703;
  --violet:#2563EB;
  --slate:#8B94A6;

  /* ---- ڕەنگی نەرمی هەریەکەیان (پاشبنەما) ---- */
  --red-s:#FDE3E5;
  --teal-s:#D9F5E9;
  --blue-s:#DCE7FE;
  --sky-s:#E0F2FE;
  --amber-s:#FFF3D1;
  --violet-s:#DCE7FE;
  --slate-s:#EEF1F6;

  /* ---- ڕەنگی هەر بەشێکی تاسک بار ---- */
  --tab-home:#0F1219;
  --tab-posts:#1D4ED8;
  --tab-new:#0E9F6E;
  --tab-bal:#FFB703;
  --tab-alert:#E63946;
  --radius:22px;
  --shadow:0 4px 16px rgba(20,22,28,.05);
  --shadow-lg:0 14px 36px rgba(20,22,28,.09);
  --gap-footer:3cm;        /* بۆشایی نێوان کۆتایی ناوەڕۆک و فوتەر */
  --footer-h:86px;         /* بەرزی فوتەرەکە — بە JS ڕێک دەخرێتەوە */
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  background-image:
    radial-gradient(1100px 520px at 100% -10%, rgba(91,87,232,.10), transparent 60%),
    radial-gradient(900px 460px at -10% 8%, rgba(56,189,248,.10), transparent 62%),
    radial-gradient(800px 500px at 50% 108%, rgba(16,185,129,.08), transparent 60%);
  background-attachment:fixed;
  font-family:"Noto Kufi Arabic",system-ui,"Segoe UI",sans-serif;
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
}
.app{
  max-width:480px;margin:0 auto;min-height:100vh;
  background:var(--bg);position:relative;
  padding:14px 14px calc(var(--footer-h) + var(--gap-footer));
  overflow-x:hidden;
}
@media(min-width:481px){.app{box-shadow:0 0 60px rgba(0,0,0,.12)}}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* بەڵام تاسک بارەکە بە داواکاری بەکارهێنەر هەمیشە دەخشێت */
@media(prefers-reduced-motion:reduce){
  .taskbar button{transition:color var(--tb-dur) var(--tb-ease)!important}
  .taskbar button svg{transition:fill var(--tb-dur) var(--tb-ease)!important}
  .taskbar .ic{transition:transform var(--tb-dur) var(--tb-ease)!important}
}
:focus-visible{outline:3px solid #3B82F6;outline-offset:2px;border-radius:12px}

/* ---- ئایکۆنەکانی سەر ڕەنگی سەرەکی ---- */
.acts .call .svgi{background:#fff}
.hero .eta .svgi{background:#fff}
.drv .cl .svgi{background:#fff}
.swipe .qa .c .svgi{background:#fff}
.van-pin .core .svgi{background:#fff}
.pop .opt:hover{background:#F4F3FA}

/* =====================================================================
   دەروازەی پێش ڕەندەر — تا دڵنیا نەبووینەوە کێ چووەتە ژوورەوە،
   هیچ شتێکی لاپەڕەکە دەرناکەوێت. بەمە فلاشی ناوەڕۆک ڕوونادات.
   ===================================================================== */
html.mk-gate body > *:not(.mk-splash){visibility:hidden !important}
html.mk-gate{background:var(--bg)}
html:not(.mk-gate) .mk-splash{opacity:0;pointer-events:none}

.mk-splash{
  position:fixed;inset:0;z-index:9999;
  display:grid;place-content:center;justify-items:center;gap:18px;
  background:var(--bg);
  transition:opacity .35s ease;
}
.mk-splash p{margin:0;font-family:"Poppins",sans-serif;font-size:14px;font-weight:700;
  color:#9a94c4;letter-spacing:.5px}
.mk-mark{display:flex;gap:7px}
.mk-mark span{width:11px;height:11px;border-radius:4px;background:var(--yellow);
  animation:mkb 1s ease-in-out infinite}
.mk-mark span:nth-child(2){animation-delay:.15s}
.mk-mark span:nth-child(3){animation-delay:.3s}
@keyframes mkb{
  0%,100%{transform:translateY(0);opacity:.35}
  50%    {transform:translateY(-9px);opacity:1}
}

/* پەڕەکانی تۆخ — شاشەی چاوەڕوانیش تۆخ بێت */
body.dark-gate .mk-splash,
html.mk-gate body.dark-gate{background:#1E1B3A}

/* =====================================================================
   ڕیسپۆنسیڤ — لە ٣٢٠px تا شاشەی گەورە
   ===================================================================== */
@media (max-width:360px){
  .app{padding-left:11px;padding-right:11px}
  .sect span{font-size:15px}
  .stat .lbl{font-size:11.5px}
  .stat .val{font-size:22px}
}

/* شاشەی کورت (تەلەفۆن بە شێوەی پانی) */
@media (max-height:620px){
  .login{justify-content:flex-start;padding-top:18px;padding-bottom:18px}
  .lg-art{max-width:200px;margin:12px auto 16px}
  .adm-shield,.drv-shield{width:64px;height:64px;border-radius:22px;margin-bottom:14px}
  .lg-in h1{font-size:21px}
  .lg-f{height:56px}
  .lg-btn{height:58px}
}

/* تابلێت */
@media (min-width:600px) and (max-width:900px){
  .app{max-width:560px}
  .tabbar{max-width:532px}
}

/* پەڕەی ئادمین لە سەرەتاوە تۆخە */
body.adm-dark{background:#0B0B0E}
html.mk-gate body.adm-dark,
body.adm-dark .mk-splash{background:#0B0B0E}
body.adm-dark .mk-splash p{color:#8F96BD}

.mk-splash .mk-slow{
  font-size:11.5px;color:#8F96BD;font-weight:600;opacity:0;
  animation:mkslow 0s linear 5s forwards;
}
@keyframes mkslow{to{opacity:1}}

/* ---------- بنەمای ڕیسپۆنسیڤ ---------- */
*,*::before,*::after{min-width:0}
img,svg,video{max-width:100%}
body{overflow-x:hidden}
button,a,input,select,textarea{font-size:inherit}

/* =====================================================================
   پێوانەی گونجاو — قەبارەی نووسین لەگەڵ پانی شاشە دەگۆڕێت
   بەڵام هەرگیز لە ١١px کەمتر نابێت تا خوێندنەوەی ئاسان بێت.
   ===================================================================== */
:root{
  --fs-xs: clamp(11px,  2.9vw, 12px);
  --fs-sm: clamp(12px,  3.2vw, 13px);
  --fs-md: clamp(13px,  3.6vw, 14.5px);
  --fs-lg: clamp(15px,  4.4vw, 17px);
  --fs-xl: clamp(18px,  5.4vw, 22px);
  --pad-card: clamp(13px, 3.8vw, 17px);
  --gap-sm: clamp(7px, 2.2vw, 10px);
}

/* هیچ نووسینێک لە ١١px کەمتر نەبێت */
small, .cnt, .cap, .dot-badge, .mdot, .mode,
.hstat span, .drv-kpi span, .tile .tn,
.stat .lbl, .hero .lbl{
  font-size:var(--fs-xs) !important;
}

/* دوگمەکان لانیکەم ٤٢px بەرزی بن — بۆ کرتەکردنی ئاسان بە پەنجە */
button, .opt, .fbtn, .btn-main, .btn-ghost, .fchip{
  touch-action:manipulation;
}

/* تاسک بار لەسەر شاشەی بچووک */
@media (max-width:380px){
  .taskbar button{padding-left:1px;padding-right:1px}
}
