/*
Theme Name: TECS — Kadence Child
Theme URI: https://www.depannage-chauffage-sanitaire.com/
Description: Thème enfant Kadence pour T.E.C.S — Top Energie Chauffage Sanitaire. Palette issue du logo, mode clair/sombre natif.
Author: InaberInfo
Author URI: https://www.inaberinfo.com/
Template: kadence
Version: 1.0.0
Text Domain: kadence-tecs
*/

/* ---------------------------------------------------------
   1. Variables sémantiques — mode clair (défaut)
   Les couleurs de marque ne basculent JAMAIS.
   Seuls fond, texte, bordures et accent s'adaptent.
   --------------------------------------------------------- */

:root {
	--tecs-surface: #FFFFFF;
	--tecs-surface-alt: #F4F7FA;
	--tecs-surface-raised: #FFFFFF;
	--tecs-text: #16202B;
	--tecs-text-muted: #58606E;
	--tecs-border: #DCE4EC;
	--tecs-accent: #0870A8;
	--tecs-shadow: 0 1px 2px rgba(22, 32, 43, .06), 0 8px 24px rgba(22, 32, 43, .06);
	--tecs-logo-light: block;
	--tecs-logo-dark: none;
	color-scheme: light;
}

/* Mode sombre — préférence système, sauf choix manuel explicite */
@media (prefers-color-scheme: dark) {
	:root:not([data-tecs-theme="light"]) {
		--tecs-surface: #10171F;
		--tecs-surface-alt: #17202B;
		--tecs-surface-raised: #1B2530;
		--tecs-text: #E8EDF2;
		--tecs-text-muted: #9AA6B4;
		--tecs-border: #2A3642;
		--tecs-accent: #4FA8DC;
		--tecs-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px rgba(0, 0, 0, .35);
		--tecs-logo-light: none;
		--tecs-logo-dark: block;
		color-scheme: dark;
	}
}

/* Mode sombre — choix manuel */
:root[data-tecs-theme="dark"] {
	--tecs-surface: #10171F;
	--tecs-surface-alt: #17202B;
	--tecs-surface-raised: #1B2530;
	--tecs-text: #E8EDF2;
	--tecs-text-muted: #9AA6B4;
	--tecs-border: #2A3642;
	--tecs-accent: #4FA8DC;
	--tecs-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px rgba(0, 0, 0, .35);
	--tecs-logo-light: none;
	--tecs-logo-dark: block;
	color-scheme: dark;
}

/* ---------------------------------------------------------
   2. Transition douce au basculement
   --------------------------------------------------------- */

@media (prefers-reduced-motion: no-preference) {
	body,
	.tecs-card,
	.tecs-surface-alt {
		transition: background-color .25s ease, border-color .25s ease, color .25s ease;
	}
}

/* ---------------------------------------------------------
   3. Logo bi-mode
   Deux <img> dans l'en-tête, un seul visible à la fois.
   --------------------------------------------------------- */

.tecs-logo--light { display: var(--tecs-logo-light); }
.tecs-logo--dark  { display: var(--tecs-logo-dark); }

/* ---------------------------------------------------------
   4. Bouton de bascule clair/sombre
   --------------------------------------------------------- */

.tecs-theme-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	background: transparent;
	border: 1px solid var(--tecs-border);
	border-radius: 8px;
	color: var(--tecs-text-muted);
	cursor: pointer;
	line-height: 1;
	transition: border-color .2s ease, color .2s ease;
}

.tecs-theme-toggle:hover {
	border-color: var(--tecs-accent);
	color: var(--tecs-accent);
}

.tecs-theme-toggle:focus-visible {
	outline: 2px solid var(--tecs-accent);
	outline-offset: 3px;
}

.tecs-theme-toggle svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.tecs-theme-toggle .tecs-icon-sun  { display: var(--tecs-logo-dark); }
.tecs-theme-toggle .tecs-icon-moon { display: var(--tecs-logo-light); }

/* ---------------------------------------------------------
   5. Cartes de service — le motif répété du site
   --------------------------------------------------------- */

.tecs-card {
	background: var(--tecs-surface-raised);
	border: 1px solid var(--tecs-border);
	border-radius: 12px;
	padding: 1.75rem;
	height: 100%;
}

.tecs-card h3 {
	margin-top: 0;
	margin-bottom: .5rem;
}

.tecs-card p:last-child {
	margin-bottom: 0;
	color: var(--tecs-text-muted);
}

/* ---------------------------------------------------------
   6. Barre d'appel d'urgence — mobile uniquement
   --------------------------------------------------------- */

.tecs-callbar {
	display: none;
}

@media (max-width: 768px) {
	.tecs-callbar {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 999;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: .6rem;
		padding: .9rem 1rem;
		background: #F08830;
		color: #1A1208;
		font-weight: 700;
		font-size: 1.0625rem;
		text-decoration: none;
		box-shadow: 0 -2px 12px rgba(0, 0, 0, .18);
	}

	body {
		padding-bottom: 60px;
	}
}

/* ---------------------------------------------------------
   7. Accessibilité
   --------------------------------------------------------- */

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
