@media (max-width: 640px){ .navbar-links{ display:none } }

.navbar{
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 999;
}

.npm-head {font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";}
.npm-un {font-weight: 800;font-size: 15px;} .npm-ul {font-weight: 400;font-size: 13px;}
.npm-item {font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";font-size: 15px;font-weight: 600;}
.nav-avatar-btn {font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";font-size: 15px;font-weight: 600;}
.nav-search .sbtn {font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";font-size: 13px;font-weight: 600;}
.nav-search input {font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";font-size: 13px;font-weight: 600;}
.navbar .brand{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
  font-weight: 700;
  letter-spacing: .2px;
}

.nsh-clear {font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";font-size: 13px;}

.brand-spinner {
  display:inline-block;
  min-width: 1ch;
  opacity: .9;
  font-weight: 800;
  filter: drop-shadow(0 0 6px rgba(124,58,237,.35));
  transform: translateY(1px);
}

.brand-noise {
    position: absolute;
    display: inline-block;
    margin-left: 130px;
    opacity: .75;
    width: 25px;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: .3px;
    color: var(--accent);
    text-shadow: 0 0 6px rgba(99, 255, 255, .35);
}

@media (prefers-reduced-motion: reduce){
  .brand-spinner, .brand-noise { animation: none !important; }
}
.brand-logo{
  width: 28px;
  height: 28px;
  object-fit: contain;
  border-radius: 6px;
  display: block;
  margin-top: 3px;
}

@media (max-width: 460px) {
  .navbar .brand {
    font-size: 0px;
  }
}

/* === Custom select (theme) — pastilles uniquement === */
.nav-theme{ display:flex; align-items:center; gap:8px; }
.nav-theme label{ font-size:13px; color:#b7bdc6; font-weight:600; }
.nav-theme select#themeSelect{ position:absolute; opacity:0; pointer-events:none; width:0; height:0; } /* caché */

.theme-select{ position:relative; }
.theme-select .ts-trigger{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:999px; cursor:pointer;
  background:#1f2629; color:#fff; border:1px solid var(--nav-border);
}
.theme-select .ts-trigger:hover{ filter:brightness(1.05); }
.theme-select .ts-caret{ font-size:12px; opacity:.8; }

/* pastille affichée dans le trigger (plus grande) */
.theme-select .ts-swatch-big{
  width:14px; height:14px; border-radius:999px; border:1px solid rgba(255,255,255,.25);
}

/* liste */
.theme-select .ts-list{
  position:absolute; top:100%; left:0; min-width:160px;
  background:#0E1113; border:1px solid var(--nav-border);
  border-radius:12px; margin-top:6px; padding:6px;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
  z-index:1001;
}
.theme-select .ts-item{
  display:flex; align-items:center; gap:8px;
  padding:8px 10px; border-radius:10px; cursor:pointer;
  color:#e6eaee; font-weight:600; font-size:13px;
}
.theme-select .ts-item[aria-selected="true"]{ background:#182024; outline:1px solid rgba(255,255,255,.06); }
.theme-select .ts-item:hover, .theme-select .ts-item:focus{ background:#1d2529; }
.theme-select .ts-swatch{
  width:12px; height:12px; border-radius:999px; border:1px solid rgba(255,255,255,.25);
}
.theme-select .ts-item[data-value="#1d9bf0"] .ts-swatch{ background:#1d9bf0; }
.theme-select .ts-item[data-value="#FF6600"] .ts-swatch{ background:#FF6600; }
.theme-select .ts-item[data-value="dark"]    .ts-swatch{ background:#000; }

@media (max-width:480px){ .theme-select .ts-list{ min-width:140px; } }

/* Styles de base pour l'historique */
.nav-search-history {
    /* Style initial pour l'animation de sortie */
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 0.2s ease-out, transform 0.2s ease-out;
    pointer-events: none; /* Désactive les clics quand caché */
}

/* Style quand l'historique est ouvert */
.nav-search-history.is-open {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto; /* Active les clics quand ouvert */
}

/* Squelette de chargement */
.nsh-skeleton {
    background-color: #1f24273d; /* Couleur de base du squelette */
    height: 30px; /* Hauteur d'un item normal */
    margin-bottom: 5px;
    animation: pulse 1.5s infinite ease-in-out; /* Animation 'pulse' */
}

.nsh-skeleton .nsh-term,
.nsh-skeleton .nsh-delete {
    visibility: hidden; /* Cache le contenu réel */
}

/* Squelette: pour simuler la forme du texte/bouton */
.nsh-skeleton .nsh-term::before {
    content: '';
    display: block;
    width: 60%; /* Largeur simulée du texte */
    height: 12px;
    background-color: #e0e0e0;
    border-radius: 2px;
    margin-top: 9px;
}

/* Rendre le bouton de suppression simulé plus petit */
.nsh-skeleton .nsh-delete {
    width: 20px;
    height: 20px;
    background-color: #e0e0e0;
    border-radius: 50%;
    margin-top: 5px;
}

/* Animation de pulse (chargement) */
@keyframes pulse {
    0% { opacity: 0.6; }
    50% { opacity: 1; }
    100% { opacity: 0.6; }
}

/* Transition de fluidité pour le contenu interne pendant le chargement */
.nav-search-history.is-loading .nsh-list {
    transition: opacity 0.15s ease-in-out;
}

/* Mise en évidence du terme filtré */
.nsh-term mark {
    background-color: var(--accent);
    font-weight: bold;
    border-radius: 6px;
    color: inherit;
}

/* Style pour le message "Aucune recherche" */
.nav-search-history .nsh-empty {
    padding: 10px 15px;
    color: #fff;
    font-style: italic;
    text-align: center;
    font-weight: 600;
}