.layout-categories-category__divider {
	height: 24px;
}

.layout-categories-category {
	font-size: 18px;
	font-stretch: condensed;
	font-weight: var(--font-weight-condensed);
	line-height: 21px;
	text-decoration: none;
	text-transform: uppercase;
	white-space: normal;
}

[dir] .layout-categories-category {
	padding-bottom: 4px;
	padding-top: 4px;
}

[dir] .layout-categories-category:last-child {
	padding-bottom: 0;
}

.layout-categories-category--hidden-in-pro {
	color: var(--color-emphasis);
	text-decoration: line-through;
}

.layout-categories-category--accessible {
	color: var(--color-done);
	text-decoration: line-through;
}

.layout-categories-category__name {
	display: inline-block;
	text-decoration: inherit;
}

.layout-categories-category__name--zaraSRPLS {
	font-family: 'ZaraSRPLS', Sans-Serif;
}

.layout-categories-category__separator {
	display: inline-block;
	white-space: pre;
}

.layout-categories-category__short-description {
	display: inline-block;
	text-decoration: inherit;
}

.layout-categories-category__link {
	color: inherit;
	text-decoration: inherit;
}

.layout-categories-category__tag {
	display: inline;
	font-size: var(--font-size-label-s);
	text-transform: uppercase;
	vertical-align: baseline;
	line-height: var(--line-height-label-s);
	letter-spacing: var(--letter-spacing-label-s);
	text-transform: uppercase;
	font-stretch: condensed;
	font-weight: var(--font-weight-condensed);
}

[dir=ltr] .layout-categories-category__tag {
	padding-left: 4px;
	padding-right: 0;
}

[dir=rtl] .layout-categories-category__tag {
	padding-right: 4px;
	padding-left: 0;
}

.layout-categories-category__tag--sup {
	position: relative;
	top: -4px;
	vertical-align: top;
}

.layout-categories-category__icon {
	height: 40px;
	vertical-align: top;
}

[dir] .layout-categories-category__icon {
	margin-top: 1px;
}

.layout-categories-category__image {
	height: 17px;
	vertical-align: text-top;
}

[dir] .layout-categories-category__image {
	margin-bottom: var(--spacing-01);
	margin-top: var(--spacing-01);
}

.layout-categories-category__suffix {
	font-size: var(--font-size-label-s);
	line-height: var(--line-height-label-s);
	letter-spacing: var(--letter-spacing-label-s);
	text-transform: uppercase;
	font-stretch: condensed;
	font-weight: var(--font-weight-condensed);
}

[dir=ltr] .layout-categories-category__suffix {
	margin-left: 4px;
}

[dir=rtl] .layout-categories-category__suffix {
	margin-right: 4px;
}

.layout-categories-category__subcategory--hidden {
	display: none;
}

.layout-categories-category--level-1 {
	display: inline-block;
	max-width: 100%;
}

[dir] .layout-categories-category--level-1 {
	padding: 14px 0 0;
}

[dir=ltr] .layout-categories-category--level-1 {
	margin: 0 24px 14px 0;
}

[dir=rtl] .layout-categories-category--level-1 {
	margin: 0 0 14px 24px;
}

.layout-categories-category--is-blurred .layout-categories-category__link {
	opacity: 0.3;
}

.layout-categories-category--is-blurred .layout-categories-category__link:hover {
	opacity: 1;
}

.layout-categories-category--level-1 > .layout-categories-category__subcategory {
	height: calc(100% - 260px); /* 188px top + 72px footer */
	overflow-y: auto;
	position: absolute;
	top: 188px;
	width: 100%;
}

[dir] .layout-categories-category--level-1 > .layout-categories-category__subcategory {
	padding: 0;
}

[dir=ltr] .layout-categories-category--level-1 > .layout-categories-category__subcategory {
	left: 0;
}

[dir=rtl] .layout-categories-category--level-1 > .layout-categories-category__subcategory {
	right: 0;
}

.layout-categories-category--level-1 > .layout-categories-category__subcategory--hidden {
	display: block;
}

[dir] .layout-categories-category--level-2 {
	padding: 4px 20px;
}

[dir=ltr] .layout-categories-category--level-3, [dir=ltr] .layout-categories-category--level-4 {
	padding-left: 20px;
}

[dir=rtl] .layout-categories-category--level-3, [dir=rtl] .layout-categories-category--level-4 {
	padding-right: 20px;
}

[dir] .layout-categories-category--level-2:not(.layout-categories-category--with-background) .layout-categories-category__subcategory, [dir] .layout-categories-category--level-3:not(.layout-categories-category--with-background) .layout-categories-category__subcategory {
	margin-bottom: var(--spacing-04);
	padding-bottom: var(--spacing-02);
}

[dir] .layout-categories-category--is-more-info:not(.layout-categories-category--level-1) {
	margin-top: var(--spacing-04);
	padding-top: var(--spacing-02);
}

[dir] .layout-categories-category:not(.layout-categories-category--level-1):not(.layout-categories-category--with-background):first-of-type {
	margin-top: 4px;
	padding-top: 4px;
}

/* stylelint-disable-next-line selector-max-compound-selectors */
[dir] .layout-categories-category--level-1.layout-categories-category--with-background > .layout-categories-category__subcategory > .layout-categories-category--opened {
	padding-top: var(--spacing-03);
}

.layout-categories-category--with-background .layout-categories-category--with-background {
	/*
		We need the !important declaration because the background is applied inline to several elements.
	    As the background has alpha, stacking the differents backgrounds increases the alpha.
	*/
	/* stylelint-disable-next-line declaration-no-important */
}

[dir] .layout-categories-category--with-background .layout-categories-category--with-background {
	background: transparent !important;
}

[dir] .layout-categories-category--level-2.layout-categories-category--is-last-opened-level.layout-categories-category--with-background {
	padding-bottom: var(--spacing-03);
	padding-top: var(--spacing-03);
}

@media screen and (min-width: 768px) {
	.layout-categories-category {
		font-size: 13px;
		line-height: 16px;
	}
	[dir] .layout-categories-category {
		padding: 0;
	}

	.layout-categories-category--level-1 {
		display: block;
		max-width: inherit;
	}

	[dir] .layout-categories-category--level-1 {
		margin: inherit;
		padding: 0;
	}

	.layout-categories-category--level-1 > .layout-categories-category__subcategory {
		height: inherit;
		overflow-y: inherit;
		position: inherit;
		top: inherit;
		/* stylelint-disable-next-line declaration-no-important */
		width: inherit;
	}

	[dir] .layout-categories-category--level-1 > .layout-categories-category__subcategory {
		padding: 24px 0 0;
		transform: translateX(0) !important;
	}

	[dir=ltr] .layout-categories-category--level-1 > .layout-categories-category__subcategory {
		left: inherit;
	}

	[dir=rtl] .layout-categories-category--level-1 > .layout-categories-category__subcategory {
		right: inherit;
	}

	.layout-categories-category--level-1 > .layout-categories-category__subcategory--hidden {
		display: none;
	}

	[dir] .layout-categories-category:not(.layout-categories-category--level-1):first-of-type {
		margin-top: 0;
		padding-top: 0;
	}

	[dir] .layout-categories-category--level-1.layout-categories-category--opened {
		padding-bottom: var(--spacing-11);
	}

	[dir] .layout-categories-category--level-1.layout-categories-category--with-background.layout-categories-category--opened {
		margin-bottom: calc(var(--spacing-11) - 24px);
		padding-bottom: 24px;
	}

	[dir] .layout-categories-category--level-1.layout-categories-category--is-last-opened-level.layout-categories-category--with-background {
		padding-bottom: 24px;
		padding-top: 24px;
	}

	[dir] .layout-categories-category--level-1.layout-categories-category--is-blurred.layout-categories-category--with-background {
		padding-bottom: 24px;
		padding-top: 24px;
	}

	[dir] .layout-categories-category--level-2.layout-categories-category--is-last-opened-level.layout-categories-category--with-background {
		padding-bottom: 0;
		padding-top: 0;
	}

	[dir] .layout-categories-category--level-1:first-child.layout-categories-category--opened {
		padding-top: 0;
	}

	[dir] .layout-categories-category--level-1:first-child.layout-categories-category--opened.layout-categories-category--with-background {
		padding-top: 24px;
	}

	[dir] .layout-categories-category--level-1:last-child.layout-categories-category--opened {
		padding-bottom: 0;
	}

	[dir=ltr] .layout-categories-category--level-1 .layout-categories-category__link {
		padding-left: var(--spacing-07);
	}

	[dir=rtl] .layout-categories-category--level-1 .layout-categories-category__link {
		padding-right: var(--spacing-07);
	}

	[dir=ltr] .layout-categories-category--level-1.layout-categories-category--opened .layout-categories-category__link {
		padding-left: calc(var(--spacing-07) + 16px);
	}

	[dir=rtl] .layout-categories-category--level-1.layout-categories-category--opened .layout-categories-category__link {
		padding-right: calc(var(--spacing-07) + 16px);
	}

	/* stylelint-disable-next-line selector-max-compound-selectors */
	[dir=ltr] .layout-categories-category--level-1.layout-categories-category--opened .layout-categories-category--level-2 .layout-categories-category__link {
		padding-left: var(--spacing-07);
	}
	[dir=rtl] .layout-categories-category--level-1.layout-categories-category--opened .layout-categories-category--level-2 .layout-categories-category__link {
		padding-right: var(--spacing-07);
	}

	/* stylelint-disable-next-line selector-max-compound-selectors */
	[dir=ltr] .layout-categories-category--level-1.layout-categories-category--opened .layout-categories-category--level-3 .layout-categories-category__link {
		padding-left: calc(var(--spacing-07) + 16px);
	}
	[dir=rtl] .layout-categories-category--level-1.layout-categories-category--opened .layout-categories-category--level-3 .layout-categories-category__link {
		padding-right: calc(var(--spacing-07) + 16px);
	}

	/* stylelint-disable-next-line selector-max-compound-selectors */
	[dir=ltr] .layout-categories-category--level-1.layout-categories-category--opened .layout-categories-category--level-4 .layout-categories-category__link {
		padding-left: calc(var(--spacing-07) + 32px);
	}
	[dir=rtl] .layout-categories-category--level-1.layout-categories-category--opened .layout-categories-category--level-4 .layout-categories-category__link {
		padding-right: calc(var(--spacing-07) + 32px);
	}

	[dir] .layout-categories-category--is-more-info {
		margin-top: 24px;
	}

	[dir] .layout-categories-category--level-1:not(.layout-categories-category--with-background) .layout-categories-category--level-2.layout-categories-category--with-background {
		padding-bottom: 24px;
		padding-top: 24px;
	}

	/* stylelint-disable-next-line selector-max-compound-selectors */
	[dir] .layout-categories-category--level-1 > .layout-categories-category__subcategory > .layout-categories-category--opened {
		padding-top: 0;
	}

	[dir] .layout-categories-category:not(.layout-categories-category--level-1):not(.layout-categories-category--with-background):first-of-type {
		margin-top: 0;
		padding-top: 0;
	}
}

@media screen and (min-width: 1920px) {
	.layout-categories-category {
		font-size: 18px;
		line-height: 21px;
	}
}

.layout-categories {
	display: flex;
	flex-direction: column;
	height: 100%;
	justify-content: space-between;
}

.layout-categories__footer {
	display: flex;
	justify-content: space-between;
}

[dir] .layout-categories__footer {
	margin: 0 20px 32px;
	padding: 8px 0;
}

[dir=ltr] .layout-categories__footer {
	text-align: right;
}

[dir=rtl] .layout-categories__footer {
	text-align: left;
}

.layout-categories__footer__link {
	font-size: var(--font-size-l);
	font-stretch: condensed;
	font-weight: var(--font-weight-condensed);
	text-decoration: none;
	text-transform: uppercase;
	line-height: 20px;
	letter-spacing: 0.2px;
}

.layout-categories__footer__link .link {
	color: var(--color-main);
	text-decoration: inherit;
}

.layout-categories__container {
	overflow-x: auto;
	overflow-y: hidden;
	white-space: nowrap;
}

[dir=ltr] .layout-categories__container {
	margin: 96px 0 0 40px;
}

[dir=rtl] .layout-categories__container {
	margin: 96px 40px 0 0;
}

.layout-categories__container > .layout-categories-category__divider {
	display: none;
}

@media screen and (min-width: 768px) {
	.layout-categories {
		display: block;
		overflow: auto;
		-ms-overflow-style: none;
		scrollbar-width: none;
	}
	[dir] .layout-categories {
		margin: 0 calc(-1 * var(--spacing-07));
	}

	.layout-categories::-webkit-scrollbar {
		height: 0;
		width: 0;
	}

	.layout-categories__categories {
		display: flex;
	}

	.layout-categories__container {
		height: calc(100% - 80px);
		overflow: visible;
		width: 100%;
	}

	[dir] .layout-categories__container {
		margin: 0;
	}

	.layout-categories__footer {
		display: none;
	}

	.layout-categories__container > .layout-categories-category__divider {
		display: block;
	}
}