/* v-muzsa: menü-hover türkiz aláhúzás + szöveg */
.menu-effect-v2:after{background-color:var(--pcolor)}
#top_menu .menu-effect-v2:hover{color:var(--pcolor)}
/* v-muzsa: fejléc menüsor finom türkiz sáv (elválasztás, élénkítés) */
.v-header-menu-line-001{background-color:var(--pcolor-subtle)}
/* v-muzsa: lábléc alatti csík (footer-line) linkjei fehérek */
#footer_info_line a{color:#fff!important}
#footer_info_line a:hover{color:var(--scolor)!important}

/* v-muzsa: termékkártya terméknév — középre, picit nagyobb (reszponzív), vastagabb, alatta margó */
.v-item-card-parts-item-card-name-001{text-align:center;margin-bottom:.85rem!important}
.v-item-card-parts-item-card-name-001 a{font-size:clamp(.95rem,.3vw + .88rem,1.15rem)!important;font-weight:700;line-height:1.3}

/* v-muzsa: hero alatti bemutatkozó szekció — halvány türkiz színátmenet */
#section_sections_2{background-image:linear-gradient(180deg,#ffffff 0%,#eef7f9 55%,#e4f2f5 100%)}

/* v-muzsa: szűrő-accordion nyila fekete (a téma alap-ikonja fehér, az amber fejlécen nem látszik) */
.filters-show::after{filter:brightness(0)}

/* v-muzsa: rács/lista nézetváltó — az amber (secondary) gombfelületen SÖTÉT ikon.
   Alapból az aktív gomb ikonja icon-white, az outline gombé pedig hoverre amber ikon
   amber háttéren (a téma --bs-btn-hover-bg: var(--scolor)) → eltűnt. */
.list-display-switch-btn.btn-secondary .icon-white,
.list-display-switch-btn:hover .icon-secondary,
.list-display-switch-btn:active .icon-secondary{fill:rgb(var(--bs-dark-rgb))}
/* az ikon színe a gomb háttérrel EGYÜTT ússzon át (a .btn maga .15s ease-in-out) */
.list-display-switch-btn svg{transition:fill .15s ease-in-out}
@media (prefers-reduced-motion:reduce){.list-display-switch-btn svg{transition:none}}

/* v-muzsa: termékkártya — a cím a kép alá kerül, és a kártyák sávjai soronként egymagasak.
   A rácsot a lista adja, a kártya csak továbbadja (subgrid), így a cím, a szerző/kiadó, a
   készlet, az ár és a gombok végig egy vonalban állnak — a hosszú címek vágása nélkül.
   Csak a termékkártyás listára hat (kapu: a kártyának van .card-footer-e). */
@supports (grid-template-rows:subgrid){
    .v-common-items-006:has(>.card>div>.card-footer){display:grid!important;grid-template-columns:repeat(2,1fr)}
    @media (min-width:992px){
        .v-common-items-006:has(>.card>div>.card-footer):has(>.col-lg-4){grid-template-columns:repeat(3,1fr)}
        .v-common-items-006:has(>.card>div>.card-footer):has(>.col-lg-3){grid-template-columns:repeat(4,1fr)}
    }
    @media (min-width:1200px){
        .v-common-items-006:has(>.card>div>.card-footer):has(>.col-xl-3){grid-template-columns:repeat(4,1fr)}
    }
    /* 6 sáv: kép · cím · szerző-kiadó · készlet · ár · gombok */
    .v-common-items-006:has(>.card>div>.card-footer)>.card{width:auto;max-width:none;display:grid;grid-row:span 6;grid-template-rows:subgrid;margin-bottom:1.5rem!important}
    .v-common-items-006>.card>div:has(>.card-footer){grid-row:1/-1;display:grid!important;grid-template-rows:subgrid}
    /* a kép vízszintesen középre: gridben a sablon align-self-center osztálya már csak
       függőlegesen hat, a nyúló linkben a keskenyebb borító balra tapadna */
    .v-common-items-006>.card>div:has(>.card-footer)>a:has(.v-item-card-parts-item-card-img-001){grid-row:1;height:auto!important;justify-self:center;max-width:100%}
    .v-common-items-006>.card>div:has(>.card-footer)>div:not(.card-footer){grid-row:3/6;display:grid!important;grid-template-rows:subgrid}
    .v-common-items-006>.card>div:has(>.card-footer)>div:not(.card-footer)>div:not(.v-item-card-001){grid-row:1/3;display:grid;grid-template-rows:subgrid}
    .v-common-items-006>.card>div:has(>.card-footer)>div:not(.card-footer)>.v-item-card-001{grid-row:3}
    /* a láb felbomlik: a cím a kép alá, a gombok a kártya aljára kerülnek */
    .v-common-items-006>.card>div>.card-footer{display:contents!important}
    .v-common-items-006>.card>div>.card-footer>.v-item-card-parts-item-card-name-001{grid-row:2;padding:.75rem 1rem 0}
    .v-common-items-006>.card>div>.card-footer>div{grid-row:6;align-self:end;padding:.5rem 1rem 1rem}
    /* tömörebb sávok: a kártyán belüli card-body-k 1rem-es függőleges paddingja túl nagy hézagot ad */
    .v-common-items-006>.card>div:has(>.card-footer) .card-body{padding-top:.2rem!important;padding-bottom:.2rem!important}
    .v-common-items-006>.card>div:has(>.card-footer)>div:not(.card-footer)>.v-item-card-001{padding-top:.45rem!important}
    .v-common-items-006>.card>div>.card-footer>.v-item-card-parts-item-card-name-001{padding:.5rem 1rem 0;margin-bottom:.5rem!important}
    .v-common-items-006>.card>div>.card-footer>div{padding-top:.35rem}
}

/* v-muzsa: katalógus bal sáv — a kategória-fa elrejtve (a fejléc kategória-menüje fedi le),
   így a szűrő kerül a termékek mellé. A wrapper landmark is eltűnik, hogy ne maradjon
   üres navigációs terület a felolvasóknak. */
.v-index-001 nav:has(.v-categories-tree-001){display:none!important}
.v-categories-tree-001{display:none!important}

/* v-muzsa: a szűrő-doboz görgetéskor a fejléc alá ragad, így a termékek mellett végig látszik.
   A bal sáv ehhez a tartalmához zsugorodik (align-self), a kinyitott szűrő pedig a képernyőn
   belül külön görgethető. A ragadás csak tábla-szélességtől, mert a bal sáv mobilon a lista
   fölött, teljes szélességben áll. A fejléc mért magassága: 141 px (md), 123 px (lg+). */
@media (min-width:768px){
    .v-index-001{position:sticky;top:151px;align-self:flex-start;z-index:2;max-height:calc(100vh - 167px);overflow-y:auto}
    /* a bal sáv a szűrőhöz méretezve (a kategória-fa nélkül a 33%/25% üresen maradt),
       így a termékkártyák szélesebbek lehetnek; tábla-méretben szűkebb, hogy a lista
       két kártyát is ki tudjon adni */
    .v-index-001{flex:0 0 auto;width:210px;max-width:210px}
    .v-index-002{flex:1 1 0;max-width:none}
}
@media (min-width:992px){
    .v-index-001{top:133px;max-height:calc(100vh - 149px);width:260px;max-width:260px}
}

/* v-muzsa: mobilon a kosár ikon a fejlécben is látszik (a hamburger mellett); a többi
   fejléc-ikon (kedvencek, belépés, regisztráció) továbbra is csak a mobil menüben. */
@media (max-width:991.98px){
    .v-navigation-section-004{display:flex!important;order:2;margin-left:auto;margin-right:.5rem}
    .v-navigation-section-004 .v-auth-wrapper-001 > li:not(.v-auth-wrapper-011){display:none!important}
    /* a logó a maradék helyre zsugorodik (a kosár + hamburger 120 px), így a három elem
       minden telefon-szélességen egy sorba fér; az arány a kép saját arányából marad meg */
    .v-navigation-section-002 .main-logo-img{max-width:calc(100vw - 140px);max-height:44px;height:auto}
}

/* v-muzsa: a katalógus listaoldal kártya-kiosztása. A motor hardcode osztályai (col-6 col-lg-4
   col-xl-3) mobilon 2, nagy képernyőn 4 kártyát adnának, és a keskeny kártyákon a hosszú
   könyvcímek/kiadónevek nem férnek ki. A kártya-szélességet a fenti subgrid-rács adja, ezért az
   oszlopszámot is ott kell átírni: annyi kártya legyen egy sorban, amennyi LEGALÁBB 240 px-es
   kártyaszélességgel elfér — így mobilon 1 (col-12), és legfeljebb 3 egy sorban (a 32%-os alsó
   korlát miatt a 4. már nem fér be). A hosszú szavak tördelése a keskenyebb nézetekre. */
@supports (grid-template-rows:subgrid){
    .page-catalog-index .v-common-items-006:has(>.card>div>.card-footer){grid-template-columns:repeat(auto-fill,minmax(max(240px,32%),1fr))}
}
.page-catalog-index .v-common-items-006 > .card{overflow-wrap:break-word}

/* v-muzsa: lábléc-logó — a kép natív 360 px-e és a link oldalpaddingja kilógott a lábléc
   oszlopából (a kép-elem szülői inline-ok, ezért az img-fluid 100%-a nem a sávra számolt).
   A linket és a kép-konténert blokká tesszük, így a logó a sávon belül marad. */
.v-footer-boxes-014 > a{display:block}
.v-footer-boxes-014 .v-common-logo-001{display:block;max-width:100%}
.v-footer-boxes-014 .v-common-logo-001 img{max-width:100%;height:auto}

/* v-muzsa: a hero-slider (box full-slider v11) sötétítő gradiense — ügyfél-kérés, hogy a
   banner-képen ne legyen sötétítő réteg. A sablon inline style-lal rakja rá a
   linear-gradient(rgba(0,0,0,.85) → rgba(0,0,0,.25)) réteget, ezt csak !important üti.
   A felirat olvashatósága megmarad: a szövegdoboznak saját bg-dark bg-opacity-75 háttere van. */
.v-full-slider-002{background:none!important}

/* v-muzsa: űrlapmezők kerete — a Bootstrap alap --bs-border-color (#dee2e6) fehér háttéren
   csak 1,3:1 kontraszt, halványabb monitoron alig látszik (ügyfél-jelzés). A #8b949c 3,08:1,
   tehát a WCAG 1.4.11 (nem-szöveges kontraszt) elvárását is teljesíti. Csak az űrlapelemekre
   szűkítve, hogy a kártyák/táblázatok kerete ne változzon. */
.form-control,
.form-select,
.form-check-input,
.input-group-text{border-color:#8b949c}
