/* ================================================================
   CTECH SERVICE PLATFORM — CTD.CSS
   Desktop əsas menyu dizaynı (ctd-*) — yalnız masaüstü (≥901px)
   Hero banner, topbar, profil çipi, modul kartları, widget-lər
   Light dizayn: göy-boz fon (#D9E3F0), ağ kartlar, mavi aksentlər
   Qeyd: Yalnız vizual dəyişikliklər — HTML/JS dəyişmir, bütün
   .ctd-* ID/klasslar qorunur. Guest hero (.ctd-hero.guest-hero)
   toxunulmur — o, köhnə tünd görünüşündə qalır.
   ================================================================ */

/* ═══════════════════════════════════════════════════════════════
   YENİ ƏSAS MENYU DİZAYNI (CTD = CTech Dashboard) — YALNIZ VEB/MASAÜSTÜ
   Mobil versiya bu bloka görə HEÇ dəyişmir (bütün .ctd-* elementləri
   mobil-də display:none, yalnız min-width:901px-də görünür).
   ═══════════════════════════════════════════════════════════════ */

.ctd-hero, .ctd-content-top-wrap, .ctd-banner2-section, .ctd-footer { display:none; }

@media(min-width:901px){

  #dashboardView[style*="display: block"]{
    display:block !important;
    height:auto; min-height:100vh; overflow-y:auto; overflow-x:hidden;
  }
  #dashboardView > .header,
  #dashboardView > .welcome,
  #dashboardView > .profile-row,
  #dashboardView > .container,
  #dashboardView > .footer-note-dash,
  #dashboardView .menu-wrap{ display:none !important; }

  .ctd-hero, .ctd-content-top-wrap, .ctd-banner2-section{ display:block; }
  .ctd-topbar-center{ display:flex; align-items:center; gap:18px; }
.ctd-platform-title{
    margin-left:16px;
    font-family:'Rajdhani',sans-serif;
    font-weight:700;
    font-size:22px;
    letter-spacing:2.5px;
    color:#FFFFFF;
    text-transform:uppercase;
    white-space:nowrap;
}

.ctd-platform-title .accent{
    color:#6EA0FF;
}

.ctd-footer{
    display:block;
}

  /* ── Hero (1-ci banner) ── */
  /* v4.70: padding-bottom 210px BƏRPA EDİLDİ — alt bölmə (margin-top:-160px) heroya qalxır,
     kiçik padding stat kartlarının altını örtürdü (4 qutucuq kəsilirdi). */
  .ctd-hero{ position:relative; padding-top:0; padding-bottom:210px; overflow:hidden; background:#0d2035; }
  .ctd-hero.guest-hero{ min-height:100vh; padding-bottom:0; }
  @keyframes dashStatsSpin{ from{transform:rotate(0deg);} to{transform:rotate(360deg);} }
  .ctd-hero-bg{ position:absolute; inset:0; background-image:url('../dash-hero.webp'); background-size:cover; background-position:center 40%; background-repeat:no-repeat; }
  .ctd-hero.guest-hero .ctd-hero-bg{ background-image:url('../guest-hero-bg.webp'); background-position:center center; }
  .ctd-hero.guest-hero .ctd-hero-scrim{ background:linear-gradient(100deg, rgba(10,26,46,0.55) 0%, rgba(10,26,46,0.32) 25%, rgba(15,42,71,0.08) 45%, rgba(15,42,71,0) 65%); }
  #guestDashboardCards{ position:absolute; left:0; right:auto; bottom:150px; z-index:3; padding:0 40px; display:flex; align-items:center; gap:14px; }
  .ctd-hero-scrim{ position:absolute; inset:0; background:linear-gradient(100deg, rgba(10,26,46,0.94) 0%, rgba(10,26,46,0.78) 30%, rgba(15,42,71,0.35) 58%, rgba(15,42,71,0.12) 100%); }
  .ctd-hero-blur{
    position:absolute; inset:0; background-image:url('../dash-hero.webp'); background-size:cover; background-position:center 40%; background-repeat:no-repeat;
    filter:blur(22px); transform:scale(1.08);
    -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 55%, rgba(0,0,0,0.85) 78%, rgba(0,0,0,1) 100%);
    mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 55%, rgba(0,0,0,0.85) 78%, rgba(0,0,0,1) 100%);
    pointer-events:none;
  }
  .ctd-hero-fade{
    position:absolute; left:0; right:0; bottom:0; height:300px;
    background:linear-gradient(to bottom, rgba(221,228,237,0) 0%, rgba(221,228,237,0.15) 55%, rgba(221,228,237,0.55) 75%, #DDE4ED 100%);
    pointer-events:none;
  }
  .ctd-hero.guest-hero .ctd-hero-blur,
  .ctd-hero.guest-hero .ctd-hero-fade{ display:none; }

  /* ── Topbar ── */
  .ctd-topbar{ position:relative; z-index:5; display:flex; align-items:center; justify-content:space-between; padding:12px 40px; flex-wrap:wrap; gap:10px 18px; }
  /* Sol sütun: loqo + onun altında tarix/saat — çərçivə içində, estetik məsafə ilə */
  .ctd-topbar-left{ display:flex; flex-direction:column; align-items:flex-start; gap:9px; min-width:0; }
  .ctd-topbar-left .ctd-clock-pill{ padding:6px 14px; font-size:12px; letter-spacing:.2px; }
  .ctd-brand{ display:flex; align-items:center; gap:10px; font-family:'Space Grotesk','Inter',sans-serif; font-weight:600; font-size:18px; color:#fff; white-space:nowrap; }
  .ctd-brand .accent{ color:#9FC2FF; font-weight:500; }
  .ctd-topbar-right{ display:flex; align-items:center; gap:10px; }
  .ctd-nav-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    padding:6px 18px;
    min-width:200px;

    background:rgba(255,255,255,0.22);
    border:1px solid rgba(255,255,255,0.38);
    border-radius:999px;

    font-size:13px;
    font-weight:600;
    color:#2F6FED;

    cursor:pointer;
    transition:background .15s;
    white-space:nowrap;
}

.ctd-nav-btn svg{
    width:16px;
    height:16px;
    stroke:#2F6FED;
    flex-shrink:0;
}

/* İkon-only nav düyməsi (Heyət haqqında) — mətn yoxdur, simvol loqo */
.ctd-nav-btn.ctd-nav-icon-only{
    width:40px;
    height:40px;
    min-width:0;
    padding:0;
    border-radius:50%;
    gap:0;
}
.ctd-nav-btn.ctd-nav-icon-only svg{
    width:17px;
    height:17px;
}
  .ctd-nav-btn:hover{ background:rgba(255,255,255,0.32); }
  .ctd-nav-btn.ctd-signout{ background:rgba(220,80,80,0.28); border-color:rgba(255,150,150,0.45); }
  .ctd-nav-btn.ctd-signout:hover{ background:rgba(220,80,80,0.4); }
  .ctd-clock-pill{
    display:flex; align-items:center; gap:8px;
    background:rgba(255,255,255,0.22); border:1px solid rgba(255,255,255,0.4);
    backdrop-filter:blur(8px); padding:8px 16px; border-radius:999px; color:#fff; font-size:13px; font-weight:600;
    box-shadow:0 2px 10px rgba(8,18,32,0.2);
  }
  .ctd-clock-pill .dot{ width:7px; height:7px; border-radius:50%; background:#54D68A; box-shadow:0 0 0 0 rgba(84,214,138,.6); animation:ctdPulse 2s infinite; flex-shrink:0; }
  @keyframes ctdPulse{ 0%{box-shadow:0 0 0 0 rgba(84,214,138,.55);} 70%{box-shadow:0 0 0 6px rgba(84,214,138,0);} 100%{box-shadow:0 0 0 0 rgba(84,214,138,0);} }
  .ctd-icon-btn{
    width:38px; height:38px; border-radius:11px; background:rgba(255,255,255,0.22); border:1px solid rgba(255,255,255,0.4);
    display:flex; align-items:center; justify-content:center; color:#fff; cursor:pointer;
  }

  /* ── Profil çipi: klikləndikdə açılan animasiyalı menyu (Çıxış + Tətbiq haqqında) ── */
  .ctd-user-chip{
    position:relative; display:flex; align-items:center; gap:10px;
    background:rgba(255,255,255,0.24); border:1px solid rgba(255,255,255,0.42);
    padding:6px 12px 6px 6px; border-radius:999px; cursor:pointer;
    box-shadow:0 2px 10px rgba(8,18,32,0.2);
    transition:background .15s ease;
  }
  .ctd-user-chip:hover{ background:rgba(255,255,255,0.32); }
  .ctd-avatar{ width:30px; height:30px; border-radius:50%; background:#fff; color:#0F2A47; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; flex-shrink:0; }
  .ctd-who{ line-height:1.15; }
  .ctd-uname{
    font-size:13px;
    font-weight:700;
    color:#2F6FED;
}

.ctd-urole{
    font-size:11px;
    color:#2F6FED;
}
  .ctd-chip-caret{ display:flex; align-items:center; color:#fff; opacity:.85; margin-left:2px; transition:transform .2s ease; flex-shrink:0; }
  .ctd-user-chip.open .ctd-chip-caret{ transform:rotate(180deg); }

  .ctd-user-dd{
    position:absolute; top:calc(100% + 10px); right:0; min-width:178px;
    background:#FFFFFF; border:1px solid #E1EAF6; border-radius:14px; padding:5px;
    box-shadow:0 22px 46px rgba(12,26,48,.32); z-index:50;
    opacity:0; visibility:hidden; pointer-events:none;
    transform:translateY(-8px) scale(.97);
    transition:opacity .18s ease, transform .18s ease, visibility .18s;
  }
  .ctd-user-dd.open{ opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0) scale(1); }
  .ctd-user-dd-item{
    display:flex; align-items:center; gap:8px; width:100%; background:none; border:none;
    padding:9px 10px; border-radius:9px; cursor:pointer; color:#1B2A3A; font-size:12.5px; font-weight:600;
    font-family:'Inter',sans-serif; text-align:left; transition:background .12s ease; white-space:nowrap;
  }
  .ctd-user-dd-item svg{ width:13px; height:13px; flex-shrink:0; }
  .ctd-user-dd-item:hover{ background:#F0F5FC; }
  .ctd-user-dd-item.ctd-dd-signout{ color:#C23B3B; }
  .ctd-user-dd-item.ctd-dd-signout:hover{ background:#FCEEEE; }
  .ctd-user-dd-sep{ height:1px; background:#E7ECF3; margin:5px 6px; }
  body.dark-mode .ctd-user-dd{ background:#16212E; border-color:#4A6182; }
  body.dark-mode .ctd-user-dd-item{ color:#E8EEF5; }
  body.dark-mode .ctd-user-dd-item:hover{ background:#1C2A3D; }
  body.dark-mode .ctd-user-dd-sep{ background:#2A3A50; }

  /* ── Hero məzmunu ── */
  .ctd-hero-inner{ position:relative; z-index:2; padding:8px 40px 0; }
  .ctd-welcome{ color:#fff; font-size:28px; font-weight:600; margin-bottom:6px; font-family:'Space Grotesk','Inter',sans-serif; }
  .ctd-welcome span{ color:#9FC2FF; }
  .ctd-subwelcome{ color:#DCE7F7; font-size:14px; margin-bottom:30px; max-width:400px; }

  /* v4.84: 4 qutucuq × 4 slayd (4+4 = 16 panel) — əvvəlki ölçülər bərpa edildi */
  .ctd-stat-row{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:16px; max-width:880px; }
  /* v4.33: Kart dizaynı — TƏQVİM YARPAĞI üslubu. BÜTÜN kartlarda eyni (stabil)
     göy akcent + ağ çərçivəli vərəq; üstdə 2 halqalı təqvim başlığı. Simvol kiçik
     və sola çəkilir; yazılar ellipsis ilə qutuya TAM sığır (kəsilmir, yarımçıq qalmır). */
  .ctd-stat-card{
    position:relative; overflow:hidden;
    display:flex; align-items:flex-start; gap:10px;
    background:#FFFFFF;
    border:1px solid #D3E0F2;
    border-radius:16px;
    padding:32px 14px 14px 12px;
    box-shadow:0 12px 26px -20px rgba(12,26,48,0.35);
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  }
  .ctd-stat-cal{
    position:absolute; top:0; left:0; right:0; height:24px;
    background:linear-gradient(90deg,#2563EB,#3B82F6);
    display:flex; align-items:center; justify-content:center; gap:12px;
  }
  .ctd-stat-cal-ring{
    width:8px; height:8px; border-radius:50%;
    background:#FFFFFF; box-shadow:0 1px 2px rgba(0,0,0,.25);
  }
  .ctd-stat-card:hover{ transform:translateY(-3px); box-shadow:0 18px 34px -20px rgba(12,26,48,0.42); border-color:#B7CCEB; }
  .ctd-stat-icon{
    width:30px; height:30px; border-radius:9px;
    background:#EAF1FE; color:#2F6FED;
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    margin-left:2px; margin-top:6px;
  }
  .ctd-stat-icon svg{ width:15px; height:15px; }
  .ctd-stat-body{ display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
  .ctd-stat-label{ font-size:11px; font-weight:600; color:#5C7089; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; line-height:1.3; }
  .ctd-stat-value{ font-family:'Space Grotesk','Inter',sans-serif; font-size:22px; font-weight:700; color:#12233B; line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
  .ctd-stat-sub{ font-size:10px; color:#94A3B8; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }

  /* v4.62: GUEST HERO — 4 stat qutucuğu bus/tvm dashboard kartları kimi görünür:
     transparan tünd içlik + içindəki yazılar AĞ; qutucuğun baş hissəsindəki
     qalın göy xətt (təqvim başlığı) qalır, amma transparan göy olur (qara DEYİL). */
  .ctd-hero.guest-hero .ctd-stat-card{
    background:rgba(13,27,45,0.32);
    border:1px solid rgba(255,255,255,0.22);
    backdrop-filter:blur(8px);
    box-shadow:0 12px 26px -20px rgba(0,0,0,.55);
  }
  .ctd-hero.guest-hero .ctd-stat-card:hover{ border-color:rgba(255,255,255,.45); }
  .ctd-hero.guest-hero .ctd-stat-cal{
    background:linear-gradient(90deg, rgba(37,99,235,0.55), rgba(59,130,246,0.55));
  }
  .ctd-hero.guest-hero .ctd-stat-cal-ring{ background:rgba(255,255,255,.9); box-shadow:0 1px 2px rgba(0,0,0,.3); }
  .ctd-hero.guest-hero .ctd-stat-icon{ background:rgba(255,255,255,.15); color:#9FC2FF; }
  .ctd-hero.guest-hero .ctd-stat-label{ color:#FFFFFF; }
  .ctd-hero.guest-hero .ctd-stat-value{ color:#FFFFFF; }
  .ctd-hero.guest-hero .ctd-stat-sub{ color:#AEBED3; }
  .ctd-hero.guest-hero .ctd-stat-card-overlay{ background:rgba(10,20,35,.62); backdrop-filter:none; }
  .ctd-hero.guest-hero .ctd-stat-card-sp{ border-color:rgba(255,255,255,.25); border-top-color:#9FC2FF; }
  .ctd-hero.guest-hero .ctd-stat-card-tx{ color:#E8EEF5; }

  /* v4.29: iOS vidget üslubu karusel — eyni sabit qutuda 4 slayd yuxarı sürüşür.
     Stage sabit hündürlükdədir (slayd dəyişəndə kart ölçüsü sıçramır), track
     JS tərəfindən inline transform ilə (boş olmayan slayd sayına görə) sürüşür. */
  .ctd-stat-stage{ overflow:hidden; height:60px; }
  .ctd-stat-track{ display:flex; flex-direction:column; transition:transform .5s cubic-bezier(.4,0,.2,1); will-change:transform; }
  .ctd-stat-slide{ height:60px; display:flex; flex-direction:column; justify-content:center; gap:2px; min-width:0; }
  .ctd-stat-slide .ctd-stat-value{ font-size:19px; line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
  .ctd-stat-slide .ctd-stat-sub{ font-size:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
  .ctd-stat-slide .ctd-stat-label{ font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; line-height:1.25; }

  /* ═══════════════════════════════════════════════════════════════
     v4.38/v4.39: AVTOMATİK TƏZƏLƏMƏ VIDJETİ — yuxarı barda yumru göy
     düymə (içində geriyə sayan rəqəm + xarici halqa). Animasiyalar:
     rəqəm hər dəyişəndə pop, 5-dən aşağıda qırmızı, başlayanda yaşıl.
     Təzələnmə zamanı HƏR 4 qutucuğun İÇİNDƏ ayrı-ayrı fırlanan
     "Yenilənir" vizualı (ən azı 2 san) göstərilir.
     ═══════════════════════════════════════════════════════════════ */
  .ctd-stat-row{ position:relative; }
  .ctd-refresh-widget{
    position:relative; width:40px; height:40px; border-radius:50%;
    background:linear-gradient(135deg,#2563EB,#3B82F6);
    border:1px solid rgba(255,255,255,.45);
    color:#FFFFFF; display:flex; align-items:center; justify-content:center;
    cursor:pointer; flex-shrink:0;
    font-family:'Space Grotesk','Inter',sans-serif;
    box-shadow:0 4px 14px rgba(37,99,235,.35);
    transition:transform .15s ease, box-shadow .15s ease, background .3s ease;
  }
  .ctd-refresh-widget:hover{ transform:translateY(-2px); box-shadow:0 8px 20px rgba(37,99,235,.5); }
  .ctd-refresh-widget:active{ transform:scale(.93); }
  /* Geriyə sayma halqası — JS hər saniyə --p dəyərini yeniləyir (0% → 100%) */
  .ctd-refresh-widget::before{
    content:""; position:absolute; inset:-4px; border-radius:50%;
    background:conic-gradient(rgba(255,255,255,.9) calc(var(--p,0)*1%), rgba(37,99,235,.25) 0);
    -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.5px));
    mask:radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.5px));
    pointer-events:none;
  }
  .ctd-refresh-num{ font-size:13.5px; font-weight:700; line-height:1; letter-spacing:.2px; }
  /* v4.39: rəqəm hər dəyişəndə pop animasiyası (JS 'pop' sinfini yenidən əlavə edir) */
  @keyframes ctdNumPop{ 0%{ transform:scale(1.45); } 100%{ transform:scale(1); } }
  .ctd-refresh-num.pop{ display:inline-block; animation:ctdNumPop .3s cubic-bezier(.2,.85,.3,1.25); }
  .ctd-refresh-ico{ position:absolute; inset:0; display:none; align-items:center; justify-content:center; }
  .ctd-refresh-widget.refreshing .ctd-refresh-num{ display:none; }
  .ctd-refresh-widget.refreshing .ctd-refresh-ico{ display:flex; }
  .ctd-refresh-widget .ctd-refresh-ico svg{ width:17px; height:17px; animation:dashStatsSpin .8s linear infinite; }
  .ctd-refresh-widget.refreshing::before{ opacity:.35; }
  body.dark-mode .ctd-refresh-widget{ border-color:rgba(255,255,255,.3); }

  /* v4.39: Sayma (yenidən) başlayanda ilk rəqəm YAŞIL parlayır (60 → göy) */
  .ctd-refresh-widget.fresh{
    background:linear-gradient(135deg,#059669,#10B981);
    box-shadow:0 4px 16px rgba(16,185,129,.45);
    border-color:rgba(255,255,255,.6);
  }
  .ctd-refresh-widget.fresh::before{
    background:conic-gradient(rgba(255,255,255,.92) calc(var(--p,0)*1%), rgba(5,150,105,.25) 0);
  }

  /* v4.39: 5-dən aşağıya düşəndə vidjet QIRMIZI olur + nəbz animasiyası */
  .ctd-refresh-widget.urgent{
    background:linear-gradient(135deg,#DC2626,#EF4444);
    box-shadow:0 4px 14px rgba(220,38,38,.4);
    animation:ctdUrgentPulse 1s ease-in-out infinite;
  }
  .ctd-refresh-widget.urgent::before{
    background:conic-gradient(rgba(255,255,255,.92) calc(var(--p,0)*1%), rgba(220,38,38,.3) 0);
  }
  @keyframes ctdUrgentPulse{
    0%,100%{ box-shadow:0 4px 12px rgba(220,38,38,.3); }
    50%{ box-shadow:0 4px 22px rgba(220,38,38,.6); }
  }

  /* v4.39: HƏR 4 qutucuğun İÇİNDƏ ayrı-ayrı "Yenilənir" vizualı (orta hissə, blur) */
  .ctd-stat-card-overlay{
    position:absolute; inset:0; z-index:5; border-radius:16px;
    background:rgba(255,255,255,.74);
    backdrop-filter:blur(4px);
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px;
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .25s ease, visibility .25s;
  }
  .ctd-stat-row.refreshing .ctd-stat-card-overlay{ opacity:1; visibility:visible; }
  .ctd-stat-card-sp{
    width:22px; height:22px; flex-shrink:0;
    border:3px solid #CFE0F7; border-top-color:#2F6FED; border-radius:50%;
    animation:dashStatsSpin .8s linear infinite;
  }
  .ctd-stat-card-tx{ font-size:11px; font-weight:700; color:#2F6FED; }

  /* ── Bus əməliyyatları bölməsi ── */
  .ctd-content-top-wrap{ position:relative; z-index:3; background:#D9E3F0; padding-top:56px; margin-top:-160px; padding-bottom:50px; }
  .ctd-content-top{ padding:0 40px; }
  /* v4.84: BUS | Metro-Turniket | TVM — 3 sütun yan-yana; cihaz inventarizasiyası banner sahəsinə köçdü */
  .ctd-content-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:18px; align-items:stretch; }
  /* v4.89: Cihaz inventarizasiyası — YIĞCAM DÖRD BUCAQLI DÜYMƏ, sağa hizalanmış toolbar-da
     (əvvəl sütunda tam genişlikdə sətir kartı idi) */
  .ctd-services-toolbar{ display:flex; flex-direction:column; align-items:flex-end; gap:8px; margin-bottom:14px; }
  /* v4.96: Real-Time Map qutusu — cihaz inventarizasiyası qutusu ilə EYNİ ölçüdə (eyni .ctd-device-inv bazası), göy aksent + xəritə ikonu */
  .ctd-rtmap{ border-color:#9DB9F5; }
  .ctd-rtmap:hover{ border-color:#2F6FED; box-shadow:0 16px 30px -18px rgba(47,111,237,.35); }
  .ctd-rtmap .ctd-device-inv-icon{ background:#E8EFFC; color:#2F6FED; }
  .ctd-rtmap .ctd-device-inv-title{ color:#2F6FED; }
  .ctd-rtmap .ctd-device-inv-btn{ background:#2F6FED; }
  body.dark-mode .ctd-rtmap{ border-color:#2E4D8E; }
  body.dark-mode .ctd-rtmap .ctd-device-inv-title{ color:#7DA5F5; }
  body.dark-mode .ctd-rtmap .ctd-device-inv-btn{ background:#2F6FED; }
  .ctd-device-inv{
    display:inline-flex; flex-direction:row; align-items:center; gap:10px;
    width:auto; flex-shrink:0; padding:10px 16px;
    background:#FFFFFF; border:2px dashed #7ED7A0; border-radius:10px;
    box-shadow:0 1px 2px rgba(20,35,55,0.04), 0 12px 26px -20px rgba(20,35,55,0.16);
    text-decoration:none; cursor:pointer;
    transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease;
  }
  .ctd-device-inv:hover{ transform:translateY(-2px); border-color:#0D9652; box-shadow:0 16px 30px -18px rgba(13,150,82,0.35); }
  .ctd-device-inv-icon{ width:34px; height:34px; border-radius:8px; background:#E6F4EA; color:#0D9652; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
  .ctd-device-inv-icon svg{ width:18px; height:18px; }
  .ctd-device-inv-info{ display:flex; flex-direction:column; gap:1px; min-width:0; }
  .ctd-device-inv-title{ font-size:12px; font-weight:700; color:#0D9652; text-align:left; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
  .ctd-device-inv-desc{ font-size:10px; color:#5C7089; text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
  .ctd-device-inv-btn{ padding:6px 14px; border-radius:8px; background:#0D9652; color:#FFFFFF; font-size:12px; font-weight:600; flex-shrink:0; }
  body.dark-mode .ctd-device-inv{ background:#16212E; border-color:#2E7D55; }
  body.dark-mode .ctd-device-inv-title{ color:#4FC38B; }
  body.dark-mode .ctd-device-inv-desc{ color:#8CA0BC; }
  .ctd-section-label{ display:flex; align-items:center; gap:10px; margin:0 0 16px 4px; }
  .ctd-section-label span{ font-size:12px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:#2F6FED; }
  .ctd-section-label .rule{ width:26px; height:2px; border-radius:2px; background:#2F6FED; }
  .ctd-section-label.on-dark span{ color:#2F6FED; }
  .ctd-section-label.on-dark .rule{ background:#2F6FED; }

  .ctd-module-card{
    background:#FFFFFF; border:1px solid #DDE8F5;
    border-radius:18px; padding:20px;
    box-shadow:0 14px 30px -18px rgba(12,26,48,0.16);
    display:flex; flex-direction:column;
  }
  .ctd-module-head{ display:flex; align-items:center; gap:12px; margin-bottom:6px; }
  .ctd-module-icon{ width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:all .2s ease; }
  .ctd-module-icon.blue{ background:#EAF1FE; color:#2F6FED; }
  .ctd-module-icon.teal{ background:#E4F5F2; color:#0E8C7A; }
  /* v4.85: Metro (bənövşəyi) və TVM (kəhrəba) modul kart ikonları — BUS ilə eyni dizayn */
  .ctd-module-icon.purple{ background:#F1EAFE; color:#7C3AED; }
  .ctd-module-icon.amber{ background:#FDF3E3; color:#C9821B; }
  .ctd-module-head:hover .ctd-module-icon.blue{ background:#2F6FED; color:#FFFFFF; box-shadow:0 0 16px rgba(47,111,237,0.45); }
  .ctd-module-head:hover .ctd-module-icon.teal{ background:#0E8C7A; color:#FFFFFF; box-shadow:0 0 16px rgba(14,140,122,0.45); }
  .ctd-module-head:hover .ctd-module-icon.purple{ background:#7C3AED; color:#FFFFFF; box-shadow:0 0 16px rgba(124,58,237,0.45); }
  .ctd-module-head:hover .ctd-module-icon.amber{ background:#C9821B; color:#FFFFFF; box-shadow:0 0 16px rgba(201,130,27,0.45); }
  .ctd-module-title{ font-size:15px; font-weight:600; color:#12233B; }
  .ctd-module-desc{ font-size:12px; color:#5C7089; margin-top:1px; }
  .ctd-module-actions{ display:grid; grid-template-columns:repeat(4, 1fr); gap:10px; margin-top:16px; }
  .ctd-action-btn{
    display:flex; flex-direction:column; align-items:flex-start; gap:7px;
    padding:12px; background:#EAF1FE; border:1px solid #CFE0F7; border-radius:10px;
    cursor:pointer; transition:border-color .15s ease, background .15s ease, transform .15s ease;
  }
  .ctd-action-btn:hover{ border-color:#2F6FED; background:#EBF1FA; transform:translateY(-1px); }
  .ctd-action-btn:hover .a-icon{ background:#2F6FED; color:#FFFFFF; border-radius:8px; padding:4px; }
  .ctd-action-btn .a-icon{ color:#2F6FED; transition:background .15s ease, color .15s ease; }
  .ctd-action-btn .a-label{ font-size:11.5px; font-weight:500; color:#12233B; }

  .ctd-mini-widget{
    background:#FFFFFF; border:1px solid #DDE8F5;
    border-radius:14px; padding:14px 16px;
    display:flex; align-items:center; gap:12px; flex:1;
    box-shadow:0 1px 2px rgba(20,35,55,0.04), 0 12px 26px -20px rgba(20,35,55,0.16);
    cursor:pointer; transition:transform .15s ease, border-color .15s ease;
  }
  .ctd-mini-widget:hover{ transform:translateY(-2px); border-color:#2F6FED; }
  /* v4.63: TVM + Bus kartları YAN-YANA (paralel), aralarında məsafə — bitişik deyil */
  #guestDashboardCards .ctd-mini-widget{
    max-width:340px !important; background:rgba(13,27,45,0.32); border-color:rgba(255,255,255,0.22);
    flex:none;
  }
  /* Guest kartlarının mətnləri köhnə tünd görünüşdə qalır (guest hero toxunulmur) */
  #guestDashboardCards .ctd-mini-title{ color:#FFFFFF; }
  #guestDashboardCards .ctd-mini-desc{ color:#AEBED3; }
  .ctd-mini-icon{ width:32px; height:32px; border-radius:9px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
  .ctd-mini-icon.teal{ background:#E4F5F2; color:#0E8C7A; }
  .ctd-mini-icon.blue{ background:#EAF1FE; color:#2F6FED; }
  .ctd-mini-title{ font-size:13px; font-weight:600; color:#12233B; margin-bottom:1px; }
  .ctd-mini-desc{ font-size:11px; color:#5C7089; }

  /* ── 2-ci banner bölməsi (TVM) ── */
  /* v4.70: köhnə dəyərlər BƏRPA EDİLDİ — banner hündürlüyü içindəki qutulardan gəlir,
     padding dəyişikliyi görünmürdü; banner şəkli kiçilməsi istənirsə background-size ilə edilməlidir. */
  /* v4.84: banner ƏVVƏLKİ HALINA qaytarıldı — şəkil tam ölçüdə (cover), "uzaqlaşma" effekti silindi */
  /* v4.88: banner v4.80 GÖRÜNÜŞÜNƏ TAM QAYTARILDI — qutular banner-dən çıxıb content-ə
     keçdiyi üçün hündürlük SABİT 700px edildi (əvvəl qutular içində olduğu üçün banner
     ~700px idi); şəkil 55% mövqedə, fadlar 150/190px, skrim köhnə dəyərlər — köhnə görünüş. */
  .ctd-banner2-section{ position:relative; margin-top:0; height:700px; overflow:hidden; }
  .ctd-banner2-bg{ position:absolute; inset:0; background-image:url('../dash-tvm-banner.webp'); background-size:cover; background-position:center 55%; background-repeat:no-repeat; }
  .ctd-banner2-top-fade{ position:absolute; left:0; right:0; top:0; height:150px; background:linear-gradient(to bottom, #D9E3F0 0%, rgba(217,227,240,0) 100%); }
  .ctd-banner2-scrim{ position:absolute; inset:0; background:linear-gradient(200deg, rgba(15,42,71,0.20) 0%, rgba(15,42,71,0.08) 35%, rgba(15,42,71,0.14) 100%); }
  .ctd-banner2-fade-bottom{ position:absolute; left:0; right:0; bottom:0; height:190px; background:linear-gradient(to bottom, rgba(217,227,240,0) 0%, #D9E3F0 92%); }

  /* v4.71: hər bölmənin öz başlığı — sütun daxilində tile-lər şaquli düzülür */
  .ctd-widget-col{ display:flex; flex-direction:column; gap:14px; min-width:0; }
  .ctd-widget-col .ctd-section-label{ margin:0 0 2px 4px; }
  .ctd-widget-tile{
    background:#FFFFFF; border:1px solid #DDE8F5;
    border-radius:16px; padding:16px; box-shadow:0 14px 30px -20px rgba(6,14,26,0.28);
    transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease; cursor:pointer;
  }
  .ctd-widget-tile:hover{ transform:translateY(-2px); border-color:#2F6FED; box-shadow:0 18px 34px -20px rgba(6,14,26,0.32); }
  .ctd-widget-icon{ width:32px; height:32px; border-radius:9px; display:flex; align-items:center; justify-content:center; margin-bottom:12px; }
  .ctd-widget-icon.amber{ background:#FDF3E3; color:#C9821B; }
  .ctd-widget-icon.teal{ background:#E4F5F2; color:#0E8C7A; }
  .ctd-widget-icon.blue{ background:#EAF1FE; color:#2F6FED; }
  .ctd-widget-icon.purple{ background:#F1EAFE; color:#7C3AED; }
  .ctd-widget-title{ font-size:13.5px; font-weight:600; color:#12233B; margin-bottom:3px; }
  .ctd-widget-desc{ font-size:11px; color:#5C7089; line-height:1.4; }
  .ctd-icon-btn { display:none !important; }
  #themeToggleBtn { display:none !important; }
  .ctd-footer{ text-align:center; font-size:12px; color:#5C7089; padding:24px 0 40px; position:relative; z-index:3; background:#D9E3F0; }

  /* ═══════════════════════════════════════════════════════════════
     LIGHT THEME OVERRIDES — yalnız daxil olmuş (non-guest) istifadəçi
     Guest hero (.ctd-hero.guest-hero) tünd görünüşündə qalır.
     Yalnız vizual xüsusiyyətlər: rəng, fon, haşiyə, kölgə, mətn rəngi.
     ═══════════════════════════════════════════════════════════════ */
  /* v4.12: Üst hero banner şəkli qaytadan GİZLİ — əsas menyuda yalnız
     aşağıdakı banner (ctd-banner2) görünür, hero light fonda qalır. */
  .ctd-hero:not(.guest-hero){ background:#D9E3F0; }
  .ctd-hero:not(.guest-hero) .ctd-hero-bg{ display:none; }
  .ctd-hero:not(.guest-hero) .ctd-hero-blur{ display:none; }
  .ctd-hero:not(.guest-hero) .ctd-hero-scrim{ background:transparent; }
  .ctd-hero:not(.guest-hero) .ctd-hero-fade{ background:#D9E3F0; }

  .ctd-hero:not(.guest-hero) .ctd-topbar{
    background:rgba(255,255,255,0.95);
    border-bottom:1px solid #E3EAF3;
    backdrop-filter:blur(8px);
  }
  .ctd-hero:not(.guest-hero) .ctd-brand{ color:#12233B; }
  .ctd-hero:not(.guest-hero) .ctd-brand .accent{ color:#2F6FED; }
  .ctd-hero:not(.guest-hero) .ctd-platform-title{ color:#12233B; }
  .ctd-hero:not(.guest-hero) .ctd-platform-title .accent{ color:#2F6FED; }
  .ctd-hero:not(.guest-hero) .ctd-nav-btn{ background:#EAF1FE; border-color:#CFE0F7; color:#2F6FED; }
  .ctd-hero:not(.guest-hero) .ctd-nav-btn svg{ stroke:#2F6FED; }
  .ctd-hero:not(.guest-hero) .ctd-nav-btn:hover{ background:#EBF1FA; border-color:#2F6FED; }
  .ctd-hero:not(.guest-hero) .ctd-nav-btn.ctd-signout{ background:#FEEBEB; border-color:#F5C6C6; }
  .ctd-hero:not(.guest-hero) .ctd-nav-btn.ctd-signout:hover{ background:#FBDCDC; }
  .ctd-hero:not(.guest-hero) .ctd-clock-pill{
    background:#FFFFFF; border-color:#DDE8F5; color:#12233B;
    box-shadow:0 2px 10px rgba(12,26,48,0.08);
  }
  .ctd-hero:not(.guest-hero) .ctd-user-chip{
    background:#FFFFFF; border-color:#DDE8F5;
    box-shadow:0 2px 10px rgba(12,26,48,0.08);
  }
  .ctd-hero:not(.guest-hero) .ctd-user-chip:hover{ background:#F5F9FF; }
  .ctd-hero:not(.guest-hero) .ctd-avatar{ background:#EAF1FE; color:#2F6FED; }
  .ctd-hero:not(.guest-hero) .ctd-uname{ color:#2F6FED; }
  .ctd-hero:not(.guest-hero) .ctd-urole{ color:#5C7089; }
  .ctd-hero:not(.guest-hero) .ctd-chip-caret{ color:#12233B; }
  .ctd-hero:not(.guest-hero) .ctd-welcome{ color:#12233B; }
  .ctd-hero:not(.guest-hero) .ctd-welcome span{ color:#2F6FED; }
  .ctd-hero:not(.guest-hero) .ctd-subwelcome{ color:#5C7089; }

  @media (max-width:1240px){
    .ctd-content-grid{ grid-template-columns:1fr; }
    .ctd-widget-tile{ grid-column:span 1 !important; }
    .ctd-module-actions{ grid-template-columns:repeat(2,1fr); }
    .ctd-stat-row{ grid-template-columns:repeat(2,1fr); }
    /* v4.89: dar ekranda inventar düyməsi yığcam və sağa hizalanmış qalır */
    .ctd-services-toolbar{ justify-content:flex-end; }
    .ctd-device-inv{ width:auto; }
  }

  /* Dar ekranlarda başlıq gizlədilir ki, topbar (loqo+saat | profil) bir sətirdə,
     çərçivə içində simmetrik qalsın */
  @media (max-width:1150px){
    .ctd-platform-title{ display:none; }
  }
}

/* ═══════════════════════════════════════════════════════════════
   v4.58 (#3): DAVAM EDƏN SERVİS SAYI BADGE-İ
   Badge "Davam edən servis" QUTUCUĞUNUN sağ yuxarı küncündədir
   (desktop: .ctd-action-btn, mobil: .card-small) — kiçik ölçü, qutuya uyğun.
   0 olduqda .zero → boz (qırmızı DEYİL); >0 olduqda qırmızı. Rəqəm hər
   təzələmədə JS tərəfindən yenilənir; 0 olanda da "0" görünür.
   ═══════════════════════════════════════════════════════════════ */
.ctd-action-btn{ position:relative; }
.ctd-ongoing-badge{
  position:absolute; top:7px; right:7px; z-index:4;
  min-width:18px; height:18px; padding:0 5px;
  display:inline-flex; align-items:center; justify-content:center;
  background:#E11D2E; color:#FFFFFF; border-radius:999px;
  border:1.5px solid #FFFFFF;
  font-family:'Inter',sans-serif; font-size:10.5px; font-weight:700;
  font-variant-numeric:tabular-nums; line-height:1;
  box-shadow:0 3px 8px rgba(225,29,46,.35);
  animation:ctdBadgeIn .25s ease;
}
.ctd-ongoing-badge.zero{
  background:#C7D0DD; color:#5C7089;
  box-shadow:0 2px 5px rgba(120,135,155,.25);
}
@keyframes ctdBadgeIn{ from{ transform:scale(.6); opacity:0; } to{ transform:scale(1); opacity:1; } }

/* ═══════════════════════════════════════════════════════════════
   v5.11: ƏSAS MENYU REDESIGN — Gemini üslubu (yalnız desktop ≥901px)
   Topbar yenidən quruldu, xoş gəlmisiniz kartı + Real-Time Map / Cihaz
   inventarizasiyası düymələri kartın içində, 4 stat qutucuğu təqvim
   üslubu, servis bölmələri TAB naviqasiyası (BUS default aktiv) —
   keçid zamanı 1 san-lik slayd effekti + "Hazırlanır" vizualı.
   Mobil/gəmid dizaynı dəyişmir. Guest (AYNA/Bakikart) toxunulmur.
   ═══════════════════════════════════════════════════════════════ */
@media(min-width:901px){

  /* ── Səhifə fonu: açıq göy qradiyent ── */
  .ctd-hero:not(.guest-hero),
  .ctd-content-top-wrap,
  .ctd-footer{ background:linear-gradient(180deg,#e2eafc 0%,#dbe4f6 100%); }
  .ctd-hero:not(.guest-hero){ overflow:visible; padding-bottom:34px; }
  .ctd-hero:not(.guest-hero) .ctd-hero-fade{ display:none; }
  .ctd-hero:not(.guest-hero) .ctd-hero-scrim{ background:transparent; }

  /* ── Topbar ── */
  .ctd-topbar{ padding:10px 32px; }
  .ctd-hero:not(.guest-hero) .ctd-topbar{
    background:rgba(255,255,255,.9);
    backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
    border-bottom:1px solid #E2E8F0;
  }
  .ctd-topbar-left{ flex-direction:row; align-items:center; gap:14px; }
  .ctd-topbar-divider{ width:1px; height:24px; background:#CBD5E1; flex-shrink:0; }

  /* Loqo: CTECH üstdə, SOLUTIONS altdakı mavi sətir */
  .ctd-brand{
    flex-direction:column; align-items:flex-start; gap:1px;
    font-size:16px; font-weight:800; line-height:1.05; color:#0F172A;
  }
  .ctd-brand .accent{ font-size:8px; font-weight:700; letter-spacing:2.6px; color:#2563EB; }
  .ctd-platform-title{ margin-left:0; font-family:'Inter',sans-serif; font-size:12px; letter-spacing:1.8px; color:#0F172A; }
  .ctd-hero:not(.guest-hero) .ctd-clock-pill{
    background:#F1F5F9; border:1px solid #E2E8F0; border-radius:8px;
    padding:7px 12px; color:#475569; box-shadow:none; font-size:12px;
  }

  /* Yenilənmə sayğacı: ƏVVƏLKİ KİMİ — yumru, ətrafında 60-dan geriyə sayan halqa
     (v5.11-də qutu forması cəhd edildi, geri qaytarıldı — funksiya EYNİ: saymaq, pop, yaşıl/qırmızı hallar) */

  /* ── Xoş gəlmisiniz kartı ── */
  .ctd-hero-inner{ max-width:1280px; margin:0 auto; padding:24px 40px 6px; }
  .ctd-welcome-card{
    display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px;
    background:#FFFFFF; border:1.5px solid #CBD5E1; border-radius:18px;
    padding:24px 28px;
    box-shadow:0 10px 28px -16px rgba(15,23,42,.14);
  }
  .ctd-hero:not(.guest-hero) .ctd-welcome-card-text .ctd-welcome{ font-size:23px; font-weight:800; color:#0F172A; margin-bottom:3px; }
  .ctd-hero:not(.guest-hero) .ctd-welcome-card-text .ctd-welcome span{ color:#2563EB; }
  .ctd-hero:not(.guest-hero) .ctd-welcome-card-text .ctd-subwelcome{ color:#64748B; font-size:12.5px; font-weight:600; margin-bottom:0; }
  .ctd-welcome-card-actions{ display:flex; flex-direction:row; gap:10px; width:auto; max-width:520px; justify-self:center; align-items:center; }

  /* Real-Time Map + Cihaz inventarizasiyası — kompakt düzbucaqlı kart */
  .ctd-device-inv{
    display:flex; flex-direction:row; align-items:center; gap:8px;
    width:auto; flex:1 1 0; min-width:0; max-width:260px;
    padding:10px 14px;
    background:#008953; border:1px solid #008953; border-radius:12px;
    box-shadow:0 6px 16px -8px rgba(5,150,105,.45);
    text-decoration:none; cursor:pointer;
    transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
  }
  .ctd-device-inv:hover{ transform:translateY(-2px); box-shadow:0 10px 22px -8px rgba(5,150,105,.55); filter:brightness(1.06); }
  .ctd-rtmap{ background:#2962FF; border-color:#2962FF; box-shadow:0 6px 16px -8px rgba(41,98,255,.45); }
  .ctd-rtmap:hover{ box-shadow:0 10px 22px -8px rgba(41,98,255,.55); }
  .ctd-device-inv-icon{ width:30px; height:30px; background:rgba(255,255,255,.18); color:#FFFFFF; border-radius:8px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
  .ctd-device-inv-icon svg{ width:16px; height:16px; }
  .ctd-device-inv-info{ display:flex; flex-direction:column; gap:0; min-width:0; flex:1 1 auto; }
  .ctd-device-inv-title{ color:#FFFFFF !important; font-size:11.5px; font-weight:700; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .ctd-device-inv-desc{ color:rgba(255,255,255,.7) !important; font-size:10px; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .ctd-device-inv-btn{
    background:rgba(255,255,255,.22); color:#FFFFFF;
    padding:5px 10px; border-radius:8px; font-size:10px; font-weight:700; flex-shrink:0; white-space:nowrap;
  }
  body.dark-mode .ctd-device-inv{ background:#008953; border-color:#008953; }
  body.dark-mode .ctd-rtmap{ background:#2962FF; border-color:#2962FF; }
  body.dark-mode .ctd-device-inv-title{ color:#FFFFFF !important; }
  body.dark-mode .ctd-device-inv-desc{ color:rgba(255,255,255,.7) !important; }

  /* ── 4 stat qutucuğu: təqvim üslubu (data/funksionallıq EYNİ) ── */
  .ctd-hero:not(.guest-hero) .ctd-stat-row{ max-width:none; margin-top:20px; }
  .ctd-stat-card{
    border:1.5px solid #93C5FD; border-radius:16px;
    box-shadow:0 8px 22px -14px rgba(37,99,235,.22);
  }
  .ctd-stat-cal{ height:26px; }
  .ctd-stat-icon{ width:38px; height:38px; border-radius:12px; background:#EFF6FF; color:#2563EB; margin-top:8px; }
  .ctd-stat-icon svg{ width:18px; height:18px; }
  .ctd-stat-value{ font-size:24px; font-weight:800; color:#0F172A; }
  .ctd-stat-label{ font-size:11.5px; font-weight:700; color:#475569; }
  .ctd-stat-sub{ font-size:10.5px; }

  /* ── Servis TAB-ları ── */
  .ctd-content-top-wrap{ margin-top:0; padding-top:26px; padding-bottom:46px; }
  .ctd-content-top{ padding:0 40px; max-width:1280px; margin:0 auto; }
  .ctd-tabs{ width:100%; }
  .ctd-tabbar{
    display:flex; align-items:center; gap:8px;
    border-bottom:1.5px solid #CBD5E1; padding-bottom:14px;
    overflow-x:auto; scrollbar-width:thin;
  }
  .ctd-tab{
    display:inline-flex; align-items:center; gap:8px;
    padding:10px 16px; border-radius:12px;
    background:#FFFFFF; border:1.5px solid #CBD5E1; color:#475569;
    font-family:'Inter',sans-serif; font-size:12px; font-weight:700;
    cursor:pointer; white-space:nowrap; flex-shrink:0;
    transition:background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .15s ease;
  }
  .ctd-tab:hover{ background:#F1F5F9; color:#1E293B; transform:translateY(-1px); }
  .ctd-tab.active{ background:#2563EB; border-color:#2563EB; color:#FFFFFF; box-shadow:0 8px 18px -8px rgba(37,99,235,.5); }
  .ctd-tab.active:hover{ background:#2563EB; }
  .ctd-tab-ico{ display:inline-flex; align-items:center; justify-content:center; }
  .ctd-tab-ico svg{ width:15px; height:15px; }
  .ctd-tab.active .ctd-tab-ico svg{ stroke:#FFFFFF; }

  .ctd-tab-stage{ position:relative; margin-top:20px; min-height:120px; }
  .ctd-tab-panel{ display:none; }
  .ctd-tab-panel.active{ display:block; }
  .ctd-tab-panel.leaving{ animation:ctdPanelOut .32s ease forwards; }
  .ctd-tab-panel.entering{ animation:ctdPanelIn .5s cubic-bezier(.22,.8,.3,1); }
  @keyframes ctdPanelOut{ from{ opacity:1; transform:translateX(0); } to{ opacity:0; transform:translateX(-30px); } }
  @keyframes ctdPanelIn{ from{ opacity:0; transform:translateX(34px); } to{ opacity:1; transform:translateX(0); } }
  .ctd-tab-preparing{
    position:absolute; inset:0; z-index:8;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
    background:rgba(255,255,255,.72); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
    border-radius:18px;
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .18s ease, visibility .18s;
  }
  .ctd-tab-preparing.show{ opacity:1; visibility:visible; }
  .ctd-tab-prep-sp{ width:26px; height:26px; border:3px solid #CFE0F7; border-top-color:#2F6FED; border-radius:50%; animation:dashStatsSpin .8s linear infinite; }
  .ctd-tab-prep-tx{ font-size:12px; font-weight:700; color:#2F6FED; }

  /* ── Modul kartı + əməliyyat düymələri (Gemini action cards) ── */
  .ctd-module-card{
    background:#FFFFFF; border:1.5px solid #CBD5E1; border-radius:18px; padding:22px;
    box-shadow:0 8px 22px -14px rgba(15,23,42,.1);
  }
  .ctd-module-head{ gap:13px; margin-bottom:4px; }
  .ctd-module-icon{ width:42px; height:42px; border-radius:12px; }
  .ctd-module-title{ font-size:16px; font-weight:800; color:#0F172A; }
  .ctd-module-desc{ font-size:12px; color:#64748B; }
  .ctd-module-actions{ grid-template-columns:repeat(3,1fr); gap:12px; margin-top:18px; }
  .ctd-action-btn{
    display:flex; flex-direction:row; align-items:center; gap:12px;
    padding:14px 16px;
    background:#FFFFFF; border:1.5px solid #CBD5E1; border-radius:14px;
    transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
  }
  .ctd-action-btn:hover{ border-color:#2563EB; transform:translateY(-2px); box-shadow:0 12px 24px -12px rgba(37,99,235,.28); }
  .ctd-action-btn .a-icon{
    width:38px; height:38px; border-radius:11px;
    background:#EAF1FE; color:#2F6FED;
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    transition:background .2s ease, color .2s ease;
  }
  .ctd-action-btn:hover .a-icon{ background:#2F6FED; color:#FFFFFF; }
  .ctd-action-btn .a-body{ display:flex; flex-direction:column; gap:2px; flex:1; min-width:0; }
  .ctd-action-btn .a-body .a-label{ flex:none; }
  .ctd-action-btn .a-label{ font-size:12.5px; font-weight:700; color:#1E293B; line-height:1.25; }
  /* v5.12: "Davam edən servis" — alt sətir: "X aktiv tapşırıq" (0-da boz, >0-da qırmızı) */
  .ctd-action-btn .a-sub{ font-size:10.5px; font-weight:700; color:#DC2626; line-height:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .ctd-action-btn .a-sub::after{ content:" aktiv tapşırıq"; }
  .ctd-action-btn .a-sub.zero{ color:#94A3B8; }
  .ctd-action-btn::after{
    content:"→"; font-size:13px; font-weight:700; color:#94A3B8; flex-shrink:0;
    transition:color .2s ease, transform .2s ease;
  }
  .ctd-action-btn:hover::after{ color:#2563EB; transform:translateX(3px); }

  /* Davam edən servis badge-i: yumşaq bucaqlı, qutunun İÇİNDƏ sağ yuxarı */
  .ctd-ongoing-badge{ border-radius:7px; top:8px; right:8px; }

  /* ── 2-ci banner ləğv olundu (v5.11) ── */
  .ctd-banner2-section{ display:none !important; }

  /* ── Guest (AYNA/Bakikart) — köhnə tünd görünüş qorunur ── */
  .ctd-hero.guest-hero .ctd-brand{ flex-direction:row; align-items:center; gap:10px; font-size:18px; font-weight:600; color:#FFFFFF; }
  .ctd-hero.guest-hero .ctd-brand .accent{ font-size:18px; font-weight:500; letter-spacing:0; color:#9FC2FF; }
  .ctd-hero.guest-hero .ctd-platform-title{ font-family:'Rajdhani',sans-serif; font-size:22px; letter-spacing:2.5px; color:#FFFFFF; }
  .ctd-hero.guest-hero .ctd-topbar-divider{ background:rgba(255,255,255,.35); }
  .ctd-hero.guest-hero .ctd-welcome-card{ display:block; background:transparent; border:0; box-shadow:none; padding:0; }
  .ctd-hero.guest-hero .ctd-welcome-card-actions,
  .ctd-hero.guest-hero .ctd-welcome-card-spacer{ display:none; }
  .ctd-hero.guest-hero .ctd-stat-row{ max-width:880px; }

  /* ── Responsive ── */
  @media (max-width:1240px){
    .ctd-module-actions{ grid-template-columns:repeat(2,1fr); }
  }
  @media (max-width:1024px){
    .ctd-welcome-card{ grid-template-columns:1fr; gap:18px; }
    .ctd-welcome-card-actions{ max-width:520px; }
    .ctd-module-actions{ grid-template-columns:repeat(2,1fr); }
  }
}
