/* ===== v1.3.2 — en-tête compact et harmonisé pour la page Globe/Carte ===== */
.map-hero{
  position:relative;
  min-height:auto;
  margin-bottom:8px;
  padding:18px 24px 16px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.58);
  background:
    linear-gradient(90deg,rgba(255,249,252,.92) 0%,rgba(255,249,252,.80) 22%,rgba(255,249,252,.44) 42%,rgba(255,255,255,.10) 72%),
    url('/public/assets/collection-hero-snowglobes.jpg') center 52%/cover no-repeat;
  box-shadow:0 18px 38px rgba(88,44,114,.14);
  overflow:hidden;
}
.map-hero:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(43,20,63,.08));
}
.map-hero .eyebrow,
.map-hero > *{position:relative;z-index:1}
.map-hero .eyebrow{
  margin-bottom:6px;
  color:#9b4f89;
  font-size:.72rem;
  letter-spacing:.16em;
}
.map-hero h1{
  max-width:520px;
  margin:0;
  color:#3d1b55;
  font-size:clamp(1.95rem,3.2vw,3rem);
  line-height:.95;
  text-shadow:0 1px 0 rgba(255,255,255,.98),0 2px 14px rgba(255,255,255,.72),0 12px 28px rgba(70,34,95,.16);
}
.map-hero p{
  max-width:680px;
  margin:.32rem 0 0;
  color:#324b61;
  font-size:.92rem;
  line-height:1.35;
  text-shadow:0 1px 0 rgba(255,255,255,.96),0 2px 10px rgba(255,255,255,.52);
}
.geo-toolbar{
  margin:0 0 10px;
  padding:8px 10px;
  gap:9px;
}
.globe-shell,.map{
  height:calc(100dvh - 225px);
  min-height:500px;
}
@media(max-width:900px){
  .map-hero{
    padding:16px 18px 14px;
    border-radius:20px;
    background:
      linear-gradient(180deg,rgba(255,249,252,.84),rgba(255,249,252,.70)),
      url('/public/assets/collection-hero-snowglobes.jpg') center 52%/cover no-repeat;
  }
  .map-hero h1{max-width:none;font-size:clamp(1.8rem,5.8vw,2.55rem)}
  .map-hero p{max-width:none;font-size:.84rem;line-height:1.32}
  .geo-toolbar{margin-bottom:8px}
  .globe-shell,.map{height:calc(100dvh - 215px);min-height:440px}
}
@media(max-width:700px){
  .map-hero{
    padding:14px 14px 12px;
    border-radius:18px;
  }
  .map-hero .eyebrow{font-size:.62rem;letter-spacing:.13em}
  .map-hero h1{font-size:clamp(1.55rem,8vw,2.15rem)}
  .map-hero p{margin-top:.22rem;font-size:.76rem;line-height:1.28}
  .geo-toolbar{padding:7px 8px;gap:6px}
  .globe-shell,.map{height:calc(100dvh - 195px);min-height:420px}
}


/* ===== v1.3.3 — bandeau de saisie harmonisé avec l’accueil ===== */
.editor-hero{
  position:relative;
  min-height:auto;
  padding:20px 24px 18px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.58);
  background:
    linear-gradient(90deg,rgba(255,249,252,.92) 0%,rgba(255,249,252,.80) 22%,rgba(255,249,252,.44) 42%,rgba(255,255,255,.10) 72%),
    url('/public/assets/collection-hero-snowglobes.jpg') center 52%/cover no-repeat;
  box-shadow:0 18px 38px rgba(88,44,114,.14);
  overflow:hidden;
}
.editor-hero:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(43,20,63,.08));
}
.editor-hero > *{position:relative;z-index:1}
.editor-hero .eyebrow{
  margin-bottom:6px;
  color:#9b4f89;
  font-size:.72rem;
  letter-spacing:.16em;
}
.editor-hero h1{
  max-width:560px;
  margin:0;
  color:#3d1b55;
  font-size:clamp(2rem,4vw,3.45rem);
  line-height:.94;
  text-shadow:0 1px 0 rgba(255,255,255,.98),0 2px 14px rgba(255,255,255,.72),0 12px 28px rgba(70,34,95,.16);
}
.editor-hero p{
  max-width:620px;
  margin:.32rem 0 0;
  color:#324b61;
  font-size:.96rem;
  line-height:1.34;
  text-shadow:0 1px 0 rgba(255,255,255,.96),0 2px 10px rgba(255,255,255,.52);
}
.editor-back{
  display:inline-grid;
  place-items:center;
  width:30px;
  height:30px;
  margin-bottom:8px;
  border-radius:50%;
  color:#7b4da3;
  text-decoration:none;
  font-size:1.35rem;
  font-weight:700;
  background:rgba(255,255,255,.42);
  box-shadow:0 4px 10px rgba(88,44,114,.08);
}
.editor-back:hover{
  background:rgba(255,255,255,.62);
  color:#5f2b83;
}
.editor-flake{
  position:absolute;
  right:18px;
  bottom:16px;
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:50%;
  color:#b45a92;
  font-size:1.15rem;
  background:rgba(255,255,255,.38);
  border:1px solid rgba(255,255,255,.52);
  box-shadow:0 8px 18px rgba(70,36,93,.10);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
@media (max-width:900px){
  .editor-hero{
    padding:18px 18px 16px;
    border-radius:22px;
    background:
      linear-gradient(180deg,rgba(255,249,252,.84),rgba(255,249,252,.70)),
      url('/public/assets/collection-hero-snowglobes.jpg') center 52%/cover no-repeat;
  }
  .editor-hero h1{max-width:none;font-size:clamp(1.85rem,6vw,2.8rem)}
  .editor-hero p{max-width:none;font-size:.84rem;line-height:1.32}
}
@media (max-width:700px){
  .editor-hero{
    padding:16px 14px 14px;
    border-radius:20px;
  }
  .editor-hero .eyebrow{font-size:.62rem;letter-spacing:.13em}
  .editor-hero h1{font-size:clamp(1.7rem,9vw,2.25rem)}
  .editor-hero p{margin-top:.22rem;font-size:.76rem;line-height:1.28}
  .editor-back{width:28px;height:28px;font-size:1.2rem}
  .editor-flake{right:12px;bottom:12px;width:38px;height:38px;font-size:1rem}
}


/* ===== v1.3.4 — dimensions mm/cm ===== */
.dimension-control{
  grid-template-columns:minmax(0,1fr) auto;
}
.dimension-control select{
  min-width:74px;
  height:100%;
  padding:0 28px 0 12px;
  border:0!important;
  border-left:1px solid rgba(226,204,233,.94)!important;
  border-radius:0!important;
  background-color:rgba(255,255,255,.48)!important;
  color:#654779!important;
  font-weight:800;
  box-shadow:none!important;
  cursor:pointer;
}
.dimension-control select:focus{
  outline:0;
  background-color:rgba(255,255,255,.72)!important;
}
@media(max-width:700px){
  .dimension-control select{min-width:68px;padding-left:10px;padding-right:24px}
}


/* ===== v1.3.5 — espacement du bouton de connexion ===== */
.login form .btn-full{
  margin-top:14px;
}
@media(max-width:700px){
  .login form .btn-full{
    margin-top:12px;
  }
}


/* ===== v1.3.6 — accès invité en lecture seule ===== */
.guest-mode-badge{
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:34px;
  padding:7px 10px;
  border:1px solid rgba(226,204,233,.92);
  border-radius:999px;
  background:rgba(255,255,255,.62);
  color:#795889;
  font-size:.70rem;
  font-weight:850;
  white-space:nowrap;
}
.login-role-fieldset{
  min-width:0;
  margin:0 0 14px;
  padding:0;
  border:0;
}
.login-role-fieldset legend{
  margin-bottom:7px;
  color:#694e81;
  font-size:.76rem;
  font-weight:850;
  text-align:left;
}
.login-role-switch{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.login-role-switch label{
  position:relative;
  min-width:0;
  cursor:pointer;
}
.login-role-switch input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.login-role-switch span{
  display:flex;
  min-height:60px;
  flex-direction:column;
  justify-content:center;
  gap:3px;
  padding:9px 11px;
  border:1px solid rgba(226,204,233,.92);
  border-radius:13px;
  background:rgba(255,255,255,.54);
  color:#725786;
  text-align:center;
  transition:border-color .15s ease,background .15s ease,box-shadow .15s ease,transform .15s ease;
}
.login-role-switch span b{
  font-size:.80rem;
}
.login-role-switch span small{
  color:#8d7a9b;
  font-size:.63rem;
  font-weight:650;
}
.login-role-switch input:checked + span{
  border-color:rgba(160,96,223,.62);
  background:linear-gradient(180deg,rgba(160,96,223,.13),rgba(255,255,255,.88));
  color:#62348f;
  box-shadow:0 7px 17px rgba(92,48,119,.10),inset 0 0 0 1px rgba(255,255,255,.42);
}
.login-role-switch input:focus-visible + span{
  outline:3px solid rgba(159,95,224,.20);
  outline-offset:2px;
}
.guest-access-note{
  background:linear-gradient(180deg,rgba(250,246,255,.72),rgba(255,255,255,.58));
}
@media(max-width:700px){
  .mobile-bottom-nav.read-only-nav{grid-template-columns:repeat(3,1fr)}
  .guest-mode-badge{padding:6px 8px;font-size:.62rem}
  .login-role-switch{gap:6px}
  .login-role-switch span{min-height:56px;padding:8px 7px}
  .login-role-switch span b{font-size:.74rem}
  .login-role-switch span small{font-size:.58rem}
}


/* ===== v1.3.7 — bouton Installer uniquement sur mobile ===== */
.pwa-install{display:none!important}
@media(max-width:700px){
  .pwa-install:not([hidden]){display:inline-flex!important}
}
@media(display-mode:standalone){
  .pwa-install{display:none!important}
}


/* ===== v1.4.0 — bandeau Statistiques harmonisé avec l’accueil ===== */
.stats-hero{
  position:relative;
  min-height:auto;
  padding:20px 24px 18px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.58);
  background:
    linear-gradient(90deg,rgba(255,249,252,.92) 0%,rgba(255,249,252,.80) 22%,rgba(255,249,252,.44) 42%,rgba(255,255,255,.10) 72%),
    url('/public/assets/collection-hero-snowglobes.jpg') center 52%/cover no-repeat;
  box-shadow:0 18px 38px rgba(88,44,114,.14);
  overflow:hidden;
}
.stats-hero:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(43,20,63,.08));
}
.stats-hero .eyebrow,
.stats-hero > *{position:relative;z-index:1}
.stats-hero .eyebrow{
  margin-bottom:6px;
  color:#9b4f89;
  font-size:.72rem;
  letter-spacing:.16em;
}
.stats-hero h1{
  max-width:560px;
  margin:0;
  color:#3d1b55;
  font-size:clamp(2rem,4vw,3.4rem);
  line-height:.94;
  text-shadow:0 1px 0 rgba(255,255,255,.98),0 2px 14px rgba(255,255,255,.72),0 12px 28px rgba(70,34,95,.16);
}
.stats-hero p{
  max-width:560px;
  margin:.32rem 0 0;
  color:#324b61;
  font-size:.96rem;
  line-height:1.34;
  text-shadow:0 1px 0 rgba(255,255,255,.96),0 2px 10px rgba(255,255,255,.52);
}
@media (max-width:900px){
  .stats-hero{
    padding:18px 18px 16px;
    border-radius:22px;
    background:
      linear-gradient(180deg,rgba(255,249,252,.84),rgba(255,249,252,.70)),
      url('/public/assets/collection-hero-snowglobes.jpg') center 52%/cover no-repeat;
  }
  .stats-hero h1{max-width:none;font-size:clamp(1.85rem,6vw,2.8rem)}
  .stats-hero p{max-width:none;font-size:.84rem;line-height:1.32}
}
@media (max-width:700px){
  .stats-hero{
    padding:16px 14px 14px;
    border-radius:20px;
  }
  .stats-hero .eyebrow{font-size:.62rem;letter-spacing:.13em}
  .stats-hero h1{font-size:clamp(1.7rem,9vw,2.25rem)}
  .stats-hero p{margin-top:.22rem;font-size:.76rem;line-height:1.28}
}


/* ===== v1.4.4 — collection mobile compacte en deux colonnes ===== */
@media (max-width:700px){
  .collection-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    padding-bottom:calc(var(--bottom-nav) + env(safe-area-inset-bottom) + 28px) !important;
  }
  .collection-card{
    border-radius:16px !important;
    box-shadow:0 8px 20px rgba(82,43,110,.09) !important;
  }
  .collection-card:hover{
    transform:none;
  }
  .collection-card .photo{
    aspect-ratio:6/5 !important;
  }
  .collection-card .card-flake{
    display:none;
  }
  .collection-card .cardbody{
    padding:8px 9px 9px !important;
  }
  .collection-card .cardbody h3{
    min-height:2.05em;
    margin:0 0 4px;
    font-size:.86rem !important;
    line-height:1.05;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
  }
  .collection-card .card-location{
    font-size:.62rem !important;
    line-height:1.25;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .collection-card .card-facts{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:4px !important;
    margin-top:6px !important;
    font-size:.61rem !important;
    line-height:1.2;
    white-space:nowrap;
    flex-wrap:nowrap !important;
  }
  .collection-card .card-facts span{
    min-width:0;
  }
  .results-head{
    margin-bottom:10px;
  }
}

/* Même sur les téléphones étroits, on conserve la vue "planche de collection". */
@media (max-width:390px){
  .collection-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }
  .collection-card{
    border-radius:14px !important;
  }
  .collection-card .cardbody{
    padding:7px 7px 8px !important;
  }
  .collection-card .cardbody h3{
    font-size:.80rem !important;
  }
  .collection-card .card-location{
    font-size:.57rem !important;
  }
  .collection-card .card-facts{
    font-size:.56rem !important;
    gap:3px !important;
  }
}
