/**
 * Deekay School — harmonisation graphique du site
 *
 * Chargée sur TOUTES les pages (contrairement à woocommerce.css).
 *
 * Objet :
 *  1. Reprendre la main sur les couleurs par défaut de Stackable, qui
 *     introduisaient du vert, du brun et du rose étrangers à la DA.
 *  2. Arrondir tous les boutons, sans toucher à leurs couleurs : les
 *     différents styles (jaune, noir, contour) restent volontairement distincts.
 *  3. Rendre les liens lisibles sur fond clair comme sur fond sombre.
 */

:root,
body {
	/* --- Palette principale --- */
	--dk-ink: #1C1816;        /* encre, fonds sombres */
	--dk-yellow: #FFE62B;     /* accent */
	--dk-beige: #E4C98C;      /* liens sur fond sombre */
	--dk-light: #F5F5F5;      /* fond clair neutre */
	--dk-white: #FFFFFF;

	/* --- Couleurs secondaires (badges, états) ---
	   Volontairement discrètes et accordées à la DA. Aucune n'est appliquée
	   par défaut : elles servent aux badges « Complet », « Nouveau », etc. */
	--dk-success: #6FA86B;    /* disponible, validé */
	--dk-warning: #E0A458;    /* attention, dernières places */
	--dk-danger:  #C4574F;    /* complet, erreur */
	/* Le « gris discret » n'existe plus comme couleur à part : c'était un gris
	   neutre au milieu d'une charte de gris chauds, et il détonnait. Il pointe
	   désormais sur le gris des titres — une couleur de moins à régler, et un
	   meilleur contraste sur fond clair. La variable reste pour que les feuilles
	   qui l'utilisent continuent de fonctionner. */
	--dk-muted:   var(--dk-titre);
	--dk-grey:    #6B6560;    /* survols : le jaune reste rare, donc fort */
	--dk-titre:   #928885;    /* grands titres de section : FAQ, à propos, horaires */
	--dk-bleu:    #C4CCD8;    /* gris bleuté : survols discrets, bordures */
}

/* =====================================================================
   1. STACKABLE — on remplace ses couleurs par défaut
   Les variables ci-dessous pilotaient tous les blocs du site :
   liens verts (#afd275), boutons bruns (#7e685a), titres roses (#e7717d).
   ===================================================================== */
:root,
body,
.stk-block,
[class*="stk-"] {
	--stk-heading-color: var(--dk-ink);
	--stk-text-color: var(--dk-ink);
	--stk-link-color: var(--dk-ink);
	--stk-link-hover-color: var(--dk-yellow);
	--stk-accent-color: var(--dk-yellow);
	--stk-subtitle-color: var(--dk-muted);
	--stk-button-text-color: var(--dk-ink);
	--stk-container-background-color: var(--dk-light);
}

/* Le gris clair de Stackable était légèrement bleuté : on le neutralise. */
[class*="stk-"][style*="#f3f5f7"],
[class*="stk-"][style*="#F3F5F7"] {
	background-color: var(--dk-light) !important;
}

/* =====================================================================
   2. BOUTONS — mêmes styles qu'avant, mais TOUS arrondis
   (demande explicite : garder la variété de couleurs, unifier la forme)
   ===================================================================== */
.stk-button,
.stk-link.stk-button,
.dks-ap-btn,
.dks-lieu-btn,
.ct-button,
.wp-block-button__link,
.wp-element-button,
button.regform-button,
.woocommerce .button,
.woocommerce button.button,
input[type="submit"],
button[type="submit"] {
	border-radius: 999px !important;
}

/* Boutons de contenu (Stackable) : encre pleine sur les fonds clairs.
   Le jaune est réservé à l'appel à l'action principal de l'en-tête, sinon il
   sature la page (retour Jessica : « trop de jaune, pas assez sobre »). */
.stk-button,
.dks-ap-btn,
.dks-lieu-btn {
	--stk-button-background-color: var(--dk-ink);
	background-color: var(--dk-ink) !important;
	color: #ffffff !important;
	font-weight: 700;
	letter-spacing: .03em;
	border: 1px solid var(--dk-ink);
	transition: background-color .15s ease, color .15s ease;
}
/* Survol : gris plutôt que l'inversion en blanc, plus sobre. */
.stk-button:hover,
.dks-ap-btn:hover,
.dks-ap-btn:focus-visible,
.dks-lieu-btn:hover,
.dks-lieu-btn:focus-visible {
	background-color: var(--dk-grey) !important;
	border-color: var(--dk-grey);
	color: #ffffff !important;
}
.stk-button .stk-button__inner-text {
	color: inherit !important;
}

/* =====================================================================
   3. LIENS — lisibles sur les deux fonds
   ===================================================================== */
/* Fond clair : encre soulignée, jaune au survol.
   ⚠️ NE PAS utiliser [class*="stk-"] comme ancêtre : le <body> porte la classe
   « stk--is-blocksy-theme », ce qui soulignerait TOUS les liens du site,
   menu compris. On vise donc uniquement les blocs de contenu Stackable. */
.entry-content a:not(.button):not(.ct-button):not(.stk-button):not(.wp-block-button__link):not(.dks-ap-btn):not(.dks-lieu-btn),
.stk-block-text a:not(.stk-button):not(.ct-button):not(.dks-ap-btn):not(.dks-lieu-btn),
.stk-block-heading a:not(.stk-button),
.stk-block-columns a:not(.stk-button):not(.ct-button):not(.dks-ap-btn):not(.dks-lieu-btn) {
	color: var(--dk-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}
/* Survol des liens : gris. Le jaune est gardé pour les titres et l'appel à
   l'action de l'en-tête — à petite dose il reste fort. */
.entry-content a:not(.button):not(.ct-button):not(.stk-button):not(.dks-ap-btn):not(.dks-lieu-btn):hover,
.stk-block-text a:not(.stk-button):not(.ct-button):not(.dks-ap-btn):not(.dks-lieu-btn):hover,
.stk-block-columns a:not(.stk-button):not(.ct-button):not(.dks-ap-btn):not(.dks-lieu-btn):hover {
	color: var(--dk-grey);
}

/* Jamais de soulignement : menu, pied de page, panneau mobile, et navigation
   de l'espace client (ce sont des boutons, pas des liens de texte). */
.ct-header a,
.ct-header .ct-menu-link,
footer.ct-footer a,
#offcanvas a,
.woocommerce-MyAccount-navigation a,
.woocommerce-MyAccount-navigation li a,
.woocommerce a,
.woocommerce-page a,
body.woocommerce-cart a,
body.woocommerce-checkout a,
body.woocommerce-account a {
	text-decoration: none !important;
}

/* Page « bientôt disponible » : texte posé sur une image. L'encre y était
   illisible, mais le jaune saturait. On passe en blanc souligné, gris au survol
   — sobre et cohérent avec les autres pages. */
.page-id-1574 a:not(.button):not(.stk-button):not(.ct-button),
.page-id-1574 .entry-content a {
	color: #ffffff !important;
	text-decoration: underline;
	text-underline-offset: 3px;
}
.page-id-1574 a:not(.button):not(.stk-button):not(.ct-button):hover {
	color: var(--dk-beige) !important;
}

/* Fond sombre : beige, blanc au survol */
.dks-cards a:not(.button),
.dks-term a:not(.button),
[style*="background-color:#1C1816"] a:not(.button),
[style*="background-color: #1C1816"] a:not(.button) {
	color: var(--dk-beige);
	text-decoration: none;
}

/* Le pied de page conserve son propre style */
footer.ct-footer a {
	text-decoration: none;
}

/* =====================================================================
   4. MENU MOBILE (panneau latéral) — lisibilité
   Le panneau s'ouvre par-dessus des pages de fonds très différents ; on lui
   donne une identité stable plutôt que de dépendre de la page sous-jacente.
   ===================================================================== */
#offcanvas.ct-panel,
#offcanvas .ct-panel-inner {
	background-color: var(--dk-ink);
}
/* TOUS les liens en blanc, y compris la page courante : le menu doit être
   identique quelle que soit la page (des entrées passaient en jaune selon
   l'endroit d'où on l'ouvrait). */
#offcanvas .ct-panel-content a,
#offcanvas .ct-panel-content .ct-menu-link,
#offcanvas .ct-panel-content li a,
#offcanvas .ct-panel-content li.current-menu-item > a,
#offcanvas .ct-panel-content li.current_page_item > a,
#offcanvas .ct-panel-content li[class*="current"] > a,
#offcanvas .ct-panel-content li.current-menu-ancestor > a {
	color: var(--dk-white) !important;
	text-decoration: none;
}
#offcanvas .ct-panel-content a:hover {
	color: var(--dk-beige) !important;
}
#offcanvas .ct-toggle-close,
#offcanvas .ct-toggle-close svg,
#offcanvas .ct-toggle-close rect,
#offcanvas .ct-toggle-close path {
	color: var(--dk-white);
	fill: currentColor;
}

/* ⚠️ Le panneau porte AUSSI la classe .ct-header : les règles qui basculent le
   logo en noir sur les pages claires s'y appliquaient, rendant le logo invisible
   sur le fond sombre du menu. On y rétablit toujours la version blanche. */
#offcanvas .default-logo,
#offcanvas .ct-panel-content .default-logo {
	display: initial !important;
}
#offcanvas .sticky-logo {
	display: none !important;
}
#offcanvas .site-logo-container,
#offcanvas .ct-logo-container {
	display: block !important;
	margin-bottom: 18px;
}
/* Le bouton d'appel à l'action du panneau garde son fond jaune, avec un texte
   ENCRE : il ressortait en blanc, illisible sur le jaune. */
#offcanvas .ct-button,
#offcanvas a.ct-button,
#offcanvas .ct-button span,
#offcanvas .ct-header-cta a,
#offcanvas .ct-header-cta .ct-button {
	color: var(--dk-ink) !important;
	font-weight: 700;
}

/* =====================================================================
   5. Badges (à utiliser au besoin — aucun style imposé ailleurs)
   ===================================================================== */
.dk-badge {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--dk-ink);
	background-color: var(--dk-yellow);
}
.dk-badge--success { background-color: var(--dk-success); color: #fff; }
.dk-badge--warning { background-color: var(--dk-warning); color: var(--dk-ink); }
.dk-badge--danger  { background-color: var(--dk-danger);  color: #fff; }
.dk-badge--muted   { background-color: rgba(255,255,255,.10); color: var(--dk-white); }

/* =====================================================================
   6. Formulaires Ninja Forms
   ===================================================================== */

/* « Les champs marqués d'un * sont obligatoires » : une mention de service,
   pas un titre. Ninja Forms la sort en pleine taille et centrée sur toute la
   largeur, où elle pèse autant que la question posée juste au-dessus. On la
   ramène à gauche, alignée sur les champs, et au format d'une légende. */
.nf-form-fields-required {
	text-align: left;
	font-size: 12px;
	line-height: 1.5;
	color: var(--dk-grey, #928885);
	opacity: .85;
	margin-bottom: 10px;
}

/* =====================================================================
   7. Pied de page — la ligne des liens légaux
   ===================================================================== */

/* Quatre liens de conformité sur une ligne, sous les colonnes et dans la même
   zone sombre qu'elles. Ils occupent toute la largeur plutôt qu'une colonne :
   ce ne sont pas des destinations parmi d'autres, c'est le pied juridique. */
.ct-footer [data-row="middle"] [data-column="widget-area-5"] {
	grid-column: 1 / -1;
	text-align: center;
	padding-top: 26px;
	border-top: 1px solid rgba(255, 255, 255, .12);
}

.ct-footer .dks-legal-line {
	margin: 0;
	line-height: 2;
}

/* Ce widget n'hérite pas des couleurs de lien du pied de page : sans cette
   règle, les quatre liens sortent en bleu de navigateur, qui n'existe nulle
   part dans la charte. Gris discret, blanc au survol. */
.ct-footer .dks-legal-line a {
	color: var(--dk-muted, #A3A3A3);
	text-decoration: none;
}

.ct-footer .dks-legal-line a:hover,
.ct-footer .dks-legal-line a:focus-visible {
	color: var(--dk-white);
}

/* Le séparateur structure la ligne, il ne se lit pas. */
.ct-footer .dks-legal-line span {
	opacity: .4;
	margin: 0 10px;
	user-select: none;
}

@media (max-width: 600px) {
	.ct-footer .dks-legal-line span { margin: 0 6px; }
}

/* --- Pied de page : rythme des colonnes ------------------------------- */

/* Un sous-titre appartient à la liste qu'il annonce : l'espace normal d'un
   paragraphe l'en détachait, et « L'ÉCOLE » flottait entre deux blocs sans
   qu'on sache lequel il introduisait. */
.ct-footer .dks-sous-titre {
	margin-bottom: 0;
}

.ct-footer .dks-sous-titre + ul {
	margin-top: 4px;
}

/* Un lien mis à part du reste de la liste : la location n'est pas un cours,
   l'espace le dit mieux qu'un intertitre de plus. */
.ct-footer li.dks-espace-avant {
	margin-top: 16px;
}

/* Deux widgets empilés dans la même colonne s'écartaient d'un bloc entier :
   à l'œil, l'e-mail de facturation semblait appartenir à autre chose qu'aux
   horaires juste au-dessus. Une ligne d'écart suffit. */
.ct-footer [data-column="widget-area-3"] .ct-widget + .ct-widget {
	margin-top: 1em;
}

/* --- Le menu sur nos pages claires ------------------------------------- */

/*
 * Une bande sombre derrière le menu, à l'arrivée sur une page claire.
 *
 * Le menu du site est transparent en haut de page, et son texte est blanc :
 * il se pose par-dessus le début du contenu et laisse voir au travers. Cela
 * fonctionne partout parce que les pages du site commencent toutes par un
 * grand visuel sombre — c'est même l'effet recherché.
 *
 * Nos écrans à nous commencent par un titre sur fond blanc. Le menu s'y
 * retrouvait écrit en blanc sur blanc : invisible à l'arrivée, il ne
 * réapparaissait qu'au défilement, quand le thème lui donne enfin un fond.
 * On lui rend donc le fond sombre qui lui manque, et le blanc redevient lisible.
 *
 * Le fond ne vaut QUE pour l'arrivée. Dès qu'on descend, le thème repasse la
 * rangée du menu de `data-transparent-row="yes"` à `"no"` et lui donne son fond
 * clair, avec le texte et le logo en noir. En accrochant notre fond à ce même
 * `"yes"`, il s'efface tout seul au bon moment : sans cela on gardait du noir
 * sous un texte devenu noir, et le menu disparaissait une deuxième fois.
 *
 * On reconnaît la page à ce qu'elle contient, et non à son numéro : une liste
 * d'identifiants aurait été à tenir à jour à chaque page créée, et c'est le
 * genre de liste qu'on oublie. Ici, le jour où l'écran d'inscription est posé
 * ailleurs, le fond le suit tout seul. Le reste du site — accueil, horaires,
 * tarifs, conditions, compte, panier — commence déjà par un visuel sombre et
 * n'a besoin de rien.
 *
 * Sur un navigateur trop ancien pour :has(), la règle est simplement ignorée
 * et l'on retrouve le menu clair d'avant : c'est moins bien, mais rien n'est
 * cassé pour autant.
 */
body:has( .dks-ins ) #header [data-row][data-transparent-row="yes"],
body:has( .dks-pr ) #header [data-row][data-transparent-row="yes"],
body:has( .dks-location ) #header [data-row][data-transparent-row="yes"] {
	background-color: var(--dk-ink, #1C1816);
}
