/* =========================================================
   ОБЩАЯ ШАПКА/ПОДВАЛ для страниц сайта (shop.html, checkout.html,
   favorites.html, orders.html). Раньше избранное/заказы были панелями
   поверх каталога — общей шапки/подвала как переиспользуемого куска
   тогда не требовалось. Теперь это отдельные страницы, поэтому стили
   шапки/подвала вынесены сюда, чтобы не разъезжались между файлами.
   ========================================================= */
:root{
  --bg:#0b0b0c;
  --surface:#151516;
  --card:#1b1b1d;
  --line:rgba(255,255,255,.09);
  --gold:#d1a52c;
  --gold-dim:#8a6c1f;
  --text:#f3efe4;
  --muted:#93938d;
  --red:#c1402f;
  --radius:14px;
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0; overscroll-behavior:none; height:auto; overflow:visible;}
body{
  background:var(--bg); color:var(--text); font-family:'Inter',system-ui,sans-serif;
}
button{font-family:inherit;}

.topnav{
  position:sticky; top:0; z-index:45;
  display:flex; align-items:center; gap:24px;
  padding:16px clamp(16px,4vw,40px);
  border-bottom:1px solid var(--line);
  background:rgba(11,10,9,.9); backdrop-filter:blur(8px);
}
.topnav-logo{
  font-family:'Bebas Neue',sans-serif; font-size:22px; letter-spacing:.02em; white-space:nowrap;
  text-decoration:none; cursor:pointer; display:flex; align-items:center; gap:9px; color:var(--text);
}
.topnav-logo img{width:32px; height:32px; border-radius:50%; object-fit:cover; flex-shrink:0;}
.topnav-logo .brand-white{color:#fff;} .topnav-logo .brand-gold{color:var(--gold);}
.topnav-links{display:flex; gap:22px; margin-left:8px; flex:1; overflow-x:auto;}
.topnav-links a{
  color:var(--muted); text-decoration:none; font-size:13px; font-weight:700;
  letter-spacing:.05em; text-transform:uppercase; white-space:nowrap; cursor:pointer;
}
.topnav-links a:hover, .topnav-links a.active{color:var(--gold);}
.topnav-actions{display:flex; gap:10px; flex-shrink:0;}
@media (max-width: 640px){
  .topnav-links a[data-cat]{display:none;}
  .topnav-logo span{display:none;}
}
/* Соцсети — в подвале, не в шапке: так они на виду на каждой странице,
   а не только там, где для них хватило места в узкой шапке. */
.footer-social{display:flex; gap:8px; justify-content:center; margin:22px 0 0;}
.social-btn{
  width:34px; height:34px; border-radius:50%; background:var(--surface);
  border:1px solid var(--line); color:var(--muted);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.social-btn svg{width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.8;}
.social-btn:hover{color:var(--gold); border-color:var(--gold-dim);}
.icon-btn{
  position:relative; width:42px; height:42px; border-radius:11px;
  background:var(--surface); border:1px solid var(--line); color:var(--text);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  text-decoration:none;
}
.icon-btn svg{width:19px;height:19px; stroke:currentColor; fill:none; stroke-width:1.9;}
.nav-badge{
  position:absolute; top:-5px; right:-5px;
  background:var(--red); color:#fff; font-size:9px; font-weight:800;
  min-width:14px; height:14px; border-radius:7px; display:flex; align-items:center; justify-content:center;
  padding:0 3px;
}

.site-footer{
  display:flex; gap:clamp(24px,5vw,60px); justify-content:center; flex-wrap:wrap;
  max-width:760px; margin:0 auto; padding:34px 20px 8px; border-top:1px solid var(--line); margin-top:20px;
}
.site-footer .f-item{max-width:280px; text-align:center; color:var(--muted); font-size:13px; line-height:1.55;}
.site-footer .f-item b{
  display:block; color:var(--gold); font-size:11px; text-transform:uppercase;
  letter-spacing:.07em; margin-bottom:6px;
}
.brand-note{
  max-width:520px; margin:26px auto 0; padding:0 20px; text-align:center;
  color:var(--muted); font-size:12.5px; line-height:1.7; font-style:italic;
}
.site-footer-legal{
  text-align:center; padding:18px 20px 30px; color:var(--muted); font-size:11.5px; line-height:1.7;
}
.site-footer-legal a{color:var(--muted);}

.cookie-notice{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:95;
  max-width:560px; margin:0 auto; background:var(--surface); border:1px solid var(--line);
  border-radius:14px; padding:16px 18px; display:flex; align-items:center; gap:16px;
  flex-wrap:wrap; box-shadow:0 10px 30px rgba(0,0,0,.4);
}
.cookie-notice p{margin:0; font-size:12.5px; line-height:1.55; color:var(--muted); flex:1; min-width:220px;}
.cookie-notice a{color:var(--gold);}
.cookie-notice button{
  background:var(--gold); color:#1a1400; border:none; border-radius:9px;
  padding:10px 18px; font-weight:800; font-size:13px; cursor:pointer; flex-shrink:0;
}

/* =========================================================
   Простые страницы-списки (favorites.html, orders.html) — те же
   карточки/ряды, что раньше были в выезжающих панелях shop.html.
   ========================================================= */
.page-wrap{max-width:640px; margin:0 auto; padding:28px clamp(16px,4vw,40px) 40px;}
.page-title{ font-family:'Bebas Neue',sans-serif; letter-spacing:.03em; font-size:28px; text-transform:uppercase; margin:0 0 20px; }
.empty-block{text-align:center; color:var(--muted); padding:40px 20px; font-size:13px;}

.fav-row{
  display:flex; justify-content:space-between; align-items:center; gap:10px;
  padding:12px 0; border-bottom:1px solid var(--line);
}
.fav-row-photo{
  width:52px; height:52px; border-radius:10px; object-fit:cover; flex-shrink:0;
  background:var(--card);
}
.fav-row-info{flex:1; min-width:0;}
.fav-row-info .name{font-weight:600; font-size:13px;}
.fav-row-info .price{color:var(--gold); font-size:13px; margin-top:2px;}
.fav-row .add-btn{
  background:none; border:1px solid var(--line); color:var(--text); border-radius:9px;
  padding:10px 14px; font-size:12.5px; font-weight:700; cursor:pointer; flex-shrink:0;
  text-decoration:none; white-space:nowrap;
}
.fav-row .add-btn:hover{border-color:var(--gold-dim); color:var(--gold);}
.fav-row .remove-btn{
  background:none; border:none; color:var(--muted); cursor:pointer; font-size:18px; padding:4px 8px; flex-shrink:0;
}
.fav-row .remove-btn:hover{color:var(--red);}

.order-card{
  border:1px solid var(--line); background:var(--card); border-radius:12px;
  padding:12px 14px; margin-bottom:10px;
}
.order-card .row{display:flex; justify-content:space-between; font-size:12px; color:var(--muted); margin-bottom:6px;}
.order-card .items{font-size:13px; line-height:1.5;}
.order-card .status{font-size:12px; color:var(--gold); margin-top:6px;}
.find-order-hint{
  margin-top:18px; padding-top:16px; border-top:1px solid var(--line);
  font-size:12.5px; color:var(--muted); line-height:1.6;
}
.find-order-hint a{color:var(--gold); text-decoration:none; display:inline-block; margin-top:4px;}
.find-order-hint a:hover{text-decoration:underline;}
