/* PHOTO_ORGANIZER_POPUP_DYNAMIQUE_V2_4_6
   Base visuelle V2.4. Correction : taille normale + aucun scroll interne.
*/
html.po-v246-modal-open,
html.po-v246-modal-open body{
  overflow:hidden!important;
}

.po-v24-overlay{
  position:fixed;
  inset:0;
  z-index:100000;
  display:grid;
  place-items:center;
  padding:18px;
  background:rgba(7,14,27,.73);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
  opacity:0;
  visibility:hidden;
  transition:opacity .22s ease,visibility .22s ease;
}
.po-v24-overlay.is-open{opacity:1;visibility:visible}

.po-v24-dialog{
  /* IMPORTANT : le site applique des espacements globaux aux balises <section>.
     Le popup est lui-même un <section>, donc on neutralise ces règles ici. */
  padding:0!important;
  margin:0!important;
  min-height:0!important;
  height:auto!important;
  box-sizing:border-box!important;
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.22fr) minmax(235px,.78fr);
  width:min(760px,82vw);
  overflow:hidden;
  border-radius:24px;
  background:linear-gradient(135deg,#fff 0%,#fbfdff 58%,#f5f7ff 100%);
  box-shadow:0 28px 78px rgba(0,0,0,.40);
  transform:translateY(10px) scale(.985);
  transition:transform .22s ease;
}
.po-v24-overlay.is-open .po-v24-dialog{transform:translateY(0) scale(1)}

.po-v24-dialog > .po-v24-left,
.po-v24-dialog > .po-v24-right{
  margin:0!important;
  box-sizing:border-box!important;
}


.po-v24-close-x{
  position:absolute;
  right:12px;
  top:12px;
  z-index:8;
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.90);
  color:#142033;
  font-size:23px;
  line-height:1;
  cursor:pointer;
  box-shadow:0 7px 20px rgba(15,28,50,.12);
}

.po-v24-left{
  padding:24px 14px 22px 24px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
}
.po-v24-badge{
  align-self:flex-start;
  padding:6px 11px;
  border-radius:999px;
  color:#fff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.04em;
  background:linear-gradient(90deg,#10a9ff,#4455ff 58%,#c43cff);
  box-shadow:0 7px 17px rgba(88,85,255,.20);
}
.po-v24-dialog h2{
  margin:11px 0 8px;
  padding-bottom:4px;
  font-size:clamp(27px,3vw,36px);
  line-height:1.08;
  letter-spacing:-.035em;
  color:#111d31;
  overflow:visible;
}
.po-v24-dialog h2 span,
.po-v24-dialog h2 strong{display:block}
.po-v24-dialog h2 strong{
  margin-top:4px;
  background:linear-gradient(90deg,#0a63f0,#3759ff 52%,#8b4fff);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.po-v24-lead{
  margin:6px 0 0;
  color:#17253c;
  font-size:14px;
  line-height:1.3;
  font-weight:800;
}
.po-v24-body{
  margin:10px 0 0;
  color:#596a82;
  font-size:13px;
  line-height:1.52;
}

.po-v24-features{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-top:10px;
}
.po-v24-feature{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:5px 7px;
  border-radius:999px;
  background:#f3f6fb;
  color:#44546a;
  font-size:10.5px;
  font-weight:800;
  border:1px solid #e6ebf4;
}
.po-v24-feature-icon{
  display:grid;
  place-items:center;
  min-width:18px;
  height:18px;
  padding:0 3px;
  border-radius:6px;
  background:linear-gradient(135deg,#20aaff,#7049ff);
  color:#fff;
  font-size:9px;
  font-weight:900;
}

.po-v24-pass{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:8px;
  align-items:center;
  margin-top:11px;
  padding:9px 10px;
  border-radius:13px;
  background:linear-gradient(135deg,#eef7ff,#f4f3ff);
  border:1px solid #d9e8ff;
}
.po-v24-gift{font-size:20px}
.po-v24-pass-main{
  color:#0c58bd;
  font-size:12px;
  line-height:1.38;
  font-weight:900;
}
.po-v24-activation{
  margin-top:3px;
  color:#4f6786;
  font-size:11px;
  font-weight:700;
}


.po-v24-preference{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-top:8px;
  color:#66758a;
  font-size:10.5px;
  font-weight:700;
  cursor:pointer;
  user-select:none;
}
.po-v24-preference input{
  width:15px;
  height:15px;
  margin:0;
  accent-color:#3f62ff;
  cursor:pointer;
}

.po-v24-actions{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(95px,.75fr) minmax(76px,.55fr);
  gap:7px;
  margin-top:11px;
}
.po-v24-actions a,
.po-v24-actions button{
  min-height:38px;
  border-radius:11px;
  padding:7px 10px;
  border:0;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font:inherit;
  font-size:11.5px;
  font-weight:900;
  cursor:pointer;
  white-space:nowrap;
}
.po-v24-primary{
  color:#fff!important;
  background:linear-gradient(90deg,#0fa9fa,#2f58ff 55%,#a43cff);
  box-shadow:0 9px 22px rgba(71,72,255,.20);
}
.po-v24-secondary{
  color:#0d59b8!important;
  background:#fff;
  border:2px solid #bdd8ff!important;
}
.po-v24-close{
  color:#5e6b7c;
  background:#eef2f6;
}

.po-v24-right{
  position:relative;
  overflow:hidden;
  min-height:440px;
  background:
    radial-gradient(circle at 75% 12%,rgba(134,93,255,.34),transparent 34%),
    radial-gradient(circle at 18% 18%,rgba(48,162,255,.34),transparent 32%),
    linear-gradient(160deg,#edf6ff 0%,#eef0ff 48%,#faf6ff 100%);
}
.po-v24-glow{position:absolute;border-radius:50%;filter:blur(2px)}
.po-v24-glow-one{
  width:170px;height:170px;right:-50px;top:45px;
  background:rgba(147,114,255,.20);
}
.po-v24-glow-two{
  width:135px;height:135px;left:-42px;bottom:14px;
  background:rgba(54,163,255,.18);
}
.po-v24-sparkles{
  position:absolute;
  right:18px;
  top:58px;
  color:#6d8cff;
  font-size:21px;
  display:flex;
  gap:11px;
  z-index:4;
}
.po-v24-visual{
  position:absolute;
  left:50%;
  top:48px;
  transform:translateX(-50%);
  width:auto;
  height:auto;
  max-width:88%;
  max-height:340px;
  object-fit:contain;
  z-index:2;
  filter:drop-shadow(0 14px 20px rgba(51,67,110,.20));
}
.po-v24-mini-card{
  position:absolute;
  right:10px;
  top:150px;
  width:128px;
  padding:10px;
  border-radius:14px;
  background:rgba(255,255,255,.94);
  box-shadow:0 14px 28px rgba(55,70,120,.17);
  z-index:3;
  transform:rotate(3deg);
}
.po-v24-mini-logo{
  font-size:9px;
  color:#19263c;
  margin-bottom:6px;
}
.po-v24-mini-line{
  font-size:8.5px;
  color:#65738a;
  padding:3px 0;
  display:flex;
  gap:5px;
  align-items:center;
}
.po-v24-slogan{
  position:absolute;
  right:12px;
  bottom:14px;
  width:128px;
  color:#253a69;
  font-size:16px;
  line-height:1.05;
  font-family:"Segoe Script","Brush Script MT",cursive;
  font-weight:700;
  transform:rotate(-4deg);
  z-index:4;
}

/* Petit écran : on retire uniquement la décoration droite pour garder
   un vrai popup compact SANS barre de défilement. */
@media(max-width:820px){
  .po-v24-dialog{
    grid-template-columns:1fr;
    width:min(500px,90vw);
    overflow:hidden;
  }
  .po-v24-left{padding:20px 17px 18px}
  .po-v24-right{display:none}
}

@media(max-width:560px){
  .po-v24-overlay{padding:7px}
  .po-v24-dialog{
    width:92vw;
    border-radius:18px;
  }
  .po-v24-left{padding:16px 13px 14px}
  .po-v24-dialog h2{font-size:27px}
  .po-v24-lead{font-size:12.5px}
  .po-v24-body{font-size:10.8px;line-height:1.42}
  .po-v24-actions{
    grid-template-columns:1fr;
  }
  .po-v24-actions a,
  .po-v24-actions button{
    width:100%;
    min-height:36px;
  }
}

/* Écran bas : pas de scrollbar interne, on retire la partie décorative
   et on compacte encore légèrement. */
@media(max-height:690px){
  .po-v24-dialog{
    grid-template-columns:1fr;
    width:min(500px,82vw);
    overflow:hidden;
  }
  .po-v24-right{display:none}
  .po-v24-left{padding:15px 14px 13px}
  .po-v24-dialog h2{font-size:28px;margin-top:8px}
  .po-v24-body{font-size:10.5px;line-height:1.4;margin-top:7px}
  .po-v24-features{margin-top:7px}
  .po-v24-pass{margin-top:8px}
  .po-v24-actions{margin-top:8px}
}
