/* ============================================================
   Catalogue — styles spécifiques
   ============================================================ */

/* Hero catalogue */
.cat-hero {
    padding: 7rem 0 3rem;
    position: relative;
    background: url('../images/catalogue.jpg') center/cover no-repeat;
    border-bottom: 1px solid var(--bordure);
    isolation: isolate;
}
.cat-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(27,74,138,.82) 0%, rgba(27,74,138,.55) 100%);
    z-index: -1;
}
.cat-hero .sec-label,
.cat-hero .sec-title,
.cat-hero .sec-subtitle {
    color: #fff;
}
.cat-hero .sec-title em { color: var(--orange-light, #f0a070); }
.cat-hero .cat-breadcrumb,
.cat-hero .cat-breadcrumb a { color: rgba(255,255,255,.75); }
.cat-hero .cat-breadcrumb a:hover { color: #fff; }
.cat-breadcrumb {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; color: var(--gris-medium);
    margin-bottom: 1.5rem;
}
.cat-breadcrumb a:hover { color: var(--bleu); }
.cat-breadcrumb span[aria-hidden] { color: var(--bordure); }

/* Filtres */
.cat-filters {
    display: flex; flex-direction: column; gap: 1.25rem;
    margin-bottom: 2.5rem;
    padding: 1.5rem;
    background: var(--blanc);
    border: 1px solid var(--bordure);
    border-radius: var(--radius-lg);
}
.cat-tabs  { display: flex; gap: .6rem; flex-wrap: wrap; }
.cat-cats  { display: flex; gap: .5rem; flex-wrap: wrap; }

.tab-count {
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,.25);
    min-width: 20px; height: 18px;
    border-radius: 9px; font-size: .7rem; font-weight: var(--fw-bold);
    padding: 0 5px; margin-left: .25rem;
}
.tab-btn:not(.active) .tab-count {
    background: var(--bleu-soft); color: var(--bleu);
}

.cat-chip {
    display: inline-flex; align-items: center; gap: .35rem;
    padding: .4rem 1rem;
    border-radius: var(--radius-pill);
    font-size: .82rem; font-weight: var(--fw-semi);
    color: var(--gris-medium);
    background: var(--gris-clair);
    border: 1.5px solid var(--bordure);
    transition: .2s; text-decoration: none;
}
.cat-chip:hover { color: var(--bleu); border-color: var(--bleu-border); background: var(--bleu-soft); }
.cat-chip.active {
    color: var(--bleu); background: var(--bleu-soft);
    border-color: var(--bleu); font-weight: var(--fw-bold);
}

/* Grille catalogue */
.cat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1.5rem;
}

/* Carte produit full */
.produit-card-full {
    background: var(--blanc);
    border: 1px solid var(--bordure);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex; flex-direction: column;
    transition: box-shadow .25s, transform .25s, border-color .25s;
}
.produit-card-full:hover {
    box-shadow: var(--shadow);
    transform: translateY(-3px);
    border-color: var(--bleu-border);
}

/* Image */
.pcf-img {
    width: 100%; height: 200px;
    overflow: hidden; background: var(--gris-clair);
}
.pcf-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.produit-card-full:hover .pcf-img img { transform: scale(1.04); }
.pcf-img--placeholder {
    display: flex; align-items: center; justify-content: center;
    font-size: 3.5rem; color: var(--bleu-border);
}

/* Corps */
.pcf-body {
    padding: 1.5rem;
    display: flex; flex-direction: column; gap: .75rem;
    flex: 1;
}
.pcf-header {
    display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
}
.pcf-titre {
    font-size: 1.05rem; font-weight: var(--fw-bold);
    color: var(--noir); line-height: 1.3;
    margin: 0;
}

/* Tags occasion */
.occasion-cat {
    background: var(--orange-soft) !important;
    color: var(--orange) !important;
    border-color: #F0C9A8 !important;
}
.occasion-prix { color: var(--orange) !important; }

/* Stock badges */
.stock-badge {
    font-size: .68rem; font-weight: var(--fw-bold);
    padding: .15rem .55rem; border-radius: var(--radius-pill);
    text-transform: uppercase; letter-spacing: .06em;
}
.stock-badge.warning { background: #FEF9EC; color: #92400E; border: 1px solid #F5D67B; }
.stock-badge.danger  { background: #FEF2F2; color: #DC2626; border: 1px solid #FECACA; }

/* Footer carte */
.pcf-footer {
    display: flex; align-items: center; justify-content: space-between;
    gap: .5rem; margin-top: auto; padding-top: .75rem;
    border-top: 1px solid var(--bordure);
}

/* Vide */
.cat-empty {
    text-align: center;
    padding: 4rem 2rem;
    color: var(--gris-medium);
    display: flex; flex-direction: column; align-items: center; gap: 1rem;
}
.cat-empty p { font-size: 1rem; }

/* Carousel produit (mini, dans la carte) */
.prod-carousel .carousel-track {
    aspect-ratio: unset;
    height: 200px;
}
.prod-carousel .carousel-slide img {
    width: 100%; height: 100%; object-fit: cover;
}
.prod-carousel .carousel-btn {
    width: 28px; height: 28px; font-size: 1rem;
    opacity: 0;
    transition: opacity .2s;
}
.prod-carousel:hover .carousel-btn { opacity: .85; }
.prod-carousel .carousel-btn--prev { left: .4rem; }
.prod-carousel .carousel-btn--next { right: .4rem; }
.prod-carousel .carousel-dots {
    bottom: .4rem;
}
.prod-carousel .carousel-dot {
    width: 6px; height: 6px;
    transition: width .25s;
}
.prod-carousel .carousel-dot.active { width: 14px; }

/* Responsive */
@media (max-width: 768px) {
    .cat-grid { grid-template-columns: 1fr; }
    .cat-hero  { padding: 5rem 0 2rem; }
}