/**
 * Calendanse — Responsive & ergonomie (audit)
 * Namespace: .cd-audit pour wrappers optionnels.
 * Surcharges ciblées: .mec-wrap, .cd-alerts-*, .cd-orgs-*, .cd-dir__*, .cd-mec-forum-cta, .mec-fes-form
 * Breakpoints: 480px, 768px, 1024px
 * Ne pas modifier les sources MEC/wpForo; pas de régression desktop.
 */

/* ==========================================================================
   GLOBAL — Débordements, conteneur racine
   ========================================================================== */

.cd-audit-wrap {
  overflow-x: hidden;
  max-width: 100%;
}

/* ==========================================================================
   ALERTES (Calendanse Core)
   ========================================================================== */

@media (max-width: 768px) {
  .cd-alerts-center {
    overflow-x: hidden;
    max-width: 100%;
  }
  .cd-alerts-center__filters {
    gap: 0.5rem;
  }
  .cd-alerts-center__filter {
    min-height: 48px;
    padding: 0.5rem 0.85rem;
    display: inline-flex;
    align-items: center;
  }
  .cd-alerts-btn {
    min-height: 48px;
    padding: 0.6rem 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .cd-alerts-center {
    padding: 0 12px;
  }
  .cd-alerts-settings {
    padding: 0 12px;
  }
  .cd-alerts-center__item-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .cd-alerts-center__item-actions .cd-alerts-btn {
    width: 100%;
  }
}

/* ==========================================================================
   FAVORIS — Mon agenda, Mes organisateurs (shortcodes inline)
   ========================================================================== */

@media (max-width: 768px) {
  .cd-orgs-wrap,
  .cd-my-stats {
    margin-left: 0;
    margin-right: 0;
    padding: 12px;
    overflow-x: hidden;
    max-width: 100%;
  }
  .cd-orgs-head {
    flex-direction: column;
    align-items: stretch;
  }
  .cd-orgs-search {
    min-width: 100% !important;
    max-width: 100% !important;
  }
  .cd-org-row {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .cd-org-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .cd-org-actions .cd-org-link,
  .cd-org-actions .cd-follow-remove-btn,
  .cd-org-actions .cd-auto-btn {
    min-height: 48px;
    padding: 10px 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .cd-my-agenda-item {
    flex-direction: column;
    align-items: stretch;
  }
  .cd-my-agenda-date {
    min-width: 0 !important;
  }
  .cd-my-agenda-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .cd-my-agenda-actions .cd-my-agenda-detail,
  .cd-my-agenda-actions .cd-fav-remove-btn {
    min-height: 48px;
    padding: 12px 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
  }
}

@media (max-width: 480px) {
  .cd-my-agenda-actions .cd-my-agenda-detail,
  .cd-my-agenda-actions .cd-fav-remove-btn {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .cd-chips {
    gap: 6px;
  }
  .cd-chip {
    padding: 8px 12px;
    min-height: 44px;
    box-sizing: border-box;
  }
}

/* ==========================================================================
   LISTE ORGANISATEURS (Calendanse Core) — renfort
   ========================================================================== */

@media (max-width: 480px) {
  .cd-dir__filters-v2 {
    padding: 0.75rem 0;
  }
  .cd-dir__input-search {
    max-width: 100%;
  }
  .cd-dir__card-media,
  .cd-dir__card-img {
    max-width: 100%;
    height: auto;
  }
}

/* Images et médias — fluidité globale */
@media (max-width: 768px) {
  .cd-dir__grid,
  .cd-orgs-list,
  .cd-my-agenda-list {
    overflow-x: hidden;
  }
  .cd-dir__card,
  .cd-org-row,
  .cd-my-agenda-item {
    min-width: 0;
  }
  .mec-wrap img,
  .cd-mec-forum-cta img {
    max-width: 100%;
    height: auto;
  }
}

/* ==========================================================================
   FORUM CTA (MEC Forum Bridge V2)
   ========================================================================== */

@media (max-width: 768px) {
  .cd-mec-forum-cta {
    margin: 16px 0;
    max-width: 100%;
    overflow-x: hidden;
  }
  .cd-mec-forum-cta-inner {
    padding: 14px;
    border-radius: 12px;
    box-sizing: border-box;
  }
  .cd-mec-forum-cta-title {
    font-size: 1.1rem;
  }
  .cd-mec-forum-cta-button {
    min-height: 48px;
    padding: 12px 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
  }
}

@media (max-width: 480px) {
  .cd-mec-forum-cta-inner {
    padding: 12px;
  }
}

/* ==========================================================================
   FES — Création / édition d’événement (priorité mobile)
   ========================================================================== */

/* Une colonne à partir de 1024px */
@media (max-width: 1024px) {
  .mec-fes-form .mec-fes-form-cntt,
  .mec-fes-form .mec-fes-form-sdbr {
    width: 100% !important;
    float: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-bottom: 1rem;
  }
  .mec-fes-form .mec-fes-form-sdbr {
    margin-top: 0.5rem;
  }
}

/* Champs pleine largeur, box-sizing */
@media (max-width: 1024px) {
  .mec-fes-form #mec_fes_form .mec-form-row input[type="text"],
  .mec-fes-form #mec_fes_form input[type="url"],
  .mec-fes-form #mec_fes_form input[type="number"],
  .mec-fes-form #mec_fes_form input[type="email"],
  .mec-fes-form #mec_fes_form input[type="tel"],
  .mec-fes-form #mec_fes_form textarea,
  .mec-fes-form #mec_fes_form select,
  .mec-fes-form #mec_fes_form #mec_fes_title,
  .mec-fes-form #mec_fes_form .mec-col-12 {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }
  .mec-fes-form #mec_event_data input[type="date"],
  .mec-fes-form #mec_event_data select {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }
}

/* Hourly schedule — empiler sur mobile, aucun overflow */
@media (max-width: 768px) {
  .mec-fes-form #mec_meta_box_hourly_schedule_days {
    overflow-x: hidden;
    max-width: 100%;
  }
  .mec-fes-form #mec_meta_box_hourly_schedule_days .mec-form-row input[type="text"],
  .mec-fes-form #mec_meta_box_hourly_schedule_days .mec-form-row input[type="text"].mec-col-1,
  .mec-fes-form #mec_meta_box_hourly_schedule_days .mec-form-row input[type="text"].mec-col-2,
  .mec-fes-form #mec_meta_box_hourly_schedule_days .mec-form-row input[type="text"].mec-col-6 {
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-bottom: 0.5rem;
    box-sizing: border-box;
  }
  .mec-fes-form #mec_meta_box_hourly_schedule_days .mec-form-row button {
    margin-top: 0.25rem;
    min-height: 48px;
    padding: 10px 16px;
  }
}

/* Zones tactiles (boutons, liens, checkbox/radio) — min 48px recommandé */
@media (max-width: 768px) {
  .mec-fes-form label,
  .mec-fes-form .mec-meta-box-fields h4,
  .mec-fes-form .mec-meta-box-fields h4 label {
    padding: 12px 16px;
  }
  .mec-fes-form input[type="checkbox"],
  .mec-fes-form input[type="radio"] {
    min-width: 24px;
    min-height: 24px;
    margin-top: 2px;
  }
  .mec-fes-form .mec-fes-form-top-actions a,
  .mec-fes-form .mec-fes-form-back-to {
    min-height: 48px;
    padding: 12px 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .mec-fes-form #mec_fes_form select,
  .mec-fes-form #mec_fes_form input[type="text"],
  .mec-fes-form #mec_fes_form input[type="number"],
  .mec-fes-form #mec_fes_form input[type="url"],
  .mec-fes-form #mec_fes_form input[type="email"],
  .mec-fes-form #mec_event_data input,
  .mec-fes-form #mec_event_data select {
    min-height: 48px;
    padding: 12px 14px;
    box-sizing: border-box;
    font-size: 16px; /* V2.2 : évite zoom auto au focus sur iOS */
  }
  .mec-fes-form #mec_fes_form textarea {
    min-height: 120px;
    padding: 12px 14px;
    box-sizing: border-box;
    font-size: 16px;
  }
  /* Espacements verticaux entre champs */
  .mec-fes-form .mec-form-row {
    margin-bottom: 1rem;
  }
  .mec-fes-form .mec-meta-box-fields {
    margin-bottom: 1.25rem !important;
  }
}

/* Barre d’action (submit) — visible et sticky sur mobile (V2.1 : pas de fixed ; V2.2 : Safari) */
@media (max-width: 1024px) {
  .mec-fes-form .mec-fes-submit-wide {
    position: sticky;
    position: -webkit-sticky;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    margin: 0;
    padding: 14px 16px;
    background: #fff;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
    border-top: 1px solid #e5e5e5;
  }
  /* Désactivation d’urgence du sticky si conflit (ajouter .cd-fes-sticky-off sur .mec-fes-form) */
  .mec-fes-form.cd-fes-sticky-off .mec-fes-submit-wide {
    position: relative;
  }
  .mec-fes-form .mec-fes-sub-button {
    width: 100% !important;
    min-height: 48px !important;
    padding: 14px 20px !important;
    font-size: 1rem !important;
    font-weight: 600;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  /* Réserve d’espace en bas pour qu’aucun champ ne soit caché sous la barre sticky */
  .mec-fes-form #mec_fes_form {
    padding-bottom: 88px;
  }
}

@media (max-width: 480px) {
  .mec-fes-form .mec-fes-submit-wide {
    padding: 12px;
  }
  .mec-fes-form .mec-fes-sub-button {
    min-height: 48px !important;
  }
  .mec-fes-form #mec_fes_form {
    padding-bottom: 92px;
  }
}

/* Message d’erreur visible — jamais masqué par la barre sticky */
@media (max-width: 1024px) {
  #mec_fes_form_message {
    max-width: 100%;
    margin: 10px 0;
    padding: 10px 12px;
    box-sizing: border-box;
    position: relative;
    z-index: 50;
    background: #fff8f0;
    border: 1px solid #e5d5c0;
    border-radius: 8px;
  }
  #mec_fes_form_message:not(.mec-util-hidden) {
    display: block !important;
  }
}

@media (max-width: 768px) {
  #mec_fes_form_message {
    margin: 10px 0;
    padding: 10px 12px;
  }
}

/* Meta boxes FES — espacement et lisibilité */
@media (max-width: 768px) {
  .mec-fes-form .mec-meta-box-fields {
    padding: 0 12px 16px;
    margin-bottom: 16px !important;
  }
  .mec-fes-form .mec-meta-box-fields h4,
  .mec-fes-form .mec-meta-box-fields h4 label {
    margin: 0 -12px;
    padding: 12px;
    font-size: 14px;
  }
  .mec-fes-form .mec-fes-editor {
    margin-bottom: 16px;
  }
}

/* Éviter overflow horizontal sur tout le formulaire */
@media (max-width: 1024px) {
  .mec-fes-form {
    overflow-x: hidden;
    max-width: 100%;
  }
  .mec-fes-form .mec-fes-form-cntt,
  .mec-fes-form .mec-fes-form-sdbr {
    max-width: 100%;
  }
}

/* Images fluides dans FES (thumbnail, gallery) */
@media (max-width: 768px) {
  .mec-fes-form .mec-form-row img,
  .mec-fes-form .mec-thumbnail-preview img {
    max-width: 100%;
    height: auto;
  }
}

/* Datepicker MEC (jQuery UI) — position et largeur sur mobile (V2.1 : renfort ≤480px) */
@media (max-width: 768px) {
  body:has(.mec-fes-form) .ui-datepicker {
    max-width: min(360px, calc(100vw - 24px));
    left: 50% !important;
    transform: translateX(-50%);
    box-sizing: border-box;
  }
  body:has(.mec-fes-form) .ui-datepicker .ui-datepicker-header,
  body:has(.mec-fes-form) .ui-datepicker table {
    width: 100%;
  }
  body:has(.mec-fes-form) .ui-datepicker a,
  body:has(.mec-fes-form) .ui-datepicker span {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
  }
}

@media (max-width: 480px) {
  body:has(.mec-fes-form) .ui-datepicker {
    max-width: calc(100vw - 16px);
    max-height: 70vh;
    overflow: auto;
  }
  body:has(.mec-fes-form) .ui-datepicker a,
  body:has(.mec-fes-form) .ui-datepicker span {
    min-height: 40px;
    font-size: 14px;
  }
}

/* Tooltips FES — ouverture au tap sur mobile (V2.2 : touch-action pour réactivité) */
@media (max-width: 1024px) {
  .mec-fes-form .mec-tooltip {
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  .mec-fes-form .mec-tooltip.cd-tooltip-open .box {
    visibility: visible !important;
    opacity: 1 !important;
    padding: 16px;
  }
  .mec-fes-form .mec-tooltip.cd-tooltip-open .box.top {
    left: 0;
    right: auto;
    max-width: min(320px, calc(100vw - 24px));
  }
}

/* Sections repliables FES (détails/summary injectés par JS) */
@media (max-width: 1024px) {
  .mec-fes-form .cd-fes-section {
    margin-bottom: 0.5rem;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
  }
  .mec-fes-form .cd-fes-section summary {
    padding: 14px 16px;
    font-weight: 600;
    font-size: 0.95rem;
    cursor: pointer;
    list-style: none;
    user-select: none;
    background: #f8f9fa;
    border-bottom: 1px solid #eee;
  }
  .mec-fes-form .cd-fes-section summary::-webkit-details-marker {
    display: none;
  }
  .mec-fes-form .cd-fes-section summary::before {
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid currentColor;
    margin-right: 10px;
    vertical-align: middle;
    transition: transform 0.2s ease;
  }
  .mec-fes-form .cd-fes-section[open] summary::before {
    transform: rotate(180deg);
  }
  .mec-fes-form .cd-fes-section-content {
    padding: 0;
  }
}

/* ==========================================================================
   MEC WRAP — Cartes événements (listing)
   ========================================================================== */

@media (max-width: 768px) {
  .mec-wrap .mec-event-article,
  .mec-wrap .mec-event-list-item {
    max-width: 100%;
  }
  .mec-wrap .mec-event-article .mec-event-title .cd-fav-star,
  .mec-wrap .mec-event-list-item .cd-fav-star {
    margin-left: 0.2em;
  }
}

@media (max-width: 480px) {
  .mec-wrap .mec-event-article .mec-event-title,
  .mec-wrap .mec-event-list-item .mec-event-title {
    font-size: 1rem;
  }
}

/* ==========================================================================
   BOUTONS GÉNÉRAUX — Zones tactiles (confort)
   ========================================================================== */

@media (max-width: 768px) {
  .cd-fav-btn,
  .cd-follow-btn {
    min-height: 44px;
    padding: 10px 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

/* ==========================================================================
   V2.2 — Multi-devices : tablette, overflow, lisibilité
   ========================================================================== */

/* Tablette (largeur intermédiaire type iPad 834px) */
@media (min-width: 769px) and (max-width: 1024px) {
  .mec-wrap {
    overflow-x: hidden;
    max-width: 100%;
  }
  .cd-orgs-wrap,
  .cd-my-stats,
  .cd-alerts-center {
    max-width: 100%;
  }
  .mec-fes-form .mec-fes-submit-wide {
    padding-bottom: calc(14px + env(safe-area-inset-bottom, 0));
  }
}

@media (min-width: 769px) and (max-width: 834px) {
  .cd-org-actions,
  .cd-my-agenda-actions {
    gap: 0.5rem;
  }
  .cd-mec-forum-cta-button {
    min-height: 48px;
  }
}

/* Cohérence espacement groupes de boutons FES (mobile + tablette) */
@media (max-width: 1024px) {
  .mec-fes-form .mec-fes-submit-wide .mec-fes-sub-button {
    margin-top: 0;
  }
  .mec-fes-form .mec-form-row.mec-fes-submit-wide {
    gap: 0.5rem;
  }
}

/* ==========================================================================
   V3 — FES wizard 3 étapes (simplification, ressenti app)
   ========================================================================== */

/* Visibilité des étapes : une seule active à la fois */
.mec-fes-form.cd-fes-wizard-active.cd-fes-step-1-active [data-cd-fes-step="2"],
.mec-fes-form.cd-fes-wizard-active.cd-fes-step-1-active [data-cd-fes-step="3"] {
  display: none !important;
}
.mec-fes-form.cd-fes-wizard-active.cd-fes-step-2-active [data-cd-fes-step="1"],
.mec-fes-form.cd-fes-wizard-active.cd-fes-step-2-active [data-cd-fes-step="3"] {
  display: none !important;
}
.mec-fes-form.cd-fes-wizard-active.cd-fes-step-3-active [data-cd-fes-step="1"],
.mec-fes-form.cd-fes-wizard-active.cd-fes-step-3-active [data-cd-fes-step="2"] {
  display: none !important;
}

/* Transition sobre au changement d’étape */
.mec-fes-form.cd-fes-wizard-active [data-cd-fes-step] {
  transition: opacity 0.2s ease;
}

/* UI wizard : indicateur + boutons */
.cd-fes-wizard-ui {
  margin: 0 0 1.25rem;
  padding: 0 0 1rem;
  border-bottom: 1px solid #e5e5e5;
}
.cd-fes-wizard-step-indicator {
  margin: 0 0 0.75rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: #1e3a5f;
}
.cd-fes-wizard-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
.cd-fes-wizard-btn {
  min-height: 48px;
  padding: 0.5rem 1rem;
  font-size: 1rem;
  font-weight: 600;
  border-radius: 8px;
  border: 1px solid #1e3a5f;
  background: #fff;
  color: #1e3a5f;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.cd-fes-wizard-btn:hover {
  background: #1e3a5f;
  color: #fff;
}
.cd-fes-wizard-next,
.cd-fes-wizard-submit {
  background: #1e3a5f;
  color: #fff;
}
.cd-fes-wizard-next:hover,
.cd-fes-wizard-submit:hover {
  background: #2a4a7a;
  color: #fff;
}
.cd-fes-wizard-btn[aria-hidden="true"] {
  display: none;
}