/**
 * Перевизначення стилів шаблону.
 * Тут можна додавати правки без зміни скомпільованого Tailwind / style.min.css.
 */

/* Відстань під головним зображенням статті (між банером і текстом нижче) */
.article-featured-image-section {
	margin-bottom: 2.5rem;
}

@media (min-width: 768px) {
	.article-featured-image-section {
		margin-bottom: 3.5rem;
	}
}

/* Dynamic forms compatibility with Zen UI */
.form-group.input {
	margin-bottom: 1.25rem;
}

.form-group .input-field.error {
	border-color: #ef4444;
}

.field-error {
	display: block;
	margin-top: 0.25rem;
	color: #b91c1c;
	font-size: 0.75rem;
	line-height: 1rem;
}

.form-message {
	margin-bottom: 1rem;
	border-radius: 0.3125rem;
	padding: 0.75rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
}

.form-message-success {
	border: 1px solid #86efac;
	background: #f0fdf4;
	color: #166534;
}

.form-message-error {
	border: 1px solid #fca5a5;
	background: #fef2f2;
	color: #991b1b;
}

/* Form submit buttons: disable text-swap hover animation, keep only color transition */
.button.form-submit-button:not(.button--outlined) {
	line-height: 3.375rem !important;
	overflow: visible !important;
}

.button.form-submit-button:not(.button--outlined):hover {
	line-height: 3.375rem !important;
}

.button.form-submit-button:not(.button--outlined)::before {
	content: none !important;
}

/* Reviews page: stable outlined CTA colors */
.button.button--outlined.button--outlined-reviews {
	color: #ff4503 !important;
}

.button.button--outlined.button--outlined-reviews:hover {
	color: #ffffff !important;
}

/* Event debug block (old editor -> inline texts) */
[data-inline-debug="event-old-editor"] table {
	border-collapse: collapse;
}

[data-inline-debug="event-old-editor"] th,
[data-inline-debug="event-old-editor"] td {
	border: 1px solid #e5e7eb;
}

/* Chat button: keep it pinned to bottom-right and fully visible */
a[data-key="footer.chat_url"] {
	left: auto !important;
	right: max(1rem, env(safe-area-inset-right)) !important;
	bottom: max(4.375rem, env(safe-area-inset-bottom)) !important;
	inset-inline-start: auto !important;
	inset-inline-end: max(1rem, env(safe-area-inset-right)) !important;
	transform: none !important;
}

@media (min-width: 768px) {
	a[data-key="footer.chat_url"] {
		right: 2.5rem !important;
		bottom: 5rem !important;
		inset-inline-end: 2.5rem !important;
	}
}


/* Swiper: restore core layout (style.min overrides .swiper-wrapper globally) */
.swiper .swiper-wrapper {
	display: flex;
}

.swiper .swiper-slide {
	flex-shrink: 0;
}

/* Hide Trix attachment captions (filename/size) on frontend */
.wysiwyg-content .attachment__caption,
.wysiwyg-content .attachment__caption * {
	display: none !important;
}

/* Event/article galleries: avoid inherited full-height wrapper stretching */
.js-swiper-gallery .swiper-wrapper {
	height: auto;
}

.pagination {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    align-items: center;
}

.pagination ul {
    display: inline-flex;
    align-items: stretch;
    padding: 0;
    border: 1px solid #e6e2de;
    background: #fff;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 6px 16px rgba(16, 24, 40, 0.08);
}

.pagination li {
    display: flex;
    align-items: stretch;
    justify-content: stretch;
    min-width: 2.75rem;
    height: 2.75rem;
    border-right: 1px solid #efe9e2;
}

.pagination li:last-child {
    border-right: 0;
}

.pagination li a.page-link,
.pagination li span.page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 0 0.75rem;
    font-weight: 600;
    color: #1f2338;
    background: transparent;
    border: 0;
    border-bottom: 0;
    text-decoration: none;
    margin: 0;
    transition: background 0.2s ease, color 0.2s ease;
}

.pagination li:not(.active):not(.disabled):not(.dots):hover .page-link {
    background: #fff3e8;
    color: #ff4d00;
}

.pagination li.active .page-link {
    background: #ff4d00;
    color: #fff;
}

.pagination li:first-child .page-link {
    border-top-left-radius: 1rem;
    border-bottom-left-radius: 1rem;
}

.pagination li:last-child .page-link {
    border-top-right-radius: 1rem;
    border-bottom-right-radius: 1rem;
}

.pagination li.disabled .page-link {
    color: #b8b2ad;
    cursor: default;
}

.pagination li.dots .page-link {
    color: #9a948e;
}

.pagination li.dots:hover .page-link {
    background: transparent;
    color: #9a948e;
}

.pagination .page-link:focus,
.pagination .page-link:focus-visible {
    outline: none;
    box-shadow: none;
}

.pagination-per-page {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
}

.pagination-per-page .per-page-label {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    height: 2.75rem;
    padding: 0.25rem 0.75rem;
    border: 1px solid #efe9e2;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 6px 16px rgba(16, 24, 40, 0.06);
    color: #6b647e;
    font-weight: 600;
}

.pagination-per-page .per-page-label span {
    font-size: 1rem;
}

.pagination-per-page select {
    height: 2.25rem;
    min-width: 4rem;
    border: 1px solid #efe9e2;
    border-radius: 999px;
    padding: 0 2rem 0 0.9rem;
    font-weight: 600;
    color: #1f2338;
    background: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b647e' d='M1.41.59 6 5.17 10.59.59 12 2l-6 6-6-6z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.6rem center;
    background-size: 0.75rem 0.5rem;
    -webkit-appearance: none;
    appearance: none;
}

.pagination-mobile {
    display: none;
    align-items: center;
    gap: 0.75rem;
}

.pagination-mobile .page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 7.5rem;
    height: 3rem;
    padding: 0 1.5rem;
    border-radius: 999px;
    border: 1px solid #efe9e2;
    background: #fff;
    color: #ff4d00;
    font-weight: 600;
}

/* Mobile/touch fix: prevent sticky :hover state on CTA buttons after back navigation (iOS Safari) */
.button:not(.button--outlined):not([data-text])::before {
	content: none !important;
}

.button:not(.button--outlined):not([data-text]):hover {
	line-height: 3.375rem !important;
}

.button.button--large:not(.button--outlined):not([data-text]):hover {
	line-height: 3.5rem !important;
}

@media (hover: none), (pointer: coarse) {
	.button:not(.button--outlined) {
		line-height: 3.375rem !important;
		overflow: visible !important;
		transition: none !important;
		animation: none !important;
		-webkit-tap-highlight-color: transparent;
	}

	/* Keep label visible for buttons that render text via data-text pseudo element */
	.button:not(.button--outlined)[data-text]::before {
		content: attr(data-text) !important;
		position: static !important;
		display: inline !important;
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
		color: inherit !important;
		pointer-events: none !important;
	}

	/* If button does not use data-text, fully disable pseudo-label layer */
	.button:not(.button--outlined):not([data-text])::before {
		content: none !important;
	}

	.button:not(.button--outlined):hover,
	.button:not(.button--outlined):active,
	.button:not(.button--outlined):focus,
	.button:not(.button--outlined):visited {
		line-height: 3.375rem !important;
		background-color: #ff4503 !important;
		color: #ffffff !important;
		-webkit-text-fill-color: #ffffff !important;
		text-decoration: none !important;
	}

	.button.button--large:not(.button--outlined) {
		line-height: 3.5rem !important;
	}

	.button.button--large:not(.button--outlined):hover,
	.button.button--large:not(.button--outlined):active,
	.button.button--large:not(.button--outlined):focus {
		line-height: 3.5rem !important;
	}

	.button.button--outlined:hover,
	.button.button--outlined:active,
	.button.button--outlined:focus,
	.button.button--outlined:visited {
		background-color: transparent !important;
		color: inherit !important;
		-webkit-text-fill-color: currentColor !important;
		transition: none !important;
		animation: none !important;
	}
}

.pagination-mobile .page-btn.disabled {
    color: #b8b2ad;
    cursor: default;
}

.pagination-mobile .page-count {
    min-width: 4.5rem;
    text-align: center;
    font-size: 1.1rem;
    font-weight: 600;
    color: #1f2338;
}

@media (max-width: 768px) {
    .pagination ul {
        display: none;
    }
    .pagination-mobile {
        display: inline-flex;
    }
    .pagination-per-page {
        justify-content: center;
    }
    .pagination-per-page .per-page-label {
        height: 2.75rem;
        padding: 0.5rem 0.9rem;
    }
    .pagination-per-page select {
        height: 2.5rem;
        min-width: 3.5rem;
    }
    .pagination-mobile .page-btn {
        height: 2.5rem;
        min-width: 7.5rem;
    }
}

/* Mobile header: language dropdown must stay above opened burger menu */
@media (max-width: 991.98px) {
	#header details.group\/lang-mobile {
		position: relative;
		z-index: 1001;
	}

	#header details.group\/lang-mobile[open] .lang-mobile-dropdown {
		position: fixed !important;
		top: 3.75rem !important;
		right: 0.75rem !important;
		z-index: 1100 !important;
		padding-top: 0.5rem !important;
	}

	#header details.group\/lang-mobile[open] .lang-mobile-dropdown .languages-list {
		box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
	}
}

/* Header: reduce desktop logo width to keep menu in one line after icon growth */
@media (min-width: 992px) {
	#header .header-logo-link {
		width: 20rem !important;
		height: 4.25rem !important;
	}
}