/* Dr. Pops — order popup design (blue #1a0cb0 / navy #123b78 / yellow #ffd600) */
dialog[data-fp-modal] {
  --dp-blue: #1a0cb0; --dp-navy: #123b78; --dp-yellow: #ffd600; --dp-yellow-soft: #fff8d6;
  --dp-line: #e3e6f5; --dp-field: #f6f7fd;
}
dialog[data-fp-modal] .fpm__box {
  border-radius: 26px; overflow: hidden; background: #fff;
  box-shadow: 0 30px 80px -20px rgba(18, 59, 120, .55);
}

/* header */
dialog[data-fp-modal] .fpm__head {
  position: relative; background: linear-gradient(135deg, #1a0cb0 0%, #2a3fe0 55%, #3b7bf0 100%);
  color: #fff; padding: 18px 56px 18px 18px; border-bottom: 4px solid var(--dp-yellow);
}
dialog[data-fp-modal] .fpm__head::after {
  content: ""; position: absolute; right: -40px; top: -40px; width: 140px; height: 140px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 214, 0, .35), transparent 70%); pointer-events: none;
}
dialog[data-fp-modal] .fpm__title { color: #fff; letter-spacing: -.01em; }
dialog[data-fp-modal] .fpm__intro { color: #fff; opacity: 1; display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .25); border-radius: 12px; padding: 5px 10px; margin-top: 6px; font-size: .76rem; line-height: 1.35; }
dialog[data-fp-modal] .fpm__intro svg, dialog[data-fp-modal] .fpm__intro .icon { color: var(--dp-yellow); }
dialog[data-fp-modal] .fpm__thumb { background: #fff; border-radius: 16px; box-shadow: 0 6px 18px rgba(0, 0, 0, .18); border: 2px solid var(--dp-yellow); }
dialog[data-fp-modal] .fpm__close { background: rgba(255, 255, 255, .18); color: #fff; border: 1px solid rgba(255, 255, 255, .35); z-index: 2; }
dialog[data-fp-modal] .fpm__close:hover { background: var(--dp-yellow); color: var(--dp-navy); }

/* step labels: « 1. Choisissez… » → yellow number pill */
dialog[data-fp-modal] .fpm__step-label {
  display: flex; align-items: center; gap: 8px; color: var(--dp-navy); font-weight: 800; font-size: .95rem; margin: 18px 0 10px;
}
dialog[data-fp-modal] .fpm__step-label::before {
  content: ""; width: 6px; height: 22px; border-radius: 4px; background: linear-gradient(var(--dp-yellow), #ffb800);
}

/* offer cards */
dialog[data-fp-modal] .fpmo {
  background: #fff; border: 2px solid var(--dp-line); border-radius: 18px;
  box-shadow: 0 4px 14px -8px rgba(18, 59, 120, .25); transition: border-color .2s, background .2s, transform .15s, box-shadow .2s;
}
dialog[data-fp-modal] .fpmo:hover { transform: translateY(-1px); border-color: #c9cdf0; }
dialog[data-fp-modal] .fpmo:has(input:checked) {
  border-color: var(--dp-yellow); background: linear-gradient(180deg, #fffdf2, var(--dp-yellow-soft));
  box-shadow: 0 10px 24px -12px rgba(255, 184, 0, .7), inset 0 0 0 1px var(--dp-yellow);
}
dialog[data-fp-modal] .fpmo__radio, dialog[data-fp-modal] .fpmo input[type="radio"] { accent-color: var(--dp-blue); }
dialog[data-fp-modal] .fpmo__img { border-radius: 12px; background: #fff; }
dialog[data-fp-modal] .fpmo__price { color: var(--dp-blue); }
dialog[data-fp-modal] .fpmo__badge { box-shadow: 0 4px 10px -4px rgba(18, 59, 120, .5); }

/* fields */
dialog[data-fp-modal] .fpm__field label { color: var(--dp-navy); font-weight: 700; }
dialog[data-fp-modal] .fpm__input .field {
  background: var(--dp-field); border: 2px solid transparent; border-radius: 14px; min-height: 3.1rem;
  color: var(--dp-navy); font-size: 1rem; transition: border-color .2s, box-shadow .2s, background .2s;
}
dialog[data-fp-modal] .fpm__input .field::placeholder { color: #8d93b8; }
dialog[data-fp-modal] .fpm__input .field:focus {
  outline: none; background: #fff; border-color: var(--dp-blue); box-shadow: 0 0 0 4px rgba(255, 214, 0, .45);
}
dialog[data-fp-modal] .fpm__input .field[aria-invalid="true"] { border-color: #e0245e; box-shadow: 0 0 0 4px rgba(224, 36, 94, .15); }
dialog[data-fp-modal] .fpm__ico { color: var(--dp-blue); }

/* summary */
dialog[data-fp-modal] .fpm__summary .fps {
  background: #fff; border: 2px dashed #c9cdf0; border-radius: 18px; position: relative;
}
dialog[data-fp-modal] .fpm__summary .fps__total {
  background: var(--dp-blue); color: #fff; margin: 10px -2px -2px; padding: 12px 16px; border-radius: 0 0 16px 16px; border-top: 0;
}
dialog[data-fp-modal] .fpm__summary .fps__total span { color: #fff; }
dialog[data-fp-modal] .fpm__summary .fps__total span:last-child { color: var(--dp-yellow); font-size: 1.2rem; font-weight: 800; }
dialog[data-fp-modal] .fps__free { color: #12a150; font-weight: 800; }

/* submit */
dialog[data-fp-modal] .fpm__submit {
  background: linear-gradient(180deg, #ffe14d, var(--dp-yellow) 60%, #ffc400); color: var(--dp-navy);
  border: 0; border-radius: 16px; min-height: 3.6rem; font-size: 1.05rem; font-weight: 900; letter-spacing: .02em;
  box-shadow: 0 10px 22px -10px rgba(255, 184, 0, .9), inset 0 -3px 0 rgba(0, 0, 0, .08);
  animation: dpPulse 2.2s ease-in-out infinite;
}
dialog[data-fp-modal] .fpm__submit:hover { filter: brightness(1.03); transform: translateY(-1px); }
@keyframes dpPulse { 0%, 100% { box-shadow: 0 10px 22px -10px rgba(255, 184, 0, .9), 0 0 0 0 rgba(255, 214, 0, .55); }
  50% { box-shadow: 0 10px 22px -10px rgba(255, 184, 0, .9), 0 0 0 8px rgba(255, 214, 0, 0); } }
@media (prefers-reduced-motion: reduce) { dialog[data-fp-modal] .fpm__submit { animation: none; } }
dialog[data-fp-modal] .fpm__note {
  display: flex; justify-content: center; align-items: center; gap: 6px; background: #eefaf2; color: #0f7a3d;
  border-radius: 12px; padding: 8px 10px; font-weight: 600;
}
dialog[data-fp-modal] .fpm__error { border-radius: 12px; }

/* done step */
dialog[data-fp-modal] .fpm__done-icon { background: var(--dp-yellow); color: var(--dp-navy); box-shadow: 0 10px 24px -10px rgba(255, 184, 0, .9); }
dialog[data-fp-modal] .fpm__order-ref { background: var(--dp-yellow-soft); color: var(--dp-navy); border-radius: 99px; padding: 4px 14px; font-weight: 800; }

/* thin blue scrollbar on the LEFT side of the popup */
dialog[data-fp-modal] { direction: rtl; scrollbar-width: thin; scrollbar-color: #1a0cb0 transparent; }
dialog[data-fp-modal] > * { direction: ltr; }
dialog[data-fp-modal]::-webkit-scrollbar { width: 5px; }
dialog[data-fp-modal]::-webkit-scrollbar-track { background: transparent; }
dialog[data-fp-modal]::-webkit-scrollbar-thumb { background: #1a0cb0; border-radius: 99px; }

/* delivery line on the offer cards: paid = orange pill, free = green pill */
.dp-ship, .fpo__ship {
  display: inline-block; margin-top: 4px; padding: 2px 9px; border-radius: 99px;
  font-weight: 800; font-size: .74rem; line-height: 1.5; white-space: nowrap;
}
.dp-ship--paid { background: #e6f9ee; color: #0b8a43; border: 1px solid #a8e6c1; }
/* offer cards on the page: delivery line in plain green text */
.fpo__ship, .fpo__ship.is-free { background: none !important; border: 0 !important; padding: 0 !important; color: #0b8a43 !important; font-weight: 800; }
.dp-ship--free { background: #e6f9ee; color: #0b8a43; border: 1px solid #a8e6c1; }

/* footer newsletter: framed e-mail field */
.footer__field .field {
  background: #fff !important; color: #123b78 !important; border: 2px solid #ffd600 !important;
  border-right: 0 !important; border-radius: 12px 0 0 12px !important; min-height: 3.2rem;
}
.footer__field .field::placeholder { color: #6b72a8; }
.footer__field .field:focus { outline: none; box-shadow: 0 0 0 4px rgba(255, 214, 0, .35); }
.footer__field button, .footer__field .button { border-radius: 0 12px 12px 0 !important; }
.footer__msg.is-ok { color: #ffd600; font-weight: 700; }
/* product selector (Sachet / Présentoir): selected card = store blue only, no yellow stripe */
.fp-select:has(input:checked) { background: #1a0cb0 !important; border-color: #1a0cb0 !important; }
.fp-select:has(input:checked) .fp-select__label { background: #1a0cb0 !important; color: #fff !important; }
.fp-select:has(input:checked)::before { background: #1a0cb0 !important; color: #fff !important; }
/* home « Nos sucettes » collection: on mobile a 2-column grid, 3rd product centred below (no slider) */
@media (max-width: 749px) {
  .pcoll--mobile-carousel .pcoll__grid {
    grid-auto-flow: row !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-columns: auto !important; overflow: visible !important; scroll-snap-type: none !important;
    gap: 12px !important; padding: 0 !important; margin: 0 !important;
  }
  .pcoll--mobile-carousel .pcoll__item { width: auto !important; min-width: 0 !important; }
  .pcoll--mobile-carousel .pcoll__item:nth-child(3):nth-last-child(1),
  .pcoll--mobile-carousel .pcoll__item:last-of-type:nth-of-type(odd) {
    grid-column: 1 / -1 !important; justify-self: center !important; margin-inline: auto !important;
    width: calc(50% - 6px) !important; max-width: calc(50% - 6px) !important;
  }
  .pcoll--mobile-carousel .scroller-dots, .pcoll--mobile-carousel [data-dots], .pcoll--mobile-carousel .carousel-dots,
  .pcoll--mobile-carousel .scroller-nav, .pcoll--mobile-carousel [data-carousel-dots] { display: none !important; }
  .pcoll--mobile-carousel .pcard { padding: 10px !important; height: 100%; }
  .pcoll--mobile-carousel .pcoll__item { display: flex; }
  .pcoll--mobile-carousel .pcoll__item > .pcard { width: 100%; }
  .pcoll--mobile-carousel .pcard__media { height: 130px !important; aspect-ratio: auto !important; }
  .pcoll--mobile-carousel .pcard__media img { width: 100%; height: 100% !important; object-fit: contain; }
  .pcoll--mobile-carousel .pcard__body { flex: 1 1 auto; }
  .pcoll--mobile-carousel .pcard__title {
    font-size: .92rem !important; line-height: 1.3 !important; min-height: 2.6em; margin-bottom: 4px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  .pcoll--mobile-carousel .pcard__price { min-height: 2.9em; }
  .pcoll--mobile-carousel .pcard__order { margin-top: auto !important; }
  .pcoll--mobile-carousel .pcard .button { min-height: 2.6rem; font-size: .9rem; padding-inline: .6rem; }
}