/* ===============================
   Thaïlande Pratique – Base propre
   Palette bleu / blanc type OM
   =============================== */

:root{
  --tp-blue:#009DE0;
  --tp-blue-dark:#0F172A;
  --tp-bg:#FFFFFF;
  --tp-muted:#6B7280;
  --tp-border:#E5E7EB;
}

/* --------- Global --------- */

html,body{
  background:var(--tp-bg);
  color:var(--tp-blue-dark);
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.6;
}

/* largeur du contenu principale */
main,
.entry-content,
.site-content{
  max-width:960px;
  margin:0 auto;
  padding:0 1.5rem 4rem;
}

/* paragraphes */
p{
  margin-bottom:1rem;
  color:var(--tp-blue-dark);
}

/* --------- Titres --------- */

h1,h2,h3,h4{
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:700;
  letter-spacing:.03em;
  color:var(--tp-blue-dark);
  margin-top:2rem;
  margin-bottom:.75rem;
}

h1{font-size:clamp(2.4rem,4vw,3.2rem);line-height:1.1}
h2{font-size:clamp(1.6rem,2.8vw,2rem)}
h3{font-size:1.25rem}

strong,b{color:var(--tp-blue-dark)}

/* --------- Liens --------- */

a{
  color:var(--tp-blue);
  text-decoration:none;
  transition:color .15s ease,text-decoration-color .15s ease;
}

a:hover,a:focus{
  color:var(--tp-blue-dark);
  text-decoration:underline;
  text-decoration-thickness:2px;
  text-underline-offset:3px;
}

/* --------- Boutons Gutenberg --------- */

.wp-element-button,
.wp-block-button__link,
button,
input[type="submit"]{
  background:var(--tp-blue);
  color:#fff;
  border-radius:999px;
  border:none;
  padding:.7rem 1.6rem;
  font-weight:600;
  font-size:.95rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.35rem;
  cursor:pointer;
  text-decoration:none;
  transition:background .15s ease,transform .1s ease,box-shadow .1s ease;
}

.wp-element-button:hover,
.wp-block-button__link:hover,
button:hover,
input[type="submit"]:hover{
  background:var(--tp-blue-dark);
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(0,0,0,.08);
}

/* boutons en outline éventuels */
.is-style-outline .wp-block-button__link{
  background:transparent;
  color:var(--tp-blue-dark);
  border:2px solid var(--tp-blue);
}

.is-style-outline .wp-block-button__link:hover{
  background:var(--tp-blue);
  color:#fff;
}

/* --------- En-tête / menu --------- */
/* IMPORTANT: tu forces un header clair partout (c’est ce que tu voulais) */

header,
.site-header,
.wp-block-template-part,
.wp-block-navigation{
  background-color:#f8fafc !important;
  background-image:none !important;
  color:var(--tp-blue-dark) !important;
}

/* Supprime ombres / dégradés forcés */
header::before,
header::after{
  display:none !important;
}

/* Evite les bandes créées avec des groupes dans le header */
header .wp-block-group{
  background-color:transparent !important;
  background-image:none !important;
}

/* barre de navigation */
.wp-block-navigation{
  max-width:1120px;
  margin:0 auto;
  padding:1.1rem 1.5rem;
}

/* Liens de navigation */
.wp-block-navigation a,
header .wp-block-navigation a{
  color:#0f172a !important;
  font-weight:600;
  font-size:.95rem;
}

.wp-block-navigation a:hover{
  color:#020617 !important;
}

/* Bouton principal du menu */
.wp-block-navigation .wp-block-button__link,
header .wp-block-button__link{
  background-color:#0ea5e9 !important;
  color:#fff !important;
  border-radius:999px;
}

/* logo / nom du site */
.wp-block-site-title a,
.wp-block-site-title{
  color:#0f172a !important;
  font-weight:700;
  text-decoration:none;
}

/* --------- Hero (bloc du haut de la home) --------- */

/* groupe qui contient le H1 en haut de la page */
.entry-content > .wp-block-group:first-of-type,
.entry-content > .wp-block-cover:first-of-type{
  margin-top:3rem;
  margin-bottom:2.5rem;
}

/* paragraphe juste sous le H1 */
.entry-content > .wp-block-group:first-of-type p{
  font-size:1.02rem;
  color:var(--tp-muted);
}

/* --------- Sections & blocs --------- */

.wp-block-group.has-background,
.wp-block-group.is-style-card,
.wp-block-column.has-background{
  border-radius:18px;
  padding:1.75rem 1.5rem;
  box-shadow:0 18px 45px rgba(15,23,42,.08);
  border:1px solid rgba(148,163,184,.35);
}

/* listes de points */
ul,ol{
  padding-left:1.4rem;
  margin-bottom:1rem;
}

li{margin-bottom:.35rem}

/* petits labels (ex “Séjour court”, etc.) */
.wp-block-badge,
.badge,
.tag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.2rem .7rem;
  border-radius:999px;
  font-size:.78rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.06em;
  background:rgba(148,163,184,.14);
  color:var(--tp-blue-dark);
}

/* --------- Formulaire newsletter --------- */

input[type="email"],
input[type="text"],
textarea{
  width:100%;
  max-width:460px;
  padding:.65rem .8rem;
  border-radius:10px;
  border:1px solid var(--tp-border);
  font-size:.95rem;
}

input[type="email"]:focus,
input[type="text"]:focus,
textarea:focus{
  outline:none;
  border-color:var(--tp-blue);
  box-shadow:0 0 0 2px rgba(0,157,224,.15);
}

/* --------- Footer --------- */

footer,
.site-footer{
  border-top:1px solid var(--tp-border);
  margin-top:3rem;
  padding:2rem 1.5rem 3rem;
  font-size:.9rem;
  color:var(--tp-muted);
}

.site-footer a{color:var(--tp-blue)}
.site-footer a:hover{color:var(--tp-blue-dark)}

/* --------- Divers / responsive --------- */

@media (max-width:768px){
  main,.entry-content,.site-content{padding:0 1rem 3rem}
  h1{font-size:2.1rem}
  .wp-block-navigation{padding-inline:1rem}
}

/* Nettoyage du texte d’accessibilité visible */
.skip-link,
.screen-reader-text{
  position:absolute !important;
  left:-9999px !important;
}

/* Espace autour du badge sous le hero */
.wp-block-group .badge,
.wp-block-group .wp-block-group__inner-container > p:first-child{
  margin-bottom:1.5rem;
}

/* --------- TABLEAUX – colonnes bien visibles --------- */

.wp-block-table table,
table{
  width:100%;
  border-collapse:collapse;
}

.wp-block-table td,
.wp-block-table th,
table td,
table th{
  border:1px solid #e2e8f0;
  padding:.6rem .8rem;
  vertical-align:top;
}

.wp-block-table thead th,
table thead th{
  background-color:#f1f5f9;
  font-weight:600;
}

/* --------- Page “Toutes les provinces” (ID 576) --------- */

body.page-id-576 button{
  color:#0f172a !important;
  opacity:1 !important;
  visibility:visible !important;
}

body.page-id-576 button.is-active,
body.page-id-576 button[aria-pressed="true"]{
  background-color:#0ea5e9 !important;
  color:#fff !important;
}

body.page-id-576 button:not(.is-active):not([aria-pressed="true"]){
  background-color:#f8fafc;
  border:1px solid #e2e8f0;
}

/* --------- FIX: texte invisible (tu l’avais en double + cassé) --------- */

.wp-site-blocks p,
.wp-site-blocks li,
.wp-site-blocks span{
  -webkit-text-fill-color:currentColor !important;
  color:#0f172a !important;
  opacity:1 !important;
  visibility:visible !important;
  mix-blend-mode:normal !important;
  text-shadow:none !important;
  background:none !important;
  -webkit-background-clip:border-box !important;
  background-clip:border-box !important;
}

/* --------- BOUCLIER LAYOUT – pages destinations (Chiang Mai style) --------- */

.wp-site-blocks article .kpis{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr)) !important;
  gap:12px !important;
}

.wp-site-blocks article .grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr)) !important;
  gap:14px !important;
}

.wp-site-blocks article .card{
  width:auto !important;
  max-width:none !important;
}