/* ==========================================
   REZINA.UZ — BASE LAYOUT (Header + Tabs + Footer)
   ========================================== */
:root{
  --yellow:#FFD700;
  --yellow-dark:#c7a600;

  --rubber-base:#1e1f22;
  --text-strong:#fdfdfd;
  --text:#e3e3e3;
  --muted:#b8c3d4;

  --radius:14px;

  /* фикс-высоты для хедера и вкладок */
  --header-h: 64px;
  --tabs-h:   46px;
}

/* анти-дёргание из-за появления/исчезновения скроллбара */
html{
  overflow-y: scroll;
  scrollbar-gutter: stable both-edges;
}

/* ===== БАЗА / СТИКИ-ЛЭЙАУТ ===== */
*{ box-sizing:border-box }

/* flex-колонка, чтобы футер прилипал к низу */
html,body{
  height:100%;
  margin:0;
  display:flex;
  flex-direction:column;
}

body{
  font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  background:var(--rubber-base);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}

/* ===== HEADER (фиксировано сверху) ===== */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  height:var(--header-h);
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:0 20px; /* <-- важно: вертикальный паддинг = 0 */
  background:var(--yellow);
  border-bottom:2px solid var(--yellow-dark);
  box-shadow:0 4px 12px rgba(0,0,0,.3);
  color:#111;
}
.site-header *{ line-height:1 } /* чтобы ничего не растягивало высоту */

.logo{ display:flex; align-items:center; gap:8px }
.logo-text{
  font-weight:900; font-size:26px; letter-spacing:.25px;
  color:#111; text-decoration:none
}
.uz-badge{ font-weight:900 }

/* ===== ЯЗЫК (кнопка + меню) ===== */
.header-actions{ display:flex; align-items:center; gap:10px; position:relative }
.lang-toggle{
  display:flex; align-items:center; justify-content:center;
  width:42px; height:38px; border-radius:12px; cursor:pointer;
  border:1px solid var(--yellow-dark); background:rgba(0,0,0,.05);
  font-size:18px; line-height:1; color:#111;
}
.lang-menu{
  position:absolute; right:0; top:calc(100% + 8px); z-index:1100;
  background:#111; color:#fff; border:1px solid rgba(255,255,255,.15);
  border-radius:12px; padding:10px; min-width:210px;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
  display:none;
}
.lang-menu.open{ display:block }
.lang-menu .title{ font-weight:700; margin:0 0 8px; opacity:.9 }
.lang-menu .flags{ display:flex; gap:10px; align-items:center }
.lang-menu .flags img{
  width:28px; height:auto; border-radius:4px; cursor:pointer; border:1px solid transparent
}
.lang-menu .flags img.active{ box-shadow:0 0 0 2px #fff }

/* ПК: по ховеру тоже можно показать меню */
@media (hover:hover){
  .header-actions:hover .lang-menu{ display:block }
}

/* ===== ВКЛАДКИ ПОД ШАПКОЙ (фиксировано) ===== */
.page-tabs{
  position:fixed; left:0; right:0; top:var(--header-h); z-index:900;
  height:var(--tabs-h);
  display:flex; align-items:center; gap:8px;
  padding:0 16px; /* <-- вертикальный паддинг = 0 */
  background:rgba(0,0,0,.12);
  backdrop-filter:saturate(140%) blur(6px);
  border-bottom:1px solid rgba(255,255,255,.12);
}
.page-tabs a{
  display:inline-block; padding:8px 14px; border-radius:999px;
  text-decoration:none; font-weight:700; color:#111;
  background:rgba(255,255,255,.7);
  border:1px solid rgba(0,0,0,.12);
  transition:transform .15s ease, background .15s ease;
}
.page-tabs a:hover{ transform:translateY(-1px) }
.page-tabs a.active{
  background:#111; color:#fff; border-color:#111;
}

/* ===== КОНТЕНТНАЯ ОБЛАСТЬ ===== */
main{
  flex:1;
  /* отступ сверху под фикс. шапку + вкладки */
  padding: calc(var(--header-h) + var(--tabs-h)) 16px 40px;
}
.page{ width:min(1100px,92vw); margin:0 auto }
.card{
  background:linear-gradient(180deg,#262729,#1e1f22);
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
  padding:20px; color:#fff;
}

/* ===== ФУТЕР (прижат к низу) ===== */
.footer-min{
  margin-top:auto;               /* ключ к «липкому» футеру */
  padding:26px 20px; text-align:center;
  background:var(--yellow); color:#111;
  border-top:2px solid var(--yellow-dark);
  box-shadow:0 -4px 12px rgba(0,0,0,.3);
}
.footer-min a{ color:#111; font-weight:600; text-decoration:none }
.footer-min a:hover{ text-decoration:underline }

/* ===== АДАПТИВ ===== */
@media (max-width:640px){
  :root{ --header-h:60px; --tabs-h:44px; }
  .page-tabs{
    padding:0 10px; gap:6px; overflow:auto;
  }
  .page-tabs a{ white-space:nowrap; padding:7px 12px }
  main{ padding: calc(var(--header-h) + var(--tabs-h)) 12px 32px; }
}