/* =========================================================
   PORTAIL V2 — MISE EN PAGE AUTOMATIQUE
   Version 1.0
   Chargement APRÈS les autres feuilles de style.
   ========================================================= */

:root{
    --auto-site-max: 1880px;
    --auto-gutter: clamp(8px, 1vw, 22px);
    --auto-section-gap: clamp(10px, 1vw, 20px);
    --auto-card-pad: clamp(12px, 1.15vw, 22px);
    --auto-radius: 14px;
}

/* Largeur commune */
body.layout-auto .container,
body.layout-auto .main-container,
body.layout-auto .page-container,
body.layout-auto .content-container,
body.layout-auto .wrapper,
body.layout-auto .site-wrapper,
body.layout-auto .layout-container,
body.layout-auto .admin-container{
    width:min(calc(100vw - (var(--auto-gutter) * 2)), var(--auto-site-max)) !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

body.layout-auto .main-shell,
body.layout-auto .form-shell,
body.layout-auto .dashboard-shell,
body.layout-auto .admin-shell,
body.layout-auto .content-shell{
    width:100% !important;
    max-width:none !important;
}

body.layout-auto .page-wrap,
body.layout-auto .page,
body.layout-auto .main-content{
    padding-left:0 !important;
    padding-right:0 !important;
}

/* Réduction automatique des espacements lorsque la hauteur manque */
body.layout-compact .page-wrap,
body.layout-compact .page{
    padding-top:14px !important;
    padding-bottom:24px !important;
}

body.layout-dense .page-wrap,
body.layout-dense .page{
    padding-top:8px !important;
    padding-bottom:16px !important;
}

body.layout-compact .content,
body.layout-compact .form-body,
body.layout-compact .card-body,
body.layout-compact .panel-body{
    padding:clamp(12px, 1vw, 20px) !important;
}

body.layout-dense .content,
body.layout-dense .form-body,
body.layout-dense .card-body,
body.layout-dense .panel-body{
    padding:10px 12px !important;
}

body.layout-compact .card,
body.layout-compact .panel,
body.layout-compact .widget{
    border-radius:12px !important;
}

body.layout-dense .card,
body.layout-dense .panel,
body.layout-dense .widget{
    border-radius:10px !important;
}

/* En-têtes */
body.layout-compact .topbar-inner,
body.layout-compact .header-inner,
body.layout-compact .site-header-inner{
    min-height:68px !important;
}

body.layout-dense .topbar-inner,
body.layout-dense .header-inner,
body.layout-dense .site-header-inner{
    min-height:58px !important;
}

body.layout-compact .nav a,
body.layout-compact .nav-button,
body.layout-compact .main-nav a,
body.layout-compact .site-nav a{
    min-height:40px !important;
    padding:0 13px !important;
}

body.layout-dense .nav a,
body.layout-dense .nav-button,
body.layout-dense .main-nav a,
body.layout-dense .site-nav a{
    min-height:36px !important;
    padding:0 10px !important;
    font-size:.78rem !important;
}

/* Hero */
body.layout-compact .hero-home,
body.layout-compact .hero-inner{
    min-height:clamp(230px, 29vh, 315px) !important;
}

body.layout-dense .hero-home,
body.layout-dense .hero-inner{
    min-height:clamp(185px, 24vh, 250px) !important;
}

body.layout-compact .hero-card,
body.layout-compact .hero,
body.layout-compact .page-header{
    padding-top:20px !important;
    padding-bottom:20px !important;
}

body.layout-dense .hero-card,
body.layout-dense .hero,
body.layout-dense .page-header{
    padding-top:14px !important;
    padding-bottom:14px !important;
}

body.layout-dense .hero-copy h1,
body.layout-dense .hero-card h1,
body.layout-dense .hero h1{
    font-size:clamp(1.55rem, 2.7vw, 2.3rem) !important;
    margin-bottom:7px !important;
}

body.layout-dense .hero-copy p,
body.layout-dense .hero-card p,
body.layout-dense .hero p{
    margin-top:5px !important;
    font-size:.86rem !important;
}

/* Grilles automatiques */
body.layout-auto .auto-grid,
body.layout-auto .cards-grid,
body.layout-auto .stats-grid,
body.layout-auto .services-grid,
body.layout-auto .homepage{
    gap:var(--auto-section-gap) !important;
}

body.layout-wide .cards-grid.auto-responsive-grid,
body.layout-wide .auto-responsive-grid.cards-grid{
    grid-template-columns:repeat(var(--auto-columns, 3), minmax(0, 1fr)) !important;
}

body.layout-compact .stats-grid .stat-card{
    padding:13px 15px !important;
}

body.layout-dense .stats-grid .stat-card{
    padding:10px 12px !important;
}

body.layout-dense .stat-card strong{
    margin-top:4px !important;
    font-size:1.35rem !important;
}

/* Tableaux */
body.layout-auto .table-scroll{
    max-width:100%;
}

body.layout-dense table{
    font-size:.88rem;
}

body.layout-dense thead th{
    padding:9px 8px !important;
}

body.layout-dense tbody td{
    padding:9px 8px !important;
}

/* Page d'accueil principale */
body.page-home.layout-compact .homepage{
    margin-top:12px !important;
    margin-bottom:15px !important;
}

body.page-home.layout-dense .homepage{
    margin-top:8px !important;
    margin-bottom:10px !important;
}

body.page-home.layout-wide .homepage{
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
}

body.page-home.layout-compact .homepage > .panel{
    padding:14px !important;
}

body.page-home.layout-dense .homepage > .panel{
    padding:10px !important;
}

body.page-home.layout-wide .signalements-callout{
    grid-column:1 / 2 !important;
}

body.page-home.layout-wide .portal-services{
    grid-column:2 / 5 !important;
}

body.page-home.layout-compact .signalements-callout,
body.page-home.layout-compact .portal-services{
    min-height:0 !important;
}

body.page-home.layout-dense .signalements-callout{
    padding:14px !important;
}

body.page-home.layout-dense .portal-services{
    padding:10px !important;
}

body.page-home.layout-dense .services-grid{
    gap:7px !important;
}

body.page-home.layout-dense .service-card{
    padding:8px 9px !important;
}

/* Signalements : index */
body.page-signalements-index.layout-wide .cards-grid{
    grid-template-columns:repeat(var(--auto-columns, 3), minmax(0,1fr)) !important;
}

body.page-signalements-index.layout-compact .hero-card{
    padding:18px 22px !important;
}

body.page-signalements-index.layout-dense .hero-card{
    padding:13px 17px !important;
}

body.page-signalements-index.layout-compact .contest-card-top{
    padding:13px 14px 10px !important;
}

body.page-signalements-index.layout-dense .contest-card-top{
    padding:10px 11px 8px !important;
}

body.page-signalements-index.layout-dense .contest-card-bottom{
    padding:9px 11px 11px !important;
}

/* Signalements : classement + carte */
body.page-signalements-classement .ranking-map-layout{
    grid-template-columns:minmax(0, 2.15fr) minmax(330px, .85fr) !important;
    gap:clamp(10px, .9vw, 18px) !important;
}

body.page-signalements-classement.layout-compact #embedded-map{
    height:min(58vh, 560px) !important;
}

body.page-signalements-classement.layout-dense #embedded-map{
    height:min(50vh, 480px) !important;
}

/* Administration */
body.page-admin.layout-wide .admin-layout{
    grid-template-columns:minmax(210px, 260px) minmax(0,1fr) !important;
}

body.page-admin.layout-compact .admin-sidebar{
    padding:14px !important;
}

body.page-admin.layout-dense .admin-sidebar{
    padding:10px !important;
}

/* Responsive */
@media(max-width:1100px){
    body.page-signalements-classement .ranking-map-layout{
        grid-template-columns:1fr !important;
    }

    body.layout-auto .homepage,
    body.layout-auto .cards-grid{
        grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    }

    body.page-home.layout-auto .signalements-callout,
    body.page-home.layout-auto .portal-services{
        grid-column:1 / -1 !important;
    }
}

@media(max-width:760px){
    :root{
        --auto-gutter:8px;
    }

    body.layout-auto .homepage,
    body.layout-auto .cards-grid,
    body.layout-auto .stats-grid,
    body.layout-auto .services-grid,
    body.layout-auto .form-grid{
        grid-template-columns:1fr !important;
    }

    body.layout-auto .nav a,
    body.layout-auto .nav-button,
    body.layout-auto .main-nav a,
    body.layout-auto .site-nav a{
        min-width:100%;
    }
}