/* alphakawa.com — styles globaux */

@font-face {
    font-family: 'Doctor-glitch';
    src: url('/assets/fonts/doctor-glitch.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* ─── Palette cuir & lumière rouge ─── */
:root {
    /* Bootstrap 5 variable overrides */
    --bs-body-bg:           #0d0808;
    --bs-body-color:        #ede0d4;
    --bs-card-bg:           #1a0f0f;
    --bs-link-color:        #c41e1e;
    --bs-link-hover-color:  #9e1717;
    --bs-border-color:      #2e1515;
    --bs-dark-rgb:          8, 5, 5;
    --bs-danger-rgb:        196, 30, 30;
    --bs-secondary-rgb:     107, 31, 31;

}

/* ─── Base ─── */
body {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    background-color: #0d0808;
    color: #ede0d4;
}

a { color: #c41e1e; }
a:hover { color: #9e1717; }

.brand-name {
    font-family: 'Doctor-glitch', sans-serif;
    letter-spacing: 0.03em;
    color: #c41e1e;
}

/* ─── Navbar ─── */
.navbar {
    background-color: #080505 !important;
    border-bottom: 1px solid #2e1515;
}

.navbar-brand {
    letter-spacing: 0.05em;
    font-size: 1.4rem;
}

/* ─── Footer ─── */
footer {
    background-color: #080505 !important;
    border-top: 1px solid #2e1515 !important;
}

/* ─── Buttons ─── */
/* #ac1818 sur blanc = 7.24:1 → passe WCAG AAA */
.btn-dark {
    background-color: #ac1818 !important;
    border-color: #ac1818 !important;
    color: #fff !important;
}
.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active {
    background-color: #8e1414 !important;
    border-color: #8e1414 !important;
}

.btn-outline-dark {
    color: #c41e1e !important;
    border-color: #c41e1e !important;
}
.btn-outline-dark:hover,
.btn-outline-dark:focus,
.btn-outline-dark:active {
    background-color: #ac1818 !important;
    color: #fff !important;
    border-color: #ac1818 !important;
}

/* ─── Cards ─── */
.card {
    border-radius: 0.5rem;
    background-color: #1a0f0f;
    border-color: #2e1515;
}

.card:hover {
    transform: translateY(-2px);
    transition: transform 0.2s ease;
    box-shadow: 0 4px 16px rgba(196, 30, 30, 0.2) !important;
}

/* ─── Text ─── */
.text-muted {
    color: #9e7e72 !important;
}

.text-dark {
    color: #c41e1e !important;
}

/* ─── Hero circle ─── */
.hero-circle {
    background-color: #1a0f0f;
    border: 2px solid #c41e1e;
}
/* #fff sur #1a0f0f = 19:1 → passe WCAG AAA */
.hero-circle .brand-name {
    color: #fff;
}

/* ─── Badge panier ─── */
#cart-count:empty {
    display: none;
}

/* ─── Dividers ─── */
hr {
    border-color: #2e1515;
    opacity: 1;
}

/* ─── Forms ─── */
.form-control,
.form-select {
    background-color: #1a0f0f;
    border-color: #2e1515;
    color: #ede0d4;
}
.form-control:focus,
.form-select:focus {
    background-color: #1a0f0f;
    border-color: #c41e1e;
    color: #ede0d4;
    box-shadow: 0 0 0 0.25rem rgba(196, 30, 30, 0.25);
}
.form-control::placeholder {
    color: #9e7e72;
}
.form-label {
    color: #ede0d4;
}

/* ─── Dropdowns ─── */
.dropdown-menu {
    background-color: #1a0f0f;
    border-color: #2e1515;
}
.dropdown-item {
    color: #ede0d4;
}
.dropdown-item:hover,
.dropdown-item:focus {
    background-color: #2e1515;
    color: #ede0d4;
}
.dropdown-divider {
    border-color: #2e1515;
}
.dropdown-header {
    color: #9e7e72;
}

/* ─── Page content (CMS) ─── */
.page-content h2 {
    margin-top: 1.5rem;
}

/* ─── Badge Supporter (jaune → rouge) ─── */
/* #ac1818 sur blanc = 7.24:1 → passe WCAG AAA */
.badge.bg-warning,
.badge.bg-danger {
    background-color: #ac1818 !important;
    color: #fff !important;
}
.card-header.bg-warning {
    background-color: #8e1414 !important;
    color: #fff !important;
}

/* ─── btn-warning / border-warning / text-warning → rouge ─── */
.btn-warning {
    background-color: #8e1414 !important;
    border-color: #8e1414 !important;
    color: #fff !important;
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    background-color: #6e1010 !important;
    border-color: #6e1010 !important;
    color: #fff !important;
}
.border-warning {
    border-color: #8e1414 !important;
}
.text-warning {
    color: #8e1414 !important;
}

/* ─── Nav tabs ─── */
.nav-tabs {
    border-bottom-color: #2e1515;
}
.nav-tabs .nav-link {
    color: #9e7e72;
    border-color: transparent;
}
.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {
    color: #ede0d4;
    border-color: #2e1515 #2e1515 transparent;
}
.nav-tabs .nav-link.active {
    background-color: #1a0f0f;
    border-color: #2e1515 #2e1515 #1a0f0f;
    color: #c41e1e;
}

/* ─── Tables ─── */
.table {
    --bs-table-color: #ede0d4;
    --bs-table-bg: transparent;
    --bs-table-border-color: #2e1515;
    --bs-table-striped-color: #ede0d4;
    --bs-table-striped-bg: #120909;
    --bs-table-hover-color: #ede0d4;
    --bs-table-hover-bg: #1f1010;
}
.table-dark,
.table-light {
    --bs-table-color: #ede0d4;
    --bs-table-bg: #1a0f0f;
    --bs-table-border-color: #2e1515;
    --bs-table-striped-color: #ede0d4;
    --bs-table-striped-bg: #150d0d;
    --bs-table-hover-color: #ede0d4;
    --bs-table-hover-bg: #241212;
}

/* ─── bg-light → surface sombre ─── */
.bg-light {
    background-color: #1a0f0f !important;
    color: #9e7e72 !important;
}

/* ─── Accordion ─── */
/* Bootstrap redéfinit ses vars sur .accordion — on doit les surcharger là */
.accordion {
    --bs-accordion-bg:                   #1a0f0f;
    --bs-accordion-border-color:         #2e1515;
    --bs-accordion-btn-color:            #ede0d4;
    --bs-accordion-btn-bg:               #1a0f0f;
    --bs-accordion-active-color:         #c41e1e;
    --bs-accordion-active-bg:            #221212;
    --bs-accordion-body-bg:              #120808;
    --bs-accordion-btn-focus-border-color: #c41e1e;
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(196,30,30,0.25);
    --bs-accordion-btn-icon:        url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ede0d4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23c41e1e'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
/* Forcer l'état ouvert — Bootstrap applique du bleu en dur via var() */
.accordion-button:not(.collapsed) {
    background-color: #221212 !important;
    color: #c41e1e !important;
    box-shadow: inset 0 -1px 0 #2e1515;
}
.accordion-body {
    background-color: #120808;
    border-top: 1px solid #2e1515;
}

/* ─── Nav pills ─── */
.nav-pills .nav-link {
    color: #9e7e72;
}
.nav-pills .nav-link:hover,
.nav-pills .nav-link:focus {
    color: #ede0d4;
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background-color: #ac1818 !important;
    color: #fff !important;
}

/* ─── Pagination ─── */
.pagination .page-link {
    background-color: #1a0f0f;
    border-color: #2e1515;
    color: #c41e1e;
}
.pagination .page-link:hover,
.pagination .page-link:focus {
    background-color: #2e1515;
    border-color: #2e1515;
    color: #ede0d4;
}
.pagination .page-item.active .page-link {
    background-color: #ac1818 !important;
    border-color: #ac1818 !important;
    color: #fff !important;
}
.pagination .page-item.disabled .page-link {
    background-color: #120909;
    border-color: #2e1515;
    color: #9e7e72;
}

/* ─── Admin overrides ─── */
.small-box .icon {
    font-size: 4rem;
}

/* ── Age gate ─────────────────────────────────────────────────────────── */
#age-gate {
    position: fixed; inset: 0; z-index: 9999;
    display: flex; align-items: center; justify-content: center;
    background: rgba(8,5,5,0.97);
    padding: 1rem;
}
#age-gate .age-card {
    background: #1a0f0f;
    border: 1px solid #2e1515;
    border-radius: 4px;
    max-width: 540px; width: 100%;
    padding: 2.5rem 2rem;
    text-align: center;
}
#age-gate .age-brand {
    font-family: 'Doctor-glitch', sans-serif;
    color: #c41e1e;
    font-size: 2.2rem;
    letter-spacing: .05em;
    margin-bottom: .25rem;
}
#age-gate .age-separator {
    color: #9e7e72;
    font-style: italic;
    font-size: .85rem;
    margin-bottom: 1.5rem;
}
#age-gate .age-body {
    color: #ede0d4;
    font-size: .95rem;
    line-height: 1.7;
    margin-bottom: 1rem;
}
#age-gate .age-legal {
    color: #9e7e72;
    font-size: .78rem;
    line-height: 1.5;
    margin-bottom: 1.75rem;
}
#age-gate .age-actions {
    display: flex;
    gap: .75rem;
    justify-content: center;
    flex-wrap: wrap;
}
#age-gate .btn-age-enter {
    background: #ac1818; color: #fff;
    border: 1px solid #ac1818;
    padding: .6rem 2rem;
    border-radius: 3px;
    font-size: .95rem;
    cursor: pointer;
    transition: background .2s;
}
#age-gate .btn-age-enter:hover { background: #8e1414; border-color: #8e1414; }
#age-gate .btn-age-leave {
    background: transparent;
    color: #9e7e72;
    border: 1px solid #2e1515;
    padding: .6rem 1.5rem;
    border-radius: 3px;
    font-size: .9rem;
    cursor: pointer;
    transition: color .2s, border-color .2s;
}
#age-gate .btn-age-leave:hover { color: #ede0d4; border-color: #9e7e72; }
#age-gate .age-footer-link {
    display: block; margin-top: 1.5rem;
    color: #2e1515; font-size: .72rem;
    text-decoration: none;
    transition: color .2s;
}
#age-gate .age-footer-link:hover { color: #9e7e72; }
