/* =========================================================
   GeoGood - Formulaires unifies (refonte 2026)
   Charge apres geogood-clair.css dans pages2/nav_entete.php
   S'applique a TOUS les formulaires (portail + vitrines)
   ========================================================= */

/* ---------- Champs ---------- */
body.gg input[type=text], body.gg input[type=email], body.gg input[type=password],
body.gg input[type=tel], body.gg input[type=url], body.gg input[type=number],
body.gg input[type=search], body.gg input[type=date], body.gg input[type=time],
body.gg input:is(:not([type]),[type=texte]), body.gg select, body.gg textarea, body.gg .inputinscription {
  box-sizing: border-box;
  max-width: 100%;
  font: 400 15px/1.4 var(--gg-font) !important;
  color: var(--gg-text) !important;
  background-color: #fff !important;
  border: 1px solid #D5D9E2 !important;
  border-radius: var(--gg-radius-sm) !important;
  padding: 10px 14px !important;
  min-height: 44px;
  box-shadow: 0 1px 2px rgba(16,24,40,.04) !important;
  outline: none;
  text-transform: none;
  transition: border-color .15s, box-shadow .15s;
  -webkit-appearance: none; appearance: none;
}
body.gg input[name=nomprenom_exp] { text-transform: uppercase !important; }
body.gg textarea { min-height: 120px; line-height: 1.5 !important; resize: vertical; width: 100%; }
body.gg select {
  padding-right: 38px !important; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23636B7E' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 14px center !important;
}
body.gg select[multiple], body.gg select[size]:not([size="1"]) { background-image: none !important; padding-right: 14px !important; }
body.gg input:hover:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]):not([type=image]),
body.gg select:hover, body.gg textarea:hover { border-color: #B9BFCC !important; }
body.gg input:focus, body.gg select:focus, body.gg textarea:focus {
  border-color: var(--gg-accent) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--gg-accent) 15%, transparent) !important;
}
body.gg input::placeholder, body.gg textarea::placeholder { color: #9AA0B0; font-weight: 400; text-transform: none; }
body.gg input[disabled], body.gg select[disabled], body.gg textarea[disabled], body.gg input[readonly] {
  background-color: var(--gg-bg) !important; color: var(--gg-muted) !important; cursor: not-allowed;
}

/* Cases a cocher / boutons radio / fichiers */
body.gg input[type=checkbox], body.gg input[type=radio] {
  accent-color: var(--gg-accent); width: 18px; height: 18px; margin: 0 6px 0 0; vertical-align: -3px; cursor: pointer;
}
body.gg input[type=file] {
  max-width: 100%; font: 400 14px var(--gg-font); color: var(--gg-muted);
  padding: 8px; border: 1px dashed #C7CCD7; border-radius: var(--gg-radius-sm); background: var(--gg-bg);
}
body.gg input[type=file]::file-selector-button {
  font: 600 14px var(--gg-font); color: var(--gg-accent); background: var(--gg-soft);
  border: 1px solid color-mix(in srgb, var(--gg-accent) 25%, transparent); border-radius: 999px;
  padding: 7px 14px; margin-right: 10px; cursor: pointer;
}

/* ---------- Boutons ---------- */
body.gg input[type=submit]:not(#imgsearch), body.gg input[type=button], body.gg input[type=reset],
body.gg button:not(.ui-datepicker-trigger):not([class*="ui-"]), body.gg .btninput {
  display: inline-flex; align-items: center; justify-content: center;
  box-sizing: border-box; max-width: 100%;
  min-height: 44px; height: auto !important; padding: 10px 22px !important; margin: 4px 2px;
  font: 600 15px/1.25 var(--gg-font) !important; letter-spacing: 0; text-shadow: none !important;
  color: #fff !important; background: var(--gg-accent) !important; background-image: none !important;
  border: 1px solid transparent !important; border-radius: 999px !important;
  box-shadow: 0 1px 2px rgba(16,24,40,.12) !important;
  white-space: normal; cursor: pointer; -webkit-appearance: none; appearance: none;
  transition: filter .15s, box-shadow .15s, transform .15s;
}
body.gg input[type=submit]:not(#imgsearch):hover, body.gg input[type=button]:hover, body.gg input[type=reset]:hover,
body.gg button:not([class*="ui-"]):hover, body.gg .btninput:hover {
  filter: brightness(1.08);
  box-shadow: 0 4px 14px color-mix(in srgb, var(--gg-accent) 30%, transparent) !important;
  transform: translateY(-1px);
}
body.gg input[type=submit]:focus-visible, body.gg input[type=button]:focus-visible, body.gg button:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--gg-accent) 35%, transparent); outline-offset: 2px;
}
body.gg input[type=reset] { background: #fff !important; color: var(--gg-text) !important; border-color: #D5D9E2 !important; }

/* ---------- Onglets des formulaires de la vitrine (contact / rappel / message / avis) ---------- */
body.gg #btncontact {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 6px;
  margin: 18px auto 0; padding: 6px; max-width: 760px; box-sizing: border-box;
  background: var(--gg-soft); border-radius: 999px;
}
body.gg #btncontact input.btnvisible, body.gg #btncontact input.btnvisible2 {
  flex: 1 1 auto; margin: 0; min-height: 40px; padding: 8px 16px !important; font-size: 14.5px !important;
  background: transparent !important; color: var(--gg-text) !important; box-shadow: none !important; transform: none;
}
body.gg #btncontact input.btnvisible:hover { background: #fff !important; filter: none; }
body.gg #btncontact input.btnvisible2 { background: var(--gg-accent) !important; color: #fff !important; box-shadow: 0 1px 3px rgba(16,24,40,.15) !important; }

/* ---------- Cartes autour des formulaires ---------- */
body.gg div[id^="murform"] {
  box-sizing: border-box; max-width: 760px; margin: 12px auto 24px;
  padding: 24px 28px 28px;
  background: #fff !important; border: 1px solid var(--gg-border) !important;
  border-radius: 18px; box-shadow: var(--gg-shadow); text-align: left;
}
/* les formulaires masques ne doivent plus prendre de place (evite le defilement horizontal) */
body.gg div[id^="murform"][style*="hidden"] { display: none !important; }
body.gg div[id^="murform"] > a:first-child { float: right; padding: 4px; border-radius: 999px; line-height: 0; }
body.gg div[id^="murform"] > a:first-child:hover { background: var(--gg-bg); }
body.gg div[id^="murform"] > a:first-child img { width: 20px; height: 20px; }
body.gg div[id^="murform"] h3 { margin: 0 32px 6px 0; font-size: 19px; font-weight: 700; line-height: 1.35; color: var(--gg-text); text-align: left; }
body.gg div[id^="murform"] center { text-align: left; }
body.gg div[id^="murform"] hr { margin: 14px 0 18px; }
body.gg div[id^="murform"] div[style*="#DDDDDD" i] {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  background: var(--gg-soft) !important; border: 0 !important; border-radius: 12px !important;
  padding: 14px 16px !important; color: var(--gg-text) !important; font-weight: 500 !important;
}
body.gg div[id^="murform"] div[style*="#DDDDDD" i] img[align] { float: none; padding: 0 !important; width: 36px; height: 36px; }
body.gg div[id^="murform"] div[style*="#DDDDDD" i] form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; flex: 1 1 260px; }
body.gg div[id^="murform"] div[style*="#DDDDDD" i] input[type=text] { flex: 1 1 180px; width: auto; }

/* ---------- Mise en page des formulaires en tableau ---------- */
body.gg form { max-width: 100%; }
body.gg form table { border-collapse: separate; border-spacing: 0 6px; max-width: 100%; }
body.gg form td { vertical-align: middle; font-size: 15px; color: var(--gg-text); }
body.gg form td[align=right], body.gg form td[align="right"] { padding-right: 14px; font-weight: 600; font-size: 14px; color: #3B4152; white-space: nowrap; }
body.gg form td input[type=text], body.gg form td input:is(:not([type]),[type=texte]), body.gg form td input[type=email],
body.gg form td input[type=tel], body.gg form td input[type=password], body.gg form td select, body.gg form td textarea { width: 100% !important; }
body.gg form input[size], body.gg form textarea[cols] { max-width: 100%; }

/* ---------- Mobile : les tableaux de formulaire passent en une colonne ---------- */
@media (max-width: 640px) {
  body.gg form table, body.gg form tbody, body.gg form tr, body.gg form td, body.gg form th {
    display: block; width: 100% !important; box-sizing: border-box;
  }
  body.gg form table { border-spacing: 0; }
  body.gg form tr { margin-bottom: 12px; }
  body.gg form td { padding: 0 !important; text-align: left !important; }
  body.gg form td[align=right], body.gg form td[align="right"] { white-space: normal; margin-bottom: 6px; }
  body.gg form td[colspan] { text-align: center !important; }
  body.gg form input[type=submit]:not(#imgsearch), body.gg form input[type=button], body.gg form button { width: 100%; }
  body.gg input[type=text], body.gg input[type=email], body.gg input[type=password], body.gg input[type=tel],
  body.gg input:is(:not([type]),[type=texte]), body.gg select, body.gg textarea { font-size: 16px !important; /* evite le zoom iOS */ }
  body.gg div[id^="murform"] { padding: 18px 16px 20px; border-radius: 14px; margin-left: 0; margin-right: 0; }
  body.gg div[id^="murform"] h3 { font-size: 17px; }
  body.gg #btncontact { border-radius: 16px; }
  body.gg #btncontact input.btnvisible, body.gg #btncontact input.btnvisible2 { flex: 1 1 calc(50% - 6px); width: auto; border-radius: 12px !important; }
}

/* ---------- Calendrier jQuery UI (champs date) ---------- */
body.gg .ui-datepicker { font-family: var(--gg-font) !important; border-radius: 14px !important; border: 1px solid var(--gg-border) !important; box-shadow: var(--gg-shadow-lg); padding: 8px; max-width: calc(100vw - 24px); }
body.gg .ui-datepicker .ui-datepicker-header { background: var(--gg-soft) !important; border: 0 !important; border-radius: 10px; }
body.gg .ui-datepicker .ui-state-active, body.gg .ui-datepicker .ui-state-highlight { background: var(--gg-accent) !important; color: #fff !important; border-color: transparent !important; border-radius: 8px; }
@media (max-width: 640px) { body.gg .ui-datepicker-multi .ui-datepicker-group { float: none; width: 100% !important; } body.gg .ui-datepicker-multi { width: auto !important; } }

/* ---------- Pages d'inscription / formulaires du portail ---------- */
body.gg .inscriptiondiv input[type=text], body.gg .inscriptiondiv input[type=email], body.gg .inscriptiondiv input[type=password],
body.gg .inscriptiondiv input:is(:not([type]),[type=texte]), body.gg .inscriptiondiv select, body.gg .inscriptiondiv textarea { width: 100% !important; margin: 4px 0 8px !important; }
body.gg .inscriptiondiv input[name=titreadminpro], body.gg .inscriptiondiv input[name=titreadminpart] { width: auto !important; flex: 1 1 200px; }
body.gg .inscriptiondiv select + select, body.gg .inscriptiondiv div > select { width: 100% !important; }
/* choix Femme / Homme (radios masques, libelles en pastilles) */
body.gg input[type=radio] + label {
  display: inline-flex !important; align-items: center; gap: 8px;
  margin: 4px 6px 4px 0 !important; padding: 9px 16px !important;
  font: 600 15px/1.2 var(--gg-font) !important; color: var(--gg-text);
  background: #fff !important; border: 1px solid #D5D9E2 !important; border-radius: 999px !important;
  cursor: pointer; transition: border-color .15s, background .15s, color .15s;
}
body.gg input[type=radio] + label:hover { border-color: var(--gg-accent) !important; }
body.gg input[type=radio]:checked + label {
  background: color-mix(in srgb, var(--gg-accent) 10%, #fff) !important;
  border-color: var(--gg-accent) !important; color: var(--gg-accent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--gg-accent) 14%, transparent);
}
body.gg input[type=radio] + label img { width: 18px; height: 18px; }
/* colonnes a largeur fixe (inline) -> fluides */
body.gg #apDivMain div[style*="width:400px"], body.gg #apDivMain div[style*="width: 400px"] { max-width: 100%; box-sizing: border-box; }
body.gg #apDivMain img[src$="tablette.svg"] { width: 100%; max-width: 320px; height: auto; }
body.gg #apDivMain h1 img[src$="chrono.svg"] { vertical-align: -4px; }
@media (max-width: 860px) {
  body.gg #apDivMain div[style*="width:400px"], body.gg #apDivMain div[style*="width: 400px"] { width: 100% !important; display: block !important; }
  body.gg-portail .inscriptiondiv { padding: 20px 16px !important; }
  body.gg #apDivMain h1 { font-size: 24px !important; line-height: 1.25; }
}

/* =========================================================
   Espace membre / administration : formulaires en tableaux
   (tableaux anciens avec bgcolor, border, cellpadding...)
   ========================================================= */
/* tableau le plus interne qui contient des champs = carte de formulaire */
body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) {
  width: 100% !important; max-width: 920px; margin: 16px auto 24px;
  background: #fff !important; border: 1px solid var(--gg-border) !important;
  border-collapse: separate !important; border-spacing: 0 !important;
  border-radius: 18px; box-shadow: var(--gg-shadow); overflow: hidden;
}
body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) > tbody > tr > td,
body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) > tbody > tr > th {
  background: transparent !important; border: 0 !important; border-top: 1px solid var(--gg-border) !important;
  padding: 14px 18px !important; vertical-align: middle; font-size: 15px; color: var(--gg-text);
}
body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) > tbody > tr:first-child > td { border-top: 0 !important; }
body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) > tbody > tr > td[align=right] {
  width: 32%; font-weight: 600; font-size: 14px; color: #3B4152; text-align: right;
}
body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) h1,
body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) h2 {
  margin: 4px 0; font-size: 20px !important; font-weight: 700; color: var(--gg-text) !important; line-height: 1.3;
}
body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) tr:first-child td[colspan] h1,
body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) tr:first-child td[colspan] h2 { font-size: 22px !important; }
/* tous les champs de ces cartes prennent la largeur disponible */
body.gg #apDivMain td input[type=text], body.gg #apDivMain td input:is(:not([type]),[type=texte]), body.gg #apDivMain td input[type=email],
body.gg #apDivMain td input[type=password], body.gg #apDivMain td input[type=tel], body.gg #apDivMain td input[type=url],
body.gg #apDivMain td textarea { width: 100% !important; max-width: 100%; }
body.gg #apDivMain td select { max-width: 100%; }
body.gg #apDivMain td input[type=text][maxlength="2"],
body.gg #apDivMain td input[type=text][maxlength="3"], body.gg #apDivMain td input[type=text][maxlength="4"],
body.gg #apDivMain td input[type=text][maxlength="5"] { width: auto !important; min-width: 80px; }
body.gg #apDivMain input[type=checkbox][style*="width:25px"] { width: 20px !important; height: 20px !important; }
/* petits liens-boutons (class btn...) */
body.gg #apDivMain a[class^="btn"]:not(.btnPrincipals), body.gg #apDivMain a.buttonedit {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; margin: 2px;
  font: 600 13.5px/1.2 var(--gg-font); color: var(--gg-accent) !important; text-decoration: none !important;
  background: var(--gg-soft) !important; border: 1px solid color-mix(in srgb, var(--gg-accent) 22%, transparent) !important;
  border-radius: 999px !important; box-shadow: none !important; text-shadow: none !important;
}
body.gg #apDivMain a[class^="btn"]:not(.btnPrincipals):hover, body.gg #apDivMain a.buttonedit:hover { background: color-mix(in srgb, var(--gg-accent) 14%, #fff) !important; }
body.gg #apDivMain .remarques { font-size: 13px; color: var(--gg-muted); }

@media (max-width: 640px) {
  body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea),
  body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea) > tbody,
  body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea) > tbody > tr,
  body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea) > tbody > tr > td,
  body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea) > tbody > tr > th {
    display: block; width: 100% !important; box-sizing: border-box;
  }
  body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) { border-radius: 14px; margin: 12px 0 20px; }
  body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) > tbody > tr > td { padding: 10px 14px !important; text-align: left !important; }
  body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) > tbody > tr > td[align=right] { width: 100% !important; padding-bottom: 0 !important; border-bottom: 0 !important; }
  body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) > tbody > tr > td[align=right] + td { border-top: 0 !important; padding-top: 6px !important; }
  body.gg #apDivMain table:has(input:not([type=hidden]), select, textarea):not(:has(table)) > tbody > tr > td[colspan] { text-align: center !important; }
  body.gg #apDivMain input[type=submit]:not(#imgsearch) { width: 100%; }
}

/* images d'icones absentes (remplacees par le script de secours) */
body.gg img.gg-ico-absente { width: 18px !important; height: 18px !important; vertical-align: -3px; opacity: .75; }

/* ---------- Espace membre : adaptation mobile generale ---------- */
@media (max-width: 640px) {
  body.gg #apDivMain { overflow-wrap: anywhere; }
  body.gg #apDivMain [style*="width:"], body.gg #apDivMain [style*="width :"] { max-width: 100% !important; box-sizing: border-box; }
  body.gg #apDivMain [width] { max-width: 100% !important; }
  body.gg #apDivMain img { max-width: 100%; height: auto; }
  body.gg #apDivMain iframe, body.gg #apDivMain video, body.gg #apDivMain embed, body.gg #apDivMain object { max-width: 100%; }
  /* tableaux de donnees (sans champ) : defilement horizontal dans leur cadre */
  body.gg #apDivMain table:not(:has(input:not([type=hidden]), select, textarea)) {
    display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
  body.gg #apDivMain pre { white-space: pre-wrap; }
}

/* ---------- Formulaires .cssform (libelle a gauche, champ a droite) ---------- */
body.gg .cssform {
  max-width: 760px; margin: 16px auto 24px; padding: 8px 24px 20px; box-sizing: border-box;
  background: #fff; border: 1px solid var(--gg-border); border-radius: 18px; box-shadow: var(--gg-shadow);
}
body.gg .cssform p {
  display: grid; grid-template-columns: 220px minmax(0, 1fr); align-items: center; gap: 6px 16px;
  width: auto !important; height: auto !important; margin: 0 !important;
  padding: 14px 0 !important; border-top: 1px solid var(--gg-border) !important;
}
body.gg .cssform p:first-child { border-top: 0 !important; }
body.gg .cssform label {
  float: none !important; width: auto !important; margin: 0 !important;
  font-weight: 600 !important; font-size: 14px; color: #3B4152;
}
body.gg .cssform input[type=text], body.gg .cssform input:is(:not([type]),[type=texte]), body.gg .cssform textarea, body.gg .cssform select { width: 100% !important; }
body.gg .cssform input[type=checkbox] { justify-self: start; }
body.gg .cssform p > :not(label):not(input):not(select):not(textarea) { grid-column: 2; }
@media (max-width: 640px) {
  body.gg .cssform { padding: 4px 16px 16px; border-radius: 14px; }
  body.gg .cssform p { grid-template-columns: 1fr; }
  body.gg .cssform p > :not(label):not(input):not(select):not(textarea) { grid-column: 1; }
  body.gg #apDivMain [class*="slider"] { max-width: 100% !important; }
}
body.gg .cssform p > textarea { grid-column: 2; }
body.gg .cssform .cssform-actions { padding-top: 16px; border-top: 1px solid var(--gg-border); text-align: right; }
@media (max-width: 640px) { body.gg .cssform p > textarea { grid-column: 1; } }

/* Choix de couleur (page Style) : nuancier qui passe a la ligne */
body.gg #apDivMain table:has(input[name=radiocolor]) { display: block; }
body.gg #apDivMain table:has(input[name=radiocolor]) > tbody { display: flex !important; flex-wrap: wrap; gap: 4px; padding: 12px; width: auto !important; }
body.gg #apDivMain table:has(input[name=radiocolor]) > tbody > tr { display: contents !important; }
body.gg #apDivMain table:has(input[name=radiocolor]) > tbody > tr > td { display: flex !important; align-items: center; width: auto !important; border: 0 !important; padding: 4px !important; }
body.gg input[name=radiocolor] + label { padding: 0 !important; border-radius: 10px !important; overflow: hidden; background: none !important; }
body.gg input[name=radiocolor] + label > div { width: 40px; height: 32px; border-radius: 8px; }
body.gg input[name=radiocolor]:checked + label { box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--gg-text) !important; }

/* ---------- Mot de passe : bouton oeil ---------- */
body.gg .gg-mdp { position: relative; display: inline-block; max-width: 100%; vertical-align: middle; width: 100%; }
body.gg .gg-mdp > input { width: 100% !important; padding-right: 48px !important; }
body.gg .gg-mdp > input[data-gg-oeil]:is([type=text]) { letter-spacing: .02em; }
body.gg .gg-mdp > button.gg-mdp-oeil.gg-mdp-oeil {
  position: absolute !important; top: 50%; right: 6px; transform: translateY(-50%) !important;
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 36px !important; height: 36px !important; min-height: 0 !important; padding: 0 !important; margin: 0 !important;
  background: transparent !important; color: var(--gg-muted) !important;
  border: 0 !important; border-radius: 8px !important; box-shadow: none !important; cursor: pointer;
}
body.gg .gg-mdp > button.gg-mdp-oeil.gg-mdp-oeil:hover { background: var(--gg-bg) !important; color: var(--gg-accent) !important; filter: none; transform: translateY(-50%) !important; }
body.gg .gg-mdp > button.gg-mdp-oeil.gg-mdp-oeil:focus-visible { outline: 2px solid var(--gg-accent); outline-offset: 1px; }
body.gg .gg-mdp > button.gg-mdp-oeil.gg-mdp-oeil[aria-pressed=true] { color: var(--gg-accent) !important; }

/* Aides sous les champs (anciennes infobulles .champs_span) : texte d'aide discret, toujours visible, sous le champ */
body.gg .champs_span {
  position: static !important; visibility: visible !important; display: block;
  width: auto !important; height: auto !important; max-width: 100%;
  margin: 6px 0 0 !important; padding: 0 !important;
  background: none !important; border: 0 !important; box-shadow: none !important;
  font: 400 13px/1.4 var(--gg-font) !important; color: var(--gg-muted) !important; text-align: left;
}

/* =========================================================
   Page Contact des vitrines (page_contact.php + coordonnees_page_commun.php)
   ========================================================= */
body.gg .gg-contact-entete { max-width: 760px; margin: 20px auto 4px; padding: 0 4px; text-align: center; }
body.gg .gg-contact-entete h2 { margin: 0 0 6px; font-size: 26px !important; font-weight: 800; line-height: 1.25; color: var(--gg-text) !important; }
body.gg .gg-contact-entete p { margin: 0; color: var(--gg-muted); font-size: 15.5px; }
body.gg .gg-contact-dest { display: block; margin-top: 4px; font-size: 14px; }
body.gg .gg-contact-outil { display: inline-flex; vertical-align: middle; margin-right: 6px; opacity: .7; }
body.gg .gg-contact-outil:hover { opacity: 1; }
body.gg .gg-contact-formulaires #btncontact { margin-top: 16px; }

body.gg .gg-contact-infos {
  max-width: 760px; margin: 8px auto 40px;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px;
}
body.gg .gg-contact-infos > hr, body.gg .gg-contact-infos > br { display: none; }
body.gg .gg-contact-maj { grid-column: 1 / -1; margin: 0; text-align: center; font-size: 13.5px; color: var(--gg-muted); }
body.gg .gg-contact-maj.recente b { color: #1F9D62; }
body.gg .gg-contact-carte {
  box-sizing: border-box; min-width: 0; padding: 20px 22px;
  background: #fff; border: 1px solid var(--gg-border); border-radius: 18px; box-shadow: var(--gg-shadow);
}
body.gg .gg-contact-carte h3 {
  display: flex; align-items: center; gap: 6px; margin: 0 0 12px;
  font-size: 13px !important; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gg-muted) !important;
}
body.gg .gg-contact-carte hr { display: none; }
body.gg .gg-contact-carte table { width: 100%; border-collapse: collapse; }
body.gg .gg-contact-carte tr { background: transparent !important; }

/* Telephones : carte pleine largeur, boutons "Voir le numero" */
body.gg .gg-contact-tels-carte { grid-column: 1 / -1; }
body.gg .gg-contact-tels td { display: block; width: auto !important; padding: 0; }
body.gg .gg-contact-tels tr { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; padding: 6px 0; }
body.gg .gg-contact-tels div[id^="tel"] { font-size: 0 !important; }
body.gg .gg-contact-tels a.voirletel, body.gg .gg-contact-tels div[id^="tel"] a {
  display: inline-flex; align-items: center; gap: 8px; padding: 12px 22px; border-radius: 999px;
  background: var(--gg-accent) !important; color: #fff !important; text-decoration: none !important;
  font: 700 17px/1.2 var(--gg-font) !important; box-shadow: 0 2px 8px color-mix(in srgb, var(--gg-accent) 30%, transparent);
}
body.gg .gg-contact-tels div[id^="tel"] a font { font-size: inherit !important; color: #fff !important; }
body.gg .gg-contact-tels div[id^="tel"] a:hover { filter: brightness(1.08); }
body.gg .gg-contact-tels div[id^="tel"] { font-size: 22px !important; font-weight: 700; color: var(--gg-text); }
body.gg .gg-contact-tels div[id^="desc"] { color: var(--gg-muted); font-size: 14px; }
body.gg .gg-contact-tels td.gg-contact-astuce {
  display: block; width: 100% !important; margin-top: 8px; padding: 10px 14px;
  background: var(--gg-soft); border-radius: 12px; color: var(--gg-text); font-size: 14px; text-align: left;
}

/* Adresses */
body.gg .gg-adresse { margin: 0 0 14px; }
body.gg .gg-adresse:last-child { margin-bottom: 0; }
body.gg .gg-adresse > u { text-decoration: none; font-weight: 700; }
body.gg .gg-adresse .gg-adresse-bloc { display: block !important; width: auto !important; font-size: 15px !important; line-height: 1.5; margin-top: 4px; }
body.gg .gg-adresse .gg-adresse-indications {
  display: block !important; width: auto !important; margin-top: 10px; padding: 10px 12px;
  background: var(--gg-bg) !important; border-radius: 10px; font-size: 14px !important; line-height: 1.5;
}

/* Localites */
body.gg .gg-contact-localites td { padding: 4px 0; font-size: 14.5px; }
body.gg .gg-contact-localites td[align=right] { width: 40%; padding-right: 10px; color: var(--gg-muted); }
body.gg .gg-contact-localites tr:first-child td { padding-bottom: 10px; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--gg-muted); }

/* Carte Google Maps */
body.gg .gg-contact-infos #map_canvas, body.gg .gg-contact-infos [id*="map"] { grid-column: 1 / -1; border-radius: 18px; overflow: hidden; border: 1px solid var(--gg-border); }

/* Sites et reseaux sociaux */
body.gg .gg-contact-liens-titre { grid-column: 1 / -1; padding: 0; background: none; border: 0; box-shadow: none; margin-bottom: -10px; }
body.gg .gg-contact-liens { grid-column: 1 / -1; }
body.gg .gg-contact-reflien td { padding: 4px 0; font-size: 14.5px; }
body.gg .gg-contact-reflien td[align=right] { color: var(--gg-muted); padding-right: 10px; }
body.gg .gg-contact-liste-liens { border-spacing: 0 !important; margin-top: 8px; }
body.gg .gg-contact-liste-liens td { padding: 10px 0 !important; border-top: 1px solid var(--gg-border); }
body.gg .gg-contact-liste-liens tr:first-child td { border-top: 0; }

@media (max-width: 700px) {
  body.gg .gg-contact-infos { grid-template-columns: 1fr; gap: 12px; }
  body.gg .gg-contact-entete h2 { font-size: 22px !important; }
  body.gg .gg-contact-carte { padding: 16px; border-radius: 14px; }
  body.gg .gg-contact-tels a.voirletel, body.gg .gg-contact-tels div[id^="tel"] a { width: 100%; justify-content: center; box-sizing: border-box; }
  body.gg .gg-contact-tels td { width: 100% !important; }
}

/* Plan Google Maps (google_maps.php) */
body.gg .gg-carte { position: relative; grid-column: 1 / -1; height: 320px; border-radius: 18px; overflow: hidden; border: 1px solid var(--gg-border); box-shadow: var(--gg-shadow); background: #e5e3df; }
body.gg .gg-carte iframe { display: block; width: 100%; height: 100%; border: 0; }
body.gg .gg-carte-lien {
  position: absolute; right: 10px; bottom: 10px; padding: 7px 12px; border-radius: 999px;
  background: #fff; color: var(--gg-text) !important; font: 600 13px var(--gg-font); text-decoration: none !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
}
body.gg .gg-carte-lien:hover { color: var(--gg-accent) !important; }
@media (max-width: 700px) { body.gg .gg-carte { height: 240px; border-radius: 14px; } }
