/*
 * ESC Laboratoire — CSS structurel des pages boutique (R25.2).
 * Chargé uniquement sur les archives, la fiche, le panier, le tunnel et le
 * compte. Mêmes règles que theme.css : structure seulement.
 */

/* --- Archive ------------------------------------------------------------ */

.esc-shop__layout {
    display: grid;
    gap: calc(var(--esc-gap) * 1.5);
    grid-template-columns: 1fr;
}

.esc-shop__count { color: var(--esc-muted); }

.esc-shop__details { border-left: 3px solid var(--esc-line); padding-inline-start: var(--esc-gap); }

.esc-filters__toggle { inline-size: 100%; }

.esc-filter {
    border-bottom: 1px solid var(--esc-line);
    padding-block: 0.75rem;
}

.esc-filter__title { cursor: pointer; font-weight: 700; }

.esc-filter__list,
.esc-filter ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.esc-filter__form { display: grid; gap: 0.5rem; justify-items: start; }

.esc-filter__label { display: flex; gap: 0.5rem; }

.esc-price-filter__field { display: grid; gap: 0.25rem; margin: 0; }

.esc-ordering { display: grid; gap: 0.25rem; }

.esc-ordering__label { font-weight: 700; }

.esc-pagination ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.esc-pagination a,
.esc-pagination span {
    align-items: center;
    border: 1px solid var(--esc-line);
    display: inline-flex;
    justify-content: center;
    padding-inline: 0.5rem;
    text-decoration: none;
}

.esc-pagination [aria-current="page"] { border-color: currentColor; font-weight: 700; }

/* La colonne est masquée en mobile et révélée par « Filtrer et trier ». */
@media (max-width: 1023px) {
    html:not(.no-js) .esc-shop__aside { display: none; }
    html:not(.no-js) body.esc-filters-open .esc-shop__aside { display: block; }
    .no-js .esc-filters__toggle { display: none; }
}

@media (min-width: 1024px) {
    .esc-shop__layout { grid-template-columns: 17rem 1fr; }
    .esc-shop--no-aside .esc-shop__layout { grid-template-columns: 1fr; }
    .esc-filters__toggle { display: none; }
}

/* --- Fiche produit ------------------------------------------------------ */

.esc-product__layout {
    display: grid;
    gap: calc(var(--esc-gap) * 1.5);
    grid-template-columns: 1fr;
}

.esc-gallery__thumbnails {
    display: grid;
    gap: 0.5rem;
    grid-template-columns: repeat(auto-fill, minmax(4.5rem, 1fr));
    list-style: none;
    margin-block-start: 0.5rem;
    padding: 0;
}

.esc-gallery__thumb a[aria-current="true"] { outline: 2px solid currentColor; outline-offset: 2px; }

.esc-product-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--esc-gap);
    align-items: flex-start;
}

.esc-delivery-banner { color: var(--esc-muted); font-size: 0.875rem; margin-block: 0.5rem 0; }

.esc-stock { font-weight: 700; }

.esc-product__meta { border-top: 1px solid var(--esc-line); margin-block-start: var(--esc-gap); padding-block-start: var(--esc-gap); }

.esc-meta { display: block; font-size: 0.875rem; }

.esc-antidoping { border: 1px solid var(--esc-line); margin-block-start: var(--esc-gap); padding: var(--esc-gap); }

.esc-antidoping h2 { font-size: 1rem; margin-block: 0 0.5rem; }

.esc-quantity { display: grid; gap: 0.25rem; }

.esc-quantity__label { font-weight: 700; }

/* --- Onglets ------------------------------------------------------------ */

.esc-tabs__list {
    border-bottom: 1px solid var(--esc-line);
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.esc-tabs__link { display: inline-block; padding: 0.5rem 0.75rem; text-decoration: none; }

.esc-tabs__link[aria-selected="true"] { border-bottom: 2px solid currentColor; font-weight: 700; }

.esc-tabs__panel { padding-block: var(--esc-gap); }

/* Sans JavaScript, tous les panneaux restent visibles et les ancres marchent. */
.no-js .esc-tabs__panel { display: block; }

html:not(.no-js) .esc-tabs__panel[hidden] { display: none; }

/* --- Mon compte --------------------------------------------------------- */

.esc-account {
    display: grid;
    gap: calc(var(--esc-gap) * 1.5);
    grid-template-columns: 1fr;
}

.esc-account-nav__group + .esc-account-nav__group { margin-block-start: var(--esc-gap); }

.esc-account-nav__title { font-size: 0.875rem; margin-block: 0 0.25rem; text-transform: uppercase; }

.esc-account-nav ul { list-style: none; margin: 0; padding: 0; }

.esc-account-nav [aria-current="page"] { font-weight: 700; }

.esc-account__shortcuts { display: flex; flex-wrap: wrap; gap: var(--esc-gap); list-style: none; margin: 0; padding: 0; }

.esc-login { display: grid; gap: calc(var(--esc-gap) * 1.5); grid-template-columns: 1fr; }

.esc-login__panel { border: 1px solid var(--esc-line); padding: var(--esc-gap); }

@media (min-width: 1024px) {
    .esc-product__layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .esc-account { grid-template-columns: 16rem 1fr; }
    .esc-login--two-columns { grid-template-columns: 1fr 1fr; }
}

/* --- Boutons (structure seulement) -------------------------------------- */

.esc-button,
.button,
button {
    border: 1px solid currentColor;
    background: transparent;
    color: inherit;
    cursor: pointer;
    display: inline-block;
    font: inherit;
    padding: 0.5rem 1rem;
    text-decoration: none;
}

.esc-button--small { padding: 0.25rem 0.5rem; }