/* ===== 9-PANNEAU-CONTROLE-BASE.CSS ===== */

/* DÉFAUT (DESKTOP) */
.control-zone,
.navigation-panel {
    background: var(--fond-creme);
    border: var(--bordure-epaisse) solid var(--bordure-principale);
    border-radius: var(--rayon-lg);
    box-shadow: var(--ombre-lg);
    
    /* Dimensions fixes identiques */
    width: 600px;
    height: 240px;
    padding: var(--padding-lg);
    
    position: relative;
    box-sizing: border-box;
    z-index: 10000;
    
    /* Transition smooth pour la hauteur */
    transition: height var(--transition-normale);
}

/* Hauteur réduite quand le panneau enrichment est fermé (mode générateur uniquement) */
.control-zone.panel-collapsed {
    height: 140px;
}

/* TABLETTE (max 1023px) */
@media (max-width: 63.9375rem) {
    .control-zone,
    .navigation-panel {
        width: 500px;
        padding: var(--padding-md);
    }
    
    /* Hauteur réduite en mode collapsed sur tablette */
    .control-zone.panel-collapsed {
        height: 140px;
    }
}

/* MOBILE (max 767px) */
@media (max-width: 47.9375rem) {
    .control-zone,
    .navigation-panel {
        width: 100%;
        height: auto;
        padding: var(--padding-md);
    }
}

@media print {
    .control-zone,
    .navigation-panel {
        display: none;
    }
}