/* ===== Mobile spécifique ===== */


@media (max-width: 600px) {

  /* ---- Réinitialisation globale ---- */
  html, body, #page-frame, #page-frame-inner, .window-content {
    height: auto !important;
    overflow: hidden !important;
  }

  body {
    overflow-x: hidden !important;
    overflow-y: hidden !important;
  }

  .window-content {
    padding: 10px !important;
    display: flex;
    flex-direction: column;
  }

  /* =========================================================
      Radio Player
     ========================================================= */

  #radio-player {
    display: flex;
    flex-direction: row; /* bloc principal vertical */
    align-items: center;
    width: 100%;
    gap: 5px;
    flex-wrap: nowrap;
  }

  /* ---- Ligne principale : Play + Cover + Infos ---- */
  .track-info {
    display: flex;
    flex-direction: row;
    align-items: center;          
    justify-content: flex-start;
    width: 100%;
    gap: 10px;
    flex-wrap: nowrap;
  }

  /* Bouton Play */
  #play-btn {
    width: 60px !important;
    height: 60px !important;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  /* Cover juste à droite du bouton */
  #cover-art {
    width: 56px !important;
    height: 56px !important;
    flex-shrink: 0;
    border: 2px solid #808080;
    border-color: #fff #808080 #808080 #fff;
    background: #c0c0c0;
    object-fit: cover;
  }

  /* Conteneur texte à droite du cover */
  .track-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    min-width: 0;
  }

  /* Titre / Artiste */
  .track-info-line {
    display: flex;
    align-items: center;
    gap: 5px;
    width: 100%;
  }

  .track-info-line .label {
    flex-shrink: 0;
    text-align: right;
    width: 50px;
    font-weight: bold;
  }

  .title-box,
  .artist-box {
    display: block;
    flex-grow: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 12px;
  }

  .playlist-line {
    font-size: 11px;
    color: #929191;
    white-space: nowrap;
  }

  /* =========================================================
     🎛️ Boutons en dessous (Playlist / Timer / Historique)
     ========================================================= */
  #player-controls {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin-top: 10px;
    position: static;
  }

  #open-history-btn,
  #add-btn,
  #time-display {
    flex-shrink: 0;
  }

  /* =========================================================
     🚫 Cacher les boutons secondaires
     ========================================================= */
 #open-planning-btn,
  #open-podcasts-btn,
  #draw-mode-btn,
  #planning-control,
  #chat-display,
  #chat-window,
  #apropos-window,
  #legacy-window {
    display: none !important;
  }

  /* =========================================================
     🪟 Popups
     ========================================================= */
  #history-window {
    top: 35%  !important;          /* plus bas sur l'écran */
    left: 50%;         /* centré horizontalement */
    transform: translateX(-50%); /* seulement horizontal */
  }


}
