:root{--bg:#F5F5F7;--card:#fff;--text:#1D1D1F;--text2:#6E6E73;--text3:#A1A1A6;--border:rgba(0,0,0,.08);--accent:#6aa60d;--accent-soft:rgba(106,166,13,.1);--accent-text:#517f08;--orange:#FF9500;--orange-soft:rgba(255,149,0,.14);--orange-text:#B36800;--purple:#AF52DE;--font:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue","Inter",system-ui,sans-serif}
@media(prefers-color-scheme:dark){:root{--bg:#000;--card:#1C1C1E;--text:#F5F5F7;--text2:#98989D;--text3:#636366;--border:rgba(255,255,255,.1);--accent:#8fce2a;--accent-soft:rgba(143,206,42,.18);--accent-text:#a9df55;--orange:#FF9F0A;--orange-soft:rgba(255,159,10,.18);--orange-text:#FFB740;--purple:#BF5AF2}}
:root[data-theme="light"]{--bg:#F5F5F7;--card:#fff;--text:#1D1D1F;--text2:#6E6E73;--text3:#A1A1A6;--border:rgba(0,0,0,.08);--accent:#6aa60d;--accent-soft:rgba(106,166,13,.1);--accent-text:#517f08;--orange:#FF9500;--orange-soft:rgba(255,149,0,.14);--orange-text:#B36800;--purple:#AF52DE;--font:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue","Inter",system-ui,sans-serif}
:root[data-theme="dark"]{--bg:#000;--card:#1C1C1E;--text:#F5F5F7;--text2:#98989D;--text3:#636366;--border:rgba(255,255,255,.1);--accent:#8fce2a;--accent-soft:rgba(143,206,42,.18);--accent-text:#a9df55;--orange:#FF9F0A;--orange-soft:rgba(255,159,10,.18);--orange-text:#FFB740;--purple:#BF5AF2}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;font-family:var(--font);background:var(--bg);color:var(--text)}
#shell{display:flex;flex-direction:column;height:100vh}
.top{flex-shrink:0;display:flex;align-items:center;gap:13px;padding:10px 18px;background:var(--card);border-bottom:.5px solid var(--border);position:relative;z-index:100}
.menu-btn{display:none;width:36px;height:36px;border:.5px solid var(--border);background:var(--bg);border-radius:9px;align-items:center;justify-content:center;color:var(--text2);flex-shrink:0}
.logo{width:32px;height:32px;border-radius:9px;background:var(--accent);display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}
.brand{font-size:15px;font-weight:600;letter-spacing:-.02em}
.brand small{display:block;font-size:11px;color:var(--text3);font-weight:400;margin-top:1px}
.empsw{display:none;gap:3px;background:var(--bg);border-radius:9px;padding:3px;margin-left:14px}
.empsw.show{display:flex}
.empsw button{padding:6px 12px;border:none;background:transparent;color:var(--text2);font-size:12.5px;font-weight:500;border-radius:7px;cursor:pointer;font-family:var(--font)}
.empsw button.on{background:var(--card);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.roles{display:flex;gap:4px;margin-left:auto;background:var(--bg);border-radius:11px;padding:4px;overflow-x:auto}
.roles::-webkit-scrollbar{height:0}
.role-b{padding:8px 16px;border:none;background:transparent;color:var(--text2);font-size:13.5px;font-weight:500;border-radius:8px;cursor:pointer;white-space:nowrap;font-family:var(--font)}
.role-b.on{background:var(--card);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.body{flex:1;display:flex;min-height:0}
.lsidebar{width:248px;background:var(--card);border-right:.5px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;transition:transform .3s cubic-bezier(.32,.72,0,1);z-index:50}
.lnav{flex:1;overflow-y:auto;padding:10px 12px;display:flex;flex-direction:column;gap:2px}
.lnav::-webkit-scrollbar{width:0}
.lsec{font-size:11px;font-weight:600;color:var(--text3);letter-spacing:.04em;padding:14px 11px 5px}
.nitem{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:9px;font-size:14px;font-weight:450;color:var(--text2);cursor:pointer;transition:background .15s,color .15s}
.nitem:hover{background:var(--bg);color:var(--text)}
.nitem.on{background:var(--accent-soft);color:var(--accent-text);font-weight:500}
.nitem svg{flex-shrink:0}
.nbadge{margin-left:auto;background:var(--orange);color:#fff;font-size:11px;font-weight:600;padding:1px 7px;border-radius:100px}
.luser{padding:12px;border-top:.5px solid var(--border);display:flex;align-items:center;gap:10px}
.luser .av{width:34px;height:34px;border-radius:50%;background:var(--purple);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex-shrink:0}
.luser .un{font-size:14px;font-weight:500;line-height:1.2}
.luser .up{font-size:11.5px;color:var(--text3)}
.lmain{flex:1;min-width:0;background:var(--bg)}
#screen{width:100%;height:100%;border:none;display:block;background:var(--bg)}
.scrim{display:none;position:fixed;inset:0;background:rgba(0,0,0,.3);z-index:40}
body.full .lsidebar{display:none}
@media(max-width:860px){
  .menu-btn{display:flex}
  .lsidebar{position:fixed;top:56px;left:0;height:calc(100vh - 56px);transform:translateX(-100%);box-shadow:0 18px 50px rgba(0,0,0,.28);z-index:120}
  body:not(.full) .lsidebar.open{transform:translateX(0)}
  .scrim{top:56px;z-index:110;background:rgba(0,0,0,.4)}
  body:not(.full) .scrim.open{display:block}
  .brand small{display:none}
}
.auth{position:fixed;inset:0;background:linear-gradient(165deg,var(--bg),var(--card));z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto}
.auth.hide{display:none}
.acard{width:100%;max-width:412px;background:var(--card);border:.5px solid var(--border);border-radius:26px;padding:34px 28px;box-shadow:0 24px 70px rgba(0,0,0,.18)}
.alogo{width:56px;height:56px;border-radius:16px;background:linear-gradient(135deg,#6aa60d,#AF52DE);display:flex;align-items:center;justify-content:center;color:#fff;margin:0 auto 16px}
.atitle{text-align:center;font-size:21px;font-weight:600;letter-spacing:-.02em}
.asub{text-align:center;font-size:13.5px;color:var(--text3);margin-top:5px;margin-bottom:22px;line-height:1.4}
.acc{display:flex;align-items:center;gap:13px;width:100%;padding:13px 14px;border:.5px solid var(--border);background:var(--bg);border-radius:15px;margin-bottom:9px;cursor:pointer;transition:all .15s;text-align:left;font-family:var(--font)}
.acc:hover{border-color:var(--accent);background:var(--accent-soft)}
.acc.dis{opacity:.5;cursor:not-allowed}
.acc.dis:hover{border-color:var(--border);background:var(--bg)}
.acc .av{width:40px;height:40px;border-radius:12px;color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:600;flex-shrink:0}
.acc .nm{font-size:14.5px;font-weight:600;color:var(--text)}
.acc .lb{font-size:11.5px;color:var(--text3);margin-top:1px}
.acc .ar{margin-left:auto;color:var(--text3)}
.adis-note{font-size:11.5px;color:var(--orange-text);background:var(--orange-soft);padding:10px 12px;border-radius:11px;margin-top:8px;display:none;line-height:1.4}
.adis-note.show{display:block}
.otp{display:flex;gap:10px;justify-content:center;margin:24px 0 18px}
.otp input{width:54px;height:62px;text-align:center;font-size:24px;font-weight:600;border:.5px solid var(--border);border-radius:15px;background:var(--bg);color:var(--text);outline:none;font-family:var(--font)}
.otp input:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.abtn{width:100%;padding:14px;border:none;border-radius:15px;background:var(--accent);color:#fff;font-size:15px;font-weight:600;cursor:pointer;font-family:var(--font)}
.aback{background:none;border:none;color:var(--accent-text);font-size:13.5px;font-weight:500;cursor:pointer;margin-top:14px;width:100%;font-family:var(--font)}
.averify-user{display:flex;align-items:center;gap:11px;justify-content:center;margin-bottom:4px}
.averify-user .av{width:38px;height:38px;border-radius:11px;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600}
.ahint{text-align:center;font-size:12px;color:var(--text3);margin-top:12px}
.afld{margin-bottom:13px;text-align:left}
.afld label{display:block;font-size:12px;font-weight:600;color:var(--text2);margin-bottom:6px}
.ainput{width:100%;padding:13px 14px;border:.5px solid var(--border);border-radius:13px;background:var(--bg);color:var(--text);font-size:14.5px;outline:none;font-family:var(--font)}
.ainput:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.aselect{width:100%;padding:13px 14px;border:.5px solid var(--border);border-radius:13px;background:var(--bg);color:var(--text);font-size:14.5px;outline:none;font-family:var(--font)}
.atoggle{display:flex;gap:4px;background:var(--bg);border-radius:12px;padding:4px;margin-bottom:16px}
.atoggle button{flex:1;padding:10px;border:none;background:transparent;color:var(--text2);font-size:13px;font-weight:500;border-radius:9px;cursor:pointer;font-family:var(--font)}
.atoggle button.on{background:var(--card);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,.1)}
.alink{text-align:center;font-size:13px;color:var(--text2);margin-top:16px}
.alink a{color:var(--accent-text);font-weight:600;cursor:pointer}
.ademo{font-size:11.5px;color:var(--text3);text-align:center;margin-top:11px;background:var(--bg);padding:9px;border-radius:10px}
.approve-card{background:var(--bg);border:.5px solid var(--border);border-radius:14px;padding:4px 14px;margin-bottom:14px;text-align:left}
.ac-row{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:.5px solid var(--border);font-size:14px}
.ac-row:last-child{border-bottom:none}
.ac-row .k{color:var(--text2)}.ac-row .v{font-weight:600;color:var(--text)}
.upl{display:flex;align-items:center;gap:11px;width:100%;padding:13px;border:1.5px dashed var(--border);border-radius:13px;background:var(--bg);cursor:pointer;margin-bottom:11px;text-align:left;font-family:var(--font)}
.upl .ui{width:38px;height:38px;border-radius:10px;background:var(--accent-soft);color:var(--accent-text);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.upl .ut{font-size:13.5px;font-weight:500;color:var(--text);display:block}
.upl .us{font-size:11.5px;color:var(--text3);display:block}
.upl.done{border-style:solid;border-color:#34C759}
.upl.done .ui{background:rgba(52,199,89,.15);color:#1E8E3E}
.logout-b{width:36px;height:36px;border:.5px solid var(--border);background:var(--bg);border-radius:9px;display:flex;align-items:center;justify-content:center;color:var(--text2);cursor:pointer;flex-shrink:0;margin-left:8px}
.logout-b:hover{color:var(--text)}
.approve-b{position:relative;height:36px;padding:0 12px 0 10px;border:.5px solid var(--border);background:var(--accent-soft);color:var(--accent-text);border-radius:9px;display:flex;align-items:center;gap:7px;font-size:13px;font-weight:600;font-family:var(--font);margin-left:8px}
.approve-b .ab-badge{background:var(--accent);color:#fff;font-size:11px;font-weight:700;min-width:18px;height:18px;border-radius:100px;display:flex;align-items:center;justify-content:center;padding:0 5px}
.notif-wrap{position:relative;margin-left:8px}
.lang-wrap{position:relative;margin-left:8px}
.lang-b{width:auto!important;padding:0 10px;gap:6px}
.lang-cur{font-size:12px;font-weight:700;letter-spacing:.4px}
.theme-b{margin-left:8px}
.lang-menu{position:absolute;top:48px;right:0;width:210px;background:var(--card);border:.5px solid var(--border);border-radius:14px;box-shadow:0 18px 54px rgba(0,0,0,.24);display:none;z-index:1001;padding:6px}
.lang-menu.show{display:block}
.lang-menu button{display:block;width:100%;padding:10px 12px;border:none;background:none;color:var(--text);font-size:13.5px;text-align:left;border-radius:9px;cursor:pointer;font-family:inherit}
.lang-menu button:hover{background:var(--bg)}
.lang-menu button.on{background:var(--accent-soft);color:var(--accent-text);font-weight:600}
.notif-b{position:relative;width:38px;height:38px;border:.5px solid var(--border);background:var(--bg);color:var(--text-2);border-radius:11px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.notif-b:hover{background:var(--card);color:var(--text)}
.nb-badge{position:absolute;top:-5px;right:-5px;background:#FF3B30;color:#fff;font-size:10.5px;font-weight:700;min-width:17px;height:17px;border-radius:100px;display:flex;align-items:center;justify-content:center;padding:0 4px;border:2px solid var(--card)}
.notif-panel{position:absolute;top:48px;right:0;width:374px;max-width:calc(100vw - 24px);background:var(--card);border:.5px solid var(--border);border-radius:16px;box-shadow:0 18px 54px rgba(0,0,0,.24);overflow:hidden;display:none;z-index:1000}
.notif-panel.show{display:block}
.np-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:.5px solid var(--border)}
.np-head>span{font-size:15px;font-weight:700;color:var(--text)}
.np-clear{background:none;border:none;color:var(--accent);font-size:12.5px;font-weight:600;cursor:pointer;font-family:var(--font)}
.np-list{max-height:min(460px,68vh);overflow-y:auto}
.np-item{display:flex;gap:12px;padding:13px 16px;border-bottom:.5px solid var(--border);cursor:pointer}
.np-item:hover{background:var(--bg)}
.np-item:last-child{border-bottom:none}
.np-ic{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}
.np-ic svg{width:19px;height:19px}
.np-tx{flex:1;min-width:0}
.np-tt{font-size:13.5px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:6px}
.np-sb{font-size:12.5px;color:var(--text-2);margin-top:2px;line-height:1.38}
.np-tm{font-size:11px;color:var(--text-3);margin-top:4px}
.np-dot{width:8px;height:8px;border-radius:50%;background:#FF3B30;flex-shrink:0}
.np-act{display:flex;gap:8px;margin-top:9px}
.np-act button{font-size:12px;font-weight:600;padding:6px 12px;border-radius:8px;border:none;cursor:pointer;font-family:var(--font)}
.np-yes{background:#1E8E3E;color:#fff}
.np-no{background:var(--bg);color:var(--text-2);border:.5px solid var(--border)!important}
.np-empty{padding:42px 20px;text-align:center;color:var(--text-3);font-size:13px}
.toast-wrap{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:3000;align-items:center;pointer-events:none}
.toast{background:#1d1d1f;color:#fff;font-size:13.5px;font-weight:500;padding:11px 18px;border-radius:12px;box-shadow:0 10px 34px rgba(0,0,0,.3);opacity:0;transform:translateY(10px);transition:.28s;max-width:88vw;text-align:center}
.toast.show{opacity:1;transform:translateY(0)}
.confirm-ov{position:fixed;inset:0;background:rgba(0,0,0,.42);display:none;align-items:center;justify-content:center;z-index:3500;padding:20px}
.confirm-ov.show{display:flex}
.confirm-box{background:var(--card);border-radius:18px;max-width:360px;width:100%;padding:22px;box-shadow:0 24px 70px rgba(0,0,0,.34)}
.confirm-msg{font-size:14.5px;line-height:1.5;color:var(--text);margin-bottom:18px}
.confirm-acts{display:flex;gap:10px}
.confirm-acts button{flex:1;padding:11px;border-radius:11px;font-size:14px;font-weight:600;font-family:var(--font);cursor:pointer;border:none}
.cf-no{background:var(--bg);color:var(--text-2);border:.5px solid var(--border)!important}
.cf-yes{background:#FF3B30;color:#fff}
.userchip{display:flex;align-items:center;gap:9px;margin-left:auto;background:var(--bg);border-radius:12px;padding:5px 12px 5px 5px}
.uc-av{width:32px;height:32px;border-radius:9px;color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;flex-shrink:0}
.uc-tx{display:flex;flex-direction:column;line-height:1.15}
.uc-nm{font-size:13px;font-weight:600;color:var(--text)}
.uc-lb{font-size:11px;color:var(--text3)}
@media(max-width:560px){.uc-lb{display:none}}

/* ===== SAMI qobiq mobil qatlam (CEO paneli) ===== */
/* Boshqaruv paneli telefonda ham to'liq ishlashi uchun.
   Katta ekranlarga TEGMAYDI. */

html{-webkit-text-size-adjust:100%}

/* --- planshet / kichik noutbuk --- */
@media(max-width:860px){
  .lsidebar{width:min(300px,86vw)}
  .notif-panel{width:min(374px,calc(100vw - 20px));right:-6px}
  .top{gap:10px;padding:10px 14px}
}

/* --- telefon --- */
@media(max-width:600px){
  /* yuqori panel: faqat kerakli narsa qolsin.
     min-height 56px — .lsidebar/.scrim top:56px ga mos kelishi uchun */
  .top{gap:7px;padding:10px 11px;min-height:56px}
  /* .brand ko'rinib turadi (Halol Agency) */
  .logo{width:30px;height:30px}
  .menu-btn,.logout-b{width:34px;height:34px;flex-shrink:0}
  .notif-b,.lang-b,.theme-b{width:34px;height:34px}
  .lang-wrap,.notif-wrap{margin-left:4px}

  /* foydalanuvchi chipi -> faqat avatar */
  .userchip{padding:3px;gap:0;background:transparent;margin-left:auto}
  .uc-tx{display:none}
  .uc-av{width:32px;height:32px}

  /* rol almashtirgich (preview rejimi) siljiydi */
  .roles{margin-left:auto;overflow-x:auto;scrollbar-width:none}
  .roles::-webkit-scrollbar{display:none}
  .roles button{flex-shrink:0;white-space:nowrap;padding:7px 10px;font-size:12px}
  /* ichida userchip bo'lsa — o'rab turgan pill kerak emas */
  .roles:has(.userchip){background:transparent;padding:0;overflow:visible}

  /* bildirishnoma paneli — deyarli to'liq kenglik */
  .notif-panel{
    position:fixed;top:60px;left:8px;right:8px;width:auto;max-width:none;
    max-height:calc(100vh - 76px);overflow-y:auto;-webkit-overflow-scrolling:touch;
  }
  .lang-menu{position:fixed;top:60px;right:8px;left:auto;min-width:190px}

  /* yon panel */
  .lsidebar{width:min(300px,88vw)}
  .luser{padding:11px}

  /* tasdiqlash oynasi */
  .confirm-ov{padding:14px}
  .confirm-box{max-width:100%;padding:18px;border-radius:16px}
  .confirm-acts{flex-direction:column-reverse;gap:8px}
  .confirm-acts button{width:100%;min-height:44px}

  /* toast */
  .toast-wrap{left:10px;right:10px;bottom:14px;transform:none;align-items:stretch}
  .toast{width:100%}

  /* kirish oynasi */
  .auth{padding:14px;align-items:center;justify-content:center}
  .acard{padding:26px 20px;border-radius:22px}
  .acard input,.acard select{font-size:16px}   /* iOS zoom bo'lmasin */
  .acc{padding:12px}
}

/* --- juda tor telefon (iPhone SE va h.k.) --- */
@media(max-width:380px){
  .top{gap:5px;padding:9px 9px;min-height:56px}
  .roles button{padding:7px 8px;font-size:11.5px}
  .atitle{font-size:19px}
}

/* --- past bo'yli ekran: kirish oynasi kesilmasin --- */
@media(max-height:640px){
  .auth{align-items:center;padding-top:14px;padding-bottom:14px}
  .alogo{width:46px;height:46px;margin-bottom:11px}
  .acard{padding:22px 20px}
}

/* ===== Pastki menyu (telefon) — oddiy, tekis ===== */
.bottomnav{display:none}

@media(max-width:600px){
  .bottomnav:empty{display:none !important}
  body:not(.full) .bottomnav{
    display:flex;
    position:fixed;left:0;right:0;bottom:0;z-index:100;
    background:var(--card);
    border-top:.5px solid var(--border);
    padding-top:9px;padding-left:4px;padding-right:4px;
    padding-bottom:calc(6px + env(safe-area-inset-bottom,0px));
    overflow:visible;
  }
  /* iframe pastki menyu ostida qolmasin */
  body:not(.full) .body{padding-bottom:60px}

  .bn-item{
    flex:1;min-width:0;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    padding:5px 2px;border:none;background:none;
    font-family:var(--font);font-size:10.5px;font-weight:500;
    color:var(--text3);cursor:pointer;
    border-radius:10px;
    overflow:visible;                     /* badge kesilmasin */
    -webkit-tap-highlight-color:transparent;
  }
  .bn-item svg{width:21px;height:21px;stroke-width:1.9}
  .bn-item>span:last-child{
    max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    line-height:1.1;
  }
  .bn-item.on{color:var(--accent)}
  .bn-item:active{background:var(--bg)}

  /* ikonka + badge uyasi — badge uchun tepada joy qoldiradi */
  .bn-wrap{
    position:relative;display:flex;align-items:center;justify-content:center;
    width:21px;height:21px;overflow:visible;
  }
  .bn-badge{
    position:absolute;top:-7px;left:100%;
    transform:translateX(-7px);
    background:var(--orange);color:#fff;
    font-size:9.5px;font-weight:700;line-height:1;
    min-width:16px;height:16px;
    padding:0 4px;border-radius:99px;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 0 0 2px var(--card);      /* fon bilan ajralib tursin */
    pointer-events:none;
  }

  /* pastki menyu bor ekan — yuqoridagi hamburger shart emas
     ("Menyu" tugmasi to'liq ro'yxatni ochadi).
     Pastki menyu bo'sh bo'lsa — hamburger qoladi. */
  body:not(.full) .top:has(~ .body) .menu-btn{display:flex}
  body:not(.full):has(.bn-item) .top .menu-btn{display:none}
}

/* ===== Yuqori panel sodda + ostidagi asboblar qatori (telefon) ===== */
.subbar{display:none}
.sb-tools{display:none}

@media(max-width:600px){
  /* --- 1-qator: logo ......... avatar, chiqish --- */
  .top>.lang-wrap,
  .top>.theme-b,
  .top>.notif-wrap{display:none !important}
  .roles{margin-left:auto;order:8}
  .logout-b{order:9;margin-left:2px}

  /* --- 2-qator: profil rasmi tagida, o'ngga tekislangan --- */
  body:not(.full) .subbar{
    display:flex;align-items:center;justify-content:flex-end;
    gap:8px;
    padding-top:6px;padding-bottom:6px;padding-left:11px;padding-right:11px;
    background:var(--card);
    border-bottom:.5px solid var(--border);
    flex-shrink:0;
  }
  .subbar:empty{display:none !important}
  body.noauth .subbar{display:none !important}

  .subbar .lang-wrap,
  .subbar .notif-wrap{margin-left:0;position:relative}
  .subbar .notif-b,
  .subbar .theme-b{width:34px;height:34px}
  .subbar .lang-b{width:auto;height:34px;padding-left:11px;padding-right:11px;gap:6px}

  /* ochiladigan panellar ekranga sig'sin */
  .subbar .notif-panel{
    position:fixed;top:calc(var(--hdr,98px) + 4px);left:8px;right:8px;width:auto;max-width:none;
    max-height:calc(100vh - 180px);overflow-y:auto;
  }
  .subbar .lang-menu{position:fixed;top:calc(var(--hdr,98px) + 4px);right:8px;left:auto;min-width:200px}

  /* yon panel 2-qator ostidan boshlanadi */
  body:not(.full):has(.subbar>*) .lsidebar{top:var(--hdr,98px);height:calc(100vh - var(--hdr,98px))}
  body:not(.full):has(.subbar>*) .scrim{top:var(--hdr,98px)}
  body:not(.full):has(.subbar>*):has(.bn-item) .lsidebar{height:calc(100vh - var(--hdr,98px) - 60px)}
  body:not(.full):has(.bn-item) .scrim{bottom:60px}
}

/* ===== Logo bosiladigan (menyuni ochadi) ===== */
.logo{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .12s,opacity .12s}
.logo:active{transform:scale(.93)}
body.full .logo{cursor:default}
body.full .logo:active{transform:none}

/* ===== Subbar: chapda ekran nomi, o'ngda asboblar ===== */
.sb-crumb{display:none}

@media(max-width:600px){
  body:not(.full) .subbar{justify-content:space-between}

  .sb-crumb{
    display:flex;align-items:center;gap:6px;
    min-width:0;flex:1;
    font-size:13px;color:var(--text3);
    overflow:hidden;white-space:nowrap;
  }
  .sb-crumb .sep{color:var(--text3);opacity:.6}
  .sb-crumb .cur{
    color:var(--text);font-weight:600;
    overflow:hidden;text-overflow:ellipsis;
  }
  .sb-tools-r{display:flex;align-items:center;gap:8px;flex-shrink:0}
}
@media(max-width:380px){
  }

/* ===== Yagona sarlavha paneli: 1-qator + 2-qator bitta blok ===== */
@media(max-width:600px){
  /* ikkalasi ham yon panel bilan bir xil rangda */
  .top{background:var(--card);border-bottom:none}
  body:not(.full) .subbar{background:var(--card);border-bottom:.5px solid var(--border)}

  /* 1-qator: logo + Halol Agency ... avatar, chiqish */
  .brand{
    display:block;font-size:14.5px;font-weight:600;letter-spacing:-.02em;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;
  }
  .brand small{display:none}
  .logo{flex-shrink:0}

  /* 2-qator: to'liq yo'l — Halol Agency / Boshqaruv paneli */
  .sb-crumb{font-size:12.5px}
  .sb-crumb .agy{display:inline;flex-shrink:0}
  .sb-crumb .sep{display:inline;flex-shrink:0}
  .sb-crumb .cur{min-width:0}

  /* 2-qator biroz pastroq boshlanadi (yuqoridagi chiziq yo'q) */
  .subbar{padding-top:2px}
}

@media(max-width:400px){
  .brand{font-size:13.5px}
  .sb-crumb{font-size:12px;gap:5px}
}
@media(max-width:340px){
  .brand{display:none}     /* juda tor: faqat logo */
}

/* ===== Sarlavha yon panel soyasidan yuqorida turadi =====
   Sabab: .lsidebar{box-shadow:0 18px 50px rgba(0,0,0,.28)} soyasi
   yuqoridagi qatorlarni bo'yab, rangni oqdan kulrangga o'zgartirardi.
   Yechim: sarlavhani soyadan ustun z-index'ga chiqaramiz. */
@media(max-width:600px){
  .top{position:relative;z-index:130;background:var(--card)}
  body:not(.full) .subbar{position:relative;z-index:130;background:var(--card)}

  /* yon panel va qorong'i fon sarlavha ostidan boshlanadi */
  .lsidebar{z-index:120}
  .scrim{z-index:110}
}

/* ===== Ikki qator orasidagi chiziq + pastki menyu ikonkalari ===== */
@media(max-width:600px){
  /* 1-qator va 2-qator orasida ajratuvchi chiziq */
  .top{border-bottom:.5px solid var(--border)}

  /* Pastki menyu ham yon panel soyasidan yuqorida turadi.
     Aks holda .lsidebar{box-shadow:0 18px 50px} uni kulrangga bo'yaydi. */
  body:not(.full) .bottomnav{z-index:130}

  /* pastki menyu ikonkalari: 21px -> 19px (tepadagilar 18–20px) */
  .bn-item svg{width:19px;height:19px;stroke-width:1.85}
  .bn-wrap{width:19px;height:19px}
  .bn-item{gap:4px}
  .bn-badge{transform:translateX(-6px)}
}

/* ===== Kirish/yuklanish oynasi markazda (baland kontent bo'lsa — skroll) ===== */
.auth{align-items:center;justify-content:center;overflow-y:auto;-webkit-overflow-scrolling:touch}
.acard{margin:auto}
/* ============================================================
   AUTH DARVOZASI (auth.js)  —  mavjud .acard/.ainput/.abtn ustiga
   ============================================================ */
.aview{display:none}
.aview.on{display:block}

.alogo{
  width:56px;height:56px;border-radius:16px;margin:0 auto 16px;
  background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 24px rgba(106,166,13,.3);
}

.apw{position:relative}
.apw .ainput{padding-right:84px}
.apeek{
  position:absolute;right:6px;top:50%;transform:translateY(-50%);
  height:34px;padding:0 11px;border:none;background:transparent;border-radius:9px;
  font-size:12.5px;font-weight:500;color:var(--text2);cursor:pointer;font-family:var(--font);
}
.apeek:hover{color:var(--text);background:var(--card)}
.apeek:focus-visible{outline:2px solid var(--accent);outline-offset:1px}

.ahint{font-size:12px;color:var(--text3);margin-top:6px}

.atextarea{min-height:76px;resize:vertical;line-height:1.5}

/* ===== SELECT VA FORM ELEMENTLARI DIZAYNI ===== */
select {
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background-color:var(--bg);
  transition:all 0.2s ease;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236aa60d' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  background-size:16px;
}

.aselect,
.crm-sel {
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background-color:var(--bg);
  transition:all 0.2s ease;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236aa60d' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  background-size:16px;
}

@media (prefers-color-scheme:dark){
  select,
  .aselect,
  .crm-sel {
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238fce2a' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  }
}

:root[data-theme="dark"] select,
:root[data-theme="dark"] .aselect,
:root[data-theme="dark"] .crm-sel {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238fce2a' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
}

select:focus,
.aselect:focus,
.crm-sel:focus {
  border-color:var(--accent);
  box-shadow:0 0 0 4px var(--accent-soft);
  outline:none;
}

select:hover,
.aselect:hover,
.crm-sel:hover {
  border-color:var(--accent-text);
}

select:disabled,
.aselect:disabled,
.crm-sel:disabled {
  opacity:0.6;
  cursor:not-allowed;
}

/* Select elementlariga o'ng padding qo'shish (dropdown icon uchun) */
select[style*="width"] {
  background-position:right 12px center !important;
  padding-right:40px !important;
}

/* Select kataklar ichidagi variantlar */
select option {
  background:var(--card);
  color:var(--text);
  padding:8px 12px;
}

select option:checked {
  background:var(--accent-soft);
  color:var(--accent-text);
}

/* CRM SELECT DROPDOWN */
.crm-sel {
  width:100%;
  background:var(--bg);
  border:.5px solid var(--border);
  border-radius:11px;
  padding:11px 40px 11px 13px;
  font-size:14px;
  color:var(--text);
  outline:none;
  font-family:var(--font);
}

/* SAMI FIELD — DATE PICKERS VA CUSTOM FIELDLAR */
.sami-field {
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  padding:11px 13px;
  border:.5px solid var(--border);
  background:var(--bg);
  border-radius:11px;
  color:var(--text);
  font-size:14px;
  font-family:var(--font);
  cursor:pointer;
  transition:all 0.2s ease;
}

.sami-field:hover {
  border-color:var(--accent-text);
}

.sami-field:focus,
.sami-field.active {
  border-color:var(--accent);
  box-shadow:0 0 0 4px var(--accent-soft);
}

.sami-fic {
  margin-left:8px;
  flex-shrink:0;
  font-size:16px;
  opacity:0.7;
  transition:opacity 0.2s ease;
}

.sami-field:hover .sami-fic {
  opacity:1;
}

/* INPUT FIELDLAR */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="date"],
input[type="time"],
textarea {
  width:100%;
  padding:11px 13px;
  border:.5px solid var(--border);
  background:var(--bg);
  border-radius:11px;
  color:var(--text);
  font-size:14px;
  font-family:var(--font);
  outline:none;
  transition:all 0.2s ease;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
textarea:focus {
  border-color:var(--accent);
  box-shadow:0 0 0 4px var(--accent-soft);
}

input[type="text"]:hover,
input[type="email"]:hover,
input[type="tel"]:hover,
input[type="number"]:hover,
input[type="date"]:hover,
input[type="time"]:hover,
textarea:hover {
  border-color:var(--accent-text);
}

/* FLD — FORM FIELD LAYOUT */
.fld {
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
}

.fld label {
  display:block;
  font-size:12px;
  color:var(--text-2);
  margin-bottom:6px;
  font-weight:500;
}

/* INPUT WRAPPER — icon support */
.input {
  display:flex;
  align-items:center;
  gap:8px;
  border:.5px solid var(--border);
  background:var(--bg);
  border-radius:11px;
  padding:0 11px;
  transition:all 0.2s ease;
  overflow:hidden;
}

.input:focus-within {
  border-color:var(--accent);
  box-shadow:0 0 0 4px var(--accent-soft);
}

.input:hover {
  border-color:var(--accent-text);
}

.input .li {
  flex-shrink:0;
  color:var(--text-2);
}

.input input {
  flex:1;
  border:none;
  background:transparent;
  outline:none;
  padding:11px 0;
  color:var(--text);
  font-family:var(--font);
}

.input input::placeholder {
  color:var(--text-3);
}

/* 6 xonali kod — kataklar siqiladi, ekrandan chiqmaydi */
.otp6 input{flex:1;min-width:0;width:auto}

.abtn:disabled{opacity:.45;cursor:not-allowed}
.abtn.tg{background:#229ED9;display:flex;align-items:center;justify-content:center;gap:9px}
.abtn.tg:hover:not(:disabled){background:#2BA8E0}
.abtn.ghost{background:var(--bg);color:var(--text);border:.5px solid var(--border)}
.abtn.ghost:hover:not(:disabled){background:var(--card)}
.atg-a{text-decoration:none;display:block}

.arow{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:16px;font-size:13px}
.atimer{color:var(--text3);font-size:13px;font-variant-numeric:tabular-nums}

.anote{display:none;margin-top:14px;padding:11px 13px;border-radius:13px;font-size:13px;line-height:1.5;text-align:left}
.anote.show{display:block}
.anote.err{color:#C9302C;background:rgba(255,59,48,.12)}
.anote.ok{color:#1E8E3E;background:rgba(52,199,89,.13)}
@media(prefers-color-scheme:dark){
  .anote.err{color:#FF8077;background:rgba(255,69,58,.18)}
  .anote.ok{color:#5DE07F;background:rgba(48,209,88,.18)}
}
:root[data-theme="dark"] .anote.err{color:#FF8077;background:rgba(255,69,58,.18)}
:root[data-theme="dark"] .anote.ok{color:#5DE07F;background:rgba(48,209,88,.18)}

.await-ic{
  width:58px;height:58px;border-radius:17px;margin:0 auto 16px;
  display:flex;align-items:center;justify-content:center;
  background:var(--orange-soft);color:var(--orange-text);
}
.await-ic.bad{background:rgba(255,59,48,.12);color:#C9302C}
.await-live{text-align:center;font-size:13px;color:var(--text2);margin-bottom:18px}
.apulse{
  width:8px;height:8px;border-radius:50%;background:var(--orange-text);
  display:inline-block;margin-right:7px;animation:apul 1.6s ease-in-out infinite;
}
@keyframes apul{0%,100%{opacity:1}50%{opacity:.25}}

.acred{
  background:var(--bg);border:1.5px dashed var(--accent);border-radius:13px;
  padding:14px;font-size:14px;line-height:1.9;text-align:left;margin:4px 0 14px;
}
.acred b{font-size:16px;letter-spacing:.3px}

@media (prefers-reduced-motion:reduce){.apulse{animation:none}}

@media(max-width:600px){
  .otp6{gap:6px}
  .otp6 input{height:56px;font-size:21px}
  .atextarea{font-size:16px}
}

/* ══════════════════════════════════════════════════════════════════════════
   KIRISH EKRANI — yakuniy dizayn qatlami (2026-08)
   Bitta manba: pastdagi qoidalar yuqoridagi hamma .auth qatlamlarini
   bekor qiladi. Yangi qoida qo'shmoqchi bo'lsangiz — shu blok ichida qiling.
   ═══════════════════════════════════════════════════════════════════════ */
/* Fon HAR DOIM ilovaning o'z ranglaridan quriladi.
   BAG BO'LGAN JOY: qorong'i variant qattiq #000 bilan yozilgani va
   [data-theme=light] bilan himoyalanmagani uchun, ilova yorug' rejimda
   turganda ham fon qop-qora bo'lib ketardi (kartochka esa oq qolardi). */
.auth{
  padding:24px 16px;
  background:
    radial-gradient(1100px 640px at 50% -12%, var(--accent-soft), transparent 62%),
    linear-gradient(178deg, var(--bg) 0%, var(--card) 100%);
}

.acard{
  max-width:400px;
  padding:36px 30px 30px;
  border-radius:28px;
  box-shadow:0 30px 70px rgba(0,0,0,.10), 0 2px 8px rgba(0,0,0,.05);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .acard{box-shadow:0 30px 80px rgba(0,0,0,.6);}
}
:root[data-theme="dark"] .acard{box-shadow:0 30px 80px rgba(0,0,0,.6);}

.alogo{
  width:60px;height:60px;border-radius:19px;
  background:linear-gradient(135deg,#6aa60d,#a0dd3d);
  box-shadow:0 12px 28px rgba(106,166,13,.34);
  margin:0 auto 18px;
}

/* — sarlavha — */
.atitle{
  font-size:27px;
  font-weight:500;
  letter-spacing:-.032em;
  line-height:1.14;
  color:var(--text);
}
.atitle b{font-weight:750;}
.atitle.sm{font-size:21px;font-weight:650;letter-spacing:-.024em;}

.asub{
  font-size:14px;
  font-weight:400;
  line-height:1.48;
  color:var(--text2);
  margin:7px auto 26px;
  max-width:31ch;
}

/* — maydonlar — */
.afld{margin-bottom:15px;}
.afld label{
  font-size:11.5px;
  font-weight:650;
  letter-spacing:.045em;
  text-transform:uppercase;
  color:var(--text3);
  margin-bottom:7px;
}

.ainput,.aselect{
  height:52px;
  padding:0 15px;
  border-radius:15px;
  border:1px solid var(--border-2,var(--border));
  font-size:16px;
  font-weight:500;
  letter-spacing:-.006em;
  transition:border-color .16s, box-shadow .16s, background .16s;
}
.atextarea{height:auto;min-height:88px;padding:13px 15px;font-weight:400;}
.ainput::placeholder{color:var(--text3);font-weight:400;letter-spacing:0;}
.ainput:focus,.aselect:focus,.atextarea:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 4px var(--accent-soft);
  outline:none;
}

/* +998 old qo'shimchasi */
.aprefix{position:relative;display:block;}
.aprefix>span{
  position:absolute;left:15px;top:50%;transform:translateY(-50%);
  font-size:16px;font-weight:600;color:var(--text2);
  letter-spacing:-.01em;pointer-events:none;
}
.aprefix .ainput{padding-left:66px;letter-spacing:.02em;}

/* parolni ko'rsatish */
.apw .ainput{padding-right:92px;}
.apeek{
  position:absolute;right:7px;top:50%;transform:translateY(-50%);
  height:38px;padding:0 12px;border-radius:11px;
  font-size:12.5px;font-weight:600;letter-spacing:-.005em;
}

/* — tugmalar — */
.abtn{
  height:52px;padding:0 18px;
  border-radius:15px;
  font-size:15.5px;
  font-weight:650;
  letter-spacing:-.012em;
  box-shadow:0 8px 20px rgba(106,166,13,.24);
  transition:transform .12s, box-shadow .16s, background .16s, opacity .16s;
  margin-top:4px;
}
.abtn:active:not(:disabled){transform:scale(.985);}
.abtn.tg{box-shadow:0 8px 20px rgba(34,158,217,.26);}
.abtn.ghost{box-shadow:none;font-weight:600;margin-top:10px;}
.abtn+.abtn{margin-top:10px;}

.apwa{height:46px;font-size:14px;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:18px;}
.apwa-hint{margin-top:9px;line-height:1.5;}

.alink{
  font-size:13.5px;font-weight:450;color:var(--text2);
  margin-top:18px;letter-spacing:-.005em;
}
.alink a{font-weight:650;text-decoration:none;}
.alink a:hover{text-decoration:underline;}

/* — kod kataklari — */
.otp{gap:8px;margin:26px 0 20px;}
.otp input{
  height:60px;border-radius:15px;
  font-size:23px;font-weight:600;
  font-variant-numeric:tabular-nums;
  border:1px solid var(--border-2,var(--border));
}

/* — holat kartasi — */
.acred{
  border-radius:15px;
  font-size:13.5px;line-height:1.9;
  letter-spacing:-.005em;
}
.acred b{font-variant-numeric:tabular-nums;}

.anote{border-radius:14px;font-size:13.2px;font-weight:500;}
.ahint{font-size:12.5px;line-height:1.5;color:var(--text3);}

/* — kichik ekranlar — */
@media (max-width:420px){
  .acard{padding:30px 22px 26px;border-radius:24px;}
  .atitle{font-size:24px;}
  .atitle.sm{font-size:19.5px;}
  .otp{gap:6px;}
  .otp input{height:56px;font-size:21px;border-radius:13px;}
}
@media (max-height:640px){
  .alogo{width:50px;height:50px;border-radius:16px;margin-bottom:13px;}
  .asub{margin-bottom:20px;}
  .acard{padding:24px 22px;}
}

/* Shrift o'lchami — iOS avtomatik kattalashtirmasligi uchun 16px shart.
   .acard input {font-size:16px} qoidasidan keyin turishi kerak. */
.acard .ainput,
.acard .aselect,
.acard .atextarea,
.acard .otp input{font-size:16px;}
.acard .otp input{font-size:23px;}
.acard .atitle{font-size:27px;font-weight:500;}
.acard .atitle.sm{font-size:21px;font-weight:650;}
@media (max-width:420px){
  .acard .atitle{font-size:24px;}
  .acard .atitle.sm{font-size:19.5px;}
  .acard .otp input{font-size:21px;}
}


/* __EMP_FULLSCREEN__ — hodim paneli to’liq ekran: ilovaning yuqori paneli va
   pastki menyusi yashiriladi, panelning o’z topbar/sidebar’i ishlaydi. */
body.emp .top,body.emp .subbar,body.emp .bottomnav{display:none!important}
body.emp .body{padding-bottom:0!important}
body.emp .lsidebar,body.emp .scrim{display:none!important}


/* __SELECT_POLISH__ — royxatdan otish tanlovlari chiroyli korinishi */
.aselect{appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;
padding-right:44px;font-weight:500;line-height:1.35;
background-image:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%236E6E73%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m6%209%206%206%206-6%22%2F%3E%3C%2Fsvg%3E");
background-repeat:no-repeat;background-position:right 15px center;background-size:16px 16px;
transition:border-color .16s ease,box-shadow .16s ease}
.aselect:hover{border-color:var(--border-2,rgba(0,0,0,.16))}
.aselect:focus,.ainput:focus,.atextarea:focus{border-color:var(--accent,#6aa60d);
box-shadow:0 0 0 4px var(--accent-soft,rgba(106,166,13,.14))}
.aselect option{padding:10px 12px;font-size:14.5px;font-weight:500}
.afld label{font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
color:var(--text-2,#6E6E73);display:block;margin-bottom:7px}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .aselect{
background-image:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2398989D%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m6%209%206%206%206-6%22%2F%3E%3C%2Fsvg%3E")}}
:root[data-theme=dark] .aselect{background-image:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2398989D%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m6%209%206%206%206-6%22%2F%3E%3C%2Fsvg%3E")}