/* =============================================================================
   RP Events Booking – Front-end styles  v1.1
   Palette:
     Dark teal   : #1a4a4a
     Accent teal : #2a9d8f
     Light bg    : #f0f7f6
     White       : #ffffff
     Muted       : #5c7070
     Border      : #cde4e1
============================================================================= */

/* ── Reset / Base ──────────────────────────────────────────────────────────── */
.rpe-wrap *,
.rpe-wrap *::before,
.rpe-wrap *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.rpe-wrap {
    --rpe-dark:    #1a4a4a;
    --rpe-accent:  #2a9d8f;
    --rpe-accent2: #238c7f;
    --rpe-light:   #f0f7f6;
    --rpe-border:  #cde4e1;
    --rpe-text:    #1c2e2e;
    --rpe-muted:   #5c7070;
    --rpe-error:   #c0392b;
    --rpe-radius:  12px;
    --rpe-shadow:  0 4px 24px rgba(26,74,74,.10);

    max-width: 860px;
    margin: 0 auto;
    padding: 0 16px 60px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
    color: var(--rpe-text);
    line-height: 1.6;
}

/* ── Brochure link (inside nav bar) ─────────────────────────────────────────── */
.rpe-brochure-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--rpe-accent);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none !important;
    border: 1.5px solid var(--rpe-border);
    padding: 10px 16px;
    border-radius: 10px;
    letter-spacing: .01em;
    transition: border-color .2s, color .2s, background .2s, box-shadow .2s;
    background: #fff;
    white-space: nowrap;
}

.rpe-brochure-link svg {
    width: 14px;
    height: 14px;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex-shrink: 0;
    transition: transform .2s;
}

.rpe-brochure-link:hover {
    border-color: var(--rpe-accent);
    background: #edf8f6;
    color: var(--rpe-accent2);
}

.rpe-brochure-link:hover svg:last-child {
    transform: translate(2px, -2px);
}

/* ── Form card ──────────────────────────────────────────────────────────────── */
.rpe-form-card {
    background: #fff;
    border-radius: 20px;
    box-shadow: var(--rpe-shadow);
    padding: 40px 40px 32px;
    border: 1px solid var(--rpe-border);
    min-width: 0; /* empêche le dépassement dans la grille */
}

@media (max-width: 600px) {
    .rpe-form-card {
        padding: 24px 20px 24px;
        border-radius: 16px;
    }
}

/* ── Total estimatif bar ─────────────────────────────────────────────────────── */
.rpe-total-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--rpe-light);
    border: 1px solid var(--rpe-border);
    border-radius: 10px;
    padding: 12px 18px;
    margin-top: 28px;
    margin-bottom: 6px;
}

.rpe-total-bar-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--rpe-muted);
    text-transform: uppercase;
    letter-spacing: .06em;
}

.rpe-total-bar-amount {
    font-size: 16px;
    font-weight: 800;
    color: var(--rpe-accent);
}

.rpe-total-bar-note {
    font-size: 11.5px;
    color: var(--rpe-muted);
    font-style: italic;
    margin-bottom: 16px;
    padding: 0 2px;
}

/* ── Progress bar ──────────────────────────────────────────────────────────── */
.rpe-progress-wrap {
    margin-bottom: 32px;
}

.rpe-progress-outer {
    width: 100%;
    height: 5px;
    background: var(--rpe-border);
    border-radius: 99px;
    overflow: hidden;
    margin-bottom: 10px;
}

.rpe-progress-bar {
    height: 100%;
    background: linear-gradient(90deg, var(--rpe-dark) 0%, var(--rpe-accent) 100%);
    border-radius: 99px;
    transition: width .4s cubic-bezier(.4,0,.2,1);
}

.rpe-step-indicator {
    text-align: right;
    font-size: 12px;
    color: var(--rpe-muted);
    letter-spacing: .04em;
    font-weight: 500;
}

/* ── Step titles ────────────────────────────────────────────────────────────── */
.rpe-wrap .rpe-step-title,
.rpe-wrap h2.rpe-step-title {
    /* Taille fluide : ~21px sur mobile → ~28px sur grand écran */
    font-size: clamp(1.35rem, 1.05rem + 1.3vw, 1.75rem) !important;
    font-weight: 800 !important;
    color: var(--rpe-dark) !important;
    margin-bottom: 6px !important;
    letter-spacing: -.02em !important;
    line-height: 1.25 !important;
}

.rpe-step-divider {
    height: 2px;
    background: var(--rpe-border);
    border-radius: 99px;
    margin: 14px 0 28px;
}

.rpe-step-divider--soft {
    height: 1px;
    background: var(--rpe-border);
    opacity: .7;
    margin: 8px 0 18px;
}

/* ── Form fields ────────────────────────────────────────────────────────────── */
.rpe-field-group {
    margin-bottom: 20px;
    flex: 1;
}

.rpe-fields-row {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.rpe-fields-row .rpe-field-group {
    min-width: 160px;
}

.rpe-label {
    display: block;
    font-size: 11px;
    font-weight: 800;
    color: var(--rpe-dark);
    margin-bottom: 8px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.rpe-req {
    color: var(--rpe-error);
    margin-left: 2px;
}

/* ── Base input / textarea ───────────────────────────────────────────────────── */
.rpe-wrap .rpe-input,
.rpe-wrap .rpe-textarea,
.rpe-wrap .rpe-select {
    width: 100% !important;
    padding: 13px 16px !important;
    border: 1.5px solid var(--rpe-border) !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-family: inherit !important;
    color: var(--rpe-text) !important;
    background: #fff !important;
    box-shadow: none !important;
    outline: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    transition: border-color .2s, box-shadow .2s, background .2s !important;
}

.rpe-wrap .rpe-input::placeholder,
.rpe-wrap .rpe-textarea::placeholder {
    color: #b0c4c2 !important;
    font-weight: 400 !important;
}

.rpe-wrap .rpe-input:hover:not(:focus),
.rpe-wrap .rpe-textarea:hover:not(:focus) {
    border-color: #9dc8c4 !important;
    background: #fafefe !important;
}

.rpe-wrap .rpe-input:focus,
.rpe-wrap .rpe-textarea:focus {
    border-color: var(--rpe-accent) !important;
    box-shadow: 0 0 0 4px rgba(42,157,143,.13) !important;
    background: #fff !important;
    outline: none !important;
}

/* Suppress browser red invalid outline */
.rpe-wrap .rpe-input:invalid,
.rpe-wrap .rpe-textarea:invalid {
    box-shadow: none !important;
}

/* ── Date inputs ─────────────────────────────────────────────────────────────── */
.rpe-input-date {
    position: relative;
}

.rpe-input-date input[type="date"] {
    width: 100%;
    padding: 12px 46px 12px 16px;
    border: 1.5px solid var(--rpe-border);
    border-radius: 10px;
    font-size: 15px;
    font-family: inherit;
    color: var(--rpe-text);
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232a9d8f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E") no-repeat right 14px center;
    background-size: 18px;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    transition: border-color .2s, box-shadow .2s, background-color .2s;
    cursor: pointer;
}

/* Hide native picker icon & the original hidden input when Flatpickr is active */
.rpe-input-date input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    height: 100%;
    cursor: pointer;
}

/* Flatpickr altInput — styled via class added in onReady callback */
.rpe-date-alt {
    width: 100% !important;
    padding: 13px 46px 13px 16px !important;
    border: 1.5px solid var(--rpe-border) !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-family: inherit !important;
    color: var(--rpe-text) !important;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232a9d8f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E") no-repeat right 14px center !important;
    background-size: 18px !important;
    cursor: pointer !important;
    outline: none !important;
    transition: border-color .2s, box-shadow .2s, background-color .2s !important;
    box-sizing: border-box !important;
}

.rpe-date-alt:hover:not(:focus) {
    border-color: #9dc8c4 !important;
    background-color: #fafefe !important;
}

.rpe-date-alt::placeholder {
    color: #b0c4c2 !important;
}

.rpe-date-alt:focus {
    border-color: var(--rpe-accent) !important;
    box-shadow: 0 0 0 4px rgba(42,157,143,.13) !important;
    outline: none !important;
}

.rpe-input-date input[type="date"]::-webkit-datetime-edit {
    padding: 0;
}

.rpe-input-date input[type="date"]::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
}

.rpe-input-date input[type="date"]::placeholder {
    color: #b0c4c2;
}

.rpe-input-date input[type="date"]:hover:not(:focus) {
    border-color: #9dc8c4;
    background-color: #fafefe;
}

.rpe-input-date input[type="date"]:focus {
    border-color: var(--rpe-accent);
    box-shadow: 0 0 0 4px rgba(42,157,143,.13);
}

.rpe-input-date input[type="date"]:invalid {
    box-shadow: none;
}

/* ── Number input ────────────────────────────────────────────────────────────── */
.rpe-input-number {
    position: relative;
}

.rpe-input-number input[type="number"] {
    width: 100%;
    padding: 13px 46px 13px 16px;
    border: 1.5px solid var(--rpe-border);
    border-radius: 10px;
    font-size: 15px;
    font-family: inherit;
    color: var(--rpe-text);
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232a9d8f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'%3E%3C/path%3E%3Ccircle cx='9' cy='7' r='4'%3E%3C/circle%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'%3E%3C/path%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'%3E%3C/path%3E%3C/svg%3E") no-repeat right 14px center;
    background-size: 18px;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    transition: border-color .2s, box-shadow .2s, background-color .2s;
    -moz-appearance: textfield;
}

.rpe-input-number input[type="number"]::-webkit-outer-spin-button,
.rpe-input-number input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.rpe-input-number input[type="number"]::placeholder {
    color: #b0c4c2;
}

.rpe-input-number input[type="number"]:hover:not(:focus) {
    border-color: #9dc8c4;
    background-color: #fafefe;
}

.rpe-input-number input[type="number"]:focus {
    border-color: var(--rpe-accent);
    box-shadow: 0 0 0 4px rgba(42,157,143,.13);
}

.rpe-input-number input[type="number"]:invalid {
    box-shadow: none;
}

/* ── Time input ──────────────────────────────────────────────────────────────── */
.rpe-input-time {
    position: relative;
}

.rpe-input-time input[type="time"] {
    width: 100%;
    padding: 12px 46px 12px 16px;
    border: 1.5px solid var(--rpe-border);
    border-radius: 10px;
    font-size: 15px;
    font-family: inherit;
    color: var(--rpe-text);
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232a9d8f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 14px center;
    background-size: 18px;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    transition: border-color .2s, box-shadow .2s, background-color .2s;
    cursor: pointer;
}

.rpe-input-time input[type="time"]::-webkit-calendar-picker-indicator {
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    height: 100%;
    cursor: pointer;
}

.rpe-input-time input[type="time"]:hover:not(:focus) {
    border-color: #9dc8c4;
    background-color: #fafefe;
}

.rpe-input-time input[type="time"]:focus {
    border-color: var(--rpe-accent);
    box-shadow: 0 0 0 4px rgba(42,157,143,.13);
}

.rpe-input-sm {
    max-width: 200px;
}

.rpe-textarea {
    resize: vertical;
    min-height: 100px;
    line-height: 1.5;
}

/* ── Event type radio cards ─────────────────────────────────────────────────── */
.rpe-radio-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.rpe-radio-card {
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 20px 12px;
    border: 2px solid var(--rpe-border);
    border-radius: 14px;
    background: #fff;
    transition: border-color .2s, background .2s, box-shadow .2s, transform .15s;
    user-select: none;
    position: relative;
}

.rpe-radio-card input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.rpe-card-icon {
    font-size: 30px;
    line-height: 1;
}

.rpe-card-label {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--rpe-dark);
    text-align: center;
    letter-spacing: .01em;
}

.rpe-radio-card:hover {
    border-color: var(--rpe-accent);
    background: var(--rpe-light);
    box-shadow: 0 4px 12px rgba(42,157,143,.14);
    transform: translateY(-2px);
}

.rpe-radio-card.rpe-selected {
    border-color: var(--rpe-accent);
    background: #e8f5f3;
    box-shadow: 0 0 0 3px rgba(42,157,143,.20);
}

.rpe-radio-card.rpe-selected .rpe-card-label {
    color: var(--rpe-accent2);
}

.rpe-autre-wrap {
    margin-top: 12px;
}

/* ── 2×2 grid for step-1 fields ─────────────────────────────────────────────── */
.rpe-fields-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.rpe-fields-grid .rpe-field-group {
    margin-bottom: 0;
}

.rpe-fields-grid .rpe-input-number,
.rpe-fields-grid .rpe-input-date,
.rpe-fields-grid .rpe-input-time {
    width: 100%;
}

.rpe-fields-grid .rpe-input-number input[type="number"],
.rpe-fields-grid .rpe-input-date input[type="date"],
.rpe-fields-grid .rpe-input-time input[type="time"] {
    width: 100%;
    max-width: 100%;
}

/* ── Salle note ─────────────────────────────────────────────────────────────── */
.rpe-salle-note {
    font-size: 12.5px;
    color: var(--rpe-muted);
    margin-bottom: 18px;
    padding: 10px 14px;
    background: #fffbea;
    border-left: 3px solid #f0c040;
    border-radius: 0 8px 8px 0;
}

/* ── Salle cards ────────────────────────────────────────────────────────────── */
.rpe-salle-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(236px, 1fr));
    gap: 14px;
}

.rpe-salle-card {
    cursor: pointer;
    display: block;
    position: relative;
}

.rpe-salle-card input[type="radio"],
.rpe-salle-card input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.rpe-salle-card-inner {
    padding: 20px;
    border: 2px solid var(--rpe-border);
    border-radius: 14px;
    background: #fff;
    transition: border-color .2s, box-shadow .2s, transform .15s;
    position: relative;
    height: 100%;
}

.rpe-salle-check {
    display: none;
    position: absolute;
    top: 12px;
    right: 12px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--rpe-accent);
    color: #fff;
    font-size: 13px;
    line-height: 24px;
    text-align: center;
    font-weight: 800;
}

.rpe-salle-card:hover .rpe-salle-card-inner {
    border-color: var(--rpe-accent);
    box-shadow: 0 6px 20px rgba(42,157,143,.16);
    transform: translateY(-2px);
}

.rpe-salle-card.rpe-selected .rpe-salle-card-inner {
    border-color: var(--rpe-accent);
    background: #e8f5f3;
    box-shadow: 0 0 0 3px rgba(42,157,143,.20);
    transform: translateY(-2px);
}

.rpe-salle-card.rpe-selected .rpe-salle-check {
    display: block;
}

.rpe-salle-name {
    font-size: 14px;
    font-weight: 800;
    color: var(--rpe-dark);
    margin-bottom: 10px;
    padding-right: 30px;
    line-height: 1.3;
}

.rpe-salle-details {
    display: flex;
    flex-direction: column;
    gap: 3px;
    font-size: 12px;
    color: var(--rpe-muted);
    margin-bottom: 12px;
}

.rpe-salle-price {
    font-size: 14px;
    color: var(--rpe-text);
    padding-top: 10px;
    border-top: 1px solid var(--rpe-border);
}

.rpe-salle-price strong {
    color: var(--rpe-dark);
    font-size: 15px;
}

.rpe-price-unit {
    font-size: 12px;
    color: var(--rpe-muted);
}

/* ── Section titles ─────────────────────────────────────────────────────────── */
.rpe-section {
    margin-bottom: 28px;
}

.rpe-section-title {
    font-size: 14px;
    font-weight: 800;
    color: var(--rpe-dark);
    margin-bottom: 14px;
    padding: 9px 14px;
    background: var(--rpe-light);
    border-left: 3px solid var(--rpe-accent);
    border-radius: 0 8px 8px 0;
    letter-spacing: .04em;
    text-transform: uppercase;
}

/* ── Pack cards ─────────────────────────────────────────────────────────────── */
.rpe-pack-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
}

.rpe-pack-card {
    cursor: pointer;
    display: block;
    position: relative;
}

.rpe-pack-card input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.rpe-pack-card-inner {
    padding: 18px;
    border: 2px solid var(--rpe-border);
    border-radius: 14px;
    background: #fff;
    transition: border-color .2s, box-shadow .2s, transform .15s;
    position: relative;
    height: 100%;
}

.rpe-pack-card:hover .rpe-pack-card-inner {
    border-color: var(--rpe-accent);
    box-shadow: 0 6px 20px rgba(42,157,143,.16);
    transform: translateY(-2px);
}

.rpe-pack-card.rpe-selected .rpe-pack-card-inner {
    border-color: var(--rpe-accent);
    background: #e8f5f3;
    box-shadow: 0 0 0 3px rgba(42,157,143,.20);
    transform: translateY(-2px);
}

.rpe-pack-card.rpe-selected .rpe-salle-check {
    display: block;
}

.rpe-pack-name {
    font-size: 13.5px;
    font-weight: 800;
    color: var(--rpe-dark);
    margin-bottom: 6px;
    padding-right: 28px;
    line-height: 1.3;
}

.rpe-pack-desc {
    font-size: 12px;
    color: var(--rpe-muted);
    margin-bottom: 12px;
    line-height: 1.4;
}

.rpe-pack-price {
    font-size: 14px;
    color: var(--rpe-text);
    padding-top: 10px;
    border-top: 1px solid var(--rpe-border);
}

.rpe-pack-price strong {
    color: var(--rpe-dark);
}

/* ── Options list (technique / mobilier / logistique / services) ─────────────── */
.rpe-options-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.rpe-option-row {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 16px;
    border: 1.5px solid var(--rpe-border);
    border-radius: 10px;
    background: #fff;
    transition: border-color .2s, background .2s, box-shadow .2s;
    cursor: pointer;
}

.rpe-option-row:hover {
    border-color: #9dc8c4;
    background: #fafefe;
}

.rpe-option-row.rpe-checked {
    border-color: var(--rpe-accent);
    background: #edf8f6;
    box-shadow: 0 2px 10px rgba(42,157,143,.10);
}

.rpe-option-label {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    cursor: pointer;
    min-width: 180px;
}

.rpe-option-label input[type="checkbox"] {
    accent-color: var(--rpe-accent);
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    cursor: pointer;
}

.rpe-option-text {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0 8px;
    line-height: 1.4;
}

.rpe-option-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--rpe-text);
    white-space: nowrap;
}

.rpe-option-desc {
    font-size: 12px;
    color: var(--rpe-muted);
    font-weight: 400;
}

.rpe-option-price {
    font-size: 13px;
    color: var(--rpe-muted);
    white-space: nowrap;
    align-self: center;
    font-weight: 600;
    background: var(--rpe-light);
    padding: 3px 9px;
    border-radius: 99px;
    font-size: 12px;
}

.rpe-qty-wrap {
    width: 100%;
    padding-top: 8px;
    border-top: 1px dashed var(--rpe-border);
    margin-top: 4px;
}

.rpe-qty-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--rpe-dark);
    font-weight: 700;
    white-space: nowrap;
}

.rpe-qty-input {
    /* Force taille fixe contre les surcharges de thème WP */
    width: 80px !important;
    max-width: 80px !important;
    min-width: 80px !important;
    flex: 0 0 80px !important;
    padding: 5px 10px;
    border: 1.5px solid var(--rpe-border);
    border-radius: 8px;
    font-size: 14px;
    outline: none;
    transition: border-color .2s, box-shadow .2s;
    background: #fff;
    font-family: inherit;
    color: var(--rpe-text);
    -moz-appearance: textfield;
    appearance: textfield;
    box-sizing: border-box;
}

.rpe-qty-input::-webkit-outer-spin-button,
.rpe-qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.rpe-qty-input:focus {
    border-color: var(--rpe-accent);
    box-shadow: 0 0 0 3px rgba(42,157,143,.14);
}

/* Auto-qty linked label (no manual input) */
.rpe-qty-auto-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--rpe-muted);
    font-style: italic;
}

.rpe-qty-auto-label strong {
    color: var(--rpe-accent2);
    font-style: normal;
    font-size: 14px;
}

/* ── Service note ───────────────────────────────────────────────────────────── */
.rpe-service-note {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    background: #fffbea;
    border: 1.5px solid #f0c040;
    border-radius: 10px;
}

.rpe-note-icon {
    font-size: 20px;
    line-height: 1.3;
    flex-shrink: 0;
}

.rpe-service-note strong {
    display: block;
    font-size: 13.5px;
    color: var(--rpe-dark);
    margin-bottom: 3px;
    font-weight: 700;
}

.rpe-service-note p {
    margin: 0;
    font-size: 13px;
    color: #7a5c00;
    line-height: 1.5;
}

/* ── Récapitulatif ──────────────────────────────────────────────────────────── */
.rpe-recap {
    background: var(--rpe-light);
    border: 1.5px solid var(--rpe-border);
    border-radius: 14px;
    padding: 24px;
    margin-bottom: 20px;
    font-size: 14px;
}

.rpe-recap-section {
    margin-bottom: 18px;
}

.rpe-recap-section:last-child {
    margin-bottom: 0;
}

.rpe-recap-section-title {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--rpe-accent2);
    margin-bottom: 8px;
}

.rpe-recap-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
    border-bottom: 1px solid var(--rpe-border);
    color: var(--rpe-text);
    gap: 12px;
}

.rpe-recap-row:last-child {
    border-bottom: none;
}

.rpe-recap-row span:last-child {
    font-weight: 600;
    white-space: nowrap;
    color: var(--rpe-dark);
}

.rpe-recap-totals {
    background: var(--rpe-dark);
    border-radius: 14px;
    padding: 20px 24px;
    margin-bottom: 18px;
    color: #fff;
}

.rpe-totals-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.rpe-totals-table td {
    padding: 7px 0;
    color: rgba(255,255,255,.8);
}

.rpe-totals-table td:last-child {
    text-align: right;
    font-weight: 700;
    color: #fff;
}

.rpe-total-row td {
    font-size: 17px;
    border-top: 1px solid rgba(255,255,255,.2);
    padding-top: 12px;
    color: #fff !important;
}

.rpe-recap-note {
    font-size: 12px;
    color: rgba(255,255,255,.6);
    margin-top: 12px;
    font-style: italic;
    border-top: 1px solid rgba(255,255,255,.15);
    padding-top: 10px;
}

/* ── Navigation buttons ─────────────────────────────────────────────────────── */
.rpe-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--rpe-border);
    gap: 12px;
}

.rpe-wrap .rpe-btn {
    display: inline-flex;
    align-items: center !important;
    gap: 7px !important;
    padding: 12px 28px !important;
    border-radius: 10px !important;
    font-size: 14.5px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: background .2s, color .2s, border-color .2s, box-shadow .2s, transform .15s !important;
    font-family: inherit !important;
    line-height: 1.2 !important;
    border: 2px solid transparent !important;
    letter-spacing: .01em !important;
    text-decoration: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    box-shadow: none !important;
}

.rpe-wrap .rpe-btn:disabled {
    opacity: .45 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

.rpe-wrap .rpe-btn-prev {
    background: #fff !important;
    color: var(--rpe-muted) !important;
    border-color: var(--rpe-border) !important;
}

.rpe-wrap .rpe-btn-prev:hover:not(:disabled),
.rpe-wrap .rpe-btn-prev:focus:not(:disabled) {
    border-color: var(--rpe-dark) !important;
    color: var(--rpe-dark) !important;
    background: var(--rpe-light) !important;
    transform: translateX(-2px) !important;
    box-shadow: none !important;
}

.rpe-wrap .rpe-btn-next,
.rpe-wrap .rpe-btn-submit {
    background: var(--rpe-accent) !important;
    color: #fff !important;
    border-color: var(--rpe-accent) !important;
    margin-left: auto !important;
    box-shadow: 0 4px 14px rgba(42,157,143,.30) !important;
}

.rpe-wrap .rpe-btn-next:hover:not(:disabled),
.rpe-wrap .rpe-btn-next:focus:not(:disabled),
.rpe-wrap .rpe-btn-submit:hover:not(:disabled),
.rpe-wrap .rpe-btn-submit:focus:not(:disabled) {
    background: var(--rpe-dark) !important;
    color: #fff !important;
    border-color: var(--rpe-dark) !important;
    box-shadow: 0 6px 18px rgba(26,74,74,.30) !important;
    transform: translateY(-1px) !important;
}

.rpe-wrap .rpe-btn-next:active:not(:disabled),
.rpe-wrap .rpe-btn-submit:active:not(:disabled) {
    transform: translateY(0) !important;
    box-shadow: none !important;
}

/* ── Error message ──────────────────────────────────────────────────────────── */
.rpe-error-msg {
    margin-top: 16px;
    padding: 12px 16px;
    background: #fdf2f2;
    border: 1.5px solid #f5c6c6;
    border-radius: 10px;
    color: var(--rpe-error);
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ── Success message ────────────────────────────────────────────────────────── */
.rpe-success-wrap {
    text-align: center;
    padding: 50px 30px;
}

.rpe-success-icon-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: var(--rpe-accent);
    color: #fff;
    font-size: 32px;
    margin: 0 auto 20px;
    box-shadow: 0 8px 24px rgba(42,157,143,.35);
}

.rpe-success-title {
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--rpe-dark);
    margin-bottom: 10px;
    letter-spacing: -.02em;
}

.rpe-success-text {
    font-size: 15px;
    color: var(--rpe-muted);
    max-width: 440px;
    margin: 0 auto;
    line-height: 1.6;
}

/* ── Responsive ─────────────────────────────────────────────────────────────── */

@media (max-width: 640px) {
    .rpe-radio-cards {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
    }

    .rpe-radio-card {
        padding: 14px 8px;
    }

    .rpe-card-icon {
        font-size: 24px;
    }

    .rpe-card-label {
        font-size: 12px;
    }

    .rpe-fields-grid {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }

    .rpe-salle-cards {
        grid-template-columns: 1fr 1fr;
    }

    .rpe-pack-cards {
        grid-template-columns: 1fr;
    }

    .rpe-fields-row {
        flex-direction: column;
        gap: 0;
    }

    .rpe-wrap .rpe-btn {
        padding: 11px 20px !important;
        font-size: 14px !important;
    }

    .rpe-recap-totals {
        padding: 16px;
    }
}

@media (max-width: 420px) {
    .rpe-radio-cards {
        grid-template-columns: repeat(2, 1fr);
    }

    .rpe-fields-grid {
        grid-template-columns: 1fr;
    }

    .rpe-salle-cards {
        grid-template-columns: 1fr;
    }
}

/* =============================================================================
   Flatpickr – thème Raiffeisen Parc
============================================================================= */

/* Input altInput généré par Flatpickr — les styles visuels sont sur .rpe-date-alt */
.rpe-wrap .flatpickr-input.form-control,
.rpe-wrap input.flatpickr-input[readonly] {
    cursor: pointer;
}

/* Conteneur principal du calendrier */
.flatpickr-calendar {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    border: 1.5px solid #cde4e1 !important;
    border-radius: 14px !important;
    box-shadow: 0 8px 32px rgba(26,74,74,.14) !important;
    padding: 10px !important;
    width: 310px !important;
}

/* En-tête mois / année */
.flatpickr-months {
    padding: 4px 0 8px;
    align-items: center;
}

.flatpickr-month {
    height: 36px !important;
    line-height: 36px;
    color: #1a4a4a !important;
}

.flatpickr-current-month {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #1a4a4a !important;
    padding-top: 4px !important;
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
    font-weight: 700;
    color: #1a4a4a;
    appearance: none;
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 15px;
}

.flatpickr-current-month input.cur-year {
    font-weight: 700 !important;
    color: #1a4a4a !important;
    font-size: 15px !important;
}

/* Flèches navigation */
.flatpickr-prev-month,
.flatpickr-next-month {
    color: #2a9d8f !important;
    fill: #2a9d8f !important;
    padding: 6px 10px !important;
    border-radius: 8px !important;
    transition: background .2s !important;
    top: 10px !important;
}

.flatpickr-prev-month:hover,
.flatpickr-next-month:hover {
    background: #e8f5f3 !important;
    color: #1a4a4a !important;
    fill: #1a4a4a !important;
}

.flatpickr-prev-month svg,
.flatpickr-next-month svg {
    stroke: currentColor;
    fill: none;
}

/* Jours de la semaine */
.flatpickr-weekdays {
    background: transparent !important;
    margin-bottom: 4px;
}

span.flatpickr-weekday {
    background: transparent !important;
    color: #5c7070 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .04em;
    text-transform: uppercase;
}

/* Grille des jours */
.flatpickr-days {
    width: 100% !important;
}

.dayContainer {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
}

.flatpickr-day {
    border-radius: 8px !important;
    color: #1c2e2e !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    height: 36px !important;
    line-height: 36px !important;
    max-width: 36px !important;
    transition: background .15s, color .15s !important;
    border: none !important;
}

.flatpickr-day:hover:not(.flatpickr-disabled):not(.selected) {
    background: #e8f5f3 !important;
    color: #1a4a4a !important;
    border: none !important;
}

.flatpickr-day.today {
    background: #f0f7f6 !important;
    color: #2a9d8f !important;
    font-weight: 800 !important;
    border: 1.5px solid #cde4e1 !important;
}

.flatpickr-day.today:hover {
    background: #e8f5f3 !important;
    color: #1a4a4a !important;
}

.flatpickr-day.selected,
.flatpickr-day.selected:hover {
    background: #2a9d8f !important;
    color: #fff !important;
    border: none !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 8px rgba(42,157,143,.35) !important;
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
    color: #c8d8d8 !important;
    background: transparent !important;
}

.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
    color: #b0c4c2 !important;
}

/* Input altInput (champ affiché à l'utilisateur) */
.flatpickr-input ~ .flatpickr-input.form-control,
input.flatpickr-input.form-control {
    background-color: #fff;
}

/* =============================================================================
   Tunnel selection cards (step 1)
   ============================================================================= */
.rpe-tunnel-intro {
    color: var(--rpe-muted);
    font-size: 14px;
    margin: 0 0 24px;
    line-height: 1.5;
}

.rpe-tunnel-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}

.rpe-tunnel-card {
    cursor: pointer;
    display: block;
}

.rpe-tunnel-card input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.rpe-tunnel-card-inner {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    border: 2px solid var(--rpe-border);
    border-radius: 18px;
    padding: 0;
    background: #fff;
    transition: border-color .18s, box-shadow .18s, background .18s, transform .15s;
    text-align: center;
    overflow: hidden;
    height: 100%;
}

.rpe-tunnel-card:hover .rpe-tunnel-card-inner {
    border-color: var(--rpe-accent);
    box-shadow: 0 6px 24px rgba(42,157,143,.14);
    transform: translateY(-2px);
}

.rpe-tunnel-card.rpe-selected .rpe-tunnel-card-inner {
    border-color: var(--rpe-accent);
    background: #f6fcfb;
    box-shadow: 0 0 0 4px rgba(42,157,143,.14), 0 6px 24px rgba(42,157,143,.12);
    transform: translateY(-2px);
}

/* Icon zone */
.rpe-tunnel-card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--rpe-light);
    margin: 32px auto 0;
    transition: background .18s;
    flex-shrink: 0;
}

.rpe-tunnel-card:hover .rpe-tunnel-card-icon,
.rpe-tunnel-card.rpe-selected .rpe-tunnel-card-icon {
    background: rgba(42,157,143,.12);
}

.rpe-tunnel-card-icon svg {
    width: 28px;
    height: 28px;
    color: var(--rpe-accent);
    stroke: var(--rpe-accent);
    transition: stroke .18s;
}

.rpe-tunnel-card:hover .rpe-tunnel-card-icon svg,
.rpe-tunnel-card.rpe-selected .rpe-tunnel-card-icon svg {
    stroke: var(--rpe-dark);
}

/* Body */
.rpe-tunnel-card-body {
    padding: 16px 22px 28px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    width: 100%;
}

/* Capacity badge */
.rpe-tunnel-capacity-badge {
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    padding: 3px 10px;
    border-radius: 99px;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.rpe-tunnel-capacity-badge--small {
    background: #e8f4ff;
    color: #2060a0;
}

.rpe-tunnel-capacity-badge--large {
    background: #e8f9f5;
    color: #1a6050;
}

.rpe-tunnel-capacity-badge--group {
    background: #fff3e0;
    color: #8a4a10;
}

.rpe-tunnel-title {
    font-size: 20px;
    font-weight: 800;
    color: var(--rpe-dark);
    margin: 0 0 8px;
    line-height: 1.2;
    letter-spacing: -.01em;
}

.rpe-tunnel-desc {
    font-size: 13px;
    color: var(--rpe-muted);
    margin: 0 0 18px;
    line-height: 1.5;
}

.rpe-tunnel-features {
    list-style: none;
    margin: 16px 0 0;
    padding: 16px 0 0;
    display: flex;
    flex-direction: column;
    gap: 7px;
    border-top: 1px solid var(--rpe-border);
    width: 100%;
    text-align: left;
}

.rpe-tunnel-features li {
    font-size: 13px;
    color: #3a4a4a;
    padding-left: 22px;
    position: relative;
    line-height: 1.45;
}

.rpe-tunnel-features li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--rpe-accent);
    font-weight: 800;
    font-size: 12px;
    top: 1px;
}

/* Selection check indicator */
.rpe-tunnel-check {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 2px solid var(--rpe-border);
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: transparent;
    transition: all .18s;
    flex-shrink: 0;
}

.rpe-tunnel-card.rpe-selected .rpe-tunnel-check {
    background: var(--rpe-accent);
    border-color: var(--rpe-accent);
    color: #fff;
}

/* =============================================================================
   F&B – Food & Beverage (step 7)
   ============================================================================= */
.rpe-fnb-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.rpe-fnb-row {
    border: 2px solid #d8e8e5;
    border-radius: 10px;
    overflow: hidden;
    transition: border-color .15s;
}

.rpe-fnb-row:has(.rpe-fnb-check:checked) {
    border-color: #2a9d8f;
    background: #f0faf8;
}

.rpe-fnb-label {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    cursor: pointer;
    width: 100%;
    margin: 0;
}

.rpe-fnb-label input[type="checkbox"] {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    accent-color: #2a9d8f;
    cursor: pointer;
    margin: 0;
}

.rpe-fnb-content {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.rpe-fnb-name {
    font-size: 15px;
    font-weight: 600;
    color: #1a4a4a;
    line-height: 1.3;
}

.rpe-fnb-desc {
    font-size: 13px;
    color: #2a9d8f;
    line-height: 1.4;
}

.rpe-fnb-included {
    display: inline-block;
    margin-left: 6px;
    font-size: 12px;
    font-weight: 700;
    color: #2a9d8f;
}

.rpe-fnb-locked .rpe-fnb-label {
    cursor: default;
}

.rpe-fnb-locked input[type="checkbox"] {
    accent-color: #2a9d8f;
    opacity: 1;
}

/* =============================================================================
   Toggle "Ne sait pas si nécessaire" (step 2 – montage / démontage)
   ============================================================================= */
.rpe-nsp-toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    cursor: pointer;
    user-select: none;
    padding: 8px 14px;
    border-radius: 8px;
    border: 1.5px solid #d8e8e5;
    background: #f8fbfb;
    transition: border-color .18s, background .18s;
    width: fit-content;
}

.rpe-nsp-toggle:hover {
    border-color: #2a9d8f;
    background: #f0faf8;
}

/* Hide native checkbox */
.rpe-nsp-toggle input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

/* Toggle track */
.rpe-nsp-track {
    position: relative;
    flex-shrink: 0;
    width: 36px;
    height: 20px;
    border-radius: 10px;
    background: #c8d8d6;
    transition: background .2s;
}

/* Toggle thumb */
.rpe-nsp-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: left .2s, box-shadow .2s;
}

/* Checked state */
.rpe-nsp-toggle input:checked ~ .rpe-nsp-track {
    background: #2a9d8f;
}

.rpe-nsp-toggle input:checked ~ .rpe-nsp-track .rpe-nsp-thumb {
    left: 19px;
    box-shadow: 0 1px 4px rgba(42,157,143,.4);
}

/* Active border when checked */
.rpe-nsp-toggle:has(input:checked) {
    border-color: #2a9d8f;
    background: #f0faf8;
}

/* Label text */
.rpe-nsp-text {
    font-size: 13px;
    font-weight: 500;
    color: #445;
    transition: color .18s;
    line-height: 1;
}

.rpe-nsp-toggle:has(input:checked) .rpe-nsp-text {
    color: #1a4a4a;
}

/* Admin tunnel badges */
.rpe-badge-small { background: #e8f5ff; color: #1a4a8a; }
.rpe-badge-large { background: #e8fff5; color: #1a4a4a; }
.rpe-badge-group { background: #fff3e8; color: #7a4a10; }

/* Loge note */
.rpe-loge-note {
    font-size: 11px;
    color: #2a9d8f;
    margin-top: 10px;
    font-style: italic;
    line-height: 1.4;
    border-top: 1px solid #d0ece9;
    padding-top: 8px;
}

/* =============================================================================
   3-tunnel card layout (step 1)
   ============================================================================= */
.rpe-tunnel-cards--3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    align-items: stretch;
}

@media (max-width: 680px) {
    .rpe-tunnel-cards--3 {
        grid-template-columns: 1fr;
    }
}

/* Legacy subtitle class (kept for compatibility) */
.rpe-tunnel-subtitle {
    font-size: 12px;
    font-weight: 600;
    color: var(--rpe-accent);
    margin: -4px 0 10px;
    letter-spacing: .02em;
}

/* =============================================================================
   Activity option duration badge
   ============================================================================= */
.rpe-option-duration {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: var(--rpe-muted);
    background: var(--rpe-light);
    border: 1px solid var(--rpe-border);
    border-radius: 99px;
    padding: 2px 8px;
    white-space: nowrap;
    flex-shrink: 0;
    align-self: center;
}

/* =============================================================================
   Group – Boissons radio options (step 10)
   ============================================================================= */
.rpe-group-boissons-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 20px;
}

.rpe-group-boissons-option {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 16px;
    border: 1.5px solid var(--rpe-border);
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    transition: border-color .18s, background .18s, box-shadow .18s;
    user-select: none;
}

.rpe-group-boissons-option:hover {
    border-color: #9dc8c4;
    background: #fafefe;
}

.rpe-group-boissons-option input[type="radio"] {
    accent-color: var(--rpe-accent);
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    cursor: pointer;
}

.rpe-group-boissons-option:has(input:checked) {
    border-color: var(--rpe-accent);
    background: #edf8f6;
    box-shadow: 0 2px 10px rgba(42,157,143,.10);
}

.rpe-boissons-label {
    font-size: 14px;
    font-weight: 600;
    color: var(--rpe-text);
}

.rpe-boissons-desc {
    font-size: 12px;
    color: var(--rpe-muted);
    margin-top: 1px;
}

/* =============================================================================
   Group – Service option
   ============================================================================= */
.rpe-group-service-list {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.rpe-group-service-option {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border: 1.5px solid var(--rpe-border);
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    transition: border-color .18s, background .18s;
    font-size: 14px;
    font-weight: 600;
    color: var(--rpe-text);
    user-select: none;
}

.rpe-group-service-option input[type="radio"] {
    accent-color: var(--rpe-accent);
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.rpe-group-service-option:has(input:checked) {
    border-color: var(--rpe-accent);
    background: #edf8f6;
}

/* =============================================================================
   Pizzeria details section
   ============================================================================= */
.rpe-pizzeria-details {
    margin-top: 12px;
    padding: 16px;
    background: var(--rpe-light);
    border: 1.5px solid var(--rpe-border);
    border-radius: 10px;
}

/* =============================================================================
   Client type cards (step 12)
   ============================================================================= */
.rpe-client-type-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-bottom: 24px;
}

@media (max-width: 480px) {
    .rpe-client-type-cards {
        grid-template-columns: 1fr;
    }
}

.rpe-client-type-card {
    cursor: pointer;
    display: block;
}

.rpe-client-type-card input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.rpe-client-type-card-inner {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    border: 2px solid var(--rpe-border);
    border-radius: 14px;
    background: #fff;
    transition: border-color .18s, background .18s, box-shadow .18s;
    width: 100%;
    box-sizing: border-box;
}

.rpe-client-type-name,
.rpe-client-type-desc {
    display: block;
}

.rpe-client-type-card:hover .rpe-client-type-card-inner {
    border-color: var(--rpe-accent);
    background: var(--rpe-light);
    box-shadow: 0 4px 12px rgba(42,157,143,.12);
}

.rpe-client-type-card.rpe-selected .rpe-client-type-card-inner {
    border-color: var(--rpe-accent);
    background: #e8f5f3;
    box-shadow: 0 0 0 3px rgba(42,157,143,.18);
}

.rpe-client-type-icon {
    font-size: 26px;
    line-height: 1;
    flex-shrink: 0;
}

.rpe-client-type-name {
    font-size: 15px;
    font-weight: 700;
    color: var(--rpe-dark);
    margin-bottom: 2px;
}

.rpe-client-type-desc {
    font-size: 12px;
    color: var(--rpe-muted);
    line-height: 1.4;
}

/* =============================================================================
   Billing address section subtitle
   ============================================================================= */
.rpe-subsection-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--rpe-muted);
    text-transform: uppercase;
    letter-spacing: .06em;
    margin: 20px 0 12px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--rpe-border);
}

/* =============================================================================
   Recap: group sections
   ============================================================================= */
.rpe-recap-activities-list,
.rpe-recap-group-food-list {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.rpe-recap-activities-list span,
.rpe-recap-group-food-list span {
    font-size: 13px;
    color: var(--rpe-text);
}

/* =============================================================================
   Verrou « mode développement »
============================================================================= */
.rpe-lock-gate {
    max-width: 460px;
    margin: 0 auto;
    text-align: center;
}

.rpe-lock-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 76px;
    height: 76px;
    margin: 0 auto 18px;
    border-radius: 50%;
    background: var(--rpe-light);
    color: var(--rpe-accent);
}

.rpe-lock-title {
    font-size: clamp(1.25rem, 1.05rem + 1vw, 1.55rem);
    font-weight: 800;
    color: var(--rpe-dark);
    margin: 0 0 8px;
    letter-spacing: -.02em;
}

.rpe-lock-text {
    font-size: 14px;
    color: var(--rpe-muted);
    line-height: 1.5;
    margin: 0 auto 22px;
    max-width: 360px;
}

.rpe-lock-form {
    display: flex;
    gap: 10px;
    max-width: 380px;
    margin: 0 auto;
}

.rpe-lock-form .rpe-input {
    flex: 1;
    min-width: 0;
}

.rpe-lock-form .rpe-btn-submit {
    flex-shrink: 0;
    white-space: nowrap;
}

.rpe-lock-gate .rpe-error-msg {
    margin-top: 14px;
}

@media (max-width: 480px) {
    .rpe-lock-form {
        flex-direction: column;
    }
    .rpe-lock-form .rpe-btn-submit {
        width: 100%;
    }
}

/* =============================================================================
   Polish responsive global (PC / tablette / mobile)
   NB : la plage tablette (601–820) évite tout conflit de cascade avec les
   media queries max-width plus étroites définies plus haut.
============================================================================= */

/* ── Tablette ──────────────────────────────────────────────────────────────── */
@media (min-width: 601px) and (max-width: 820px) {
    .rpe-form-card {
        padding: 32px 28px 28px;
    }
    .rpe-progress-wrap {
        margin-bottom: 26px;
    }
    .rpe-step-divider {
        margin: 12px 0 24px;
    }
}

/* ── Navigation mobile : la brochure passe sur sa propre ligne ─────────────── */
@media (max-width: 560px) {
    .rpe-nav {
        flex-wrap: wrap;
        gap: 10px;
    }
    .rpe-wrap .rpe-btn-prev {
        order: 1;
    }
    .rpe-wrap .rpe-btn-next,
    .rpe-wrap .rpe-btn-submit {
        order: 2;
    }
    .rpe-brochure-link {
        order: 3;
        width: 100%;
        justify-content: center;
    }
    /* Boutons confortables au pouce */
    .rpe-wrap .rpe-btn-next,
    .rpe-wrap .rpe-btn-submit,
    .rpe-wrap .rpe-btn-prev {
        flex: 1;
        justify-content: center !important;
    }
}

/* ── Très petits écrans ────────────────────────────────────────────────────── */
@media (max-width: 400px) {
    .rpe-wrap {
        padding: 0 10px 48px;
    }
    .rpe-form-card {
        padding: 20px 16px 20px;
        border-radius: 14px;
    }
    .rpe-wrap .rpe-btn {
        padding: 11px 14px !important;
        font-size: 13.5px !important;
    }
    .rpe-total-bar {
        padding: 11px 14px;
    }
    .rpe-option-price {
        font-size: 12.5px;
    }
}