/**
 * APC Pilates Manager — Frontend Styles
 */

/* ── Base ──────────────────────────────────── */
.apc-loading {
    color: #888;
    font-style: italic;
}

.apc-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border: none;
    border-radius: 30px;
    cursor: pointer;
    font-size: 0.9em;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s, opacity 0.2s;
    /* Le padding fait partie de la largeur, sinon un width:100% (modal d'auth,
       boutons pleins largeur mobile, etc.) déborde de son conteneur. */
    box-sizing: border-box;
}

.apc-btn .elementor-button-icon {
    display: inline-flex;
    align-items: center;
}

.apc-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.apc-btn-primary {
    background: var(--apc-primary, #6d28d9);
    color: #fff;
}

.apc-btn-primary:hover {
    background: var(--apc-primary-hover, #5b21b6);
}

.apc-btn-nav {
    background: #f3f4f6;
    color: #333;
    border: 1px solid #d1d5db;
}

.apc-btn-nav:hover {
    background: #e5e7eb;
}

.apc-btn-reserver {
    background: var(--apc-primary, #6d28d9);
    color: #fff;
    width: 100%;
    margin-top: 8px;
}

.apc-btn-attente {
    background: var(--apc-accent, #f59e0b);
    color: #fff;
    width: 100%;
    margin-top: 8px;
}

/* ── Planning ──────────────────────────────── */
.apc-planning-wrapper {
    max-width: 1000px;
    margin: 0 auto;
}

/* Bannière visiteur (planning public, réservation membres) */
.apc-planning-guest-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    background: #f8f7ff;
    border: 1px solid #e5e1f7;
    border-left: 4px solid var(--apc-primary, #6d28d9);
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 16px;
    font-size: 0.92em;
    color: #4b5563;
}
.apc-planning-guest-actions {
    display: inline-flex;
    gap: 8px;
    flex: 0 0 auto;
}
.apc-btn-sm {
    padding: 6px 14px !important;
    font-size: 0.85em !important;
}
/* Mobile : la bannière passe en colonne et les boutons s'empilent
   en pleine largeur pour qu'aucun ne soit tronqué. */
@media (max-width: 600px) {
    .apc-planning-guest-banner {
        flex-direction: column;
        align-items: stretch;
    }
    .apc-planning-guest-actions {
        display: flex;
        flex-direction: column;
        gap: 8px;
        width: 100%;
    }
    .apc-planning-guest-actions .apc-btn {
        width: 100%;
        justify-content: center;
        box-sizing: border-box;
    }
}

.apc-planning-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    gap: 12px;
}

.apc-planning-header h2 {
    font-size: 1.1em;
    text-align: center;
    flex: 1;
}

.apc-planning-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
}

.apc-cours-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 14px;
    border-left: 4px solid var(--apc-primary, #6d28d9);
    transition: box-shadow 0.2s;
}

.apc-cours-card:hover {
    box-shadow: 0 2px 12px rgba(109, 40, 217, 0.12);
}

/* Discipline colors */
.apc-discipline-pilates    { border-left-color: var(--apc-primary, #6d28d9); }
.apc-discipline-yoga       { border-left-color: var(--apc-success, #059669); }
.apc-discipline-cardio_dance_walk { border-left-color: var(--apc-danger, #dc2626); }

.apc-cours-jour {
    font-weight: 700;
    font-size: 0.85em;
    color: #6b7280;
}

.apc-cours-heure {
    font-size: 1.1em;
    font-weight: 700;
    margin: 4px 0;
}

.apc-cours-discipline {
    font-size: 1em;
    font-weight: 600;
    color: #1f2937;
}

.apc-cours-niveau,
.apc-cours-format {
    font-size: 0.85em;
    color: #6b7280;
}

.apc-cours-places {
    margin-top: 6px;
    font-size: 0.85em;
}

.apc-places {
    color: var(--apc-success, #059669);
    font-weight: 600;
}

.apc-badge-complet {
    background: #fee2e2;
    color: #991b1b;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 0.75em;
    font-weight: 600;
}

.apc-planning-cta {
    text-align: center;
    margin-top: 24px;
    padding: 20px;
    background: var(--apc-primary-light, #f8f7ff);
    border-radius: 10px;
}

.apc-cta-buttons {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 12px;
}

/* ── Forfaits grid ─────────────────────────── */
.apc-abonnement-wrapper {
    max-width: 1100px;
    margin: 0 auto;
}

.apc-forfaits-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin: 24px 0;
    align-items: stretch;
}

@media (max-width: 900px) {
    .apc-forfaits-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
    .apc-forfaits-grid { grid-template-columns: 1fr; }
}

.apc-forfait-card {
    position: relative;
    background: #fff;
    border: 2px solid #e5e7eb;
    border-radius: 16px;
    padding: 28px 24px 24px;
    text-align: center;
    transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* Uniformiser les hauteurs de chaque zone via grid subgrid-like */
}

.apc-forfait-card:hover {
    border-color: var(--apc-primary, #6d28d9);
    box-shadow: 0 8px 24px rgba(109, 40, 217, 0.12);
    transform: translateY(-4px);
}

.apc-forfait-highlight {
    border-color: var(--apc-primary, #6d28d9);
    box-shadow: 0 4px 16px rgba(109, 40, 217, 0.15);
}

.apc-forfait-badge {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--apc-primary, #6d28d9);
    color: #fff;
    font-size: 0.75em;
    font-weight: 700;
    padding: 4px 14px;
    border-radius: 20px;
    white-space: nowrap;
}

.apc-forfait-header {
    height: 56px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.apc-forfait-header h3 {
    margin: 0;
    font-size: 1.55em;
    font-weight: 400;
    color: var(--apc-primary, #6d28d9);
    line-height: 1.2;
    text-align: center;
}

.apc-forfait-prix {
    font-size: 2em;
    font-weight: 400;
    color: #9ca3af;
    line-height: 1;
    margin: 8px 0 20px;
}

.apc-forfait-prix small {
    font-size: 0.45em;
    font-weight: 400;
    color: #9ca3af;
}

.apc-forfait-annuel {
    font-size: 0.8em;
    color: #9ca3af;
    margin-bottom: 12px;
}

.apc-forfait-divider {
    width: 40px;
    height: 3px;
    background: #e5e7eb;
    border-radius: 2px;
    margin: 8px 0 16px;
}

.apc-forfait-features {
    list-style: none;
    padding: 0;
    margin: 0 0 16px;
    font-size: 0.9em;
    color: #374151;
    text-align: left;
    width: 100%;
    flex: 1;
}

.apc-forfait-features li {
    padding: 6px 0;
    border-bottom: 1px solid #f3f4f6;
}

.apc-forfait-features li:last-child {
    border-bottom: none;
}

.apc-forfait-tags {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 16px;
    min-height: 30px;
    align-items: center;
}

.apc-tag {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 0.75em;
    font-weight: 600;
}

.apc-tag-salle  { background: color-mix(in srgb, var(--apc-primary, #6d28d9) 12%, white); color: var(--apc-primary-hover, #5b21b6); }
.apc-tag-visio  { background: #dbeafe; color: #1e40af; }
.apc-tag-replay { background: #d1fae5; color: #065f46; }

.apc-forfait-card .apc-btn-choisir {
    width: auto;
    min-width: 160px;
    margin-top: auto;
    padding: 12px 28px;
    font-size: 0.95em;
    border-radius: 999px;
    align-self: center;
}

/* ── Avantages dans les cartes forfait ─────────
   Réaligne la liste à gauche (la carte est centrée),
   force le flex sur chaque item, l'icône reste à gauche du texte. */
.apc-forfait-card .elementor-icon-list-items {
    list-style: none;
    padding: 0;
    margin: 16px 0 24px;
    width: 100%;
    flex: 1;
    text-align: left;
}

.apc-forfait-card .elementor-icon-list-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 5px 0;
    font-size: 0.92em;
    color: #374151;
    line-height: 1.45;
}

.apc-forfait-card .elementor-icon-list-icon {
    flex-shrink: 0;
    color: var(--apc-primary, #6d28d9);
    line-height: 1.45;
    margin-top: 1px;
}

.apc-forfait-card .elementor-icon-list-text {
    flex: 1;
    text-align: left;
}


/* ── Disciplines grid ─────────────────────── */
.apc-disciplines-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin: 24px 0;
}

.apc-discipline-card {
    background: #fff;
    border: 2px solid #e5e7eb;
    border-radius: 16px;
    padding: 32px 24px 24px;
    text-align: center;
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
}

.apc-discipline-card:hover {
    border-color: var(--apc-primary, #6d28d9);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
    transform: translateY(-3px);
}

.apc-discipline-icon {
    font-size: 2.5em;
    margin-bottom: 8px;
}

.apc-discipline-image {
    width: 100%;
    max-width: 140px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 12px;
    margin: 0 auto 12px;
    display: block;
}

.apc-discipline-card h3 {
    margin: 0 0 16px;
    font-size: 1.1em;
    color: #1f2937;
}

/* ── Steps (abonnement) ──────────────────── */
.apc-step h2 {
    text-align: center;
    color: #1f2937;
    margin-bottom: 8px;
}

.apc-recap {
    background: var(--apc-primary-light, #f8f7ff);
    border: 1px solid #e0d9f7;
    border-radius: 10px;
    padding: 16px;
    text-align: center;
    margin-bottom: 20px;
}

.apc-paiement-mode {
    margin-bottom: 20px;
}

.apc-paiement-mode h3 {
    font-size: 1em;
    margin-bottom: 10px;
}

.apc-payment-container {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 16px;
}

.apc-payment-container label {
    font-weight: 600;
    font-size: 0.9em;
    display: block;
    margin-bottom: 8px;
}

/* ── Mon Espace ────────────────────────────── */
.apc-espace-wrapper {
    max-width: 900px;
    margin: 0 auto;
}

.apc-section {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 20px;
}

.apc-section h3 {
    margin-top: 0;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--apc-primary, #6d28d9);
}

/* ── Inscription form ──────────────────────── */
.apc-form {
    max-width: 700px;
}

/* Desktop : label à gauche, champ à droite (flex row).
   Mobile (≤ 768px) : layout vertical (label au-dessus du champ). */
.apc-form-row {
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 16px;
}

/* Les règles du mot de passe — placées dans une ligne SÉPARÉE sous le champ
   (markup : <div class="apc-password-rules-row"><ul id="apc-password-rules">…</ul></div>) */
.apc-password-rules-row {
    margin: 6px 0 14px 196px; /* 180 (label) + 16 (gap) → alignement vertical sous le champ */
}
@media (max-width: 768px) {
    .apc-password-rules-row { margin-left: 0; }
}
/* Coloration des règles MDP : gris par défaut, vert + gras + ✓ quand validé.
   !important pour résister aux thèmes qui forcent une couleur sur <li>. */
#apc-password-rules li         { color: #9ca3af !important; }
#apc-password-rules li.is-ok   { color: #059669 !important; font-weight: 600; }
#apc-password-rules .apc-pw-mark { display: inline-block; width: 1em; }

.apc-form-row label {
    flex: 0 0 180px;
    font-weight: 600;
    font-size: 0.95em;
    margin: 0;
    text-align: right;
}

.apc-form-row input[type="text"],
.apc-form-row input[type="email"],
.apc-form-row input[type="tel"],
.apc-form-row input[type="password"] {
    flex: 1;
    width: auto;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.95em;
}

/* Le bouton submit prend la place du champ → décalé sous le label */
.apc-form-row > button[type="submit"] {
    margin-left: 196px; /* 180 (label) + 16 (gap) */
}

/* Checkbox RGPD — Grid 2 colonnes (case 24px / texte 1fr).
   Grid imposé avec !important pour court-circuiter les thèmes hostiles
   (text-align:center, label display:block, input width:100%, etc.). */
.apc-form-row.apc-form-checkbox {
    display: grid !important;
    grid-template-columns: 24px 1fr !important;
    gap: 10px !important;
    align-items: start !important;
    margin-bottom: 14px;
}

.apc-form-row.apc-form-checkbox > input[type="checkbox"] {
    grid-column: 1 !important;
    justify-self: start !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    margin: 3px 0 0 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    flex: none !important;
}

.apc-form-row.apc-form-checkbox > label {
    grid-column: 2 !important;
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    font-weight: 400 !important;
    font-size: 0.9em !important;
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.5 !important;
}

/* Responsive — mobile : label au-dessus du champ */
@media (max-width: 768px) {
    .apc-form-row {
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
    }
    .apc-form-row label {
        flex: none;
        text-align: left;
    }
    .apc-form-row > button[type="submit"] {
        margin-left: 0;
    }
    /* La checkbox RGPD garde son grid 2 colonnes même sur mobile */
    .apc-form-row.apc-form-checkbox {
        display: grid !important;
        grid-template-columns: 24px 1fr !important;
        flex-direction: unset !important;
    }
}

.apc-message {
    padding: 10px 14px;
    border-radius: 6px;
    margin-top: 10px;
}

/* ── Replays / VOD ─────────────────────────── */
.apc-replays-wrapper,
.apc-vod-wrapper {
    max-width: 1000px;
    margin: 0 auto;
}

.apc-replays-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
}

.apc-replay-player {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px;
    margin-top: 16px;
}

.apc-replay-player-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}

.apc-replay-player-header h3 { margin: 0; min-width: 0; flex: 1 1 auto; }

/* Le bouton Fermer reste sur une seule ligne (la croix ne passe pas à la ligne) */
#apc-replay-close {
    flex: 0 0 auto;
    white-space: nowrap;
}

.apc-replay-player iframe {
    width: 100%;
    aspect-ratio: 16/9;
    border: none;
    border-radius: 8px;
}

.apc-replay-expire {
    font-size: 0.85em;
    color: #6b7280;
    margin-top: 8px;
}

/* ── Discipline filters ───────────────────── */
.apc-discipline-filters {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
    flex-wrap: wrap;
    justify-content: center;
    padding: 12px 16px;
    background: var(--apc-primary-light, #f8f7ff);
    border-radius: 10px;
    border: 1px solid #e0d9f7;
}

.apc-btn-filter {
    background: #fff;
    color: #374151;
    border: 1px solid #d1d5db;
    padding: 8px 18px;
    font-size: 0.9em;
    border-radius: 20px;
}

.apc-btn-filter.active {
    background: var(--apc-primary, #6d28d9);
    color: #fff;
    border-color: var(--apc-primary, #6d28d9);
}

.apc-btn-filter:hover:not(.active) {
    background: #ede9fe;
    border-color: var(--apc-primary, #6d28d9);
    color: var(--apc-primary, #6d28d9);
}

/* ── Reservation modal ───────────────────── */
.apc-modal-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    /* Scroll de l'overlay si la boîte est plus haute que l'écran (filet de sécurité) */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
/* Sur mobile, on aligne en haut pour que le début du modal reste accessible
   quand le contenu dépasse de la viewport, sans nécessiter de défilement. */
@media (max-width: 600px) {
    .apc-modal-overlay {
        align-items: flex-start;
        padding: 12px;
    }
}

.apc-modal-box {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    width: 420px;
    max-width: 100%;
    /* Hauteur limitée à l'écran (moins le padding de l'overlay)
       et défilement interne de la boîte si le contenu dépasse. */
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
}
@media (max-width: 600px) {
    .apc-modal-box {
        max-height: calc(100vh - 24px);
        padding: 20px 18px;
    }
}

.apc-modal-box h3 {
    margin: 0 0 8px 0;
    color: #1f2937;
}

.apc-resa-types {
    margin: 16px 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.apc-resa-type-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    transition: border-color 0.2s;
}

.apc-resa-type-option:has(input:checked) {
    border-color: var(--apc-primary, #6d28d9);
    background: var(--apc-primary-light, #f8f7ff);
}

.apc-resa-type-option input[type="radio"] {
    accent-color: var(--apc-primary, #6d28d9);
}

#apc-resa-stripe-container {
    margin: 12px 0;
    padding: 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}

#apc-card-element {
    padding: 10px 0;
}

.apc-error-text {
    color: var(--apc-danger, #dc2626);
    font-size: 0.85em;
    margin-top: 4px;
}

.apc-modal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}
.apc-modal-actions .apc-btn {
    box-sizing: border-box;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
}
/* Sur mobile : boutons empilés et pleine largeur (sinon ils débordent / sont coupés) */
@media (max-width: 767px) {
    .apc-modal-actions {
        flex-direction: column;
        align-items: stretch;
    }
    .apc-modal-actions .apc-btn {
        width: 100%;
        max-width: 100%;
        white-space: normal;
    }
}

.apc-message-success {
    background: #d1fae5;
    color: #065f46;
    border-left: 4px solid #059669;
    padding: 14px 18px;
    line-height: 1.55;
}

.apc-message-error {
    background: #fee2e2;
    color: #991b1b;
    border-left: 4px solid #dc2626;
    padding: 14px 18px;
}

/* ── Options rattrapage ───────────────────── */
.apc-rattrapage-options {
    list-style: none;
    padding: 0;
    margin: 12px 0;
}

.apc-rattrapage-options li {
    padding: 10px 12px;
    margin-bottom: 8px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 0.9em;
    line-height: 1.5;
}

.apc-rattrapage-options li strong {
    text-transform: capitalize;
    color: var(--apc-primary, #6d28d9);
}

/* ── Changement forfait ───────────────────── */
.apc-changement-options {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 16px 0;
}

.apc-forfait-option {
    padding: 14px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    transition: border-color 0.2s;
}

.apc-forfait-option:hover {
    border-color: var(--apc-primary, #6d28d9);
}

.apc-btn-danger {
    background: #fff;
    color: var(--apc-danger, #dc2626);
    border: 1px solid var(--apc-danger, #dc2626);
}

.apc-btn-danger:hover {
    background: var(--apc-danger, #dc2626);
    color: #fff;
}

.apc-abo-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.apc-btn-success {
    background: var(--apc-success, #059669) !important;
}

/* ── Mobile / Tablette : alignement responsive du header planning ──
   Aligné sur le breakpoint de bascule mobile (< 768 px = vue jour-par-jour).
   Layout : ◀  Semaine du XX/XX/YYYY  ▶  sur UNE seule ligne. */
@media (max-width: 767px) {
    .apc-planning-grid {
        grid-template-columns: 1fr;
    }

    .apc-planning-header {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
    }

    /* Libellé compact entre les deux flèches : on réduit la police pour tout caser. */
    .apc-planning-header h2 {
        order: 0 !important;
        flex: 1 1 auto !important;
        width: auto !important;
        margin: 0 !important;
        text-align: center !important;
        font-size: 0.9em !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* Flèches : carré compact, centrées dans leur cadre, identiques des deux côtés. */
    .apc-planning-header .apc-btn-nav,
    .apc-planning-header #apc-prev-week,
    .apc-planning-header #apc-next-week {
        flex: 0 0 auto !important;
        margin: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        align-self: center !important;
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        padding: 0 !important;
        line-height: 1 !important;
        box-sizing: border-box !important;
        font-size: 1.1em !important;
    }
}

/* ═══════════════════════════════════════════════════════════
   Planning — vue semainier (agenda)
   Activée uniquement sur écran ≥ 768px (mobile = liste de cartes).
   ═══════════════════════════════════════════════════════════ */

/* En mode agenda, le conteneur passe en bloc plein-largeur
   (sinon il hérite du grid auto-fill 200px qui squashe l'agenda). */
.apc-planning-grid.is-agenda-mode {
    display: block;
}

.apc-agenda-legend {
    display: flex; flex-wrap: wrap; gap: 12px;
    align-items: center;
    margin: 8px 0 14px;
    font-size: 13px;
    color: #4b5563;
    padding: 8px 12px;
    background: #fafafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}
.apc-agenda-legend-item {
    display: inline-flex; align-items: center; gap: 6px;
    white-space: nowrap;
}
.apc-agenda-legend-swatch {
    display: inline-block;
    width: 14px; height: 14px;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,.08);
}

.apc-agenda {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(16,24,40,.06);
}
.apc-agenda-headers {
    display: grid;
    grid-template-columns: 60px repeat(7, 1fr);
    background: #fafafb;
    border-bottom: 1px solid #e5e7eb;
    position: sticky;
    top: 0;
    z-index: 5;
}
.apc-agenda-time-header { border-right: 1px solid #f1f1f4; }
.apc-agenda-day-header {
    padding: 10px 6px;
    text-align: center;
    font-weight: 700;
    font-size: 13px;
    color: #1f2937;
    border-right: 1px solid #f1f1f4;
}
.apc-agenda-day-header:last-child { border-right: 0; }
.apc-agenda-day-header.is-today {
    background: #f5f3ff;
    color: #6d28d9;
}

.apc-agenda-body {
    display: grid;
    grid-template-columns: 60px repeat(7, 1fr);
    position: relative;
}
.apc-agenda-times {
    border-right: 1px solid #f1f1f4;
    background: #fafafb;
}
.apc-agenda-time {
    padding: 2px 6px;
    font-size: 11px;
    color: #9ca3af;
    text-align: right;
    border-bottom: 1px dashed #f1f1f4;
    box-sizing: border-box;
}
.apc-agenda-day {
    position: relative;
    border-right: 1px solid #f1f1f4;
    box-sizing: border-box;
}
.apc-agenda-day:last-child { border-right: 0; }

/* Quadrillage horizontal en arrière-plan, géré par les slots positionnés */
.apc-agenda-slot {
    position: absolute;
    left: 0; right: 0;
    border-bottom: 1px solid #f5f5f7;
    pointer-events: none;
}
.apc-agenda-slot-half { border-bottom: 1px dashed #f1f1f4; }

/* Saut d'horaire (plage sans aucun cours de la semaine, compactée) */
.apc-agenda-time-gap {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: #b8bcc4;
    letter-spacing: 2px;
    background: repeating-linear-gradient(45deg, #f4f4f6, #f4f4f6 5px, #fafafb 5px, #fafafb 10px);
    border-bottom: 1px dashed #e5e7eb;
    border-top: 1px dashed #e5e7eb;
    box-sizing: border-box;
    cursor: default;
}
.apc-agenda-gap {
    position: absolute;
    left: 0; right: 0;
    background: repeating-linear-gradient(45deg, rgba(0,0,0,.015), rgba(0,0,0,.015) 5px, transparent 5px, transparent 10px);
    border-top: 1px dashed #e5e7eb;
    border-bottom: 1px dashed #e5e7eb;
    pointer-events: none;
}

/* Bloc événement positionné en absolu sur sa plage horaire */
.apc-agenda-event {
    position: absolute;
    left: 3px; right: 3px;
    padding: 4px 6px;
    background: rgba(109,40,217,.08);
    /* Bordure 1 px solid sur les 4 côtés, couleur discipline (injectée en
       inline-style par JS : style="border-color: <discipline>"). */
    border: 1px solid #6d28d9;
    border-radius: 6px;
    cursor: pointer;
    font-size: 11px;
    color: #1f2937;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 1px;
    transition: transform .08s, box-shadow .15s, filter .15s;
    z-index: 1;
}
.apc-agenda-event:hover {
    z-index: 2;
    box-shadow: 0 4px 12px rgba(16,24,40,.15);
    transform: translateY(-1px);
    filter: brightness(0.97);
}
/* Ligne 1 : icône format (visio / salle / mixte) */
.apc-agenda-event-icon {
    font-size: 13px;
    line-height: 1;
    flex: 0 0 auto;
}
/* Ligne 2 : heure de début */
.apc-agenda-event-time {
    font-weight: 700;
    font-size: 11px;
    color: #1f2937;
    line-height: 1.1;
    flex: 0 0 auto;
}
/* Ligne 3 : durée */
.apc-agenda-event-duree {
    font-size: 10px;
    color: #6b7280;
    line-height: 1.1;
    flex: 0 0 auto;
}
/* Ligne 5 : niveau (sous le titre) */
.apc-agenda-event-niveau {
    font-size: 10px;
    color: #6b7280;
    line-height: 1.1;
    flex: 0 0 auto;
    margin-top: 2px;
    font-style: italic;
}
/* Picto image personnalisé (formats de cours) — rendu inline à hauteur du texte */
.apc-format-img {
    height: 1.1em;
    width: auto;
    max-width: 24px;
    vertical-align: -0.15em;
    object-fit: contain;
    display: inline-block;
}
.apc-agenda-event-title {
    font-weight: 700;
    font-size: 11.5px;
    line-height: 1.2;
    margin-top: 2px;
    color: #1f2937;
    overflow: hidden;
    /* Clamp à 2 lignes max ; ellipsis si trop long. */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
    flex: 1 1 auto;
}
.apc-agenda-event-meta {
    font-size: 10.5px;
    color: #6b7280;
    line-height: 1.15;
    margin-top: 1px;
    flex: 0 0 auto;
}

/* Marquage personnel (espace membre) : ♥ cours de référence, ☆ essai */
/* Marqueurs "Mes inscriptions" — 📌 essai / ❤️ référence / 🩵 unité.
   Rendus en pastille discrète en haut-droite de la tuile. */
.apc-agenda-mark {
    position: absolute;
    top: 2px;
    right: 4px;
    font-size: 13px;
    line-height: 1;
    z-index: 3;
    pointer-events: none;
    /* Léger filet blanc pour rester lisible sur les tuiles colorées */
    text-shadow: 0 0 2px #fff, 0 0 4px #fff;
}
.apc-mark-reference { color: #dc2626; }
.apc-mark-essai     { color: #f59e0b; }
.apc-mark-unite     { color: #0ea5e9; }
/* Anciens alias conservés pour rétro-compat */
.apc-mark-ref { color: #dc2626; }

/* Encadré coloré sur les tuiles de l'agenda où l'élève est inscrit. */
.apc-agenda-event.is-mine-ref {
    box-shadow: 0 0 0 2px #dc2626 inset;
}
.apc-agenda-event.is-mine-essai {
    box-shadow: 0 0 0 2px #f59e0b inset;
}
.apc-agenda-event.is-mine-unite {
    box-shadow: 0 0 0 2px #0ea5e9 inset;
}

/* États : complet / clôturé / passé */
.apc-agenda-event.is-full      { opacity: .9; }
.apc-agenda-event.is-full .apc-agenda-event-meta { color: #991b1b; font-weight: 700; }
.apc-agenda-event.is-closed    { opacity: .55; cursor: not-allowed; }
/* Séances passées : aucune transparence — restent lisibles. Le clic ouvre une
   popup d'information en lecture seule (pas de bouton de réservation). */
.apc-agenda-event.is-past      { cursor: pointer; }
.apc-agenda-event.is-closed:hover {
    transform: none; box-shadow: none;
}

/* Sur écran intermédiaire (entre 768 et 1024), on resserre */
@media (min-width: 768px) and (max-width: 1024px) {
    .apc-agenda-event-title { font-size: 11.5px; }
    .apc-agenda-event-meta  { font-size: 10px; }
    .apc-agenda-day-header  { font-size: 12px; }
    .apc-agenda-time        { font-size: 10px; }
}

/* ═══════════════════════════════════════════════════════════
   Planning MOBILE — vue jour-par-jour (style Fitness Park)
   ═══════════════════════════════════════════════════════════ */
.apc-planning-grid.is-day-mode {
    display: block;
}

/* Bande horizontale des 7 jours */
.apc-day-strip {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    padding: 6px 0 14px;
    margin-bottom: 4px;
    border-bottom: 1px solid #f1f1f4;
}
.apc-day-pill {
    background: transparent;
    border: 0;
    padding: 6px 0;
    cursor: pointer;
    border-radius: 999px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    transition: background .15s, color .15s, transform .08s;
    color: #9ca3af;
    font-family: inherit;
}
.apc-day-pill-letter {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
    line-height: 1;
}
.apc-day-pill-number {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.1;
}
.apc-day-pill.is-today {
    color: #6d28d9;
}
.apc-day-pill.is-active {
    background: #1f2937;
    color: #fff;
    box-shadow: 0 4px 10px rgba(0,0,0,.18);
}
.apc-day-pill.is-active:active { transform: scale(.96); }

.apc-day-empty {
    text-align: center;
    color: #6b7280;
    font-style: italic;
    padding: 24px 0;
}

/* Liste des cours du jour sélectionné */
.apc-day-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.apc-cours-row {
    display: grid;
    grid-template-columns: 70px 1fr auto;
    gap: 12px;
    background: #fff;
    /* Bordure 1 px solid couleur discipline sur les 4 côtés
       (--apc-disc est injecté en inline-style par JS). */
    border: 1px solid var(--apc-disc, #e5e7eb);
    border-radius: 10px;
    padding: 12px;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(16,24,40,.04);
    transition: box-shadow .15s, transform .08s;
}
.apc-cours-row:active {
    transform: scale(.99);
}
.apc-cours-row:hover {
    box-shadow: 0 4px 14px rgba(16,24,40,.10);
}

.apc-cours-row-time {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
}
/* Ligne 1 (mobile) : icône format */
.apc-cours-row-icone {
    font-size: 18px;
    line-height: 1;
    color: var(--apc-disc, #6d28d9);
}
/* Si une image personnalisée a été uploadée pour le picto format, on la cadre. */
.apc-cours-row-icone img,
.apc-cours-row-icone .apc-cours-row-picto img {
    height: 18px;
    width: auto;
    vertical-align: middle;
}
.apc-cours-row-heure {
    font-size: 17px;
    font-weight: 800;
    color: #1f2937;
    line-height: 1.1;
}
.apc-cours-row-duree {
    font-size: 11px;
    color: #9ca3af;
    margin-top: 2px;
}

.apc-cours-row-main {
    min-width: 0;
    /* Titre seul → centré verticalement dans la rangée */
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.apc-cours-row-title {
    font-size: 15px;
    font-weight: 800;
    color: #1f2937;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: .01em;
}
.apc-cours-row-niveau {
    font-size: 12px;
    color: #6b7280;
    line-height: 1.3;
    margin-top: 2px;
    font-style: italic;
}
.apc-cours-row-meta {
    font-size: 12px;
    color: #6b7280;
    line-height: 1.3;
    margin-top: 1px;
    text-transform: capitalize;
}

.apc-cours-row-side {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

/* Badges de statut (à droite de chaque ligne) */
.apc-cours-badge {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    padding: 4px 8px;
    border-radius: 4px;
    white-space: nowrap;
}
.apc-cours-badge.is-included { color: #065f46; background: #ecfdf5; }
.apc-cours-badge.is-paid,
.apc-cours-badge.is-guest    { color: #6b7280; background: transparent; }
.apc-cours-badge.is-full     { color: #991b1b; background: #fee2e2; }
.apc-cours-badge.is-closed   { color: #6b7280; background: #f4f4f7; }
.apc-cours-badge.is-past     { color: #9ca3af; background: transparent; }

/* Cours clôturé H-2 : grisé non cliquable (mais consultation possible).
   Cours passé : pas de transparence — cliquable pour consultation. */
.apc-cours-row:has(.apc-cours-badge.is-closed) {
    opacity: .55;
    cursor: not-allowed;
}
.apc-cours-row:has(.apc-cours-badge.is-past) {
    cursor: pointer;
}

/* ═══════════════════════════════════════════════════════════
   Boutons planning — retirer l'icône Elementor injectée
   sur les filtres de disciplines et les flèches de navigation
   (l'icône vide créait un espace visuel indésirable).
   ═══════════════════════════════════════════════════════════ */
.apc-btn-filter .elementor-button-icon,
.apc-btn-nav .elementor-button-icon,
#apc-prev-week .elementor-button-icon,
#apc-next-week .elementor-button-icon,
#apc-replay-close .elementor-button-icon {
    display: none !important;
}

/* Filtres disciplines : une seule ligne, scroll horizontal si débordement (mobile) */
.apc-discipline-filters {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    justify-content: flex-start;
    scrollbar-width: thin;
}
.apc-discipline-filters::-webkit-scrollbar { height: 4px; }
.apc-discipline-filters::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 2px; }

.apc-discipline-filters .apc-btn-filter {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* 2e rangée : filtres par niveau (desktop) */
.apc-niveau-filters { margin-top: 8px; }
.apc-filter-label {
    flex: 0 0 auto;
    align-self: center;
    font-size: 0.85em;
    font-weight: 600;
    color: #6b7280;
    margin-right: 4px;
    white-space: nowrap;
}

@media (max-width: 600px) {
    .apc-discipline-filters {
        padding: 8px 10px;
        gap: 6px;
        margin-bottom: 14px;
    }
    .apc-discipline-filters .apc-btn-filter {
        padding: 6px 12px;
        font-size: 0.82em;
    }
}

/* Légende compacte au-dessus de la bande des jours (mobile) */
.apc-day-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    padding: 8px 10px;
    margin: 0 0 10px;
    background: #fafafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 11.5px;
    color: #4b5563;
    line-height: 1.3;
}
.apc-day-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}
.apc-day-legend-swatch {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 3px;
    border: 1px solid rgba(0,0,0,.08);
}

/* Pictogramme format dans la carte du cours (mobile) */
.apc-cours-row-picto {
    display: inline-block;
    font-size: 13px;
    margin-right: 2px;
    line-height: 1;
}

/* ═══════════════════════════════════════════════════════════
   Page de connexion ([apc_connexion]) — carte centrée propre
   ═══════════════════════════════════════════════════════════ */
.apc-connexion-wrapper,
.apc-inscription-wrapper {
    max-width: 560px;        /* élargi : était 460 — les champs débordaient */
    width: calc(100% - 24px);/* ne dépasse jamais l'écran (mobile inclus) */
    margin: 32px auto;
    padding: 32px 28px;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 4px 24px rgba(16, 24, 40, .08);
    border: 1px solid #e5e7eb;
    box-sizing: border-box;
}
@media (max-width: 600px) {
    .apc-connexion-wrapper,
    .apc-inscription-wrapper {
        margin: 16px auto;
        padding: 22px 16px;
        width: calc(100% - 16px);
    }
}

/* Cadre d'inscription : labels au-dessus des champs partout (plus de flex row),
   inputs verrouillés à 100% avec box-sizing pour qu'ils ne sortent jamais du cadre,
   même si un thème agressif force une min-width plus large. */
.apc-inscription-wrapper .apc-form-row {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;
}
.apc-inscription-wrapper .apc-form-row > label {
    flex: none !important;
    text-align: left !important;
    width: auto !important;
}
.apc-inscription-wrapper .apc-form-row input[type="text"],
.apc-inscription-wrapper .apc-form-row input[type="email"],
.apc-inscription-wrapper .apc-form-row input[type="tel"],
.apc-inscription-wrapper .apc-form-row input[type="password"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}
/* Le champ mot de passe est dans un div relatif → mêmes règles sur le div + l'input */
.apc-inscription-wrapper .apc-form-row > div[style*="position:relative"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}
/* Le bouton submit n'a plus besoin d'être décalé (label n'est plus à gauche) */
.apc-inscription-wrapper .apc-form-row > button[type="submit"] {
    margin-left: 0 !important;
    width: 100%;
    box-sizing: border-box;
}
/* Règles MDP alignées sous le champ (plus d'offset 196px) */
.apc-inscription-wrapper .apc-password-rules-row { margin-left: 0 !important; }

.apc-connexion-wrapper h2,
.apc-inscription-wrapper h2 {
    text-align: center;
    margin: 0 0 22px;
    font-size: 1.45em;
    font-weight: 700;
    color: var(--apc-primary, #6d28d9);
}

/* Layout vertical des champs dans la page de connexion (label au-dessus de l'input) */
.apc-connexion-wrapper .apc-form-row {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    margin-bottom: 14px;
}
.apc-connexion-wrapper .apc-form-row label {
    flex: none;
    width: auto;
    text-align: left;
    font-weight: 600;
    font-size: 0.95em;
    color: #1f2937;
    margin: 0;
}
.apc-connexion-wrapper .apc-form-row input[type="text"],
.apc-connexion-wrapper .apc-form-row input[type="email"],
.apc-connexion-wrapper .apc-form-row input[type="password"] {
    width: 100%;
    box-sizing: border-box;
    padding: 11px 14px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 1em;
    transition: border-color .15s, box-shadow .15s;
}
.apc-connexion-wrapper .apc-form-row input:focus {
    outline: none;
    border-color: var(--apc-primary, #6d28d9);
    box-shadow: 0 0 0 3px rgba(109, 40, 217, .15);
}

/* Bouton submit en pleine largeur, gros */
.apc-connexion-wrapper .apc-btn[type="submit"],
.apc-connexion-wrapper button[type="submit"].apc-btn {
    width: 100% !important;
    justify-content: center !important;
    padding: 12px 18px !important;
    font-size: 1em !important;
    margin-top: 4px;
}

/* Boutons <a class="apc-btn"> : forcer le style malgré le thème
   (Elementor / VamTam écrasent souvent a {color:…} et a:hover) */
a.apc-btn,
a.apc-btn:visited,
a.apc-btn:hover,
a.apc-btn:focus,
a.apc-btn:active {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 10px 20px !important;
    border-radius: 30px !important;
    font-weight: 600 !important;
    font-size: 0.95em !important;
    text-decoration: none !important;
    line-height: 1.2 !important;
    border: 0 !important;
    cursor: pointer;
    transition: background .2s, opacity .2s, transform .05s;
}
a.apc-btn,
a.apc-btn:visited {
    background: #f3f4f6 !important;
    color: #1f2937 !important;
}
a.apc-btn:hover,
a.apc-btn:focus {
    background: #e5e7eb !important;
    color: #1f2937 !important;
}
a.apc-btn-primary,
a.apc-btn-primary:visited {
    background: var(--apc-primary, #6d28d9) !important;
    color: #fff !important;
}
a.apc-btn-primary:hover,
a.apc-btn-primary:focus {
    background: var(--apc-primary-hover, #5b21b6) !important;
    color: #fff !important;
}
a.apc-btn:active { transform: translateY(1px); }

/* La paire de boutons "Mon espace / Se déconnecter" : centrée, espacée */
.apc-connexion-wrapper > p {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 16px 0 0;
}

/* ═══════════════════════════════════════════════════════════
   Planning MOBILE — vue semainier compacte (grille 7 jours)
   Réutilise la structure de l'agenda desktop, rendue compacte
   et scrollable horizontalement. Ne touche pas au desktop.
   ═══════════════════════════════════════════════════════════ */

/* Par défaut (desktop) : on affiche le libellé long, on masque le court */
.apc-agenda-day-header .apc-dh-short { display: none; }
.apc-agenda-day-header .apc-dh-full  { display: inline; }

@media (max-width: 767px) {
    .apc-planning-grid.is-agenda-mobile {
        display: block;
    }

    /* Libellés de jour : court (L / 12) au lieu de "Lun 12/05" */
    .is-agenda-mobile .apc-agenda-day-header .apc-dh-full  { display: none; }
    .is-agenda-mobile .apc-agenda-day-header .apc-dh-short {
        display: flex; flex-direction: column; align-items: center; line-height: 1.1;
    }
    .is-agenda-mobile .apc-dh-letter { font-size: 11px; font-weight: 700; text-transform: uppercase; }
    .is-agenda-mobile .apc-dh-num    { font-size: 13px; font-weight: 800; }

    /* Conteneur scrollable horizontalement */
    .is-agenda-mobile .apc-agenda {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        border-radius: 10px;
    }

    /* Grilles en-tête + corps : gouttière 34px + 7 colonnes ≥ 44px (scroll si écran étroit) */
    .is-agenda-mobile .apc-agenda-headers,
    .is-agenda-mobile .apc-agenda-body {
        grid-template-columns: 34px repeat(7, minmax(44px, 1fr));
        min-width: 342px; /* 34 + 7×44 */
    }

    .is-agenda-mobile .apc-agenda-day-header {
        padding: 6px 2px;
        font-size: 11px;
    }

    /* Colonne des heures plus étroite */
    .is-agenda-mobile .apc-agenda-time {
        font-size: 9px;
        padding: 1px 3px;
    }

    /* Blocs cours compacts */
    .is-agenda-mobile .apc-agenda-event {
        left: 1px; right: 1px;
        padding: 2px 3px;
        border-left-width: 3px;
        border-radius: 4px;
    }
    .is-agenda-mobile .apc-agenda-event-time {
        font-size: 8px; font-weight: 700;
    }
    .is-agenda-mobile .apc-agenda-event-title {
        font-size: 8px; font-weight: 700; line-height: 1.1;
        white-space: normal; overflow: hidden;
        word-break: break-word;
        -webkit-line-clamp: 4; /* colonne étroite : on autorise plus de lignes */
    }
    /* La ligne meta (niveau · places) est masquée sur mobile faute de place */
    .is-agenda-mobile .apc-agenda-event-meta { display: none; }

    /* Légende : plus compacte, scroll horizontal si besoin */
    .is-agenda-mobile + .apc-agenda-legend,
    .apc-agenda-legend {
        font-size: 11px;
        gap: 6px 10px;
    }

    /* ── Planning pleine largeur sur mobile ──────────────────────
       On neutralise les marges/paddings horizontaux des conteneurs
       Elementor qui entourent UNIQUEMENT le planning (#apc-planning),
       grâce à :has(). Le reste du site n'est pas touché. */
    .elementor-section:has(#apc-planning),
    .elementor-section:has(#apc-planning) > .elementor-container,
    .elementor-section:has(#apc-planning) .elementor-column > .elementor-widget-wrap,
    .elementor-widget-text-editor:has(#apc-planning) > .elementor-widget-container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .elementor-section:has(#apc-planning) > .elementor-container {
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* ═══════════════════════════════════════════════════════════
   Planning MOBILE — bouton "Filtres" + sidebar droite
   ═══════════════════════════════════════════════════════════ */
.apc-mfilter-bar {
    display: flex;
    justify-content: flex-end;
    margin: 0 0 10px;
}
.apc-mfilter-toggle {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    background: #fff !important;
    color: #1f2937 !important;
    border: 1px solid #d1d5db !important;
    border-radius: 999px !important;
    padding: 8px 16px !important;
    font-weight: 600;
}
.apc-mfilter-toggle .dashicons { font-size: 16px; width: 16px; height: 16px; }
.apc-mfilter-count {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 18px; height: 18px; padding: 0 5px;
    background: var(--apc-primary, #6d28d9); color: #fff;
    border-radius: 999px; font-size: 11px; font-weight: 800;
}

/* Overlay sombre + panneau qui glisse depuis la droite */
.apc-mfilter-overlay {
    position: fixed; inset: 0;
    background: rgba(16, 24, 40, .45);
    z-index: 100050;
    opacity: 0;
    transition: opacity .2s ease;
}
.apc-mfilter-overlay.is-open { opacity: 1; }

.apc-mfilter-panel {
    position: absolute;
    top: 0; right: 0; bottom: 0;
    width: 84%;
    max-width: 340px;
    background: #fff;
    box-shadow: -6px 0 24px rgba(0, 0, 0, .18);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform .25s ease;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
.apc-mfilter-overlay.is-open .apc-mfilter-panel { transform: translateX(0); }

.apc-mfilter-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 16px 18px;
    border-bottom: 1px solid #e5e7eb;
    font-size: 17px;
    color: #1f2937;
}
.apc-mfilter-close {
    background: none; border: 0; cursor: pointer;
    font-size: 26px; line-height: 1; color: #6b7280; padding: 0 4px;
}

.apc-mfilter-content { flex: 1 1 auto; overflow-y: auto; padding: 8px 18px; }

.apc-mfilter-section { padding: 12px 0; border-bottom: 1px solid #f1f1f4; }
.apc-mfilter-section:last-child { border-bottom: 0; }
.apc-mfilter-section h4 {
    margin: 0 0 10px; padding: 0;
    font-size: 12px; font-weight: 700; text-transform: uppercase;
    letter-spacing: .04em; color: #9ca3af;
}

.apc-mfilter-row {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 0; cursor: pointer;
    font-size: 15px; color: #1f2937;
}
.apc-mfilter-row input[type="checkbox"] {
    flex: 0 0 20px; width: 20px; height: 20px; margin: 0;
    accent-color: var(--apc-primary, #6d28d9);
}
.apc-mfilter-swatch {
    flex: 0 0 16px; width: 16px; height: 16px;
    border-radius: 4px; border: 1px solid rgba(0,0,0,.08);
}
.apc-mfilter-fmticon { flex: 0 0 auto; font-size: 16px; }
.apc-mfilter-label { flex: 1 1 auto; }

.apc-mfilter-actions {
    display: flex; gap: 10px;
    padding: 14px 18px;
    border-top: 1px solid #e5e7eb;
}
.apc-mfilter-actions .apc-btn { flex: 1 1 auto; justify-content: center; }
.apc-mfilter-reset {
    background: #f3f4f6 !important; color: #1f2937 !important; border: 1px solid #d1d5db !important;
}

/* Sécurité : la sidebar de filtres ne doit s'utiliser qu'en mobile */
@media (min-width: 768px) {
    .apc-mfilter-bar, .apc-mfilter-overlay { display: none !important; }
}

/* Repères horaires toutes les 30 min : heures et demi-heures ont le MÊME style
   (on n'applique aucune différenciation à .apc-agenda-time--half). */

/* ═══ Tarifs (shortcode [apc_tarifs]) ═══ */
.apc-tarifs-grid { display:flex; flex-wrap:wrap; gap:16px; margin:16px 0; }
.apc-tarif-card {
    flex:1 1 220px; background:#fff; border:1px solid #e5e7eb;
    border-top:4px solid var(--apc-primary,#6d28d9); border-radius:12px;
    padding:18px; box-shadow:0 1px 3px rgba(16,24,40,.06);
}
.apc-tarif-card h3 { margin:0 0 6px; color:var(--apc-primary,#6d28d9); }
.apc-tarif-prix { font-size:1.4em; margin:0 0 10px; }
.apc-tarif-prix small { font-size:.6em; color:#6b7280; }
.apc-tarif-avantages { list-style:none; padding:0; margin:0 0 14px; }
.apc-tarif-avantages li { padding:3px 0 3px 18px; position:relative; font-size:.92em; }
.apc-tarif-avantages li::before { content:"✓"; position:absolute; left:0; color:var(--apc-success,#059669); font-weight:700; }
.apc-tarifs-unite {
    background:var(--apc-primary-light,#f8f7ff); border-radius:12px; padding:16px 18px; margin-top:8px;
}
.apc-tarifs-unite h3 { margin:0 0 8px; }

/* ═══ Sections page d'accueil & actualités ═══ */
.apc-home-section { padding:20px; background:var(--apc-primary-light,#f8f7ff); border-radius:12px; margin:12px 0; }
.apc-home-section h2 { margin:0 0 8px; color:var(--apc-primary,#6d28d9); }
.apc-home-section p { margin:0 0 14px; color:#4b5563; }
.apc-actualites-wrapper .apc-actu-item {
    border-left:4px solid var(--apc-accent,#f59e0b); background:#fff;
    border:1px solid #e5e7eb; border-left:4px solid var(--apc-accent,#f59e0b);
    border-radius:8px; padding:14px 16px; margin:10px 0;
}
.apc-actu-item h3 { margin:0 0 4px; }
.apc-actu-date { font-weight:600; color:#6b7280; margin:0 0 6px; font-size:.9em; }

/* ═══ Bandeau « Stages cette semaine » sur le planning ═══ */
.apc-agenda-stages {
    display:flex; flex-wrap:wrap; align-items:center; gap:8px;
    background:#fffbeb; border:1px solid #fde68a; border-left:4px solid var(--apc-accent,#f59e0b);
    border-radius:8px; padding:10px 14px; margin:0 0 14px; font-size:.92em;
}
.apc-agenda-stages-label { font-weight:700; color:#92400e; }
.apc-agenda-stage {
    display:inline-flex; align-items:baseline; gap:6px;
    background:#fff; border:1px solid #fde68a; border-radius:20px;
    padding:4px 12px; color:#92400e; text-decoration:none; font-weight:600;
}
.apc-agenda-stage:hover { background:var(--apc-accent,#f59e0b); color:#fff; }
.apc-agenda-stage small { font-weight:400; opacity:.85; }
.apc-agenda-stage.is-complet { opacity:.6; }

/* ═══ Étape « cours de référence » — semainier (parcours d'abonnement) ═══ */
.apc-reference-grid { margin:10px 0; }

/* Grille principale — desktop : 7 colonnes (lundi → dimanche). */
.apc-ref-week {
    display:grid;
    grid-template-columns:repeat(7, minmax(0, 1fr));
    gap:8px;
    margin:14px 0 10px;
}
/* Tablette : 4 colonnes auto-fit */
@media (max-width: 1024px) {
    .apc-ref-week { grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); }
}

/* Colonne d'un jour */
.apc-ref-day-col {
    display:flex; flex-direction:column;
    background:#fafafa;
    border:1px solid #e5e7eb;
    border-radius:10px;
    overflow:hidden;
    min-width:0;
}
.apc-ref-day-head {
    background:var(--apc-primary, #6d28d9);
    color:#fff;
    text-align:center;
    padding:6px 4px;
    font-weight:600;
    font-size:.88em;
    letter-spacing:.02em;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
}
.apc-ref-day-head .apc-ref-day-name { display:inline; }
.apc-ref-day-head .apc-ref-day-abr  { display:none; }
.apc-ref-day-head .apc-ref-day-count {
    display:none; /* visible uniquement sur mobile (cf. media query) */
    background:rgba(255,255,255,.22);
    border-radius:999px;
    padding:1px 8px;
    font-size:.8em;
    font-weight:700;
    min-width:18px;
}
.apc-ref-day-body {
    flex:1 1 auto;
    display:flex; flex-direction:column;
    gap:6px;
    padding:6px;
    min-height:60px;
}

.apc-ref-empty {
    color:#9ca3af;
    text-align:center;
    font-size:1.2em;
    padding:14px 0;
    user-select:none;
}

/* Une "tuile" cours dans la colonne */
.apc-ref-slot {
    --apc-disc-color:#6d28d9;
    position:relative;
    display:flex; flex-direction:column; gap:2px;
    background:#fff;
    border:1px solid #e5e7eb;
    border-left:4px solid var(--apc-disc-color);
    border-radius:8px;
    padding:8px 30px 8px 10px;  /* padding-right pour la pastille ✓ */
    cursor:pointer;
    transition:border-color .15s, background .15s, transform .1s, box-shadow .15s;
    line-height:1.25;
}
.apc-ref-slot:hover {
    border-color:var(--apc-disc-color);
    background:#fff;
    box-shadow:0 2px 6px -2px rgba(0,0,0,.12);
}
.apc-ref-slot input {
    /* On cache l'input natif — la tuile entière est cliquable et l'état
       sélectionné est rendu visuellement par la classe .is-selected. */
    position:absolute;
    opacity:0;
    pointer-events:none;
    width:0; height:0;
}
.apc-ref-slot-check {
    position:absolute;
    top:50%; right:8px;
    transform:translateY(-50%);
    width:20px; height:20px;
    border-radius:50%;
    background:#fff;
    border:1.5px solid #d1d5db;
    color:#fff;
    font-size:12px; font-weight:700;
    display:flex; align-items:center; justify-content:center;
    transition:background .15s, border-color .15s;
    flex-shrink:0;
}
.apc-ref-slot.is-selected {
    background:color-mix(in srgb, var(--apc-disc-color) 8%, #fff);
    border-color:var(--apc-disc-color);
    box-shadow:0 0 0 1px var(--apc-disc-color) inset;
}
.apc-ref-slot.is-selected .apc-ref-slot-check {
    background:var(--apc-disc-color);
    border-color:var(--apc-disc-color);
}
.apc-ref-slot-time {
    font-weight:700;
    color:var(--apc-disc-color);
    font-size:.95em;
}
.apc-ref-slot-title {
    font-weight:600;
    color:#1f2937;
    font-size:.88em;
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
}
.apc-ref-slot-meta {
    font-size:.75em;
    color:#6b7280;
}

.apc-ref-counter { font-weight:600; margin:14px 0 0; }

/* ─── Mobile ≤ 600 px : single-column accordéon implicite ───────────
   Sur petits écrans le semainier devient une liste verticale avec
   en-têtes de jour pleine largeur + slots compacts en une seule ligne
   (heure | titre · meta | pastille). On masque les jours vides pour
   ne pas alourdir le scroll. */
@media (max-width: 600px) {
    .apc-ref-week {
        grid-template-columns:1fr;
        gap:10px;
    }
    /* Cache les jours sans cours sur mobile */
    .apc-ref-day-col[data-empty="1"] { display:none; }

    .apc-ref-day-head {
        padding:8px 12px;
        font-size:.95em;
        text-align:left;
        justify-content:flex-start;
    }
    .apc-ref-day-head .apc-ref-day-name { display:inline; font-weight:700; }
    .apc-ref-day-head .apc-ref-day-abr  { display:none; }
    .apc-ref-day-head .apc-ref-day-count { display:inline-flex; margin-left:auto; }
    .apc-ref-day-body {
        gap:8px;
        padding:8px;
        min-height:0;
    }

    /* Slots compacts horizontaux : heure à gauche, titre + meta au milieu, ✓ à droite */
    .apc-ref-slot {
        display:grid;
        grid-template-columns:auto 1fr;
        grid-template-areas:
            "time title"
            "time meta";
        column-gap:10px;
        row-gap:1px;
        align-items:center;
        padding:10px 36px 10px 12px;
    }
    .apc-ref-slot-time {
        grid-area:time;
        font-size:1.05em;
        font-weight:700;
        line-height:1;
        padding:6px 10px;
        background:color-mix(in srgb, var(--apc-disc-color) 10%, #fff);
        border-radius:8px;
        min-width:48px;
        text-align:center;
    }
    .apc-ref-slot-title {
        grid-area:title;
        font-size:.95em;
        -webkit-line-clamp:1;
        line-clamp:1;
    }
    .apc-ref-slot-meta {
        grid-area:meta;
        font-size:.78em;
    }
    .apc-ref-slot-check {
        width:22px; height:22px;
        font-size:14px;
        right:10px;
    }

    /* État sélectionné plus marqué sur mobile (zone tactile, feedback fort) */
    .apc-ref-slot.is-selected {
        background:color-mix(in srgb, var(--apc-disc-color) 14%, #fff);
        box-shadow:0 0 0 2px var(--apc-disc-color) inset;
    }

    .apc-ref-counter {
        position:sticky;
        bottom:0;
        background:#fff;
        padding:10px 12px;
        border-top:1px solid #e5e7eb;
        border-radius:0 0 8px 8px;
        margin:14px 0 0;
        text-align:center;
        z-index:5;
        box-shadow:0 -4px 10px -6px rgba(0,0,0,.12);
    }
}

/* Compatibilité ascendante : anciennes classes (.apc-ref-day, .apc-ref-cours)
   peuvent rester utilisées par d'autres vues — on les conserve. */
.apc-ref-day { margin:14px 0; }
.apc-ref-day h4 { margin:0 0 8px; color:var(--apc-primary,#6d28d9); font-size:.95em; }
.apc-ref-cours-list { display:flex; flex-direction:column; gap:8px; }
.apc-ref-cours {
    display:flex; align-items:flex-start; gap:10px;
    background:#fff; border:1px solid #e5e7eb; border-radius:8px;
    padding:10px 12px; cursor:pointer; transition:border-color .15s, background .15s;
}
.apc-ref-cours:hover { border-color:var(--apc-primary,#6d28d9); }
.apc-ref-cours input { margin-top:3px; flex:0 0 auto; }
.apc-ref-cours-body { flex:1 1 auto; min-width:0; }
.apc-ref-cours-title { font-weight:600; color:#1f2937; }
.apc-ref-cours-meta { font-size:.85em; color:#6b7280; margin-top:2px; }

/* ═══ Programme hebdomadaire dans Mon espace ═══ */
.apc-prog-item {
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    background:#fff; border:1px solid #e5e7eb; border-radius:8px;
    padding:10px 14px; margin:8px 0;
}
.apc-prog-body { flex:1 1 auto; min-width:0; }
.apc-prog-title { font-weight:600; color:#1f2937; }
.apc-prog-meta { font-size:.85em; color:#6b7280; margin-top:2px; }
.apc-prog-actions { display:inline-flex; gap:6px; flex:0 0 auto; }
.apc-prog-choice {
    display:flex; align-items:center; gap:8px;
    padding:8px 12px; border-radius:6px; cursor:pointer;
    border:1px solid #e5e7eb; margin:4px 0; background:#fff;
}
.apc-prog-choice:hover { border-color:var(--apc-primary,#6d28d9); }
.apc-prog-modal-body { max-height:50vh; overflow-y:auto; margin:10px 0; }
.apc-prog-modal-body h4 { margin:14px 0 6px; color:var(--apc-primary,#6d28d9); font-size:.95em; }

/* ═══ Réservations futures groupées par semaine (Mon espace) ═══ */
.apc-resa-week { margin: 12px 0; }
.apc-resa-week h4 {
    margin: 6px 0 6px; padding: 4px 0;
    color: var(--apc-primary, #6d28d9);
    font-size: 0.95em;
    border-bottom: 1px solid #e5e7eb;
}

/* ═══ Bannière post-essai (schéma 1 bis) ═══ */
.apc-essai-dialog { margin: 0 0 18px; }
.apc-essai-card {
    background: linear-gradient(135deg, #fef3c7 0%, #fffbeb 100%);
    border: 1px solid #fde68a;
    border-left: 4px solid var(--apc-accent, #f59e0b);
    border-radius: 12px;
    padding: 18px 22px;
}
.apc-essai-card h3 { margin: 0 0 6px; color: #92400e; }
.apc-essai-card p { margin: 0 0 12px; color: #4b5563; }
.apc-essai-actions {
    display: flex; flex-wrap: wrap; gap: 8px;
}
.apc-btn-danger {
    background: #fee2e2 !important; color: #991b1b !important;
    border: 1px solid #fecaca !important;
}
.apc-btn-danger:hover { background: #fecaca !important; }

/* ═══════════════════════════════════════════════════════════
   Refonte cartes forfait — style "Liberté Essentielle"
   (lotus rose, titre serif, tagline rose, ✓ roses, CTA arrondi)
   ═══════════════════════════════════════════════════════════ */
.apc-forfaits-grid { gap: 22px; }

.apc-forfait-card {
    --pink:        #ec4899;
    /* Version foncée pour les états :hover — dérivée automatiquement de --pink */
    --pink-hover:  color-mix(in srgb, var(--pink) 82%, black 18%);
    --pink-soft:   color-mix(in srgb, var(--pink) 10%, white 90%);
    /* Dégradé discret dans les 4 angles, centre blanc — couleur dérivée de --pink
       via color-mix(), donc suit automatiquement la couleur paramétrée par forfait. */
    background:
        radial-gradient(circle at top left,     color-mix(in srgb, var(--pink) 18%, transparent), transparent 38%),
        radial-gradient(circle at top right,    color-mix(in srgb, var(--pink) 18%, transparent), transparent 38%),
        radial-gradient(circle at bottom left,  color-mix(in srgb, var(--pink) 18%, transparent), transparent 38%),
        radial-gradient(circle at bottom right, color-mix(in srgb, var(--pink) 18%, transparent), transparent 38%),
        #fff;
    border: 3px solid var(--pink);
    border-radius: 18px;
    padding: 26px 22px 22px;
    text-align: center;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--pink) 14%, transparent);
    transition: transform .2s ease, box-shadow .2s ease;
    /* Pas d'overflow:hidden — sinon le badge « Le plus complet »
       (positionné top:-12px) est coupé par le haut de la carte. */
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    position: relative;
}
.apc-forfait-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 30px color-mix(in srgb, var(--pink) 22%, transparent);
    border-color: var(--pink);
}
.apc-forfait-highlight { box-shadow: 0 10px 28px color-mix(in srgb, var(--pink) 25%, transparent); }
.apc-forfait-badge {
    background: var(--pink) !important;
    z-index: 2;
}

/* Lotus / icône en haut */
.apc-forfait-logo { color: var(--pink); line-height: 0; }
.apc-forfait-logo svg,
.apc-forfait-logo img { width: 48px; height: 48px; display: block; margin: 0 auto; object-fit: contain; }

/* Titres : aucune police forcée — le thème décide.
   Couleur : « Liberté » reste sombre, le nom du forfait passe en rose. */
.apc-forfait-titles { line-height: 1.1; }
.apc-forfait-title-pre {
    font-size: 1.4em;
    font-style: normal;
    font-weight: 400;
    color: #1f2937;
}
.apc-forfait-title-main {
    font-size: 1.95em;
    font-weight: 400;
    color: var(--pink); /* nom du forfait en rose, comme sur le visuel */
    margin-top: 2px;
}
.apc-forfait-ornament {
    color: var(--pink); font-size: 0.55em; letter-spacing: 4px;
    margin: 2px 0 4px;
}

/* Prix — le « € » est désormais hors du <small> donc rendu à la taille
   du prix principal (gros). Seul « /mois » est à la taille réduite. */
.apc-forfait-prix {
    color: var(--pink) !important;
    font-size: 2.6em !important;
    font-weight: 400 !important;
    margin: 4px 0 8px !important;
    line-height: 1 !important;
}
.apc-forfait-prix small {
    font-size: 0.4em !important; color: var(--pink) !important; font-weight: 400 !important;
}

/* Tagline rose */
.apc-forfait-tagline {
    color: var(--pink);
    font-weight: 700;
    font-size: 1.05em;
    line-height: 1.3;
    margin: 4px 0 8px;
    padding: 0 4px;
}

/* Liste des avantages avec ✓ rose */
.apc-forfait-features {
    list-style: none; padding: 0; margin: 6px 0 14px;
    text-align: left; width: 100%; flex: 1;
}
.apc-forfait-features li {
    position: relative;
    padding: 6px 0 6px 28px;
    color: #374151;
    font-size: 0.92em;
    line-height: 1.45;
    border-bottom: none;
}
.apc-forfait-features li::before {
    content: "✓";
    position: absolute; left: 4px; top: 6px;
    color: var(--pink);
    font-weight: 700;
}

/* CTA inférieur (S'abonner / Cliquer pour en savoir plus) */
.apc-forfait-cta {
    width: 100%;
    margin-top: auto;
    background: var(--pink) !important;
    color: #fff !important;
    border: none !important;
    padding: 12px 18px !important;
    border-radius: 999px !important;
    font-size: 0.95em !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center; justify-content: center; gap: 8px;
    cursor: pointer; text-decoration: none;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--pink) 30%, transparent);
    transition: background .2s, transform .2s;
}
.apc-forfait-cta:hover {
    background: var(--pink-hover) !important;
    transform: translateY(-1px);
}
.apc-forfait-cta-star { font-size: 1em; line-height: 1; }

/* Header obsolète : on retire le réservé d'espace pour le titre legacy */
.apc-forfait-card .apc-forfait-header { display: none; }
.apc-forfait-card .elementor-icon-list-items,
.apc-forfait-card .apc-forfait-tags,
.apc-forfait-card .apc-btn-choisir { display: none; }

/* ═══ Mon espace : aucun abonnement actif ═══ */
.apc-abo-empty {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    padding: 14px 18px;
    background: var(--apc-primary-light, #f8f7ff);
    border-radius: 10px;
}
.apc-abo-empty p { margin: 0; color: #4b5563; }
@media (max-width: 600px) {
    .apc-abo-empty {
        flex-direction: column;
        align-items: stretch;
    }
    .apc-abo-empty .apc-btn {
        width: 100%;
        justify-content: center;
    }
}

/* ═══ Mes factures (Mon espace) ═══ */
.apc-facture-row {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; flex-wrap: wrap;
    padding: 10px 14px; margin: 6px 0;
    background: #fff; border: 1px solid #e5e7eb; border-radius: 8px;
}
.apc-facture-meta { color: #4b5563; font-size: 0.92em; flex: 1 1 260px; min-width: 0; }
.apc-facture-actions { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.apc-facture-ttc { font-weight: 700; color: #1f2937; }
@media (max-width: 600px) {
    .apc-facture-row { flex-direction: column; align-items: stretch; }
    .apc-facture-actions { justify-content: space-between; }
    .apc-facture-actions .apc-btn { flex: 1; justify-content: center; }
}

/* Badge type Avoir dans la liste Mon espace */
.apc-facture-row.is-avoir { border-left: 4px solid #b91c1c; }
.apc-facture-row.is-avoir .apc-facture-ttc { color: #b91c1c; }
.apc-facture-type-avoir {
    display: inline-block;
    background: #fee2e2; color: #991b1b;
    padding: 1px 8px; border-radius: 999px;
    font-size: .72em; font-weight: 700; text-transform: uppercase;
    margin-right: 4px; vertical-align: middle;
}

/* ═══ Mon planning personnel — [apc_mon_planning] ═══ */
.apc-mp-wrapper { max-width: 1000px; margin: 0 auto; }
.apc-mp-header {
    display: flex; align-items: center; justify-content: space-between;
    gap: 10px; margin-bottom: 8px;
}
.apc-mp-label { flex: 1; text-align: center; margin: 0; font-size: 1.1em; }
.apc-mp-legend { color: #6b7280; font-size: 0.88em; margin: 0 0 14px; text-align: center; }

.apc-mp-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 10px;
}
@media (max-width: 900px) { .apc-mp-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .apc-mp-grid { grid-template-columns: 1fr; } }

.apc-mp-day {
    background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
    padding: 10px 12px; display: flex; flex-direction: column; gap: 8px;
    min-height: 120px;
}
.apc-mp-day.is-empty { background: #fafafb; }
.apc-mp-day-header {
    display: flex; align-items: baseline; justify-content: space-between;
    border-bottom: 1px solid #f1f1f4; padding-bottom: 4px;
}
.apc-mp-day-name { font-weight: 700; color: #1f2937; }
.apc-mp-day-date { color: #6b7280; font-size: 0.85em; }
.apc-mp-day-empty { color: #9ca3af; font-size: 0.85em; font-style: italic; }

.apc-mp-sessions { display: flex; flex-direction: column; gap: 8px; }
.apc-mp-session {
    background: #fff; border: 1px solid #e5e7eb; border-radius: 8px;
    padding: 8px 10px;
}
.apc-mp-session.is-past { opacity: .65; }
.apc-mp-session-head {
    display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
    font-size: 0.85em;
}
.apc-mp-time { font-weight: 700; color: #1f2937; }
.apc-mp-duree { color: #6b7280; }
.apc-mp-spacer { flex: 1; }
.apc-mp-title { font-weight: 600; color: #1f2937; margin-top: 4px; }
.apc-mp-meta { font-size: 0.82em; color: #6b7280; margin-top: 2px; }
.apc-mp-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.apc-mp-actions .apc-btn { font-size: 0.82em !important; }

.apc-mp-mark { font-weight: 700; margin-right: 2px; }
.apc-mp-mark-ref   { color: #dc2626; }
.apc-mp-mark-essai { color: #f59e0b; }
.apc-mp-mark-unite { color: #0ea5e9; }

.apc-mp-badge {
    display: inline-block; padding: 2px 8px; border-radius: 999px;
    font-size: 0.72em; font-weight: 700;
}
.apc-mp-badge.is-confirm        { background: #d1fae5; color: #065f46; }
.apc-mp-badge.is-absence-ok     { background: #fef3c7; color: #92400e; }
.apc-mp-badge.is-absence-tardive{ background: #fee2e2; color: #991b1b; }
.apc-mp-badge.is-past           { background: #f3f4f6; color: #6b7280; }

.apc-mp-empty,
.apc-mp-empty-week {
    text-align: center; padding: 24px; color: #6b7280;
    background: var(--apc-primary-light, #f8f7ff); border-radius: 10px;
}

/* ═══ Étape « Avec / Sans cours d'essai » (parcours d'abonnement) ═══ */
.apc-essai-choix-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin: 14px 0;
}
@media (max-width: 720px) { .apc-essai-choix-grid { grid-template-columns: 1fr; } }

.apc-essai-choix-card {
    background: #fff;
    border: 2px solid #e5e7eb;
    border-radius: 14px;
    padding: 20px 22px;
    text-align: left;
    cursor: pointer;
    transition: border-color .2s, box-shadow .2s, transform .15s;
    font-family: inherit;
}
.apc-essai-choix-card:hover {
    border-color: var(--apc-primary, #6d28d9);
    box-shadow: 0 4px 12px rgba(109,40,217,.08);
    transform: translateY(-2px);
}
.apc-essai-choix-card h3 { margin: 0 0 8px; color: var(--apc-primary, #6d28d9); }
.apc-essai-choix-card p  { margin: 0; color: #4b5563; font-size: .92em; }
.apc-essai-choix-primary {
    border-color: var(--apc-primary, #6d28d9);
    background: var(--apc-primary-light, #f8f7ff);
}

/* Rappel des choix pré-essai dans la bannière post-essai */
.apc-essai-preinsc {
    background: #fff;
    border-radius: 8px;
    padding: 10px 12px;
    margin: 0 0 12px;
    font-size: .92em;
    color: #4b5563;
}

/* ─── Schéma 0 doc 5 — Page « Désirez-vous » (4 cartes) ─────────── */
.apc-choix-parcours-wrapper {
    max-width: 1100px;
    margin: 0 auto;
    padding: 24px 16px;
}
.apc-choix-parcours-wrapper h2 {
    text-align: center;
    color: var(--apc-primary, #6d28d9);
    margin: 0 0 8px;
}
.apc-choix-intro {
    text-align: center;
    color: #6b7280;
    margin: 0 0 24px;
}
.apc-choix-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
    margin-top: 16px;
}
.apc-choix-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 22px 20px 20px;
    text-decoration: none !important;
    color: #1f2937;
    transition: transform .15s, box-shadow .15s, border-color .15s;
    position: relative;
    overflow: hidden;
}
.apc-choix-card:hover {
    transform: translateY(-3px);
    border-color: var(--apc-primary, #6d28d9);
    box-shadow: 0 12px 24px -12px rgba(109, 40, 217, .25);
}
.apc-choix-number {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--apc-primary-light, #f8f7ff);
    color: var(--apc-primary, #6d28d9);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.1em;
    margin-bottom: 12px;
}
.apc-choix-card h3 {
    margin: 0 0 8px;
    font-size: 1.1em;
    color: #1f2937;
}
.apc-choix-card p {
    color: #6b7280;
    font-size: 0.92em;
    line-height: 1.5;
    margin: 0 0 14px;
    flex: 1;
}
.apc-choix-cta {
    color: var(--apc-primary, #6d28d9);
    font-weight: 600;
    font-size: 0.92em;
}
.apc-choix-card-comingsoon {
    opacity: 0.85;
    border-style: dashed;
}
.apc-choix-card-comingsoon .apc-choix-cta {
    color: #6b7280;
}

/* ─── Page « Cours à l'unité » (Schéma 3 — annexes) ─────────────── */
.apc-page-cours-unite {
    max-width: 760px;
    margin: 0 auto;
    padding: 24px 16px;
}
.apc-page-cours-unite h2 {
    color: var(--apc-primary, #6d28d9);
    margin: 0 0 8px;
}
.apc-cu-tarifs {
    list-style: none;
    padding: 0;
    margin: 18px 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.apc-cu-tarifs li {
    background: var(--apc-primary-light, #f8f7ff);
    padding: 14px 16px;
    border-radius: 10px;
    text-align: center;
    border: 1px solid #ede9fe;
}
.apc-cu-modalites {
    font-size: 0.9em;
    color: #6b7280;
    margin: 8px 0 18px;
}

/* ─── Encadré gras cours de référence (Annexes Schémas 1 & 2 doc 5) ─── */
.apc-mp-session.is-mine-ref {
    border-top: 2px solid #dc2626;
    border-right: 2px solid #dc2626;
    border-bottom: 2px solid #dc2626;
    box-shadow: 0 0 0 1px rgba(220,38,38,.15);
}
.apc-mp-session.is-mine-essai {
    border-top: 1px dashed #f59e0b;
    border-right: 1px dashed #f59e0b;
    border-bottom: 1px dashed #f59e0b;
}

/* ═══ Code d'accès (verrou inscription / abonnement) ════════════════ */
.apc-acces-code-wrapper {
    min-height: 60vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
}
.apc-acces-code-card {
    max-width: 480px;
    width: 100%;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 32px 28px;
    text-align: center;
    box-shadow: 0 10px 30px -10px rgba(0,0,0,.15);
}
.apc-acces-icone {
    font-size: 2.4em;
    line-height: 1;
    margin-bottom: 8px;
}
.apc-acces-code-card h2 {
    margin: 0 0 12px;
    color: var(--apc-primary, #6d28d9);
    font-size: 1.4em;
}
.apc-acces-msg {
    color: #4b5563;
    margin: 0 0 22px;
    line-height: 1.5;
}
#apc-acces-code-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
#apc-acces-code {
    width: 100%;
    padding: 12px 14px;
    border: 1.5px solid #d1d5db;
    border-radius: 10px;
    font-size: 1.05em;
    text-align: center;
    letter-spacing: .08em;
    text-transform: uppercase;
    box-sizing: border-box;
    transition: border-color .15s;
}
#apc-acces-code:focus {
    outline: none;
    border-color: var(--apc-primary, #6d28d9);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--apc-primary, #6d28d9) 18%, transparent);
}
#apc-acces-code-form .apc-btn {
    width: 100%;
    padding: 12px;
    font-size: 1em;
    font-weight: 600;
}
.apc-acces-erreur {
    color: #dc2626;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 10px 12px;
    margin: 14px 0 0;
    font-size: .92em;
}
