/*
 * ANCIC Card Components
 *
 * Covers:
 *  - .ancic-card-resource  (document / publication)
 *  - .ancic-card-news      (actualité)
 *  - .ancic-card-event     (événement)
 *  - .ancic-card-formation (formation / DPC)
 *
 * Each card has variant modifiers:
 *   --default     standard vertical layout
 *   --horizontal  image left, content right (wide cards)
 *   --compact     condensed, no image
 *   --featured    enlarged, richer display (news / formation)
 *
 * All layout is self-contained — cards adapt to any
 * Elementor column or grid container width automatically.
 *
 * Shared button classes (.ancic-btn) are defined in ancic-custom.css.
 */


/* =============================================================
   SHARED CARD BASE
   ============================================================= */

.ancic-card-resource,
.ancic-card-news,
.ancic-card-event,
.ancic-card-formation {
	--card-radius: var(--r-xl, 16px);
	--card-pad:    var(--sp-6, 1.5rem);
	--card-gap:    var(--sp-3, 0.75rem);

	position: relative;
	display: flex;
	flex-direction: column;
	background-color: var(--ancic-white, #fff);
	border: 1px solid var(--ancic-rule, #e5e5ea);
	border-radius: var(--card-radius);
	overflow: hidden;
	box-shadow: var(--shadow-xs, 0 1px 2px rgba(0,0,0,.05));
	transition:
		box-shadow var(--dur-base, 220ms) var(--ease-out, cubic-bezier(.16,1,.3,1)),
		transform  var(--dur-base, 220ms) var(--ease-out, cubic-bezier(.16,1,.3,1)),
		border-color var(--dur-base, 220ms) var(--ease-out, cubic-bezier(.16,1,.3,1));
	height: 100%;
}

.ancic-card-resource:hover,
.ancic-card-news:hover,
.ancic-card-event:hover,
.ancic-card-formation:hover {
	box-shadow: var(--shadow-md, 0 4px 16px rgba(0,0,0,.08));
	transform: translateY(-2px);
	border-color: var(--ancic-blue-light, #cceef9);
}

/* Badges row shared */
.ancic-card-resource__badges,
.ancic-card-news__badges,
.ancic-card-event__badges,
.ancic-card-formation__badges {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-2, 0.5rem);
	margin-bottom: var(--sp-3, 0.75rem);
}

/* Title shared */
.ancic-card-resource__title,
.ancic-card-news__title,
.ancic-card-event__title,
.ancic-card-formation__title {
	font-family: var(--font-ui, 'Inter', system-ui, sans-serif);
	font-weight: 700;
	font-size: var(--text-base, 1rem);
	line-height: var(--leading-snug, 1.35);
	color: var(--ancic-blue, #1a3a5c);
	margin: 0 0 var(--sp-3, 0.75rem);
	letter-spacing: var(--tracking-snug, -0.015em);
}

.ancic-card-resource__title a,
.ancic-card-news__title a,
.ancic-card-event__title a,
.ancic-card-formation__title a {
	color: inherit;
	text-decoration: none;
	transition: color var(--dur-fast, 120ms);
}

.ancic-card-resource__title a:hover,
.ancic-card-news__title a:hover,
.ancic-card-event__title a:hover,
.ancic-card-formation__title a:hover {
	color: var(--ancic-blue, #00A1D7);
}


/* =============================================================
   RESOURCE CARD
   ============================================================= */

.ancic-card-resource {
	flex-direction: row;
	align-items: flex-start;
	gap: 0;
}

/* Icon column */
.ancic-card-resource__icon {
	flex-shrink: 0;
	width: 56px;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: var(--card-pad);
	padding-right: 0;
	color: var(--ancic-blue, #1a3a5c);
}

.ancic-card-resource__icon svg {
	margin-top: 2px;
	opacity: .7;
	transition: opacity var(--dur-fast, 120ms);
}

.ancic-card-resource:hover .ancic-card-resource__icon svg {
	opacity: 1;
}

/* Body */
.ancic-card-resource__body {
	flex: 1;
	min-width: 0;
	padding: var(--card-pad);
	padding-bottom: var(--sp-4, 1rem);
}

.ancic-card-resource__title {
	font-size: var(--text-base, 1rem);
	margin-bottom: var(--sp-2, 0.5rem);
}

.ancic-card-resource__excerpt {
	font-family: var(--font-body, Georgia, serif);
	font-size: var(--text-sm, 0.875rem);
	color: var(--ancic-ink-light, #636366);
	line-height: var(--leading-relaxed, 1.75);
	margin: 0 0 var(--sp-3, 0.75rem);
}

.ancic-card-resource__meta {
	display: flex;
	align-items: center;
	gap: var(--sp-4, 1rem);
	font-family: var(--font-ui, system-ui);
	font-size: var(--text-xs, 0.75rem);
	color: var(--ancic-ink-faint, #8e8e93);
	line-height: 1;
}

.ancic-card-resource__size {
	font-weight: 600;
	color: var(--ancic-ink-light, #636366);
}

/* Actions row */
.ancic-card-resource__actions {
	display: flex;
	align-items: center;
	gap: var(--sp-1, 0.25rem);
	padding: var(--sp-3, 0.75rem) var(--card-pad);
	border-top: 1px solid var(--ancic-rule, #e5e5ea);
	background-color: var(--ancic-surface, #f5f5f7);
	margin-top: auto;
}

.ancic-card-resource__download {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	font-family: var(--font-ui);
	font-size: var(--text-xs);
	font-weight: 700;
	letter-spacing: var(--tracking-wide, 0.03em);
	color: var(--ancic-white, #fff);
	background-color: var(--ancic-blue, #1a3a5c);
	border-radius: var(--r-md, 6px);
	padding: 0.45em 1em;
	text-decoration: none;
	transition: background-color var(--dur-fast), box-shadow var(--dur-fast), transform var(--dur-fast);
}

.ancic-card-resource__download:hover {
	background-color: var(--ancic-blue-mid, #24527f);
	color: var(--ancic-white);
	transform: translateY(-1px);
	box-shadow: var(--shadow-xs);
}

.ancic-card-resource__link {
	display: inline-flex;
	align-items: center;
	gap: 0.3em;
	font-family: var(--font-ui);
	font-size: var(--text-xs);
	font-weight: 600;
	color: var(--ancic-ink-light, #636366);
	text-decoration: none;
	padding: 0.45em 0.75em;
	border-radius: var(--r-md);
	transition: color var(--dur-fast), background-color var(--dur-fast);
}

.ancic-card-resource__link:hover {
	color: var(--ancic-blue, #00A1D7);
	background-color: var(--ancic-blue-faint, #e8f7fd);
}

/* Resource — compact variant */
.ancic-card-resource--compact {
	flex-direction: column;
}

.ancic-card-resource--compact .ancic-card-resource__icon {
	padding: var(--card-pad) var(--card-pad) 0;
	width: auto;
	align-items: flex-start;
	justify-content: flex-start;
}

.ancic-card-resource--compact .ancic-card-resource__body {
	padding-top: var(--sp-4);
}

.ancic-card-resource--compact .ancic-card-resource__excerpt {
	display: none;
}

/* Resource — horizontal variant (same as default but explicit) */
.ancic-card-resource--horizontal {
	flex-direction: row;
}


/* =============================================================
   NEWS CARD
   ============================================================= */

.ancic-card-news__image {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background-color: var(--ancic-blue-faint, #f0f5fa);
	flex-shrink: 0;
}

.ancic-card-news--featured .ancic-card-news__image {
	aspect-ratio: 4 / 3;
}

.ancic-card-news__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--dur-slow, 380ms) var(--ease-out);
}

.ancic-card-news:hover .ancic-card-news__image img {
	transform: scale(1.04);
}

.ancic-card-news__body {
	flex: 1;
	padding: var(--card-pad);
	display: flex;
	flex-direction: column;
	gap: var(--card-gap);
}

.ancic-card-news__title {
	font-size: var(--text-base, 1rem);
}

.ancic-card-news--featured .ancic-card-news__title {
	font-size: var(--text-xl, 1.25rem);
}

.ancic-card-news__excerpt {
	font-family: var(--font-body, Georgia, serif);
	font-size: var(--text-sm, 0.875rem);
	color: var(--ancic-ink-light, #636366);
	line-height: var(--leading-relaxed, 1.75);
	margin: 0;
	flex: 1;
}

.ancic-card-news__meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--sp-2, 0.5rem);
	font-family: var(--font-ui);
	font-size: var(--text-xs, 0.75rem);
	color: var(--ancic-ink-faint, #8e8e93);
	margin-top: auto;
	line-height: 1;
}

.ancic-card-news__meta-sep {
	color: var(--ancic-rule, #e5e5ea);
}

.ancic-card-news__read-time {
	color: var(--ancic-ink-faint);
}

/* News — no image: show a subtle top accent bar instead */
.ancic-card-news--no-image::before {
	content: '';
	display: block;
	height: 3px;
	background: linear-gradient(90deg, var(--ancic-blue, #00A1D7) 0%, var(--ancic-blue-mid, #0081ad) 100%);
}

/* News — horizontal (image left, content right) */
.ancic-card-news--horizontal {
	flex-direction: row;
}

.ancic-card-news--horizontal .ancic-card-news__image {
	width: 200px;
	aspect-ratio: auto;
	flex-shrink: 0;
}

/* News — compact */
.ancic-card-news--compact .ancic-card-news__image {
	display: none;
}

.ancic-card-news--compact .ancic-card-news__excerpt {
	display: none;
}

.ancic-card-news--compact .ancic-card-news__body {
	padding: var(--sp-4, 1rem) var(--sp-5, 1.25rem);
}

/* News — featured: large, full body */
.ancic-card-news--featured .ancic-card-news__body {
	padding: var(--sp-8, 2rem);
}

@container (max-width: 400px) {
	.ancic-card-news--horizontal {
		flex-direction: column;
	}
	.ancic-card-news--horizontal .ancic-card-news__image {
		width: 100%;
		aspect-ratio: 16 / 9;
	}
}


/* =============================================================
   EVENT CARD
   ============================================================= */

.ancic-card-event {
	flex-direction: row;
	align-items: stretch;
}

/* Date box — left column */
.ancic-card-event__datebox {
	flex-shrink: 0;
	width: 72px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-color: var(--ancic-blue, #1a3a5c);
	color: var(--ancic-white, #fff);
	padding: var(--sp-4, 1rem) var(--sp-2, 0.5rem);
	gap: 0;
	text-align: center;
	border-radius: var(--card-radius) 0 0 var(--card-radius);
	flex-shrink: 0;
}

.ancic-card-event--past .ancic-card-event__datebox {
	background-color: var(--ancic-ink-faint, #8e8e93);
}

.ancic-card-event__day {
	display: block;
	font-family: var(--font-ui);
	font-size: var(--text-3xl, 1.875rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: var(--tracking-tight, -0.025em);
}

.ancic-card-event__month {
	display: block;
	font-family: var(--font-ui);
	font-size: var(--text-xs, 0.75rem);
	font-weight: 700;
	letter-spacing: var(--tracking-widest, 0.1em);
	text-transform: uppercase;
	opacity: .8;
	margin-top: 2px;
}

.ancic-card-event__year {
	display: block;
	font-family: var(--font-ui);
	font-size: var(--text-xs, 0.75rem);
	opacity: .5;
	margin-top: 2px;
}

/* Body */
.ancic-card-event__body {
	flex: 1;
	min-width: 0;
	padding: var(--sp-5, 1.25rem) var(--sp-5) var(--sp-4);
	display: flex;
	flex-direction: column;
	gap: var(--sp-2, 0.5rem);
}

.ancic-card-event__title {
	font-size: var(--text-base, 1rem);
	margin-bottom: var(--sp-1, 0.25rem);
}

/* Detail list (time + place) */
.ancic-card-event__details {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--sp-1, 0.25rem);
}

.ancic-card-event__detail {
	display: flex;
	align-items: center;
	gap: var(--sp-2, 0.5rem);
	font-family: var(--font-ui);
	font-size: var(--text-xs, 0.75rem);
	color: var(--ancic-ink-light, #636366);
	line-height: 1.4;
}

.ancic-card-event__detail svg {
	flex-shrink: 0;
	color: var(--ancic-ink-faint);
}

/* CTA link at bottom */
.ancic-card-event__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	font-family: var(--font-ui);
	font-size: var(--text-xs, 0.75rem);
	font-weight: 700;
	letter-spacing: var(--tracking-wide);
	color: var(--ancic-blue, #00A1D7);
	text-decoration: none;
	padding: var(--sp-3, 0.75rem) var(--sp-5, 1.25rem);
	border-top: 1px solid var(--ancic-rule, #e5e5ea);
	background-color: var(--ancic-surface, #f5f5f7);
	transition: background-color var(--dur-fast), color var(--dur-fast);
}

.ancic-card-event__cta:hover {
	background-color: var(--ancic-blue-faint, #e8f7fd);
	color: var(--ancic-teal);
}

.ancic-card-event--past .ancic-card-event__cta {
	color: var(--ancic-ink-faint, #8e8e93);
}

/* Event — compact: no CTA, smaller padding */
.ancic-card-event--compact .ancic-card-event__cta {
	display: none;
}

.ancic-card-event--compact .ancic-card-event__datebox {
	width: 60px;
}

.ancic-card-event--compact .ancic-card-event__day {
	font-size: var(--text-2xl, 1.5rem);
}

/* Event — featured: vertical layout, larger date */
.ancic-card-event--featured {
	flex-direction: column;
}

.ancic-card-event--featured .ancic-card-event__datebox {
	width: 100%;
	flex-direction: row;
	justify-content: flex-start;
	padding: var(--sp-4) var(--sp-6);
	gap: var(--sp-3);
	border-radius: 0;
}

.ancic-card-event--featured .ancic-card-event__day {
	font-size: var(--text-4xl, 2.25rem);
}

.ancic-card-event--featured .ancic-card-event__month {
	font-size: var(--text-sm);
	align-self: flex-end;
	margin-bottom: 4px;
}

.ancic-card-event--featured .ancic-card-event__year {
	font-size: var(--text-sm);
	align-self: flex-end;
	margin-bottom: 4px;
}

.ancic-card-event--featured .ancic-card-event__body {
	padding: var(--sp-6);
}

.ancic-card-event--featured .ancic-card-event__title {
	font-size: var(--text-xl, 1.25rem);
}


/* =============================================================
   FORMATION CARD
   ============================================================= */

.ancic-card-formation__image {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background-color: var(--ancic-blue-faint, #f0f5fa);
	position: relative;
}

.ancic-card-formation__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--dur-slow, 380ms) var(--ease-out);
}

.ancic-card-formation:hover .ancic-card-formation__image img {
	transform: scale(1.04);
}

/* Complet overlay on image */
.ancic-card-formation__image-overlay {
	position: absolute;
	inset: 0;
	background-color: rgba(0,0,0,.45);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-ui);
	font-size: var(--text-sm);
	font-weight: 700;
	letter-spacing: var(--tracking-widest);
	text-transform: uppercase;
	color: var(--ancic-white, #fff);
}

/* Body */
.ancic-card-formation__body {
	flex: 1;
	padding: var(--card-pad);
	display: flex;
	flex-direction: column;
	gap: var(--sp-3, 0.75rem);
}

.ancic-card-formation__title {
	font-size: var(--text-base, 1rem);
	margin-bottom: 0;
}

.ancic-card-formation__audience {
	font-family: var(--font-ui);
	font-size: var(--text-xs, 0.75rem);
	color: var(--ancic-ink-light, #636366);
	margin: 0;
	line-height: 1.4;
}

/* Specs row (duration + credits) */
.ancic-card-formation__specs {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-4, 1rem);
}

.ancic-card-formation__spec {
	display: flex;
	align-items: center;
	gap: var(--sp-2, 0.5rem);
	font-family: var(--font-ui);
	font-size: var(--text-xs, 0.75rem);
	font-weight: 600;
	color: var(--ancic-ink-mid, #3a3a3c);
}

.ancic-card-formation__spec svg {
	flex-shrink: 0;
	color: var(--ancic-ink-faint);
}

/* Availability messages */
.ancic-card-formation__availability {
	font-family: var(--font-ui);
	font-size: var(--text-xs, 0.75rem);
	font-weight: 700;
	margin: 0;
	padding: var(--sp-2) var(--sp-3);
	border-radius: var(--r-md, 6px);
}

.ancic-card-formation__availability--limited {
	background-color: var(--ancic-warning-bg, #fefce8);
	color: var(--ancic-warning, #92400e);
}

.ancic-card-formation__availability--full {
	background-color: var(--ancic-danger-bg, #fef2f2);
	color: var(--ancic-danger, #991b1b);
}

/* Footer row */
.ancic-card-formation__footer {
	display: flex;
	align-items: center;
	gap: var(--sp-3, 0.75rem);
	padding: var(--sp-4, 1rem) var(--card-pad);
	border-top: 1px solid var(--ancic-rule, #e5e5ea);
	background-color: var(--ancic-surface, #f5f5f7);
	margin-top: auto;
}

/* Button inside footer (ancic-btn classes from ancic-custom.css) */
.ancic-card-formation__footer .ancic-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-ui);
	font-size: var(--text-xs);
	font-weight: 600;
	letter-spacing: var(--tracking-wide);
	border-radius: var(--r-md);
	padding: 0.45em 1em;
	border: 2px solid transparent;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--dur-fast), color var(--dur-fast), border-color var(--dur-fast), transform var(--dur-fast);
}

.ancic-card-formation__footer .ancic-btn--primary {
	background-color: var(--ancic-blue, #1a3a5c);
	color: var(--ancic-white, #fff);
	border-color: var(--ancic-blue);
}

.ancic-card-formation__footer .ancic-btn--primary:hover {
	background-color: var(--ancic-blue-mid, #24527f);
	border-color: var(--ancic-blue-mid);
	color: var(--ancic-white);
	transform: translateY(-1px);
}

.ancic-card-formation__footer .ancic-btn--outline {
	background-color: transparent;
	color: var(--ancic-ink-mid, #3a3a3c);
	border-color: var(--ancic-rule, #e5e5ea);
}

.ancic-card-formation__footer .ancic-btn--outline:hover {
	border-color: var(--ancic-blue-light, #d6e4f0);
	color: var(--ancic-blue);
	background-color: var(--ancic-blue-faint, #f0f5fa);
	transform: translateY(-1px);
}

.ancic-card-formation__detail-link {
	font-family: var(--font-ui);
	font-size: var(--text-xs);
	font-weight: 600;
	color: var(--ancic-ink-light, #636366);
	text-decoration: none;
	margin-left: auto;
	transition: color var(--dur-fast);
}

.ancic-card-formation__detail-link:hover {
	color: var(--ancic-blue, #00A1D7);
}

/* Formation — full state */
.ancic-card-formation--full {
	opacity: .85;
}

.ancic-card-formation--full:hover {
	transform: none;
}

/* Formation — compact */
.ancic-card-formation--compact .ancic-card-formation__image {
	display: none;
}

.ancic-card-formation--compact .ancic-card-formation__body {
	padding: var(--sp-4) var(--sp-5);
}

.ancic-card-formation--compact .ancic-card-formation__audience {
	display: none;
}

/* Formation — horizontal */
.ancic-card-formation--horizontal {
	flex-direction: row;
}

.ancic-card-formation--horizontal .ancic-card-formation__image {
	width: 220px;
	aspect-ratio: auto;
	flex-shrink: 0;
}

.ancic-card-formation--horizontal .ancic-card-formation__footer {
	flex-direction: column;
	width: 180px;
	flex-shrink: 0;
	border-top: 0;
	border-left: 1px solid var(--ancic-rule);
	justify-content: center;
	padding: var(--sp-5);
	align-items: stretch;
}

.ancic-card-formation--horizontal .ancic-card-formation__detail-link {
	margin-left: 0;
	text-align: center;
}


/* =============================================================
   ELEMENTOR CONTAINER COMPATIBILITY
   ============================================================= */

/*
 * Cards inside Elementor columns adapt automatically.
 * Elementor sets container sizing via inline styles, so
 * we ensure cards fill their container height cleanly.
 */

.elementor-column .ancic-card-resource,
.elementor-column .ancic-card-news,
.elementor-column .ancic-card-event,
.elementor-column .ancic-card-formation,
.e-con .ancic-card-resource,
.e-con .ancic-card-news,
.e-con .ancic-card-event,
.e-con .ancic-card-formation {
	height: 100%;
}

/* Disable our hover transform inside Elementor editor to prevent accidental layout shifts */
.elementor-editor-active .ancic-card-resource:hover,
.elementor-editor-active .ancic-card-news:hover,
.elementor-editor-active .ancic-card-event:hover,
.elementor-editor-active .ancic-card-formation:hover {
	transform: none;
}


/* =============================================================
   CARD GRID HELPER
   (wrap cards without Elementor when needed)
   ============================================================= */

.ancic-cards-grid {
	display: grid;
	gap: var(--sp-5, 1.25rem);
	grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
}

.ancic-cards-grid-2 { grid-template-columns: repeat(2, 1fr); }
.ancic-cards-grid-3 { grid-template-columns: repeat(3, 1fr); }
.ancic-cards-grid-4 { grid-template-columns: repeat(4, 1fr); }

@media screen and (max-width: 1024px) {
	.ancic-cards-grid-3,
	.ancic-cards-grid-4 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (max-width: 599px) {
	.ancic-cards-grid-2,
	.ancic-cards-grid-3,
	.ancic-cards-grid-4 {
		grid-template-columns: 1fr;
	}

	/* Horizontal variants collapse on small screens */
	.ancic-card-formation--horizontal {
		flex-direction: column;
	}

	.ancic-card-formation--horizontal .ancic-card-formation__image {
		width: 100%;
		aspect-ratio: 16 / 9;
	}

	.ancic-card-formation--horizontal .ancic-card-formation__footer {
		flex-direction: row;
		width: 100%;
		border-left: 0;
		border-top: 1px solid var(--ancic-rule);
		padding: var(--sp-4) var(--sp-5);
		justify-content: flex-start;
		align-items: center;
	}

	.ancic-card-formation--horizontal .ancic-card-formation__detail-link {
		margin-left: auto;
	}

	.ancic-card-news--horizontal {
		flex-direction: column;
	}

	.ancic-card-news--horizontal .ancic-card-news__image {
		width: 100%;
		aspect-ratio: 16 / 9;
	}

	.ancic-card-event--featured {
		flex-direction: column;
	}
}


/* =============================================================
   REDUCED MOTION
   ============================================================= */

@media (prefers-reduced-motion: reduce) {
	.ancic-card-resource,
	.ancic-card-news,
	.ancic-card-event,
	.ancic-card-formation {
		transition: none;
	}

	.ancic-card-news__image img,
	.ancic-card-formation__image img {
		transition: none;
	}
}
