/* ================================================
   BlueMap - Thème Personnalisé
   Couleurs basées sur le logo (rose & prune)
   ================================================ */

/* --- Palette de couleurs ---
   Rose clair    : #f4b8cc
   Rose moyen    : #c4728a
   Rose foncé    : #8a3a54
   Fond prune    : #1a0a1e
   Fond prune 2  : #2a1030
   Fond prune 3  : #3a1842
*/

/* ── Fond général de la sidebar ── */
.side-menu {
  background-color: #1a0a1e !important;
  border-right: 1px solid #3a1842 !important;
}

/* ── Fond du panneau latéral ouvert ── */
.side-menu .menu-content,
.side-menu .content {
  background-color: #1a0a1e !important;
}

/* ── Boutons de la toolbar (zoom, vue, etc.) ── */
.toolbar-button,
button.toolbar-button {
  background-color: #2a1030 !important;
  color: #f4b8cc !important;
  border: 1px solid #3a1842 !important;
  transition: all 0.2s ease !important;
}

.toolbar-button:hover,
button.toolbar-button:hover {
  background-color: #c4728a !important;
  color: #fff !important;
  border-color: #c4728a !important;
}

/* ── Boutons icônes (hamburger, carte, etc.) ── */
.side-menu button,
.menu button {
  background-color: #2a1030 !important;
  color: #f4b8cc !important;
  border-color: #3a1842 !important;
}

.side-menu button:hover,
.menu button:hover {
  background-color: #c4728a !important;
  color: #ffffff !important;
}

/* ── Titres et textes dans la sidebar ── */
.side-menu h1,
.side-menu h2,
.side-menu h3,
.side-menu label,
.side-menu .map-list-entry .map-name {
  color: #f4b8cc !important;
}

.side-menu p,
.side-menu span,
.side-menu .menu-content span {
  color: #e0a0bc !important;
}

/* ── Entrée de carte dans la liste (sélection de map) ── */
.map-list-entry {
  background-color: #2a1030 !important;
  border-bottom: 1px solid #3a1842 !important;
  color: #f4b8cc !important;
}

.map-list-entry:hover,
.map-list-entry.selected {
  background-color: #8a3a54 !important;
  color: #ffffff !important;
}

/* ── Checkbox et toggles ── */
input[type="checkbox"] {
  accent-color: #c4728a !important;
}

/* ── Scrollbar personnalisée ── */
.side-menu *::-webkit-scrollbar {
  width: 6px;
}

.side-menu *::-webkit-scrollbar-track {
  background: #1a0a1e;
}

.side-menu *::-webkit-scrollbar-thumb {
  background-color: #8a3a54;
  border-radius: 3px;
}

.side-menu *::-webkit-scrollbar-thumb:hover {
  background-color: #c4728a;
}

/* ── Liens ── */
.side-menu a {
  color: #f4b8cc !important;
}

.side-menu a:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

/* ── Barre de recherche / inputs ── */
.side-menu input[type="text"],
.side-menu input[type="search"] {
  background-color: #2a1030 !important;
  color: #f4b8cc !important;
  border: 1px solid #8a3a54 !important;
  border-radius: 4px !important;
}

.side-menu input[type="text"]:focus,
.side-menu input[type="search"]:focus {
  border-color: #c4728a !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(196, 114, 138, 0.3) !important;
}

/* ── Zone du logo en bas à gauche ── */
#custom-logo-container {
  position: fixed;
  bottom: 16px;
  left: 16px;
  z-index: 9999;
  pointer-events: none;
  opacity: 0.92;
  filter: drop-shadow(0 2px 8px rgba(196, 114, 138, 0.4));
  transition: opacity 0.3s ease, filter 0.3s ease;
}

#custom-logo-container:hover {
  opacity: 1;
  filter: drop-shadow(0 4px 16px rgba(196, 114, 138, 0.7));
  pointer-events: auto;
}

#custom-logo-container img {
  width: 64px;
  height: 64px;
  border-radius: 14px;
}