/* ============================================
   PLAYBOX - Page Contact (page-contact.php)
   ============================================ */

/* === BANDEAU INFOS : tableau horaires (gauche) + 2 blocs empilés (droite) === */
.contact-strip{padding:0;background:var(--navy)}
.contact-strip-inner{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:0;border-top:1px solid rgba(0,153,255,0.12);border-bottom:1px solid rgba(0,153,255,0.12)}

/* --- Colonne gauche : tableau horaires --- */
.contact-schedule-col{padding:48px 36px;border-right:1px solid rgba(0,153,255,0.1);min-width:0}
.contact-schedule-title{font-family:'Rajdhani',sans-serif;font-size:1.4rem;font-weight:700;color:var(--white);margin:0 0 22px 0}
.contact-schedule-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.contact-schedule-table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;font-family:'Barlow',sans-serif;font-variant-numeric:tabular-nums;border:1px solid rgba(0,153,255,0.28);border-radius:10px;overflow:hidden}
.contact-schedule-table th,
.contact-schedule-table td{padding:14px 6px;text-align:center;vertical-align:middle;border-right:1px solid rgba(0,153,255,0.22);border-bottom:1px solid rgba(0,153,255,0.22);font-size:.92rem;color:var(--off-white);line-height:1.35}
.contact-schedule-table tr > *:last-child{border-right:none}
.contact-schedule-table tbody tr:last-child > *{border-bottom:none}

.contact-schedule-table thead th{font-family:'Barlow Condensed',sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue-3);background:rgba(0,153,255,0.1);padding:14px 4px;width:11%}
.contact-schedule-table thead th.contact-schedule-period-h{background:transparent;border-right-color:transparent;width:23%}

.contact-schedule-table tbody th.contact-schedule-period{text-align:left;font-family:'Rajdhani',sans-serif;font-size:.98rem;font-weight:600;color:var(--white);background:rgba(6,15,30,0.55);padding:16px 14px;white-space:normal;width:23%;line-height:1.25}

.contact-schedule-table td.is-closed{color:var(--grey);font-style:italic;font-size:.85rem;background:rgba(6,15,30,0.4);letter-spacing:.02em}
.contact-schedule-table td.is-merged{color:var(--white);font-weight:600;background:rgba(0,153,255,0.07);letter-spacing:.01em}

/* --- Version cartes (mobile) - masquée par défaut --- */
.contact-schedule-cards{display:none;flex-direction:column;gap:14px}
.contact-schedule-card{border:1px solid rgba(0,153,255,0.28);border-radius:10px;background:rgba(6,15,30,0.4);overflow:hidden}
.contact-schedule-card-title{font-family:'Rajdhani',sans-serif;font-size:1rem;font-weight:700;color:var(--white);margin:0;padding:12px 16px;background:rgba(0,153,255,0.1);border-bottom:1px solid rgba(0,153,255,0.22);letter-spacing:.02em}
.contact-schedule-card-list{list-style:none;margin:0;padding:0;font-family:'Barlow',sans-serif;font-variant-numeric:tabular-nums}
.contact-schedule-card-row{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-bottom:1px solid rgba(0,153,255,0.12);font-size:.92rem;line-height:1.3}
.contact-schedule-card-row:last-child{border-bottom:none}
.contact-schedule-card-day{color:var(--off-white);font-weight:500}
.contact-schedule-card-hours{color:var(--white);font-weight:600;letter-spacing:.01em}
.contact-schedule-card-row.is-closed .contact-schedule-card-day{color:var(--grey)}
.contact-schedule-card-row.is-closed .contact-schedule-card-hours{color:var(--grey);font-style:italic;font-weight:500;font-size:.86rem}


/* --- Cards (.contact-block) communs --- */
.contact-block{padding:40px 36px;border-right:1px solid rgba(0,153,255,0.1);position:relative;transition:background .25s;display:flex;flex-direction:column;justify-content:center}
.contact-block:last-child{border-right:none}
.contact-block:hover{background:rgba(0,153,255,0.03)}
.contact-block-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:rgba(0,153,255,0.1);border-radius:12px;margin-bottom:16px;color:var(--blue-3)}
.contact-block:nth-child(2) .contact-block-icon{background:rgba(242,100,25,0.1);color:var(--orange)}
.contact-block h3{font-family:'Rajdhani',sans-serif;font-size:1.35rem;font-weight:700;color:var(--white);margin:0 0 12px 0}
.contact-block p{font-size:.96rem;line-height:1.55;color:var(--off-white);margin:0 0 4px 0}
.contact-block-meta{font-size:.86rem !important;color:var(--grey) !important;margin-top:8px !important}
.contact-block-phone{display:inline-block;font-family:'Rajdhani',sans-serif;font-size:1.55rem;font-weight:700;color:var(--blue-3);text-decoration:none;letter-spacing:.02em}
.contact-block-phone:hover{color:var(--blue-2)}
.contact-block-link{display:inline-block;margin-top:12px;font-family:'Barlow Condensed',sans-serif;font-size:.82rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--blue-3);text-decoration:none;border-bottom:1px solid transparent;padding-bottom:2px;transition:border-color .2s,color .2s}
.contact-block-link:hover{color:var(--blue-2);border-color:var(--blue-3)}

/* === CARTE OSM === */
.contact-map{padding:0;background:var(--navy)}
.contact-map-wrap{position:relative;width:100%;height:480px;overflow:hidden;background:var(--navy-card)}
.contact-map-wrap iframe{width:100%;height:100%;border:none;display:block;filter:hue-rotate(190deg) invert(0.92) saturate(0.6)}
.contact-map-overlay{position:absolute;bottom:30px;left:30px;background:rgba(6,15,30,0.95);backdrop-filter:blur(12px);padding:24px 28px;border-radius:14px;border:1px solid rgba(0,153,255,0.25);max-width:320px;box-shadow:0 20px 60px rgba(0,0,0,0.4)}
.contact-map-overlay strong{display:block;font-family:'Rajdhani',sans-serif;font-size:1.4rem;font-weight:700;color:var(--white);margin-bottom:6px}
.contact-map-overlay span{display:block;font-size:.9rem;line-height:1.5;color:var(--off-white);margin-bottom:16px}
.contact-map-overlay .btn-primary{font-size:.78rem;padding:11px 22px}

/* === SECTION ACCES === */
.contact-acces{padding:90px 6vw;background:var(--navy-mid)}
.contact-acces-inner{max-width:1200px;margin:0 auto;text-align:center}
.contact-acces .section-eyebrow{margin:0 auto 14px}
.contact-acces .section-title{margin-bottom:48px}
.acces-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;text-align:left}
.acces-card{padding:32px 28px;background:var(--navy);border:1px solid rgba(0,153,255,0.15);border-radius:14px;transition:transform .25s,border-color .25s}
.acces-card:hover{transform:translateY(-4px);border-color:var(--blue-3)}
.acces-icon{width:60px;height:60px;display:flex;align-items:center;justify-content:center;background:rgba(0,153,255,0.08);border-radius:12px;margin-bottom:20px;color:var(--blue-3)}
.acces-card h3{font-family:'Rajdhani',sans-serif;font-size:1.4rem;font-weight:700;color:var(--white);margin:0 0 12px 0}
.acces-card p{font-size:.95rem;line-height:1.6;color:var(--off-white);margin:0}

/* === FAQ === */
.contact-faq{padding:90px 6vw;background:var(--navy)}
.contact-faq-inner{max-width:880px;margin:0 auto;text-align:center}
.contact-faq .section-eyebrow{margin:0 auto 14px}
.contact-faq .section-title{margin-bottom:40px}
.faq-list{display:flex;flex-direction:column;gap:14px;text-align:left}
.faq-item{background:var(--navy-card);border:1px solid rgba(0,153,255,0.18);border-radius:12px;overflow:hidden;transition:border-color .3s ease,background .3s ease}
.faq-item[open]{border-color:var(--blue-3);background:linear-gradient(135deg,var(--navy-card) 0%,rgba(0,102,204,0.05) 100%)}
.faq-item summary{padding:20px 26px;font-family:'Rajdhani',sans-serif;font-size:1.15rem;font-weight:700;color:var(--white);cursor:pointer;list-style:none;position:relative;padding-right:60px;line-height:1.4;transition:color .2s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';position:absolute;right:24px;top:50%;transform:translateY(-50%) rotate(0deg);width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:rgba(0,153,255,0.15);border-radius:50%;color:var(--blue-3);font-family:'Rajdhani',sans-serif;font-size:1.4rem;font-weight:700;line-height:1;transition:transform .35s cubic-bezier(0.4,0,0.2,1),background .25s ease,color .25s ease}
.faq-item[open] summary::after{transform:translateY(-50%) rotate(45deg);background:var(--blue-3);color:var(--navy)}
.faq-item summary:hover{color:var(--blue-3)}
.faq-item summary:hover::after{background:rgba(0,153,255,0.28)}
.faq-item[open] summary:hover::after{background:var(--blue-3)}
.faq-content{padding:0 26px 22px 26px;overflow:hidden}
.faq-content p{font-size:.98rem;line-height:1.65;color:var(--off-white);margin:0}

/* === FORMULAIRE + CALENDRIER (cote a cote) === */
.contact-form-section{padding:90px 4vw 110px;background:var(--navy-mid);position:relative;overflow:hidden;scroll-margin-top:90px}
.contact-form-section::before{content:'';position:absolute;top:-200px;right:-200px;width:600px;height:600px;background:radial-gradient(circle,rgba(0,153,255,0.08) 0%,transparent 60%);pointer-events:none;z-index:1}
.contact-form-inner{position:relative;z-index:2;max-width:1500px;margin:0 auto}
.contact-form-grid{display:grid;gap:32px;align-items:start}
.contact-form-grid.form-only{grid-template-columns:minmax(0,780px);justify-content:center}
.contact-form-col{display:flex;flex-direction:column;min-width:0}
.contact-form-head{margin-bottom:24px}
.contact-form-head .section-eyebrow{margin:0 0 14px}
.contact-form-head .section-title{margin-bottom:12px}
.contact-form-head .section-intro{margin:0;color:var(--off-white)}
.contact-form-grid.form-only .contact-form-head{text-align:center}
.contact-form-grid.form-only .contact-form-head .section-eyebrow{margin:0 auto 14px}

.contact-form-wrap{background:var(--navy-card);border:1px solid rgba(0,153,255,0.18);border-radius:18px;padding:32px;flex:1}

/* --- Carte CTA réservation (au-dessus du formulaire) --- */
.contact-reservation-cta{position:relative;max-width:880px;margin:0 auto 48px;padding:32px 36px;display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;background:linear-gradient(135deg,var(--navy-card) 0%,rgba(0,102,204,0.08) 100%);border:1px solid rgba(0,153,255,0.28);border-radius:18px;box-shadow:0 20px 50px rgba(0,0,0,0.25);overflow:hidden}
.contact-reservation-cta::before{content:'';position:absolute;top:-50%;right:-10%;width:300px;height:300px;background:radial-gradient(circle,rgba(0,153,255,0.12) 0%,transparent 65%);pointer-events:none}
.contact-reservation-cta-icon{position:relative;z-index:2;width:72px;height:72px;display:flex;align-items:center;justify-content:center;background:rgba(0,153,255,0.12);border:1px solid rgba(0,153,255,0.3);border-radius:16px;color:var(--blue-3);flex-shrink:0}
.contact-reservation-cta-content{position:relative;z-index:2;min-width:0}
.contact-reservation-cta-content .section-eyebrow{margin:0 0 10px;display:inline-block}
.contact-reservation-cta-title{font-family:'Rajdhani',sans-serif;font-size:1.6rem;font-weight:700;color:var(--white);margin:0 0 8px 0;line-height:1.2}
.contact-reservation-cta-intro{font-size:.95rem;line-height:1.55;color:var(--off-white);margin:0}
.contact-reservation-cta-action{position:relative;z-index:2;flex-shrink:0}
.contact-reservation-cta-action .btn-primary{white-space:nowrap}

/* CF7 form interne */
.contact-form-wrap .wpcf7-form{max-width:none;display:flex;flex-direction:column;gap:18px}
.contact-form-wrap .cf7-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-form-wrap label{display:block;font-family:'Barlow Condensed',sans-serif;font-size:.82rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-3);margin-bottom:0}
.contact-form-wrap label .required{color:var(--orange)}
.contact-form-wrap input[type="text"],
.contact-form-wrap input[type="email"],
.contact-form-wrap input[type="tel"],
.contact-form-wrap select,
.contact-form-wrap textarea{display:block;width:100%;margin-top:8px;background:var(--navy);border:1px solid rgba(0,153,255,0.2);color:var(--white);padding:13px 16px;border-radius:8px;font-family:'Barlow',sans-serif;font-size:.98rem;transition:border-color .2s,background .2s}
.contact-form-wrap input:focus,
.contact-form-wrap select:focus,
.contact-form-wrap textarea:focus{outline:none;border-color:var(--blue-3);background:rgba(0,102,204,0.05)}
.contact-form-wrap input::placeholder,
.contact-form-wrap textarea::placeholder{color:var(--grey)}
.contact-form-wrap select{appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%2333bbff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='1 1 6 6 11 1'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px;cursor:pointer}
.contact-form-wrap textarea{resize:vertical;min-height:140px;font-family:'Barlow',sans-serif}
.contact-form-wrap .wpcf7-submit{align-self:flex-start;margin-top:8px}
.contact-form-wrap .wpcf7-not-valid-tip{color:var(--orange);font-size:.85rem;margin-top:6px;font-family:'Barlow',sans-serif;letter-spacing:0;text-transform:none;font-weight:500}
.contact-form-wrap .wpcf7-response-output{border:1px solid rgba(0,153,255,0.25);background:var(--navy);color:var(--off-white);padding:14px 18px;border-radius:8px;margin:18px 0 0 0;font-size:.95rem}
.contact-form-wrap .wpcf7-mail-sent-ok{border-color:#2ecc71;color:#2ecc71}
.contact-form-wrap .wpcf7-validation-errors,
.contact-form-wrap .wpcf7-acceptance-missing,
.contact-form-wrap .wpcf7-mail-sent-ng{border-color:var(--orange);color:var(--orange)}

/* === RESPONSIVE === */
/* Carte CTA : passe en colonne sur tablette / mobile */
@media(max-width:900px){
  .contact-reservation-cta{grid-template-columns:1fr;text-align:center;padding:32px 28px;gap:18px}
  .contact-reservation-cta-icon{margin:0 auto}
  .contact-reservation-cta-content .section-eyebrow{margin:0 auto 10px}
  .contact-reservation-cta-action{margin:0 auto}
  .contact-form-wrap .cf7-row{grid-template-columns:1fr 1fr}
}
/* Tablette : tableau pleine largeur en haut, 2 blocs côte à côte en bas */
@media(max-width:1024px){
  .contact-strip-inner{grid-template-columns:1fr 1fr}
  .contact-schedule-col{grid-column:1 / -1;border-right:none;border-bottom:1px solid rgba(0,153,255,0.1)}
  .contact-block{border-right:1px solid rgba(0,153,255,0.1)}
  .contact-block:last-child{border-right:none}
  .acces-grid{grid-template-columns:1fr;gap:16px}
  .contact-map-wrap{height:460px}
  .contact-map-overlay{left:20px;right:20px;bottom:20px;max-width:none}
}

/* Mobile : tout en 1 colonne empilée + switch tableau -> cartes */
@media(max-width:640px){
  .contact-strip-inner{grid-template-columns:1fr}
  .contact-schedule-col{grid-column:auto;padding:32px 20px}
  .contact-block{border-right:none;border-bottom:1px solid rgba(0,153,255,0.1);padding:32px 20px}
  .contact-block:last-child{border-bottom:none}
  .contact-schedule-table{display:none}
  .contact-schedule-cards{display:flex}
}
@media(max-width:640px){
  .contact-acces,.contact-faq,.contact-form-section{padding:60px 5vw}
  .contact-block{padding:36px 28px}
  .contact-form-wrap{padding:24px 20px}
  .contact-form-wrap .cf7-row{grid-template-columns:1fr}
  .faq-item summary{font-size:1rem;padding:18px 22px;padding-right:54px}
  .faq-content{padding:0 22px 18px 22px}
  .contact-map-wrap{height:480px}
}

/* === ACCESSIBILITE : prefers-reduced-motion === */
@media(prefers-reduced-motion:reduce){
  .faq-item,.faq-item summary,.faq-item summary::after{transition:none !important}
}