/* VapeKiss – multi-brand components: brand wall, A–Z, header menu, brand labels. */

/* Brand logo box: logos are shown on a light tile so dark and colour logos stay legible in both schemes. */
.gw-brand-logo { display: grid; place-items: center; background: #ffffff; border-radius: 10px; padding: .75rem 1rem; aspect-ratio: 5 / 2; width: 100%; }
.gw-brand-logo__img { max-width: 100%; max-height: 56px; width: auto; height: auto; object-fit: contain; }
.gw-brand-logo__text { font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #1c1f23; font-size: 1.05rem; text-align: center; line-height: 1.15; }
.gw-brand-logo--sm { width: auto; aspect-ratio: auto; padding: .3rem .6rem; border-radius: 6px; }
.gw-brand-logo--sm .gw-brand-logo__img { max-height: 28px; }
.gw-brand-logo--sm .gw-brand-logo__text { font-size: .8rem; }
.gw-brand-logo--lg { max-width: 260px; }
.gw-brand-logo--lg .gw-brand-logo__img { max-height: 90px; }

/* Brand wall + A–Z grid */
.gw-brand-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 170px), 1fr)); }
.gw-brand-card { display: flex; flex-direction: column; gap: .5rem; height: 100%; padding: .75rem; border: 1px solid var(--gw-border); border-radius: 14px; background: var(--gw-white); color: var(--gw-text); text-decoration: none; transition: transform .2s, border-color .2s, box-shadow .2s; }
.gw-brand-card:hover { transform: translateY(-3px); border-color: var(--gw-link); box-shadow: 0 14px 30px -10px rgba(0, 0, 0, .3); }
.gw-brand-card__name { font-weight: 700; padding: 0 .25rem; }
.gw-brand-card__count { color: var(--gw-muted); font-size: .85rem; padding: 0 .25rem; }

.gw-az { position: sticky; top: 72px; z-index: 5; display: flex; flex-wrap: wrap; gap: .3rem; padding: .6rem; margin: 0 0 1.5rem; background: var(--gw-surface); border: 1px solid var(--gw-border); border-radius: 10px; }
.gw-az a { display: inline-grid; place-items: center; min-width: 40px; min-height: 40px; border-radius: 6px; font-weight: 700; text-decoration: none; color: var(--gw-text); }
.gw-az a:hover { background: var(--gw-primary); }
.gw-az__group { margin-bottom: 2rem; scroll-margin-top: 140px; }
.gw-az__letter { font-family: var(--gw-mono); font-size: 1.5rem; border-bottom: 1px solid var(--gw-border); padding-bottom: .4rem; }

/* Header brand menu */
.gw-brand-menu { position: relative; flex: none; }
.gw-brand-menu summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; padding: 0 .8rem; border-radius: var(--gw-radius-sm); font-weight: 600; color: var(--gw-text); }
.gw-brand-menu summary::-webkit-details-marker { display: none; }
.gw-brand-menu summary::after { content: ""; width: .45em; height: .45em; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.gw-brand-menu[open] summary::after { transform: rotate(225deg) translateY(-2px); }
.gw-brand-menu summary:hover, .gw-brand-menu[open] summary { background: var(--gw-primary); }
.gw-brand-menu__panel { position: absolute; right: 0; top: calc(100% + .4rem); width: min(92vw, 440px); padding: 1rem; background: var(--gw-white); border: 1px solid var(--gw-border); border-radius: 12px; box-shadow: var(--gw-shadow); z-index: 60; }
.gw-brand-menu__list { list-style: none; margin: 0 0 .75rem; padding: 0; columns: 2; column-gap: 1rem; }
.gw-brand-menu__list a { display: block; padding: .45rem .5rem; border-radius: 6px; color: var(--gw-text); text-decoration: none; break-inside: avoid; }
.gw-brand-menu__list a:hover { background: var(--gw-primary); }
.gw-brand-menu__all { border-top: 1px solid var(--gw-border); padding-top: .75rem; display: flex; }
@media (max-width: 900px) {
	.gw-brand-menu { order: 1; }
	.gw-brand-menu__panel { position: fixed; left: 4vw; right: 4vw; top: auto; width: auto; }
}

/* Brand label on product cards and the product page */
.woocommerce ul.products li.product .gw-card-brand { display: block; padding: 0 1rem; margin-bottom: .2rem; font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gw-muted); }
.gw-product-brand { display: inline-flex; align-items: center; gap: .75rem; margin-bottom: .75rem; text-decoration: none; color: var(--gw-muted); font-size: .9rem; }
.gw-product-brand:hover .gw-product-brand__more { text-decoration: underline; }
.gw-brand-hero { display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem; margin: 0 0 1.5rem; }

/* Brand filter */
.gw-filters--brand select { min-width: 180px; }