/* ═══════════════════════════════════════════════════════════════
   TUR25 — HEADER (BK ŞANTİYE BANT) RESPONSIVE OVERRIDE
   24 Nisan 2026

   Amaç: <header class="hdr"> içindeki bilgi bandının (Modül /
   Kayıtlı / Uygulanan / Tarayıcı / Referansa Al / dengelendi /
   Kullanıcı Değiştir / Çıkış / kullanıcı badge) dar ekranda
   düzgün yerleşmesi.

   Kök sorun: 01-025-qutrit-ekran-ayarlari.js modülü
   @media (max-width: 1100px) altında bilerek 2 satıra geçiriyor
   (scale-slot tam genişlikte, actions alt satırda) — ama
   .hdr { height: 52px } sabit olduğu için 2 satır sığmıyor.

   Strateji:
     1. .hdr  → min-height: 52px; height: auto
        Büyük ekranda aynı, dar ekranda büyüyüp içeriği gösterir.
     2. Pills ve butonların padding/font'u clamp() ile smooth küçülsün.
     3. Brand ("BK ŞANTİYE ERP v4") alt etiketi dar ekranda gizle.
     4. Kullanıcı badge metnini dar ekranda kısalt.

   TUR22 fix'i nav.bottom'ı dinamik ölçtüğü için header büyüyünce
   ribbon otomatik aşağı kayar, ekstra iş gerekmez.

   Geri alma: Bu dosyayı sil + index.html'den link satırını çıkar.
   Base 01-02-header.css ve 01-025-*'e dokunulmadı.
   ═══════════════════════════════════════════════════════════════ */

/* 1) Header sabit 52px yerine esnek: dar ekranda içeriğe göre büyüsün */
header.hdr {
  height: auto !important;
  min-height: 52px;
  padding-top: 4px;
  padding-bottom: 4px;
  box-sizing: border-box;
  row-gap: 2px;
  flex-wrap: wrap;  /* hdr-right tek parça; ama güvence için */
}

/* 2) hdr-right tamamı wrap olabilsin, min-width 0 shrink için kritik */
.hdr-right {
  flex-wrap: wrap !important;
  row-gap: 4px !important;
  min-width: 0;
  flex: 1 1 auto !important;
  padding: 2px 0;
}

/* 3) Session bar (BK ŞANTİYE + bant + actions'ı kapsar) */
#qtr-session-bar {
  row-gap: 3px !important;
  gap: clamp(3px, 0.5vw, 8px) !important;
  padding-left: clamp(2px, 0.5vw, 10px) !important;
  padding-right: 0 !important;
}

/* 4) Brand (BK ŞANTİYE ERP v4) — alt etiket dar ekranda gizle */
.qtr-session-brand .qtr-session-brand-main {
  font-size: clamp(12px, 1vw, 16px);
  font-weight: 800;
  letter-spacing: clamp(0.02em, 0.15vw, 0.08em);
  white-space: nowrap;
}
.qtr-session-brand .qtr-session-brand-sub {
  font-size: clamp(9px, 0.7vw, 11px);
  margin-left: 6px;
}
@media (max-width: 900px) {
  .qtr-session-brand .qtr-session-brand-sub { display: none; }
}

/* 5) Scale pills (Modül / Kayıtlı / Uygulanan / Tarayıcı) — küçültülüp
      wrap'e izin ver, dar ekranda 2 satır olsa bile okunur kalsın */
.qtr-scale-hud.qtr-scale-hud-inline .qtr-scale-hud-pill {
  padding: clamp(2px, 0.3vw, 4px) clamp(5px, 0.7vw, 9px) !important;
  font-size: clamp(9px, 0.78vw, 11px) !important;
  font-weight: 700;
}

/* 6) Scale pills container gap küçültsün */
.qtr-scale-hud.qtr-scale-hud-inline .qtr-scale-hud-pills {
  gap: clamp(2px, 0.3vw, 6px) !important;
  row-gap: 2px !important;
}

/* 7) "Referansa Al" butonu + "Tarayıcı %XXX dengelendi" etiketi */
.qtr-scale-hud.qtr-scale-hud-inline .qtr-scale-hud-btn {
  padding: clamp(3px, 0.4vw, 6px) clamp(5px, 0.8vw, 12px) !important;
  font-size: clamp(9px, 0.8vw, 11px) !important;
}
.qtr-scale-hud.qtr-scale-hud-inline .qtr-scale-hud-warn {
  padding: clamp(2px, 0.3vw, 4px) clamp(5px, 0.7vw, 9px) !important;
  font-size: clamp(9px, 0.78vw, 11px) !important;
}

/* 8) Kullanıcı Değiştir / Çıkış butonları */
.qtr-switch-user-btn,
.qtr-logout-btn {
  padding: clamp(4px, 0.5vw, 8px) clamp(6px, 1vw, 14px) !important;
  font-size: clamp(10px, 0.85vw, 13px) !important;
  white-space: nowrap;
}

/* 9) Kullanıcı badge — "MUSTAFA · MUSTAFA GÖNÜL" */
.qtr-current-user-badge {
  padding: clamp(3px, 0.4vw, 6px) clamp(6px, 0.9vw, 12px) !important;
  gap: clamp(4px, 0.5vw, 8px) !important;
}
.qtr-current-user-value {
  font-size: clamp(10px, 0.85vw, 13px);
  max-width: clamp(120px, 16vw, 240px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  vertical-align: middle;
}
.qtr-current-user-label {
  font-size: clamp(8px, 0.65vw, 10px);
  letter-spacing: 0.06em;
}
@media (max-width: 900px) {
  .qtr-current-user-label { display: none; }
  .qtr-current-user-value { max-width: 110px; }
}

/* 10) Session actions (sağdaki 3'lü kümeyi bir arada tut) */
#qtr-session-actions {
  gap: clamp(4px, 0.5vw, 8px) !important;
  flex-wrap: wrap;
  row-gap: 3px !important;
  justify-content: flex-end;
}

/* 11) ÇOK DAR EKRAN — tarayıcı %175-200+ veya küçük pencere */
@media (max-width: 780px) {
  .qtr-scale-hud.qtr-scale-hud-inline .qtr-scale-hud-pill {
    padding: 2px 5px !important;
    font-size: 9px !important;
  }
  .qtr-switch-user-btn,
  .qtr-logout-btn {
    padding: 3px 7px !important;
    font-size: 10px !important;
  }
  .qtr-current-user-value { max-width: 90px; font-size: 10px; }
}