/* МебелеФ v3 — components/header.css. Топбар, шапка, выбор города, мегаменю, живой поиск, логотип. */
/* Header */
.topbar{display:none;background:var(--surface);font-size:13px;color:var(--ink-muted)}
@media(min-width:1024px){.topbar{display:block}}
.topbar__in{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);height:40px}
.topbar__nav{display:flex;align-items:center;gap:var(--space-6)}
.topbar a:hover{color:var(--ink)}
.topbar__phone{font-weight:700;color:var(--ink)}
.header{position:sticky;top:0;z-index:40;background:var(--bg);border-bottom:1px solid var(--line)}
.header__in{display:flex;align-items:center;gap:var(--space-3);padding-top:10px;padding-bottom:10px}
@media(min-width:1024px){.header__in{gap:var(--space-5);height:84px;padding:0}}
.logo{display:flex;align-items:center;flex:none}
.logo svg{height:34px;width:auto}
@media(min-width:1024px){.logo svg{height:46px}}
.city{display:inline-flex;align-items:center;gap:6px;border:none;background:none;font-size:13px;font-weight:600;cursor:pointer;padding:4px}
.header__search{flex:1;min-width:0;display:flex;align-items:center;gap:var(--space-3);height:44px;padding:0 var(--space-3);border:1.5px solid var(--line-control);border-radius:var(--radius-md);color:var(--ink-muted)}
@media(min-width:1024px){.header__search{height:48px;padding:0 6px 0 var(--space-4)}}
.header__search input{flex:1;min-width:0;border:none;outline:none;background:none;font-size:15px}
.header__search input::placeholder{color:var(--ink-muted)}
.header__search .btn{height:36px;font-size:14px;padding:0 var(--space-4);display:none}
@media(min-width:1024px){.header__search .btn{display:inline-flex}}
.header__actions{display:none;gap:var(--space-1)}
@media(min-width:1024px){.header__actions{display:flex}}
.header__action{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;width:72px;padding:4px 0;border:none;background:none;font-size:12px;cursor:pointer}
.header__action:hover{color:var(--ink-muted)}
.badge-count{position:absolute;top:0;right:14px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--badge);color:var(--on-badge);font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}
.header__row2{display:flex;gap:var(--space-2);padding-bottom:10px}
@media(min-width:1024px){.header__row2{display:none}}
.catalog-btn{display:inline-flex;align-items:center;gap:var(--space-2);height:44px;padding:0 var(--space-4);border:none;border-radius:var(--radius-md);background:var(--accent);color:var(--on-accent);font-size:15px;font-weight:600;cursor:pointer;flex:none}
@media(min-width:1024px){.catalog-btn{height:48px;padding:0 var(--space-5)}}
/* Mega menu */
.megamenu{display:none;position:absolute;left:0;right:0;z-index:45}
.megamenu[data-open="true"]{display:block}
.megamenu__in{background:var(--bg);border-radius:var(--radius-xl);box-shadow:var(--shadow-overlay);display:grid;grid-template-columns:300px 1fr;overflow:hidden;margin-top:var(--space-2)}
.megamenu__cats{padding:var(--space-4) var(--space-3);border-right:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.megamenu__cat{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding:11px var(--space-4);border:none;background:none;border-radius:var(--radius-sm);font-size:15px;text-align:left;cursor:pointer;width:100%}
.megamenu__cat:hover,.megamenu__cat[aria-current="true"]{background:var(--surface-2);font-weight:600}
.megamenu__panel{padding:var(--space-6) var(--space-8);display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) 260px;gap:var(--space-8)}
.megamenu__group{display:flex;flex-direction:column;gap:var(--space-2)}
.megamenu__group a{font-size:15px}
.megamenu__group a:hover{color:var(--ink-muted);text-decoration:underline}
.scrim{position:fixed;inset:0;background:var(--scrim);z-index:35;display:none}
.scrim[data-open="true"]{display:block}
/* Topbar: город, обратный звонок */
.topbar__callback{border:none;background:none;padding:0;font-size:13px;cursor:pointer;color:var(--ink)}
.topbar__callback:hover{color:var(--ink-muted)}
.citysel{position:relative}
.citysel>summary{list-style:none}
.citysel>summary::-webkit-details-marker{display:none}
.citysel__list{position:absolute;top:calc(100% + 6px);left:0;z-index:60;min-width:220px;display:flex;flex-direction:column;padding:var(--space-2);background:var(--bg);border-radius:var(--radius-md);box-shadow:var(--shadow-overlay)}
.citysel__list a{padding:8px 12px;border-radius:var(--radius-sm);font-size:14px;color:var(--ink)}
.citysel__list a:hover,.citysel__list a[aria-current]{background:var(--surface-2)}
.citysel__list a[aria-current]{font-weight:600}
.citysel--inline{display:inline-block}
/* Header */
.header__search{position:relative}
.header__search input[type=search]::-webkit-search-cancel-button{display:none}
.mobile-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);background:var(--surface);flex:none}
.mobile-icon .badge-count{right:2px;top:2px}
.header__row2 .catalog-btn{flex:1;justify-content:center}
.badge-count[hidden]{display:none}
/* Живой поиск */
.livesearch{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:55;background:var(--bg);border-radius:var(--radius-md);box-shadow:var(--shadow-overlay);padding:var(--space-2);max-height:70vh;overflow-y:auto;color:var(--ink)}
.livesearch__h{padding:8px 10px 4px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-muted)}
.livesearch__item{display:flex;align-items:center;gap:var(--space-3);padding:8px 10px;border-radius:var(--radius-sm);font-size:14px}
.livesearch__item:hover,.livesearch__item[aria-selected="true"]{background:var(--surface-2)}
.livesearch__item img,.livesearch__item .ph{width:44px;height:44px;border-radius:var(--radius-sm);object-fit:cover;flex:none}
.livesearch__name{flex:1;min-width:0}
.livesearch__price{font-weight:600;white-space:nowrap}
.livesearch__all{display:block;padding:10px;text-align:center;font-weight:600;font-size:14px;border-top:1px solid var(--line);margin-top:var(--space-1)}
.livesearch__empty{padding:12px 10px;font-size:14px;color:var(--ink-muted)}
/* Мегаменю: панели разделов */
a.megamenu__cat{color:var(--ink)}
.megamenu__panel[hidden]{display:none}
.megamenu__title{grid-column:1/-1;flex-direction:row!important;align-items:baseline;gap:16px!important;flex-wrap:wrap}
.megamenu__panel{grid-template-columns:repeat(3,minmax(0,1fr));align-content:start}
@media(max-width:1023px){
.megamenu{position:fixed;top:0;bottom:0;overflow-y:auto;background:var(--bg)}
.megamenu .container{padding:0}
.megamenu__in{grid-template-columns:1fr;border-radius:0;box-shadow:none;margin:0;min-height:100%}
.megamenu__cats{border-right:0;padding:var(--space-3)}
.megamenu__panel{padding:var(--space-4);grid-template-columns:1fr;gap:var(--space-3);border-top:1px solid var(--line)}
.megamenu__close{display:flex!important}
}
.megamenu__close{display:none;justify-content:space-between;align-items:center;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--line)}
/* Прототип обнулял padding .header__in на десктопе вместе с боковыми отступами контейнера */
@media(min-width:1024px){.header__in.container{padding-left:var(--space-16);padding-right:var(--space-16)}}
.logo img{height:34px;width:auto}
@media(min-width:1024px){.logo img{height:46px}}
