/* Solaryo en plein écran (solaryo_carte.php) : carte ou 3D à gauche, panneau à droite.
   La page est une colonne : l'en-tête du site, puis l'application qui prend le reste. */
.solc-page { display: flex; flex-direction: column; height: 100vh; margin: 0; overflow: hidden; background: #1d2230; }
.solc-page > header { flex: none; }

/* Couleurs du site (définies sur .ap ailleurs, classe non reprise ici : elle limite la largeur) */
.solc { --ink: #1d2230; --muted: #5d6475; --line: #e6e4de; --paper: #faf8f4; --dark: #1d2230; }
.solc { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) clamp(360px, 30vw, 480px); margin: 0; padding: 0; border-radius: 0; background: #1d2230; }

.solc-stage { position: relative; min-height: 0; }
.solc .sol-map { position: absolute; inset: 0; min-height: 0; border-radius: 0; }
.solc .api-map-placeholder { min-height: 0; height: 100%; }

/* Vue 3D par-dessus la carte, et bascule carte / 3D posée dessus */
/* Au-dessus des contrôles Leaflet (z-index 1000) */
.sol-3d-plein { position: absolute; inset: 0; z-index: 1100; height: auto; margin: 0; border: 0; border-radius: 0; }
.sol-3d-bar-plein { position: absolute; z-index: 1200; top: 12px; left: 56px; right: 12px; margin: 0; pointer-events: none; }
.sol-3d-bar-plein > * { pointer-events: auto; }
.sol-3d-bar-plein .sol-3d-btn { box-shadow: 0 6px 18px rgba(0, 0, 0, .35); }
.sol-3d-bar-plein small { padding: 4px 10px; color: #e6e9f2; background: rgba(15, 19, 32, .7); border-radius: 999px; }
.sol-3d-plein:not([hidden]) ~ .sol-3d-bar-plein { left: 12px; }

/* Panneau */
.solc-panel { min-width: 0; min-height: 0; overflow-x: hidden; overflow-y: auto; padding: 16px 18px 28px; border-left: 1px solid #2e3550; color: #c9cede; }
.solc-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.solc-head h1 { margin: 0; font-size: 24px; color: #fff; }
.solc-head h1 i { color: #ffa94d; }
.solc-links { font-size: 13px; }
.solc-links a { color: #ffa94d; }
.solc .sol-modes { flex-wrap: wrap; gap: 6px; }
.solc .sol-modes button { font-size: 13px; padding: 6px 11px; }
.solc .sol-mode-help { font-size: 13px; }
/* Champ d'adresse et options (date, années) : sur deux lignes si le panneau est étroit */
.solc .api-prompt { flex-wrap: wrap; row-gap: 6px; }
.solc .api-prompt input[type=text] { flex: 1 1 180px; min-width: 0; }
.solc .api-status { margin: 6px 0 10px; }
/* Colonne unique bornée à la largeur du panneau (sinon le contenu l'élargit) */
.solc .sol-results { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.solc .sol-results > * { min-width: 0; }
.solc .sol-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.solc .sol-card { min-width: 0; padding: 10px 12px; overflow-wrap: anywhere; }
.solc .sol-card strong { font-size: 21px; }
.solc .sol-bilan { padding: 12px 14px; }
.solc .sol-bilan h3, .solc .sol-pans h3 { color: var(--ink); }
.solc .sol-bilan-chart { height: 200px; }
.solc .sol-pans table { font-size: 13px; }
.solc .sol-pans th, .solc .sol-pans td { padding: 5px 6px; }
.solc .sol-legend { font-size: 12px; }
.solc .sol-legend-classes { gap: 6px 10px; }
.solc .sol-pans-wrap { margin: 0 -4px; }

/* Téléphone et tablette étroite : carte en haut, panneau dessous, la page défile */
@media (max-width: 900px) {
  .solc-page { height: auto; overflow: visible; }
  .solc { display: block; }
  .solc-stage { height: 62vh; }
  .solc-panel { border-left: 0; border-top: 1px solid #2e3550; overflow: visible; }
  .sol-3d-bar-plein { left: 12px; }  /* en haut : la légende 3D occupe le bas */
  .sol-3d-bar-plein small { display: none; }
}
/* Menus déroulants de l'en-tête au-dessus de la carte et de la 3D (z-index 1000 à 1200) */
.solc-page > header { z-index: 3000; }