/* Chamonix Cross Country Skiing — CSS personnalisé SimplyBook.me (fonction gratuite « CSS personnalisé »).
   S'applique à la page de réservation et au module intégré dans WordPress.
   Charte du site : Khand (titres) + Asap (texte), nuit #0C2A47, jaune #F2C300, bleu #1D5FC2, filet #D6DEE5, angles 2 px.
   Source de vérité : ce fichier. À recoller dans SimplyBook > Plugins > CSS personnalisé > Paramètres après modification. */
@import url('https://fonts.googleapis.com/css2?family=Asap:wght@400;500;600;700&family=Khand:wght@600;700&display=swap');

body, #main, #sb_content, input, select, textarea, button { font-family: 'Asap', Arial, sans-serif !important; }

/* Bandeau : nom en Khand capitales, lisible sur la photo */
#main-buttons .company-name, #main-buttons .company-name * {
  font-family: 'Khand', 'Asap', sans-serif !important; font-weight: 700 !important; text-transform: uppercase !important;
  font-size: 48px !important; line-height: 1 !important; letter-spacing: .01em; color: #FFFFFF !important;
  text-shadow: 0 2px 14px rgba(12, 42, 71, .65); /* 03/11 : bannière « skieurs au soleil », plus sombre : nom en blanc */
}
@media (max-width: 767px) { #main-buttons .company-name, #main-buttons .company-name * { font-size: 34px !important; } }

/* Barre des étapes (page SimplyBook) : légère, fond blanc, étape en cours soulignée de jaune ; masquée dans le module WordPress */
#steps-nav { box-shadow: none !important; background: #fff !important; border-bottom: 1px solid #D6DEE5; }
#menu-active-bg { display: none !important; }
#steps-nav li.step_info_item { background: transparent !important; }
#steps-nav li.step_info_item::before, #steps-nav li.step_info_item::after { display: none !important; }
#steps-nav li, #steps-nav li * { font-family: 'Asap', sans-serif !important; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: #6B7A86 !important; }
#steps-nav li.active { box-shadow: inset 0 -3px 0 #F2C300 !important; }
#steps-nav li.active, #steps-nav li.active * { color: #0C2A47 !important; }

/* Titre de chaque étape, filet jaune comme les surtitres du site */
#sb_category_step_container::before, #sb_service_step_container::before, #sb_datetime_step_container::before {
  display: block; grid-column: 1 / -1; width: 100%; box-sizing: border-box;
  font-family: 'Khand', 'Asap', sans-serif; font-weight: 700; text-transform: uppercase; font-size: 24px; line-height: 1.1; color: #0C2A47;
  padding-left: 44px; margin: 0 0 20px;
  background: linear-gradient(#F2C300, #F2C300) left center / 32px 3px no-repeat;
}
#sb_category_step_container::before { content: "Choisissez votre activité"; }
#sb_service_step_container::before { content: "Choisissez votre formule"; }
#sb_datetime_step_container::before { content: "Choisissez le jour et l’heure"; }

/* Bouton retour */
#sb_back_button a, #sb_back_button a * { color: #1D5FC2 !important; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; font-size: 13px; text-decoration: none; }

/* Cartes des activités et des cours : filet fin, photo 3:2, léger zoom au survol */
.category-item .tab, .service-item .tab {
  background: #fff !important; border: 1px solid #D6DEE5 !important; border-radius: 2px !important;
  box-shadow: none !important; overflow: hidden; transition: border-color .2s ease;
}
.category-item .tab:hover, .service-item .tab:hover { border-color: #0C2A47 !important; }
.category-item .user.img, .service-item .user.img { aspect-ratio: 3 / 2; height: auto !important; overflow: hidden; }
/* 04/11 : le cadre des formules est en 16:9 dans le thème ; la photo s'y cale (en 3:2, le bas des vignettes passait sous le texte de la carte),
   cadrée vers le bas pour garder l'activité, la formule et le nombre de personnes écrits sur la vignette */
.service-item .user.img { aspect-ratio: 16 / 9 !important; }
.service-item img.user-img { object-position: 50% 82%; }
.category-item img.user-img, .service-item img.user-img {
  width: 100% !important; height: 100% !important; object-fit: cover; transition: transform .6s cubic-bezier(.2, .7, .2, 1);
}
.category-item .tab:hover img.user-img, .service-item .tab:hover img.user-img { transform: scale(1.04); }
.category-item .cap, .service-item .cap {
  font-family: 'Khand', 'Asap', sans-serif !important; font-weight: 700; text-transform: uppercase;
  font-size: 24px !important; line-height: 1.05; letter-spacing: .01em; color: #0C2A47 !important;
}
.service-item .txt { font-size: 15px; line-height: 1.5; color: #3D4B57; }
/* Texte court sous le nom de chaque activité : affiché en entier */
.category-item .txt, .category-item .txt.short {
  display: block !important; max-height: none !important; overflow: visible !important; -webkit-line-clamp: unset !important;
  font-size: 15px; line-height: 1.5; color: #3D4B57; margin-top: 8px;
}
.category-item .read-more { display: none !important; }
/* Titre et texte rapprochés ; cartes d'une même rangée à la même hauteur, bouton en bas */
.category-item .cap, .service-item .cap { height: auto !important; min-height: 0 !important; margin: 0 !important; }
.category-item .txt, .service-item .txt { margin-top: 8px !important; }
.category-item .tab, .service-item .tab { display: flex !important; flex-direction: column; height: 100%; }
.category-item .excerpt-info, .service-item .excerpt-info { display: flex !important; flex-direction: column; flex: 1 1 auto; }
.category-item .tab-pd, .service-item .tab-pd { display: flex !important; flex-direction: column; flex: 1 1 auto; }
.category-item .btn-bar, .service-item .btn-bar { margin-top: auto !important; padding-top: 16px; }
.service-item .bar-service .time, .service-item .bar-service .time span { font-weight: 600; color: #1D5FC2; }
.read-more { color: #1D5FC2 !important; font-weight: 600; }

/* Boutons : jaune du site, texte nuit ; nuit au survol */
.btn.custom, .btn.select { background: #F2C300 !important; border-color: #F2C300 !important; border-radius: 2px !important; box-shadow: none !important; transition: background .16s ease; }
.btn.custom, .btn.custom a, .btn.select a {
  color: #0C2A47 !important; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: 14px;
}
.btn.custom:hover, .btn.select:hover { background: #0C2A47 !important; border-color: #0C2A47 !important; }
.btn.custom:hover, .btn.custom:hover a, .btn.select:hover a { color: #fff !important; }
/* Icônes des boutons (coche, repère) : couleur du texte, jamais blanc sur jaune */
.btn.custom::after, .btn.custom::before, .btn.custom i, .btn.custom svg { color: #0C2A47 !important; fill: #0C2A47 !important; }
.btn.custom:hover::after, .btn.custom:hover::before, .btn.custom:hover i, .btn.custom:hover svg { color: #fff !important; fill: #fff !important; }

/* Calendrier et créneaux */
#sb_dateview_container .txt-center > div { font-family: 'Khand', 'Asap', sans-serif !important; font-weight: 700; text-transform: uppercase; font-size: 22px; color: #0C2A47; }
.calendar .date a.day-on { border-radius: 2px !important; font-weight: 600; }
.calendar .date.selected a.day-on { background: #0C2A47 !important; color: #fff !important; }
.slots-view .slot { border-radius: 2px !important; font-weight: 600; }
#sb_prev_month, #sb_next_month, #sb_prev_month *, #sb_next_month * { color: #0C2A47 !important; }
.calendar .weeks-name .name, .calendar .weeks-name .name.is-holiday { color: #6B7A86 !important; font-weight: 600; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.calendar .date.today a.day-on, .calendar .date.selected a.day-on { background: #0C2A47 !important; color: #fff !important; }
/* Créneaux : cases blanches à filet, jaune au survol */
.slots-view .slot a.sb-cell {
  background: #fff !important; border: 1px solid #D6DEE5 !important; border-radius: 2px !important; color: #0C2A47 !important;
  font-weight: 600; transition: background .16s ease, border-color .16s ease;
}
.slots-view .slot a.sb-cell:hover, .slots-view .slot a.sb-cell:focus-visible { background: #F2C300 !important; border-color: #F2C300 !important; }
#sb_datetime_step_container h1, #sb_datetime_step_container h2, #sb_datetime_step_container h3, #sb_datetime_step_container .title {
  font-family: 'Khand', 'Asap', sans-serif !important; font-weight: 700; text-transform: uppercase; color: #0C2A47; letter-spacing: .01em;
}
.time-legend { display: none !important; }
/* Liens (pied « SimplyBook.me » compris) dans le bleu du site */
#main a:not(.btn):not(.sb-cell):not(.day-on) { color: #1D5FC2; }
a[href*="simplybook.me"], footer a, #footer a, [class*="footer"] a, [class*="copyright"] a { color: #6B7A86 !important; }
#sb_category_step_container::before, #sb_service_step_container::before, #sb_datetime_step_container::before { margin-top: 8px; }

/* Champs du formulaire client */
input.form-control, select.form-control, textarea.form-control { border-radius: 2px !important; border-color: #D6DEE5 !important; box-shadow: none !important; }
input.form-control:focus, select.form-control:focus, textarea.form-control:focus { border-color: #1D5FC2 !important; }

/* 04/11/2026 : bannière = photo de ski de fond (Réglages > Conception) ; voile nuit pour un titre blanc lisible, comme les héros du site */
#main-buttons { position: relative !important; }
#main-buttons::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(12,42,71,.28) 0%, rgba(12,42,71,.58) 100%); pointer-events: none; z-index: 0; }
#main-buttons > * { position: relative; z-index: 1; }