/* ==========================================================================
   Walooma UI 3 — couche d'hôte WordPress.
   Uniquement ce que la maquette ne peut pas savoir : la page WordPress qui
   l'accueille (plein écran, WebView), les liens réels qui remplacent les
   boutons de démonstration, la vraie carte Google Maps et les états réseau.
   Aucune règle de cette feuille ne redéfinit l'apparence d'un composant.
   ========================================================================== */

html.wl-v4-html,
html.wl-v4-html body.wl-v4-body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden;
  background: #f2f5f4;
}
body.wl-v4-body > .wl-app {
  height: 100vh;
  height: 100dvh;
}

/* Respecter les états conditionnels, même sur les composants flex/grid. */
.wl-app [hidden] { display: none !important; }

/* Les navigations réelles sont des liens : même apparence que les boutons
   de la maquette. :where() garde une spécificité minimale. */
.wl-app :where(a.wl-btn, a.wl-iconbtn, a.wl-row, a.wl-side__item, a.wl-tabbar__item, a.wl-tabs__tab,
  a.wl-side__mode, a.wl-stat, a.wl-offer, a.wl-service, a.wl-rolecard, a.wl-sos__num, a.wl-notif, a.wl-resume) {
  text-decoration: none;
  color: inherit;
}
.wl-app :where(a.wl-link) { text-decoration: underline; text-underline-offset: 2px; }
.wl-app :where(a.wl-tabs__tab) { display: inline-flex; align-items: center; justify-content: center; }

/* Carte Google Maps réelle (rendue par Walooma Core) dans le cadre de la maquette. */
.wl-app .wl-gmap { position: absolute; inset: 0; }
.wl-app .wl-gmap[hidden] { display: none; }
.wl-app .wl-gmap-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.wl-app .wl-gmap-placeholder {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 8px;
  padding: 24px;
  text-align: center;
  color: var(--wl-muted);
  background:
    radial-gradient(circle at 30% 30%, rgba(19, 165, 146, 0.10), transparent 45%),
    linear-gradient(180deg, var(--wl-map-land), var(--wl-map-block));
  font-size: var(--wl-fs-sm);
}
.wl-app .wl-gmap-placeholder .wl-icon { color: var(--wl-accent); }
/* Suggestions d'adresse Google Places au-dessus de l'application. */
.pac-container { z-index: 100000; font-family: "Figtree", system-ui, sans-serif; }

/* Hors ligne (événements navigateur). */
.wl-app .wl-offline-flag {
  position: absolute;
  top: calc(8px + var(--wl-safe-top));
  left: 50%;
  transform: translateX(-50%);
  z-index: 90;
  display: flex;
  align-items: center;
  gap: 8px;
  width: min(520px, calc(100% - 24px));
  padding: 10px 14px;
  border-radius: var(--wl-r-md);
  background: var(--wl-warn-soft);
  color: var(--wl-warn);
  box-shadow: var(--wl-shadow-2);
  font-size: var(--wl-fs-sm);
  font-weight: 600;
}
.wl-app .wl-offline-flag[hidden] { display: none; }

/* Formulaires natifs soumis au contrôleur propriétaire : les étapes masquées restent dans le formulaire. */
.wl-app [data-wl-step-panel][hidden] { display: none; }

/* Messages de retour des contrôleurs (succès / erreur) affichés en tête de page. */
.wl-app .wl-flash { margin-bottom: var(--wl-s2); }

/* Zone de fichier native, présentée comme un bouton de la maquette. */
.wl-app .wl-filepick { position: relative; display: inline-flex; }
.wl-app .wl-filepick input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

/* Clavier ouvert sur mobile : la barre d'onglets laisse la place au champ. */
.wl-app .wl-tabbar.is-kb-hidden { display: none; }

/* Un panneau d'étape garde le rythme vertical du formulaire de la maquette. */
.wl-app .wl-form > [data-wl-step-panel]:not([hidden]) { display: flex; flex-direction: column; gap: var(--wl-s4); }

/* Texte réservé aux lecteurs d'écran. */
.wl-app .wl-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Fieldset neutre (groupes de cartes de choix). */
.wl-app fieldset.wl-rolecards { border: 0; margin: 0; padding: 0; min-width: 0; }

/* Carte de profil utilisée comme vrai bouton radio de formulaire (inscription). */
.wl-app .wl-rolecard--choice { position: relative; cursor: pointer; }
.wl-app .wl-rolecard__input { position: absolute; opacity: 0; pointer-events: none; }
.wl-app .wl-rolecard__check {
  display: grid; place-items: center; flex: none; width: 24px; height: 24px;
  border-radius: 50%; border: 1.5px solid var(--wl-line-strong, var(--wl-line)); color: transparent;
}
.wl-app .wl-rolecard--choice:has(.wl-rolecard__input:checked) { border-color: var(--wl-accent); background: var(--wl-accent-soft); }
.wl-app .wl-rolecard--choice:has(.wl-rolecard__input:checked) .wl-rolecard__check { background: var(--wl-accent); border-color: var(--wl-accent); color: #fff; }
.wl-app .wl-rolecard--choice:has(.wl-rolecard__input:focus-visible) { outline: 3px solid var(--wl-focus, var(--wl-accent)); outline-offset: 2px; }

/* Bouton Afficher/Masquer sous un champ mot de passe. */
.wl-app .wl-field__toggle { align-self: flex-end; min-height: 32px; margin-top: -4px; font-size: var(--wl-fs-sm); }

/* Mention légale sous le formulaire de connexion. */
.wl-app .wl-auth__legal { font-size: var(--wl-fs-xs, 12px); text-align: center; margin: 0; }
.wl-app .wl-auth__legal .wl-link { display: inline; min-height: 0; font-size: inherit; }
.wl-app .wl-form > .wl-link { align-self: flex-start; }
.wl-app .wl-check .wl-link { display: inline; min-height: 0; }
.wl-app [tabindex="-1"]:focus:not(:focus-visible) { outline: none; }
.wl-app .wl-bill__line[hidden] { display: none; }
.wl-app .wl-tabs { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.wl-app .wl-tabs::-webkit-scrollbar { display: none; }
.wl-app .wl-tabs__tab { flex: 0 0 auto; white-space: nowrap; }
.wl-app .wl-booking-map { position: relative; height: 180px; border-radius: var(--wl-r-lg); overflow: hidden; border: 1px solid var(--wl-line); }
.wl-app .wl-chat__log--page { padding: 0; overflow: visible; }
.wl-app .wl-card .wl-chat__closed { border-top: 0; background: transparent; }
.wl-app .wl-chat--page { height: 100%; }
.wl-app .wl-notif.is-unread time { margin-right: 12px; }

/* Horaires hebdomadaires (Santé › Disponibilités) */
.wl-app .wl-hours { display: flex; flex-direction: column; }
.wl-app .wl-hours__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--wl-s3); padding: var(--wl-s3) 0; border-top: 1px solid var(--wl-line); }
.wl-app .wl-hours__row:first-child { border-top: 0; }
.wl-app .wl-hours__range { display: flex; align-items: center; gap: var(--wl-s2); flex: 1 1 18rem; justify-content: flex-end; min-width: 0; }
.wl-app .wl-hours__range .wl-input { flex: 1 1 8.5rem; width: auto; min-width: 8.5rem; max-width: 11rem; }
@media (max-width: 600px) { .wl-app .wl-hours__range { flex-basis: 100%; justify-content: stretch; } .wl-app .wl-hours__range .wl-input { max-width: none; } }
.wl-app .wl-form__actions { margin-top: var(--wl-s4); }
.wl-app .wl-month a.wl-month__cell { text-decoration: none; color: inherit; }

/* ---- Espace gestionnaire (Manager 1.5) ---- */
.wl-app .wl-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--wl-s3); justify-content: space-between; }
.wl-app .wl-toolbar__filters { display: flex; flex-wrap: wrap; gap: var(--wl-s2); }
.wl-app .wl-toolbar .wl-btn.is-active { background: var(--wl-primary); color: var(--wl-on-primary, #fff); }
.wl-app .wl-inline { display: inline-flex; margin: 0; }
.wl-app .wl-table tr[hidden] { display: none; }
.wl-app .wl-card.is-selected { outline: 2px solid var(--wl-primary); }
.wl-app .wm-svc { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--wl-s3); }
.wl-app .wm-svc__text { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.wl-app .wm-svc__text h3 { font-family: var(--wl-font-display); font-size: var(--wl-fs-lg); font-weight: 600; margin: 0; }
.wl-app .wm-svc__text p { margin: 0; }
.wl-app .wm-svc__actions { display: flex; gap: var(--wl-s2); align-items: center; }
.wl-app .wm-account { display: flex; flex-direction: column; gap: var(--wl-s3); }
.wl-app .wm-manage > summary { cursor: pointer; font-weight: 650; display: flex; gap: var(--wl-s3); align-items: baseline; padding: 6px 0; list-style-position: inside; }
.wl-app .wm-manage__body { display: flex; flex-direction: column; gap: var(--wl-s4); padding-top: var(--wl-s3); border-top: 1px solid var(--wl-line); margin-top: var(--wl-s2); }
.wl-app .wm-acts { display: flex; flex-wrap: wrap; gap: var(--wl-s3); align-items: center; }
.wl-app .wm-act { display: flex; gap: var(--wl-s2); align-items: center; flex-wrap: wrap; margin: 0; }
.wl-app .wm-priv { display: flex; flex-direction: column; gap: var(--wl-s3); padding: var(--wl-s4); border: 1px solid var(--wl-line); border-radius: var(--wl-r-lg); background: var(--wl-surface-2); }
.wl-app .wm-priv__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--wl-s3); }
.wl-app .wm-priv__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: var(--wl-s2); }
.wl-app .wm-doc-stage { min-height: 320px; display: flex; align-items: center; justify-content: center; }
.wl-app .wm-doc-stage img, .wl-app .wm-doc-stage iframe { width: 100%; max-height: 70vh; border: 0; min-height: 320px; object-fit: contain; }
.wl-app .wl-modal__panel--wide { width: min(860px, 96vw); }
.wl-app .wl-modal .wl-modal__foot { display: flex; justify-content: space-between; align-items: center; gap: var(--wl-s3); flex-wrap: wrap; }
.wl-app .wl-modal[hidden], .wl-app [data-wm-extra][hidden], .wl-app [data-wm-account-panel][hidden] { display: none !important; }
.wl-app .wl-stat__sub { overflow-wrap: anywhere; }
.wl-app .wl-toolbar + p.wl-muted { margin-top: var(--wl-s3); }
@media (max-width: 720px) {
  .wl-app .wl-table td.wl-table__go { top: 8px; right: 8px; }
  .wl-app .wl-table tr > td:first-child { padding-right: 52px; justify-content: flex-start; text-align: left; }
  .wl-app .wl-table tr > td:first-child > span { margin-left: auto; text-align: right; }
}
.wl-app .wm-stars { color: #e0a100; letter-spacing: 1px; white-space: nowrap; }
.wl-app .wm-stars__off { color: var(--wl-line-strong, #d3dad7); }
.wl-app .wm-review__text { margin: var(--wl-s3) 0 0; }
.wl-app .wl-input-group + .wl-muted, .wl-app .wl-field > .wl-muted { font-size: var(--wl-fs-sm); }
.wl-app .wl-tabs { max-width: 100%; overflow-x: auto; scrollbar-width: none; flex-wrap: nowrap; }
.wl-app .wl-tabs::-webkit-scrollbar { display: none; }
.wl-app .wl-tabs__tab { flex: none; white-space: nowrap; }
@media (max-width: 560px) {
  .wl-app .wl-row { flex-wrap: wrap; row-gap: var(--wl-s2); }
  .wl-app .wl-row__text { flex: 1 1 55%; min-width: 0; }
  .wl-app .wl-row > .wl-person__right, .wl-app .wl-row > .wl-badge, .wl-app .wl-row > b, .wl-app .wl-row > span.wl-badge { margin-left: auto; }
}
.wl-app [data-wm-account-card][hidden], .wl-app [data-wl-row][hidden] { display: none !important; }