/**
 * Mega meniu Armeda — rail vertical de categorii + panouri comutabile.
 * Marcajul vine din blocul Elementor „Mega meniu v2" (cms_block 116904).
 * Clasele am-* sunt setate pe containere/widgeturi direct din Elementor.
 */

.am-mm {
	/* Valorile sunt cele din opțiunile WoodMart (--wd-primary-color,
	   --wd-alternative-color etc.), scrise literal intenționat: variabilele
	   temei sunt redefinite în header (`.whb-color-light` le face albe), iar
	   meniul ar moșteni text alb pe panou alb. */
	--am-primary: #3d0f25;
	--am-accent: #ff7849;
	--am-plum: #932b5e;
	--am-ink: #242424;
	--am-body: #4a4147;
	--am-line: #e6dbe0;
	--am-rail: #f4ecef;

	/* Motiv kilim, folosit ca textură de fundal. Tilează perfect pe 44px. */
	--am-motif: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44' fill='none' stroke='%233d0f25' stroke-width='1'%3E%3Cpath d='M22 0 44 22 22 44 0 22Z'/%3E%3Cpath d='M22 8 36 22 22 36 8 22Z'/%3E%3Cpath d='M22 16 28 22 22 28 16 22Z'/%3E%3Cpath d='M0 0 8 8M44 0 36 8M0 44 8 36M44 44 36 36'/%3E%3C/svg%3E");

	/* Elementor aplică `max-width: min(100%, var(--width))` pe `.e-con` cu
	   aceeași specificitate — setăm variabila lui în loc să ne luptăm cu ea. */
	--width: 1440px;

	display: flex;
	align-items: stretch;
	margin: 0 auto;
	padding: 0;
	font-size: 14px;
}

/* Dropdown-ul WoodMart își pune propriul padding — îl scoatem ca railul să
   atingă marginile panoului. */
.wd-dropdown-menu:has(.am-mm) {
	padding: 0;
}

/* ------------------------------------------------------------------ rail */

.am-mm .am-mm__rail {
	position: relative;
	flex: 0 0 252px;
	padding: 18px 0;
	background: var(--am-rail);
	border-right: 1px solid var(--am-line);
}

/* Textura de covor, discretă, în capătul de jos al railului. */
.am-mm .am-mm__rail::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 190px;
	background: var(--am-motif) left bottom / 44px 44px repeat;
	opacity: 0.09;
	-webkit-mask-image: linear-gradient(to top, #000, transparent);
	mask-image: linear-gradient(to top, #000, transparent);
	pointer-events: none;
}

.am-mm .am-t {
	position: relative;
	z-index: 1;
}

.am-mm .am-t .wd-sub-menu {
	margin: 0;
}

.am-mm .am-t .sub-sub-menu {
	display: none;
}

.am-mm .am-t .wd-sub-menu > li > a {
	display: flex;
	align-items: center;
	gap: 13px;
	padding: 14px 18px 14px 21px;
	border-left: 3px solid transparent;
	color: var(--am-ink);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	line-height: 1.3;
	transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

.am-mm .am-t .wd-sub-menu > li > a::before {
	content: "";
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	background-color: currentColor;
	-webkit-mask: var(--am-icon) center / contain no-repeat;
	mask: var(--am-icon) center / contain no-repeat;
	opacity: 0.55;
	transition: opacity 0.18s ease;
}

.am-mm .am-t.is-active .wd-sub-menu > li > a,
.am-mm .am-t .wd-sub-menu > li > a:hover {
	background: #fff;
	border-left-color: var(--am-accent);
	color: var(--am-primary);
}

.am-mm .am-t.is-active .wd-sub-menu > li > a::before {
	opacity: 1;
}

/* Săgeata care arată că railul comandă panoul din dreapta. */
.am-mm .am-t.is-active .wd-sub-menu > li > a::after {
	content: "";
	margin-left: auto;
	width: 6px;
	height: 6px;
	border-right: 2px solid var(--am-accent);
	border-top: 2px solid var(--am-accent);
	transform: rotate(45deg);
}

/* Iconițe line-art, desenate pe grila 24×24 cu stroke 1.5.
   Sunt aplicate ca mască, deci preiau culoarea textului din rail. */
.am-mm .am-t--covoare {
	--am-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 5h11a1.5 1.5 0 0 1 1.5 1.5L20.5 16H3.5L5 6.5A1.5 1.5 0 0 1 6.5 5Z'/%3E%3Cpath d='M7.5 8h9l.8 5H6.7Z'/%3E%3Cpath d='M5 16v2.5M9 16v2.5M13 16v2.5M17 16v2.5'/%3E%3C/svg%3E");
}

.am-mm .am-t--baie {
	--am-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5h16v2a4.5 4.5 0 0 1-4.5 4.5h-7A4.5 4.5 0 0 1 4 14.5v-2Z'/%3E%3Cpath d='M7 12.5V6.8A2.8 2.8 0 0 1 9.8 4h.4'/%3E%3Ccircle cx='10.7' cy='4' r='1.1'/%3E%3Cpath d='M7.5 19v1.6M16.5 19v1.6'/%3E%3C/svg%3E");
}

.am-mm .am-t--ferestre {
	--am-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3.5' width='16' height='15' rx='1.5'/%3E%3Cpath d='M12 3.5v15M4 11h16'/%3E%3Cpath d='M2.5 18.5h19'/%3E%3C/svg%3E");
}

.am-mm .am-t--dormitor {
	--am-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 18.5V6.5'/%3E%3Cpath d='M3.5 13.5h14a3 3 0 0 1 3 3v2'/%3E%3Cpath d='M3.5 16.5h17'/%3E%3Cpath d='M7 13.5v-2a1.2 1.2 0 0 1 1.2-1.2h2.6A1.2 1.2 0 0 1 12 11.5v2'/%3E%3C/svg%3E");
}

.am-mm .am-t--lichidare {
	--am-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.4 13.6 13.6 20.4a1.6 1.6 0 0 1-2.3 0l-7.3-7.3A1.6 1.6 0 0 1 3.5 12V5.1c0-.9.7-1.6 1.6-1.6H12c.4 0 .8.2 1.1.5l7.3 7.3a1.6 1.6 0 0 1 0 2.3Z'/%3E%3Ccircle cx='7.9' cy='7.9' r='1.3'/%3E%3C/svg%3E");

	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid var(--am-line);
}

.am-mm .am-t--lichidare .wd-sub-menu > li > a {
	color: var(--am-plum);
}

/* Eticheta WoodMart e poziționată absolut, ca un tooltip deasupra linkului.
   În rail o vrem inline, la capătul rândului. */
.am-mm .am-t .menu-label {
	position: static;
	margin: 0 0 0 auto;
	padding: 4px 8px;
	border-radius: 99px;
	background-color: var(--am-accent);
	color: #fff;
	letter-spacing: 0.08em;
	font-size: 9px;
	font-weight: 700;
	line-height: 1;
}

.am-mm .am-t .menu-label::before {
	display: none;
}

/* Lichidarea e un link direct, nu comandă niciun panou — nu primește săgeata. */
.am-mm .am-t.is-link.is-active .wd-sub-menu > li > a::after {
	display: none;
}

/* --------------------------------------------------------------- panouri */

.am-mm .am-mm__panels {
	position: relative;
	flex: 1 1 auto;
	min-width: 0;
	padding: 28px 32px 32px;
	background: #fff;
}

/* Aceeași textură de covor umple colțul liber din stânga-jos al panoului,
   fără să treacă peste coloanele de linkuri. */
.am-mm .am-mm__panels::before {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 48%;
	height: 58%;
	background: var(--am-motif) left bottom / 44px 44px repeat;
	opacity: 0.06;
	-webkit-mask-image: linear-gradient(to top right, #000, transparent 65%);
	mask-image: linear-gradient(to top right, #000, transparent 65%);
	pointer-events: none;
}

.am-mm .am-p {
	display: none;
}

.am-mm .am-p.is-active {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: stretch;
	gap: 28px;
	animation: am-mm-in 0.2s ease-out;
}

@keyframes am-mm-in {
	from {
		opacity: 0;
		transform: translateY(4px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.am-mm .am-p.is-active {
		animation: none;
	}
}

/* Elementor nu emite controlul `width` pentru containerele imbricate, deci
   proporțiile coloanelor sunt stabilite aici. */
.am-mm .am-p > .am-col {
	flex: 1 1 0;
	min-width: 0;
}

.am-mm .am-p > .am-col--promo {
	flex: 0 0 250px;
}

.am-mm .am-col > .elementor-widget + .elementor-widget {
	margin-top: 26px;
}

/* Titlul de grup, cu un accent scurt sub el ca punct de focus. */
.am-mm .am-col .wd-sub-accented > li > a {
	position: relative;
	display: block;
	margin-bottom: 14px;
	padding-bottom: 11px;
	border-bottom: 1px solid var(--am-line);
	color: var(--am-primary);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.am-mm .am-col .wd-sub-accented > li > a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 30px;
	height: 2px;
	background: var(--am-accent);
	transition: width 0.22s ease;
}

.am-mm .am-col .wd-sub-accented > li > a:hover::after {
	width: 100%;
}

/* Sub-linkurile */
.am-mm .am-col .sub-sub-menu > li > a {
	display: block;
	padding: 6px 0;
	color: var(--am-body);
	font-size: 13.5px;
	line-height: 1.45;
	transition: color 0.15s ease, transform 0.15s ease;
}

.am-mm .am-col .sub-sub-menu > li > a:hover {
	color: var(--am-primary);
	transform: translateX(4px);
}

/* ----------------------------------------------------------- card promo */

.am-mm .am-promo,
.am-mm .am-promo .elementor-widget-container,
.am-mm .am-promo .elementor-image-box-wrapper {
	height: 100%;
}

.am-mm .am-promo .elementor-image-box-wrapper {
	position: relative;
	overflow: hidden;
	border-radius: 12px;
	background: var(--am-primary);
}

.am-mm .am-promo .elementor-image-box-img {
	margin: 0 !important;
	width: 100% !important;
	height: 100%;
}

.am-mm .am-promo .elementor-image-box-img img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 300px;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.am-mm .am-promo:hover .elementor-image-box-img img {
	transform: scale(1.06);
}

/* Gradient în trei opriri: textul rămâne lizibil și peste imagini deschise. */
.am-mm .am-promo .elementor-image-box-content {
	position: absolute;
	inset: auto 0 0 0;
	padding: 20px 18px 18px;
	background: linear-gradient(
		to top,
		rgba(61, 15, 37, 0.94) 0%,
		rgba(61, 15, 37, 0.72) 42%,
		rgba(61, 15, 37, 0) 100%
	);
	text-align: left;
}

.am-mm .am-promo .elementor-image-box-title {
	position: relative;
	margin: 0 0 5px;
	padding-top: 12px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.25;
}

.am-mm .am-promo .elementor-image-box-title::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 26px;
	height: 2px;
	background: var(--am-accent);
}

.am-mm .am-promo .elementor-image-box-title,
.am-mm .am-promo .elementor-image-box-title a {
	color: #fff;
}

.am-mm .am-promo .elementor-image-box-description {
	margin: 0;
	color: rgba(255, 255, 255, 0.88);
	font-size: 12.5px;
	line-height: 1.45;
}

.am-mm .am-promo .elementor-image-box-description::after {
	content: " →";
	color: var(--am-accent);
	font-weight: 700;
	white-space: nowrap;
}

/* ------------------------------------------------------------ responsive */

@media (max-width: 1400px) {
	.am-mm .am-mm__rail {
		flex-basis: 220px;
	}

	.am-mm .am-mm__panels {
		padding: 22px 22px 26px;
	}

	.am-mm .am-p.is-active {
		gap: 20px;
	}

	.am-mm .am-p > .am-col--promo {
		flex-basis: 200px;
	}
}