/**
 * ================================================================
 * FICHIER : cookie_banner.css
 * EMPLACEMENT : _modules/cookie_banner/cookie_banner.css
 * DESCRIPTION : Stylisation réactive et graphique de la bannière de cookies 
 *               utilisant une esthétique "Glassmorphism" adaptée Dark/Bright.
 *
 * SOMMAIRE :
 *   - Positionnement `.cookie-banner`
 *   - Bouton de consentement (Primary : Cyan, Secondary : Outline transparent)
 *   - Responsive : adaptation display flex pour Mobile/Desktop
 *
 * DEPENDANCES :
 *   - Font "Inter"
 *
 * MODIFICATIONS :
 *   - 29/03/2026 02:10 : Ajout de l'en-tête technique — A VALIDER PAR JaxX
 *   - 29/08/2026 02:26 : Migration vers variables de thème pour Bright/Dark Mode — A VALIDER PAR JaxX
 *
 * ================================================================
 */

.cookie-banner
{
    position: fixed;
    bottom: 20px;
    left: 20px;
    right: 20px;
    background: var(--surface_glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid var(--border_subtle);
    border-radius: 16px;
    padding: 1.5rem;
    z-index: 10000;
    box-shadow: var(--box-shadow);
    max-width: 600px;
    margin: 0 auto;
    color: var(--foreground);
    font-family: var(--font-sans);
}

.cookie-banner-content
{
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    text-align: center;
}

.cookie-banner p
{
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--text_secondary);
}

.cookie-banner-actions
{
    display: flex;
    gap: 1rem;
    width: 100%;
    justify-content: center;
}

.btn-cookie
{
    padding: 0.75rem 1.5rem;
    border-radius: 9999px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.25s ease;
    border: none;
    flex: 1;
    max-width: 200px;
}

.btn-deny
{
    background: var(--surface_input);
    border: 1px solid var(--border_subtle);
    color: var(--text_secondary);
}

.btn-deny:hover
{
    background: var(--surface_card_hover);
    color: var(--foreground);
    border-color: var(--cyan-accent);
}

.btn-accept
{
    background: linear-gradient(135deg, var(--mbr-cyan) 0%, var(--cyan-accent) 100%);
    color: white;
    box-shadow: 0 0 15px var(--cyan-glow);
}

.btn-accept:hover
{
    filter: brightness(1.1);
    transform: translateY(-1px);
    box-shadow: 0 0 25px var(--accent_cyan_glow);
}

@media (min-width: 768px)
{
    .cookie-banner-content
    {
        flex-direction: row;
        text-align: left;
    }
    
    .cookie-banner-actions
    {
        width: auto;
    }
}
