/**
 * Theme Name: doha IX Theme
 * Template: twentytwentyfive
 * Requires at least: 6.8
 * Requires PHP: 8.2
 * Version: 1.0
 * Text Domain: dohaix
 * License: private
 */

main {
	.entry-content {
		h1:first-of-type {
			margin-top: var(--wp--preset--spacing--40);
		}
	}
}

strong {
	font-weight: 500;
}

.wp-block-table.is-style-stripes {
	border: none;

	tr:nth-child(odd) td {
		background-color: var(--wp--preset--color--accent-1);
	}

	tr:nth-child(even) td {
		background-color: var(--wp--preset--color--accent-2);
	}
}

body > .wp-site-blocks > header {
	color: var(--wp--preset--color--contrast-inverted);
	background-color: var(--wp--preset--color--contrast);
}

.wp-block-navigation:not(.has-text-color) .wp-block-navigation__submenu-container {
	color: var(--wp--preset--color--contrast-inverted) !important;
}

:where(.wp-block-cover-image.is-light:not(.has-text-color)), :where(.wp-block-cover.is-light:not(.has-text-color)) {
	color: var(--wp--preset--color--contrast);
}

header {
	& .wp-block-navigation-item.has-child.open-on-hover-click.wp-block-navigation-submenu {
		> a {
			font-weight: 500;
		}
	}
}

.is-style-footer {
	color: var(--wp--preset--color--contrast-inverted);
	background-color: var(--wp--preset--color--accent-4);

	h2 {
		margin-top: 0;
		padding-bottom: var(--wp--preset--spacing--10);
		border-bottom: 1px solid var(--wp--preset--color--base);
		color: var(--wp--preset--color--base);
	}

	h2 + p,
	h2 + nav {
		margin-top: var(--wp--preset--spacing--20);
	}

	.wp-block-page-list {
		gap: var(--wp--preset--spacing--20);
	}
}

.is-style-page-teaser {
	position: relative;
	overflow: hidden;
	background-color: var(--wp--preset--color--accent-5);
	color: var(--wp--preset--color--contrast-inverted);
	aspect-ratio: 1;

	img {
		width: 100%;
		height: 100%;
		transition: opacity 0.5s ease-in-out;
		opacity: 1;
	}

	&:hover {
		img {
			opacity: 0.65;
		}
	}

	h2, p {
		pointer-events: none;
	}

	h2 {
		position: absolute !important;
		display: inline-block;
		font-weight: 500;
		bottom: var(--wp--preset--spacing--30);
		left: var(--wp--preset--spacing--30);
		padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
		margin-right: var(--wp--preset--spacing--30);
		background-color: var(--wp--preset--color--base);
		color: var(--wp--preset--color--contrast);
		font-size: var(--wp--preset--font-size--large);
	}

	p {
		font-size: var(--wp--preset--font-size--small);
		line-height: var(--wp--preset--font-size--small);
		font-weight: 500;
		position: absolute !important;
		top: 0;
		left: var(--wp--preset--spacing--30);
		display: inline-block;
		margin: 0;
		margin-right: var(--wp--preset--spacing--30);
		padding: 0.33em var(--wp--preset--spacing--20);
		color: var(--wp--preset--color--contrast-inverted);
		background-color: var(--wp--preset--color--contrast);
	}

	a {
		width: 100%;
	}
}

.is-style-arrow-link .wp-element-button {
	padding-left: calc(var(--_arrow-size) + 0.4em);
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path fill='rgb(178,34,34)' d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z'/></svg>");
	background-repeat: no-repeat;
	background-position: left 0.25em;
	background-size: var(--_arrow-size);
	--_arrow-size: 0.5em;
}

/* Forms */
label {
	font-size: var(--wp--preset--font-size--form-label);
	font-weight: 500;
	display: block;
}

textarea,
input {
	font-family: inherit;
	font-size: var(--wp--preset--font-size--medium);
	line-height: var(--wp--preset--font-size--medium);
	box-sizing: border-box;
	border-radius: var(--wp--custom--border-radius--default);
}

input {
	padding: 0.75rem 1rem;
}

textarea {
	padding: 0.9rem 1rem;
}

textarea,
select,
input[type="text"],
input[type="tel"],
input[type="number"],
input[type="url"],
input[type="search"],
input[type="date"],
input[type="email"] {
	width: 100%;
	color: #555;
	border: 1px solid #ccc;
	background-color: #fff;
}

select {
	font-size: 1rem;
	padding: 0.75rem 1rem;
	color: var(--wp--preset--color--contrast);
	border-radius: var(--wp--custom--border-radius--default);
}

.form-row,
.form-row > p {
	display: flex;
	margin: 0;

	padding: 0;
	gap: var(--wp--preset--spacing--40);

	> * {
		flex: 1;
	}

	br {
		display: none;
	}
}

/* Contact Form 7 */
.wpcf7 {
	.wpcf7-not-valid-tip {
		margin-top: var(--wp--preset--spacing--10);
		color: var(--wp--preset--color--contrast);
	}


	.wpcf7-checkbox {
		display: grid;
		padding-top: var(--wp--preset--spacing--20);
		grid-template-columns: max-content max-content;
		gap: 1rem;

		label {
			font-size: 1rem;

			font-weight: 300;
			position: relative;
			display: flex;

			align-items: center;

			min-height: 25px;
			padding-left: 35px;
			cursor: pointer;
			-moz-user-select: none;
			-ms-user-select: none;
			-webkit-user-select: none;
			user-select: none;
			vertical-align: middle;

			input {
				position: absolute;
				width: 0;
				height: 0;
				cursor: pointer;
				opacity: 0;
			}

			.wpcf7-list-item-label::before {
				position: absolute;
				top: 0;
				left: 0;
				display: block;
				width: 25px;
				height: 25px;
				border: 1px solid #ccc;
				border-radius: var(--wp--custom--border-radius--default);
				background-color: #fff;
			}

			&:has(input:checked) .wpcf7-list-item-label::before {
				line-height: 26px;
				content: '✓';
				text-align: center;
				color: #fff;
				background-color: var(--wp--preset--color--accent-1);
			}
		}

		.wpcf7-list-item {
			margin: 0;
		}
	}


	form .wpcf7-response-output {
		margin: 2em 0 1em;
		padding: 0.75em 0.75em 0.5em;
		border: none;
		border-radius: var(--wp--custom--border-radius--default);
	}

	form.sent .wpcf7-response-output {
		color: var(--wp--preset--color--contrast-success);
		background-color: var(--wp--preset--color--base-success);
	}

	form.invalid .wpcf7-response-output,
	form.unaccepted .wpcf7-response-output,
	form.payment-required .wpcf7-response-output {
		color: var(--wp--preset--color--contrast-warning);
		background-color: var(--wp--preset--color--base-warning);
	}
}

/* Core block styles */
.wp-block-details {
	padding: var(--wp--preset--spacing--40) 0 calc(var(--wp--preset--spacing--40) - 0.1em);

	border-bottom: 1px solid var(--wp--preset--color--accent-4);

	&:first-of-type {
		border-top: 1px solid var(--wp--preset--color--accent-4);
	}

	& + details {
		margin-top: 0;
	}

	summary {
		font-size: var(--wp--preset--font-size--large);
		font-weight: 700;
		display: flex;
		align-items: center;
		justify-content: space-between;
		list-style: none;
		cursor: pointer;
		color: var(--wp--preset--color--contrast);

		&:focus {
			outline: none;
		}

		&::marker {
			display: none;
		}

		&::after {
			font-size: var(--wp--preset--font-size--x-large);
			line-height: 0.8em;
			content: '+';
		}
	}

	&[open] summary::after {
		content: '-';
	}
}

/* Newsletter registration form in footer */
footer {
	.wp-element-button {
		background-color: var(--wp--preset--color--base);
		border-color: transparent;
		border-width: 1px;
		border-style: solid;
		color: var(--wp--preset--color--contrast);
		border-radius: var(--wp--custom--border-radius--default);

		&:hover {
			background-color: var(--wp--preset--color--contrast);
			border-color: var(--wp--preset--color--base);
			color: var(--wp--preset--color--base);
		}
	}

	.wp-block-decix-newsletter-registration {
		margin-top: -0.6em;
	}
}

/* WP Navigation */
header {

	.wp-block-navigation__container.wp-block-navigation {
		gap: 2rem;
	}

	.wp-block-navigation-item.has-child.open-on-hover-click.wp-block-navigation-submenu {
		> a {
			font-weight: 500;
			padding-bottom: 0.25em;
			border-bottom: 3px solid transparent;

			&:hover {
				text-decoration: none;
				color: var(--wp--preset--color--accent-1);
				border-bottom: 3px solid var(--wp--preset--color--accent-1);
			}
		}

		button {
			display: none;
		}
	}

	.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
		border: none;

		background-color: var(--wp--preset--color--base-2) !important;

		.wp-block-navigation-item.wp-block-navigation-link {
			font-weight: 500;
			padding: 0.25em 0.25em calc(0.25em - 3px);
			border-bottom: 3px solid transparent;

			&:hover {
				border-bottom: 3px solid var(--wp--preset--color--accent-1);
				background-color: var(--wp--preset--color--accent-4) !important;

				a {
					text-decoration: none !important;
				}

			}

		}

	}
}
