:root{
  --header-height: 54px;      /* оновлюється JS */
  --header-z: 3200;
  --slider-gap: 1px;

  --glass-bg: rgba(255,255,255,0.62);
  --glass-blur: 16px;
  --glass-border: rgba(24,145,195,0.18);
  --brand: var(--color-main, #1891c3);
  --ink:   var(--color-dark, #0b3a56);
}

/* ===== Header ===== */
.header-glass{
  position: fixed;
  top: 0; left: 0; right: 0;   /* без 100vw, щоб не було горизонтального скролу */
  z-index: var(--header-z);
  height: var(--header-height);
  min-height: var(--header-height);

  display: flex; align-items: center; justify-content: space-between;
  gap: .6rem; padding: 0 .8rem; box-sizing: border-box;

  background: linear-gradient(180deg, var(--glass-bg), rgba(255,255,255,0.42));
  backdrop-filter: blur(var(--glass-blur)); -webkit-backdrop-filter: blur(var(--glass-blur));
  border-radius: 0 0 var(--radius-xl) var(--radius-xl);
  border: 1px solid var(--glass-border); border-top: 0;
  box-shadow: 0 8px 28px rgba(24,145,195,.08);
}

/* Дзеркало: коли лівий слайдер відкритий — прибрати нижній лівий радіус */
.left-slider-open .header-glass{ border-bottom-left-radius: 0 !important; }

/* кнопка меню */
.header-menu-btn{
  display: inline-flex; align-items: center; gap:.5rem;
  padding:.4rem .65rem; border-radius: var(--radius-md);
  background: rgba(255,255,255,.75);
  border:1px solid var(--glass-border);
  box-shadow: 0 2px 8px rgba(24,145,195,.08);
  color: var(--ink);
  transition: .15s ease;
}
.header-menu-btn:hover{ background: var(--brand); color:#fff; border-color: var(--brand); }
.header-menu-btn .icon{ font-size: 1rem; }

/* профіль + дропдаун */
.profile-box{
  gap:.6rem; background: rgba(255,255,255,.72);
  border:1px solid var(--glass-border);
  border-radius: var(--radius-md);
  box-shadow: 0 2px 8px rgba(24,145,195,.08);
}
.profile-box .header-btn{
  padding:.35rem .55rem; border-radius: var(--radius-md);
  background: transparent; border:0; color: var(--ink);
}
.profile-box .dropdown-menu{
  position: absolute; right:0; top:110%;
  min-width: 190px;
  background: rgba(255,255,255,.97);
  border:1px solid var(--glass-border);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 32px rgba(24,145,195,.16);
  z-index: calc(var(--header-z) + 1);
  display: none;
}
.profile-box .dropdown-menu.open{ display:block; animation: fadeIn .18s ease; }
.profile-box .divider{ height:1px; background: var(--glass-border); margin:.25rem .2rem; }
@keyframes fadeIn{ from{opacity:0; transform: translateY(-4px);} to{opacity:1; transform:none;} }

/* дропдаун мов */
.header-lang-dropdown .lang-btn{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.4rem .75rem; border-radius: var(--radius-md);
  background: rgba(255,255,255,.75);
  border:1px solid var(--glass-border);
  box-shadow: 0 2px 8px rgba(24,145,195,.08);
  font-weight: 600; color: var(--ink);
  transition:.15s ease;
}
.header-lang-dropdown .lang-btn:hover{ background: var(--brand); color:#fff; border-color: var(--brand); }
.lang-dropdown-list{
  position:absolute; right:0; top:110%;
  min-width: 190px; padding:.3rem 0;
  background: rgba(255,255,255,.97);
  border:1px solid var(--glass-border);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 32px rgba(24,145,195,.16);
  display:none;
}
.lang-dropdown-list:not(.d-none){ display:block; animation: fadeIn .18s ease; }
.lang-item{
  display:block; padding:.55rem 1rem;
  color: var(--ink); text-decoration:none; font-weight:600; border-radius:.6rem;
}
.lang-item:hover, .lang-item.active{ background: var(--brand); color:#fff; }

/* адаптив */
@media (max-width: 700px){
  .header-glass{ border-radius: 0 !important; padding: 0 .5rem; }
  .header-menu-btn span{ display:none !important; }
  .username{ display:none !important; }
}

/* страховка від горизонтального скролу */
html, body{ overflow-x: hidden; }