/* =====================================================================
   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{
  --bg:#F4F3FA;
  --card:#ffffff;
  --ink:#1b1b1b;
  --muted:#9aa0a6;
  --yellow:#6D4DFF;        /* ڕەنگی سەرەکی — بەنەوشەیی */
  --yellow-soft:#E9E4FF;   /* گەڵاڵەی نەرمی هەمان ڕەنگ */
  --navy:#1E1B3A;
  --navy-2:#141130;
  --red:#F0566B;
  --teal:#0FBF8F;
  --blue:#3B82F6;
  --radius:22px;
  --shadow:0 6px 20px rgba(30,27,58,.06);
  --shadow-lg:0 12px 34px rgba(30,27,58,.10);
  --gap-footer:3cm;        /* بۆشایی نێوان کۆتایی ناوەڕۆک و فوتەر */
  --footer-h:86px;         /* بەرزی فوتەرەکە — بە JS ڕێک دەخرێتەوە */
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  background:#E9E8F3;
  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}