/* ============================================================
   Global Leather — v3 layout update
   simple banner slider, category carousel, full-width listings,
   1 product per row on mobile, collapsible SEO text
   ============================================================ */

/* ── Banner slider (MetaSlider style: image/video only) ─────── */
.gl-slider {
    position: relative;
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    aspect-ratio: 1920 / 600;          /* Admin recommendation: 1920×600 */
    overflow: hidden;
    background: #0d0906;
}
.gl-slider-track { display: flex; height: 100%; transition: transform .7s cubic-bezier(.4,0,.2,1); will-change: transform; }
.gl-slide { position: relative; flex: 0 0 100%; height: 100%; display: block; }
.gl-slide picture, .gl-slide-media { display: block; width: 100%; height: 100%; }
.gl-slide-media { object-fit: cover; object-position: center; }
.gl-slide video[hidden], .gl-slide img[hidden] { display: none; }
.gl-slider-arrow {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
    width: 46px; height: 46px; border-radius: 50%;
    background: rgba(0,0,0,.4); color: #fff; border: 1px solid rgba(255,255,255,.25);
    display: grid; place-items: center; transition: background .2s;
}
.gl-slider-arrow:hover { background: var(--gold); color: var(--black); }
.gl-slider-arrow.prev { left: 1.25rem; }
.gl-slider-arrow.next { right: 1.25rem; }
.gl-slider-dots { position: absolute; left: 50%; bottom: 1rem; transform: translateX(-50%); z-index: 3; display: flex; gap: .5rem; }
.gl-dot { width: 10px; height: 10px; border-radius: 50%; padding: 0; background: rgba(255,255,255,.5); border: 1px solid rgba(0,0,0,.2); transition: width .3s, background .3s; }
.gl-dot.is-active { width: 28px; border-radius: 6px; background: var(--gold-light); }

@media (max-width: 767px) {
    .gl-slider { aspect-ratio: auto; height: clamp(190px, 52vw, 320px); }   /* desktop banner on a phone: keep it a usable size */
    .gl-slider.has-mobile { aspect-ratio: 4 / 5; height: auto; }   /* Admin recommendation: 1080×1350 */
    .gl-slider-arrow { width: 36px; height: 36px; font-size: .8rem; }
    .gl-slider-arrow.prev { left: .5rem; }
    .gl-slider-arrow.next { right: .5rem; }
    .gl-slider-dots { bottom: .6rem; }
}

/* ── Category carousel ──────────────────────────────────────── */
.gl-carousel { position: relative; display: flex; align-items: center; gap: .75rem; }
.gl-carousel-track {
    display: flex; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory;
    scroll-behavior: smooth; scrollbar-width: none; padding: .5rem .25rem 1rem; flex: 1; min-width: 0;
}
.gl-carousel-track::-webkit-scrollbar { display: none; }
.gl-carousel-btn {
    flex: 0 0 44px; height: 44px; border-radius: 50%;
    border: 1px solid rgba(201,141,85,.45); color: var(--gold-light); background: var(--dark-2);
    display: grid; place-items: center; transition: var(--transition);
}
.gl-carousel-btn:hover:not(:disabled) { background: var(--gold); color: var(--black); }
.gl-carousel-btn:disabled { opacity: .3; cursor: default; }
.gl-carousel.is-static .gl-carousel-btn { display: none; }
.gl-carousel.is-static .gl-carousel-track { justify-content: center; }
.gl-cat-card {
    flex: 0 0 clamp(150px, 19%, 220px); scroll-snap-align: start;
    display: flex; flex-direction: column; align-items: center; gap: .35rem; text-align: center;
    padding: 1rem .75rem 1.1rem; border-radius: 18px;
    background: var(--dark-2); border: 1px solid var(--border); transition: var(--transition);
}
.gl-cat-card:hover { border-color: rgba(201,141,85,.5); transform: translateY(-4px); }
.gl-cat-img {
    width: 100%; aspect-ratio: 1; border-radius: 14px; overflow: hidden;
    background: radial-gradient(circle at 50% 40%, #f6efe6, #e6d8c7);
    display: grid; place-items: center; color: #8f5a2c; font-size: 2.6rem; margin-bottom: .4rem;
}
.gl-cat-img img { width: 100%; height: 100%; object-fit: cover; }
.gl-cat-name { font-family: var(--font-serif); font-weight: 700; font-size: 1.15rem; color: var(--cream); }
.gl-cat-count { font-size: .75rem; color: var(--gray-500); }
@media (max-width: 767px) {
    .gl-carousel-btn { display: none; }
    .gl-cat-card { flex: 0 0 120px; }
}

/* ── Product grid: 1 product per row on mobile ──────────────── */
@media (max-width: 600px) {
    .products-grid, .products-grid--shop { grid-template-columns: 1fr !important; gap: 1rem; }
    .product-card-body { padding: 1rem 1.1rem 1.15rem; }
    .product-name { font-size: 1rem !important; }
    .price-current { font-size: 1.2rem !important; }
    .product-card-footer { flex-direction: row; }
    .product-card-footer .btn { font-size: .85rem !important; padding: .65rem .75rem !important; }
}

/* ── Full-width listing (category / shop) with infinite scroll ─ */
.shop-layout.is-full { display: block; }
.products-grid--full { grid-template-columns: repeat(4, minmax(0,1fr)); }
@media (max-width: 1200px) { .products-grid--full { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 900px)  { .products-grid--full { grid-template-columns: repeat(2, minmax(0,1fr)); } }
.infinite-status { display: flex; justify-content: center; align-items: center; gap: .6rem; min-height: 80px; color: var(--gray-500); font-size: .9rem; }
.infinite-status .spinner { width: 22px; height: 22px; border-radius: 50%; border: 2.5px solid rgba(201,141,85,.25); border-top-color: var(--gold); animation: glSpin .8s linear infinite; }
@keyframes glSpin { to { transform: rotate(360deg); } }
.infinite-status[data-state="done"] .spinner, .infinite-status[data-state="idle"] .spinner { display: none; }
.infinite-more { display: none; }
.infinite-status[data-state="error"] .infinite-more { display: inline-flex; }

/* ── Collapsible SEO block (product page) ───────────────────── */
.pd-seo-details { margin-top: 3rem; border: 1px solid var(--border); border-radius: 16px; background: var(--dark-2); overflow: hidden; }
.pd-seo-details > summary {
    list-style: none; cursor: pointer; padding: 1.1rem 1.4rem;
    display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    font-family: var(--font-serif); font-size: 1.3rem; font-weight: 700; color: var(--cream);
}
.pd-seo-details > summary::-webkit-details-marker { display: none; }
.pd-seo-details > summary .pd-seo-toggle { font-family: var(--font-sans); font-size: .82rem; font-weight: 700; color: var(--gold-light); display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap; }
.pd-seo-details > summary .pd-seo-toggle::after { content: "\f078"; font-family: "Font Awesome 6 Free"; font-weight: 900; transition: transform .3s; }
.pd-seo-details[open] > summary .pd-seo-toggle::after { transform: rotate(180deg); }
.pd-seo-details .pd-seo-label-open { display: none; }
.pd-seo-details[open] .pd-seo-label-open { display: inline; }
.pd-seo-details[open] .pd-seo-label-closed { display: none; }
.pd-seo-details .pd-seo-block { margin: 0; border: 0; border-top: 1px solid var(--border); border-radius: 0; }
.pd-seo-details .pd-seo-block::after { display: none; }

/* ── Social / marketplace icons ─────────────────────────────── */
.social-links { display: flex; flex-wrap: wrap; gap: .5rem; }
.social-link { position: relative; }
.social-link img { width: 18px; height: 18px; object-fit: contain; }
.social-link .social-letter { font-weight: 800; font-size: .85rem; }
.top-social { display: inline-flex; gap: .65rem; align-items: center; }
.top-social a { opacity: .85; }
.top-social a:hover { opacity: 1; color: var(--gold-light); }
.top-social img { width: 14px; height: 14px; object-fit: contain; vertical-align: -2px; }

#custom-logo { scroll-margin-top: 100px; }
.nav-link-custom { color: var(--gold-light) !important; }

/* ── Header menu: one line per tab, evenly aligned ────────────── */
@media (min-width: 1200px) {
    .main-nav { display: flex; justify-content: center; min-width: 0; }
    .nav-list { flex-wrap: nowrap; justify-content: center; gap: 0; }
    .nav-list > li { display: flex; align-items: center; }
    .nav-link { white-space: nowrap; height: 44px; line-height: 1; padding: 0 clamp(.45rem, .9vw, .95rem); font-size: clamp(.8rem, .85vw, .92rem); }
    .nav-link i { font-size: .65rem; opacity: .8; }
    .nav-link-custom i.fa-stamp { font-size: .78rem; }
    .header-inner { gap: 1rem; }
    .site-logo-img { height: 64px; }
}
@media (max-width: 1199px) {
    .main-nav.open .nav-link { white-space: nowrap; }
}

/* ── Product card image: fill the square frame, centred, white studio background ── */
.product-card-img { background: #fff !important; }
.product-card-img img { padding: 0 !important; object-fit: contain !important; object-position: center center !important; inset: 0; margin: auto; }
.product-card.ux-tilt .product-card-img img { transform: none; }
.product-card.ux-tilt.is-tilting .product-card-img img, .product-card:hover .product-card-img img { transform: scale(1.04); }

/* ── Category carousel: round medallions + auto-slide ── */
.gl-cat-card { background: transparent; border: 0; padding: .5rem .25rem; flex: 0 0 180px; width: 180px; }
.gl-cat-card:hover { transform: none; }
.gl-cat-img {
    border-radius: 50%; aspect-ratio: 1; width: 100%; max-width: 170px; margin: 0 auto .6rem;
    background: #fff; overflow: hidden;
    box-shadow: 0 0 0 3px var(--dark), 0 0 0 5px rgba(201,141,85,.55), 0 14px 30px -10px rgba(0,0,0,.7);
    transition: transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s;
}
.gl-cat-img img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.gl-cat-card:hover .gl-cat-img { transform: translateY(-6px) scale(1.04); box-shadow: 0 0 0 3px var(--dark), 0 0 0 5px var(--gold-light), 0 20px 40px -12px rgba(0,0,0,.8); }
.gl-cat-card:hover .gl-cat-name { color: var(--gold-light); }
@media (max-width: 767px) { .gl-cat-card { flex: 0 0 120px; width: 120px; } .gl-cat-img { max-width: 110px; } .gl-cat-name { font-size: 1rem; } }
