/*
    ==========================================================
    PROJECT : SITE-GENERIQUE
    FILE    : css/sidebar-content.css
    AUTH    : Renaud
    CREATED : 22 décembre 2025
    UPDATED : 24 mars 2026
    ==========================================================
*/

/**
*   @project        SITE-GENERIQUE
*   @description    Layout de la colonne latérale (Sidebar).
*                   Gère l'empilement des widgets et l'effet "enfoncé" (recessed).
*   
*   @file           css/sidebar-content.css
*
*   @see            css/colors-semantic.css
*   @see            css/body-grid-layout.css
*   @see            includes/sidebar-widget-*.php
*
*   @note           Desktop  : Colonne fixe 350px (défini dans body-grid-layout)
*                   Tablette : Pleine largeur sous le main
*                   Mobile   : Pleine largeur, padding réduit
*/


/* --- BLOCK : Sidebar Content --- */
.sidebar-content {
    /* PLACEMENT */
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding: 1.5rem;
    /* VISUEL : Effet "Enfoncé" (Recessed) */
    background-color: var(--color-background-sidebar, #E9E9E9);
    border-radius: 15px;
    border: 1px solid rgba(0, 0, 0, 0.02);
    box-shadow: 
        inset 0 4px 10px rgba(0, 0, 0, 0.05),
        inset 0 1px 3px rgba(0, 0, 0, 0.1);
}


/* --- RESPONSIVE (Tablette < 1150px) --- */
@media (max-width: 1150px) {
    .sidebar-content {
        /* PLACEMENT */
        max-width: 350px;
        margin-left: auto;
        margin-right: auto;
        gap: 1.5rem;
        padding: 1.25rem;
        margin-top: 2rem;
        /* VISUEL */
        border-radius: 12px;
        box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.05);
    }
}


/* --- RESPONSIVE (Mobile < 768px) --- */
@media (max-width: 768px) {
    .sidebar-content {
        /* PLACEMENT */
        gap: 1.25rem;
        padding: 1rem;
        margin-top: 1.5rem;
        /* VISUEL */
        border-radius: 8px;
    }
}


/* 
   ==========================================================================
   DEBUG (À retirer en production ou commenter)
   ========================================================================== 
*/
/*
.sidebar-content { border: 2px dashed greenyellow; }
*/