/* ===================================================================
   Bailatica — web v2 « Pas de deux » (17/10/2026)
   Couche de composants web, chargée après app.css (tokens v1 inchangés).
   Même fichier que design/bailatica/web-v2/assets/v2.css (maquettes).
   Préfixe pd- : aucun conflit avec Bootstrap ni avec le CSS des pages v1.
   =================================================================== */

:root {
    --pd-max: 1240px;
    --pd-gutter: 20px;
    --pd-header-h: 68px;
    --pd-tabbar-h: 64px;
}
@media (min-width: 768px) { :root { --pd-gutter: 32px; } }

/* ---------- Mise en page ---------- */
.pd-container { width: 100%; max-width: calc(var(--pd-max) + 2 * var(--pd-gutter)); margin: 0 auto; padding: 0 var(--pd-gutter); }
.pd-container--narrow { max-width: calc(760px + 2 * var(--pd-gutter)); }
.pd-section { padding: 56px 0; }
.pd-section--tight { padding: 32px 0; }
.pd-section--sunken { background: var(--sunken); }
.pd-section--surface { background: var(--surface); }
@media (min-width: 992px) { .pd-section { padding: 88px 0; } }

.pd-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 24px; margin-bottom: 28px; }
.pd-head__text { max-width: 640px; }
.pd-head--center { justify-content: center; text-align: center; }
.pd-head--center .pd-head__text { margin: 0 auto; }
.pd-overline { display: inline-flex; align-items: center; gap: 8px; font: 700 12px/16px var(--f-text); letter-spacing: .08em; text-transform: uppercase; color: var(--on-primary-soft); margin: 0 0 10px; }
.pd-overline::before { content: ""; width: 18px; height: 6px; border-top: 2px solid var(--primary); border-bottom: 2px solid var(--coral); border-radius: 1px; }
.pd-overline--light { color: #FFB3D2; }
.pd-overline--light::before { border-top-color: #FFB3D2; border-bottom-color: #FFC3A8; }

/* ---------- Typographie ---------- */
.pd-display { font: 800 clamp(40px, 6.2vw, 68px)/1.02 var(--f-display); letter-spacing: -0.025em; margin: 0 0 18px; }
.pd-h1 { font: 800 clamp(30px, 4vw, 44px)/1.08 var(--f-display); letter-spacing: -0.02em; margin: 0 0 12px; }
.pd-h2 { font: 700 clamp(24px, 3vw, 34px)/1.15 var(--f-display); letter-spacing: -0.015em; margin: 0 0 10px; }
.pd-h3 { font: 700 18px/24px var(--f-display); letter-spacing: -0.01em; margin: 0 0 6px; }
.pd-lead { font-size: clamp(16px, 1.6vw, 19px); line-height: 1.55; color: var(--ink-2); margin: 0 0 24px; }
.pd-sub { font-size: 16px; line-height: 1.5; color: var(--ink-2); margin: 0; }
.pd-meta { font: 500 13px/18px var(--f-text); color: var(--ink-3); }
.pd-grad-text { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pd-link { font-weight: 700; color: var(--on-primary-soft); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.pd-link:hover { color: var(--ink); text-decoration: underline; }
.pd-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Boutons ---------- */
.pd-btn { --h: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: var(--h); padding: 0 22px; border-radius: var(--r-pill); border: 0; font: 700 16px/20px var(--f-text); text-decoration: none; white-space: nowrap; cursor: pointer; transition: transform 100ms var(--ease), background-color 160ms var(--ease), box-shadow 160ms var(--ease); }
.pd-btn:active { transform: scale(.97); }
.pd-btn:focus-visible { outline: 3px solid var(--primary); outline-offset: 2px; }
.pd-btn--sm { --h: 40px; padding: 0 16px; font-size: 14px; }
.pd-btn--lg { --h: 56px; padding: 0 28px; font-size: 17px; }
.pd-btn--block { width: 100%; }
.pd-btn--primary { background: var(--primary); color: #fff; }
.pd-btn--primary:hover { background: var(--primary-press); color: #fff; }
.pd-btn--grad { background: var(--grad); color: #fff; box-shadow: 0 8px 24px rgba(216, 27, 106, .28); }
.pd-btn--grad:hover { color: #fff; box-shadow: 0 10px 28px rgba(216, 27, 106, .38); }
.pd-btn--secondary { background: var(--surface); color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--line-strong); }
.pd-btn--secondary:hover { color: var(--ink); background: var(--sunken); }
.pd-btn--tonal { background: var(--primary-soft); color: var(--on-primary-soft); }
.pd-btn--tonal:hover { background: #FFD3E5; color: var(--on-primary-soft); }
.pd-btn--ghost { background: transparent; color: var(--ink); }
.pd-btn--ghost:hover { background: var(--sunken); color: var(--ink); }
.pd-btn--white { background: #fff; color: var(--on-primary-soft); }
.pd-btn--white:hover { background: #FFF1F6; color: var(--on-primary-soft); }
.pd-btn--glass { background: rgba(255, 255, 255, .14); color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .45); }
.pd-btn--glass:hover { background: rgba(255, 255, 255, .24); color: #fff; }
.pd-btn--icon { width: var(--h); padding: 0; }
.pd-btn .bi { font-size: 1.1em; line-height: 1; }

/* ---------- Badges stores ---------- */
.pd-stores { display: flex; flex-wrap: wrap; gap: 10px; }
.pd-store { display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 6px 18px 6px 14px; border-radius: 14px; background: #000; color: #fff; text-decoration: none; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22); }
.pd-store:hover { color: #fff; background: #1a1a1a; }
.pd-store .bi { font-size: 26px; line-height: 1; }
.pd-store__label { display: block; font: 500 11px/13px var(--f-text); opacity: .9; }
.pd-store__name { display: block; font: 700 17px/20px var(--f-text); letter-spacing: -.01em; }

/* ---------- En-tête ---------- */
.pd-header { position: sticky; top: 0; z-index: 1030; background: rgba(255, 248, 245, .9); -webkit-backdrop-filter: saturate(1.4) blur(14px); backdrop-filter: saturate(1.4) blur(14px); border-bottom: 1px solid var(--line); }
.pd-header__bar { display: flex; align-items: center; gap: 12px; height: var(--pd-header-h); }
.pd-header__logo { display: inline-flex; align-items: center; flex: none; margin-right: 12px; }
.pd-header__logo img { height: 30px; width: auto; }
.pd-nav { display: none; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; }
.pd-nav a { position: relative; display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 14px; border-radius: var(--r-pill); font: 600 15px/20px var(--f-text); color: var(--ink-2); text-decoration: none; }
.pd-nav a:hover { color: var(--ink); background: var(--sunken); }
.pd-nav a[aria-current="page"], .pd-nav a.is-active { color: var(--on-primary-soft); background: var(--primary-soft); }
.pd-header__actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.pd-header__desk { display: none; }
.pd-iconbtn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; border: 0; background: transparent; color: var(--ink); font-size: 20px; text-decoration: none; }
.pd-iconbtn:hover { background: var(--sunken); color: var(--ink); }
.pd-dot { position: absolute; top: 6px; right: 4px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--primary); color: #fff; font: 700 11px/18px var(--f-text); text-align: center; box-shadow: 0 0 0 2px var(--bg); }
.pd-avatar-btn { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 10px 0 4px; border: 0; border-radius: var(--r-pill); background: transparent; color: var(--ink); font: 600 15px/20px var(--f-text); }
.pd-avatar-btn:hover { background: var(--sunken); }
.pd-avatar-btn .pd-avatar { width: 36px; height: 36px; font-size: 14px; }
@media (min-width: 992px) {
    .pd-nav { display: flex; }
    .pd-header__desk { display: inline-flex; }
    .pd-header__burger { display: none !important; }
}

/* Menu mobile (offcanvas Bootstrap) */
.pd-drawer { --bs-offcanvas-width: min(360px, 88vw); background: var(--bg); }
.pd-drawer .offcanvas-header { height: var(--pd-header-h); border-bottom: 1px solid var(--line); }
.pd-drawer__nav { list-style: none; margin: 0; padding: 12px 0; }
.pd-drawer__nav a { display: flex; align-items: center; gap: 14px; min-height: 52px; padding: 0 20px; font: 600 17px/22px var(--f-text); color: var(--ink); text-decoration: none; }
.pd-drawer__nav a .bi { font-size: 20px; color: var(--ink-2); width: 24px; text-align: center; }
.pd-drawer__nav a[aria-current="page"] { color: var(--on-primary-soft); background: var(--primary-soft); }
.pd-drawer__nav a[aria-current="page"] .bi { color: var(--primary); }
.pd-drawer__sep { height: 1px; background: var(--line); margin: 8px 20px; }
.pd-drawer__foot { padding: 16px 20px 24px; display: grid; gap: 10px; }

/* Barre d'onglets mobile : mêmes 5 onglets que l'app */
.pd-tabbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030; display: grid; grid-template-columns: repeat(5, 1fr); height: calc(var(--pd-tabbar-h) + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); background: rgba(255, 255, 255, .96); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-top: 1px solid var(--line); }
.pd-tabbar a { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; color: var(--ink-2); text-decoration: none; font: 600 11px/14px var(--f-text); }
.pd-tabbar a .bi { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 30px; border-radius: var(--r-pill); font-size: 20px; }
.pd-tabbar a[aria-current="page"] { color: var(--on-primary-soft); }
.pd-tabbar a[aria-current="page"] .bi { background: var(--primary-soft); color: var(--primary); }
.pd-tabbar .pd-dot { top: 4px; right: calc(50% - 26px); }
body.has-tabbar { padding-bottom: calc(var(--pd-tabbar-h) + env(safe-area-inset-bottom)); }
@media (min-width: 768px) { .pd-tabbar { display: none; } body.has-tabbar { padding-bottom: 0; } }

/* ---------- Avatars ---------- */
.pd-avatar { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 48px; height: 48px; border-radius: 50%; background: var(--primary-soft); color: var(--on-primary-soft); font: 700 18px/1 var(--f-display); object-fit: cover; overflow: hidden; }
.pd-avatar--lg { width: 64px; height: 64px; font-size: 24px; }
.pd-avatars { display: flex; align-items: center; }
.pd-avatars img, .pd-avatars span { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 3px var(--bg); margin-left: -10px; background: var(--primary-soft); }
.pd-avatars > :first-child { margin-left: 0; }
.pd-proof { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.pd-proof__text { font: 500 14px/20px var(--f-text); color: var(--ink-2); }
.pd-proof__text strong { color: var(--ink); font-weight: 700; }

/* ---------- Chips, tags ---------- */
.pd-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.pd-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 14px; border-radius: var(--r-pill); background: var(--surface); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line); font: 600 14px/18px var(--f-text); text-decoration: none; white-space: nowrap; }
.pd-chip:hover { color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--line-strong); }
.pd-chip.is-active, .pd-chip[aria-current="page"], .pd-chip[aria-pressed="true"] { background: var(--ink); color: #fff; box-shadow: none; }
.pd-chips--scroll { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 calc(-1 * var(--pd-gutter)); padding: 2px var(--pd-gutter); }
.pd-chips--scroll::-webkit-scrollbar { display: none; }
.pd-tag { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: var(--r-tag); font: 700 12px/16px var(--f-text); letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.pd-tag::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.pd-tag--party { color: var(--ev-soiree); background: var(--ev-soiree-bg); }
.pd-tag--festival { color: var(--ev-festival); background: var(--ev-festival-bg); }
.pd-tag--workshop { color: var(--ev-stage); background: var(--ev-stage-bg); }
.pd-tag--course { color: var(--ev-cours); background: var(--ev-cours-bg); }
.pd-tag--other { color: var(--ev-autre); background: var(--ev-autre-bg); }
.pd-tag--pro { color: var(--on-primary-soft); background: var(--primary-soft); }
.pd-tag--pro::before { display: none; }
.pd-dance { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border-radius: var(--r-pill); background: var(--sunken); color: var(--ink-2); font: 600 13px/16px var(--f-text); white-space: nowrap; }
.pd-dance--glass { background: rgba(31, 15, 25, .55); color: #fff; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }

/* ---------- Contrôle segmenté (comme l'app) ---------- */
.pd-seg { display: inline-flex; gap: 4px; padding: 4px; border-radius: var(--r-pill); background: var(--sunken); max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.pd-seg::-webkit-scrollbar { display: none; }
.pd-seg a, .pd-seg button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 16px; border: 0; border-radius: var(--r-pill); background: transparent; color: var(--ink-2); font: 600 15px/20px var(--f-text); text-decoration: none; white-space: nowrap; flex: 1 0 auto; }
.pd-seg a:hover, .pd-seg button:hover { color: var(--ink); }
.pd-seg .is-active, .pd-seg [aria-current="page"], .pd-seg [aria-selected="true"] { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-1); }
.pd-seg--block { display: flex; width: 100%; }

/* ---------- Grilles ---------- */
.pd-grid { display: grid; gap: 16px; }
.pd-grid--people { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pd-grid--cards { grid-template-columns: minmax(0, 1fr); gap: 20px; }
.pd-grid--3 { grid-template-columns: minmax(0, 1fr); gap: 20px; }
@media (min-width: 576px) { .pd-grid--cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 768px) { .pd-grid--people { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } .pd-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .pd-grid--people { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; } .pd-grid--cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pd-browse__main .pd-grid--people { }
@media (min-width: 992px) and (max-width: 1199.98px) { .pd-browse__main .pd-grid--cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .pd-browse__main .pd-grid--people { grid-template-columns: repeat(3, minmax(0, 1fr)); } .pd-browse__main .pd-grid--cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1400px) { .pd-browse__main .pd-grid--people { grid-template-columns: repeat(4, minmax(0, 1fr)); } .pd-browse__main .pd-grid--cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ---------- Carte danseur (photo pleine, comme l'app) ---------- */
.pd-person { position: relative; display: block; aspect-ratio: 3 / 4; border-radius: var(--r-card); overflow: hidden; background: var(--night); color: #fff; text-decoration: none; box-shadow: var(--shadow-1); isolation: isolate; }
.pd-person img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 640ms var(--ease); z-index: -1; }
.pd-person:hover img { transform: scale(1.04); }
.pd-person::after { content: ""; position: absolute; inset: 35% 0 0; background: linear-gradient(180deg, rgba(31, 15, 25, 0) 0%, rgba(31, 15, 25, .88) 100%); z-index: -1; }
.pd-person:hover { color: #fff; }
.pd-person:focus-visible { outline: 3px solid var(--primary); outline-offset: 3px; }
.pd-person__body { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px; }
.pd-person__name { display: flex; align-items: center; gap: 6px; font: 800 19px/22px var(--f-display); letter-spacing: -.01em; margin: 0 0 4px; }
.pd-person__city { display: flex; align-items: center; gap: 4px; font: 500 14px/18px var(--f-text); color: rgba(255, 255, 255, .92); margin: 0 0 8px; }
.pd-person__dances { display: flex; flex-wrap: wrap; gap: 6px; }
.pd-person__badge { position: absolute; top: 12px; left: 12px; }
.pd-person__online { width: 10px; height: 10px; border-radius: 50%; background: var(--online); box-shadow: 0 0 0 2px #fff; }
.pd-person__placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: linear-gradient(160deg, #3D1A2B, var(--night)); font: 800 64px/1 var(--f-display); color: rgba(255, 255, 255, .35); z-index: -1; }
@media (max-width: 575.98px) { .pd-person__body { padding: 12px; } .pd-person__name { font-size: 17px; } .pd-person__dances .pd-dance:nth-child(n+2) { display: none; } }

/* ---------- Carte prof (annuaire) ---------- */
.pd-teacher { display: flex; flex-direction: column; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-1); overflow: hidden; color: var(--ink); text-decoration: none; transition: box-shadow 160ms var(--ease), transform 160ms var(--ease); }
.pd-teacher:hover { color: var(--ink); box-shadow: var(--shadow-2); transform: translateY(-2px); }
.pd-teacher__media { position: relative; aspect-ratio: 4 / 3; background: var(--night); }
.pd-teacher__media img { width: 100%; height: 100%; object-fit: cover; }
.pd-teacher__media .pd-tag { position: absolute; top: 12px; left: 12px; background: rgba(255, 255, 255, .95); }
.pd-teacher__body { display: flex; flex-direction: column; gap: 8px; padding: 16px; flex: 1; }
.pd-teacher__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.pd-teacher__name { font: 800 19px/24px var(--f-display); margin: 0; }
.pd-price { font: 800 18px/22px var(--f-display); white-space: nowrap; }
.pd-price small { font: 500 13px/16px var(--f-text); color: var(--ink-3); }
.pd-teacher__bio { font-size: 14px; line-height: 20px; color: var(--ink-2); margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ---------- Carte événement ---------- */
.pd-event { position: relative; display: flex; flex-direction: column; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-1); overflow: hidden; color: var(--ink); text-decoration: none; transition: box-shadow 160ms var(--ease), transform 160ms var(--ease); }
.pd-event:hover { color: var(--ink); box-shadow: var(--shadow-2); transform: translateY(-2px); }
.pd-event__media { position: relative; aspect-ratio: 16 / 9; background: var(--sunken); }
.pd-event__media img { width: 100%; height: 100%; object-fit: cover; }
.pd-date { position: absolute; top: 12px; left: 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 56px; height: 60px; border-radius: 16px; background: #fff; box-shadow: var(--shadow-1); }
.pd-date__d { font: 800 22px/24px var(--f-display); color: var(--ink); }
.pd-date__m { font: 700 11px/14px var(--f-text); letter-spacing: .06em; text-transform: uppercase; color: var(--primary); }
.pd-event__body { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px 16px; flex: 1; }
.pd-event__tags { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.pd-event__price { margin-left: auto; font: 800 17px/22px var(--f-display); }
.pd-event__title { font: 800 19px/24px var(--f-display); letter-spacing: -.01em; margin: 0; }
.pd-event__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font: 500 14px/20px var(--f-text); color: var(--ink-2); margin: 0; }
.pd-event__meta span { display: inline-flex; align-items: center; gap: 5px; min-width: 0; }
.pd-event__meta .bi { color: var(--ink-3); }
.pd-event--row { flex-direction: row; }
.pd-event--row .pd-event__media { width: 38%; aspect-ratio: auto; min-height: 140px; flex: none; }

/* ---------- Pages liste : barre d'outils + filtres ---------- */
.pd-pagehead { padding: 28px 0 20px; }
.pd-pagehead__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.pd-pagehead .pd-h1 { margin: 0; }
.pd-pagehead__count { font: 500 15px/20px var(--f-text); color: var(--ink-2); margin: 6px 0 0; }
.pd-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 18px; }
.pd-toolbar__spacer { flex: 1; }
.pd-filterbtn { position: relative; }
.pd-filterbtn .pd-dot { top: -4px; right: -4px; }
.pd-browse { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; padding-bottom: 64px; }
@media (min-width: 992px) { .pd-browse { grid-template-columns: 280px minmax(0, 1fr); } .pd-browse__filtersbtn { display: none !important; } }
.pd-filters { background: var(--surface); }
@media (min-width: 992px) {
    .pd-filters.offcanvas-lg { position: sticky; top: calc(var(--pd-header-h) + 20px); align-self: start; max-height: calc(100vh - var(--pd-header-h) - 40px); overflow-y: auto; border-radius: var(--r-card); box-shadow: var(--shadow-1); padding: 20px; }
}
.pd-filters .offcanvas-header { border-bottom: 1px solid var(--line); }
.pd-filters__title { font: 700 18px/24px var(--f-display); margin: 0; }
.pd-filters__group { padding: 14px 0; border-bottom: 1px solid var(--line); }
.pd-filters__group:first-child { padding-top: 0; }
.pd-filters__group:last-of-type { border-bottom: 0; }
.pd-filters__label { display: block; font: 700 14px/20px var(--f-text); color: var(--ink); margin: 0 0 8px; }
.pd-filters__actions { position: sticky; bottom: 0; display: grid; gap: 8px; padding: 14px 0 0; background: var(--surface); }
.pd-check { display: flex; align-items: center; gap: 10px; min-height: 36px; font: 500 15px/20px var(--f-text); cursor: pointer; }
.pd-check input { width: 20px; height: 20px; accent-color: var(--primary); flex: none; }
.pd-checkchips { display: flex; flex-wrap: wrap; gap: 6px; }
.pd-checkchips label { cursor: pointer; }
.pd-checkchips input { position: absolute; opacity: 0; pointer-events: none; }
.pd-checkchips input:checked + .pd-chip { background: var(--ink); color: #fff; box-shadow: none; }
.pd-checkchips input:focus-visible + .pd-chip { outline: 3px solid var(--primary); outline-offset: 2px; }

/* ---------- Champs ---------- */
.pd-field { display: grid; gap: 6px; margin-bottom: 16px; }
.pd-field__label { font: 600 14px/20px var(--f-text); color: var(--ink); }
.pd-field__hint { font: 500 13px/18px var(--f-text); color: var(--ink-3); }
.pd-input-wrap { position: relative; }
.pd-input-wrap > .bi { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--ink-3); font-size: 18px; pointer-events: none; }
.pd-input, .pd-field .form-control, .pd-field .form-select { width: 100%; min-height: 52px; padding: 0 16px; border-radius: var(--r-field); border: 1.5px solid var(--line-strong); background: var(--surface); color: var(--ink); font: 400 16px/22px var(--f-text); }
.pd-input-wrap > .bi + .pd-input, .pd-input-wrap > .bi + .form-control { padding-left: 46px; }
.pd-input:focus, .pd-field .form-control:focus, .pd-field .form-select:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 4px rgba(216, 27, 106, .16); }
.pd-input::placeholder { color: var(--ink-3); }
.pd-divider { display: flex; align-items: center; gap: 12px; font: 500 14px/20px var(--f-text); color: var(--ink-3); margin: 20px 0; }
.pd-divider::before, .pd-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }

/* ---------- Recherche hero (ville) ---------- */
.pd-search { display: flex; align-items: center; gap: 8px; padding: 6px; border-radius: var(--r-pill); background: var(--surface); box-shadow: var(--shadow-2); max-width: 560px; }
.pd-search .bi { margin-left: 14px; color: var(--ink-3); font-size: 18px; }
.pd-search input { flex: 1; min-width: 0; height: 48px; border: 0; background: transparent; font: 500 16px/22px var(--f-text); color: var(--ink); }
.pd-search input:focus { outline: none; }
.pd-search:focus-within { box-shadow: var(--shadow-2), 0 0 0 3px var(--primary); }

/* ---------- Accueil : hero ---------- */
.pd-hero { position: relative; overflow: hidden; padding: 40px 0 56px; background: radial-gradient(120% 80% at 100% 0%, #FFE4EF 0%, rgba(255, 228, 239, 0) 60%), radial-gradient(80% 60% at 0% 100%, #FFE7DC 0%, rgba(255, 231, 220, 0) 60%), var(--bg); }
.pd-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; align-items: center; }
.pd-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 24px; }
.pd-hero__visual { position: relative; display: flex; justify-content: center; }
.pd-hero__note { font: 500 14px/20px var(--f-text); color: var(--ink-3); margin: 12px 0 0; }
@media (min-width: 992px) {
    .pd-hero { padding: 72px 0 96px; }
    .pd-hero__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 56px; }
}

/* Téléphone (capture de l'app) */
.pd-phone { position: relative; width: min(300px, 72vw); aspect-ratio: 644 / 1380; border-radius: 44px; padding: 10px; background: #160D13; box-shadow: 0 30px 80px rgba(91, 23, 54, .28), inset 0 0 0 2px #3A2832; flex: none; }
.pd-phone img { width: 100%; height: 100%; object-fit: cover; object-position: top; border-radius: 34px; display: block; }
.pd-phone--tilt { transform: rotate(-4deg); }
.pd-phone--back { position: absolute; width: min(250px, 58vw); right: 50%; top: 9%; transform: translateX(-38%) rotate(-10deg); opacity: .96; z-index: -1; }
.pd-float { position: absolute; display: flex; align-items: center; gap: 10px; padding: 10px 14px 10px 10px; border-radius: 18px; background: var(--surface); box-shadow: var(--shadow-2); font: 600 14px/18px var(--f-text); color: var(--ink); }
.pd-float small { display: block; font: 500 12px/16px var(--f-text); color: var(--ink-3); }
.pd-float__icon { width: 38px; height: 38px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: var(--primary-soft); color: var(--primary); font-size: 18px; }
@media (max-width: 991.98px) { .pd-float { display: none; } }

/* Bandeau stats */
.pd-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pd-stat { padding: 18px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-1); }
.pd-stat__n { font: 800 30px/34px var(--f-display); letter-spacing: -.02em; }
.pd-stat__l { font: 500 14px/20px var(--f-text); color: var(--ink-2); }
@media (min-width: 768px) { .pd-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } }

/* Étapes */
.pd-steps { counter-reset: step; display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .pd-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; } }
.pd-step { padding: 24px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-1); }
.pd-step__n { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: var(--primary-soft); color: var(--on-primary-soft); font: 800 18px/1 var(--f-display); margin-bottom: 14px; }
.pd-step p { margin: 0; color: var(--ink-2); line-height: 1.55; }

/* Tuiles danses */
.pd-dances { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 768px) { .pd-dances { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
@media (min-width: 1200px) { .pd-dances { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.pd-dancetile { position: relative; display: flex; align-items: flex-end; aspect-ratio: 1 / 1; padding: 14px; border-radius: var(--r-card); overflow: hidden; color: #fff; text-decoration: none; isolation: isolate; background: var(--night); }
.pd-dancetile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 640ms var(--ease); }
.pd-dancetile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(31, 15, 25, 0) 40%, rgba(31, 15, 25, .85) 100%); z-index: -1; }
.pd-dancetile:hover { color: #fff; }
.pd-dancetile:hover img { transform: scale(1.05); }
.pd-dancetile__name { font: 800 19px/22px var(--f-display); }
.pd-dancetile__cta { display: block; font: 600 13px/18px var(--f-text); color: rgba(255, 255, 255, .9); margin-top: 2px; }

/* Bloc fonctionnalités */
.pd-features { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .pd-features { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .pd-features { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.pd-feature { padding: 22px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-1); }
.pd-feature__icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 14px; background: var(--primary-soft); color: var(--primary); font-size: 20px; margin-bottom: 14px; }
.pd-feature p { margin: 0; color: var(--ink-2); font-size: 15px; line-height: 22px; }

/* Bandeau application (nuit) */
.pd-appband { position: relative; overflow: hidden; border-radius: var(--r-sheet); background: radial-gradient(90% 120% at 100% 0%, rgba(216, 27, 106, .55) 0%, rgba(216, 27, 106, 0) 60%), radial-gradient(70% 90% at 0% 100%, rgba(224, 74, 42, .45) 0%, rgba(224, 74, 42, 0) 60%), var(--night); color: #fff; padding: 36px 24px 0; display: grid; gap: 28px; grid-template-columns: minmax(0, 1fr); }
.pd-appband .pd-h2 { color: #fff; }
.pd-appband p { color: rgba(255, 255, 255, .86); }
.pd-appband__visual { display: flex; justify-content: center; align-items: flex-end; margin-bottom: -60px; }
.pd-appband__visual .pd-phone { width: min(260px, 64vw); }
.pd-appband__list { list-style: none; padding: 0; margin: 0 0 24px; display: grid; gap: 10px; }
.pd-appband__list li { display: flex; gap: 10px; align-items: flex-start; color: rgba(255, 255, 255, .92); }
.pd-appband__list .bi { color: #FFB3D2; font-size: 18px; }
@media (min-width: 992px) { .pd-appband { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); padding: 56px 56px 0; align-items: center; } .pd-appband__text { padding-bottom: 56px; } }
.pd-appband-wrap { padding-bottom: 60px; }

/* Témoignages */
.pd-quotes { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .pd-quotes { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; } }
.pd-quote { margin: 0; padding: 24px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-1); display: flex; flex-direction: column; gap: 16px; }
.pd-quote blockquote { margin: 0; font: 500 16px/24px var(--f-text); color: var(--ink); }
.pd-quote figcaption { display: flex; align-items: center; gap: 12px; font: 600 15px/20px var(--f-text); }
.pd-quote figcaption small { display: block; font-weight: 500; color: var(--ink-3); }

/* FAQ */
.pd-faq { display: grid; gap: 10px; }
.pd-faq details { border-radius: var(--r-md); background: var(--surface); box-shadow: var(--shadow-1); }
.pd-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; padding: 16px 20px; font: 700 16px/22px var(--f-text); cursor: pointer; list-style: none; }
.pd-faq summary::-webkit-details-marker { display: none; }
.pd-faq summary::after { content: "\F282"; font-family: "bootstrap-icons"; color: var(--ink-3); transition: transform 160ms var(--ease); }
.pd-faq details[open] summary::after { transform: rotate(180deg); }
.pd-faq details > div { padding: 0 20px 18px; color: var(--ink-2); line-height: 1.6; }

/* ---------- Fiche (prof, événement, danseur) ---------- */
.pd-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 16px 0 0; margin: 0; list-style: none; font: 500 14px/20px var(--f-text); color: var(--ink-3); }
.pd-crumbs a { color: var(--ink-2); text-decoration: none; }
.pd-crumbs a:hover { color: var(--primary); text-decoration: underline; }
.pd-crumbs li + li::before { content: "\F285"; font-family: "bootstrap-icons"; font-size: 11px; margin-right: 6px; color: var(--ink-3); }
.pd-detail { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; padding: 20px 0 64px; }
@media (min-width: 992px) { .pd-detail { grid-template-columns: minmax(0, 1fr) 380px; gap: 40px; padding-top: 24px; } }
.pd-detail__aside { display: grid; gap: 16px; align-content: start; }
@media (min-width: 992px) { .pd-detail__aside { position: sticky; top: calc(var(--pd-header-h) + 20px); } }
.pd-cover { position: relative; border-radius: var(--r-sheet); overflow: hidden; background: var(--night); color: #fff; aspect-ratio: 4 / 5; isolation: isolate; }
.pd-cover > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.pd-cover::after { content: ""; position: absolute; inset: 40% 0 0; background: linear-gradient(180deg, rgba(31, 15, 25, 0), rgba(31, 15, 25, .9)); z-index: -1; }
.pd-cover__body { position: absolute; left: 0; right: 0; bottom: 0; padding: 24px; }
.pd-cover__body .pd-h1 { color: #fff; margin-bottom: 6px; }
.pd-cover__city { display: flex; align-items: center; gap: 6px; font: 500 16px/22px var(--f-text); color: rgba(255, 255, 255, .92); margin: 0; }
.pd-cover--wide { aspect-ratio: 16 / 9; }
@media (min-width: 768px) { .pd-cover { aspect-ratio: 16 / 10; } .pd-cover--wide { aspect-ratio: 21 / 9; } }
.pd-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 768px) { .pd-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.pd-gallery a, .pd-gallery button { display: block; aspect-ratio: 1; border-radius: var(--r-md); overflow: hidden; padding: 0; border: 0; background: var(--sunken); }
.pd-gallery img { width: 100%; height: 100%; object-fit: cover; }
.pd-card { padding: 24px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-1); }
.pd-card--flat { box-shadow: inset 0 0 0 1px var(--line); }
.pd-card__title { display: flex; align-items: center; gap: 10px; font: 700 20px/26px var(--f-display); margin: 0 0 14px; }
.pd-card__title .bi { color: var(--primary); }
.pd-card + .pd-card { margin-top: 0; }
.pd-stack { display: grid; gap: 20px; }
.pd-kv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border-radius: var(--r-md); background: var(--bg); overflow: hidden; }
.pd-kv > div { padding: 14px 16px; text-align: center; }
.pd-kv > div + div { border-left: 1px solid var(--line); }
.pd-kv strong { display: block; font: 800 22px/26px var(--f-display); }
.pd-kv span { font: 500 13px/18px var(--f-text); color: var(--ink-3); }
.pd-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.pd-list li { display: flex; align-items: flex-start; gap: 12px; font: 500 15px/22px var(--f-text); }
.pd-list .bi { color: var(--primary); font-size: 18px; flex: none; margin-top: 1px; }
.pd-cta-card { padding: 22px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-2); display: grid; gap: 14px; }
.pd-cta-card__price { display: flex; align-items: baseline; gap: 6px; font: 800 30px/34px var(--f-display); }
.pd-cta-card__price small { font: 500 15px/20px var(--f-text); color: var(--ink-3); }
.pd-avail { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.pd-avail__day { display: grid; gap: 4px; justify-items: center; padding: 10px 4px; border-radius: var(--r-sm); background: var(--bg); text-align: center; font: 700 13px/16px var(--f-text); }
.pd-avail__day.is-on { background: var(--primary-soft); color: var(--on-primary-soft); }
.pd-avail__slot { font: 500 11px/14px var(--f-text); }
@media (max-width: 575.98px) { .pd-avail { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Barre d'action collante mobile (fiche) */
.pd-stickycta { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1031; display: flex; align-items: center; gap: 12px; padding: 12px var(--pd-gutter) calc(12px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .97); border-top: 1px solid var(--line); box-shadow: 0 -8px 24px rgba(91, 23, 54, .08); }
.pd-stickycta__info { min-width: 0; flex: 1; font: 500 13px/18px var(--f-text); color: var(--ink-3); }
.pd-stickycta__info strong { display: block; font: 800 18px/22px var(--f-display); color: var(--ink); }
@media (min-width: 992px) { .pd-stickycta { display: none; } }
body.has-stickycta { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
body.has-stickycta .pd-tabbar { display: none; }
@media (min-width: 992px) { body.has-stickycta { padding-bottom: 0; } }

/* ---------- Authentification ---------- */
.pd-auth { display: grid; grid-template-columns: minmax(0, 1fr); min-height: calc(100vh - var(--pd-header-h)); }
.pd-auth__panel { display: none; }
.pd-auth__form { display: flex; justify-content: center; padding: 32px var(--pd-gutter) 56px; }
.pd-auth__inner { width: 100%; max-width: 420px; }
.pd-auth__inner .pd-h1 { margin-bottom: 6px; }
.pd-auth__switch { text-align: center; font: 500 15px/22px var(--f-text); color: var(--ink-2); margin: 24px 0 0; }
.pd-auth__switch a { font-weight: 700; }
.pd-social { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pd-social .pd-btn { --h: 50px; font-size: 15px; }
.pd-legalnote { font: 500 13px/19px var(--f-text); color: var(--ink-3); text-align: center; margin: 14px 0 0; }
@media (min-width: 992px) {
    .pd-auth { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .pd-auth__panel { position: relative; display: flex; flex-direction: column; justify-content: flex-end; padding: 48px; color: #fff; overflow: hidden; isolation: isolate; background: var(--night); }
    .pd-auth__panel > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
    .pd-auth__panel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(31, 15, 25, .1) 0%, rgba(31, 15, 25, .35) 45%, rgba(31, 15, 25, .92) 100%); z-index: -1; }
    .pd-auth__panel .pd-h1 { color: #fff; max-width: 14ch; }
    .pd-auth__panel .pd-list li { color: rgba(255, 255, 255, .94); }
    .pd-auth__panel .pd-list .bi { color: #FFB3D2; }
    .pd-auth__form { align-items: center; padding: 48px; }
}

/* ---------- Abonnement prof (nuit, comme le paywall de l'app) ---------- */
.pd-night { position: relative; background: var(--night); color: #fff; overflow: hidden; isolation: isolate; }
.pd-night > img.pd-night__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .45; z-index: -2; }
.pd-night::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(31, 15, 25, .2) 0%, rgba(31, 15, 25, .75) 55%, var(--night) 100%); z-index: -1; }
.pd-night .pd-lead { color: rgba(255, 255, 255, .86); }
.pd-night .pd-display, .pd-night .pd-h1, .pd-night .pd-h2 { color: #fff; }
.pd-premium { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 12px; border-radius: 10px; background: rgba(255, 255, 255, .14); color: #FFB3D2; font: 700 13px/16px var(--f-text); letter-spacing: .08em; text-transform: uppercase; margin-bottom: 14px; }
.pd-perks { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px 24px; list-style: none; margin: 0; padding: 0; }
@media (min-width: 576px) { .pd-perks { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pd-perks li { display: flex; align-items: center; gap: 12px; font: 600 16px/22px var(--f-text); }
.pd-perks .bi { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 255, 255, .1); color: #FFB3D2; font-size: 18px; flex: none; }
.pd-plans { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .pd-plans { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pd-plan { position: relative; display: grid; gap: 4px; padding: 20px; border-radius: var(--r-card); background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .22); }
.pd-plan.is-best { background: rgba(216, 27, 106, .18); box-shadow: inset 0 0 0 2px #FF6FAE; }
.pd-plan__flag { position: absolute; top: -12px; right: 16px; height: 24px; padding: 0 10px; border-radius: var(--r-pill); background: #FF6FAE; color: #2A0716; font: 700 12px/24px var(--f-text); letter-spacing: .06em; text-transform: uppercase; }
.pd-plan__flag--save { background: #F5C46B; color: #33281A; }
.pd-plan__name { font: 700 15px/20px var(--f-text); color: rgba(255, 255, 255, .86); }
.pd-plan__price { font: 800 28px/32px var(--f-display); }
.pd-plan__price small { font: 500 15px/20px var(--f-text); color: rgba(255, 255, 255, .78); }
.pd-plan__total { font: 500 14px/20px var(--f-text); color: rgba(255, 255, 255, .78); }
.pd-howto { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); counter-reset: howto; list-style: none; padding: 0; margin: 0; }
@media (min-width: 768px) { .pd-howto { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pd-howto li { counter-increment: howto; display: flex; gap: 14px; align-items: flex-start; padding: 18px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-1); font: 500 15px/22px var(--f-text); color: var(--ink-2); }
.pd-howto li strong { display: block; color: var(--ink); font-weight: 700; }
.pd-howto li::before { content: counter(howto); display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--primary); color: #fff; font: 800 16px/1 var(--f-display); flex: none; }
.pd-finenote { font: 500 13px/19px var(--f-text); color: rgba(255, 255, 255, .72); margin: 14px 0 0; }

/* ---------- Messagerie ---------- */
.pd-inbox { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; min-height: calc(100vh - var(--pd-header-h) - 40px); }
@media (min-width: 992px) { .pd-inbox { grid-template-columns: 360px minmax(0, 1fr); margin: 20px 0 40px; border-radius: var(--r-sheet); background: var(--surface); box-shadow: var(--shadow-1); overflow: hidden; min-height: 640px; height: calc(100vh - var(--pd-header-h) - 60px); } }
.pd-inbox__list { background: var(--bg); overflow-y: auto; }
@media (min-width: 992px) { .pd-inbox__list { border-right: 1px solid var(--line); background: var(--surface); } }
.pd-inbox__head { display: flex; align-items: center; justify-content: space-between; padding: 20px 20px 12px; }
.pd-inbox__head .pd-h1 { margin: 0; font-size: 30px; }
.pd-convo { display: flex; align-items: center; gap: 14px; padding: 12px 20px; color: var(--ink); text-decoration: none; position: relative; }
.pd-convo:hover { background: var(--sunken); color: var(--ink); }
.pd-convo.is-active { background: var(--primary-soft); }
.pd-convo .pd-avatar { width: 52px; height: 52px; }
.pd-convo__body { min-width: 0; flex: 1; border-bottom: 1px solid var(--line); padding-bottom: 12px; margin-bottom: -12px; }
.pd-convo__row { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.pd-convo__name { font: 700 16px/22px var(--f-text); }
.pd-convo__time { font: 500 13px/18px var(--f-text); color: var(--ink-3); white-space: nowrap; }
.pd-convo__last { font: 400 15px/20px var(--f-text); color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 2px 0 0; }
.pd-convo.is-unread .pd-convo__name, .pd-convo.is-unread .pd-convo__last { font-weight: 700; color: var(--ink); }
.pd-convo.is-unread .pd-convo__time { color: var(--primary); font-weight: 700; }
.pd-inbox__pane { display: none; flex-direction: column; min-width: 0; }
@media (min-width: 992px) { .pd-inbox__pane { display: flex; } }
.pd-inbox__empty { margin: auto; text-align: center; padding: 40px; max-width: 360px; color: var(--ink-2); }
.pd-chat__head { display: flex; align-items: center; gap: 12px; padding: 14px 20px; border-bottom: 1px solid var(--line); background: var(--surface); }
.pd-chat__msgs { flex: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 8px; background: var(--bg); }
.pd-bubble { max-width: min(76%, 520px); padding: 10px 14px; border-radius: 20px; font: 400 15px/21px var(--f-text); background: var(--surface); box-shadow: var(--shadow-1); align-self: flex-start; border-bottom-left-radius: 6px; }
.pd-bubble--me .pd-bubble__time { color: #fff; }
.pd-bubble--me { align-self: flex-end; background: var(--primary); color: #fff; border-bottom-left-radius: 20px; border-bottom-right-radius: 6px; box-shadow: none; }
.pd-bubble__time { display: block; font: 500 11px/14px var(--f-text); color: var(--ink-3); margin-top: 4px; text-align: right; }
.pd-chat__compose { display: flex; align-items: flex-end; gap: 10px; padding: 12px 16px; border-top: 1px solid var(--line); background: var(--surface); }
.pd-chat__compose textarea { flex: 1; min-height: 48px; max-height: 160px; padding: 12px 18px; border-radius: 24px; border: 1.5px solid var(--line-strong); background: var(--bg); font: 400 16px/22px var(--f-text); resize: none; }
.pd-chat__compose textarea:focus { outline: none; border-color: var(--primary); }
.pd-chat__compose .pd-btn { --h: 48px; }

/* ---------- Compte ---------- */
.pd-account { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; padding: 24px 0 64px; }
@media (min-width: 992px) { .pd-account { grid-template-columns: 280px minmax(0, 1fr); gap: 32px; } }
.pd-account__me { display: flex; align-items: center; gap: 14px; padding: 16px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-1); margin-bottom: 12px; }
.pd-account__me strong { display: block; font: 700 17px/22px var(--f-display); }
.pd-subnav { list-style: none; margin: 0; padding: 8px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-1); display: grid; gap: 2px; }
.pd-subnav a { display: flex; align-items: center; gap: 12px; min-height: 46px; padding: 0 12px; border-radius: 12px; font: 600 15px/20px var(--f-text); color: var(--ink-2); text-decoration: none; }
.pd-subnav a:hover { background: var(--sunken); color: var(--ink); }
.pd-subnav a[aria-current="page"] { background: var(--primary-soft); color: var(--on-primary-soft); }
.pd-subnav .bi { font-size: 18px; width: 22px; text-align: center; }
.pd-subnav__sep { height: 1px; background: var(--line); margin: 6px 10px; }
@media (max-width: 991.98px) {
    .pd-subnav { display: flex; overflow-x: auto; scrollbar-width: none; padding: 4px; border-radius: var(--r-pill); background: var(--sunken); box-shadow: none; }
    .pd-subnav::-webkit-scrollbar { display: none; }
    .pd-subnav a { white-space: nowrap; min-height: 40px; border-radius: var(--r-pill); }
    .pd-subnav a[aria-current="page"] { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-1); }
    .pd-subnav__sep, .pd-account__me { display: none; }
}
.pd-setting { display: flex; align-items: center; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.pd-setting:last-child { border-bottom: 0; }
.pd-setting__text { flex: 1; min-width: 0; }
.pd-setting__text strong { display: block; font: 600 16px/22px var(--f-text); }
.pd-setting__text span { font: 500 14px/20px var(--f-text); color: var(--ink-3); }

/* ---------- États ---------- */
.pd-empty { display: grid; justify-items: center; gap: 10px; padding: 48px 24px; text-align: center; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-1); }
.pd-empty__icon { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 50%; background: var(--primary-soft); color: var(--primary); font-size: 28px; }
.pd-empty p { max-width: 42ch; color: var(--ink-2); margin: 0 0 6px; }
.pd-banner { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; padding: 16px 20px; border-radius: var(--r-card); background: var(--primary-soft); color: var(--on-primary-soft); }
.pd-banner__text { flex: 1; min-width: 220px; font: 600 15px/22px var(--f-text); }
.pd-banner__text strong { display: block; font: 700 17px/22px var(--f-display); color: var(--ink); }

/* Pagination */
.pd-pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 32px; }
.pd-pager a, .pd-pager span { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 14px; border-radius: var(--r-pill); background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); color: var(--ink); font: 600 15px/20px var(--f-text); text-decoration: none; }
.pd-pager a:hover { box-shadow: inset 0 0 0 1.5px var(--line-strong); color: var(--ink); }
.pd-pager [aria-current="page"] { background: var(--ink); color: #fff; box-shadow: none; }

/* ---------- Pied de page ---------- */
.pd-footer { background: var(--night); color: #E9DCE3; padding: 56px 0 28px; }
.pd-footer a { color: #E9DCE3; text-decoration: none; }
.pd-footer a:hover { color: #fff; text-decoration: underline; }
.pd-footer__grid { display: grid; gap: 32px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pd-footer__brand { grid-column: 1 / -1; }
@media (min-width: 992px) { .pd-footer__grid { grid-template-columns: 1.6fr 1fr 1fr 1.3fr; } .pd-footer__brand { grid-column: auto; } }
.pd-footer__logo { display: inline-block; padding: 8px 12px; border-radius: var(--r-sm); background: #fff; margin-bottom: 14px; }
.pd-footer__logo img { height: 26px; width: auto; display: block; }
.pd-footer__tagline { font: 400 15px/23px var(--f-text); color: #CDB9C3; max-width: 36ch; margin: 0 0 18px; }
.pd-footer__title { font: 700 12px/16px var(--f-text); letter-spacing: .08em; text-transform: uppercase; color: #FFB3D2; margin: 0 0 14px; }
.pd-footer__links { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; font: 500 15px/20px var(--f-text); }
.pd-footer__links--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; }
.pd-footer__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 40px; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .12); font: 500 14px/20px var(--f-text); color: #CDB9C3; }
.pd-footer__legal { display: flex; flex-wrap: wrap; gap: 8px 18px; list-style: none; margin: 0; padding: 0; }
.pd-footer__legal button { background: none; border: 0; padding: 0; color: #E9DCE3; font: inherit; }
.pd-footer__legal button:hover { color: #fff; text-decoration: underline; }
.pd-footer .pd-store { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .3); }

/* ---------- Divers ---------- */
.pd-hide-mobile { display: none !important; }
@media (min-width: 768px) { .pd-hide-mobile { display: revert !important; } .pd-only-mobile { display: none !important; } }
.pd-scroller { display: grid; grid-auto-flow: column; grid-auto-columns: min(78%, 300px); gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 calc(-1 * var(--pd-gutter)); padding: 4px var(--pd-gutter) 12px; scrollbar-width: none; }
.pd-scroller::-webkit-scrollbar { display: none; }
.pd-scroller > * { scroll-snap-align: start; }
@media (min-width: 992px) { .pd-scroller { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: visible; margin: 0; padding: 0; } }
.pd-scroller--3 { }
@media (min-width: 992px) { .pd-scroller--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

@media (prefers-reduced-motion: reduce) {
    .pd-person img, .pd-dancetile img, .pd-event, .pd-teacher, .pd-btn { transition: none !important; }
}

/* Variante claire du bandeau (accueil, bloc partenaires) */
.pd-appband--light { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-1); }
.pd-appband--light .pd-h2 { color: var(--ink); }
.pd-appband--light p { color: var(--ink-2); }

/* Filtres : formulaires Symfony existants (champs inchangés) mis au style v2 */
.pd-filters form > .mb-3, .pd-filters form > div[id$="-section"] { padding: 14px 0; margin: 0 !important; border-bottom: 1px solid var(--line); }
.pd-filters form > .mb-3:first-child { padding-top: 0; }
.pd-filters .form-label { display: flex; align-items: center; gap: 6px; font: 700 14px/20px var(--f-text) !important; color: var(--ink); margin-bottom: 8px; }
.pd-filters .form-label > .bi { display: none; }
.pd-filters .form-control, .pd-filters .form-select { min-height: 48px; border-radius: var(--r-field); border: 1.5px solid var(--line-strong); font-size: 16px; background-color: var(--surface); }
.pd-filters .form-control:focus, .pd-filters .form-select:focus { border-color: var(--primary); box-shadow: 0 0 0 4px rgba(216, 27, 106, .16); }
.pd-filters .badge.bg-secondary { background: var(--sunken) !important; color: var(--ink-2); font-weight: 700; }
.pd-filters .checkbox-group { display: flex; flex-wrap: wrap; gap: 6px; max-height: none; overflow: visible; padding: 0; border: 0; background: none; }
.pd-filters .checkbox-item { position: relative; display: inline-flex; margin: 0; padding: 0; }
.pd-filters .checkbox-item input[type="checkbox"] { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.pd-filters .checkbox-item label { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; margin: 0; border-radius: var(--r-pill); background: var(--surface); box-shadow: inset 0 0 0 1px var(--line-strong); color: var(--ink); font: 600 14px/18px var(--f-text); cursor: pointer; white-space: nowrap; }
.pd-filters .checkbox-item input:checked + label { background: var(--ink); color: #fff; box-shadow: none; }
.pd-filters .checkbox-item input:focus-visible + label { outline: 3px solid var(--primary); outline-offset: 2px; }
.pd-filters .pd-filters__actions { margin-top: 4px; }
@media (max-width: 991.98px) { .pd-filters .offcanvas-body { padding: 20px; } }
.pd-pager a { gap: 6px; }
.pd-pager__txt { display: none; }
@media (min-width: 768px) { .pd-pager__txt { display: inline; } }

/* Onglets de page hérités (carte, suivis…) : rendus comme le contrôle segmenté de l'app */
main .page-tabs { display: inline-flex; gap: 4px; padding: 4px; margin-bottom: 1.5rem; border: 0; border-radius: var(--r-pill); background: var(--sunken); max-width: 100%; overflow-x: auto; scrollbar-width: none; }
main .page-tabs a { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border: 0; border-radius: var(--r-pill); color: var(--ink-2); font: 600 15px/20px var(--f-text); white-space: nowrap; flex-shrink: 0; }
main .page-tabs a i { margin: 0; }
main .page-tabs a:hover { color: var(--ink); border: 0; }
main .page-tabs a.active { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-1); border: 0; }
main > .container > h1.fw-bold:first-child { font: 800 clamp(30px, 4vw, 44px)/1.08 var(--f-display) !important; letter-spacing: -0.02em; }

/* Fil d'Ariane : plus de carte blanche autour (v1) */
main .breadcrumb-container { background: none; box-shadow: none; padding: 0; margin: 0; border-radius: 0; }
.pd-card .organizer-chip-detail small { display: none; }
.pd-card .organizer-chip-detail { padding: 0; background: none; box-shadow: none; }

/* Médias des cartes : le ratio prime sur la taille de la photo (portraits 2/3 inclus) */
.pd-teacher__media, .pd-event__media { overflow: hidden; min-height: 0; flex: none; }
.pd-teacher__media > img, .pd-event__media > img { position: absolute; inset: 0; }
.pd-stack, .pd-detail__aside { grid-template-columns: minmax(0, 1fr); }
#teacherCalendar { overflow-x: auto; }

/* Messagerie plein écran (conversation) */
.pd-chat-page .messaging-container { height: calc(100dvh - var(--pd-header-h)); max-width: calc(var(--pd-max) + 2 * var(--pd-gutter)); padding: 20px var(--pd-gutter); }
.pd-chat-page .messaging-wrapper { border-radius: var(--r-sheet); box-shadow: var(--shadow-1); }
.pd-chat-page .partner-info { gap: 12px; }
.pd-chat-page .partner-location { color: var(--ink-3); font-size: 14px; margin: 0; }
.pd-chat-page .send-btn { width: 48px; height: 48px; flex: none; }
.pd-chat-page .send-form textarea { border-radius: 24px; border: 1.5px solid var(--line-strong); min-height: 48px; resize: none; }
@media (max-width: 991.98px) {
    .pd-chat-page .messaging-container { padding: 0; }
    .pd-chat-page .messaging-wrapper { border-radius: 0; box-shadow: none; }
    .pd-chat-page .conversations-sidebar { display: none; }
    .pd-chat-page .send-area { padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
}

/* Compte : onglets et sous-navigation au style de l'app */
.pd-account-page { max-width: calc(var(--pd-max) + 2 * var(--pd-gutter)) !important; padding-left: var(--pd-gutter) !important; padding-right: var(--pd-gutter) !important; }
.pd-account-page .pd-pagehead { padding-top: 24px; }
.pd-account-page .profile-tabs { display: inline-flex; gap: 4px; padding: 4px; margin-bottom: 24px; border: 0; border-radius: var(--r-pill); background: var(--sunken); max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.pd-account-page .profile-tab { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border: 0 !important; border-radius: var(--r-pill); color: var(--ink-2); font: 600 15px/20px var(--f-text); white-space: nowrap; text-decoration: none; background: none; }
.pd-account-page .profile-tab.active { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-1); }
.pd-account-page .profile-tab::after { display: none !important; }
@media (max-width: 768px) {
    .pd-account-page .section-nav { display: flex !important; flex-direction: row !important; overflow-x: auto; gap: 6px; padding: 4px !important; scrollbar-width: none; }
    .pd-account-page .section-nav-item { flex: none; white-space: nowrap; }
    .pd-account-page .section-nav-item span { display: inline !important; }
}

/* S'abonner via l'app : formules cliquables, fenêtre QR code (schéma Vizbloom) */
button.pd-plan { width: 100%; border: 0; text-align: left; color: #fff; font: inherit; cursor: pointer; transition: transform 100ms var(--ease), box-shadow 160ms var(--ease); }
button.pd-plan:hover { box-shadow: inset 0 0 0 2px #FF8FC0; }
button.pd-plan:active { transform: scale(.98); }
button.pd-plan:focus-visible { outline: 3px solid #FFB3D2; outline-offset: 3px; }
.pd-plan__cta { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; font: 700 15px/20px var(--f-text); color: #FFB3D2; }
.pd-qr { display: flex; justify-content: center; }
.pd-qr__svg { width: 200px; height: auto; max-width: 100%; border-radius: 16px; box-shadow: 0 0 0 1px var(--line); background: #fff; }
.pd-subpage { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
.pd-subpage__qr { display: none; }
@media (min-width: 992px) { .pd-subpage { grid-template-columns: minmax(0, 1fr) 260px; } .pd-subpage__qr { display: block; padding: 20px; } }
.pd-subdialog .modal-content { position: relative; border-radius: var(--r-sheet); overflow: hidden; }
.pd-subdialog__close { position: absolute; top: 16px; right: 16px; z-index: 2; }
.pd-subdialog__grid { display: grid; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .pd-subdialog__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); } }
.pd-subdialog__offer { padding: 28px; background: var(--bg); }
.pd-subdialog__app { padding: 28px; }
.pd-subdialog__price { font: 800 36px/40px var(--f-display); letter-spacing: -.02em; margin: 12px 0 2px; }
.pd-subdialog__price small { font: 500 15px/20px var(--f-text); color: var(--ink-3); }
.pd-substeps { margin: 12px 0 0; padding-left: 20px; display: grid; gap: 6px; font: 500 15px/22px var(--f-text); color: var(--ink-2); }
.pd-subdialog .pd-stores { justify-content: center; }
.pd-subdialog .modal-content { color: var(--ink); background: var(--surface); }
.pd-subdialog .pd-h2 { color: var(--ink); }