/**
 * ACI Programme — styles built to match the original Airports Innovate design.
 *
 * Everything is driven by CSS custom properties declared on .aci-programme, so
 * the look can be re-themed from the Elementor widget's Style controls (which
 * simply set these variables inline on the wrapper) — no code edits needed.
 */
.aci-programme {
	--aci-primary: #147df2;                       /* time text, speaker name, hover border */
	--aci-header-bg: rgba(48, 123, 165, 0.09);    /* #307BA517 light-blue header tint */
	--aci-body-bg: rgba(179, 179, 179, 0.12);     /* #B3B3B31F light-grey body tint */
	--aci-border: rgba(179, 179, 179, 0.35);      /* #B3B3B33B card border */
	--aci-highlight-bg: #307ba5;                  /* highlighted session header (dark blue) */
	--aci-text: #1a1f36;
	--aci-muted: #6b7280;
	--aci-radius: 12px;
	--aci-title-font: "Poppins", sans-serif;
	--aci-name-font: "Poppins", sans-serif;
	--aci-time-width: 150px;
	--aci-photo-size: 80px;                       /* speaker photo diameter */
	--aci-speaker-name: var(--aci-text);          /* speaker name colour */
	--aci-tab-active-bg: var(--aci-primary);
	--aci-tab-active-color: #fff;
	--aci-tab-bg: #fff;
	--aci-tab-color: var(--aci-muted);
	--aci-tab-hover-bg: transparent;
	--aci-tab-hover-color: var(--aci-primary);
	--aci-tabs-justify: center;                   /* left / center / right */

	color: var(--aci-text);
	font-family: var(--aci-title-font);
}

/* ---------- Neutralise theme button reset ----------
   Some themes (e.g. Hello Elementor's reset.css) style [type="button"]/
   button with borders, padding and colours, and load AFTER this file, so they
   win on equal specificity. This scoped reset (specificity 0,2,0 beats the
   theme's 0,1,0) strips that for any button inside the programme. The specific
   button rules below are also .aci-programme-prefixed so they win over this. */
.aci-programme button,
.aci-programme [type="button"],
.aci-programme [type="submit"] {
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	border: 0;
	border-radius: 0;
	color: inherit;
	font: inherit;
	letter-spacing: inherit;
	margin: 0;
	padding: 0;
	text-align: inherit;
	white-space: normal;
	cursor: pointer;
	transition: none;
}

/* ---------- Day tabs ---------- */
.aci-day-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 28px;
	justify-content: var(--aci-tabs-justify, center);
}
.aci-programme .aci-day-tab {
	appearance: none;
	border: 2px solid var(--aci-border);
	background: var(--aci-tab-bg, #fff);
	color: var(--aci-tab-color, var(--aci-muted));
	font-family: var(--aci-title-font);
	font-size: 1.05rem;
	font-weight: 600;
	padding: 12px 26px;
	border-radius: 999px;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.aci-programme .aci-day-tab:hover {
	background: var(--aci-tab-hover-bg, transparent);
	color: var(--aci-tab-hover-color, var(--aci-primary));
	border-color: var(--aci-tab-hover-color, var(--aci-primary));
}
.aci-programme .aci-day-tab.is-active {
	background: var(--aci-tab-active-bg);
	border-color: var(--aci-tab-active-bg);
	color: var(--aci-tab-active-color);
}

/* ---------- Panels ---------- */
.aci-day-panel {
	display: none;
}
.aci-day-panel.is-active {
	display: block;
	animation: aci-fade .2s ease;
}
@keyframes aci-fade {
	from { opacity: 0; transform: translateY(4px); }
	to   { opacity: 1; transform: none; }
}

/* ---------- Session ---------- */
.sessionItem {
	border: 2px solid var(--aci-border);
	border-radius: var(--aci-radius);
	background: #fff;
	margin-bottom: 14px;
	overflow: hidden;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.sessionItem:hover {
	border-color: var(--aci-primary);
	box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, .12);
}

.sessionHeader {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 18px;
	padding: 16px 22px;
	cursor: pointer;
	background: var(--aci-header-bg);
	transition: background .2s ease;
}
.sessionTime {
	flex: 0 0 auto;
	width: var(--aci-time-width);
	max-width: var(--aci-time-width);
	font-family: var(--aci-title-font);
	font-weight: 600;
	font-size: 1rem;
	color: var(--aci-primary);
}
.sessionTitle {
	flex: 1 1 auto;
	font-family: var(--aci-title-font);
	font-weight: 500;
	font-size: 1rem;
	line-height: 1.35;
	color: var(--aci-text);
}

/* Highlighted sessions */
.sessionItem.highlighted > .sessionHeader {
	background: var(--aci-highlight-bg);
}
.sessionItem.highlighted > .sessionHeader .sessionTime {
	color: #fff;
}

/* Plus / minus icon */
.headerIcon {
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	position: relative;
	color: var(--aci-text);
}
.aci-plus,
.aci-plus::before {
	position: absolute;
	background: currentColor;
	border-radius: 2px;
}
.aci-plus {
	top: 50%;
	left: 50%;
	width: 15px;
	height: 2.5px;
	transform: translate(-50%, -50%);
}
.aci-plus::before {
	content: "";
	top: 50%;
	left: 50%;
	width: 2.5px;
	height: 15px;
	transform: translate(-50%, -50%);
	transition: transform .2s ease, opacity .2s ease;
}
.sessionHeader.is-open .aci-plus::before {
	transform: translate(-50%, -50%) rotate(90deg);
	opacity: 0;
}

/* Expandable body */
.sessionInfos {
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	background: var(--aci-body-bg);
	transition: max-height .28s ease, opacity .28s ease, padding .28s ease;
	padding: 0 22px;
}
.sessionInfos[hidden] {
	display: none;
}
.sessionHeader.is-open + .sessionInfos {
	opacity: 1;
	padding-top: 18px;
	padding-bottom: 22px;
}

/* Info rows (date / type / location) */
.sessionInfoRow {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 10px;
	color: var(--aci-text);
}
.sessionInfoIcon {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	color: var(--aci-primary);
	display: inline-flex;
}
.sessionInfoIcon svg {
	width: 100%;
	height: 100%;
}
.sessionInfoText {
	font-size: .95rem;
}
.sessionDescription {
	color: var(--aci-text);
	line-height: 1.65;
	margin: 12px 0 18px;
}
.sessionDescription p {
	font-family: var(--aci-name-font);
	color: black !important;
}

/* ---------- Speakers ---------- */
.sessionSpeakers {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	align-items: stretch;
	margin-top: 6px;
}
.moderatedBy {
	flex: 1 0 100%;
	margin: 6px 0 -4px;
	font-style: italic;
	color: var(--aci-muted);
	font-weight: 600;
}
.aci-speaker {
	flex: 0 0 auto;
}
/* Picture → name → role → company, stacked vertically, no bordered box.
   Selectors are prefixed with .aci-programme and use !important on the reset
   so theme/Elementor default <button> styles (which have higher specificity
   via button:hover) can't add a border or background. */
.aci-programme .meetSpeaker,
.aci-programme .meetSpeaker:hover,
.aci-programme .meetSpeaker:focus,
.aci-programme .meetSpeaker:active,
.aci-programme .speakerPhotoWrap,
.aci-programme .speakerPhotoWrap:hover,
.aci-programme .speakerPhotoWrap:focus,
.aci-programme .speakerPhotoWrap:active {
	-webkit-appearance: none;
	appearance: none;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	outline: none;
	border-radius: 0;
}
.aci-programme .meetSpeaker {
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	cursor: default;
	text-align: center;
	width: 170px;
	height: 100%;
	user-select: text;
	-webkit-user-select: text;
}
.aci-programme .sessionSpeakers .meetSpeaker .speakerPhotoWrap {
	display: block;
	width: var(--aci-photo-size, 80px);
	height: var(--aci-photo-size, 80px);
	flex: 0 0 auto;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	cursor: pointer;
	user-select: none;
	-webkit-user-select: none;
}
.aci-programme .sessionSpeakers .meetSpeaker .speakerPhotoWrap:focus-visible {
	outline: 2px solid var(--aci-primary);
	outline-offset: 3px;
}
.aci-programme .sessionSpeakers .meetSpeaker .speakerPhoto {
	width: var(--aci-photo-size, 80px) !important;
	height: var(--aci-photo-size, 80px) !important;
	max-width: var(--aci-photo-size, 80px) !important;
	min-width: 0 !important;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}
.speakerText {
	display: flex;
	flex-direction: column;
	gap: 3px;
}
.speakerName {
	font-family: var(--aci-name-font);
	font-weight: 700;
	color: var(--aci-speaker-name);
	font-size: 1rem;
	line-height: 1.25;
}
.speakerRole, .sessionDescription p {
	font-family: var(--aci-name-font);
	font-size: .92rem;
	font-weight: 400;
	color: var(--aci-text);
	line-height: 1.3;
}
.speakerCompany {
	font-family: var(--aci-name-font);
	font-size: .92rem;
	font-weight: 700;
	color: var(--aci-text);
	line-height: 1.3;
}

/* ---------- Modal ---------- */
.modal {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 99999;
	background: rgba(10, 20, 45, .55);
	padding: 24px;
	align-items: center;
	justify-content: center;
}
.modal.is-open {
	display: flex;
	animation: aci-fade .18s ease;
}
.modal__inner {
	background: #fff;
	border-radius: 14px;
	max-width: 520px;
	width: 100%;
	max-height: 85vh;
	overflow: auto;
	padding: 36px;
	position: relative;
	text-align: center;
}
.aci-programme .modal__close {
	position: absolute;
	top: 12px;
	right: 16px;
	border: 0;
	background: transparent;
	font-size: 30px;
	line-height: 1;
	color: var(--aci-muted);
	cursor: pointer;
	padding: 0;
	width: 40px;
	height: 40px;
}
.modal__photo .speakerPhoto {
	width: 140px;
	height: 140px;
	border-radius: 50%;
	object-fit: cover;
	margin: 0 auto 18px;
	display: block;
}
.modal__linkedin {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	margin-top: 16px;
	color: #fff;
	background: #0a66c2;
	transition: transform .15s ease, opacity .15s ease;
}
.modal__linkedin:hover {
	transform: translateY(-2px);
	opacity: .9;
}
.modal__linkedin svg {
	width: 20px;
	height: 20px;
}
.modal__name {
	margin: 0 0 6px;
	font-family: var(--aci-name-font);
	font-weight: 800;
	text-transform: uppercase;
	font-size: 1.4rem;
	color: var(--aci-speaker-name);
}
.modal__role,
.modal__company {
	margin: 0;
	color: var(--aci-muted);
	font-family: var(--aci-name-font);
}
.modal__company {
	font-weight: 600;
}
.modal__bio {
	margin-top: 18px;
	text-align: left;
	line-height: 1.65;
}
body.aci-modal-open {
	overflow: hidden;
}

.aci-empty {
	color: var(--aci-muted);
	font-style: italic;
}

/* ---------- Responsive ---------- */
@media (max-width: 768px) {
	.sessionHeader {
		flex-wrap: wrap;
		gap: 6px 14px;
	}
	.sessionTime {
		width: auto;
		max-width: none;
	}
	.sessionTitle {
		flex: 1 1 100%;
		order: 3;
	}
}
@media (max-width: 600px) {
	.sessionSpeakers { justify-content: center; gap: 22px 14px; }
	.meetSpeaker { width: 45%; min-width: 130px; }
}