/* ==========================================================================
   Header (Figma: logo right · nav right after it · cart / account | burger left)
   ========================================================================== */
.whb-general-header { border-bottom: 0 !important; }
.whb-general-header .whb-column.whb-col-center { flex: 1 1 auto; justify-content: flex-start; padding-inline-start: 56px; }
.whb-general-header .wd-header-main-nav { text-align: start !important; width: 100%; }
.whb-general-header .wd-header-main-nav .wd-nav-main { justify-content: flex-start !important; gap: 6px 34px; }
.whb-general-header .whb-column9 { flex: 1 1 auto !important; max-width: none !important; }
.wd-header-nav .wd-nav-main > li > a {
	font-family: var(--lg-font);
	font-size: 18px;
	font-weight: 400;
	color: var(--lg-ink-soft);
	text-transform: none;
	letter-spacing: 0;
	padding-inline: 0 !important;
}
.wd-header-nav .wd-nav-main > li > a:hover,
.wd-header-nav .wd-nav-main > li.current-menu-item > a,
.wd-header-nav .wd-nav-main > li.current-menu-ancestor > a,
.wd-header-nav .wd-nav-main > li:first-child > a { color: var(--lg-ink); }
.wd-header-nav .wd-nav-main > li.current-menu-item > a,
.wd-header-nav .wd-nav-main > li:first-child > a { font-weight: 700; }
/* the header builder prints its own slate menu colours as variables: the palette (body lifts it over that rule) */
body .whb-header .wd-header-nav > .wd-nav { --nav-color: var(--lg-ink-soft); --nav-color-hover: var(--lg-ink); --nav-color-active: var(--lg-ink); }
body .whb-header .wd-header-divider { --wd-divider-color: var(--lg-ink); }
.whb-general-header .wd-tools-element > a { color: var(--lg-ink); }
.whb-general-header .wd-header-divider.lg-hdr-divider::before { height: 22px; border-color: var(--lg-ink); opacity: .9; }
/* header cart (desktop): icon + total only, the item count and its "/" are not shown */
.whb-header .wd-header-cart.wd-design-1 .wd-cart-number,
.whb-header .wd-header-cart.wd-design-1 .subtotal-divider { display: none !important; }

/* dropdowns + mega menu */
.wd-dropdown-menu, .wd-dropdown { border-radius: 14px; box-shadow: 0 18px 50px rgba(66,19,28,.12); }
.wd-dropdown-menu.wd-design-full-width { border-radius: 0 0 18px 18px; }
.wd-dropdown-menu .wd-sub-menu > li > a,
.wd-dropdown-menu .sub-sub-menu li a { font-family: var(--lg-font); color: var(--lg-ink-soft); font-size: 15px; }
.wd-dropdown-menu .wd-sub-menu > li > a:hover,
.wd-dropdown-menu .sub-sub-menu li a:hover { color: var(--lg-ink); }
.wd-dropdown-menu.wd-design-full-width .wd-sub-menu > li > a { color: var(--lg-ink); font-size: 18px; font-weight: 700; }
/* The shop mega menu: five equal columns in one row (יין · וויסקי · ברנדי וקוניאק · אלכוהול · מארזים ומבצעים),
   up to seven categories each and a "לכל ה…" link at the end (the client found the full list crowded;
   every category is still on its category page). A hairline between the columns. */
@media (min-width: 1025px) {
	.whb-general-header .wd-nav-main > li > .wd-dropdown-menu.wd-design-full-width { max-height: calc(100vh - 150px); overflow-y: auto; overscroll-behavior: contain; }
	.wd-dropdown-menu.wd-design-full-width .wd-sub-menu { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; }
	.wd-dropdown-menu.wd-design-full-width .wd-sub-menu > li { width: auto !important; max-width: none !important; margin: 0 !important; padding: 4px 28px !important; }
	.wd-dropdown-menu.wd-design-full-width .wd-sub-menu > li + li { border-inline-start: 1px solid var(--lg-line); }
	.wd-dropdown-menu.wd-design-full-width .wd-sub-menu > li > a { padding: 0 0 10px !important; margin-bottom: 6px; }
	.wd-dropdown-menu.wd-design-full-width .sub-sub-menu { columns: auto !important; }
	.wd-dropdown-menu.wd-design-full-width .sub-sub-menu > li > a { padding-block: 5px; }
	.wd-dropdown-menu.wd-design-full-width .sub-sub-menu > li.lg-menu-all { margin-top: 10px; }
	.wd-dropdown-menu.wd-design-full-width .sub-sub-menu > li.lg-menu-all > a { color: var(--lg-ink); font-weight: 700; font-size: 14px; }
	.wd-dropdown-menu.wd-design-full-width .sub-sub-menu > li.lg-menu-all > a::after { content: " ←"; }
}
@media (min-width: 1025px) and (max-width: 1199px) {
	.wd-dropdown-menu.wd-design-full-width .wd-sub-menu { gap: 20px 16px; }
	.wd-dropdown-menu.wd-design-full-width .wd-sub-menu > li > a { font-size: 17px; }
	.wd-dropdown-menu.wd-design-full-width .sub-sub-menu > li > a { font-size: 14px; }
}

@media (max-width: 1024px) {
	.whb-header-bottom, .whb-top-bar { display: none; }
}
/* Desktop menu: seven items on ONE line at every width. Gaps and type follow the width of the header row
   (--lg-row: 1192px on inner pages, the wider grid on the homepage), full size from a 1170px row up.
   17px type and 30px gaps leave clear air between the menu and the icons on the 1192px pages. */
@media (min-width: 1025px) {
	body { --lg-row: min(1192px, calc(100vw - 30px)); }
	.whb-general-header .whb-column.whb-col-center { padding-inline-start: clamp(12px, calc((var(--lg-row) - 1000px) * .25), 56px) !important; min-width: 0; }
	.whb-general-header .wd-header-main-nav .wd-nav-main { gap: 6px clamp(10px, calc((var(--lg-row) - 990px) * .17), 30px) !important; flex-wrap: nowrap !important; }
	.wd-header-nav .wd-nav-main > li > a { font-size: clamp(15px, calc(15px + (var(--lg-row) - 1000px) * .02), 17px) !important; white-space: nowrap; }

	/* Every menu item is as tall as the header row, so the mouse never leaves the item on its way down
	   to the dropdown (there was a 30px dead strip between the word and the dropdown, and the menu closed there). */
	.whb-general-header .whb-column.whb-col-center { align-self: stretch; align-items: stretch !important; }
	.whb-general-header .wd-header-main-nav { display: flex; align-items: stretch; }
	.whb-general-header .wd-header-main-nav .wd-nav-main { align-items: stretch !important; }
	.whb-general-header .wd-header-main-nav .wd-nav-main > li { display: flex; align-items: center; }
	.whb-general-header .wd-nav-main > li > .wd-dropdown-menu:not(.wd-design-full-width) { top: 100% !important; margin-top: 0 !important; }
}
/* narrow desktop (1025–1222px, e.g. a tablet on its side): the header row was fixed at 1192px and pushed
   the cart / account / menu icons off the screen — it now follows the screen */
@media (min-width: 1025px) and (max-width: 1222px) {
	.whb-header .whb-row > .container, .whb-general-header > .container { width: 100% !important; max-width: 100% !important; margin-inline: 0 !important; padding-inline: 16px !important; }
	.whb-general-header .whb-flex-row { width: 100% !important; min-width: 0 !important; }
}

/* phone menu: the arrows that open a sub-menu point left, with the reading direction (they pointed right),
   and turn down when the sub-menu is open */
.rtl .mobile-nav .wd-nav-opener::after { content: "\f114"; }
.rtl .mobile-nav .wd-nav-opener.wd-active::after { transform: rotate(-90deg); }

/* ==========================================================================
   Footer (Figma: taupe band — now dark burgundy, light type, logo right + 4 columns)
   ========================================================================== */
.lg-footer { background: var(--lg-hero); color: #fff; font-family: var(--lg-font); }
.lg-footer__inner { gap: 40px 56px; align-items: flex-start; }
.lg-footer__brand { flex: 0 0 auto; width: 170px; }
.lg-footer__logo img { width: 160px; filter: brightness(0) invert(1); }
.lg-footer__col { flex: 0 1 auto; min-width: 150px; }
.lg-footer .lg-footer__title .elementor-heading-title { color: var(--lg-gold-soft); font-family: var(--lg-font); font-size: 22px; font-weight: 700; line-height: 1.2; }
.lg-footer .lg-footer__links .elementor-icon-list-item { padding: 3px 0 !important; }
.lg-footer .lg-footer__links .elementor-icon-list-text, .lg-footer .lg-footer__contact, .lg-footer .lg-footer__contact p { color: #fff; font-size: 17px; line-height: 1.55; margin: 0; }
.lg-footer .lg-footer__links a:hover .elementor-icon-list-text, .lg-footer a:hover { color: var(--lg-gold-soft); }
.lg-footer .lg-footer__contact a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.lg-footer .lg-footer__social .elementor-social-icon { background: none !important; --icon-padding: 0em; --icon-size: 24px; }
/* The footer keeps its air and its plain lists here as well, so it looks the same in the moment
   Elementor rebuilds its own style files after an update (it used to lose its padding and show bullets). */
.lg-footer ul { list-style: none; margin: 0; padding: 0; }
.lg-footer .lg-footer__links .elementor-icon-list-item { padding: 5px 0 !important; }
.lg-footer__col.e-con, .lg-footer__brand.e-con { gap: 16px; }
.lg-footer .elementor-social-icons-wrapper { gap: 14px; }
@media (min-width: 768px) {
	.lg-footer.e-con { padding: clamp(64px, 5.6vw, 96px) 0 clamp(56px, 4.8vw, 80px) !important; }
}
.lg-footer .lg-footer__social .elementor-social-icon i, .lg-footer .lg-footer__social .elementor-social-icon svg { color: #fff; fill: #fff; }
@media (max-width: 767px) {
	.lg-footer__inner { gap: 30px 20px; }
	.lg-footer__brand { width: 100%; align-items: center; }
	.lg-footer__col { flex: 1 1 40%; min-width: 0; }
}
.footer-container, .wd-footer, .main-footer { background: var(--lg-hero) !important; background-image: none !important; }
.footer-container .main-footer { padding: 0 !important; }
.lg-footer.e-con { background: var(--lg-hero); }
.lg-footer__inner > .e-con-inner { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 40px clamp(24px, 3.2vw, 56px); } /* five columns stay on one row from 1101px up */
.lg-footer__col.e-con, .lg-footer__brand.e-con { width: auto; padding: 0; }
.wd-copyrights, .copyrights-wrapper { background: var(--lg-burgundy-deep) !important; color: #fff; }
@media (max-width: 767px) {
	.lg-footer.e-con { padding: 56px 24px 44px !important; }
	.lg-footer__inner.e-con { padding: 0 !important; }
	.lg-footer__inner > .e-con-inner { gap: 40px 20px; padding: 0 !important; }
	.lg-footer__brand.e-con { width: 100% !important; align-items: center; }
	.lg-footer__col.e-con { flex: 1 1 calc(50% - 16px) !important; width: calc(50% - 16px) !important; min-width: 0 !important; }
	.lg-footer .lg-footer__title .elementor-heading-title { font-size: 19px; }
	.lg-footer .lg-footer__links .elementor-icon-list-text, .lg-footer .lg-footer__contact p { font-size: 15px; overflow-wrap: anywhere; }
}

/* the phone number never breaks at its hyphen ("077-" / "8052044" on small phones) */
.lg-footer a[href^="tel:"] { white-space: nowrap; }

/* phones and tablets: the menu opens from the right, next to its button (it slid in from the far side) */
@media (max-width: 1024px) {
	.mobile-nav.wd-side-hidden.wd-left { left: auto; right: 0; transform: translate3d(100%, 0, 0); }
	.mobile-nav.wd-side-hidden.wd-left.wd-opened { transform: none; }
}
/* while the menu is open the accessibility button steps aside, so it never covers a menu arrow */
body:has(.mobile-nav.wd-opened) #ea11y-root { display: none; }
/* footer social icons without an address yet ("#") are hidden, with their column; they return once a real link is set */
.lg-footer .elementor-social-icon[href="#"] { display: none !important; }
.lg-footer .lg-footer__col:has(.lg-footer__social):not(:has(.elementor-social-icon:not([href="#"]))) { display: none !important; }

/* phone toolbar: labels that fit their cell. "רשימת משאלות" was cut to "רשימת מ…", and with the shop's fifth item
   ("מסננים") "החשבון שלי" was cut as well. The theme prints these texts itself, so the short words are drawn here. */
.wd-toolbar .wd-header-wishlist .wd-toolbar-label { font-size: 0 !important; }
.wd-toolbar .wd-header-wishlist .wd-toolbar-label::after { content: "מועדפים"; font-size: 12px; }
.wd-toolbar:has(> :nth-child(5)) .wd-header-my-account .wd-toolbar-label { font-size: 0 !important; }
.wd-toolbar:has(> :nth-child(5)) .wd-header-my-account .wd-toolbar-label::after { content: "חשבון"; font-size: 12px; }

/* ---------- search: easy to spot (the client found the bare icon too quiet) ----------
   Computers: a white field with the placeholder text; it still opens the theme's full-screen search.
   Narrower screens and phones: the same icon in a cream circle. */
.whb-header .wd-header-search > a {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	width: 38px; height: 38px; padding: 0 !important; border-radius: 50%;
	background: var(--lg-cream); color: var(--lg-ink) !important;
	transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.whb-header .wd-header-search > a:hover { background: var(--lg-gold-soft); }
.whb-header .wd-header-search .wd-tools-icon { color: var(--lg-ink); }
@media (min-width: 1600px) {
	.whb-general-header .wd-header-search > a {
		width: auto; min-width: 210px; justify-content: flex-start; padding: 0 16px !important; border-radius: 30px;
		background: #fff; border: 1px solid rgba(122,31,43,.28);
	}
	.whb-general-header .wd-header-search > a::after {
		content: "חיפוש יין, וויסקי ועוד…"; font-family: var(--lg-font); font-size: 15px; line-height: 1; color: var(--lg-ink-soft); white-space: nowrap;
	}
	.whb-general-header .wd-header-search > a:hover { background: #fff; border-color: var(--lg-ink); box-shadow: 0 4px 14px rgba(66,19,28,.08); }
}

/* credit line at the very bottom of the footer (includes/site-info.php) */
.lg-footer .lg-footer__credit { width: 100%; max-width: 1192px; margin: 44px auto 0 !important; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.14); }
.lg-footer .lg-footer__credit-text { margin: 0; text-align: center; font-size: 13px; color: rgba(255,255,255,.72); }
.lg-footer .lg-footer__credit-text a { display: inline-flex; align-items: center; gap: 6px; color: var(--lg-gold-soft); text-decoration: underline; text-underline-offset: 3px; }
.lg-footer .lg-footer__credit-text a img { width: 20px; height: 20px; object-fit: contain; flex: none; }
.lg-footer .lg-footer__credit-text a:hover { color: #fff; }