@charset "UTF-8";
@import url("animate.min.css");
@import url("extra/logos.css");
@import url("themes/ss27.css");
@import url("themes/fw26.css");
@import url("themes/ism26.css");
@import url("themes/ss26.css");
@import url("themes/fw25.css");
@import url("themes/ism25.css");
@import url("themes/ss25.css");
@import url("themes/fw24.css");
@import url("themes/ism24.css");
@import url("themes/ss24.css");
@import url("themes/fw23.css");
@import url("themes/ism23.css");
@import url("themes/ss23.css");
@import url("themes/fw22.css");
@import url("themes/ism22.css");
@import url("themes/ss22.css");
@import url("themes/fw21.css");
@import url("themes/ism21.css");
@import url("themes/ss21.css");
@import url("themes/fw20.css");

/* IMPORTANT: change display font declaration based on the default (current event).
Only the current one and the previous one (until event is open) have to be loaded eagerly */
@import url("fonts/fw26.css");
@import url("fonts/ism26.css");

@font-face {
	font-family: 'Archivo';
	src: url('../../../css/fonts/archivo/archivo-variable.ttf') format('truetype');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Archivo';
	src: url('../../../css/fonts/archivo/archivo-italic-variable.ttf') format('truetype');
	font-weight: 100 900;
	font-style: italic;
	font-display: swap;
}

:root {
	--bs-body-font-family: 'Archivo', sans-serif;
	--body-font-family: var(--bs-body-font-family);
	--display-font-family: 'Impact LT Std', serif;

	--color-1: oklch(var(--palette-1));
	--color-2: oklch(var(--palette-2));
	--color-3: oklch(var(--palette-3));
	--color-4: oklch(var(--palette-4));
	--color-5: oklch(var(--palette-5));
	--color-6: oklch(var(--palette-6));
	--color-neutral: oklch(var(--palette-neutral));
	--color-disabled: oklch(var(--palette-disabled));
	--color-disabled-text: oklch(var(--palette-disabled-text));
	--color-error: oklch(var(--palette-error));
	--palette-black: 15.43% 0 0;
	--color-black: oklch(var(--palette-black));

	/* IMPORTANT: When changing event, paste below the properties as overridden by the event's theme */

	--palette-1: 72.46% 0.1883 50.55;
	--color-1-hex: #FF7B08;

	--palette-2: 67.3% 0.1469 245.48;
	--color-2-hex: #369DEA;

	--palette-3: 51.12% 0.1593 31.7;
	--color-3-hex: #AF3724;

	--palette-4: 36.03% 0.2035 270.03;
	--color-4-hex: #1E1EA5;

	--palette-neutral: 65.67% 0 0;
	--color-neutral-hex: #919191;

	--palette-disabled: 81.41% 0 0;
	--color-disabled-hex: #C2C2C2;

	--palette-disabled-text: 44.95% 0 0;
	--color-disabled-text-hex: #555555;

	--palette-error: 47% 0.1825 24;
	--color-error-hex: #aa1021;

	--scrollbar-color: white;
	--scrollbar-border-color: var(--color-1);
	--scroll-down-mask-image: linear-gradient(
			to bottom,
			rgba(0, 0, 0, 0) 0,
			rgba(0, 0, 0, 1) 0,
			rgba(0, 0, 0, 1) calc(100% - 2rem),
			rgba(0, 0, 0, 0) 100%
	);
	--scroll-right-mask-image: linear-gradient(
			to right,
			rgba(0, 0, 0, 0) 0,
			rgba(0, 0, 0, 1) 0,
			rgba(0, 0, 0, 1) calc(100% - 2rem),
			rgba(0, 0, 0, 0) 100%
	);
	--btn-bg-color: white;
	--btn-color: var(--color-4);
	--btn-secondary-bg-color: var(--color-2);
	--btn-secondary-color: white;
	--btn-link-hover-color: var(--color-4);
	--br: 0.25rem;
	--slider-thumb-bg-color: var(--color-3);
	--slider-track-bg-color: white;

	--body-bg: var(--color-1);
	--body-bg-position: top left;
	--body-notch-bg-color: var(--color-1);
	--body-text-color: white;
	--body-bg-before: url('background/desktop/ss27/bg-ker-top.svg');
	--body-bg-after: url('background/desktop/ss27/bg-ker-bottom.svg');
	--body-bg-before-width: 140%;
	--body-bg-before-max-width: 2000px;
	--body-bg-after-width: 100%;
	--body-bg-after-max-width: 450px;
	--input-color: white;
	--form-error-bg-color: var(--color-error);
	--form-error-color: white;

	--modal-bg-color: var(--color-3);
	--modal-text-color: white;

	--logo-color: white;
	--header-py: 1rem;
	--header-px: 4rem;
	--header-display-font-size: 1.125rem;
	--header-menu-bg-color: var(--color-4);
	--header-menu-color: white;
	--header-menu-btn-bg-color: var(--color-2);
	--header-menu-btn-color: var(--color-4);
	--notification-comment-bg-color: white;
	--notification-comment-text-color: var(--color-1);

	--flow-v-nav-right: var(--header-px);
	--flow-v-nav-active-bg: var(--color-2);
	--flow-v-nav-active-color: var(--color-4);
	--flow-v-nav-inactive-bg: var(--color-2);
	--flow-v-nav-inactive-color: white;
	--flow-v-nav-hover-bg: var(--color-4);
	--flow-v-nav-hover-color: white;
	--flow-v-nav-tooltip-bg: var(--flow-v-nav-hover-bg);
	--flow-v-nav-tooltip-color: var(--flow-v-nav-hover-color);

	--flow-h-nav-bg: var(--color-2);
	--flow-h-nav-color: white;
	--flow-h-nav-active-bg: var(--color-2);
	--flow-h-nav-active-color: var(--color-4);

	--title-color: white;
	--title-shadow-color: oklch(var(--palette-4) / 25%);
	--title-shadow-stroke: 10px;
	--title-shadow-offset-x: 0;
	--title-shadow-offset-y: 0;

	--title-font-weight: 900;
	--section-title-mb: 1rem;
	--sub-section-title-bg: var(--color-2);
	--sub-section-title-color: var(--color-4);
	--video-card-shadow-color: white;
	--video-duration-bg: oklch(var(--palette-4) / 75%);

	--countdown-number-gradient-top: var(--color-4);
	--countdown-number-gradient-bottom: var(--color-3);
	--agenda-mt: clamp(0rem, 5vh - 2.5rem, 3rem);
	--agenda-gap: 2px;
	--agenda-odd-bg: var(--color-2);
	--agenda-odd-color: white;
	--agenda-even-bg: white;
	--agenda-even-color: var(--color-4);
	--agenda-body-zoom: 0.85;
	--stage-card-bg: white;
	--stage-card-color: var(--color-4);

	--survey-odd-bg: var(--agenda-odd-bg);
	--survey-odd-color: var(--agenda-odd-color);
	--survey-even-bg: var(--agenda-even-bg);
	--survey-even-color: var(--agenda-even-color);
	--survey-color: white;
	--survey-divider-color: white;

	--products-fav-empty-bg: oklch(0 0 0 / 25%);
	--products-fav-empty-color: white;
	--filters-bg: oklch(var(--palette-3) / 50%);
	--filters-sticky-bg: var(--color-3);
	--filter-chip-active-bg: var(--color-2);
	--filter-chip-active-color: white;
	--filter-dropdown-bg: var(--color-3);
	--filter-dropdown-color: white;
	--filter-reset-bg: var(--filter-dropdown-bg);
	--filter-reset-color: var(--filter-dropdown-color);

	--leaderboard-banner-bg: var(--color-3);
	--leaderboard-banner-text: white;
	--leaderboard-pill-bg: var(--leaderboard-banner-bg);
	--leaderboard-pill-text: var(--leaderboard-banner-text);
	--leaderboard-text: white;
	--leaderboard-highlight-bg-color: transparent;
	--leaderboard-divider: var(--color-3);

	--map-water: var(--color-2-hex);
	--map-land: #2d2a3f;
	--map-land-alt: #252238;
	--map-border: #3f3b54;
	--map-cluster-core: var(--color-3-hex);
	--map-cluster-glow: #FF745647;
	--map-cluster-ring: #FF745666;
	--map-panel-bg: var(--color-3);
	--map-panel-border: #FF745626;
	--map-popup-scrollbar-color: white;
	--map-popup-scrollbar-border-color: var(--color-3);
	--map-text: #ffffff;
	--map-text-muted: #ffffff80;
	--map-accent: var(--color-1-hex);
	--map-accent-soft: #FF74561f;
	--map-cyan: var(--color-2-hex);

	--login-h1-font: clamp(4rem, 5vw, 6rem) var(--display-font-family);
	--login-h2-font: clamp(1.5rem, 5vw, 2rem) var(--display-font-family);
	--login-btn-font: 1rem var(--display-font-family);
	--keynote-comp-bg-color: var(--color-3);
	--keynote-comp-text-color: white;
	--login-input-bg-color: white;
	--login-input-text-color: var(--color-2);

	--thanks-to-color: white;
	--thanks-to-accent-color: var(--title-shadow-color);

	--faq-color: var(--thanks-to-color);
	--faq-accent-color: var(--thanks-to-accent-color);

	/* Keynote */
	--conf-banner-bg-color: var(--color-3);
	--conf-banner-color: white;
	--conf-banner-border: 3px solid currentColor;
	--video-outline-color: var(--color-2);
	--chat-bg-color: white;
	--chat-color: var(--color-4);
	--chat-input-color: var(--color-4);
	--chat-input-border: 2px solid var(--color-4);
	--chat-input-br: 0.5rem;
	--chat-pinned-bg-color: white;
	--chat-pinned-color: var(--color-4);
	--chat-mentions-bg-color: var(--color-3);
	--chat-mentions-color: white;
	--reactions-color: white;
	--btm-spacing: 2rem;
	--activity-map-bg: var(--color-3);
	--map-br: var(--br);
	--map-container-border-color: var(--color-3);
	--bb-bg-color: var(--color-2);
	--bb-color: var(--color-4);
}

/* Replace with the current active theme */
/* Keynote overrides */
body.keynote-ss27,
body.keynote-ss27-2nd {
	--header-points-bg: var(--btn-bg-color);
	--header-points-color: var(--btn-color);
	--agenda-counter-active-bg-color: var(--color-3);
	--agenda-mt: 0;
	--agenda-gap: var(--btm-spacing);
	--section-title-mb: 0;
	--agenda-body-p: 1.5rem 1rem;
	--agenda-body-bg: var(--color-3);
	--agenda-odd-bg: var(--agenda-body-bg);
	--agenda-odd-color: white;
	--agenda-even-bg: var(--agenda-odd-bg);
	--agenda-even-color: var(--agenda-odd-color);
	--agenda-border: 2px solid currentColor;
	--agenda-before-odd-bg: white;
	--agenda-before-even-bg: var(--agenda-before-odd-bg);
	--agenda-title-transform: uppercase;
	--agenda-title-size: clamp(1rem, 2vw, 1.25rem);
	--brand-speakers-bg: var(--modal-bg-color);
	--map-container-border-color: var(--color-3);
	--survey-odd-bg: var(--color-3);
	--survey-odd-color: white;
	--survey-even-bg: var(--color-3);
	--survey-even-color: white;
	--survey-index-border: 2px solid currentColor;
	--survey-question-line-bg: white;
	--survey-overlay-bg: var(--color-3);
	--survey-section-p: 2rem 1rem;
	--leaderboard-banner-bg: var(--color-3);
	--leaderboard-pill-bg: var(--color-3);
	--leaderboard-divider: var(--color-3);
	--live-poll-bg-color: var(--color-3);
	--live-poll-color: white;
	--btn-report-bg-color: var(--color-error);
	--btn-report-color: white;
}

/* Defaults for brand pages */
:root[data-brand] {
	--brand-competitors-bg: var(--brand-portfolio-bg);
	--brand-competitors-color: var(--brand-portfolio-color);
}

@media screen and (max-width: 768px) {
	:root {
		--body-bg-position: top left;
		--body-bg-before-width: 200%;
		--body-bg-before-max-width: 850px;
		--body-bg-after-width: 200%;
		--body-bg-after-max-width: 250px;
		--header-py: 1rem;
		--header-px: 0.875rem;
		--flow-v-nav-right: 0.25rem;
	}
}

/* START theme-independent block */

html {
	overflow-x: hidden;
}

body {
	position: relative;
	background-color: var(--body-notch-bg-color, white);
}

body.login #wraplog > #header,
body.login #wraplog > #pwb {
	display: none;
}

main[data-page-shell="true"] {
	background: var(--body-bg);
}

main[data-page-shell="true"]::before {
	background-image: var(--body-bg-before);
}

main[data-page-shell="true"]::after {
	background-image: var(--body-bg-after);
}

/* ===== Typography ===== */

.font-normal {
	font-family: var(--body-font-family);
	font-optical-sizing: auto;
	font-style: normal;
	font-variation-settings: "wdth" 100;
}

.font-wide {
	font-family: var(--body-font-family);
	font-optical-sizing: auto;
	font-style: normal;
	font-variation-settings: "wdth" 125;
}

/* ===== Buttons ===== */

a, button {
	display: block;
	border-radius: 0.25rem;
	padding: 0.5em;
	font-family: var(--body-font-family);
	font-size: 1rem;
	font-optical-sizing: auto;
	font-weight: 600;
	font-style: normal;
	font-variation-settings: "wdth" 125;
	line-height: 1;
	text-decoration: none;
	text-transform: uppercase;
	cursor: pointer;
}

a:disabled, button:disabled {
	cursor: not-allowed;
}

a {
	color: inherit;
}

a:hover {
	background-color: var(--link-hover-bg-color, rgba(255, 255, 255, 0.08));
	color: inherit;
}

:where(a, button).btn-icon {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

:where(a, button).btn-sm,
:where(a, button).btn-link {
	font-size: 0.875rem;
	font-weight: 500;
	font-variation-settings: "wdth" 100;
	text-transform: none;
}

:where(a, button).btn-link:hover {
	background: none;
	text-decoration: underline;
}

/* Bootstrap primary button */
.btn {
	--bs-btn-font-weight: 600;
	--bs-link-color: var(--btn-link-color, var(--body-text-color));
	--bs-link-hover-color: var(--btn-link-hover-color, var(--btn-bg-color));
	padding: 0.75em 1em;
}

.btn-primary {
	--bs-btn-bg: var(--btn-bg-color);
	--bs-btn-color: var(--btn-color);
	--bs-btn-border-color: var(--bs-btn-bg);
	--bs-btn-hover-bg: var(--btn-color);
	--bs-btn-hover-color: var(--btn-bg-color);
	--bs-btn-hover-border-color: var(--bs-btn-hover-bg);
	--bs-btn-disabled-color: var(--color-disabled-text);
	--bs-btn-disabled-bg: var(--color-disabled);
	--bs-btn-disabled-border-color: var(--color-disabled);
	--bs-btn-disabled-opacity: 1;
}

.btn-outline-primary {
	--bs-btn-color: var(--btn-bg-color);
	--bs-btn-border-color: currentColor;
	--bs-btn-hover-bg: var(--btn-bg-color);
	--bs-btn-hover-color: var(--btn-color);
	--bs-btn-disabled-color: var(--color-disabled);
	--bs-btn-disabled-border-color: var(--color-disabled);
}

.btn-secondary {
	--bs-btn-bg: var(--btn-secondary-bg-color);
	--bs-btn-color: var(--btn-secondary-color);
	--bs-btn-border-color: var(--bs-btn-bg);
	--bs-btn-hover-bg: white;
	--bs-btn-hover-color: var(--color-black);
}

.btn-secondary:hover {
	color: var(--bs-btn-hover-color) !important;
}

.btn-link {
	--bs-btn-disabled-color: var(--btn-link-disabled-color, var(--color-disabled-text));

	display: flex;
	align-items: center;
	text-decoration: underline;
}

[type=button]:not(:disabled),
[type=reset]:not(:disabled),
[type=submit]:not(:disabled),
button:not(:disabled),
a:not(:disabled),
.btn {
	cursor: var(--btn-cursor, pointer) !important;
}

/* ===== Accordion ===== */
.accordion {
	--bs-accordion-border-color: transparent;
	--bs-accordion-inner-border-radius: 0;
	--bs-accordion-bg: transparent;
	--bs-accordion-active-bg: transparent;
	--bs-accordion-btn-padding-x: 0;
	--bs-accordion-btn-padding-y: 1rem;
	--bs-accordion-body-padding-x: 0;
	--bs-accordion-body-padding-y: 0.25rem;
}

.accordion-button::after {
	--bs-accordion-btn-icon: none;
	--bs-accordion-btn-active-icon: none;
	background-image: none !important;
	content: "\f067"; /* plus */
	font-family: "Font Awesome 7 Pro";
	font-weight: 900;
	font-size: 1rem;
	line-height: 1;
	width: 1.25rem;
	height: 1.25rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transform: none !important;
}

.accordion-button:not(.collapsed)::after {
	content: "\f068"; /* minus */
}

/* ===== Scrollbar ===== */
*::-webkit-scrollbar {
	width: 0.5rem;
	height: 0.5rem;
}

*::-webkit-scrollbar-track-piece {
	background-color: var(--scrollbar-color);
	border-radius: 0.25rem;
	border: 0.2rem solid var(--scrollbar-border-color, transparent);
	background-clip: padding-box;
}

*::-webkit-scrollbar-thumb {
	border-radius: 0.25rem;
	background: var(--scrollbar-color);
}

/* Firefox, hack to target only it to avoid different style on chromium */
@-moz-document url-prefix() {
	* {
		scrollbar-width: thin;
		scrollbar-color: var(--scrollbar-color) var(--scrollbar-border-color, transparent);
	}
}

/* ===== Slider ===== */

input[type="range"] {
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	background: transparent;
}

/* WebKit track */
input[type="range"]::-webkit-slider-runnable-track {
	height: 6px;
	background: var(--slider-track-bg-color);
	border-radius: 999px;
}

input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 18px;
	height: 18px;
	background: var(--slider-thumb-bg-color);
	border-radius: 50%;
	margin-top: -6px;
	border: none;
}

/* Firefox track */
input[type="range"]::-moz-range-track {
	height: 6px;
	background: var(--slider-track-bg-color);
	border-radius: 999px;
}

input[type="range"]::-moz-range-progress {
	height: 6px;
	background: var(--slider-thumb-bg-color);
	border-radius: 999px;
}

input[type="range"]::-moz-range-thumb {
	width: 18px;
	height: 18px;
	background: var(--slider-thumb-bg-color);
	border: none;
	border-radius: 50%;
}

/* ===== Modal ===== */
.modal {
	--bs-modal-bg: var(--modal-bg-color);
	--bs-modal-color: var(--modal-text-color);
	--bs-border-color: var(--bs-modal-bg);
}

.modal.modal-confidentiality-undertaking {
	font-size: 1.125rem;
}

.modal.modal-confidentiality-undertaking > .modal-dialog {
	max-width: 95vw;
	margin: auto;
}

.modal.modal-confidentiality-undertaking :is(.modal-header, .modal-footer) {
	justify-content: center;
}

.modal.modal-confidentiality-undertaking .modal-title {
	font-size: 1.5rem;
	text-transform: uppercase;
}

.modal.modal-confidentiality-undertaking .btn {
	--bs-btn-font-size: 1rem;
}

/* ===== Misc utils ===== */
.mask-down {
	mask-image: var(--scroll-down-mask-image);
	-webkit-mask-image: var(--scroll-down-mask-image);
}

.mask-right {
	mask-image: var(--scroll-right-mask-image);
	-webkit-mask-image: var(--scroll-right-mask-image);
}

.hidden {
	display: none !important;
}