/*
Theme Name: HTI (Health & Tech clone)
Template: twentytwentyfive
Description: Child theme applying healthandtech.eu design tokens (colors, typography, buttons).
Version: 1.0
*/

:root {
	--hti-primary: #044362;
	--hti-accent: #ff5c31;
	--hti-neutral: #a2a2a2;
}

body {
	font-family: "Open Sans", sans-serif;
}

a {
	color: var(--hti-primary);
}

/* Same issue on every plain content page using the parent theme's generic
   page.html (no custom template of ours overrides its background): Nos
   offres, Nos missions, Nos clients. */
.page-id-131919,
.page-id-131919 .wp-block-group,
.page-id-131918,
.page-id-131918 .wp-block-group,
.page-id-131920,
.page-id-131920 .wp-block-group,
.page-id-131917,
.page-id-131917 .wp-block-group,
.page-id-131921,
.page-id-131921 .wp-block-group,
.single-agenda,
.single-agenda .wp-block-group {
	background-color: #ffffff;
	color: #323232;
}

a:hover {
	color: var(--hti-accent);
}

/* No rounded corners anywhere — matches original site's square, flat aesthetic. */
* {
	border-radius: 0 !important;
}

.l-header .nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.nav__actions {
	display: flex;
	align-items: center;
	gap: 14px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.l-header__icon-link {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #ffffff;
}

.l-header__icon-link:hover {
	color: var(--hti-accent);
}

.l-header__login {
	white-space: nowrap;
}

.hti-header-account {
	display: flex;
	align-items: center;
}

/* Global `* { border-radius: 0 !important }` reset above would otherwise
   flatten this — the round shape is the point here, so it needs its own
   !important to win. */
.hti-header-avatar {
	border-radius: 50% !important;
	border: 2px solid var(--hti-accent);
	width: 32px;
	height: 32px;
	display: block;
}

.wp-block-button__link,
.wp-element-button,
button,
input[type="submit"] {
	background-color: var(--hti-accent);
	color: #ffffff;
	padding: 0.5em 1.2em;
	border: none;
	font-weight: 600;
	font-size: 13px;
}

.wp-block-button__link:hover,
.wp-element-button:hover,
button:hover {
	background-color: #d94e2a;
}

.wp-block-post-title,
h1, h2, h3 {
	color: var(--hti-primary);
	font-weight: 600;
}

.wp-site-blocks header,
.wp-block-template-part.header {
	background-color: var(--hti-primary);
	color: #ffffff;
}

.hti-chapeau {
	font-style: italic;
	color: var(--hti-neutral);
	font-size: 1.1em;
	margin-bottom: 1.5em;
}

/* Titraille for headings typed into article body content (classic editor's
   Format > Titre 2/3/4...) — .card__txt only had paragraph styling, so
   these rendered as unstyled browser defaults with no relation to the
   design system. */
.card__txt h2,
.card__txt h3,
.card__txt h4,
.card__txt h5,
.card__txt h6 {
	color: var(--hti-primary);
	text-align: left;
	line-height: 1.3;
}

.card__txt h2 {
	font-size: 22px;
	font-weight: 700;
	margin: 1.4em 0 0.6em;
}

.card__txt h3 {
	font-size: 18px;
	font-weight: 700;
	margin: 1.3em 0 0.5em;
}

.card__txt h4 {
	font-size: 15px;
	font-weight: 600;
	margin: 1.2em 0 0.4em;
}

.card__txt h5,
.card__txt h6 {
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	margin: 1.1em 0 0.4em;
}

.card__txt h2:first-child,
.card__txt h3:first-child,
.card__txt h4:first-child {
	margin-top: 0;
}

/* Fix: WP core/post-template wraps each card in an extra <li>, which breaks
   the original theme's float-based .myrow grid (the float needs to be on the
   row's direct child). Flexbox row, top-aligned. */
.wp-block-post-template.myrow {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: stretch !important;
}

.wp-block-post-template.myrow > li {
	display: block !important;
	box-sizing: border-box !important;
	width: 33.3333% !important;
	padding: 0 20px !important;
	margin: 0 0 40px !important;
	float: none !important;
}


@media (max-width: 991px) {
	.wp-block-post-template.myrow > li {
		width: 50% !important;
	}
}

@media (max-width: 600px) {
	.wp-block-post-template.myrow > li {
		width: 100% !important;
	}
}

/* Section system: alternating white / blue backgrounds, each with an optional
   vertical title running along the left edge — matches healthandtech.eu. */
.hti-section {
	position: relative;
	padding: 60px 24px;
}

.hti-section--white {
	background: #ffffff;
}

.hti-section--tint {
	background: #eef4f7;
}

.hti-section--blue {
	background: var(--hti-primary);
}

.hti-section--blue h1,
.hti-section--blue h2,
.hti-section--blue h3,
.hti-section--blue p,
.hti-section--blue .hti-vertical-title {
	color: #ffffff;
}

.hti-vertical-title {
	position: absolute;
	left: max(20px, calc(50% - 480px - 50px));
	top: 40px;
	transform: rotate(180deg);
	writing-mode: vertical-rl;
	font-size: 1.4em;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--hti-accent);
	white-space: nowrap;
}

/* The calc() above assumes a wide desktop layout (content column centered
   with room to spare on the left) — on narrow screens it bottoms out at its
   20px floor, landing right on top of the section text. Purely decorative,
   so it's simplest to just hide it once there's no room for it. */
@media screen and (max-width: 900px) {
	.hti-vertical-title {
		display: none;
	}
}

.hti-banner {
	margin: 0 auto 20px;
}

.hti-hero {
	background: linear-gradient(135deg, var(--hti-primary) 0%, #06618c 100%);
	padding: 60px 24px;
	margin-bottom: 0;
}

.hti-hero--v2 {
	position: relative;
	padding: 10px 40px 40px;
	overflow: hidden;
}

.hti-hero--v2::before {
	content: "";
	position: absolute;
	top: -120px;
	right: -120px;
	width: 420px;
	height: 420px;
	background: radial-gradient(circle, rgba(255,92,49,0.35) 0%, rgba(255,92,49,0) 70%);
	pointer-events: none;
}

.hti-hero__kicker {
	color: var(--hti-accent);
	font-weight: 700;
	letter-spacing: 0.08em;
	font-size: 0.8em;
	margin-bottom: 0.8em;
}

.hti-hero__title {
	color: #ffffff;
	font-size: 2.6em;
	line-height: 1.15;
	margin-bottom: 0.4em;
}

.hti-hero__subtitle {
	color: #e6eef3;
	font-size: 1.1em;
	max-width: 480px;
	margin-bottom: 1.5em;
}

.hti-hero__cta,
.wp-block-button.is-style-fill .wp-block-button__link,
.wp-block-button__link {
	font-size: 15px;
	padding: 0.8em 1.8em;
}

.wp-block-button.is-style-outline .wp-block-button__link {
	border: 2px solid var(--hti-primary);
	color: var(--hti-primary);
	background: transparent;
	padding: 0.75em 1.75em;
}

.hti-section--blue .wp-block-button.is-style-outline .wp-block-button__link {
	border-color: #ffffff;
	color: #ffffff;
}

.hti-hero__stats {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.hti-stat {
	background: rgba(255,255,255,0.08);
	border: 1px solid rgba(255,255,255,0.18);
	padding: 18px 24px;
}

.hti-stat__number {
	color: #ffffff;
	font-size: 1.8em;
	font-weight: 700;
	margin: 0 0 2px;
}

.hti-stat__label {
	color: #cfe1ec;
	margin: 0;
	font-size: 0.9em;
}

.hti-section-title {
	display: block;
	width: 100%;
	max-width: var(--wp--style--global--content-size, 960px);
	margin: 0 auto 30px;
	box-sizing: border-box;
	border-bottom: 2px solid var(--hti-accent);
	padding-bottom: 10px;
}

.hti-section-title--center {
	text-align: center;
	border-bottom: none;
	font-size: 2em;
}

.hti-section-more {
	text-align: center;
	margin: 20px 0 0;
}

.general-article--org .general-article__title {
	margin: 0;
}

.general-article,
.general-article * {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	box-sizing: border-box !important;
}

.general-article {
	background: #ffffff !important;
	box-shadow: 0 1px 6px rgba(4,67,98,0.1) !important;
	padding: 16px !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	display: block !important;
	position: static !important;
}

.general-article:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 24px rgba(4,67,98,0.15) !important;
}

.general-article > * {
	display: block !important;
	margin-bottom: 10px !important;
}

.general-article__figure--contain {
	height: 200px !important;
	overflow: hidden !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: #ffffff !important;
}

.general-article__figure--contain a {
	display: flex !important;
	width: 100% !important;
	height: 100% !important;
	align-items: center !important;
	justify-content: center !important;
}

.general-article__figure img,
.general-article__figure-placeholder {
	width: 100%;
	height: 160px;
	object-fit: cover;
	display: block !important;
}

.general-article__figure-placeholder {
	background: var(--hti-primary) url('/wp-content/uploads/home-assets/oeil.svg') no-repeat center / 40px;
}

.general-article__figure--contain img {
	object-fit: contain !important;
	width: 100% !important;
	height: 200px !important;
	background: #ffffff;
	display: block !important;
}

.hti-intel-featured__image img {
	object-fit: contain !important;
	width: 100% !important;
	height: 320px !important;
	background: #ffffff;
	display: block !important;
}

.hti-org-logo {
	width: 100%;
	margin-bottom: 10px;
}

.hti-org-logo:not(:has(img)) {
	height: 100px;
	background: #eef4f7 url('/wp-content/uploads/home-assets/org-placeholder.svg') no-repeat center / 36px;
}

.hti-org-logo img {
	width: 100% !important;
	height: 100px !important;
	background: #ffffff;
	object-fit: contain !important;
	display: block !important;
	margin: 0 auto;
}

.hti-value__item {
	position: relative;
	padding-left: 28px;
	font-weight: 600;
	color: var(--hti-primary);
	text-align: left;
}

.hti-section--blue .hti-value__item {
	color: #ffffff;
}

.hti-value__item::before {
	content: "✓";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--hti-accent);
	font-weight: 700;
}

.hti-offer-card {
	padding: 32px;
}

.hti-offer-card--free {
	background: #ffffff;
	border: 1px solid #dde8ec;
}

.hti-offer-card--paid {
	background: var(--hti-primary);
	color: #ffffff;
}

.hti-offer-card--paid h3,
.hti-offer-card--paid li {
	color: #ffffff;
}

.hti-cta-final {
	background: var(--hti-accent);
	color: #ffffff;
	text-align: center;
	padding: 60px 24px;
}

.hti-cta-final h2,
.hti-cta-final p {
	color: #ffffff;
	text-align: center;
}

.hti-cta-final .wp-block-buttons {
	justify-content: center;
}

.hti-cta-final .wp-block-button__link {
	background: #ffffff;
	color: var(--hti-accent);
}

.raisons > .wp-block-heading {
	margin-top: 0;
}

.hti-section:has(> .raisons) {
	padding-top: 20px;
}

.raisons .wp-block-column,
.raisons .raison {
	background-color: #ffffff;
	padding: 24px;
}

.hti-data-zone {
	max-width: 600px;
	margin: 20px auto 0;
	padding: 30px;
	border: 2px solid var(--hti-accent);
	background: #fbf5f3;
}

.hti-data-title {
	color: var(--hti-accent);
	font-weight: 800;
	font-size: 1.6em;
	text-decoration: underline;
	text-decoration-color: var(--hti-accent);
	margin: 0 0 20px;
	text-align: right;
}

.hti-data-boxes {
	margin: 0 auto;
	max-width: 600px;
	display: flex;
	flex-direction: column;
	gap: 36px;
}

.hti-data-box {
	display: flex;
	align-items: center;
	gap: 28px;
}

.hti-data-box--blue {
	flex-direction: row-reverse;
}

.hti-data-box__label {
	font-weight: 700;
	color: var(--hti-primary);
	font-size: 1.05em;
	margin: 0 0 8px;
}

.hti-data-box__body {
	text-align: left;
}

.hti-data-box__text {
	font-size: 1.05em;
}

.hti-stat-circle {
	position: relative;
	width: 130px;
	height: 140px;
	flex: 0 0 auto;
}

.hti-stat-circle img {
	width: 100%;
	height: 100%;
	display: block;
}

.hti-stat-circle__number {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.9em;
	font-weight: 800;
	margin: 0;
}

.hti-data-box--orange .hti-stat-circle__number {
	color: var(--hti-accent);
}

.hti-data-box--blue .hti-stat-circle__number {
	color: var(--hti-primary);
}

.hti-stat-circle__number {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.7em;
	font-weight: 800;
	margin: 0;
}

.hti-data-box--blue .hti-stat-circle__number {
	color: var(--hti-primary);
}

.hti-data-box--orange .hti-stat-circle__number {
	color: var(--hti-accent);
}

.hti-data-box__text {
	color: var(--hti-primary);
	font-size: 0.9em;
	margin: 0;
}

.hti-section--blue .raisons .wp-block-column,
.hti-section--blue .raisons .raison {
	background-color: rgba(255,255,255,0.06);
}

.hti-section--blue .raison__title,
.hti-section--blue .raison__text {
	color: #ffffff;
}

/* "Intelligence stratégique" split layout: list + featured item. */
.hti-intel-list .wp-block-post-template {
	list-style: none;
	padding: 0;
	margin: 0;
}

.hti-intel-list li {
	border-bottom: 1px solid #dde5ea;
	padding: 18px 0;
}

.hti-intel-list li:first-child {
	padding-top: 0;
}

.hti-intel-date {
	color: var(--hti-neutral);
	font-size: 0.8em;
	font-weight: 700;
	margin: 0 0 4px;
}

.hti-intel-tag a {
	color: var(--hti-accent) !important;
	font-weight: 700;
	font-size: 0.8em;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.hti-intel-list .wp-block-post-title {
	font-size: 1.1em;
	margin: 4px 0 6px;
}

.hti-intel-list .wp-block-post-excerpt {
	color: #4a5a63;
	font-size: 0.9em;
}

.hti-intel-featured {
	background: #ffffff;
	border: 1px solid #dde5ea;
	padding: 0;
}

.hti-intel-featured__image,
.hti-intel-featured .wp-block-post-featured-image img {
	width: 100%;
	height: 320px;
	object-fit: cover;
	display: block;
}

.hti-intel-featured__image {
	background: var(--hti-primary) url('/wp-content/uploads/home-assets/oeil.svg') no-repeat center / 60px;
}

.hti-intel-featured__body {
	padding: 24px;
}

.hti-intel-featured .wp-block-post-title {
	font-size: 1.5em;
	margin: 0 0 10px;
}

/* "Contenu associé" sidebar table (mercato -> personne/organisation fiches):
   thumbnail / name / "Lire" CTA row. */
.hti-related {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.hti-related__item {
	display: grid;
	grid-template-columns: 44px 1fr auto;
	align-items: center;
	gap: 12px;
	background: #ffffff;
	border-radius: 10px;
	padding: 8px 10px;
	box-shadow: 0 1px 6px rgba(4, 67, 98, 0.12);
}

/* "Lire aussi" variant: Titre / Type / Lire — no photo/logo thumbnail. */
.hti-related__item--article {
	grid-template-columns: 2fr 1fr auto;
}

.hti-related__item--article .hti-related__name {
	font-size: 0.85em;
	line-height: 1.3;
	white-space: normal;
}

.hti-related__type {
	overflow: hidden;
}

.hti-related__thumb {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--hti-primary, #044362);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.hti-related__thumb--org {
	border-radius: 8px;
	background: #ffffff;
	border: 1px solid #e5e9ec;
}

.hti-related__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.hti-related__thumb--org img {
	object-fit: contain;
	padding: 5px;
}

.hti-related__thumb-initial {
	color: #ffffff;
	font-weight: 700;
	font-size: 1.05em;
}

.hti-related__name {
	font-weight: 600;
	color: #044362;
	font-size: 0.9em;
	line-height: 1.25;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.hti-related__cta {
	background: #ff5c31;
	color: #ffffff !important;
	font-size: 0.78em;
	font-weight: 600;
	padding: 6px 14px;
	border-radius: 20px;
	text-decoration: none !important;
	white-space: nowrap;
	transition: opacity 0.15s ease;
}

.hti-related__cta:hover {
	opacity: 0.85;
}

.hti-related__empty {
	text-align: center;
	color: #7a8a94;
	font-size: 0.9em;
}

/* "Mon compte" front-end account page. */
.hti-account {
	max-width: 560px;
	margin: 0 auto;
	padding: 40px 20px;
}
.hti-account__notice {
	padding: 12px 16px;
	border-radius: 8px;
	margin-bottom: 20px;
}
.hti-account__notice--success {
	background: #e6f4ea;
	color: #1a7f37;
}
.hti-account__notice--error {
	background: #fde8e8;
	color: #d63638;
}
.hti-account__avatar-row {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 20px;
}
.hti-account__avatar {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	object-fit: cover;
}
.hti-account__row {
	margin-bottom: 16px;
}
.hti-account__row label {
	display: block;
	font-weight: 600;
	margin-bottom: 4px;
}
.hti-account__row input[type=text],
.hti-account__row input[type=email],
.hti-account__row input[type=password] {
	width: 100%;
	padding: 8px 10px;
	border: 1px solid #dcdcde;
	border-radius: 6px;
	box-sizing: border-box;
}
.hti-account__row input:disabled {
	background: #f6f7f7;
	color: #7a8a94;
}
.hti-account__row-pair {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
.hti-account__hint {
	font-size: 12px;
	color: #7a8a94;
	margin: 4px 0 0;
}

/* .l-header__logo is position:absolute (left:3.4375em + width:7.1875em on
   desktop), but the header's wrapper-fluid also carries the original site's
   .no-pad class (padding:0 !important), which was silently overriding any
   padding-left fix here — has to fight !important with !important to win.
   Matches the breakpoints where .l-header__logo's own left/width change.
   Below 1230px the mobile nav panel is position:fixed (ignores this padding
   entirely), so no override needed. */
.l-header .wrapper-fluid {
	padding-left: 12em !important;
}
@media screen and (max-width: 1400px) {
	.l-header .wrapper-fluid {
		padding-left: 9.5em !important;
	}
}

/* Close button inside the mobile off-canvas panel — same base look as the
   original site's icon version, simplified to a plain glyph. */
.nav-container .nav__close {
	color: #ffffff;
	font-size: 28px;
	line-height: 1;
}

/* Single agenda event page (single-agenda.html + hti_agenda_detail_html()). */
.hti-agenda-detail {
	max-width: 900px;
	margin: 40px auto;
	padding: 0 20px;
}
.hti-agenda-detail__title {
	text-decoration: underline;
	margin-bottom: 8px;
}
.hti-agenda-detail__org {
	font-weight: 400;
	font-size: 1.2em;
	color: #444;
	margin-top: 0;
	margin-bottom: 16px;
}
.hti-agenda-badge {
	display: inline-block;
	padding: 4px 14px;
	border-radius: 4px;
	font-weight: 700;
	font-size: 0.85em;
	letter-spacing: 0.05em;
	color: #fff;
	margin-bottom: 20px;
}
.hti-agenda-badge--payant {
	background: #d9534f;
}
.hti-agenda-badge--gratuit {
	background: #4caf50;
}
.hti-agenda-detail__rule {
	border: none;
	border-top: 1px solid #ddd;
	margin: 24px 0;
}
.hti-agenda-detail__content {
	line-height: 1.6;
}
.hti-agenda-detail__cta p {
	margin-bottom: 12px;
}
.hti-agenda-detail__button {
	display: inline-block;
	padding: 12px 28px;
	background: #003057;
	color: #fff;
	text-decoration: none;
	border-radius: 4px;
	font-weight: 600;
}
.hti-agenda-detail__button:hover {
	background: #00509e;
}
.hti-agenda-detail__meta {
	margin: 10px 0;
	font-size: 1.05em;
}

/* page-agenda Query Loop card: events organised by Care Insight get a plain
   orange frame (render_block_core/group filter in admin-agenda.php). */
.hti-agenda-care-insight {
	border: 2px solid var(--hti-accent) !important;
}

/* Harmonize card heights: .wp-block-post-template.myrow above already
   stretches its <li>s to the row's tallest; flex column fills the card into
   it and pins the action buttons to the bottom regardless of text length. */
.hti-agenda-card {
	height: 100% !important;
	display: flex !important;
	flex-direction: column !important;
}
.hti-agenda-card-actions {
	display: flex !important;
	gap: 10px !important;
	flex-wrap: wrap !important;
}
.hti-agenda-card-btn {
	display: inline-block !important;
	padding: 8px 16px !important;
	border-radius: 4px !important;
	font-weight: 600 !important;
	font-size: 0.85em !important;
	text-decoration: none !important;
	text-align: center;
}
.hti-agenda-card-btn--info {
	background: #f0f4f7 !important;
	color: var(--hti-primary) !important;
}
.hti-agenda-card-btn--info:hover {
	background: #e2ebf0 !important;
}
.hti-agenda-card-btn--inscription {
	background: var(--hti-primary) !important;
	color: #fff !important;
}
.hti-agenda-card-btn--inscription:hover {
	background: #03354d !important;
}

/* page-agenda filter bar (hti_agenda_filter_bar_html() in admin-agenda.php). */
.hti-agenda-filter-bar {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin-bottom: 30px;
}
.hti-agenda-filter-field {
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.hti-agenda-filter-field label {
	font-weight: 600;
	font-size: 0.85em;
	color: var(--hti-primary);
}
.hti-agenda-filter-field select {
	padding: 8px 12px;
	border: 1px solid #ccc;
	border-radius: 4px;
	min-width: 200px;
}

/* Pays/ville/langue line injected into each page-agenda card. margin-top:auto
   pins it (and the action buttons right after it in the flex column) to the
   bottom, regardless of the excerpt's length above it. */
.hti-agenda-card-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	font-size: 0.85em;
	color: #555;
	margin-top: auto !important;
	margin-bottom: 10px !important;
}
.hti-agenda-card-meta__item {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.hti-agenda-card-meta__item + .hti-agenda-card-meta__item::before {
	content: "·";
	margin-right: 14px;
	color: #aaa;
}
.hti-agenda-card-meta__item--payant {
	font-weight: 700 !important;
	color: var(--hti-accent) !important;
}
.hti-agenda-card-meta__flag {
	font-size: 1.1em;
}