/*
Theme Name: Modins Child
Theme URI: https://gaviaspreview.com/wp/modins/
Author URI: https://themeforest.net/user/gavias
Author: Gaviasthemes Team — personnalisé par FCF WebDesign pour JK Couverture
Description: Child theme for the Modins theme. JK Couverture : header PC & mobile en dégradé noir → bleu, menu mobile dégradé avec boutons Téléphone et Contactez-nous.
Template: modins
Version: 1.1.0
*/

/* =====================================================================
   JK Couverture — charte
   ===================================================================== */
:root{
	--jk-noir:#1D1D1B;
	--jk-accent:#43A3DB;
	--jk-accent-f:#1F73A8;
	--jk-accent-h:#185E8A;
	--jk-deg-header:linear-gradient(90deg,#1D1D1B 0%,#1D1D1B 35%,#185E8A 75%,#1F73A8 100%);
	--jk-deg-menu:linear-gradient(160deg,#1D1D1B 0%,#185E8A 70%,#1F73A8 100%);
}

/* =====================================================================
   1 · HEADER PC (Header Builder Elementor) — fond dégradé noir → bleu
   Les sections de premier niveau du modèle d'en-tête deviennent transparentes,
   le dégradé est posé sur l'enveloppe du header (et sur le sticky).
   ===================================================================== */
body.jk-header-degrade .header-builder-frontend .header-builder-inner,
body.jk-header-degrade .header-builder-frontend .header-main-wrapper{
	background:var(--jk-deg-header) !important;
}
body.jk-header-degrade .header-builder-frontend .header-main-wrapper > .elementor > .elementor-element,
body.jk-header-degrade .header-builder-frontend .header-main-wrapper > .elementor > .elementor-element > .elementor-container,
body.jk-header-degrade .header-builder-frontend .header-main-wrapper .e-con.e-parent{
	background:transparent !important;
	background-color:transparent !important;
}
/* header sticky (une fois fixé) : même dégradé, légère ombre bleue */
body.jk-header-degrade .gv-sticky-wrapper.is-fixed > .gv-sticky-menu,
body.jk-header-degrade .gv-sticky-menu.stuck{
	background:var(--jk-deg-header) !important;
	box-shadow:0 10px 30px -18px rgba(31,115,168,.9) !important;
}
/* textes du header en blanc */
body.jk-header-degrade .header-builder-frontend ul.gva-nav-menu > li > a,
body.jk-header-degrade .header-builder-frontend ul.gva-nav-menu > li > a .caret,
body.jk-header-degrade .header-builder-frontend .elementor-widget-heading .elementor-heading-title,
body.jk-header-degrade .header-builder-frontend .elementor-icon-list-text,
body.jk-header-degrade .header-builder-frontend .elementor-icon-list-icon i,
body.jk-header-degrade .header-builder-frontend .main-search .control-search .icon,
body.jk-header-degrade .header-builder-frontend .gsc-contact-info .content a,
body.jk-header-degrade .header-builder-frontend .gsc-contact-info .content,
body.jk-header-degrade .header-builder-frontend .gsc-contact-info .icon{
	color:#fff !important;
}
body.jk-header-degrade .header-builder-frontend ul.gva-nav-menu > li > a:hover,
body.jk-header-degrade .header-builder-frontend ul.gva-nav-menu > li.current-menu-item > a,
body.jk-header-degrade .header-builder-frontend ul.gva-nav-menu > li.current-menu-ancestor > a{
	color:#9ED6F5 !important;
}
body.jk-header-degrade .header-builder-frontend ul.gva-nav-menu > li > a:before,
body.jk-header-degrade .header-builder-frontend ul.gva-nav-menu > li > a:after{
	background:#9ED6F5 !important;
}
/* sous-menus : restent blancs et lisibles */
body.jk-header-degrade .header-builder-frontend ul.gva-nav-menu > li .submenu-inner{
	background:#fff !important;
}
/* icône téléphone ronde du header (gsc-contact-info / icon-box) sur fond dégradé */
body.jk-header-degrade .header-builder-frontend .gsc-contact-info .icon,
body.jk-header-degrade .header-builder-frontend .gsc-icon-box .icon{
	background:rgba(255,255,255,.12) !important;
	border-color:rgba(255,255,255,.25) !important;
}

/* =====================================================================
   2 · HEADER MOBILE — barre logo + burger en dégradé
   ===================================================================== */
html body .header-mobile,
html body .header-mobile.header_mobile_screen{
	background:var(--jk-deg-header) !important;
	box-shadow:0 8px 24px -14px rgba(31,115,168,.9) !important;
}
html body .header-mobile .header-mobile-content .header-content-inner .header-right .canvas-mobile .dropdown-toggle .icon{
	color:#fff !important;
	border-color:rgba(255,255,255,.45) !important;
	background:rgba(255,255,255,.08);
}
html body .header-mobile .header-mobile-content .header-content-inner .header-right .main-search .control-search .icon{
	color:#fff !important;
}
/* logo mobile : le logo blanc fourni dans Apparence → Modins → Header logo */
html body .header-mobile .header-mobile-content .header-content-inner .header-left .logo-mobile{ max-width:150px; }

/* =====================================================================
   3 · MENU MOBILE (off-canvas) — fond dégradé, textes blancs, boutons
   ===================================================================== */
html body .gva-offcanvas-content.mobile{
	background:var(--jk-deg-menu) !important;
	color:#fff;
	display:flex;
	flex-direction:column;
}
html body .gva-offcanvas-content.mobile .wp-sidebar.sidebar{
	flex:1 1 auto;
	display:flex;
	flex-direction:column;
	overflow-y:auto;
	-webkit-overflow-scrolling:touch;
}
html body .gva-offcanvas-content.mobile .top-canvas{
	background:rgba(0,0,0,.25) !important;
	border-bottom:1px solid rgba(255,255,255,.14);
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:10px 12px 10px 20px;
	line-height:1;
}
html body .gva-offcanvas-content.mobile .top-canvas .logo-mm{ float:none; padding:0; }
html body .gva-offcanvas-content.mobile .top-canvas .logo-mm img{ max-height:40px; max-width:150px; width:auto; }
html body .gva-offcanvas-content.mobile .top-canvas .control-close-mm{
	float:none;
	width:40px;
	height:40px;
	line-height:40px;
	border-radius:50%;
	background:rgba(255,255,255,.12) !important;
	border:1px solid rgba(255,255,255,.3);
	color:#fff;
	font-size:18px;
}
html body .gva-offcanvas-content.mobile .top-canvas .control-close-mm:hover{ background:#fff !important; color:var(--jk-noir); }
html body .gva-offcanvas-content.mobile .top-canvas:before,
html body .gva-offcanvas-content.mobile .top-canvas:after{ display:none; }
html body .gva-offcanvas-content.mobile .top-canvas .control-close-mm,
html body .gva-offcanvas-content.mobile a{ color:#fff; }
html body .gva-offcanvas-content.mobile .top-canvas .control-close-mm:hover,
html body .gva-offcanvas-content.mobile a:hover{ color:#9ED6F5; }
html body .gva-offcanvas-content.mobile #gva-mobile-menu ul.gva-mobile-menu > li{
	border-bottom:1px solid rgba(255,255,255,.12);
}
html body .gva-offcanvas-content.mobile #gva-mobile-menu ul.gva-mobile-menu > li a{
	color:#fff;
	font-weight:700;
}
html body .gva-offcanvas-content.mobile #gva-mobile-menu ul.gva-mobile-menu > li a:hover,
html body .gva-offcanvas-content.mobile #gva-mobile-menu ul.gva-mobile-menu > li.current-menu-item > a{
	color:#9ED6F5;
}
html body .gva-offcanvas-content.mobile #gva-mobile-menu ul.gva-mobile-menu > li .submenu-inner li a{
	color:rgba(255,255,255,.85);
	font-weight:500;
}
/* flèches +/− des sous-menus : images sombres du thème remplacées par un chevron blanc */
html body .gva-offcanvas-content.mobile #gva-mobile-menu ul.gva-mobile-menu > li.menu-item-has-children .caret,
html body .gva-offcanvas-content.mobile #gva-mobile-menu ul.gva-mobile-menu > li.menu-item-has-children.menu-active .caret{
	background:none !important;
	color:#fff;
}
html body .gva-offcanvas-content.mobile #gva-mobile-menu ul.gva-mobile-menu > li.menu-item-has-children .caret:after{
	display:block !important;
	content:"";
	position:absolute;
	right:8px;
	top:50%;
	width:9px;
	height:9px;
	margin-top:-7px;
	border-right:2px solid #fff;
	border-bottom:2px solid #fff;
	transform:rotate(45deg);
	transition:transform .25s;
}
html body .gva-offcanvas-content.mobile #gva-mobile-menu ul.gva-mobile-menu > li.menu-item-has-children.menu-active .caret:after{
	transform:rotate(-135deg);
	margin-top:-3px;
}
/* widgets éventuels de la zone off-canvas */
html body .gva-offcanvas-content.mobile .wp-sidebar .widget,
html body .gva-offcanvas-content.mobile .wp-sidebar .widget .widget-title{ color:#fff; border-color:rgba(255,255,255,.14); }

/* --- boutons Téléphone + Contactez-nous --- */
html body .gva-offcanvas-content.mobile .jk-mm-actions{
	margin-top:auto;
	padding:22px 0 10px;
	border-top:1px solid rgba(255,255,255,.14);
	display:flex;
	flex-direction:column;
	gap:10px;
}
html body .gva-offcanvas-content.mobile .jk-mm-btn{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	min-height:52px;
	padding:14px 18px;
	border-radius:8px;
	font-size:16px;
	font-weight:800;
	line-height:1.2;
	text-decoration:none;
	color:#fff !important;
	transition:transform .25s,box-shadow .25s,background-color .25s;
}
html body .gva-offcanvas-content.mobile .jk-mm-btn .jk-mm-ico{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:28px;
	height:28px;
	border-radius:50%;
	background:rgba(255,255,255,.18);
	font-size:13px;
}
html body .gva-offcanvas-content.mobile .jk-mm-btn--tel{
	background:#fff;
	color:var(--jk-noir) !important;
	box-shadow:0 14px 30px -16px rgba(0,0,0,.6);
}
html body .gva-offcanvas-content.mobile .jk-mm-btn--tel .jk-mm-ico{ background:var(--jk-accent-f); color:#fff; }
html body .gva-offcanvas-content.mobile .jk-mm-btn--tel:hover{ background:#E3F4FD; color:var(--jk-noir) !important; }
html body .gva-offcanvas-content.mobile .jk-mm-btn--contact{
	background:var(--jk-accent-f);
	border:1px solid rgba(255,255,255,.3);
	box-shadow:0 14px 30px -16px rgba(31,115,168,.9);
}
html body .gva-offcanvas-content.mobile .jk-mm-btn--contact:hover{ background:var(--jk-accent-h); }
html body .gva-offcanvas-content.mobile .jk-mm-btn:active{ transform:scale(.98); }
html body .gva-offcanvas-content.mobile .jk-mm-note{
	margin:6px 0 0;
	font-size:12px;
	line-height:1.5;
	text-align:center;
	color:rgba(255,255,255,.75);
}
/* voile derrière le menu */
html body.open-off-canvas:after{ background:rgba(8,8,8,.6) !important; }
