/* DDA – site-wide styles that must work without Elementor Pro custom CSS (XD: DDA_web_NEW). */

/* Elementor parks the closed full-width mobile menu off-screen; never let it widen the page.
   clip (not hidden) keeps position: sticky working. */
body { overflow-x: clip; }

/* ---- Header menu: Libre Franklin SemiBold 14px, uppercase (desktop) ---- */
/* !important: the header templates carry their own nav-menu typography with higher specificity. */
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item {
	font-family: "Libre Franklin", sans-serif !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	line-height: 22px !important;
	text-transform: uppercase !important;
	letter-spacing: .02em;
}
.elementor-location-header .elementor-nav-menu--main .elementor-sub-item {
	font-family: "Libre Franklin", sans-serif;
	font-weight: 500;
	font-size: 14px;
	text-transform: none;
}

/* ---- Cart in the menu ---- */
.dda-menu-cart > .elementor-item {
	display: flex !important;
	align-items: center;
	gap: 8px;
	white-space: nowrap;
}
.dda-menu-cart .dda-cart-icon { flex: none; }
.dda-menu-cart .dda-cart-total,
.dda-menu-cart .dda-cart-total .amount { font-weight: 700; color: inherit; }
.elementor-nav-menu--dropdown .dda-menu-cart > .elementor-item { justify-content: flex-start; }

/* Desktop (the header switches to the toggle at 1200px): XD puts the cart right next to the yellow
   "Rezervácia" button and keeps the menu centred. The menu widget fills its grid column and the free space
   is split by the two auto margins, so the items never run under the cart on narrower screens. */
@media (min-width: 1201px) {
	.elementor-location-header .elementor-widget-nav-menu:has(.dda-menu-cart) { justify-self: stretch !important; }
	.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu:has(.dda-menu-cart) { flex: 1 1 auto; }
	.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > li:first-child { margin-left: auto; }
	.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > li.dda-menu-cart { margin-left: auto; }
	.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu { flex-wrap: nowrap; }
}
/* Just above the toggle breakpoint the full menu + cart is wider than its column; tighten the item padding. */
@media (min-width: 1201px) and (max-width: 1299px) {
	.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > li > a.elementor-item {
		padding-left: 10px !important;
		padding-right: 10px !important;
	}
}

/* ---- Article body (theme-post-content), XD "Aktuality/Článok" ---- */
.elementor-widget-theme-post-content {
	font-family: "Libre Franklin", sans-serif;
	font-size: 16px;
	line-height: 29px;
	color: #101921;
}
.elementor-widget-theme-post-content p { margin: 0 0 29px; }
.elementor-widget-theme-post-content p:last-child { margin-bottom: 0; }
.elementor-widget-theme-post-content h2,
.elementor-widget-theme-post-content h3,
.elementor-widget-theme-post-content h4 {
	font-family: "Libre Franklin", sans-serif;
	font-weight: 700;
	font-size: 16px;
	line-height: 29px;
	color: #101921;
	margin: 58px 0 29px;
}
.elementor-widget-theme-post-content > .elementor-widget-container > :first-child,
.elementor-widget-theme-post-content > :first-child { margin-top: 0; }
/* The lead paragraph/heading at the top is SemiBold blue. */
.elementor-widget-theme-post-content h2:first-child,
.elementor-widget-theme-post-content .elementor-widget-container > h2:first-child { font-weight: 600; color: #191998; }
.elementor-widget-theme-post-content a { color: #122CB3; }
.elementor-widget-theme-post-content img { max-width: 100%; height: auto; border-radius: 12px; }
.elementor-widget-theme-post-content figure { margin: 42px 0 0; }
.elementor-widget-theme-post-content .wp-block-gallery { gap: 24px; margin: 42px 0 0; }
.elementor-widget-theme-post-content .wp-block-gallery figure { margin: 0; }

@media (max-width: 767px) {
	.elementor-widget-theme-post-content { font-size: 13px; line-height: 22px; }
	.elementor-widget-theme-post-content p { margin-bottom: 22px; }
	.elementor-widget-theme-post-content h2,
	.elementor-widget-theme-post-content h3,
	.elementor-widget-theme-post-content h4 { font-size: 14px; line-height: 22px; margin: 32px 0 16px; }
	.elementor-widget-theme-post-content figure { margin-top: 24px; }
	.elementor-widget-theme-post-content .wp-block-gallery { gap: 12px; margin-top: 24px; }
}

/* ---- Plain pages (cart, checkout, order received, Môj účet, LatePoint cabinet and booking): the header's
   1200px grid. These pages have no Elementor layout, so Hello renders their content edge to edge. ---- */
body.page-template-default .site-main > .page-content,
body.page-template-default .site-main > .page-header {
	max-width: 1240px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 20px;
	padding-right: 20px;
	box-sizing: border-box;
}
body.page-template-default .site-main > .page-content { padding-top: 56px; padding-bottom: 96px; }
/* WooCommerce blocks are "alignwide" (-80px margins + fixed width): inside the grid they just fill it. */
body.page-template-default .site-main > .page-content > .alignwide,
body.page-template-default .site-main > .page-content > .alignfull {
	margin-left: 0;
	margin-right: 0;
	width: auto;
	max-width: none;
}
body.dda-page-booking .site-main > .page-content { padding-top: 80px; padding-bottom: 120px; }
@media (max-width: 767px) {
	body.page-template-default .site-main > .page-content,
	body.page-template-default .site-main > .page-header { padding-left: 16px; padding-right: 16px; }
	body.page-template-default .site-main > .page-content { padding-top: 32px; padding-bottom: 64px; }
	body.dda-page-booking .site-main > .page-content { padding-top: 40px; padding-bottom: 72px; }
}

/* ---- Buttons ---- */
/* Hello Elementor's reset.css gives every button a 1px pink (#c36) border; the design has none. */
[type="button"], [type="submit"], button { border-color: transparent; }

/* Elementor's global button style (Site Settings → Buttons: yellow) also lands on LatePoint's own controls.
   The phone country picker and the waiting-list buttons get LatePoint's look back. */
.latepoint-w .lp_iti__selected-country,
.latepoint-w .lp_iti__selected-country:hover,
.latepoint-w .lp_iti__selected-country:focus {
	background-color: transparent;
	color: inherit;
	border: 0;
}
.latepoint-w #latepoint_waitlist_btn {
	background-color: #fff;
	color: var(--latepoint-brand-primary, #1d7bff);
	border: 1px solid #e1e5ef;
	border-radius: var(--latepoint-border-radius, 0);
	padding: 14px 16px;
	font-size: 14px;
	font-weight: 500;
	white-space: normal;
}
.latepoint-w #latepoint_waitlist_btn:hover,
.latepoint-w #latepoint_waitlist_btn:focus {
	background-color: #f4f7ff;
	color: var(--latepoint-brand-primary, #1d7bff);
	border-color: var(--latepoint-brand-primary, #1d7bff);
}
.latepoint-w .latepoint_waitlist_calendar .waitlist_send_btn,
.latepoint-w .latepoint_waitlist_calendar .waitlist_send_btn:hover,
.latepoint-w .latepoint_waitlist_calendar .waitlist_send_btn:focus {
	background-color: var(--latepoint-brand-primary, #1d7bff);
	color: #fff;
	border-radius: var(--latepoint-border-radius, 0);
	padding: 12px 20px;
	font-weight: 500;
}

/* ---- LatePoint customer cabinet ---- */
/* Customers log in by e-mail link only (password routes are refused server-side). */
.latepoint-w .customer-password-form-w { display: none; }
.dda-page-account .site-main .latepoint-w > a:first-child {
	float: right;
	font-size: 14px;
	font-weight: 600;
	color: #122CB3;
	text-decoration: underline;
}
.dda-page-account .site-main .latepoint-w > h4 {
	font-family: "Libre Franklin", sans-serif;
	font-size: 24px;
	font-weight: 700;
	color: #191998;
	margin: 0 0 24px;
}

/* ---- Atomic forms (Prihlásenie, Kontakt): the sent / error message sits below the button, not on it ---- */
.e-form-base .e-form-success-message-base,
.e-form-base .e-form-error-message-base { margin-top: 16px; }

/* "Advanced Voucher System" injects its voucher box on every checkout URL – after the order is placed it is
   of no use. */
body.woocommerce-order-received .voucher-section { display: none; }

/* ---- Mobile menu (toggle up to 1200px) ----
   The dropdown is fixed under the header, but the page behind it kept scrolling and took the header (logo + X)
   with it. While the menu is open: the page is locked, the header stays on top, and scrolling inside a long
   menu does not hand over to the page. */
@media (max-width: 1200px) {
	html:has(.elementor-location-header .elementor-menu-toggle.elementor-active),
	html:has(.elementor-location-header .elementor-menu-toggle.elementor-active) body { overflow: hidden; }
	.elementor-location-header:has(.elementor-menu-toggle.elementor-active) { position: sticky; top: 0; z-index: 9999; }
	.elementor-location-header .elementor-nav-menu--dropdown.elementor-nav-menu__container { overscroll-behavior: contain; }
}
