/*
 * Fichier : abs-catalogue.css
 * Emplacement : assets/css/
 *
 * Responsabilité :
 * Présente le catalogue des livres audio : commandes de WooCommerce, livre
 * mis en avant, grille des cartes et pagination.
 *
 * Une feuille par domaine :
 *   Chaque règle est portée par le conteneur du catalogue. Les trois domaines
 *   nomment leurs éléments de la même façon, et une règle sans conteneur
 *   s'applique aux trois selon l'ordre de chargement.
 *
 * Couleurs, espacements et rayons :
 *   Toutes les valeurs viennent des variables du thème, avec une valeur de
 *   repli. Le thème redéfinit ses variables pour prefers-contrast: more, et
 *   une seule valeur posée en dur crève ce mécanisme en silence.
 *
 * Nombre de colonnes :
 *   La grille suit la propriété --abs-colonnes, que le panneau pose depuis
 *   les réglages de grille de WooCommerce. Les largeurs réduites ramènent ce
 *   nombre à trois puis à deux, puis à une seule colonne.
 *
 * Barre :
 *   Les onglets de vue portent la classe que ABS_Onglets_Vue leur donne,
 *   commune aux trois domaines : les règles les atteignent par le conteneur
 *   du catalogue.
 *
 * Parties des cartes :
 *   Une partie de carte est du texte, et chacune porte sa classe. La
 *   promotion se distingue par sa surface, jamais par sa seule couleur : son
 *   texte l'annonce.
 */

.abs-catalogue {
    --abs-espace-mince: var(--discovery-space-1, 0.25rem);
    --abs-espace-court: var(--discovery-space-3, 0.75rem);
    --abs-espace: var(--discovery-space-6, 1.5rem);

    --abs-texte-menu: var(--discovery-text-sm, 0.875rem);
    --abs-texte-normal: var(--discovery-text-base, 1rem);
    --abs-texte-grand: var(--discovery-text-xl, 1.25rem);

    --abs-rayon: var(--discovery-radius-md, 0.5rem);
    --abs-ligne-serree: var(--discovery-line-tight, 1.2);
    --abs-graisse-forte: var(--discovery-weight-semibold, 600);

    --abs-colonnes: 3;
    --abs-forme-couverture: 1 / 1;

    --abs-texte: var(--discovery-color-text, #1a1a1a);
    --abs-attenue: var(--discovery-color-muted, #595959);
    --abs-fond: var(--discovery-color-background, #ffffff);
    --abs-surface: var(--discovery-color-surface, #f2f2f2);
    --abs-bordure: var(--discovery-color-border, #767676);
    --abs-lien: var(--discovery-color-link, #0b5cad);
    --abs-accent: var(--discovery-color-accent, #6b3fa0);

    color: var(--abs-texte);
}

/* Entête */

.abs-catalogue .abs-catalogue-entete {
    margin: 0 0 var(--abs-espace);
}

.abs-catalogue .abs-catalogue-titre {
    margin: 0 0 var(--abs-espace-court);
    line-height: var(--abs-ligne-serree);
}

.abs-catalogue .abs-catalogue-description {
    margin: 0;
    color: var(--abs-attenue);
}

/* Commandes de WooCommerce */

.abs-catalogue .abs-catalogue-commandes {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--abs-espace-court);
    margin: 0 0 var(--abs-espace);
    padding: 0 0 var(--abs-espace-court);
    border-bottom: 1px solid var(--abs-bordure);
    font-size: var(--abs-texte-menu);
}

.abs-catalogue .woocommerce-result-count {
    margin: 0;
    color: var(--abs-attenue);
}

/* Barre : onglets de vue et filtres */

.abs-catalogue .abs-catalogue-barre {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--abs-espace-court);
    margin: 0 0 var(--abs-espace);
}

.abs-catalogue .abs-catalogue-onglets {
    display: flex;
    flex-wrap: wrap;
    gap: var(--abs-espace-mince);
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Les onglets portent la classe que ABS_Onglets_Vue leur donne. */
.abs-catalogue .abs-archive-onglet {
    padding: var(--abs-espace-court);
    border: 1px solid var(--abs-bordure);
    border-radius: var(--abs-rayon);
    background-color: var(--abs-fond);
    color: var(--abs-texte);
    font-size: var(--abs-texte-menu);
    cursor: pointer;
}

.abs-catalogue .abs-archive-onglet[aria-selected="true"] {
    border-color: var(--abs-accent);
    background-color: var(--abs-surface);
    font-weight: var(--abs-graisse-forte);
}

.abs-catalogue .abs-catalogue-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--abs-espace-mince);
    margin: 0;
    font-size: var(--abs-texte-menu);
}

.abs-catalogue .abs-catalogue-label {
    display: block;
    width: 100%;
    color: var(--abs-attenue);
}

/* Collections en dossiers */

.abs-catalogue .abs-catalogue-dossiers {
    display: grid;
    grid-template-columns: repeat(var(--abs-colonnes), minmax(0, 1fr));
    gap: var(--abs-espace);
    margin: 0 0 var(--abs-espace);
    padding: 0;
    list-style: none;
}

.abs-catalogue .abs-dossier-lien {
    display: block;
    text-decoration: none;
    color: var(--abs-texte);
}

.abs-catalogue .abs-dossier-onglet {
    display: block;
    width: 40%;
    height: var(--abs-espace-court);
    border: 1px solid var(--abs-bordure);
    border-bottom: 0;
    border-radius: var(--abs-rayon) var(--abs-rayon) 0 0;
    background-color: var(--abs-surface);
}

.abs-catalogue .abs-dossier-corps {
    display: block;
    padding: var(--abs-espace-court);
    border: 1px solid var(--abs-bordure);
    border-radius: 0 var(--abs-rayon) var(--abs-rayon) var(--abs-rayon);
    background-color: var(--abs-fond);
}

.abs-catalogue .abs-dossier-nom {
    display: block;
    font-weight: var(--abs-graisse-forte);
    color: var(--abs-lien);
}

.abs-catalogue .abs-dossier-lien:hover .abs-dossier-nom,
.abs-catalogue .abs-dossier-lien:focus-visible .abs-dossier-nom {
    text-decoration: underline;
}

.abs-catalogue .abs-dossier-compte {
    display: block;
    font-size: var(--abs-texte-menu);
    color: var(--abs-attenue);
}

/* Livre mis en avant */

.abs-catalogue .abs-catalogue-avant {
    margin: 0 0 var(--abs-espace);
    padding: var(--abs-espace-court);
    border: 1px solid var(--abs-bordure);
    border-radius: var(--abs-rayon);
    background-color: var(--abs-surface);
}

.abs-catalogue .abs-avant-surtitre {
    margin: 0 0 var(--abs-espace-court);
    font-size: var(--abs-texte-menu);
    font-weight: var(--abs-graisse-forte);
    text-transform: uppercase;
    color: var(--abs-attenue);
}

.abs-catalogue .abs-avant-corps {
    display: flex;
    flex-wrap: wrap;
    gap: var(--abs-espace);
}

.abs-catalogue .abs-avant-image {
    flex: 0 0 12rem;
    max-width: 100%;
}

.abs-catalogue .abs-avant-couverture {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: var(--abs-forme-couverture);
    object-fit: cover;
    border-radius: var(--abs-rayon);
}

.abs-catalogue .abs-avant-texte {
    flex: 1 1 16rem;
}

.abs-catalogue .abs-avant-titre {
    margin: 0 0 var(--abs-espace-court);
    font-size: var(--abs-texte-grand);
    line-height: var(--abs-ligne-serree);
}

.abs-catalogue .abs-avant-commerce {
    display: flex;
    flex-wrap: wrap;
    gap: var(--abs-espace-court);
    margin: 0 0 var(--abs-espace-court);
}

.abs-catalogue .abs-avant-prix {
    font-weight: var(--abs-graisse-forte);
}

.abs-catalogue .abs-avant-notation {
    color: var(--abs-attenue);
}

.abs-catalogue .abs-avant-personnes {
    margin: 0 0 var(--abs-espace-court);
    padding: 0;
    list-style: none;
}

.abs-catalogue .abs-avant-role {
    margin: 0 0 var(--abs-espace-mince);
    font-size: var(--abs-texte-menu);
}

.abs-catalogue .abs-avant-role-libelle {
    color: var(--abs-attenue);
}

.abs-catalogue .abs-avant-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--abs-espace-court);
    margin: 0;
}

/* Grille des livres */

.abs-catalogue .abs-catalogue-grille {
    display: grid;
    grid-template-columns: repeat(var(--abs-colonnes), minmax(0, 1fr));
    gap: var(--abs-espace);
    margin: 0 0 var(--abs-espace);
    padding: 0;
    list-style: none;
}

.abs-catalogue .abs-carte {
    display: flex;
}

.abs-catalogue .abs-carte-lien {
    display: flex;
    flex-direction: column;
    gap: var(--abs-espace-court);
    width: 100%;
    padding: var(--abs-espace-court);
    border: 1px solid var(--abs-bordure);
    border-radius: var(--abs-rayon);
    background-color: var(--abs-fond);
    text-decoration: none;
    color: var(--abs-texte);
}

.abs-catalogue .abs-carte-lien:hover .abs-carte-titre,
.abs-catalogue .abs-carte-lien:focus-visible .abs-carte-titre {
    text-decoration: underline;
}

.abs-catalogue .abs-carte-couverture {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: var(--abs-forme-couverture);
    object-fit: cover;
    border-radius: var(--abs-rayon);
}

.abs-catalogue .abs-carte-titre {
    margin: 0;
    font-size: var(--abs-texte-normal);
    line-height: var(--abs-ligne-serree);
    color: var(--abs-lien);
}

.abs-catalogue .abs-carte-parties {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--abs-espace-court);
    font-size: var(--abs-texte-menu);
}

.abs-catalogue .abs-carte-partie-prix {
    font-weight: var(--abs-graisse-forte);
}

.abs-catalogue .abs-carte-partie-notation,
.abs-catalogue .abs-carte-partie-duree {
    color: var(--abs-attenue);
}

.abs-catalogue .abs-carte-partie-promotion {
    padding: var(--abs-espace-mince) var(--abs-espace-court);
    border: 1px solid var(--abs-accent);
    border-radius: var(--abs-rayon);
    color: var(--abs-accent);
    font-weight: var(--abs-graisse-forte);
}

/* Sélection sans résultat */

.abs-catalogue .abs-catalogue-vide {
    margin: 0 0 var(--abs-espace);
    padding: var(--abs-espace-court);
    border: 1px solid var(--abs-bordure);
    border-radius: var(--abs-rayon);
    color: var(--abs-attenue);
}

/* Pagination de WooCommerce */

.abs-catalogue .woocommerce-pagination {
    margin: 0 0 var(--abs-espace);
    font-size: var(--abs-texte-menu);
}

.abs-catalogue .woocommerce-pagination ul {
    display: flex;
    flex-wrap: wrap;
    gap: var(--abs-espace-mince);
    margin: 0;
    padding: 0;
    list-style: none;
}

.abs-catalogue .woocommerce-pagination a,
.abs-catalogue .woocommerce-pagination span {
    display: inline-block;
    padding: var(--abs-espace-mince) var(--abs-espace-court);
    border: 1px solid var(--abs-bordure);
    border-radius: var(--abs-rayon);
}

/* Largeurs réduites */

@media (max-width: 1024px) {

    .abs-catalogue .abs-catalogue-grille,
    .abs-catalogue .abs-catalogue-dossiers {
        grid-template-columns: repeat(min(var(--abs-colonnes), 3), minmax(0, 1fr));
    }
}

@media (max-width: 768px) {

    .abs-catalogue .abs-catalogue-grille,
    .abs-catalogue .abs-catalogue-dossiers {
        grid-template-columns: repeat(min(var(--abs-colonnes), 2), minmax(0, 1fr));
    }

    .abs-catalogue .abs-catalogue-commandes {
        flex-direction: column;
        align-items: stretch;
    }
}

@media (max-width: 480px) {

    .abs-catalogue .abs-catalogue-grille,
    .abs-catalogue .abs-catalogue-dossiers {
        grid-template-columns: minmax(0, 1fr);
    }

    .abs-catalogue .abs-avant-image {
        flex-basis: 100%;
    }
}