/**
 * APB Categories Grid — Styles
 */
.apb-catgrid { font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.apb-catgrid * { box-sizing: border-box; margin: 0; padding: 0; }

.apb-catgrid__list {
    display: grid;
    grid-template-columns: repeat(var(--apb-cg-cols, 6), 1fr);
    gap: 14px;
    list-style: none;
}

.apb-catgrid__item {
    background: #fff;
    border: 1.5px solid #E2E6EA;
    border-radius: 14px;
    padding: 22px 14px;
    text-align: center;
    cursor: pointer;
    transition: all .3s cubic-bezier(.4,0,.2,1);
    text-decoration: none;
    color: #1A1A2E;
    display: block;
    position: relative;
    overflow: hidden;
}
.apb-catgrid__item::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: #185FA5;
    transform: scaleX(0);
    transition: transform .3s cubic-bezier(.4,0,.2,1);
    transform-origin: center;
}
.apb-catgrid__item:hover::before { transform: scaleX(1); }
.apb-catgrid__item:hover {
    border-color: #185FA5;
    box-shadow: 0 4px 12px rgba(24,95,165,.12);
    transform: translateY(-3px);
}

.apb-catgrid__icon {
    width: 52px; height: 52px;
    background: #EBF3FB;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    margin: 0 auto 12px;
    transition: background .3s, transform .3s;
}
.apb-catgrid__item:hover .apb-catgrid__icon { transform: scale(1.08); }

/* Twemoji SVG — dimensions fixes, pas de filtre grayscale */
.apb-catgrid__icon span img.emoji {
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    transition: filter .3s;
}
/* Hover : légère désaturation pour ressortir sur fond bleu */
.apb-catgrid__item:hover .apb-catgrid__icon span img.emoji {
    filter: brightness(10) saturate(0);
}

.apb-catgrid__name { font-size: 14px; font-weight: 600; margin-bottom: 2px; line-height: 1.3; }
.apb-catgrid__count { font-size: 12px; color: #185FA5; font-weight: 500; }
.apb-catgrid__vide { text-align: center; color: #6B7280; padding: 32px; }

/* Scroll horizontal */
.apb-catgrid--scroll .apb-catgrid__list {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 8px;
    scrollbar-width: none;
}
.apb-catgrid--scroll .apb-catgrid__list::-webkit-scrollbar { display: none; }
.apb-catgrid--scroll .apb-catgrid__item {
    min-width: 150px;
    flex-shrink: 0;
    scroll-snap-align: start;
}

/* Extra list : masquée par défaut via classe CSS (attribut hidden retiré par Bricks) */
.apb-catgrid__extra { margin-top: 14px; }
.apb-catgrid__extra--collapsed { display: none; }

/* Bouton "Voir toutes les catégories" */
.apb-catgrid__toggle {
    display: block;
    margin: 28px auto 0;
    padding: 13px 36px;
    background: transparent;
    border: 2px solid #185FA5;
    border-radius: 50px;
    color: #185FA5;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    letter-spacing: .02em;
    transition: background .22s, color .22s, transform .18s, box-shadow .22s;
    line-height: 1;
}
.apb-catgrid__toggle:hover,
.apb-catgrid__toggle.is-open {
    background: #185FA5;
    color: #fff;
    box-shadow: 0 4px 16px rgba(24,95,165,.22);
    transform: translateY(-2px);
}
.apb-catgrid__toggle.is-open::after { content: ' ↑'; }

/* Responsive */
@media (max-width: 1024px) {
    .apb-catgrid__list { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
    .apb-catgrid__list { grid-template-columns: repeat(2, 1fr); }
    .apb-catgrid__toggle { width: 100%; text-align: center; }
}

/* ── Taille emoji configurable ── */
.apb-catgrid__icon span {
    font-size: var(--apb-cg-emoji-size, 32px);
    line-height: 1;
    display: block;
}

/* ── Fond dark (glassmorphism) ── */
.apb-catgrid--dark .apb-catgrid__item {
    background: var(--color-card-dark-bg, rgba(255,255,255,.06));
    border-color: var(--color-card-dark-border, rgba(255,255,255,.12));
    color: var(--color-card-dark-text, rgba(255,255,255,.92));
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.apb-catgrid--dark .apb-catgrid__item:hover {
    border-color: rgba(255,255,255,.35);
    box-shadow: 0 4px 16px rgba(0,0,0,.25);
}
.apb-catgrid--dark .apb-catgrid__item::before {
    background: var(--color-hero-accent, #E6892A);
}
.apb-catgrid--dark .apb-catgrid__icon {
    background: rgba(255,255,255,.08);
}
.apb-catgrid--dark .apb-catgrid__item:hover .apb-catgrid__icon {
    background: rgba(230,137,42,.20);
}
.apb-catgrid--dark .apb-catgrid__name  { color: var(--color-card-dark-text, rgba(255,255,255,.92)); }
.apb-catgrid--dark .apb-catgrid__count { color: var(--color-hero-link, #7ab8f5); }