/* ================================================================
   Horse Care — Parcours Bien-être · hc-front.css v1.0.0
   Chargé uniquement sur l'endpoint parcours-bienetre
   ================================================================ */

/* ── Variables ────────────────────────────────────────────────── */
:root {
	--hc-green:       #009e26;
	--hc-green-dark:  #27500A;
	--hc-green-light: #EAF3DE;
	--hc-green-mid:   #C0DD97;
	--hc-amber:       #E9A817;
	--hc-amber-bg:    #FAEEDA;
	--hc-amber-text:  #854F0B;
	--hc-text:        #222222;
	--hc-text-sec:    #666666;
	--hc-text-ter:    #aaaaaa;
	--hc-border:      #e5e5e5;
	--hc-bg-sec:      #f8f8f8;
	--hc-radius:      8px;
	--hc-radius-sm:   5px;
}

/* ── Wrapper global ───────────────────────────────────────────── */
.hc-dashboard {
	max-width: 860px;
	font-family: inherit;
	color: var(--hc-text);
	font-size: 14px;
}

/* ── Salutation ───────────────────────────────────────────────── */
.hc-welcome {
	font-size: 18px;
	font-weight: 600;
	margin: 0 0 3px;
}
.hc-welcome-sub {
	font-size: 13px;
	color: var(--hc-text-sec);
	margin: 0 0 18px;
}

/* ── Carte générique ──────────────────────────────────────────── */
.hc-card {
	background: #fff;
	border: 1px solid var(--hc-border);
	border-radius: var(--hc-radius);
	padding: 16px 18px;
	margin-bottom: 14px;
}
.hc-card-title {
	font-size: 13px;
	font-weight: 600;
	margin: 0 0 14px;
}

/* ── Fiche cheval ─────────────────────────────────────────────── */
.hc-horse-card {
	display: flex;
	align-items: flex-start;
	gap: 18px;
}
.hc-horse-photo {
	width: 68px;
	height: 74px;
	background: var(--hc-green-light);
	border-radius: var(--hc-radius-sm);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	overflow: hidden;
}
.hc-horse-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.hc-horse-info { flex: 1; }
.hc-horse-name-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 4px;
}
.hc-horse-name {
	font-size: 16px;
	font-weight: 600;
}
.hc-modifier {
	font-size: 12px;
	color: var(--hc-green);
	text-decoration: none;
}
.hc-horse-meta {
	font-size: 12px;
	color: var(--hc-text-sec);
	margin: 0 0 3px;
}
.hc-badge-profil {
	display: inline-block;
	margin-top: 6px;
	font-size: 11px;
	padding: 3px 11px;
	border-radius: 999px;
	background: var(--hc-green-light);
	color: var(--hc-green-dark);
	border: 1px solid var(--hc-green-mid);
	font-weight: 600;
}

/* ── Grille 2 colonnes ────────────────────────────────────────── */
.hc-grid-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	margin-bottom: 14px;
}
@media (max-width: 680px) {
	.hc-grid-2 { grid-template-columns: 1fr; }
}

/* ── Progression ──────────────────────────────────────────────── */
.hc-prog-wrap {
	display: flex;
	align-items: center;
	gap: 16px;
}
.hc-circle { flex-shrink: 0; }
.hc-prog-rows { flex: 1; }
.hc-prog-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 12px;
	padding: 3px 0;
}
.hc-prog-row em {
	font-style: normal;
	color: var(--hc-text-sec);
}
.hc-statut-verrouille { opacity: .4; }
.hc-statut-en_cours   { opacity: 1; }
.hc-statut-complete   { opacity: 1; }

.hc-check {
	width: 18px; height: 18px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.hc-check-green {
	background: var(--hc-green);
}
.hc-check-green::after {
	content: '';
	display: block;
	width: 5px; height: 9px;
	border: 2px solid #fff;
	border-top: none;
	border-left: none;
	transform: rotate(45deg) translate(-1px, -1px);
}
.hc-check-orange {
	border: 2px solid var(--hc-amber);
}
.hc-lock { color: var(--hc-text-ter); }

/* ── Trimestre en cours ───────────────────────────────────────── */
.hc-trim-card { display: flex; flex-direction: column; }
.hc-trim-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 4px;
}
.hc-label-sm {
	font-size: 11px;
	color: var(--hc-text-sec);
	text-transform: uppercase;
	letter-spacing: .04em;
}
.hc-badge-encours {
	font-size: 10px;
	padding: 2px 9px;
	border-radius: 999px;
	background: var(--hc-amber-bg);
	color: var(--hc-amber-text);
	font-weight: 700;
}
.hc-trim-title {
	font-size: 15px;
	font-weight: 700;
	margin: 2px 0 4px;
	color: var(--hc-amber-text);
}
.hc-trim-desc {
	font-size: 12px;
	color: var(--hc-text-sec);
	line-height: 1.5;
	margin-bottom: 12px;
}
.hc-pbar-wrap { margin-bottom: 12px; }
.hc-pbar-labels {
	display: flex;
	justify-content: space-between;
	font-size: 11px;
	color: var(--hc-text-ter);
	margin-bottom: 4px;
}
.hc-pbar-bg {
	height: 5px;
	background: #eee;
	border-radius: 99px;
	overflow: hidden;
}
.hc-pbar-fill {
	height: 100%;
	background: var(--hc-green);
	border-radius: 99px;
	transition: width .6s ease;
}

/* ── Produits du pack ─────────────────────────────────────────── */
.hc-pack-label {
	font-size: 12px;
	font-weight: 600;
	margin: 0 0 8px;
}
.hc-produit-row {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	border: 1px solid var(--hc-border);
	border-radius: var(--hc-radius-sm);
	padding: 8px 10px;
	margin-bottom: 6px;
}
.hc-produit-img {
	width: 38px; height: 42px;
	background: var(--hc-green-light);
	border-radius: 4px;
	display: flex; align-items: center; justify-content: center;
	flex-shrink: 0; overflow: hidden;
}
.hc-produit-img img { width: 100%; height: 100%; object-fit: cover; }
.hc-produit-name { font-size: 12px; font-weight: 600; margin: 0; }
.hc-produit-sub  { font-size: 10px; color: var(--hc-text-ter); margin: 0; }
.hc-prix-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 10px 0 10px;
}
.hc-prix { font-size: 15px; font-weight: 700; }

/* ── Boutons ──────────────────────────────────────────────────── */
.hc-btn-primary {
	display: inline-block;
	background: var(--hc-green);
	color: #fff !important;
	padding: 10px 18px;
	border-radius: var(--hc-radius-sm);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none !important;
	border: none;
	cursor: pointer;
	transition: background .2s;
}
.hc-btn-primary:hover { background: var(--hc-green-dark); color: #fff !important; }
.hc-btn-block { display: block; text-align: center; }

.hc-btn-outline {
	display: inline-block;
	background: transparent;
	color: var(--hc-green-dark) !important;
	padding: 6px 14px;
	border-radius: var(--hc-radius-sm);
	border: 1px solid var(--hc-green-mid);
	font-size: 12px;
	text-decoration: none !important;
	margin-right: 8px;
	margin-top: 6px;
	transition: background .2s;
}
.hc-btn-outline:hover { background: var(--hc-green-light); }

/* ── Renfort ──────────────────────────────────────────────────── */
.hc-renfort-card {
	background: var(--hc-green-light);
	border-color: var(--hc-green-mid);
	display: flex;
	gap: 12px;
	align-items: flex-start;
}
.hc-renfort-icon { font-size: 20px; flex-shrink: 0; margin-top: 2px; }
.hc-renfort-title { font-size: 13px; font-weight: 600; color: var(--hc-green-dark); margin: 0 0 3px; }
.hc-renfort-desc  { font-size: 12px; color: #3B6D11; line-height: 1.5; margin: 0 0 8px; }
.hc-renfort-produits { display: flex; flex-wrap: wrap; gap: 8px; }

/* ── Prochain trimestre (verrouillé) ─────────────────────────── */
.hc-locked-card {
	background: var(--hc-bg-sec);
	border-color: var(--hc-border);
	display: flex;
	align-items: center;
	gap: 12px;
	opacity: .65;
}
.hc-lock-icon { color: var(--hc-text-ter); flex-shrink: 0; }
.hc-locked-title { font-size: 12px; font-weight: 600; margin: 0 0 2px; }
.hc-locked-sub   { font-size: 11px; color: var(--hc-text-ter); margin: 0; }

/* ── Pas encore de cheval ─────────────────────────────────────── */
.hc-no-horse {
	padding: 32px 20px 24px;
	border: 1px dashed var(--hc-border);
	border-radius: var(--hc-radius);
}
.hc-no-horse .hc-horse-icon { margin-bottom: 16px; }
.hc-no-horse h2 { font-size: 17px; margin: 0 0 10px; }
.hc-no-horse > p:first-of-type { color: var(--hc-text-sec); margin: 0 0 20px; font-size: 14px; max-width: 520px; }
.hc-no-horse .hc-btn-primary { display: inline-block; margin-bottom: 6px; }
.hc-no-horse-hint { font-size: 12px; color: var(--hc-text-ter); margin: 0; font-style: italic; }

/* ── Icône cheval sidebar OceanWP ───────────────── */

/* 1. Masquer ::before d'OceanWP (l'icône document) */
.woocommerce-MyAccount-navigation-link--parcours-bienetre a::before {
	content: none !important;
	display: none !important;
}

/* 2. Masquer tout SVG ou sibling restant */
.woocommerce-MyAccount-navigation-link--parcours-bienetre a ~ *,
.woocommerce-MyAccount-navigation-link--parcours-bienetre > svg { display: none !important; }

/* 3. Cheval en ::after positionné à droite comme les autres icônes OceanWP */
.woocommerce-MyAccount-navigation-link--parcours-bienetre a {
	position: relative !important;
}
.woocommerce-MyAccount-navigation-link--parcours-bienetre a::after {
	content: '' !important;
	position: absolute !important;
	right: 0 !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	width: 16px !important;
	height: 18px !important;
	background-color: #009e26 !important;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1080 1205'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M717 87L702 107L682 124L682 128L689 140L701 153L719 165L729 169L731 153L730 128L725 104L719 87ZM637 5L635 5L614 27L592 59L573 97L559 139L508 149L456 166L397 193L349 222L304 257L261 300L225 346L190 401L160 458L141 501L117 567L102 621L92 666L83 723L75 854L67 922L53 979L38 1018L40 1018L60 997L91 957L109 927L129 885L148 825L177 674L199 590L212 553L237 495L253 464L278 424L318 372L350 338L375 315L417 282L461 253L508 228L550 212L574 207L580 208L579 211L532 237L480 271L414 323L357 381L331 414L303 456L265 527L243 579L230 616L203 713L174 856L164 897L140 968L113 1022L85 1063L69 1082L46 1105L27 1121L6 1135L5 1138L72 1139L137 1145L359 1186L426 1194L506 1199L591 1198L673 1191L763 1176L842 1155L839 1136L830 1108L805 1059L767 1009L690 930L655 889L632 855L608 807L598 779L588 741L582 708L578 670L573 647L565 629L553 611L538 583L523 540L519 517L518 484L521 458L530 423L534 423L533 451L535 472L539 494L546 515L565 550L590 578L624 602L658 618L686 626L704 629L757 632L784 641L812 656L856 684L887 709L896 721L907 750L915 764L922 772L936 781L964 787L993 785L1020 777L1041 764L1057 747L1065 732L1070 717L1074 693L1072 658L1063 629L1049 603L939 448L916 410L874 329L847 289L822 260L792 231L752 199L697 164L685 152L672 134L660 108L650 79L640 32ZM737 347L761 346L779 351L794 359L813 378L822 394L826 409L814 410L795 406L775 396L764 385L751 360L738 350Z'/%3E%3C/svg%3E") !important;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1080 1205'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M717 87L702 107L682 124L682 128L689 140L701 153L719 165L729 169L731 153L730 128L725 104L719 87ZM637 5L635 5L614 27L592 59L573 97L559 139L508 149L456 166L397 193L349 222L304 257L261 300L225 346L190 401L160 458L141 501L117 567L102 621L92 666L83 723L75 854L67 922L53 979L38 1018L40 1018L60 997L91 957L109 927L129 885L148 825L177 674L199 590L212 553L237 495L253 464L278 424L318 372L350 338L375 315L417 282L461 253L508 228L550 212L574 207L580 208L579 211L532 237L480 271L414 323L357 381L331 414L303 456L265 527L243 579L230 616L203 713L174 856L164 897L140 968L113 1022L85 1063L69 1082L46 1105L27 1121L6 1135L5 1138L72 1139L137 1145L359 1186L426 1194L506 1199L591 1198L673 1191L763 1176L842 1155L839 1136L830 1108L805 1059L767 1009L690 930L655 889L632 855L608 807L598 779L588 741L582 708L578 670L573 647L565 629L553 611L538 583L523 540L519 517L518 484L521 458L530 423L534 423L533 451L535 472L539 494L546 515L565 550L590 578L624 602L658 618L686 626L704 629L757 632L784 641L812 656L856 684L887 709L896 721L907 750L915 764L922 772L936 781L964 787L993 785L1020 777L1041 764L1057 747L1065 732L1070 717L1074 693L1072 658L1063 629L1049 603L939 448L916 410L874 329L847 289L822 260L792 231L752 199L697 164L685 152L672 134L660 108L650 79L640 32ZM737 347L761 346L779 351L794 359L813 378L822 394L826 409L814 410L795 406L775 396L764 385L751 360L738 350Z'/%3E%3C/svg%3E") !important;
	-webkit-mask-repeat: no-repeat !important;
	mask-repeat: no-repeat !important;
	-webkit-mask-size: contain !important;
	mask-size: contain !important;
	margin: 0 !important;
	vertical-align: unset !important;
	display: block !important;
}

/* ── Formulaire modification profil cheval ────────────────────── */
.hc-edit-form { max-width: 620px; }
.hc-edit-header { margin-bottom: 20px; }
.hc-back-link { font-size: 13px; color: var(--hc-green); text-decoration: none; display: inline-block; margin-bottom: 10px; }
.hc-back-link:hover { text-decoration: underline; }
.hc-edit-header h2 { font-size: 18px; font-weight: 600; margin: 0; }

.hc-form { background: #fff; border: 1px solid var(--hc-border); border-radius: var(--hc-radius); padding: 24px; }
.hc-form-group { margin-bottom: 18px; }
.hc-form-group label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 5px; color: var(--hc-text); }
.hc-form-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
@media (max-width: 560px) { .hc-form-row { grid-template-columns: 1fr; } }
.hc-input {
	width: 100%; padding: 8px 12px;
	border: 1px solid #ddd; border-radius: var(--hc-radius-sm);
	font-size: 14px; font-family: inherit;
	transition: border-color .2s;
}
.hc-input:focus { outline: none; border-color: var(--hc-green); }
.hc-file-input { display: block; margin-bottom: 6px; font-size: 13px; }
.hc-hint { font-size: 12px; color: var(--hc-text-ter); margin: 4px 0 0; }

.hc-photo-preview { margin-bottom: 10px; }
.hc-photo-preview img { width: 80px; height: 90px; object-fit: cover; border-radius: var(--hc-radius-sm); border: 1px solid var(--hc-border); }
.hc-photo-placeholder { width: 80px; height: 90px; background: var(--hc-green-light); border-radius: var(--hc-radius-sm); display: flex; align-items: center; justify-content: center; }

.hc-form-actions { display: flex; align-items: center; gap: 14px; margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--hc-border); }
.hc-btn-cancel { font-size: 13px; color: var(--hc-text-sec); text-decoration: none; }
.hc-btn-cancel:hover { color: var(--hc-text); }

.hc-notice { padding: 10px 14px; border-radius: var(--hc-radius-sm); margin-bottom: 16px; font-size: 13px; }
.hc-notice-error { background: #fef2f2; border: 1px solid #fca5a5; color: #991b1b; }

/* ── Besoins prioritaires ─────────────────────────────────────── */
.hc-besoins { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--hc-border); }
.hc-besoins-title { font-size: 12px; font-weight: 600; color: var(--hc-text-sec); margin: 0 0 10px; text-transform: uppercase; letter-spacing: .04em; }
.hc-besoins-grid { display: flex; gap: 12px; flex-wrap: wrap; }
.hc-besoin-item { display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 80px; text-align: center; }
.hc-besoin-icon { width: 42px; height: 42px; border-radius: 50%; background: var(--hc-green-light); display: flex; align-items: center; justify-content: center; color: var(--hc-green); }
.hc-besoin-label { font-size: 11px; color: var(--hc-text); line-height: 1.3; }
.hc-besoin-badge { font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 999px; }
.hc-besoin-eleve { background: #fee2e2; color: #991b1b; }
.hc-besoin-moyen { background: #fef3c7; color: #92400e; }
.hc-besoin-faible { background: #f0fdf4; color: #166534; }

/* ── Boutons renfort produits ─────────────────────────────────── */
.hc-renfort-produit-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 9px 0;
	border-bottom: 1px solid rgba(0,0,0,.06);
	flex-wrap: wrap;
}
.hc-renfort-produit-row:last-child { border-bottom: none; padding-bottom: 0; }
.hc-renfort-produit-nom {
	font-size: 12px;
	font-weight: 600;
	color: var(--hc-green-dark);
	flex: 1;
	min-width: 180px;
	line-height: 1.3;
}
.hc-renfort-produit-actions { display: flex; gap: 8px; flex-shrink: 0; align-items: center; }
.hc-btn-outline.hc-btn-sm { border: 1px solid var(--hc-green-mid); line-height: 1.4; }
.hc-btn-primary.hc-btn-sm { border: 1px solid transparent; line-height: 1.4; }
.hc-btn-sm { font-size: 11px !important; padding: 5px 10px !important; white-space: nowrap; }

/* ── Bannière fin de trimestre ────────────────────────────────── */
.hc-fin-trim-banner {
	background: #fffbeb;
	border: 1px solid #fcd34d;
	border-radius: var(--hc-radius);
	padding: 16px 18px;
	margin-bottom: 14px;
}
.hc-fin-trim-top {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 14px;
	padding-bottom: 12px;
	border-bottom: 1px solid #fde68a;
}
.hc-fin-trim-icon { font-size: 20px; flex-shrink: 0; margin-top: 1px; }
.hc-fin-trim-title { font-size: 13px; font-weight: 700; color: #92400e; margin: 0 0 2px; }
.hc-fin-trim-sub   { font-size: 12px; color: #b45309; margin: 0; }

.hc-fin-trim-body {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 20px;
	align-items: start;
}
@media (max-width: 600px) { .hc-fin-trim-body { grid-template-columns: 1fr; } }

.hc-prochain-label { font-size: 11px; color: var(--hc-text-sec); text-transform: uppercase; letter-spacing: .04em; margin: 0; }
.hc-prochain-titre { font-size: 15px; font-weight: 700; color: var(--hc-text); margin: 4px 0 4px; }
.hc-prochain-obj   { font-size: 12px; color: var(--hc-text-sec); margin: 0 0 6px; line-height: 1.5; }
.hc-prochain-debut { font-size: 12px; color: var(--hc-text-ter); margin: 0; }
.hc-badge-avenir   { font-size: 10px; padding: 2px 8px; border-radius: 999px; background: #e0f2fe; color: #0369a1; font-weight: 700; white-space: nowrap; }

/* Countdown */
.hc-countdown-wrap { text-align: center; flex-shrink: 0; }
.hc-countdown-title { font-size: 11px; color: var(--hc-text-sec); margin: 0 0 10px; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; }
.hc-countdown { display: flex; gap: 8px; }
.hc-cd-block { display: flex; flex-direction: column; align-items: center; background: #fff; border: 1px solid #fde68a; border-radius: var(--hc-radius-sm); padding: 8px 12px; min-width: 52px; }
.hc-cd-val { font-size: 22px; font-weight: 700; color: var(--hc-text); line-height: 1; }
.hc-cd-lbl { font-size: 10px; color: var(--hc-text-ter); margin-top: 2px; }
.hc-notif-msg { font-size: 12px; color: #3B6D11; margin: 10px 0 0; padding: 8px 10px; background: rgba(255,255,255,.6); border-radius: 5px; }

/* ── Section aide / contact ───────────────────────────────────── */
.hc-help-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
}
.hc-help-text { font-size: 13px; color: var(--hc-text); margin: 0; }

/* ── Bouton Nous contacter ────────────────────────────────────── */
.hc-help-card .hc-btn-outline {
	background-color: #eaf4e0;
	color: var(--hc-green-dark) !important;
	border-color: #b2d896;
}
.hc-help-card .hc-btn-outline:hover {
	background-color: var(--hc-green) !important;
	color: #fff !important;
	border-color: var(--hc-green) !important;
}

/* ── Sélecteur multi-chevaux ──────────────────────────────────────────── */
.hc-chevaux-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 20px;
}
.hc-cheval-tab {
	display: inline-block;
	padding: 7px 16px;
	border-radius: 20px;
	border: 1.5px solid var(--hc-green, #009e26);
	color: var(--hc-green, #009e26);
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	transition: background .15s, color .15s;
}
.hc-cheval-tab:hover {
	background: var(--hc-green, #009e26);
	color: #fff;
}
.hc-cheval-tab--actif {
	background: var(--hc-green, #009e26);
	color: #fff;
}
.hc-cheval-tab--add {
	border-style: dashed;
	color: #666;
	border-color: #aaa;
}
.hc-cheval-tab--add:hover {
	background: #f5f5f5;
	color: #333;
}

/* ── Bouton supprimer cheval ──────────────────────────────────────────── */
.hc-supprimer {
	color: #cc3333 !important;
	margin-left: 12px;
	font-size: 13px;
}
.hc-supprimer:hover {
	color: #991111 !important;
	text-decoration: underline;
}

/* ── Info parcours ────────────────────────────────────────────────────── */
.hc-info-parcours {
	font-size: 13px;
	color: #666;
	line-height: 1.6;
	margin: 0 0 16px 0;
	padding: 10px 14px;
	background: #f5faf5;
	border-left: 3px solid var(--hc-green, #009e26);
	border-radius: 0 4px 4px 0;
}