/* ===== TopSpin - page de reservation, version claire - 02/10 ===== */
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700&family=Instrument+Sans:wght@500;600;700&display=swap'); @font-face { font-family: 'TS Objectivity'; font-weight: 800; font-display: swap; src: url('https://fonts.cdnfonts.com/s/18151/Objectivity-ExtraBold.woff') format('woff'); } html body, body #main, body #sb_content, body .container-fluid, body section, body #sb_booking_content { background-color: #FFFFFF !important; } body, body p, body .txt, body span:not(.fa):not([class*=icon]), body label, body input, body td, body li { font-family: 'Barlow', sans-serif !important; } body { color: #3A3A3A !important; } body h1, body h2, body h3, body .title, body .cap, body .container-caption, body .title-main { font-family: 'TS Objectivity', 'Barlow', sans-serif !important; color: #0B0B0B !important; text-transform: uppercase; font-weight: 800 !important; } body .container-caption, body .title-main { font-size: 18px !important; } #steps-nav { background: #0B0B0B !important; } #menu-active-bg { display: none !important; } #sb_booking_info { background: transparent !important; } #sb_booking_info > .booking-info, #sb_booking_info > .booking-info > ul { background: #0B0B0B !important; } #sb_booking_info li.step_info_item, #sb_booking_info li.step_info_item a { background: transparent !important; box-shadow: none !important; border: 0 !important; } #sb_booking_info li.step_info_item::before, #sb_booking_info li.step_info_item::after, #sb_booking_info li.step_info_item a::before, #sb_booking_info li.step_info_item a::after { display: none !important; } #sb_booking_info .title-small { font-family: 'Instrument Sans', sans-serif !important; font-size: 12px !important; font-weight: 600 !important; text-transform: uppercase; letter-spacing: .18em; color: #8A8D8F !important; } #sb_booking_info li.step_info_item.active .title-small { color: #F3BC27 !important; } #sb_booking_info li.step_info_item.active a { box-shadow: inset 0 -3px 0 #F3BC27 !important; } #sb_booking_info .title-sub { color: #fff !important; } body .section, body #sb_dateview_container { background: #fff !important; border: 1px solid #E4E4E4 !important; border-radius: 0 !important; box-shadow: none !important; } body #sb_dateview_container .name { font-family: 'Instrument Sans', sans-serif !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: .16em; text-transform: uppercase; color: #8A8D8F !important; } body #sb_dateview_container .date a.day-on { color: #0B0B0B !important; font-weight: 600 !important; } body #sb_dateview_container .date .day-off { color: #C8C8C8 !important; } body #sb_dateview_container .date.selected { background: #F3BC27 !important; border-radius: 0 !important; } body a:not(.btn):not([class*=step]):not(.sb-cell) { color: #0B0B0B !important; } body .fa { color: #F3BC27 !important; } html body a.sb-cell, html body a.sb-cell.free { background: #FBEFC9 !important; border: 1px solid #FBEFC9 !important; border-radius: 0 !important; color: #0B0B0B !important; font-weight: 600 !important; transition: background .15s, border-color .15s !important; } html body a.sb-cell.free:hover, html body a.sb-cell.selected { background: #F3BC27 !important; border-color: #F3BC27 !important; } body .btn { background: #F3BC27 !important; border-radius: 0 !important; border: 0 !important; } body .btn a, body .btn span { font-family: 'Instrument Sans', sans-serif !important; font-weight: 700 !important; font-size: 13px !important; text-transform: uppercase; letter-spacing: .16em; color: #0B0B0B !important; } #sb_scroll_top_btn, #sb_scroll_top_btn.scroll-top-button { background: #F3BC27 !important; color: #0B0B0B !important; } #sb_scroll_top_btn * { color: #0B0B0B !important; } body .tab.tab-col { border: 1px solid #E4E4E4 !important; box-shadow: none !important; border-radius: 0 !important; } body .badge.price { font-family: 'TS Objectivity', sans-serif !important; color: #0B0B0B !important; } body label.control-label { font-family: 'Instrument Sans', sans-serif !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: .16em; text-transform: uppercase; color: #8A8D8F !important; } body .form-control { border: 1px solid #CFCFCF !important; border-radius: 0 !important; box-shadow: none !important; } #sb_booking_info .booking-info.mg, #sb_booking_info .highlighted-current-booking { background: #F5F5F5 !important; } #sb_booking_info .highlighted-current-booking *, #sb_booking_info .booking-info.mg * { color: #0B0B0B !important; } body .full-info-price--caption, body .full-info-price { color: #0B0B0B !important; } body a.title { font-family: 'Instrument Sans', sans-serif !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: .16em; text-transform: uppercase; color: #0B0B0B !important; } body .panel, body .panel-heading, body a.title { border-color: #E4E4E4 !important; } header#header, header#header .container-fluid, header#header * { background-color: #0B0B0B !important; } html body header#header a, html body header#header a span { color: #FFFFFF !important; font-family: 'Instrument Sans', sans-serif !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: .14em; text-transform: uppercase; } html body header#header a:hover { color: #F3BC27 !important; } section#main-buttons { position: relative !important; overflow: hidden !important; background: #0B0B0B !important; min-height: 0 !important; height: 380px !important; } section#main-buttons::before { content: ''; position: absolute; inset: -20px; z-index: 0; background: url('https://playtopspin.fr/wp-content/uploads/2026/08/IMG_4927-scaled.jpg') center 40% / cover no-repeat; filter: blur(6px); transform: scale(1.04); } section#main-buttons::after { content: ''; position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(11,11,11,.60) 0%, rgba(11,11,11,.50) 60%, rgba(11,11,11,.85) 100%); } section#main-buttons > * { position: relative; z-index: 1; } section#main-buttons .wrapper { height: 380px !important; } section#main-buttons *:not(.btn) { background-color: transparent !important; background-image: none !important; } section#main-buttons .inner { display: flex !important; flex-direction: column; align-items: center; justify-content: center; height: 100%; } section#main-buttons .inner::before { content: 'RÉSERVATION'; font: 600 12px 'Instrument Sans', sans-serif; letter-spacing: .22em; color: #8A8D8F; margin-bottom: 14px; } section#main-buttons .bar { display: flex !important; flex-direction: column; align-items: center; height: auto !important; } section#main-buttons .bar::before { content: 'CHOISISSEZ VOTRE CRÉNEAU'; font: 800 38px/1.08 'TS Objectivity', sans-serif; color: #FFFFFF; margin-bottom: 30px; text-align: center; padding: 0 20px; } section#main-buttons .btn.book::after, section#main-buttons .btn.book::before, section#main-buttons .btn.book .fa, section#main-buttons .btn.book i { display: none !important; } section#main-buttons .btn.book { padding: 0 !important; height: auto !important; } section#main-buttons .btn.book a { display: inline-flex !important; align-items: center; gap: 12px; padding: 18px 34px !important; } section#main-buttons .btn.book a::after { content: '\2192'; font-family: 'Barlow', sans-serif; font-size: 18px; letter-spacing: 0; transition: transform .2s; } section#main-buttons .btn.book:hover a::after { transform: translateX(4px); } @media (max-width: 767px) { section#main-buttons, section#main-buttons .wrapper { height: 300px !important; } section#main-buttons .bar::before { font-size: 26px; } }
/* ===== fin TopSpin ===== */

/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/

#sb_booking_company_time {
	display: none !important;
}

 #events h3   {
	/* add your css rule here */
}


 #events p.duration, #events div.duration   {
	/* add your css rule here */
}


 #events p.description, #events div.description   {
	/* add your css rule here */
}


 #events .selectedEvent   {
	/* add your css rule here */
}


 #events input.reserve_time_btn   {
	/* add your css rule here */
}
/* Retirer la section carte de localisation */
.row.row-mg:has(#sb_map) {
  display: none !important;
}


 #events input.select_another_btn   {
	/* add your css rule here */
}


 #eventForm #start_date-block-container h3, #eventForm #timeline-container h3   {
	/* add your css rule here */
}


 #eventForm #save_button   {
	/* add your css rule here */
}


 div.ui-widget-content   {
	/* add your css rule here */
}


 div.ui-widget-header   {
	/* add your css rule here */
}


 #timeline-container table.timeline   {
	/* add your css rule here */
}


 .timeline td.not_worked_time   {
	/* add your css rule here */
}


 .timeline td.free_time   {
	/* add your css rule here */
}


 .timeline td.selected_time   {
	/* add your css rule here */
}


 .timeline td.reserved_time   {
	/* add your css rule here */
}


 div#loading   {
	/* add your css rule here */
}


 #start_date-block-container .zend_form dt, start_date-block-container .zend_form dt b, start_date-block-container .zend_form dd label   {
	/* add your css rule here */
}

/* Bandeau du haut en noir, texte en blanc */
header.web {
  background-color: #0B0B0B !important;
}
header.web a {
  color: #FFFFFF !important;
}

/* Corriger le rouge sur SAM/DIM dans le calendrier */
.name.is-holiday {
  color: #F3BC27 !important;
}/* Retirer le bouton "Afficher sur la carte" */
.btn.map {
  display: none !important;
}

/* Bloc TopSpin (page d'accueil) : bandeau noir avec logo + infos pratiques — 03/10 */
html body #about-us.section, html body #about-us .section-pd { padding: 0 !important; }
html body #about-us .title-main { display: block; height: 96px; margin: 0 !important; padding: 0 !important; background: #0B0B0B url('https://playtopspin.fr/wp-content/uploads/2026/08/cropped-logo_recolor_horizontal_jaune_blanc-1.png') no-repeat 48px center / auto 44px !important; font-size: 0 !important; color: transparent !important; }
html body #about-us .txt { padding: 32px 48px 40px !important; }
html body #about-us .txt p, html body #about-us .txt li { font-family: 'Barlow', sans-serif !important; color: #3A3A3A !important; }
html body #about-us .tp-pitch { font-size: 18px !important; line-height: 1.6 !important; color: #2A2A2A !important; margin: 0 0 26px !important; }
html body #about-us .tp-lbl { font-family: 'Instrument Sans', sans-serif !important; font-weight: 600 !important; font-size: 12px !important; letter-spacing: .18em; text-transform: uppercase; color: #8A8D8F !important; margin: 0 0 6px !important; }
html body #about-us .tp-infos { list-style: none !important; margin: 0 0 30px !important; padding: 0 !important; }
html body #about-us .tp-infos li { position: relative; padding: 12px 0 12px 26px !important; border-bottom: 1px solid #F0F0F0; font-size: 16px !important; line-height: 1.5 !important; list-style: none !important; }
html body #about-us .tp-infos li:last-child { border-bottom: 0; }
html body #about-us .tp-infos li::before { content: ''; position: absolute; left: 0; top: 20px; width: 10px; height: 10px; background: #F3BC27; }
html body #about-us .tp-infos a { color: #0B0B0B !important; font-weight: 600; text-decoration: underline !important; text-decoration-color: #F3BC27 !important; text-underline-offset: 3px; }
html body #about-us .tp-cta { margin: 0 !important; }
html body #about-us .tp-cta a { display: inline-block; background: #F3BC27 !important; color: #0B0B0B !important; text-decoration: none !important; padding: 16px 26px; font-family: 'Instrument Sans', sans-serif !important; font-weight: 700; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; }
html body #about-us .tp-cta a:hover { background: #FFCC3D !important; }
@media (max-width: 767px) {
  html body #about-us .title-main { height: 80px; background-position: 22px center !important; background-size: auto 36px !important; }
  html body #about-us .txt { padding: 26px 22px 30px !important; }
}

/* Bloc TopSpin : sans puces noires, bouton à sa taille */
html body #about-us .txt ul.tp-infos li { list-style-type: none !important; display: block !important; }
html body #about-us .txt ul.tp-infos li::marker { content: '' !important; }
html body #about-us .txt p.tp-cta a { display: inline-block !important; width: auto !important; min-width: 0 !important; max-width: none !important; }
html body #content-view #about-us .txt p.tp-cta a { width: auto !important; }
html body #content-view #about-us .txt ul.tp-infos { margin-left: 0 !important; }
html body #about-us .title-main { background-position: 39px center !important; }
@media (max-width: 767px) { html body #about-us .title-main { background-position: 15px center !important; } }

/* Menu du haut : Accueil + Réserver uniquement (04/10) */
html body #sb_menu li:has(> a[href='#reviews']), html body #sb_menu li:has(> a[href='#book-class']), html body #sb_menu li#sb_appended_menu_item { display: none !important; }
html body #sb_menu a[href='#book-service'] { font-size: 0 !important; letter-spacing: 0 !important; }
html body #sb_menu a[href='#book-service']::after { content: 'Réserver'; font-size: 12px; letter-spacing: 1.68px; }

/* Calendrier : uniquement les jours du mois affiché (du 1er au 31) — 06/10 */
#sb_dateview_container .date.prev-or-next-month { visibility: hidden !important; }

/* Bloc TopSpin : téléphone et e-mail jamais coupés sur deux lignes (09/10) */
html body #about-us .tp-infos a[href^='tel:'], html body #about-us .tp-infos a[href^='mailto:'] { white-space: nowrap; }

/* Zone lecteur d'écran SimplyBook (sb_status_announcer) : invisible à l'écran, gardée pour l'accessibilité (09/10) */
#sb_status_announcer { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }