/*
Theme Name: TMS Cargo Express
Theme URI: https://tms.megasave.org
Author: TMS CARGO EXPRESS
Description: Thème sur mesure de TMS CARGO EXPRESS (TRANSPORT MARITIME & SOLUTIONS) — transport et logistique entre la Chine et l'Afrique de l'Ouest. En-tête fixe, navigation mobile, pied de page administrable et intégration complète du module de suivi de colis.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.9
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tms-cargo-theme
*/

/* ---------------------------------------------------------------- réinitialisation */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
	margin: 0;
	font-family: var(--tms-font, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
	font-size: 17px;
	line-height: 1.65;
	color: var(--tms-text, #1B2430);
	background: var(--tms-bg, #F4F7FB);
	-webkit-font-smoothing: antialiased;
}

img, svg, video { max-width: 100%; height: auto; }
h1, h2, h3, h4 { font-weight: 800; letter-spacing: -.01em; }
a { color: var(--tms-blue, #1264D8); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
	outline: 3px solid var(--tms-blue, #1264D8);
	outline-offset: 2px;
}

.tms-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--tms-navy, #0A2A63);
	color: #fff;
	padding: 12px 20px;
	z-index: 200;
	border-radius: 0 0 8px 0;
}
.tms-skip:focus { left: 0; }

/* ---------------------------------------------------------------- en-tête */
.tms-header {
	position: sticky;
	top: var(--tms-bandeau-hauteur, 40px);
	z-index: 130;
	background: #FFF8F6;
	border-bottom: 1px solid rgba(226, 232, 242, .75);
	transition: box-shadow .2s ease;
}
.tms-header.is-scrolled { box-shadow: 0 6px 24px -14px rgba(10, 42, 99, .45); }

.tms-header-inner {
	display: flex;
	align-items: center;
	gap: 28px;
	min-height: 72px;
	padding-top: 8px;
	padding-bottom: 8px;
}

.tms-logo {
	display: flex;
	align-items: center;
	gap: 14px;
	flex: none;
	text-decoration: none;
	color: #111827;
}
.tms-logo img { display: block; height: 58px; width: auto; }
.tms-logo-embleme {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 12px;
	background: var(--tms-navy, #0A2A63);
	color: #fff;
	font-weight: 900;
}
.tms-logo-texte {
	display: inline-block;
	font-weight: 900;
	color: var(--tms-green-700, #08763A);
	font-size: clamp(1.05rem, .94rem + .35vw, 1.45rem);
	line-height: 1.05;
	letter-spacing: 0;
	white-space: nowrap;
}

.tms-nav { margin-left: auto; margin-right: auto; }
.tms-nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 18px; }
.tms-nav li { position: relative; }
.tms-nav a {
	display: block;
	padding: 8px 5px;
	border-radius: 8px;
	color: #4B5563;
	text-decoration: none;
	font-weight: 700;
	font-size: clamp(.92rem, .86rem + .18vw, 1.05rem);
	white-space: nowrap;
}
.tms-nav a:hover { color: #111827; background: transparent; }
.tms-nav .current-menu-item > a,
.tms-nav .current_page_item > a,
.tms-nav .current-menu-ancestor > a { color: var(--tms-green-700, #08763A); background: transparent; }

.tms-nav .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 250px;
	background: #fff;
	border: 1px solid var(--tms-border, #E2E8F2);
	border-radius: 12px;
	padding: 8px;
	display: block;
	flex-direction: column;
	align-items: stretch;
	box-shadow: 0 20px 44px -24px rgba(10, 42, 99, .55);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.tms-nav li:hover > .sub-menu,
.tms-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.tms-nav .sub-menu a { white-space: normal; font-weight: 500; }
.tms-nav .menu-item-has-children > a::after {
	content: "";
	display: inline-block;
	width: 6px; height: 6px;
	margin-left: 7px;
	vertical-align: 2px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
}

.tms-header-actions { display: flex; align-items: center; gap: 8px; flex: none; }
.tms-header-actions .tms-btn { min-height: 42px; padding: 9px 16px; font-size: .9rem; }
.tms-lien-connexion {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	color: #fff;
	background: #FF6817;
	border-radius: 10px;
	box-shadow: 0 10px 22px -13px rgba(255, 104, 23, .9);
	font-weight: 800;
	font-size: .98rem;
	text-decoration: none;
	padding: 12px 26px;
	white-space: nowrap;
}
.tms-lien-connexion:hover { color: #fff; background: #F05E0F; }

.tms-burger {
	display: none;
	width: 46px; height: 46px;
	border: 2px solid var(--tms-border, #E2E8F2);
	border-radius: 10px;
	background: #fff;
	cursor: pointer;
	padding: 0;
	position: relative;
	flex: none;
}
.tms-burger span, .tms-burger::before, .tms-burger::after {
	content: "";
	position: absolute;
	left: 50%;
	width: 20px; height: 2.5px;
	margin-left: -10px;
	background: var(--tms-navy, #0A2A63);
	border-radius: 2px;
	transition: transform .2s ease, opacity .2s ease;
}
.tms-burger::before { top: 14px; }
.tms-burger span { top: 21px; }
.tms-burger::after { top: 28px; }
.tms-burger[aria-expanded="true"]::before { transform: translateY(7px) rotate(45deg); }
.tms-burger[aria-expanded="true"] span { opacity: 0; }
.tms-burger[aria-expanded="true"]::after { transform: translateY(-7px) rotate(-45deg); }

/* ---------------------------------------------------------------- contenu */
.tms-main { min-height: 50vh; }
.tms-page { padding: 52px 0 64px; }
.tms-page-tete { background: linear-gradient(150deg, var(--tms-green-700, #08763A), var(--tms-navy-dark, #071E48)); color: #fff; padding: 52px 0; }
.tms-page-tete h1 { font-size: clamp(1.7rem, 1.2rem + 2vw, 2.6rem); margin: 0; color: #fff; line-height: 1.15; }
.tms-page-tete .tms-eyebrow { color: #7FB2F5; }
.tms-page-tete p { color: #C0D6F5; margin: 12px 0 0; max-width: 60ch; font-size: 1.05rem; }

.tms-contenu { max-width: 860px; }
.tms-contenu--large { max-width: none; }
.tms-contenu > *:first-child { margin-top: 0; }
.tms-contenu h2 { font-size: clamp(1.35rem, 1.1rem + 1vw, 1.85rem); color: var(--tms-green-700, #08763A); margin: 42px 0 14px; }
.tms-contenu h3 { font-size: 1.2rem; color: var(--tms-green-700, #08763A); margin: 30px 0 10px; }
.tms-contenu h4 { font-size: 1.05rem; color: var(--tms-green-700, #08763A); margin: 24px 0 8px; }
.tms-contenu p { margin: 0 0 16px; }
.tms-contenu ul, .tms-contenu ol { margin: 0 0 18px; padding-left: 22px; }
.tms-contenu li { margin-bottom: 7px; }
.tms-contenu table { width: 100%; border-collapse: collapse; margin: 0 0 22px; font-size: .95rem; }
.tms-contenu th, .tms-contenu td { padding: 11px 14px; border: 1px solid var(--tms-border, #E2E8F2); text-align: left; }
.tms-contenu th { background: var(--tms-bg, #F4F7FB); color: var(--tms-navy, #0A2A63); }
.tms-contenu blockquote {
	margin: 0 0 20px;
	padding: 16px 20px;
	background: #fff;
	border-left: 4px solid var(--tms-green, #10A64A);
	border-radius: 0 10px 10px 0;
}
.tms-contenu img { border-radius: 12px; }
.tms-contenu hr { border: none; border-top: 1px solid var(--tms-border, #E2E8F2); margin: 34px 0; }

.tms-colonnes-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 34px; align-items: start; }
.tms-colonnes-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; align-items: start; }
.tms-bloc-blanc { background: #fff; border: 1px solid var(--tms-border, #E2E8F2); border-radius: 14px; padding: 26px; }

/* ---------------------------------------------------------------- pied de page */
.tms-footer { background: var(--tms-navy-dark, #071E48); color: #B7CCEA; padding: 56px 0 0; margin-top: 0; }
.tms-footer-grille {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1fr 1.2fr;
	gap: 34px;
	padding-bottom: 40px;
}
.tms-footer h2 { font-size: .82rem; text-transform: uppercase; letter-spacing: .1em; color: #fff; margin: 0 0 16px; }
.tms-footer ul { list-style: none; margin: 0; padding: 0; }
.tms-footer li { margin-bottom: 9px; }
.tms-footer a { color: #B7CCEA; text-decoration: none; font-size: .94rem; }
.tms-footer a:hover { color: #fff; text-decoration: underline; }
.tms-footer p { font-size: .94rem; line-height: 1.65; }

.tms-footer-logo img { height: 60px; width: auto; margin-bottom: 14px; }
.tms-footer-slogan {
	display: inline-block;
	font-size: .74rem;
	letter-spacing: .18em;
	color: #7FB2F5;
	font-weight: 700;
	margin-bottom: 14px;
}
.tms-footer-wa {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	background: #1FA855;
	color: #fff !important;
	padding: 11px 18px;
	border-radius: 9px;
	font-weight: 700;
	text-decoration: none !important;
	margin-top: 6px;
}
.tms-footer-wa:hover { background: #16833F; }
.tms-footer-tel { color: #fff; font-weight: 700; font-size: 1.05rem; }

.tms-footer-social { display: flex; gap: 10px; margin-top: 16px; }
.tms-footer-social a {
	width: 38px; height: 38px;
	display: flex; align-items: center; justify-content: center;
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: 9px;
	font-size: .8rem;
	font-weight: 700;
}
.tms-footer-social a:hover { background: rgba(255, 255, 255, .12); text-decoration: none; }

.tms-footer-bas {
	border-top: 1px solid rgba(255, 255, 255, .14);
	padding: 20px 0 26px;
	display: flex;
	flex-wrap: wrap;
	gap: 12px 26px;
	align-items: center;
	justify-content: space-between;
	font-size: .86rem;
}
.tms-footer-legal { display: flex; flex-wrap: wrap; gap: 6px 18px; list-style: none; margin: 0; padding: 0; }
.tms-footer-legal a { font-size: .86rem; }

/* ---------------------------------------------------------------- WhatsApp flottant */
.tms-wa-flottant {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 90;
	width: 56px; height: 56px;
	border-radius: 50%;
	background: #1FA855;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 12px 30px -10px rgba(31, 168, 85, .8);
	text-decoration: none;
}
.tms-wa-flottant:hover { background: #16833F; }
.tms-wa-flottant .tms-wa-icon { width: 30px; height: 30px; }

/* ---------------------------------------------------------------- 404 et recherche */
.tms-404 { text-align: center; padding: 80px 0; }
.tms-404 h1 { font-size: clamp(3rem, 2rem + 6vw, 6rem); color: var(--tms-green-700, #08763A); margin: 0; line-height: 1; }
.tms-404 p { font-size: 1.1rem; color: var(--tms-muted, #5A6B80); max-width: 44ch; margin: 16px auto 28px; }

.tms-recherche-form { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 30px; }
.tms-recherche-form input[type="search"] {
	flex: 1 1 240px;
	min-height: 48px;
	padding: 12px 16px;
	border: 2px solid var(--tms-border, #E2E8F2);
	border-radius: 9px;
	font: inherit;
	background: #fff;
}
.tms-resultat-article { background: #fff; border: 1px solid var(--tms-border, #E2E8F2); border-radius: 12px; padding: 22px; margin-bottom: 16px; }
.tms-resultat-article h2 { margin: 0 0 8px; font-size: 1.2rem; }
.tms-resultat-article h2 a { text-decoration: none; color: var(--tms-green-700, #08763A); }

/* ---------------------------------------------------------------- responsive */
@media (max-width: 1180px) {
	.tms-nav a { padding: 10px 10px; font-size: .9rem; }
	.tms-header-inner { gap: 14px; }
}

@media (max-width: 1024px) {
	.tms-burger { display: block; margin-left: auto; }
	.tms-nav,
	.tms-header-actions {
		display: none;
	}
	.tms-header.is-ouvert .tms-nav,
	.tms-header.is-ouvert .tms-header-actions {
		display: block;
		width: 100%;
		order: 3;
	}
	.tms-header.is-ouvert .tms-header-inner { flex-wrap: wrap; padding-bottom: 20px; }
	.tms-header.is-ouvert .tms-nav { margin-left: 0; border-top: 1px solid var(--tms-border, #E2E8F2); padding-top: 12px; }
	.tms-header.is-ouvert .tms-nav ul { flex-direction: column; align-items: stretch; gap: 0; }
	.tms-header.is-ouvert .tms-nav a { padding: 13px 12px; font-size: 1rem; border-radius: 8px; }
	.tms-header.is-ouvert .tms-nav .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: none;
		border-left: 2px solid var(--tms-border, #E2E8F2);
		border-radius: 0;
		margin: 0 0 6px 14px;
		padding: 0 0 0 8px;
		min-width: 0;
	}
	.tms-header.is-ouvert .tms-nav .menu-item-has-children > a::after { float: right; margin-top: 8px; }
	.tms-header.is-ouvert .tms-header-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
	.tms-header.is-ouvert .tms-header-actions .tms-btn { flex: 1 1 100%; min-height: 48px; }
	.tms-footer-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tms-colonnes-2, .tms-colonnes-3 { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
	body { font-size: 16px; }
	.tms-logo img { height: 44px; }
	.tms-header-inner { min-height: 66px; }
	.tms-page { padding: 34px 0 44px; }
	.tms-page-tete { padding: 36px 0; }
	.tms-footer-grille { grid-template-columns: 1fr; gap: 26px; }
	.tms-footer-bas { flex-direction: column; align-items: flex-start; }
	.tms-wa-flottant { right: 14px; bottom: 14px; }
}

@media print {
	.tms-header, .tms-footer, .tms-wa-flottant, .tms-bandeau { display: none !important; }
}

/* Renfort visuel TMS vert + hero vidéo cargo */
.tms-hero-video-bg ~ .tms-hero-inner .tms-hero-visuel > img { display: none; }
.tms-hero-video-bg ~ .tms-hero-inner .tms-hero-suivi { margin-top: 0; }
.tms-section-tete h2,
.tms-carte h3,
.tms-etapes h3,
.tms-tarif-carte h3,
.tms-tarif-prix,
.tms-espace-entete h2,
.tms-espace-corps h3,
.tms-espace-corps h4,
.tms-bureau h3,
.tms-liste-bloc h2,
.tms-contenu h2,
.tms-contenu h3,
.tms-contenu h4,
.tms-resultat-article h2 a {
	color: var(--tms-green-700, #08763A) !important;
}
.tms-hero h1,
.tms-hero .tms-section-tete h2,
.tms-cta h2,
.tms-resultat h3,
.tms-page-tete h1,
.tms-footer h2 {
	color: #fff !important;
}