/* File: assets/css/layout.css */

:where(.dag-container,.container,.site-container,.wrap){
  width:100%;
  max-width:var(--dag-container);
  margin-inline:auto;
  padding-inline:var(--dag-gutter);
}

.site-main{min-height:60vh}

/* ===== Header ===== */
.site-header{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(10,16,28,.72);
  backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--dag-border);
}

.site-header::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 240px at 20% 0%, rgba(96,165,250,.18), transparent 55%),
    radial-gradient(700px 240px at 95% 0%, rgba(34,197,94,.12), transparent 58%);
  pointer-events:none;
  opacity:.9;
}

.site-header::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(96,165,250,.35), transparent);
  pointer-events:none;
}

.site-header__inner{
  position:relative;
  display:flex;
  align-items:center;
  gap:18px;
  min-height:86px;
  padding-block:12px;
}

/* Branding (left) */
.site-branding{flex:0 0 auto; min-width:0}
.site-branding__home{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:inherit;
  min-width:0;
}

.site-branding__logo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:18px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--dag-border);
  flex:0 0 auto;
}

.site-branding__logo-img{
  display:block;
  width:auto;
  height:auto;
  max-height:clamp(40px, 3.2vw, 60px);
  max-width:clamp(140px, 14vw, 240px);
  object-fit:contain;
}

.site-branding__logo-fallback{
  width:18px;height:18px;border-radius:7px;
  background:rgba(96,165,250,.7);
  box-shadow:0 10px 26px rgba(96,165,250,.18);
}

.site-branding__name{
  font-family:var(--dag-font-display);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.02em;
  font-size:clamp(14px, 12px + .55vw, 18px);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:min(38vw, 420px);
}

/* Desktop nav (center/right, but not far-right) */
.site-header__nav{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  justify-content:flex-end;
  align-items:center;
}

.site-header__menu{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

.site-header__menu a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:10px 12px;
  border-radius:999px;
  text-decoration:none;
  color:var(--dag-text);
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:12px;
  border:1px solid transparent;
  background:rgba(255,255,255,.03);
  white-space:nowrap;
}

.site-header__menu a:hover{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.14);
}

.site-header__menu .is-current > a,
.site-header__menu a[aria-current="page"]{
  background:rgba(96,165,250,.12);
  border-color:rgba(96,165,250,.26);
}

/* Right actions: burger (mobile) + Inventory (always visible) */
.site-header__actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:10px;
}

.site-header__inventory{
  min-height:42px;
  padding-inline:16px;
  border-radius:999px;
  white-space:nowrap;
}

/* Burger visibility */
.site-burger{ display:inline-flex; }

/* Mobile behavior:
   - show: logo + burger + inventory
   - hide: desktop nav
*/
@media (max-width: 980px){
  .site-header__inner{
    min-height:74px;
    padding-block:10px;
    gap:12px;
  }

  .site-header__nav{
    display:none;
  }

  .site-branding__name{
    max-width:52vw;
  }
}

/* Desktop behavior:
   - show nav
   - hide burger (menu is not needed on desktop)
*/
@media (min-width: 981px){
  .site-burger{ display:none; }
}

/* Very small screens: keep logo readable and avoid wrapping */
@media (max-width: 520px){
  .site-branding__logo{
    padding:7px 10px;
    border-radius:16px;
  }
  .site-branding__logo-img{
    max-height:46px;
    max-width:160px;
  }
  .site-branding__name{
    display:none; /* mobile: logo only, чтобы осталось место под Menu + Inventory */
  }
}

/* Hard reset bullets for menus */
.site-menu,
.site-menu ul,
.menu,
.menu ul,
.site-offcanvas__menu,
.site-offcanvas__menu ul,
.site-header__menu,
.site-header__menu ul{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
}

/* Offcanvas: reuse pills style inside drawer (safe even if offcanvas styles elsewhere) */
.site-offcanvas__cta{
  padding:12px 16px 0;
}

.site-offcanvas__contact{
  padding:14px 16px 18px;
  border-top:1px solid rgba(255,255,255,.08);
}

.site-offcanvas__contact-title{
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:12px;
  color:var(--dag-muted);
  margin-bottom:10px;
}

.site-offcanvas__pills{
  display:grid;
  gap:8px;
}

/* contact pills (reused) */
.site-pill{
  display:inline-flex;
  align-items:baseline;
  gap:10px;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid var(--dag-border);
  background:rgba(255,255,255,.06);
  text-decoration:none;
  color:inherit;
  white-space:nowrap;
  width:100%;
  max-width:100%;
}

.site-pill__k{
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--dag-muted);
  flex:0 0 auto;
}

.site-pill__v{
  font-weight:900;
  overflow:hidden;
  text-overflow:ellipsis;
}

.site-pill:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.18);
}

/* ===== Footer ===== */
.site-footer{
  border-top:1px solid var(--dag-border);
  background:rgba(17,26,43,.65);
}

.site-footer__inner{
  padding-block:clamp(28px, 4vw, 44px);
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(18px, 2vw, 26px);
}

.footer-brand{
  font-family:var(--dag-font-display);
  font-weight:900;
  letter-spacing:.02em;
  text-transform:uppercase;
  font-size:1.05rem;
  margin-bottom:10px;
}

.footer-contact-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:10px;
  color:var(--dag-text);
}

.footer-label{color:var(--dag-muted);font-weight:700;margin-right:6px}

/* Legal buttons centered */
.site-footer__legal{
  display:flex;
  justify-content:center;
}

.footer-legal{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  flex-wrap:wrap;
}

.footer-legal a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid var(--dag-border);
  background:rgba(255,255,255,.06);
  color:var(--dag-text);
  text-decoration:none;
  font-weight:900;
  letter-spacing:.02em;
  text-transform:uppercase;
  font-size:12px;
}

.footer-legal a:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.18);
}

.site-footer__copyright{
  color:var(--dag-muted);
  font-size:.95rem;
  text-align:center;
}
/* Branding mode override: allow "Text only" to show name on very small screens */
@media (max-width: 520px){
  .site-branding__home--text .site-branding__name{
    display:inline;
  }
}

/* --- Mobile header overflow fix (Inventory button) --- */
@media (max-width: 520px){
  /* позволяем левому блоку сжиматься */
  .site-branding{ flex: 1 1 auto; min-width: 0; }
  .site-branding__home{ min-width: 0; }

  /* чуть меньше отступы/гап в хедере */
  .site-header__inner{ gap: 10px; }

  /* логотип компактнее */
  .site-branding__logo{ padding: 6px 8px; }
  .site-branding__logo-img{
    max-width: 140px;
    max-height: 42px;
  }

  /* Inventory компактнее */
  .site-header__actions{ gap: 8px; }
  .site-header__inventory{
    padding-inline: 12px;
    min-height: 40px;
    font-size: 12px;
  }
}

/* на совсем узких экранах прячем текст "Menu", чтобы все точно влезло */
@media (max-width: 380px){
  .site-burger__label{ display: none; }
  .site-header__inventory{
    padding-inline: 10px;
    font-size: 11px;
  }
}
/* ===== Fix: mobile/offcanvas overflow (long address/email/etc) ===== */

/* 1) Drawer panel never wider than viewport */
.site-offcanvas__panel{
  width: min(92vw, 420px);
  max-width: 92vw;
  box-sizing: border-box;
}

/* 2) Pills: allow flex text to shrink + ellipsis works */
.site-offcanvas .site-pill{
  max-width: 100%;
  overflow: hidden;
  box-sizing: border-box;
  white-space: normal; /* override your nowrap inside drawer */
}

/* make value behave like a block/flex item so ellipsis can work */
.site-offcanvas .site-pill__v{
  flex: 1 1 auto;
  min-width: 0;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* label must not shrink */
.site-offcanvas .site-pill__k{
  flex: 0 0 auto;
}

/* 3) Address: show up to 2 lines instead of breaking layout */
.site-offcanvas .site-pill--address .site-pill__v{
  white-space: normal;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  word-break: break-word;
}

/* 4) Menu links: prevent long labels from pushing width */
.site-offcanvas .site-offcanvas__menu a{
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}