/***
  This CSS will be included in WordCamp Europe 2026 every time
  you will make a repository commit and reload remote CSS from the website
  admin view (Appearance -> Remote CSS) or visiting
  https://europe.wordcamp.org/2026/wp-admin/admin-ajax.php?action=wcrcss_webhook
  https://europe.wordcamp.org/2026/ CSS will be synched with this file
 
  Development environment is on https://wceutest.wordcamp.org/2026 and also includes
  this remote CSS. Update CSS from the website admin view (Appearance -> Remote CSS)
  or visiting https://wceutest.wordcamp.org/2026/wp-admin/admin-ajax.php?action=wcrcss_webhook (ONLY FOR DEVELOPMENT)

  Don't use post IDs as selectors because they can change between development environment and production.
  Instead, use the slug; e.g. body.post-slug-call-for-volunteers, body.page-slug-accommodation or better,
  create a class and use it on the element because we can reuse these classes.
 
  CSS vars defined on website Theme (vars values can change during the development process):

  --wp--preset--color--custom-color-1: #05184d;
  --wp--preset--color--custom-color-2: #ff923d;
  --wp--preset--color--custom-color-3: #f92203;
  --wp--preset--color--custom-color-4: #234e8d;
  --wp--preset--color--custom-color-5: #75a8da;
  --wp--preset--color--custom-color-6: #346bec;
 
  --wp--preset--font-family--exquisans: Exquisans;
  --wp--preset--font-family--lato: Lato, sans-serif;

  Remote CSS seems to remove custom properties, so we only need them here as reference.

  --wp--style--global--content-size: 620px;
  --wp--style--global--wide-size: 1280px;

  //--width__blend-element: clamp( 40px, calc(-320px + 30vw), 400px ); screen size: 1200 - 2400
  //--height__blend-element: 100%;

  //--height__second-row: clamp( 60px, calc( 60px + 7.5vw ), 180px ); screen size: 0 - 1600
  //--height__third-row: clamp( 20px, calc( 20px + 2vw ), 40px ); screen size: 0 - 1000

  //--width__second-row-first-col: clamp( 200px, calc( 80px + 60vw ), 800px ); screen size: 200 - 1200

 Some custom properties for sizes, so we don't need to repeat the values.
 Most sizes use clamp() to have a min and max value, and a value that grows with the viewport width.
 The values in comments are the viewport width range where the value is applied.
 e.g 40px for 1200px screen, and 400px for 2400px screen. The inbetwen values are calculated by the browser.

---
***/
.wp-block-table tr:first-of-type {
	background: color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 6%, #fff);
	border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 18%, #0000);
	color: #111;
	font-weight: 700;
}

.wp-block-table td {
	border: none !important;
}

.wp-block-table {
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 18%, #0000);
	border-radius: 16px 3px;
}

.wp-block-buttons .wp-block-button__link {
	padding-block: .6em .3em !important;
}

.hero-frame-bg {
	background-repeat: repeat-x !important;
	background-size: auto 80px !important;
}

.newsletter-banner {
	overflow: hidden;
}

.newsletter-banner > figure > img {
	max-height: 330px;
}

@media screen and (max-width:1050px) {
	.newsletter-show-wide {
		display: none !important;
	}
}

@media screen and (min-width:1050px) {
	.newsletter-show-slim {
		display: none;
	}
}

/*
	START of the Organizers.
	For the usage with the (old) "Organizer list with bio (Organizers List)" block.
 */
/* Display flex is needed, so we can easily change the order of name + avatar */
.wordcamp-organizers {
	padding-inline-start: 0;
/* Remove default ul padding */
	display: flex;
	flex-direction: column;
}

.wordcamp-organizer {
	display: flex;
	flex-direction: column;
}

.wordcamp-organizer .wordcamp-image__avatar-container img {
	display: /* Make sure the image is block-level and no invisible margin is applied */
block;
	width: 100% !important;
/* Because we need to set a size on the avatar, we need to override it */
	height: auto !important;
	aspect-ratio: 1 / 1;
/* Keep it square */
}

.wordcamp-organizer .wordcamp-organizers__title {
	margin-top: 0;
	order: 2;
/* Show the name of the organizer after the avatar */
}

/* base styles for all images */
.wordcamp-organizers__title::before {
	content: '';
	display: block;
	width: 100%;
	height: clamp(43px, 4vw, 55px);
/* 16% container width */
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	margin-bottom: 10px;
/* Space between the image and the title */
}

/* Team lead image for the first element */
.wordcamp-post-list__post:first-child .wordcamp-organizers__title::before,
.team-communications .wordcamp-post-list__post:nth-child(2) .wordcamp-organizers__title::before {
	background-image: url('https://europe.wordcamp.org/2026/files/2025/12/team-lead.png');
	background-position: 100%;
}

/* Blue banner image for all other elements */
.wordcamp-post-list__post:not(:first-child) .wordcamp-organizers__title::before {
	background-image: url('https://europe.wordcamp.org/2026/files/2025/12/border-blue-2x.png');
}

.team-lead-organizers .wordcamp-post-list__post .wordcamp-organizers__title::before {
	background-image: url('https://europe.wordcamp.org/2026/files/2025/12/border-colors-trans-2x.png');
}

/* END of the Organizers */
/* Camptix block - tickets page */
.tix-js {
	font-size: 1.05em;
	line-height: 1.5;
}

.tix_tickets_table {
	border-spacing: 0;
	border-collapse: separate;
	width: 100%;
	background: #fff;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 18%, #0000);
	border-radius: 16px 3px;
	overflow: hidden;
}

.tix-js .tix_tickets_table th,
.tix-js .tix_tickets_table td {
	padding: 14px 16px;
}

.tix-js .tix_tickets_table thead th {
	background: color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 6%, #fff);
	border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 18%, #0000);
	color: #111;
	font-weight: 700;
}

.tix-js .tix_tickets_table tbody th,
.tix-js .tix_tickets_table tbody td {
	border-bottom: 1px solid color-mix(in srgb,
		color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 18%, #0000) 60%,
		#0000);
	text-align: center;
}

.tix-js .tix_tickets_table tbody th,
.tix-js .tix_tickets_table th.tix-column-description {
	text-align: left;
}

.tix-js .tix_tickets_table tbody .tix-ticket-title {
	font-weight: 800;
	letter-spacing: .01em;
}

.tix-js .tix_tickets_table .tix-ticket-excerpt {
	color: color-mix(in srgb, #000 55%, #0000);
}

.tix-js .tix_tickets_table tbody .tix-column-price,
.tix-js .tix_tickets_table tbody .tix-column-remaining {
	font-weight: 800;
	color: color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 65%, #111);
}

.tix_tickets_table input[type="text"],
.tix_tickets_table input[type="url"],
.tix_tickets_table input[type="email"],
.tix_tickets_table select,
.tix_tickets_table textarea {
	font-size: 1em;
	width: 90%;
	max-width: 100%;
	border: 1px solid color-mix(in srgb,
		color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 18%, #0000) 55%,
		#0000);
	border-radius: 12px;
	padding: 10px 12px;
	background: #fff;
	transition: border-color .15s ease, box-shadow .15s ease;
	box-sizing: border-box;
}

.tix_tickets_table textarea {
	height: 5em;
	resize: vertical;
}

.tix_tickets_table input[type="text"]:focus,
.tix_tickets_table input[type="url"]:focus,
.tix_tickets_table input[type="email"]:focus,
.tix_tickets_table select:focus,
.tix_tickets_table textarea:focus {
	outline: none;
	border-color: color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 55%, #0000);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 18%, #0000);
}

.tix-js .tix_tickets_table tbody .tix-column-quantity select {
	padding: 10px 12px;
}

.tix-js .tix_tickets_table.tix-order-summary {
	margin-top: 2rem;
}

.tix-js .tix_tickets_table.tix-order-summary .tix-row-total td:last-child {
	border-top: 2px solid color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 18%, #0000);
	font-weight: 800;
}

.tix-js .tix_tickets_table.tix-order-summary tbody th,
.tix-js .tix_tickets_table.tix-attendee-form tbody th,
.tix-js .tix_tickets_table.tix-order-summary tbody td,
.tix-js .tix_tickets_table.tix-attendee-form tbody td {
	border: none;
	padding: 10px 16px;
}

.tix-js .tix_tickets_table.tix-attendee-form .tix-left {
	text-align: right;
	padding-right: .75em;
	width: 40%;
	color: #111;
	font-weight: 650;
}

.tix-js .tix_tickets_table.tix-attendee-form .tix-right {
	text-align: left;
	padding-inline: .75em !important;
	width: 60%;
}

.tix-js .tix_tickets_table.tix-attendee-form .tix-left,
.tix-js .tix_tickets_table.tix-attendee-form .tix-right {
	padding-top: 1.1em;
}

.tix-js .tix_tickets_table.tix-attendee-form .tix-row-health-advisory .tix-left {
	text-align: left;
}

.tix-js .tix_tickets_table.tix-attendee-form .tix-row-health-advisory .tix-left p {
	margin-bottom: 1em;
}

.tix-js .tix_tickets_table.tix-attendee-form .tix-row-health-advisory .tix-left::after {
	content: none;
}

.tix-js .camptix-invoice-toggle-wrapper {
	display: block;
	margin: 2rem 0;
	padding: 1rem 1.1rem;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 18%, #0000);
	border-radius: 16px;
	background: color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 6%, #fff);
}

.tix-js .camptix-invoice-toggle-wrapper label {
	font-weight: 800;
}

.tix-js .camptix-invoice-toggle-wrapper table label {
	font-weight: 500;
}

.tix-js .camptix-invoice-toggle-wrapper .camptix-invoice-details {
	width: 100%;
	margin: 1rem 0 0;
}

.tix-js .camptix-invoice-toggle-wrapper .camptix-invoice-details td {
	border: none;
}

.tix-js .camptix-invoice-toggle-wrapper .camptix-invoice-details .tix-left {
	text-align: right;
	padding-right: .75em;
	width: 40%;
	font-weight: 650;
}

.tix-js .camptix-invoice-toggle-wrapper .camptix-invoice-details .tix-right {
	text-align: left;
	padding-left: .75em;
	width: 60%;
}

.tix-js .camptix-invoice-toggle-wrapper .camptix-invoice-details .tix-left,
.tix-js .camptix-invoice-toggle-wrapper .camptix-invoice-details .tix-right {
	padding-top: 1.1em;
	vertical-align: bottom;
}

.tix-js #tix-coupon-input {
	font-size: 1.1rem;
	padding: 12px 14px;
	border-radius: 12px;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 18%, #0000);
}

.tix-js .tix-submit {
	display: block;
	margin-bottom: 3em;
}

#tix input[type=submit],
.tix-checkout-button {
	box-shadow: var(--wp--preset--shadow--shadow-2);
	background-color: var(--wp--preset--color--accent);
	color: #fff;
	border-radius: 25px 3px 25px 3px !important;
	letter-spacing: .05em !important;
	font-weight: 700;
	font-family: var(--wp--preset--font-family--exquisans);
	padding-block: .6em .3em !important;
	font-size: 20px;
	padding-inline: 1em;
	border: none;
	text-transform: uppercase;
}

@media (max-width:767px) {
	.tix_tickets_table table,
		.tix_tickets_table thead,
		.tix_tickets_table tbody,
		.tix_tickets_table th,
		.tix_tickets_table td,
		.tix_tickets_table tr {
		display: block;
	}
	
	.tix_tickets_table thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	.tix_tickets_table td {
		border: 0;
		position: relative;
		padding-left: 50%;
		padding-top: 12px;
		padding-bottom: 12px;
	}
	
	.tix_tickets_table td:before {
		white-space: nowrap;
		font-weight: 700;
		color: color-mix(in srgb, #000 55%, #0000);
	}
	
	.tix-column-remaining::before {
		content: "Remaining: ";
	}
	
	.tix-column-quantity::before {
		content: "Quantity: ";
	}
	
	.tix-tickets-list .tix-column-description {
		padding: 0 !important;
		border: 0;
		text-align: center !important;
	}
	
	.tix-js .tix_tickets_table tbody .tix-ticket-title,
		.tix-js .tix_tickets_table tbody .tix-column-description {
		font-weight: 800;
		display: block;
		width: auto;
		background: color-mix(in srgb, var(--wp--preset--color--accent, #4f46e5) 6%, #fff);
		padding: 12px 16px;
	}
	
	.tix-js .tix_tickets_table .tix-column-description label + br {
		display: none;
	}
	
	.tix-js .tix_tickets_table tbody .tix-column-description {
		background: #fff;
		padding: 0;
	}
	
	.tix-js .tix_tickets_table .tix-ticket-excerpt {
		display: block;
		padding: 12px 16px;
		font-weight: 400;
		color: color-mix(in srgb, #000 55%, #0000);
	}
	
	.tix-ticket-form td.tix-left,
		.tix-private-form td.tix-left,
		.tix-attendee-form td.tix-left,
		.tix-receipt-form td.tix-left,
		.tix_invoice_table td.tix-left,
		.tix-ticket-form td.tix-right,
		.tix-private-form td.tix-right,
		.tix-attendee-form td.tix-right,
		.tix-receipt-form td.tix-right,
		.tix_invoice_table td.tix-right {
		width: 100% !important;
	}
	
	.tix-js .tix_tickets_table.tix-attendee-form .tix-right {
		padding-top: .5em !important;
		padding-left: 0;
		box-sizing: border-box;
	}
	
	.tix-js .tix_tickets_table.tix-attendee-form .tix-left,
		.tix-js .camptix-invoice-toggle-wrapper .camptix-invoice-details .tix-left {
		text-align: left !important;
		width: 100%;
		box-sizing: border-box;
	}
	
	.tix-attendee-form tr {
		padding-bottom: 28px !important;
	}
}

/* END Camptix block - tickets page */