/* =========================================
   PLANNING FIX — couche finale
   uniquement pour corriger le rendu
   sans retoucher app.css / clean.css
   ========================================= */

/* =====================================================
   DESKTOP — remettre le rendu proche de l’ancien
   ===================================================== */
@media (min-width: 901px) {
  body.page-planning {
    background:
      radial-gradient(
        1200px 700px at 18% 0%,
        rgba(37, 99, 235, 0.05) 0%,
        transparent 55%
      ),
      radial-gradient(
        900px 500px at 100% 0%,
        rgba(15, 23, 42, 0.035) 0%,
        transparent 50%
      ),
      linear-gradient(180deg, #f6f7fb 0%, #eef1f6 100%) !important;
  }

  body.page-planning #calendar {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  body.page-planning #calendar .fc,
  body.page-planning #calendar .fc-view-harness,
  body.page-planning #calendar .fc-scrollgrid,
  body.page-planning #calendar .fc-scrollgrid table {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }

  body.page-planning #calendar .fc-view-harness {
    position: relative !important;
    overflow: visible !important;
  }

  body.page-planning #calendar .fc-view-harness::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("/img/brand/logo.PNG") center 48% no-repeat;
    background-size: 42%;
    opacity: 0.05;
    pointer-events: none;
    z-index: 0;
  }

  body.page-planning #calendar .fc-scrollgrid,
  body.page-planning #calendar .fc-scrollgrid-section,
  body.page-planning #calendar .fc-scroller,
  body.page-planning #calendar .fc-timegrid-body,
  body.page-planning #calendar .fc-daygrid-body {
    position: relative;
    z-index: 1;
    background: transparent !important;
  }

  body.page-planning .fc .fc-toolbar {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 0 12px !important;
    margin-bottom: 8px !important;
  }

  body.page-planning .fc .fc-toolbar-title {
    font-size: 22px !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
    color: rgba(15, 23, 42, 0.82) !important;
  }

  body.page-planning .fc .fc-button {
    background: #ffffff !important;
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05) !important;
    color: #0f172a !important;
  }

  body.page-planning .fc .fc-col-header,
  body.page-planning .fc .fc-col-header-cell,
  body.page-planning .fc .fc-scrollgrid-section-header,
  body.page-planning .fc .fc-scrollgrid-section-header > th,
  body.page-planning .fc .fc-scrollgrid-section-header > td {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  body.page-planning .fc .fc-col-header-cell-cushion {
    display: inline-block !important;
    padding: 8px 0 14px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: rgba(15, 23, 42, 0.62) !important;
    text-decoration: none !important;
    position: relative !important;
    min-width: auto !important;
  }

  body.page-planning .fc .fc-day-today .fc-col-header-cell-cushion {
    color: #1d4ed8 !important;
    font-weight: 700 !important;
  }

  body.page-planning .fc .fc-day-today .fc-col-header-cell-cushion::after {
    content: "";
    display: block;
    width: 75%;
    height: 3px;
    margin: 6px auto 0;
    background: rgba(229, 57, 53, 0.7);
    border-radius: 2px;
  }

  body.page-planning .fc .fc-timegrid-axis {
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    background: transparent !important;
    border-right: 1px solid rgba(15, 23, 42, 0.045) !important;
  }

  body.page-planning .fc .fc-timegrid-axis-cushion,
  body.page-planning .fc .fc-timegrid-slot-label-cushion {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: rgba(15, 23, 42, 0.42) !important;
    letter-spacing: -0.01em !important;
    padding-left: 8px !important;
    padding-right: 6px !important;
  }

  body.page-planning .fc td.fc-timegrid-slot-label {
    background: transparent !important;
    border-right: 1px solid rgba(15, 23, 42, 0.045) !important;
  }

  body.page-planning .fc td.fc-timegrid-slot-lane.fc-timegrid-slot-minor,
  body.page-planning .fc td.fc-timegrid-slot-label.fc-timegrid-slot-minor {
    border-top-color: transparent !important;
  }

  body.page-planning .fc td.fc-timegrid-slot-lane:not(.fc-timegrid-slot-minor),
  body.page-planning
    .fc
    td.fc-timegrid-slot-label:not(.fc-timegrid-slot-minor) {
    border-top: 1px solid rgba(15, 23, 42, 0.035) !important;
  }

  body.page-planning .fc .fc-timegrid-col {
    background: transparent !important;
    border-right: 1px solid rgba(15, 23, 42, 0.045) !important;
  }

  body.page-planning .fc .fc-timegrid-col:last-child {
    border-right: 0 !important;
  }
}

/* =====================================================
   MOBILE — corriger logo + hauteur créneau + calbar
   ===================================================== */
@media (max-width: 900px) {
  #calbar {
    bottom: -22px !important;
    z-index: 12 !important;
  }

  body.page-planning .app-main {
    padding-top: 34px !important;
  }

  body.page-planning
    #calendar
    .fc-timeGridDay-view
    .fc-col-header-cell-cushion {
    font-size: 30px !important;
    padding: 14px 0 14px !important;
    transform: translateX(-10px) !important;
  }

  body.page-planning
    #calendar
    .fc-timeGridDay-view
    .fc-col-header-cell-cushion::after {
    width: 124px !important;
  }

  body.page-planning #calendar .fc-timegrid-event-harness {
    left: 18px !important;
    right: 18px !important;
    width: auto !important;
  }

  body.page-planning .fc a.fc-event,
  body.page-planning .fc .fc-v-event,
  body.page-planning .fc .fc-timegrid-event {
    min-height: 72px !important;
    border-radius: 12px !important;
  }

  body.page-planning .fc .fc-event-main {
    padding: 12px 14px 12px 12px !important;
  }

  body.page-planning .fc .fc-event-time {
    font-size: 12px !important;
  }

  body.page-planning .fc .fc-event-title {
    font-size: 13px !important;
    line-height: 1.15 !important;
  }

  body.page-planning .fc .fc-timegrid-slot-label {
    width: 44px !important;
    min-width: 44px !important;
  }

  body.page-planning
    .fc
    td.fc-timegrid-slot-label:not(.fc-timegrid-slot-minor)::after {
    right: -8px !important;
  }

  body.page-planning .fc .fc-timegrid-now-indicator-line {
    left: 18px !important;
  }
}

/* =========================================
   PATCH FINAL — mobile + desktop
   ========================================= */

/* =========================
   MOBILE
   ========================= */
@media (max-width: 900px) {
  /* Jour centré + trait orange */
  body.page-planning #calendar .fc-timeGridDay-view .fc-col-header-cell {
    text-align: center !important;
  }

  body.page-planning
    #calendar
    .fc-timeGridDay-view
    .fc-col-header-cell-cushion {
    position: relative !important;
    display: inline-block !important;
    width: auto !important;
    text-align: center !important;
    font-weight: 900 !important;
    font-size: 30px !important;
    color: #2456d3 !important;
    transform: translateX(-10px) !important;
    padding: 12px 0 18px !important;
  }

  body.page-planning
    #calendar
    .fc-timeGridDay-view
    .fc-col-header-cell-cushion::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 0 !important;
    transform: translateX(-50%) !important;
    width: 80% !important;
    height: 4px !important;
    border-radius: 999px !important;
    background: #ea580c !important;
  }

  /* Créneau moins haut */
  body.page-planning .fc a.fc-event,
  body.page-planning .fc .fc-v-event,
  body.page-planning .fc .fc-timegrid-event {
    min-height: 0 !important;
    height: auto !important;
  }

  body.page-planning .fc .fc-event-main {
    padding: 8px 14px 8px 12px !important;
  }

  body.page-planning .fc .fc-event-time {
    font-size: 11px !important;
    line-height: 1.1 !important;
  }

  body.page-planning .fc .fc-event-title {
    font-size: 12px !important;
    line-height: 1.1 !important;
    margin-top: 2px !important;
  }
}

/* =========================
   DESKTOP
   ========================= */

/* supprime la bordure autour de la grille */
body.page-planning .fc-theme-standard .fc-scrollgrid {
  border: none !important;
}

/* supprime ligne horizontale du header */
body.page-planning .fc-theme-standard td,
body.page-planning .fc-theme-standard th {
  border: none !important;
}

/* supprime ligne verticale à gauche des heures */
body.page-planning .fc-timegrid-axis-frame {
  border: none !important;
}

@media (min-width: 901px) {
  body.page-planning #calendar .fc-timegrid-body tr:first-child td {
    border-top: none !important;
  }
}

/* =========================================
   ACCOUNT MOBILE FIX — structure
   ========================================= */
@media (max-width: 900px) {
  body.page-account .account-page,
  body.page-account-history .account-page {
    padding: 14px !important;
    overflow-x: hidden !important;
  }

  body.page-account .account-grid,
  body.page-account-history .account-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    align-items: stretch !important;
  }

  body.page-account .account-card,
  body.page-account-history .account-card {
    grid-column: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: auto !important;
    height: auto !important;
    padding: 16px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  body.page-account .account-card--credits,
  body.page-account .account-card--next,
  body.page-account .account-card--upcoming,
  body.page-account .account-card--history,
  body.page-account .account-card--goal,
  body.page-account .account-card--messages,
  body.page-account .account-card--notifications {
    grid-column: auto !important;
    min-height: auto !important;
    height: auto !important;
  }

  body.page-account #accountNextSession,
  body.page-account #accountUpcoming,
  body.page-account #accountHistory {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.page-account .account-session-card,
  body.page-account .account-next-card,
  body.page-account .account-goal-box {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body.page-account .account-session-right,
  body.page-account .account-session-main,
  body.page-account .account-history-content {
    min-width: 0 !important;
  }

  body.page-account .account-card *,
  body.page-account-history .account-card * {
    max-width: 100% !important;
    box-sizing: border-box !important;
    word-break: break-word !important;
  }
}

@media (max-width: 900px) {
  #adminReservationBanner {
    margin: 8px 12px 10px !important;
    position: relative !important;
    z-index: 3000 !important;
  }
}

/* =========================================
   DESKTOP RESPONSIVE FIX — MacBook 14
   Planning + sidebar scrollables
   ========================================= */

@media (min-width: 901px) {
  html,
  body {
    min-height: 100%;
    overflow: hidden !important;
  }

  body.page-planning .app-shell,
  body.page-planning .app-layout {
    height: 100vh !important;
    min-height: 100vh !important;
    overflow: hidden !important;
  }

  body.page-planning .app-sidebar,
  body.page-planning aside {
    height: 100vh !important;
    max-height: 100vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
  }

  body.page-planning .app-main,
  body.page-planning main {
    height: 100vh !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
  }

  body.page-planning #calendar {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.page-planning #calendar .fc {
    height: 100% !important;
    min-height: 0 !important;
  }

  body.page-planning #calendar .fc-view-harness {
    height: calc(100% - 52px) !important;
    min-height: 0 !important;
  }

  body.page-planning #calendar .fc-scroller,
  body.page-planning #calendar .fc-timegrid-body,
  body.page-planning #calendar .fc-timegrid-body .fc-scroller {
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  body.page-planning .fc .fc-timegrid-axis {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
  }

  body.page-planning .fc .fc-event-main {
    padding: 7px 10px !important;
  }

  body.page-planning .fcx {
    min-width: 0 !important;
  }

  body.page-planning .fcx__line,
  body.page-planning .fcx__toprow {
    min-width: 0 !important;
    gap: 4px !important;
  }

  body.page-planning .fcx__title {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
  }

  body.page-planning .fcx__time {
    font-size: 10px !important;
    white-space: nowrap !important;
  }

  body.page-planning .fcx__badge {
    flex: 0 0 auto !important;
    max-width: 42px !important;
    font-size: 10px !important;
    padding: 2px 4px !important;
  }

  body.page-planning .fcx__full {
    font-size: 9px !important;
    max-width: 38px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

body.page-planning .fcx {
  padding: 0 2px !important;
}

@media (min-width: 901px) {
  body.page-planning .fc .fc-view-harness,
  body.page-planning .fc .fc-timegrid-body,
  body.page-planning .fc .fc-timegrid-body > table {
    height: auto !important;
    min-height: 0 !important;
  }

  body.page-planning .fc .fc-scroller {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
  }

  body.page-planning .app-main,
  body.page-planning main {
    overflow-y: auto !important;
  }
}
/* =========================================
   DESKTOP — garder le compteur visible
   même sur les créneaux avec horaires
   ========================================= */
@media (min-width: 901px) {
  body.page-planning .fcx__toprow {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 6px !important;
  }

  body.page-planning .fcx__time {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 10px !important;
  }

  body.page-planning .fcx__badge {
    justify-self: end !important;
    flex-shrink: 0 !important;
    max-width: none !important;
    min-width: 32px !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
    text-align: right !important;
  }

  body.page-planning .fcx__r,
  body.page-planning .fcx__slash,
  body.page-planning .fcx__l {
    display: inline !important;
  }
}