/*
@File: Adles Template Styles

* This file contains the styling for the actual template, this
is the file you need to edit to change the look of the template.

This files table contents are outlined below>>>>>

******************************************* 
** - DEFAULT AREA STYLE - **

** - Default Btn Area Style
** - Read More Area Style
** - Section Title Area Style
** - Header Area Style
** - Nav Area Style
** - Banner Area Style

** - Footer Area Style
** - Copy Right Area Style

** - OTHER STYLE AREA - **

** - Preloader Area Style
** - Go Top Style
** - Video wave Style

*******************************************
/*

/*
Default Style
============================*/
html {
	/* Clip stray horizontal overflow (mostly an RTL concern). Use `clip`
	   instead of `hidden` — `hidden` would establish a new scroll container
	   and break `position: sticky` on every descendant. */
	overflow-x: clip;
}

/* Blog detail — reading time pill in the article header. */
.blog-reading-time {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: #6b7280;
	font-weight: 500;
}
.blog-reading-time i {
	font-size: 14px;
	color: #98a2b3;
}

/* Blog share — native share on mobile, popover on desktop. Trigger styled
   as a compact pill that sits with the category chip. */
.blog-share {
	position: relative;
	display: inline-block;
}
.blog-share__trigger {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	background: #ffffff;
	border: 1px solid #e4e6ea;
	border-radius: 999px;
	color: #475467;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.15s ease;
}
.blog-share__trigger:hover {
	border-color: #f0002a;
	color: #f0002a;
	background: #fff5f6;
}
.blog-share__pop {
	position: absolute;
	top: calc(100% + 8px);
	inset-inline-end: 0;
	background: #ffffff;
	border: 1px solid #ececef;
	border-radius: 14px;
	padding: 14px;
	box-shadow: 0 12px 32px -8px rgba(16, 24, 40, 0.15);
	z-index: 50;
	min-width: 240px;
}
.blog-share__row {
	display: flex;
	gap: 10px;
	margin-bottom: 12px;
}
.blog-share__copy {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 8px 12px;
	background: #f9fafb;
	border: 1px solid #ececef;
	border-radius: 8px;
	color: #475467;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.15s ease;
}
.blog-share__copy:hover {
	background: #fff5f6;
	border-color: #f0002a;
	color: #f0002a;
}

/* Blog Table of Contents — collapsible card above the article body.
   Active item highlighted as the reader scrolls through headings. */
.blog-toc {
	margin: 24px 0 32px;
	background: #fafbfc;
	border: 1px solid #ececef;
	border-radius: 12px;
	overflow: hidden;
}
.blog-toc__toggle {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 14px 18px;
	background: transparent;
	border: 0;
	font-size: 14px;
	font-weight: 700;
	color: #101828;
	cursor: pointer;
	text-align: start;
}
.blog-toc__toggle > span {
	flex: 1;
}
.blog-toc__chev {
	transition: transform 0.2s ease;
	color: #98a2b3;
}
.blog-toc__chev--open {
	transform: rotate(-180deg);
}
.blog-toc__list {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease;
	padding: 0 18px;
}
.blog-toc--open .blog-toc__list {
	max-height: 600px;
	padding: 0 18px 16px;
}
.blog-toc__list ol {
	list-style: none;
	padding: 0;
	margin: 0;
}
.blog-toc__item a {
	display: block;
	padding: 7px 10px;
	border-radius: 6px;
	color: #475467;
	font-size: 14px;
	text-decoration: none;
	border-inline-start: 2px solid transparent;
	transition: all 0.15s ease;
}
.blog-toc__item a:hover {
	background: #ffffff;
	color: #f0002a;
}
.blog-toc__item--h3 a {
	padding-inline-start: 26px;
	font-size: 13px;
}
.blog-toc__item--active a {
	background: #ffffff;
	color: #f0002a;
	border-inline-start-color: #f0002a;
	font-weight: 600;
}

/* Blog detail page — Previous / Next article pager that sits at the bottom
   of the post content. Two-column on desktop, stacks on narrow screens. */
.blog-pager {
	margin-top: 56px;
	padding-top: 32px;
	border-top: 1px solid #ececef;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
.blog-pager__link {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 18px 22px;
	border: 1px solid #ececef;
	border-radius: 14px;
	background: #ffffff;
	color: #1a1a1a;
	text-decoration: none;
	transition: border-color 0.2s ease, transform 0.2s ease,
		box-shadow 0.2s ease, color 0.2s ease;
}
.blog-pager__link:hover {
	border-color: #f0002a;
	color: #f0002a;
	transform: translateY(-2px);
	box-shadow: 0 10px 22px -10px rgba(240, 0, 42, 0.25);
	text-decoration: none;
}
.blog-pager__link--next {
	text-align: end;
}
.blog-pager__hint {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #6b7280;
	transition: color 0.2s ease;
}
.blog-pager__link:hover .blog-pager__hint {
	color: #f0002a;
}
.blog-pager__link--next .blog-pager__hint {
	justify-content: flex-end;
}
.blog-pager__title {
	font-size: 15px;
	font-weight: 600;
	color: inherit;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
@media (max-width: 575px) {
	.blog-pager {
		grid-template-columns: 1fr;
		gap: 10px;
	}
	.blog-pager__link--next {
		text-align: start;
	}
	.blog-pager__link--next .blog-pager__hint {
		justify-content: flex-start;
	}
}

/* Google Translate Website widget — hide all of its injected UI so only
   the translation effect remains. The widget adds a top banner, tooltips,
   and a yellow highlight on translated text; users get the translation
   via our LocaleSwitcher dropdown, not Google's banner. */
.skiptranslate,
.goog-te-banner-frame,
.goog-te-spinner-pos,
.goog-tooltip,
.goog-tooltip:hover {
	display: none !important;
}
body {
	top: 0 !important;
}
.goog-text-highlight {
	background: transparent !important;
	box-shadow: none !important;
}
font[style*="vertical-align"] {
	vertical-align: inherit !important;
}

body {
	font-size: 16px;
	font-family: var(--font-readex-pro);
	color: #848484;
	font-weight: 400;
	background-color: #f8f8f8;
	/* Prevent horizontal scroll site-wide. Use `clip` not `hidden` — `hidden`
	   establishes a scroll container, which silently breaks `position: sticky`
	   on every descendant (left rail, sticky CTAs, etc.). */
	overflow-x: clip;
}

a {
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	text-decoration: none;
	color: #848484;
}

a:hover {
	text-decoration: none;
	color: #582949;
}

a:focus {
	text-decoration: none;
}

button {
	outline: 0 !important;
	-webkit-box-shadow: none;
	box-shadow: none;
	border: none;
	padding: 0;
}

button:focus {
	-webkit-box-shadow: none;
	box-shadow: none;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
	color: #0c0b0b;
	font-weight: 700;
}

h3 {
	font-weight: 600;
}

.d-table {
	width: 100%;
	height: 100%;
}

.d-table-cell {
	vertical-align: middle;
}

p {
	font-size: 16px;
	margin-bottom: 15px;
	line-height: 1.8;
}

p:last-child {
	margin-bottom: 0;
}

img {
	max-width: 100%;
	height: auto;
}

.form-control {
	height: 60px;
	color: #0c0b0b;
	border: 1px solid #ffffff;
	background-color: #e5e5e5;
	font-size: 16px;
	padding: 10px 20px;
	width: 100%;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	border-radius: 5px;
}

.form-control::-webkit-input-placeholder {
	color: #757575;
}

.form-control:-ms-input-placeholder {
	color: #757575;
}

.form-control::-ms-input-placeholder {
	color: #757575;
}

.form-control::placeholder {
	color: #757575;
}

.form-control:focus {
	color: #000000;
	background-color: #e5e5e5;
	-webkit-box-shadow: unset;
	box-shadow: unset;
	outline: 0;
	border: 1px solid #582949;
}

.form-control:hover:focus,
.form-control:focus {
	-webkit-box-shadow: unset;
	box-shadow: unset;
}

textarea.form-control {
	height: auto;
}

.ptb-100 {
	padding-top: 100px;
	padding-bottom: 100px;
}

.pt-100 {
	padding-top: 100px;
}

.pb-100 {
	padding-bottom: 100px;
}

.pt-70 {
	padding-top: 70px;
}

.pb-70 {
	padding-bottom: 70px;
}

.pb-75 {
	padding-bottom: 75px;
}

.pb-150 {
	padding-bottom: 150px;
}

.pt-50 {
	padding-top: 50px;
}

.mt-30 {
	margin-top: 30px;
}

.mb-30 {
	margin-bottom: 30px;
}

.ml-15 {
	margin-right: 15px;
}

.mr-15 {
	margin-left: 15px;
}


/*
Bg-color Style*/
.bg-color-fffcf8 {
	background-color: #fffcf8;
}

.bg-color-fbf6ff {
	background-color: #fbf6ff;
}

.bg-color-fcf1e3 {
	background-color: #fcf1e3;
}

.bg-color-fff8f0 {
	background-color: #fff8f0;
}

.bg-color-0c0b0b {
	background-color: #0c0b0b;
}

.bg-color-fff5e1 {
	background-color: #fff5e1;
}

/*
Default Btn Area Style*/
.default-btn {
	font-size: 16px;
	color: #ffffff;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	text-align: center;
	position: relative;
	overflow: hidden;
	display: inline-block;
	padding: 18px 40px;
	background-color: #f0002a;
	border-radius: 8px;
	border: 1px solid #f0002a;
	font-weight: 600;
	line-height: 20px;
}

/* Navbar CTA — compact padding so the "Add Listing" button doesn't
   crowd the top bar. Uses the same .default-btn elsewhere on the site
   at its larger size. */
.others-options .default-btn {
	padding: 10px 22px;
	font-size: 14px;
	line-height: 18px;
}
.default-btn.btn-sm {
	padding: 10px 20px;
	font-size: 14px;
}

.default-btn i {
	position: relative;
	top: 2px;
	margin-right: 10px;
}

.default-btn img {
	margin-right: 10px;
}

.default-btn.active {
	background-color: #582949;
	border-color: #582949;
	color: #ffffff;
}

.default-btn.active:hover {
	background-color: #f0002a;
	border-color: #f0002a;
}

.default-btn.border-btn {
	background-color: transparent;
	border-color: #f0002a;
	color: #f0002a;
}

.default-btn.border-btn:hover {
	color: #ffffff;
	background-color: #f0002a;
}

.default-btn:hover {
	color: #ffffff;
	background-color: #582949;
	border-color: #582949;
}

.default-btn:hover.bg-style {
	background-color: #ffc039;
}

/*
Read More Btn Area Style*/
.read-more {
	cursor: pointer;
	font-size: 16px;
	color: #582949;
	background-color: transparent;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	font-weight: 500;
}

.read-more i {
	position: relative;
	top: 3px;
	right: 3px;
}

.read-more:hover {
	color: #f0002a;
}

.read-more.active {
	color: #f0002a !important;
}

/*
Section Title Area Style*/
.section-title {
	max-width: 700px;
	margin: -5px auto 30px;
	text-align: center;
	position: relative;
}

.section-title .top-title {
	font-size: 14px;
	color: #f0002a;
	display: block;
	margin-bottom: 15px;
	font-weight: 500;
}

.section-title .top-title.font-style {
	font-family: var(--font-dancing-script);
	font-size: 36px;
	font-weight: 400;
	margin-bottom: 10px;
}

.section-title h2 {
	font-size: 46px;
	margin-bottom: 15px;
	letter-spacing: -0.01em;
}

.section-title h2 span {
	color: #f0002a;
}

.section-title h2:last-child {
	margin-bottom: 0;
}

.section-title p {
	max-width: 600px;
	margin: auto;
}

.section-title p span {
	color: #f0002a;
}

.section-title.white-title span {
	color: #f0002a;
}

.section-title.white-title h2 {
	color: #ffffff;
}

.section-title.white-title p {
	color: #ffffff;
}

.section-title.left-title {
	margin-right: 0;
	text-align: right;
	max-width: 645px;
}

.section-title.left-title h2 {
	max-width: 700px;
}

.section-title.left-title p {
	margin-right: 0;
}

.section-title.left-title .default-btn {
	position: absolute;
	top: 0;
	left: 0;
}

.section-title-wrap {
	position: relative;
}

.section-title-wrap .section-title-right {
	position: absolute;
	bottom: 0;
	left: 0;
}

.section-title-wrap .serach-list {
	padding-right: 0;
	margin-bottom: 0;
	list-style-type: none;
	position: absolute;
	bottom: 0;
	left: 0;
}

.section-title-wrap .serach-list li {
	display: inline-block;
	padding: 5px 20px;
	border: 1px solid #f0f0f0;
	border-radius: 5px;
	margin-left: 20px;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.section-title-wrap .serach-list li:last-child {
	margin-left: 0;
}

.section-title-wrap .serach-list li i {
	position: relative;
	top: 3px;
	margin-left: 5px;
	font-weight: 600;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.section-title-wrap .serach-list li span {
	font-weight: 600;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.section-title-wrap .serach-list li:hover {
	border-color: #f0002a;
}

.section-title-wrap .serach-list li:hover i {
	color: #f0002a;
}

.section-title-wrap .serach-list li:hover span {
	color: #f0002a;
}

.section-title-wrap .all-time {
	padding-right: 0;
	margin-bottom: 0;
	list-style-type: none;
	position: absolute;
	bottom: 0;
	left: 0;
}

.section-title-wrap .all-time li {
	display: inline-block;
	margin-left: 10px;
}

.section-title-wrap .all-time li:last-child {
	margin-left: 0;
}

.section-title-wrap .all-time li span {
	border: 1px solid #e8f0f4;
	padding: 7px 10px;
	border-radius: 5px;
}

.section-title-wrap .all-time li .form-select {
	border-radius: 5px;
	border: 1px solid #e8f0f4;
	cursor: pointer;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.section-title-wrap .all-time li .form-select:focus {
	-webkit-box-shadow: none;
	box-shadow: none;
	border-color: #f0002a;
}

.section-title-wrap .section-title-rights {
	margin-bottom: 50px;
}

.section-title-wrap .section-title-rights .form-control {
	width: 300px;
	color: #646464;
	height: 64px;
}

.section-title-wrap .section-title-rights .form-control:focus {
	border-color: #e5e5e5;
}

/*
Navbar Area Style
======================================================*/
.navbar-area {
	position: relative;
	/* Sit above page content that creates its own low-z-index stacking
	   context (e.g. .b2b-hero__inner uses z-index: 2). Without this, the
	   user-menu dropdown gets clipped behind the hero CTA. */
	z-index: 10;
	background-color: #ffffff;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	padding-top: 10px;
	padding-bottom: 10px;
}

.navbar-area.style-three {
	background-color: #0c0b0b;
	border: none;
}

.navbar-area.is-sticky {
	top: 0;
	right: 0;
	width: 100%;
	z-index: 999;
	position: -webkit-sticky;
	position: sticky;
	-webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
	animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	background-color: #ffffff !important;
}

.navbar-area.is-sticky.style-three {
	background-color: #0c0b0b !important;
}

.navbar-area .container-fluid {
	max-width: 1760px;
	margin: auto;
	padding-right: 30px;
	padding-left: 30px;
}

.navbar-area .navbar-brand {
	margin-left: 100px;
}

.navbar-area .navbar-brand .white-logo {
	display: none;
}

.navbar-area .mobile-responsive-menu .logo .white-logo {
	display: none;
}

.navbar-area.nav-bg-color-fff8f0 {
	background-color: #fff8f0;
}

.main-nav {
	position: relative;
	z-index: 2;
	padding-top: 0;
	padding-bottom: 0;
}

.main-nav.style-three .navbar .navbar-nav .nav-item a {
	color: #ffffff;
}

.main-nav .navbar {
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	z-index: 2;
	position: unset;
	padding-left: 0;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
}

.main-nav .navbar ul {
	margin-bottom: 0;
	list-style-type: none;
}

.main-nav .navbar .navbar-nav .nav-item {
	position: relative;
	padding-bottom: 30px;
	padding-top: 30px;
	padding-left: 0;
	padding-right: 0;
}

.main-nav .navbar .navbar-nav .nav-item a {
	font-size: 16px;
	color: #0c0b0b;
	line-height: 1;
	position: relative;
	font-weight: 400;
	padding-right: 0;
	padding-top: 0;
	padding-left: 0;
	padding-bottom: 0;
	margin-right: 15px;
	margin-left: 15px;
}

/* Stunning hover on root menu items only — soft pill background, accent
   color shift, subtle lift. Scoped to .nav-link (root) so dropdown-panel
   items keep their own styling. */
.main-nav .navbar .navbar-nav > .nav-item > .nav-link,
.main-nav .navbar .navbar-nav > .nav-item > .nav-dropdown-row > .nav-link {
	padding: 8px 14px !important;
	margin-right: 2px !important;
	margin-left: 2px !important;
	border-radius: 10px;
	transition: background 0.22s ease, color 0.22s ease,
		transform 0.22s ease, box-shadow 0.22s ease;
}
.main-nav .navbar .navbar-nav > .nav-item > .nav-link:hover,
.main-nav .navbar .navbar-nav > .nav-item > .nav-dropdown-row > .nav-link:hover {
	background: linear-gradient(-135deg, rgba(240, 0, 42, 0.10), rgba(240, 0, 42, 0.04));
	color: #f0002a;
	transform: translateY(-1px);
	box-shadow: 0 6px 14px -8px rgba(240, 0, 42, 0.35);
}
.main-nav .navbar .navbar-nav > .nav-item > .nav-link.active,
.main-nav .navbar .navbar-nav > .nav-item > .nav-dropdown-row > .nav-link.active {
	background: rgba(240, 0, 42, 0.08);
	color: #f0002a;
}

.main-nav .navbar .navbar-nav .nav-item a.dropdown-toggle {
	padding-left: 20px;
}

.main-nav .navbar .navbar-nav .nav-item a.dropdown-toggle::after {
	content: "";
	position: absolute;
	top: 0;
	right: -6px;
	width: 100%;
	height: 100%;
	background-image: url(/images/menu-active.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	background-color: transparent;
	border: none;
	margin-right: 0;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	opacity: 0;
}

.main-nav .navbar .navbar-nav .nav-item a.dropdown-toggle::before {
	content: "\EA4E";
	position: absolute;
	top: 0;
	left: 0;
	font-family: remixicon !important;
	line-height: 1;
	font-size: 17px;
}

.main-nav .navbar .navbar-nav .nav-item a:hover,
.main-nav .navbar .navbar-nav .nav-item a:focus,
.main-nav .navbar .navbar-nav .nav-item a.active {
	color: #f0002a;
}

.main-nav .navbar .navbar-nav .nav-item a:hover.dropdown-toggle::after,
.main-nav .navbar .navbar-nav .nav-item a:focus.dropdown-toggle::after,
.main-nav .navbar .navbar-nav .nav-item a.active.dropdown-toggle::after {
	top: -20px;
	opacity: 1;
}

.main-nav .navbar .navbar-nav .nav-item a i {
	font-size: 18px;
	line-height: 0;
	position: relative;
	top: 4px;
}

.main-nav .navbar .navbar-nav .nav-item:last-child a {
	margin-left: 0;
}

.main-nav .navbar .navbar-nav .nav-item:first-child a {
	margin-right: 0;
}

.main-nav .navbar .navbar-nav .nav-item:hover a,
.main-nav .navbar .navbar-nav .nav-item:focus a,
.main-nav .navbar .navbar-nav .nav-item.active a {
	color: #f0002a;
}

/* Navbar — Services / B2B category dropdowns.
   Trigger is a button so we can toggle on mobile without navigating. */
/* Trigger uses default inline-anchor display so its baseline matches the
   plain links (Home / Blog / etc.). The chevron is positioned via
   vertical-align rather than flex centering, which preserves baseline. */
.main-nav .navbar .navbar-nav .nav-item .nav-dropdown-trigger {
	cursor: pointer;
}

/* Mobile-only nav items (About Us, FAQ): visible in the burger menu only. */
@media (min-width: 1200px) {
	.main-nav .navbar .navbar-nav .nav-item.nav-item--mobile-only {
		display: none;
	}
}
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	a
	.nav-dropdown-trigger__chevron,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	a.nav-dropdown-trigger
	i.nav-dropdown-trigger__chevron {
	display: inline-block;
	vertical-align: middle;
	margin-inline-start: 3px;
	font-size: 14px;
	line-height: 1;
	position: static;
	top: auto;
	transform-origin: center;
	transition: transform 0.15s ease;
	color: inherit;
}
.main-nav
	.navbar
	.navbar-nav
	.nav-item--has-dropdown.nav-item--open
	.nav-dropdown-trigger__chevron,
.main-nav
	.navbar
	.navbar-nav
	.nav-item--has-dropdown:hover
	.nav-dropdown-trigger__chevron {
	transform: rotate(-180deg);
}

/* Dropdown panel — items are localized categories with their stored icons.
   Standalone styling (does NOT inherit from Bootstrap's .dropdown-menu) so
   it doesn't conflict with the legacy `.nav-item .dropdown-menu` rule
   later in this file. */
.main-nav .navbar .navbar-nav .nav-item .nav-dropdown-menu {
	list-style: none;
	margin: 0;
	width: 280px;
	padding: 8px;
	border-radius: 12px;
	background: #ffffff;
	box-shadow: 0 12px 32px -12px rgba(16, 24, 40, 0.18),
		0 2px 6px rgba(16, 24, 40, 0.06);
	max-height: min(70vh, 520px);
	overflow-y: auto;
	position: absolute;
	top: 80px;
	right: 0;
	z-index: 99;
	visibility: hidden;
	opacity: 0;
	transition: all 0.25s ease-in-out;
}
.main-nav .navbar .navbar-nav .nav-item .nav-dropdown-menu li {
	padding: 0;
}
.main-nav .navbar .navbar-nav .nav-item .nav-dropdown-menu li .nav-dropdown-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	border-radius: 8px;
	border: none;
	color: #344054;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.3;
	transition: background 0.12s ease, color 0.12s ease;
}
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.nav-dropdown-menu
	li
	.nav-dropdown-item:hover,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.nav-dropdown-menu
	li
	.nav-dropdown-item.active {
	background: #fff5f6;
	color: #f0002a;
}
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.nav-dropdown-menu
	li
	a
	i.nav-dropdown-item__icon {
	font-size: 18px;
	width: 22px;
	flex-shrink: 0;
	text-align: center;
	color: #98a2b3;
	line-height: 1;
	position: static;
	top: auto;
}
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.nav-dropdown-menu
	li
	.nav-dropdown-item:hover
	.nav-dropdown-item__icon,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.nav-dropdown-menu
	li
	.nav-dropdown-item.active
	.nav-dropdown-item__icon {
	color: #f0002a;
}
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.nav-dropdown-menu
	li
	.nav-dropdown-item--all {
	font-weight: 700;
	background: #fafbfc;
	margin-bottom: 4px;
}

/* Mobile (<1200px): the parent link + chevron toggle live in a row.
   Tapping the label navigates; tapping the chevron expands/collapses the
   category list under it (one section open at a time). */
@media (max-width: 1199px) {
	.nav-dropdown-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		gap: 8px;
	}
	.nav-dropdown-row .nav-link {
		flex: 1;
		padding-block: 8px !important;
	}
	.nav-dropdown-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 34px;
		height: 34px;
		border-radius: 8px;
		border: none;
		background: transparent;
		color: inherit;
		cursor: pointer;
		flex-shrink: 0;
		transition: background 0.15s ease;
	}
	.nav-dropdown-toggle:hover {
		background: #f4f4f5;
	}
	.nav-dropdown-toggle .nav-dropdown-trigger__chevron {
		font-size: 18px;
		transition: transform 0.2s ease;
	}
	.nav-item--has-dropdown.nav-item--open
		.nav-dropdown-toggle
		.nav-dropdown-trigger__chevron {
		transform: rotate(-180deg);
	}

	/* Dropdown menu: collapsed by default, expand when parent is open. */
	.main-nav .navbar .navbar-nav .nav-item .nav-dropdown-menu {
		position: static !important;
		opacity: 1;
		visibility: visible;
		width: 100%;
		box-shadow: none;
		background: transparent;
		padding: 0 12px 0 0;
		display: block;
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.25s ease, padding 0.25s ease;
	}
	.main-nav
		.navbar
		.navbar-nav
		.nav-item--has-dropdown.nav-item--open
		.nav-dropdown-menu {
		max-height: 1000px;
		padding: 4px 12px 8px 0;
	}
	.main-nav
		.navbar
		.navbar-nav
		.nav-item
		.nav-dropdown-menu
		li
		.nav-dropdown-item {
		padding: 9px 10px;
	}
}

/* Desktop (≥1200px): hover opens the dropdown.
   Click on the parent label navigates to /listings?section=X.
   The mobile-only chevron toggle button is hidden — desktop uses the
   inline chevron inside the link (handled by the original chevron rule). */
@media (min-width: 1200px) {
	.nav-dropdown-row {
		display: contents;
	}
	.nav-dropdown-toggle {
		display: none;
	}
	.main-nav
		.navbar
		.navbar-nav
		.nav-item--has-dropdown
		.nav-dropdown-menu {
		right: 0;
	}
	.main-nav
		.navbar
		.navbar-nav
		.nav-item--has-dropdown:hover
		.nav-dropdown-menu {
		opacity: 1;
		visibility: visible;
		top: 100%;
	}
}

.main-nav .navbar .navbar-nav .nav-item .dropdown-menu {
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	background: #ffffff;
	position: absolute;
	visibility: hidden;
	border-radius: 5px;
	display: block;
	width: 250px;
	border: none;
	z-index: 99;
	opacity: 0;
	top: 80px;
	right: 0;
	padding: 0;
}

.main-nav .navbar .navbar-nav .nav-item .dropdown-menu li {
	padding: 0;
}

.main-nav .navbar .navbar-nav .nav-item .dropdown-menu li a {
	color: #0c0b0b;
	padding: 15px;
	border-bottom: 1px dashed #ededed;
	margin: 0;
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
	display: block;
	position: relative;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	a.dropdown-toggle::after {
	display: none;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	a.dropdown-toggle::before {
	content: "\EA4E";
	position: absolute;
	top: 14px;
	left: 13px;
	font-family: remixicon !important;
	line-height: 1;
	font-size: 17px;
}

.main-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:hover,
.main-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:focus,
.main-nav .navbar .navbar-nav .nav-item .dropdown-menu li a.active {
	color: #f0002a;
}

.main-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu {
	right: 250px;
	top: 0;
	opacity: 0;
	visibility: hidden;
	border-radius: 5px;
}

.main-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a {
	color: #0c0b0b;
	border-bottom: 1px dashed #ededed;
	font-size: 15px;
	font-weight: 400;
	line-height: 1;
	position: relative;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	a.dropdown-toggle::after {
	display: none;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	a.dropdown-toggle::before {
	content: "\EA4E";
	position: absolute;
	top: 14px;
	left: 13px;
	font-family: remixicon !important;
	line-height: 1;
	font-size: 17px;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:hover,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:focus,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	a.active {
	color: #f0002a;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu {
	right: 250px;
	top: 0;
	opacity: 0;
	visibility: hidden;
	border-radius: 5px;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a {
	color: #000000;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:hover,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:focus,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a.active {
	color: #f0002a;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu {
	right: -250px;
	top: 0;
	opacity: 0;
	visibility: hidden;
	border-radius: 5px;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a {
	color: #000000;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:hover,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:focus,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a.active {
	color: #f0002a;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu {
	right: -250px;
	top: 0;
	opacity: 0;
	visibility: hidden;
	border-radius: 5px;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a {
	color: #000000;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:hover,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:focus,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a.active {
	color: #f0002a;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu {
	right: -250px;
	top: 0;
	opacity: 0;
	visibility: hidden;
	border-radius: 5px;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a {
	color: #000000;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:hover,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:focus,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a.active {
	color: #f0002a;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu {
	right: -250px;
	top: 0;
	opacity: 0;
	visibility: hidden;
	border-radius: 5px;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a {
	color: #000000;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:hover,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a:focus,
.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	a.active {
	color: #f0002a;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li.active
	a {
	color: #f0002a;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li:hover
	.dropdown-menu {
	opacity: 1;
	visibility: visible;
	top: -15px;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li.active
	a {
	color: #f0002a;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li:hover
	.dropdown-menu {
	opacity: 1;
	visibility: visible;
	top: -1px;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li.active
	a {
	color: #f0002a;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li:hover
	.dropdown-menu {
	opacity: 1;
	top: -1px;
	visibility: visible;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li.active
	a {
	color: #f0002a;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li
	.dropdown-menu
	li:hover
	.dropdown-menu {
	opacity: 1;
	top: -15px;
	visibility: visible;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li.active
	a {
	color: #f0002a;
}

.main-nav
	.navbar
	.navbar-nav
	.nav-item
	.dropdown-menu
	li
	.dropdown-menu
	li:hover
	.dropdown-menu {
	opacity: 1;
	visibility: visible;
	top: -15px;
}

.main-nav .navbar .navbar-nav .nav-item .dropdown-menu li.active a {
	color: #f0002a;
}

.main-nav .navbar .navbar-nav .nav-item .dropdown-menu li:hover .dropdown-menu {
	opacity: 1;
	visibility: visible;
	top: 0;
}

.main-nav .navbar .navbar-nav .nav-item .dropdown-menu li:last-child a {
	border-bottom: none;
}

.main-nav .navbar .navbar-nav .nav-item:hover .dropdown-menu {
	top: 100%;
	opacity: 1;
	margin-top: 0;
	visibility: visible;
}

.main-nav .navbar .others-options {
	margin-right: 30px;
}

.main-nav .navbar .others-options ul {
	margin-bottom: 0;
	padding-right: 0;
	list-style: none;
}

.main-nav .navbar .others-options ul li {
	display: inline-block;
	margin-left: 20px;
}

.main-nav .navbar .others-options ul li:last-child {
	margin-left: 0;
}

.main-nav .navbar .others-options ul li.register {
	border-left: 1px solid #ececec;
	padding-left: 20px;
}

.main-nav .navbar .others-options ul li .default-btn {
	display: -ms-grid;
	display: grid;
	margin-right: 10px;
}

.main-nav .navbar .others-options.style-three ul li .read-more {
	color: #ffc039;
}

.navbar-toggler {
	border: none;
	background: #eee !important;
	padding: 10px;
	border-radius: 0;
}
.navbar-toggler:focus {
	box-shadow: none;
}
.navbar-toggler .icon-bar {
	width: 28px;
	transition: all 0.3s;
	background: #000;
	height: 2px;
	display: block;
}
.navbar-toggler .top-bar {
	transform: rotate(-45deg);
	transform-origin: 90% 10%;
	right: 4px;
	position: relative;
}
.navbar-toggler .middle-bar {
	opacity: 0;
	margin: 6px 0;
}
.navbar-toggler .bottom-bar {
	transform: rotate(45deg);
	transform-origin: 90% 90%;
	right: 4px;
	position: relative;
}
.navbar-toggler.collapsed .top-bar {
	transform: rotate(0);
	right: 0;
}
.navbar-toggler.collapsed .middle-bar {
	opacity: 1;
}
.navbar-toggler.collapsed .bottom-bar {
	transform: rotate(0);
	right: 0;
}

@-webkit-keyframes fadeInDown {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
	}
}

@keyframes fadeInDown {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
	}
}

.dark-mode-btn {
	position: fixed;
	bottom: 27px;
	left: 0;
	z-index: 9;
	width: 50px;
}

.dark-mode-btn .dark-version {
	text-align: center;
	float: left;
	z-index: 2;
	position: relative;
}

.dark-mode-btn .dark-version .switch {
	width: 52px;
	height: 52px;
	position: relative;
	border-radius: 50%;
	margin-bottom: -19px;
}

.dark-mode-btn .dark-version .switch input {
	width: 0;
	height: 0;
	opacity: 0;
	display: block;
}

.dark-mode-btn .dark-version .slider {
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	cursor: pointer;
	position: absolute;
	color: #ffffff;
	background-color: #2e2e2e;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.dark-mode-btn .dark-version .slider:before {
	right: 0;
	top: 50%;
	left: 0;
	content: "\f1bf";
	position: absolute;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	font-size: 22px;
	font-family: remixicon !important;
}

.dark-mode-btn .dark-version .slider.round {
	border-radius: 50%;
}

.dark-mode-btn .dark-version .slider.round:before {
	border-radius: 50%;
}

.dark-mode-btn .dark-version input:checked + .slider {
	background-color: #efefef;
}

.dark-mode-btn .dark-version input:checked + .slider:before {
	color: #0c0b0b;
	content: "\ef72";
}

.user-menu-dropdown {
	position: relative;
	top: 0;
}
.user-menu-trigger {
	border: 1px solid rgba(0, 0, 0, 0.05);
	background: #ffffff;
	padding: 4px 4px 4px 10px;
	border-radius: 999px;
	cursor: pointer;
	font-size: 14px;
	transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
.user-menu-trigger:focus-visible {
	outline: 2px solid #f0002a;
	outline-offset: 2px;
}
.user-menu-trigger span {
	font-weight: 600;
}
.user-menu-trigger .transition {
	transition: transform 0.2s ease;
}
.user-menu-trigger .rotate-180 {
	transform: rotate(-180deg);
}
.user-menu-dropdown .dropdown {
	-webkit-box-shadow: 0 10px 30px rgba(15, 15, 15, 0.08);
	box-shadow: 0 10px 30px rgba(15, 15, 15, 0.08);
	background: #ffffff;
	position: absolute;
	border-radius: 12px;
	width: 260px;
	z-index: 99;
	left: 0;
	padding: 18px;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(12px) scale(0.96);
	transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
}
.user-menu-dropdown:hover .dropdown,
.user-menu-dropdown.is-open .dropdown {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0) scale(1);
}
.user-menu-dropdown .dropdown ul {
	padding-right: 0;
	margin-bottom: 0;
}
.user-menu-dropdown .dropdown ul li {
	display: block !important;
}
.user-menu-dropdown .dropdown ul li + li {
	margin-top: 6px;
}
.user-menu-dropdown .dropdown ul li i {
	position: relative;
	top: 2px;
	font-size: 18px;
	margin-left: 8px;
	color: #f0002a;
}
.user-menu-dropdown .dropdown ul li a {
	display: block;
	font-size: 14px;
	padding: 6px;
	border-radius: 6px;
	transition: background 0.2s ease, color 0.2s ease;
}
.user-menu-dropdown .dropdown ul li a.non-active:hover {
	background: rgba(240, 0, 42, 0.06);
	color: #0c0b0b;
}
.user-menu-dropdown .dropdown ul li .user-nav-link.active {
	color: #f0002a;
	background: rgba(240, 0, 42, 0.08);
}
.user-menu-dropdown .dropdown hr {
  margin: 12px 0;
  opacity: 0.2;
}
.user-menu-dropdown .dropdown ul li.user-menu-header {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #98a2b3;
  padding: 10px 6px 4px;
  margin-top: 4px;
}
.user-menu-dropdown .dropdown ul li.user-menu-header + li {
  margin-top: 2px;
}

.empty-state {
  background: #fff;
  border-radius: 24px;
  padding: 60px 40px;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
  max-width: 640px;
  margin: 0 auto;
}
.empty-state__icon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  margin: 0 auto 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 34px;
  color: #f0002a;
  background: rgba(240, 0, 42, 0.12);
}
.empty-state h3 {
  font-size: 26px;
  margin-bottom: 12px;
}
.empty-state p {
  max-width: 420px;
  margin: 0 auto 25px;
  color: #6f6f6f;
}
.empty-state__actions .default-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 26px;
}
.dashboard-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px;
}
.stat-card {
  background: #fff;
  border-radius: 20px;
  padding: 28px;
  box-shadow: 0 20px 60px rgba(10, 10, 10, 0.08);
  display: flex;
  flex-direction: column;
  gap: 18px;
  text-decoration: none;
  color: inherit;
  border: 1px solid rgba(0, 0, 0, 0.04);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.stat-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 30px 70px rgba(240, 0, 42, 0.15);
}
.stat-card__icon {
  width: 48px;
  height: 48px;
  border-radius: 15px;
  background: rgba(240, 0, 42, 0.12);
  color: #f0002a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}
.stat-card__title {
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #7a7a7a;
  margin-bottom: 6px;
}
.stat-card__value {
  font-size: 38px;
  margin: 0;
}
.stat-card__description {
  font-size: 14px;
  color: #6f6f6f;
}
.stat-card__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: #f0002a;
}
.dashboard-section {
  padding: 80px 0;
}
.admin-grid {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 32px;
}
.admin-grid__sidebar {
  position: sticky;
  top: 120px;
  align-self: start;
}
.admin-grid__content {
  background: #fff;
  border-radius: 24px;
  padding: 32px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.06);
}
.dashboard-header {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 30px;
}
.dashboard-eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 13px;
  color: #8a8a8a;
  margin-bottom: 6px;
}
.dashboard-title {
  font-size: 30px;
  margin: 0;
}
.dashboard-actions .default-btn i {
  margin-right: 6px;
}
/* Dashboard blog list — admin view. Compact horizontal cards with a
   clear three-zone layout: thumbnail (left), title + meta (centre),
   action toolbar (right). Mirrors the dashboard listings row pattern
   so admins can scan blogs the same way they scan listings. */
.dashboard-blog-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.dashboard-blog-card {
  display: grid;
  grid-template-columns: 200px 1fr auto;
  gap: 20px;
  align-items: center;
  padding: 16px;
  border: 1px solid #ececec;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.2s ease, box-shadow 0.2s ease,
    transform 0.2s ease;
}
.dashboard-blog-card:hover {
  border-color: #d4d4d4;
  box-shadow: 0 12px 28px -16px rgba(15, 23, 42, 0.18);
}
.dashboard-blog-card__media {
  position: relative;
  width: 200px;
  height: 132px;
  border-radius: 12px;
  overflow: hidden;
  background: #f3f4f6;
  display: block;
  flex-shrink: 0;
}
.dashboard-blog-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  transition: transform 0.4s ease;
}
.dashboard-blog-card:hover .dashboard-blog-card__media img {
  transform: scale(1.04);
}
.dashboard-blog-card__media-empty {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: #cbd5e1;
  background: linear-gradient(-135deg, #f8fafc 0%, #f1f5f9 100%);
}
/* Status pill floats over the thumbnail so admins see at a glance which
   posts are live vs still drafts. */
.dbc-status {
  position: absolute;
  top: 10px;
  inset-inline-start: 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  backdrop-filter: blur(6px);
  z-index: 2;
}
.dbc-status__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}
.dbc-status--published {
  color: #027a48;
  background: rgba(236, 253, 245, 0.92);
}
.dbc-status--draft {
  color: #475569;
  background: rgba(241, 245, 249, 0.92);
}

.dashboard-blog-card__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.dashboard-blog-card__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  color: #6b7280;
  flex-wrap: wrap;
}
.dashboard-blog-card__category {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: #582949;
  font-size: 11.5px;
}
.dashboard-blog-card__sep {
  color: #cbd5e1;
}
.dashboard-blog-card__date {
  font-weight: 500;
}
.dashboard-blog-card__title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.4;
  color: #0f172a;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.dashboard-blog-card__title a {
  color: inherit;
  transition: color 0.2s ease;
}
.dashboard-blog-card__title a:hover {
  color: #582949;
}

/* Action toolbar — uniform pill buttons, icon + label, with role-based
   colour coding (primary/edit · neutral/view · danger/delete). */
.dashboard-blog-card__actions {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: stretch;
  min-width: 130px;
}
.dbc-action {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #1f2937;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.18s ease, border-color 0.18s ease,
    color 0.18s ease;
}
.dbc-action i {
  font-size: 15px;
  line-height: 1;
}
.dbc-action:hover {
  border-color: #cbd5e1;
  background: #f9fafb;
  color: #0f172a;
}
.dbc-action--primary {
  background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
  border-color: transparent;
  color: #fff;
}
.dbc-action--primary:hover {
  background: linear-gradient(-135deg, #5a2a48 0%, #46213b 100%);
  color: #fff;
  border-color: transparent;
}
.dbc-action--danger {
  color: #b42318;
  border-color: #fee4e2;
  background: #fff5f5;
}
.dbc-action--danger:hover {
  background: #fee4e2;
  border-color: #fda29b;
  color: #912018;
}
.dbc-action[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
}

/* Legacy class kept for any other dashboard pages still using the
   filled red action button. */
.default-btn.danger-btn {
  background: #fee4e2;
  border-color: #fee4e2;
  color: #b42318;
}

/* Submit-button loading spinner */
.btn-spinner {
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-inline-end: 0.5em;
  border: 2px solid currentColor;
  border-left-color: transparent;
  border-radius: 50%;
  vertical-align: -0.125em;
  animation: btn-spinner-rotate 0.6s linear infinite;
}
@keyframes btn-spinner-rotate {
  to {
    transform: rotate(-360deg);
  }
}
.default-btn.danger-btn:hover {
  background: #b42318;
  border-color: #b42318;
  color: #fff;
}

/* Listing edit form — bilingual translations panel */
.elf-translations {
  border: 1px solid #e4e4e7;
  border-radius: 14px;
  padding: 20px;
  background: #fafbfc;
  margin-top: 8px;
  margin-bottom: 8px;
}
.elf-translations__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid #ececef;
}
.elf-translations__title {
  font-size: 16px;
  font-weight: 700;
  color: #101828;
  margin: 0 0 2px;
}
.elf-translations__hint {
  font-size: 12px;
  color: #667085;
  margin: 0;
}
.elf-lang-tabs {
  display: inline-flex;
  background: #ffffff;
  border: 1px solid #e4e4e7;
  border-radius: 8px;
  padding: 3px;
  gap: 2px;
}
.elf-lang-tab {
  padding: 6px 14px;
  border: none;
  background: transparent;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  color: #475467;
  cursor: pointer;
  transition: all 0.15s ease;
}
.elf-lang-tab:hover {
  color: #101828;
}
.elf-lang-tab--active {
  background: #f0002a;
  color: #ffffff;
}
.elf-translations__panel {
  display: flex;
  flex-direction: column;
}

/* Listing form — section selector tabs */
.lf-section-label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #475467;
  margin-bottom: 8px;
}
.lf-section-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.lf-section-tab {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  padding: 14px 16px;
  background: #ffffff;
  border: 1.5px solid #e4e4e7;
  border-radius: 12px;
  cursor: pointer;
  text-align: start;
  transition: all 0.15s ease;
}
.lf-section-tab:hover:not(:disabled) {
  border-color: #d0d5dd;
  background: #fafbfc;
}
.lf-section-tab:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.lf-section-tab--active {
  border-color: #101828;
  background: #101828;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08);
}
.lf-section-tab--active:hover:not(:disabled) {
  background: #1f2a3d;
  border-color: #1f2a3d;
}
.lf-section-tab__title {
  font-size: 14px;
  font-weight: 600;
  color: #101828;
}
.lf-section-tab--active .lf-section-tab__title {
  color: #ffffff;
}
.lf-section-tab__hint {
  font-size: 12px;
  color: #667085;
  line-height: 1.4;
}
.lf-section-tab--active .lf-section-tab__hint {
  color: rgba(255, 255, 255, 0.78);
}

/* Listing form — bilingual content panel (title + description) */
.lf-content-panel {
  border: 1px solid #e4e4e7;
  border-radius: 14px;
  padding: 20px;
  background: #ffffff;
  margin-bottom: 16px;
}
.lf-content-panel__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid #ececef;
}
.lf-content-panel__title {
  font-size: 16px;
  font-weight: 700;
  color: #101828;
  margin: 0 0 2px;
}
.lf-content-panel__hint {
  font-size: 12px;
  color: #667085;
  margin: 0;
}
.lf-content-panel__body {
  display: flex;
  flex-direction: column;
}

/* React-Select invalid state */
.select-input--invalid > div:first-of-type {
  border-color: #d92d20 !important;
  box-shadow: 0 0 0 3px rgba(217, 45, 32, 0.08) !important;
}

/* Rich text editor (Tiptap) */
.rte-editor {
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  background: #ffffff;
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.rte-editor:focus-within {
  border-color: #101828;
  box-shadow: 0 0 0 3px rgba(16, 24, 40, 0.08);
}
.rte-editor--invalid {
  border-color: #d92d20;
}
.rte-editor--invalid:focus-within {
  box-shadow: 0 0 0 3px rgba(217, 45, 32, 0.12);
}
.rte-editor--disabled {
  background: #f5f5f7;
  opacity: 0.75;
}
.rte-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 8px 10px;
  background: #fafbfc;
  border-bottom: 1px solid #e4e4e7;
}
.rte-toolbar__group {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.rte-toolbar__sep {
  width: 1px;
  height: 20px;
  background: #e4e4e7;
  margin: 0 4px;
}
.rte-toolbar__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  padding: 0 8px;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  color: #475467;
  cursor: pointer;
  transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.rte-toolbar__btn i {
  font-size: 16px;
  line-height: 1;
}
.rte-toolbar__btn:hover:not(:disabled) {
  background: #ffffff;
  border-color: #e4e4e7;
  color: #101828;
}
.rte-toolbar__btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.rte-toolbar__btn--active {
  background: #101828;
  border-color: #101828;
  color: #ffffff;
}
.rte-toolbar__btn--active:hover:not(:disabled) {
  background: #1f2a3d;
  border-color: #1f2a3d;
  color: #ffffff;
}
.rte-editor__body {
  padding: 0;
}
.rte-editor__body .rte-content {
  min-height: 220px;
  padding: 14px 16px;
  outline: none;
  color: #101828;
  font-size: 14px;
  line-height: 1.6;
}
.rte-editor__body .rte-content > * + * {
  margin-top: 0.6em;
}
.rte-editor__body .rte-content h2 {
  font-size: 20px;
  font-weight: 700;
  margin-top: 0.8em;
}
.rte-editor__body .rte-content h3 {
  font-size: 17px;
  font-weight: 700;
  margin-top: 0.7em;
}
.rte-editor__body .rte-content h4 {
  font-size: 15px;
  font-weight: 700;
  margin-top: 0.6em;
}
.rte-editor__body .rte-content ul,
.rte-editor__body .rte-content ol {
  padding-inline-start: 1.4em;
}
.rte-editor__body .rte-content blockquote {
  border-inline-start: 3px solid #e4e4e7;
  padding-inline-start: 12px;
  color: #475467;
  font-style: italic;
}
.rte-editor__body .rte-content a {
  color: #1d4ed8;
  text-decoration: underline;
}
.rte-editor__body .rte-content code {
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  padding: 1px 5px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.92em;
}
.rte-editor__body .rte-content pre {
  background: #0f172a;
  color: #f8fafc;
  border-radius: 8px;
  padding: 12px 14px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 13px;
  overflow-x: auto;
}
.rte-editor__body .rte-content pre code {
  background: transparent;
  border: none;
  color: inherit;
  padding: 0;
}
.rte-editor__body .rte-content hr {
  border: none;
  border-top: 1px solid #e4e4e7;
  margin: 1.2em 0;
}
.rte-editor__body .rte-content[dir="rtl"] {
  text-align: left;
}
/* Empty-editor placeholder (toggled via .rte-editor--empty on the root) */
.rte-editor--empty .rte-content > p:first-child::before {
  content: attr(data-placeholder);
  color: #98a2b3;
  pointer-events: none;
  height: 0;
  float: right;
}
.rte-editor--empty .rte-content[dir="rtl"] > p:first-child::before {
  float: left;
}

@media (max-width: 575px) {
  .lf-section-tabs {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   Admin Dashboard Home — overview, KPIs, engagement, breakdown,
   recent activity. Components live in DashboardOverview.js.
   ═══════════════════════════════════════════════════════════════════ */
.dh {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

/* Header */
.dh-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.dh-eyebrow {
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #98a2b3;
  margin: 0 0 4px;
}
.dh-title {
  font-size: 28px;
  font-weight: 800;
  color: #101828;
  margin: 0 0 6px;
  letter-spacing: -0.02em;
}
.dh-subtitle {
  font-size: 14px;
  color: #667085;
  margin: 0;
}
.dh-header__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  background: #f0002a;
  color: #ffffff !important;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid #f0002a;
  transition: all 0.15s ease;
}
.dh-header__cta:hover {
  background: #d10024;
  border-color: #d10024;
}

/* Section scaffold */
.dh-section {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.dh-section__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.dh-section__title {
  font-size: 16px;
  font-weight: 700;
  color: #101828;
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  letter-spacing: -0.01em;
}
.dh-section__title i {
  color: #f0002a;
  font-size: 18px;
}
.dh-section__hint {
  font-size: 12.5px;
  color: #6b7280;
  margin: 4px 0 0;
}
.dh-pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 600;
  background: #f1f5f9;
  color: #475467;
}
.dh-pill--success {
  background: #ecfdf5;
  color: #027a48;
}
.dh-pill--info {
  background: #eef4ff;
  color: #1d4ed8;
}
.dh-pill--pending {
  background: #fffbeb;
  color: #b45309;
}
.dh-pill--danger {
  background: #fef3f2;
  color: #b42318;
}
.dh-pill--muted {
  background: #f1f5f9;
  color: #475569;
}
.dh-card {
  background: #ffffff;
  border: 1px solid #ececef;
  border-radius: 14px;
  padding: 20px;
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.04);
}
.dh-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12.5px;
  font-weight: 600;
  color: #f0002a;
  text-decoration: none;
}
.dh-link:hover {
  color: #c8001f;
}
.dh-empty-state {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 18px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  border-radius: 10px;
  color: #027a48;
  font-size: 13.5px;
  font-weight: 500;
}
.dh-empty-state i {
  font-size: 18px;
}
.dh-empty-state--small {
  background: #fafbfc;
  border-color: #ececef;
  color: #6b7280;
  padding: 16px 18px;
  width: 100%;
  justify-content: center;
}

/* Action items */
.dh-action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}
.dh-action {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: #ffffff;
  border: 1px solid #ececef;
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
  transition: all 0.15s ease;
  position: relative;
  overflow: hidden;
}
.dh-action::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0;
  bottom: 0;
  width: 4px;
}
.dh-action:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px -8px rgba(15, 23, 42, 0.12);
  color: inherit;
  text-decoration: none;
}
.dh-action__icon {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  font-size: 20px;
  flex-shrink: 0;
}
.dh-action__body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1;
}
.dh-action__count {
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
  color: #101828;
  letter-spacing: -0.02em;
}
.dh-action__label {
  font-size: 12.5px;
  color: #475467;
  line-height: 1.4;
}
.dh-action__cta {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  white-space: nowrap;
}
.dh-action:hover .dh-action__cta {
  color: #f0002a;
}
[dir="rtl"] .dh-action__cta i {
  transform: scaleX(-1);
}
.dh-action--danger::before { background: #f0002a; }
.dh-action--danger .dh-action__icon { background: #fef3f2; color: #b42318; }
.dh-action--info::before { background: #2563eb; }
.dh-action--info .dh-action__icon { background: #eef4ff; color: #1d4ed8; }
.dh-action--warning::before { background: #d97706; }
.dh-action--warning .dh-action__icon { background: #fffbeb; color: #b45309; }
.dh-action--muted::before { background: #98a2b3; }
.dh-action--muted .dh-action__icon { background: #f1f5f9; color: #475569; }

/* KPI grid */
.dh-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
}
.dh-kpi {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 18px;
  background: #ffffff;
  border: 1px solid #ececef;
  border-radius: 14px;
  text-decoration: none;
  color: inherit;
  transition: all 0.15s ease;
  position: relative;
  overflow: hidden;
}
.dh-kpi::after {
  content: "";
  position: absolute;
  inset-inline-end: -30px;
  top: -30px;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  opacity: 0.06;
}
.dh-kpi:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
  color: inherit;
  text-decoration: none;
}
.dh-kpi__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.dh-kpi__icon {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  font-size: 18px;
}
.dh-kpi__value {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #101828;
  line-height: 1.1;
  margin-top: 6px;
}
.dh-kpi__label {
  font-size: 13px;
  color: #475467;
  font-weight: 500;
}
.dh-kpi__total {
  font-size: 11.5px;
  color: #98a2b3;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed #ececef;
}
.dh-kpi--blue .dh-kpi__icon { background: #eef4ff; color: #1d4ed8; }
.dh-kpi--blue::after { background: #1d4ed8; }
.dh-kpi--violet .dh-kpi__icon { background: #f5f3ff; color: #7c3aed; }
.dh-kpi--violet::after { background: #7c3aed; }
.dh-kpi--amber .dh-kpi__icon { background: #fffbeb; color: #d97706; }
.dh-kpi--amber::after { background: #d97706; }
.dh-kpi--green .dh-kpi__icon { background: #ecfdf5; color: #16a34a; }
.dh-kpi--green::after { background: #16a34a; }

/* Delta indicator */
.dh-delta {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}
.dh-delta i {
  font-size: 12px;
}
.dh-delta--up {
  background: #ecfdf5;
  color: #027a48;
}
.dh-delta--down {
  background: #fef3f2;
  color: #b42318;
}
.dh-delta--flat {
  background: #f1f5f9;
  color: #6b7280;
}

/* Engagement grid */
.dh-engagement-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
}
.dh-metric {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
  background: #ffffff;
  border: 1px solid #ececef;
  border-radius: 12px;
  position: relative;
  overflow: hidden;
}
.dh-metric__icon {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  font-size: 16px;
  margin-bottom: 4px;
}
.dh-metric__value {
  font-size: 22px;
  font-weight: 800;
  color: #101828;
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.dh-metric__label {
  font-size: 12px;
  color: #475467;
}
.dh-metric--blue .dh-metric__icon { background: #eef4ff; color: #1d4ed8; }
.dh-metric--violet .dh-metric__icon { background: #f5f3ff; color: #7c3aed; }
.dh-metric--green .dh-metric__icon { background: #ecfdf5; color: #16a34a; }
.dh-metric--amber .dh-metric__icon { background: #fffbeb; color: #d97706; }

/* Two-column split */
.dh-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

/* Stacked bar (listing status) */
.dh-bar {
  display: flex;
  width: 100%;
  height: 12px;
  background: #f1f5f9;
  border-radius: 999px;
  overflow: hidden;
  margin-top: 4px;
}
.dh-bar__seg {
  display: block;
  height: 100%;
  transition: width 0.3s ease;
}
.dh-bar__seg--approved { background: #16a34a; }
.dh-bar__seg--pending  { background: #d97706; }
.dh-bar__seg--draft    { background: #94a3b8; }
.dh-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  list-style: none;
  padding: 0 !important;
  margin: 0 !important;
}
.dh-legend__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: #475467;
  margin: 0 !important;
  padding: 0 !important;
}
.dh-legend__item::before {
  display: none !important;
}
.dh-legend__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.dh-legend__value {
  font-weight: 700;
  color: #101828;
}

/* Section split (Consumer vs B2B) */
.dh-split-bar {
  height: 8px;
  width: 100%;
  background: #0f172ac7;
  border-radius: 999px;
  overflow: hidden;
  margin-top: 14px;
}
.dh-split-bar__fill {
  height: 100%;
  display: block;
  border-radius: 999px;
  transition: width 0.3s ease;
}
.dh-split-bar__fill--consumer {
  background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
}
.dh-split-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.dh-split-row__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: #475467;
}
.dh-split-row__item strong {
  margin-inline-start: 4px;
  color: #101828;
}
.dh-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.dh-dot--consumer {
  background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
}
.dh-dot--b2b {
  background: #0f172ac7;
}

/* Featured / verified flags */
.dh-flag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid #ececef;
}
.dh-flag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 10px;
  font-size: 12.5px;
  color: #475467;
}
.dh-flag i {
  font-size: 14px;
}
.dh-flag strong {
  margin-inline-start: 4px;
  color: #101828;
  font-weight: 700;
}
.dh-flag--featured {
  background: #fffbeb;
  border: 1px solid #fef3c7;
}
.dh-flag--featured i { color: #d97706; }
.dh-flag--verified {
  background: #ecfdf5;
  border: 1px solid #d1fae5;
}
.dh-flag--verified i { color: #059669; }

/* Library list */
.dh-lib-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  list-style: none;
  padding: 0 !important;
  margin: 0 !important;
}
.dh-lib-list > li {
  margin: 0 !important;
  padding: 0 !important;
}
.dh-lib-list > li::before {
  display: none !important;
}
.dh-lib-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #fafbfc;
  border: 1px solid transparent;
  text-decoration: none;
  color: #344054;
  transition: all 0.15s ease;
}
.dh-lib-item:hover:not(.dh-lib-item--static) {
  background: #ffffff;
  border-color: #ececef;
  color: #101828;
}
.dh-lib-item i {
  font-size: 18px;
  color: #98a2b3;
  width: 22px;
  flex-shrink: 0;
}
.dh-lib-item:hover:not(.dh-lib-item--static) i {
  color: #f0002a;
}
.dh-lib-item__label {
  flex: 1;
  font-size: 13.5px;
  font-weight: 500;
}
.dh-lib-item__value {
  font-size: 14px;
  font-weight: 700;
  color: #101828;
}

/* Recent feed */
.dh-feed {
  list-style: none;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.dh-feed__item {
  margin: 0 !important;
  padding: 0 !important;
}
.dh-feed__item::before {
  display: none !important;
}
.dh-feed__link {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 9px;
  text-decoration: none;
  color: inherit;
  transition: background 0.15s ease;
}
.dh-feed__link:hover {
  background: #fafbfc;
}
.dh-feed__title {
  font-size: 13.5px;
  font-weight: 600;
  color: #101828;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dh-feed__meta {
  font-size: 12px;
  color: #6b7280;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.dh-feed__sep {
  color: #d0d5dd;
}

/* Responsive */
@media (max-width: 991px) {
  .dh-split {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 575px) {
  .dh-title {
    font-size: 22px;
  }
  .dh-action {
    flex-wrap: wrap;
  }
  .dh-action__cta {
    width: 100%;
    justify-content: flex-end;
  }
}

/* Dashboard Categories page */
.dcat-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 28px;
}
.dcat-eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
  color: #98a2b3;
  margin: 0 0 4px;
  font-weight: 600;
}
.dcat-title {
  font-size: 28px;
  font-weight: 700;
  color: #101828;
  margin: 0 0 6px;
  line-height: 1.2;
}
.dcat-subtitle {
  font-size: 14px;
  color: #667085;
  margin: 0;
}
.dcat-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  background: #f0002a;
  color: #ffffff;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid #f0002a;
  transition: all 0.15s ease;
}
.dcat-cta:hover {
  background: #c8001f;
  border-color: #c8001f;
  color: #ffffff;
}

.dcat-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding: 12px 0 18px;
  margin-bottom: 4px;
  border-bottom: 1px solid #f4f4f5;
}
.dcat-toolbar__right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1 1 280px;
  justify-content: flex-end;
}
.dcat-tabs {
  display: inline-flex;
  background: #f4f4f5;
  border-radius: 10px;
  padding: 3px;
  gap: 2px;
}
.dcat-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border: none;
  background: transparent;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #475467;
  cursor: pointer;
  transition: all 0.15s ease;
}
.dcat-tab:hover {
  color: #101828;
}
.dcat-tab--active {
  background: #ffffff;
  color: #101828;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
.dcat-tab__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.06);
  font-size: 11px;
  font-weight: 700;
  color: #475467;
}
.dcat-tab--active .dcat-tab__count {
  background: #f0002a;
  color: #ffffff;
}

.dcat-search {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 1 1 220px;
  max-width: 280px;
}
.dcat-search__icon {
  position: absolute;
  right: 12px;
  display: inline-flex;
  color: #98a2b3;
  pointer-events: none;
}
.dcat-search__input {
  width: 100%;
  padding: 9px 36px 9px 36px;
  border: 1px solid #e4e4e7;
  border-radius: 10px;
  font-size: 13px;
  background: #ffffff;
  color: #101828;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.dcat-search__input:focus {
  outline: none;
  border-color: #f0002a;
  box-shadow: 0 0 0 3px rgba(240, 0, 42, 0.1);
}
.dcat-search__input::placeholder {
  color: #98a2b3;
}
.dcat-search__clear {
  position: absolute;
  left: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: none;
  background: #f2f4f7;
  color: #475467;
  border-radius: 50%;
  cursor: pointer;
  padding: 0;
  transition: all 0.15s ease;
}
.dcat-search__clear:hover {
  background: #e4e7ec;
  color: #101828;
}
.dcat-link-btn {
  background: none;
  border: none;
  color: #475467;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 4px;
  cursor: pointer;
  transition: color 0.15s ease;
  white-space: nowrap;
}
.dcat-link-btn:hover {
  color: #101828;
}

.dcat-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 12px;
}
.dcat-group {
  display: flex;
  flex-direction: column;
}
.dcat-children {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 2px;
  padding-right: 12px;
  position: relative;
}
.dcat-children::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 12px;
  right: 28px;
  width: 2px;
  background: #f0f0f2;
  border-radius: 2px;
}

.dcat-row {
  display: grid;
  grid-template-columns: 32px 36px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #ffffff;
  border: 1px solid #ececef;
  border-radius: 10px;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.dcat-row__icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.dcat-icon-badge {
  --cat-color: #582949;
  --cat-tint: #f3eef1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--cat-tint);
  color: var(--cat-color);
  flex-shrink: 0;
  transition: background 0.15s ease, color 0.15s ease;
}
.dcat-icon-badge i {
  font-size: 18px;
  line-height: 1;
}
.dcat-row:hover .dcat-icon-badge {
  background: var(--cat-color);
  color: #ffffff;
}
.dcat-row:hover {
  border-color: #d0d5dd;
  background: #fafbfc;
}
.dcat-row--child {
  background: #fcfcfd;
  border-color: #f0f0f2;
  margin-right: 36px;
  padding: 9px 14px;
}
.dcat-row__lead {
  display: flex;
  align-items: center;
  justify-content: center;
}
.dcat-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border: none;
  background: transparent;
  color: #475467;
  cursor: pointer;
  border-radius: 6px;
  padding: 0;
  transition: background 0.15s ease;
}
.dcat-toggle:hover {
  background: #f4f4f5;
  color: #101828;
}
.dcat-toggle--leaf {
  cursor: default;
  opacity: 0;
}
.dcat-child-bar {
  width: 16px;
  height: 2px;
  background: #d0d5dd;
  border-radius: 2px;
}
.dcat-row__main {
  min-width: 0;
}
.dcat-row__title {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.dcat-name {
  font-size: 14px;
  font-weight: 600;
  color: #101828;
  line-height: 1.3;
}
.dcat-row--child .dcat-name {
  font-size: 13.5px;
  font-weight: 500;
  color: #344054;
}
.dcat-row__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 12px;
  color: #667085;
}
.dcat-slug {
  font-family: "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 12px;
  background: #f4f4f5;
  color: #475467;
  padding: 2px 6px;
  border-radius: 4px;
}
.dcat-meta-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  background: #eef4ff;
  color: #1d4ed8;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}
.dcat-meta-dim {
  color: #98a2b3;
  font-size: 11px;
}

.dcat-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.dcat-tag--b2b {
  background: #eff6ff;
  color: #1d4ed8;
}
.dcat-tag--consumer {
  background: #ecfdf3;
  color: #027a48;
}
.dcat-tag--system {
  background: #f4f4f5;
  color: #475467;
}
.dcat-tag--inactive {
  background: #fef3f2;
  color: #b42318;
}

.dcat-row__actions {
  display: flex;
  align-items: center;
  gap: 4px;
}
.dcat-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid #e4e4e7;
  background: #ffffff;
  color: #475467;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.15s ease;
  padding: 0;
}
.dcat-action:hover {
  background: #f9fafb;
  border-color: #d0d5dd;
  color: #101828;
}
.dcat-action--danger:hover:not(:disabled) {
  background: #fef3f2;
  border-color: #fda29b;
  color: #b42318;
}
.dcat-action:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.dcat-empty {
  text-align: center;
  padding: 60px 24px;
  background: #fafafa;
  border: 1px dashed #e4e4e7;
  border-radius: 14px;
  color: #667085;
}
.dcat-empty__icon {
  font-size: 38px;
  margin-bottom: 12px;
  color: #d0d5dd;
}
.dcat-empty h3 {
  font-size: 18px;
  color: #101828;
  margin: 0 0 6px;
}
.dcat-empty p {
  font-size: 14px;
  margin: 0 0 20px;
}
.dcat-empty--small {
  padding: 32px 20px;
}
.dcat-empty--small p {
  margin: 0;
}

@media (max-width: 991px) {
  .dcat-toolbar {
    flex-direction: column;
    align-items: stretch;
  }
  .dcat-toolbar__right {
    justify-content: space-between;
  }
  .dcat-tabs {
    width: 100%;
    justify-content: space-between;
  }
  .dcat-tab {
    flex: 1;
    justify-content: center;
  }
  .dcat-row--child {
    margin-right: 20px;
  }
}
@media (max-width: 575px) {
  .dcat-row {
    grid-template-columns: 28px 32px 1fr;
  }
  .dcat-row__actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
    border-top: 1px solid #f4f4f5;
    padding-top: 8px;
  }
  .dcat-icon-badge {
    width: 32px;
    height: 32px;
    border-radius: 8px;
  }
  .dcat-icon-badge i {
    font-size: 16px;
  }
}

/* Dashboard Listings — type filter row */
.dashboard-listings-page .dlp-type-filter {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 0;
  padding: 0;
  border-bottom: 0;
}
.dashboard-listings-page .dlp-type-filter__label {
  font-size: 11px;
  font-weight: 600;
  color: #667085;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-inline-end: 2px;
}

/* Category filter — native <select> sitting on the same row as the type
   pills. Visually matches the pill aesthetic so the toolbar reads as one. */
.dashboard-listings-page .dlp-category-filter {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-inline-start: auto;
  font-size: 13px;
  color: #475467;
}
.dashboard-listings-page .dlp-category-filter__label {
  font-size: 12.5px;
  font-weight: 600;
  color: #667085;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.dashboard-listings-page .dlp-category-filter__select {
  padding: 7px 12px 7px 30px;
  border-radius: 999px;
  border: 1px solid #ececef;
  background: #fff
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23667085' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 6 8 10 12 6'/%3E%3C/svg%3E")
    no-repeat left 10px center / 14px;
  appearance: none;
  -webkit-appearance: none;
  font-size: 13px;
  font-weight: 500;
  color: #1f2937;
  cursor: pointer;
  min-width: 200px;
  max-width: 280px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
[dir="rtl"] .dashboard-listings-page .dlp-category-filter__select {
  padding: 7px 30px 7px 12px;
  background-position: right 10px center;
}
.dashboard-listings-page .dlp-category-filter__select:hover {
  border-color: #d1d5db;
}
.dashboard-listings-page .dlp-category-filter__select:focus {
  outline: none;
  border-color: #f0002a;
  box-shadow: 0 0 0 3px rgba(240, 0, 42, 0.15);
}
.dashboard-listings-page .dlp-type-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  background: #fff;
  border: 1px solid #ececef;
  color: #475467;
  transition: all 0.15s ease;
}
.dashboard-listings-page .dlp-type-pill:hover {
  border-color: #d0d5dd;
  color: #101828;
}
.dashboard-listings-page .dlp-type-pill__count {
  padding: 0 5px;
  border-radius: 10px;
  background: #f3f4f6;
  font-size: 10.5px;
  font-weight: 600;
  color: #475467;
}
.dashboard-listings-page .dlp-type-pill--active {
  border-color: transparent;
  color: #fff;
}
.dashboard-listings-page .dlp-type-pill--active .dlp-type-pill__count {
  background: rgba(255, 255, 255, 0.22);
  color: #fff;
}
.dashboard-listings-page .dlp-type-pill--active-all {
  background: #101828;
}
.dashboard-listings-page .dlp-type-pill--active-consumer {
  background: #f0002a;
}
.dashboard-listings-page .dlp-type-pill--active-b2b {
  background: #2563eb;
}
.dashboard-listings-page .dlp-type-pill--active-featured {
  background: #d97706;
}

/* Dashboard Listings page */
.dashboard-listings-page .dlp-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
.dashboard-listings-page .dlp-title {
  font-size: 26px;
  font-weight: 700;
  margin: 0 0 4px;
  color: #101828;
}
.dashboard-listings-page .dlp-subtitle {
  font-size: 14px;
  color: #667085;
  margin: 0;
}
.dashboard-listings-page .dlp-cta {
  align-self: center;
}
.dashboard-listings-page .dlp-cta-group {
  display: inline-flex;
  align-items: stretch;
  gap: 8px;
  flex-wrap: wrap;
}
.dashboard-listings-page .dlp-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 16px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease,
    background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
  border: 1px solid transparent;
  white-space: nowrap;
}
.dashboard-listings-page .dlp-cta-btn i {
  font-size: 17px;
}
.dashboard-listings-page .dlp-cta-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
}
.dashboard-listings-page .dlp-cta-btn--services {
  background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
  color: #fff;

}
.dashboard-listings-page .dlp-cta-btn--services:hover {
  background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
  color: #fff;
}
.dashboard-listings-page .dlp-cta-btn--b2b {
  background: #fff;
  color: #2563eb;
  border-color: #d4dcef;
}
.dashboard-listings-page .dlp-cta-btn--b2b:hover {
  background: #eef2ff;
  border-color: #2563eb;
  color: #1d4ed8;
}
@media (max-width: 575px) {
  .dashboard-listings-page .dlp-cta-group {
    width: 100%;
  }
  .dashboard-listings-page .dlp-cta-btn {
    flex: 1 1 0;
    justify-content: center;
  }
}
.dlp-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
.dlp-toolbar .dlp-tabs {
  margin-bottom: 0;
}
.dlp-tabs {
  display: inline-flex;
  background: #f4f4f5;
  border-radius: 999px;
  padding: 4px;
  gap: 2px;
  margin-bottom: 18px;
}
.dlp-search {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 1 1 240px;
  max-width: 320px;
}
.dlp-search__icon {
  position: absolute;
  right: 12px;
  display: inline-flex;
  color: #98a2b3;
  pointer-events: none;
}
.dlp-search__input {
  width: 100%;
  padding: 9px 36px 9px 36px;
  border: 1px solid #e4e4e7;
  border-radius: 999px;
  font-size: 13px;
  background: #ffffff;
  color: #101828;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.dlp-search__input:focus {
  outline: none;
  border-color: #d92d20;
  box-shadow: 0 0 0 3px rgba(217, 45, 32, 0.1);
}
.dlp-search__input::placeholder {
  color: #98a2b3;
}
.dlp-search__clear {
  position: absolute;
  left: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: none;
  background: #f2f4f7;
  color: #475467;
  border-radius: 50%;
  cursor: pointer;
  padding: 0;
  transition: all 0.15s ease;
}
.dlp-search__clear:hover {
  background: #e4e7ec;
  color: #101828;
}
.dlp-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  color: #475467;
  text-decoration: none;
  transition: all 0.15s ease;
}
.dlp-tab:hover {
  color: #101828;
}
.dlp-tab--active {
  background: #ffffff;
  color: #101828;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}
.dlp-tab__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.06);
  font-size: 11px;
  font-weight: 700;
  color: #475467;
}
.dlp-tab--active .dlp-tab__count {
  background: #f0002a;
  color: #ffffff;
}

.dashboard-listings-page .dlp-empty {
  text-align: center;
  padding: 60px 20px;
  background: #fafafa;
  border: 1px dashed #e4e4e7;
  border-radius: 14px;
  color: #667085;
}
.dashboard-listings-page .dlp-empty__icon {
  font-size: 40px;
  margin-bottom: 12px;
}
.dashboard-listings-page .dlp-empty h3 {
  font-size: 18px;
  color: #101828;
  margin: 0 0 6px;
}
.dashboard-listings-page .dlp-empty p {
  font-size: 14px;
  margin: 0;
}

/* Dashboard listings — bulk action bar (appears when ≥1 row selected) */
.dashboard-listings-page .dlp-bulkbar {
  position: sticky;
  top: 16px;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 14px;
  background: linear-gradient(-135deg, #4f46e5, #6366f1);
  color: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(99, 102, 241, 0.25);
  margin-bottom: 12px;
}
.dashboard-listings-page .dlp-bulkbar__count {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
}
.dashboard-listings-page .dlp-bulkbar__count i {
  font-size: 18px;
}
.dashboard-listings-page .dlp-bulkbar__actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.dashboard-listings-page .dlp-bulkbar__btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease;
}
.dashboard-listings-page .dlp-bulkbar__btn:hover {
  background: rgba(255, 255, 255, 0.25);
}
.dashboard-listings-page .dlp-bulkbar__btn--approve {
  background: #10b981;
  border-color: #10b981;
}
.dashboard-listings-page .dlp-bulkbar__btn--approve:hover {
  background: #059669;
}
.dashboard-listings-page .dlp-bulkbar__btn--danger {
  background: #ef4444;
  border-color: #ef4444;
}
.dashboard-listings-page .dlp-bulkbar__btn--danger:hover {
  background: #dc2626;
}
.dashboard-listings-page .dlp-bulkbar__clear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  border: 0;
  color: #fff;
  cursor: pointer;
  margin-inline-start: 6px;
}
.dashboard-listings-page .dlp-bulkbar__clear:hover {
  background: rgba(255, 255, 255, 0.3);
}

.dashboard-listings-page .dlp-select-all {
  display: flex;
  align-items: center;
  padding: 6px 0 10px;
}
.dashboard-listings-page .dlp-select-all__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #475569;
  cursor: pointer;
}

.dashboard-listings-page .dlp-row__select {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin-inline-start: 2px;
  margin-inline-end: -4px;
  cursor: pointer;
}
.dashboard-listings-page .dlp-row__select input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: #6366f1;
  margin: 0;
}
.dashboard-listings-page .dlp-row--selected {
  background: #eef2ff;
  border-color: #818cf8 !important;
}

/* Public listings — empty state (replaces single-line "noResults") */
.lp-empty {
  text-align: center;
  padding: 60px 20px;
  background: #fafafa;
  border: 1px dashed #e4e4e7;
  border-radius: 14px;
  color: #667085;
}
.lp-empty__icon {
  font-size: 44px;
  margin-bottom: 12px;
}
.lp-empty__title {
  font-size: 18px;
  color: #101828;
  margin: 0 0 8px;
}
.lp-empty__body {
  font-size: 14px;
  max-width: 460px;
  margin: 0 auto 16px;
}
.lp-empty__actions {
  display: inline-flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
}
.lp-empty__btn {
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  border-radius: 8px;
  border: 1px solid #d1d5db;
  background: #fff;
  color: #374151;
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.lp-empty__btn:hover {
  background: #f9fafb;
  border-color: #9ca3af;
}
.lp-empty__btn--primary {
  background: #6366f1;
  border-color: #6366f1;
  color: #fff;
}
.lp-empty__btn--primary:hover {
  background: #4f46e5;
  border-color: #4f46e5;
}

/* FAQ — empty state recovery button (icon + heading already existed) */
.faq-empty__title {
  font-size: 18px;
  color: #101828;
  margin: 8px 0 4px;
}
.faq-empty__body {
  font-size: 14px;
  color: #667085;
  margin: 0 0 14px;
}
.faq-empty__btn {
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  border-radius: 8px;
  border: 1px solid #6366f1;
  background: #6366f1;
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}
.faq-empty__btn:hover {
  background: #4f46e5;
  border-color: #4f46e5;
}

/* Dashboard loading skeleton (App-router loading.js for /dashboard/*) */
@keyframes dash-skel-shimmer {
  0% { background-position: right -300px top 0; }
  100% { background-position: right 300px top 0; }
}
.dash-skel-line,
.dash-skel-row__media,
.dash-skel-row__action,
.dash-skel-sidebar__header,
.dash-skel-sidebar__icon {
  background: linear-gradient(-90deg, #eef0f3 0%, #f6f7f9 50%, #eef0f3 100%);
  background-size: 600px 100%;
  border-radius: 6px;
  animation: dash-skel-shimmer 1.4s linear infinite;
}
.dash-skel-sidebar {
  background: #fff;
  border: 1px solid #eef0f3;
  border-radius: 12px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dash-skel-sidebar__header {
  height: 24px;
  width: 40%;
  margin-bottom: 6px;
}
.dash-skel-sidebar__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
}
.dash-skel-sidebar__icon {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  flex-shrink: 0;
}
.dash-skel-header {
  margin-bottom: 18px;
}
.dash-skel-toolbar {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}
.dash-skel-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dash-skel-row {
  display: grid;
  grid-template-columns: 96px 1fr 32px;
  gap: 14px;
  padding: 14px;
  background: #fff;
  border: 1px solid #eef0f3;
  border-radius: 12px;
}
.dash-skel-row__media {
  width: 96px;
  height: 72px;
  border-radius: 8px;
}
.dash-skel-row__body {
  display: flex;
  flex-direction: column;
}
.dash-skel-row__action {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  align-self: center;
}

/* Dashboard listings — filter bar (search + section pills + category combobox + active chips) */
.dashboard-listings-page .dlp-filterbar {
  display: flex;
  flex-direction: column;
  gap: 6px;
  background: #fff;
  border: 1px solid #e4e4e7;
  border-radius: 10px;
  padding: 8px;
  margin: 6px 0 8px;
}
.dashboard-listings-page .dlp-filterbar__row {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}
.dashboard-listings-page .dlp-filterbar__row--controls {
  justify-content: space-between;
}
.dashboard-listings-page .dlp-filterbar .dlp-search {
  flex: 1;
}
.dashboard-listings-page .dlp-filterbar .dlp-type-filter {
  border-top: 0;
  padding-top: 0;
  margin-top: 0;
  flex-wrap: wrap;
}
.dashboard-listings-page .dlp-filterbar__chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding-top: 4px;
  border-top: 1px dashed #e4e4e7;
}
.dashboard-listings-page .dlp-filterbar__chips-label {
  font-size: 11px;
  font-weight: 600;
  color: #667085;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-inline-end: 3px;
}
.dashboard-listings-page .dlp-chip {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  background: #eef2ff;
  color: #4338ca;
  padding: 2px 8px 2px 4px;
  border-radius: 999px;
  border: 1px solid #c7d2fe;
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.dashboard-listings-page .dlp-chip:hover {
  background: #e0e7ff;
  border-color: #818cf8;
}
.dashboard-listings-page .dlp-chip i {
  font-size: 14px;
  opacity: 0.7;
}
.dashboard-listings-page .dlp-chip:hover i {
  opacity: 1;
}
.dashboard-listings-page .dlp-filterbar__clear-all {
  background: transparent;
  border: 0;
  color: #ef4444;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  padding: 4px 8px;
  margin-inline-start: auto;
}
.dashboard-listings-page .dlp-filterbar__clear-all:hover {
  text-decoration: underline;
}

/* Searchable category combobox */
.dashboard-listings-page .dlp-combo {
  position: relative;
}
.dashboard-listings-page .dlp-combo__trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  border: 1px solid #e4e4e7;
  border-radius: 8px;
  padding: 4px 9px;
  font-size: 12px;
  color: #475569;
  cursor: pointer;
  min-width: 180px;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.dashboard-listings-page .dlp-combo__trigger:hover {
  border-color: #c7d2fe;
}
.dashboard-listings-page .dlp-combo__trigger--active {
  background: #eef2ff;
  border-color: #818cf8;
  color: #312e81;
}
.dashboard-listings-page .dlp-combo__trigger-icon {
  font-size: 16px;
  color: #94a3b8;
}
.dashboard-listings-page .dlp-combo__trigger--active .dlp-combo__trigger-icon {
  color: #6366f1;
}
.dashboard-listings-page .dlp-combo__trigger-label {
  flex: 1;
  text-align: start;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 220px;
}
.dashboard-listings-page .dlp-combo__trigger-clear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(79, 70, 229, 0.15);
  cursor: pointer;
}
.dashboard-listings-page .dlp-combo__trigger-clear:hover {
  background: rgba(79, 70, 229, 0.3);
}
.dashboard-listings-page .dlp-combo__trigger-clear i {
  font-size: 12px;
}
.dashboard-listings-page .dlp-combo__trigger-caret {
  font-size: 16px;
  color: #94a3b8;
}
.dashboard-listings-page .dlp-combo__panel {
  position: absolute;
  top: calc(100% + 6px);
  inset-inline-end: 0;
  z-index: 50;
  width: 320px;
  max-width: calc(100vw - 32px);
  background: #fff;
  border: 1px solid #e4e4e7;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.dashboard-listings-page .dlp-combo__search {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid #f1f5f9;
}
.dashboard-listings-page .dlp-combo__search i {
  color: #94a3b8;
  font-size: 16px;
}
.dashboard-listings-page .dlp-combo__search-input {
  flex: 1;
  border: 0;
  outline: 0;
  font-size: 13px;
  background: transparent;
}
.dashboard-listings-page .dlp-combo__list {
  max-height: 360px;
  overflow-y: auto;
  padding: 6px 0;
}
.dashboard-listings-page .dlp-combo__group-label {
  font-size: 11px;
  font-weight: 700;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 8px 12px 4px;
}
.dashboard-listings-page .dlp-combo__row {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: transparent;
  border: 0;
  padding: 7px 12px;
  font-size: 13px;
  color: #1f2937;
  cursor: pointer;
  text-align: start;
}
.dashboard-listings-page .dlp-combo__row:hover {
  background: #f8fafc;
}
.dashboard-listings-page .dlp-combo__row--selected {
  background: #eef2ff;
  color: #312e81;
  font-weight: 600;
}
.dashboard-listings-page .dlp-combo__row--child {
  padding-inline-start: 28px;
  color: #475569;
}
.dashboard-listings-page .dlp-combo__row--all {
  border-bottom: 1px solid #f1f5f9;
  font-weight: 500;
}
.dashboard-listings-page .dlp-combo__row-count {
  background: #f1f5f9;
  color: #64748b;
  padding: 1px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}
.dashboard-listings-page .dlp-combo__row--selected .dlp-combo__row-count {
  background: #c7d2fe;
  color: #312e81;
}
.dashboard-listings-page .dlp-combo__empty {
  text-align: center;
  color: #94a3b8;
  font-size: 13px;
  padding: 18px 12px;
  margin: 0;
}

.dashboard-listings-page .dlp-result-summary {
  font-size: 12px;
  color: #667085;
  margin: 0 0 12px;
  padding-inline-start: 2px;
}

/* Dashboard listings — list rows */
.dlp-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.dlp-row {
  display: grid;
  /* 4 cols × 1 row: checkbox | media | main | actions */
  grid-template-columns: auto 110px minmax(0, 1fr) 140px;
  gap: 12px;
  padding: 8px;
  background: #ffffff;
  border: 1px solid #ececef;
  border-radius: 10px;
  align-items: center;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.dlp-row:hover {
  border-color: #d0d5dd;
  box-shadow: 0 6px 20px rgba(16, 24, 40, 0.06);
}
.dlp-row__media {
  position: relative;
  display: block;
  width: 110px;
  aspect-ratio: 16 / 10;
  border-radius: 8px;
  overflow: hidden;
  background: #f5f5f5;
  cursor: pointer;
}
.dlp-row__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.25s ease;
}
/* Default cover when the listing has no imageSrc — mirrors the
 * frontend svc-card / b2b-card fallback so admins see the same
 * visual language as visitors. */
.dlp-row__cover-fallback {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 42px;
  color: rgba(255, 255, 255, 0.85);
  background: linear-gradient(-135deg, #2563eb 0%, #1e3a8a 60%, #0f172a 100%);
}
.dlp-row__cover-fallback::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
      circle at 25% 25%,
      rgba(255, 255, 255, 0.18) 0,
      transparent 42%
    ),
    radial-gradient(
      circle at 80% 80%,
      rgba(255, 255, 255, 0.12) 0,
      transparent 50%
    );
  pointer-events: none;
}
/* Listing logo chip — overlays the bottom-end corner of the media,
 * matching the floating logo on the frontend B2B card. */
.dlp-row__logo {
  position: absolute;
  bottom: 4px;
  inset-inline-end: 4px;
  width: 26px;
  height: 26px;
  border-radius: 7px;
  background: #fff;
  border: 1.5px solid #fff;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.18);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dlp-row__logo img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
}
.dlp-row__media:hover img {
  transform: scale(1.04);
}
.dlp-row__status {
  position: absolute;
  top: 4px;
  right: 4px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 6px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}
.dlp-row__status--approved {
  color: #027a48;
}
.dlp-row__status--pending {
  color: #b54708;
}
.dlp-row__status--draft {
  color: #475569;
}

/* My-Listings status pill — sits above each card title so users see at a
   glance which of their listings are public, awaiting review, or still
   private drafts. */
.ml-status {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.2px;
	margin-bottom: 8px;
}
.ml-status__dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
}
.ml-status--approved {
	color: #027a48;
	background: #ecfdf5;
}
.ml-status--pending {
	color: #b54708;
	background: #fffbeb;
}
.ml-status--draft {
	color: #475569;
	background: #f1f5f9;
}

/* My-listings: status pill overlaid on the cover image and an owner footer
   that replaces the public "View profile" CTA with Edit + Publish. */
.svc-card__cover .ml-status,
.b2b-card__cover .ml-status {
	position: absolute;
	top: 12px;
	left: 12px;
	margin: 0;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.15);
	backdrop-filter: blur(4px);
}
html[dir="rtl"] .svc-card__cover .ml-status,
html[dir="rtl"] .b2b-card__cover .ml-status {
	left: auto;
	right: 12px;
}
.ml-card-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid rgba(15, 23, 42, 0.06);
	flex-wrap: wrap;
}
.ml-card-footer__cat {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 500;
	color: #475569;
	text-decoration: none;
	transition: color 0.15s ease;
}
.ml-card-footer__cat:hover {
	color: #0f172a;
}
.ml-card-footer__cat i {
	font-size: 15px;
	color: #94a3b8;
}
.ml-card-footer__actions {
	display: flex;
	gap: 6px;
	align-items: center;
}
.ml-card-footer__actions .default-btn {
	padding: 6px 14px;
	font-size: 13px;
}
.dlp-row__status-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
}
.dlp-row__main {
  min-width: 0;
}
.dlp-row__title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 2px;
}
.dlp-row__title-row > .dlp-row__title {
  margin: 0;
  flex: 1;
  min-width: 0;
}
.dlp-row__title-row > .section-badge {
  flex-shrink: 0;
}
.dlp-row__title {
  font-size: 14px;
  font-weight: 600;
  color: #101828;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}
.dlp-row__title a {
  color: inherit;
  text-decoration: none;
  transition: color 0.15s ease;
}
.dlp-row__title a:hover {
  color: #f0002a;
}
.dlp-row__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: #475467;
  line-height: 1.3;
}
.dlp-row__meta strong {
  color: #98a2b3;
  font-weight: 500;
  margin-left: 3px;
}
.dlp-row__sep {
  color: #d0d5dd;
}
/* Actions stack vertically as a single narrow column at the row end —
 * every button stays visible (no overflow / hidden dropdown), and the
 * title + meta get the horizontal space. */
.dlp-row__actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  flex-shrink: 0;
  width: 130px;
}
.dlp-row__actions .dlp-btn {
  justify-content: flex-start;
  width: 100%;
}

.dlp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 5px 9px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.15s ease, border-color 0.15s ease,
    color 0.15s ease;
  line-height: 1.2;
  white-space: nowrap;
}
.dlp-btn i {
  font-size: 13px;
  line-height: 1;
}
.dlp-btn--secondary {
  background: #ffffff;
  border-color: #d0d5dd;
  color: #344054;
}
.dlp-btn--secondary:hover {
  background: #f9fafb;
  border-color: #98a2b3;
  color: #101828;
}
.dlp-btn--danger {
  background: #ffffff;
  border-color: #fecaca;
  color: #b91c1c;
}
.dlp-btn--danger:hover {
  background: #fef2f2;
  border-color: #ef4444;
  color: #991b1b;
}

/* ── Overflow menu (kebab) ─────────────────────────────────────── */
.dlp-menu {
  position: relative;
}
.dlp-menu__trigger {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  color: #475467;
  font-size: 18px;
  cursor: pointer;
  padding: 0;
  transition: background-color 0.15s ease, border-color 0.15s ease,
    color 0.15s ease;
}
.dlp-menu__trigger:hover,
.dlp-menu__trigger[aria-expanded="true"] {
  background: #f9fafb;
  border-color: #98a2b3;
  color: #101828;
}
.dlp-menu__panel {
  position: absolute;
  top: calc(100% + 6px);
  inset-inline-end: 0;
  z-index: 50;
  min-width: 200px;
  background: #ffffff;
  border: 1px solid #ececef;
  border-radius: 10px;
  box-shadow: 0 12px 28px -10px rgba(15, 23, 42, 0.18),
    0 4px 8px rgba(15, 23, 42, 0.06);
  padding: 6px;
  display: flex;
  flex-direction: column;
  animation: dlpMenuPop 0.12s ease;
}
@keyframes dlpMenuPop {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}
.dlp-menu__item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 9px 12px;
  background: transparent;
  border: none;
  border-radius: 7px;
  color: #344054;
  font-size: 13.5px;
  font-weight: 500;
  text-decoration: none;
  text-align: start;
  cursor: pointer;
  transition: background-color 0.12s ease, color 0.12s ease;
}
.dlp-menu__item i {
  font-size: 16px;
  color: #98a2b3;
  flex-shrink: 0;
  transition: color 0.12s ease;
}
.dlp-menu__item:hover,
.dlp-menu__item:focus-visible {
  background: #f5f7fb;
  color: #101828;
  outline: none;
}
.dlp-menu__item:hover i,
.dlp-menu__item:focus-visible i {
  color: #101828;
}
.dlp-menu__sep {
  border: none;
  border-top: 1px solid #ececef;
  margin: 4px 2px;
}
/* Success-tinted entry for the Approve action. */
.dlp-menu__item--success i {
  color: #027a48;
}
.dlp-menu__item--success:hover {
  background: #ecfdf5;
  color: #027a48;
}
.dlp-menu__item--success:hover i {
  color: #027a48;
}
/* Destructive entry for Delete. */
.dlp-menu__item--danger {
  color: #b42318;
}
.dlp-menu__item--danger i {
  color: #b42318;
}
.dlp-menu__item--danger:hover,
.dlp-menu__item--danger:focus-visible {
  background: #fef3f2;
  color: #912018;
}
.dlp-menu__item--danger:hover i,
.dlp-menu__item--danger:focus-visible i {
  color: #912018;
}

@media (max-width: 1199px) {
  .dlp-row {
    grid-template-columns: 150px minmax(0, 1fr) auto;
    gap: 16px;
  }
  .dlp-row__media {
    width: 150px;
  }
}

@media (max-width: 575px) {
  .dlp-tabs {
    width: 100%;
    justify-content: space-between;
  }
  .dlp-tab {
    flex: 1;
    justify-content: center;
  }
  .dlp-row {
    grid-template-columns: 1fr;
  }
  .dlp-row__media {
    width: 100%;
    aspect-ratio: 16 / 9;
  }
}

@media (max-width: 991px) {
  .admin-grid {
    grid-template-columns: 1fr;
  }

  .admin-grid__sidebar {
    position: static;
  }

  .dashboard-blog-card {
    grid-template-columns: 1fr;
    align-items: stretch;
    padding: 14px;
  }

  .dashboard-blog-card__media {
    width: 100%;
    height: 200px;
  }

  .dashboard-blog-card__actions {
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
    min-width: 0;
  }

  .dashboard-blog-card__actions .dbc-action {
    flex: 1 1 30%;
    justify-content: center;
  }
}
.dashboard-review-list {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.dashboard-review-card {
  border: 1px solid rgba(0, 0, 0, 0.05);
  border-radius: 20px;
  padding: 24px;
  background: #fff;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.05);
}
.dashboard-review-card__header {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 16px;
  margin-bottom: 16px;
}
.dashboard-review-card__eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
  color: #8a8a8a;
  margin-bottom: 4px;
}
.dashboard-review-card__rating {
  font-weight: 600;
  color: #f0002a;
  display: inline-flex;
  gap: 4px;
  align-items: center;
}
.dashboard-review-card__rating i {
  color: #fcb83c;
}
.dashboard-review-card__comment {
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 18px;
}
.dashboard-review-card__footer {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
}
.dashboard-review-card__link {
  color: #f0002a;
  font-weight: 600;
}
.dashboard-review-card__actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.dashboard-review-card__actions .default-btn {
  flex: 1 1 140px;
  justify-content: center;
}

@media (max-width: 575px) {
  .dashboard-review-card__header {
    grid-template-columns: 1fr;
  }

  .dashboard-review-card__actions .default-btn {
    flex: 1 1 100%;
  }
}
.dashboard-search-summary {
  margin: 0 0 12px;
  font-size: 13px;
  color: #64748b;
}

/* Record-row layout: one user per row, compact horizontal record. */
.dashboard-user-grid {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}
.user-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  border-top: 1px solid rgba(15, 23, 42, 0.06);
  transition: background 0.12s ease;
}
.user-row:first-child {
  border-top: none;
}
.user-row:hover {
  background: #f8fafc;
}
.user-row.is-suspended {
  opacity: 0.7;
}
.user-row__avatar {
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.user-row__identity {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.user-row__name-line {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.user-row__name {
  font-weight: 600;
  font-size: 14px;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.user-row__email {
  font-size: 12px;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.user-row__role-pill,
.user-row__status-pill {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: rgba(100, 116, 139, 0.1);
  color: #475569;
  white-space: nowrap;
}
.user-row__status-pill i {
  font-size: 11px;
}
/* One color per user, driven by the role class on the row. */
.user-row.role-ADMIN .user-row__role-pill,
.user-row.role-ADMIN .user-row__status-pill {
  background: rgba(220, 38, 38, 0.1);
  color: #b91c1c;
}
.user-row.role-CONTENT_MANAGER .user-row__role-pill,
.user-row.role-CONTENT_MANAGER .user-row__status-pill {
  background: rgba(16, 185, 129, 0.12);
  color: #047857;
}
.user-row__role-select {
  padding: 6px 10px 6px 28px;
  border-radius: 8px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: #fff
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 6 8 10 12 6'/%3E%3C/svg%3E")
    no-repeat left 8px center / 14px;
  appearance: none;
  -webkit-appearance: none;
  font-size: 13px;
  font-weight: 500;
  color: #0f172a;
  cursor: pointer;
  min-width: 150px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.user-row__role-select:hover:not(:disabled) {
  border-color: rgba(15, 23, 42, 0.25);
}
.user-row__role-select:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}
.user-row__role-select:disabled {
  cursor: not-allowed;
  background-color: #f1f5f9;
  color: #94a3b8;
}
.user-row__actions {
  display: flex;
  gap: 6px;
}
.user-row__icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: #fff;
  color: #475569;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.user-row__icon-btn i {
  font-size: 16px;
}
.user-row__icon-btn:hover:not(:disabled) {
  background: #f1f5f9;
  color: #0f172a;
  border-color: rgba(15, 23, 42, 0.2);
}
.user-row__icon-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.user-row__icon-btn--warn {
  color: #b45309;
  border-color: rgba(217, 119, 6, 0.3);
}
.user-row__icon-btn--warn:hover:not(:disabled) {
  background: rgba(217, 119, 6, 0.1);
  color: #92400e;
  border-color: rgba(217, 119, 6, 0.4);
}
.user-row__icon-btn--primary {
  color: #fff;
  background: #10b981;
  border-color: #10b981;
}
.user-row__icon-btn--primary:hover:not(:disabled) {
  background: #059669;
  border-color: #059669;
  color: #fff;
}

@media (max-width: 640px) {
  .user-row {
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas:
      "avatar identity actions"
      "select select   select";
    row-gap: 10px;
  }
  .user-row__avatar {
    grid-area: avatar;
  }
  .user-row__identity {
    grid-area: identity;
  }
  .user-row__actions {
    grid-area: actions;
  }
  .user-row__role-select {
    grid-area: select;
    width: 100%;
  }
}

.dashboard-create-user {
  margin-bottom: 24px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
}
.dashboard-create-user__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
}
.dashboard-create-user__title {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
}
.dashboard-create-user__title-hint {
  margin: 2px 0 0;
  font-size: 12px;
  color: #64748b;
}
.dashboard-create-user__toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 8px;
  border: 1px solid transparent;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  background: #0f172a;
  color: #fff;
  transition: background 0.15s ease;
}
.dashboard-create-user__toggle:hover {
  background: #1e293b;
}
.dashboard-create-user__toggle--open {
  background: #fff;
  color: #334155;
  border-color: rgba(15, 23, 42, 0.15);
}
.dashboard-create-user__toggle--open:hover {
  background: #f1f5f9;
}
.dashboard-create-user__form {
  padding: 18px;
  background: #f8fafc;
  border-top: 1px solid rgba(15, 23, 42, 0.06);
}
.dashboard-create-user__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}
.dashboard-create-user__field label {
  display: block;
  margin: 0 0 6px;
  font-size: 12px;
  font-weight: 600;
  color: #334155;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.dashboard-create-user__field input,
.dashboard-create-user__field select {
  width: 100%;
  padding: 9px 11px;
  border-radius: 8px;
  border: 1px solid rgba(15, 23, 42, 0.15);
  background: #fff;
  font-size: 14px;
  color: #0f172a;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.dashboard-create-user__field input:focus,
.dashboard-create-user__field select:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}
.dashboard-create-user__field--error input,
.dashboard-create-user__field--error select {
  border-color: #ef4444;
}
.dashboard-create-user__field .form-error {
  display: block;
  margin-top: 4px;
  color: #b91c1c;
  font-size: 12px;
}
.dashboard-create-user__actions {
  margin-top: 14px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.dashboard-create-user__submit {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 18px;
  border-radius: 8px;
  border: none;
  background: #10b981;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease;
}
.dashboard-create-user__submit:hover:not(:disabled) {
  background: #059669;
}
.dashboard-create-user__submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.dashboard-pagination {
  margin-top: 30px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.dashboard-pagination__button {
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #fff;
  font-weight: 600;
  transition: all 0.2s ease;
  text-decoration: none;
  color: inherit;
}
.dashboard-pagination__button:hover:not(.is-disabled) {
  border-color: #f0002a;
  color: #f0002a;
}
.dashboard-pagination__button.is-active {
  background: #f0002a;
  border-color: #f0002a;
  color: #fff;
}
.dashboard-pagination__button.is-disabled {
  opacity: 0.4;
  pointer-events: none;
}

/*
Banner Area Style
======================================================*/
.banner-hero-area .container-fluid {
	max-width: 1760px;
	margin: auto;
	padding-right: 30px;
	padding-left: 30px;
	/* max-height: 500px; */
}

.banner-area {
	position: relative;
	/* padding-bottom: 500px; */
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
}

.banner-area .container-fluid {
	max-width: 1760px;
	margin: auto;
	padding-right: 30px;
	padding-left: 30px;
}

.banner-area .banner-img {
	position: absolute;
	bottom: 0;
	right: 0px;
	left: 0;
	top:0;
	z-index: -1;
	text-align: center;
	overflow: hidden;
}
/* Mobile: scale the banner image to fill the container as a cover background
   instead of showing at its intrinsic size (which only fills ~25% of the
   visible banner on phones). */
@media (max-width: 991px) {
	.banner-area .banner-img img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
	}
}


@media only screen and (min-width: 992px) {
	.banner-area .banner-img {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.banner-area {
		max-height: 550px;
		min-height: 550px;
	}
}

.banner-area{
	max-height: 500px;
}

.banner-area .banner-img::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(
		-180deg,
		rgba(0, 0, 0, 0.1) 0%,
		rgba(0, 0, 0, 0.2) 100%
	);
	z-index: 1;
}

.banner-area.bg-2 {
	background-image: url(/images/banner/banner-bg-2.png);
}

.banner-area .shape {
	position: absolute;
}

.banner-area .shape.shape-4 {
	top: 100px;
	right: 0;
}

.banner-area .shape.shape-5 {
	top: 50px;
	left: 0;
}

.banner-area.style-two {
	padding-top: 100px;
	padding-bottom: 0;
}

.banner-content {
	text-align: center;
	max-width: 919px;
	margin: auto;
	position: relative;
	z-index: 1;
	padding-top: 150px;
}

.banner-content h1 {
	font-size: 52px;
	margin-bottom: 32px;
	letter-spacing: -0.02em;
	line-height: 1.2;
	color: #1a1a1a;
	font-weight: 800;
	text-shadow: 0 1px 2px rgba(255, 255, 255, 0.4);
}
.banner-content__accent {
	color: #f0002a;
}

.banner-content .search-form {
	margin-bottom: 40px;
	background-color: #f8f8f8;
	padding: 12px;
	border-radius: 6px;
	margin: auto;
}

/* Single-field banner search */
.search-form--single {
	display: flex;
	gap: 10px;
	align-items: stretch;
	background: #fff;
	padding: 8px;
	border-radius: 12px;
	box-shadow: 0 14px 32px rgba(15, 23, 42, 0.12);
	max-width: 720px;
}
.search-form--single .search-form__input-wrap {
	position: relative;
	flex: 1;
	min-width: 0;
}
.search-form--single .search-form__icon {
	position: absolute;
	top: 50%;
	inset-inline-start: 16px;
	transform: translateY(-50%);
	color: #98a2b3;
	font-size: 18px;
	pointer-events: none;
}
.search-form--single .form-control {
	width: 100%;
	height: 52px;
	padding-block: 0;
	padding-inline-start: 44px;
	padding-inline-end: 16px;
	border: none;
	background: transparent;
	font-size: 15px;
	color: #101828;
	outline: none;
}
.search-form--single .form-control::placeholder {
	color: #98a2b3;
}
.search-form--single .form-control:focus {
	background: #fafbfc;
	border-radius: 8px;
}
.search-form--single .search-form__submit {
	flex-shrink: 0;
	height: 52px;
	padding: 0 28px;
	border-radius: 8px;
}
.search-form--single .search-form__submit span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
@media (max-width: 575px) {
	.search-form--single {
		flex-direction: column;
	}
	.search-form--single .search-form__submit {
		width: 100%;
	}
}

/* Tablet (768–991px): the banner-area's default `max-height: 500px` can
   clip the content area on iPad-portrait widths and hide the search form.
   Relax the limit and guarantee a minimum height so the banner image AND
   the centered content (heading + search form) both render correctly. */
@media only screen and (min-width: 768px) and (max-width: 991px) {
	.banner-area {
		max-height: none;
		min-height: 460px;
	}
	.banner-content {
		position: relative;
		z-index: 2;
	}
	.banner-content .search-form,
	.banner-content .search-form--single {
		position: relative;
		z-index: 3;
	}
	/* Legacy `.banner-content .search-form .default-btn { width: 100% }`
	   in responsive.css was sized for the old multi-field form. The new
	   single-field flex form needs the submit to stay button-sized so
	   the input field next to it remains visible. Specificity has to beat
	   the legacy 3-class selector — `.default-btn.search-form__submit`
	   adds an extra class to tip the cascade. */
	.banner-content
		.search-form--single
		.default-btn.search-form__submit {
		width: auto;
		flex: 0 0 auto;
	}
}

/* Banner search dropdown — recent searches + live results */
.search-suggest {
	position: absolute;
	top: calc(100% + 8px);
	inset-inline-start: 0;
	width: 100%;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
	border: 1px solid #eef0f4;
	max-height: 420px;
	overflow-y: auto;
	z-index: 1050;
	padding: 6px;
	text-align: start;
}
.search-suggest--loading {
	padding: 14px 16px;
	color: #667085;
	font-size: 14px;
	display: flex;
	align-items: center;
	gap: 8px;
}
.search-suggest--loading i {
	animation: spin 0.8s linear infinite;
}
@keyframes spin {
	to {
		transform: rotate(-360deg);
	}
}
.search-suggest__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 8px 12px 4px;
}
.search-suggest__head-label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	color: #667085;
}
.search-suggest__clear {
	background: none;
	border: none;
	padding: 4px 8px;
	font-size: 12px;
	color: #f0002a;
	cursor: pointer;
	border-radius: 4px;
}
.search-suggest__clear:hover {
	background: #fff0f3;
}
.search-suggest__group {
	padding: 6px 0;
}
.search-suggest__group + .search-suggest__group {
	border-top: 1px solid #f2f4f7;
}
.search-suggest__group-label {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #98a2b3;
	padding: 6px 12px 4px;
}
.search-suggest__list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.search-suggest__item {
	display: flex;
	align-items: stretch;
}
.search-suggest__item-btn {
	flex: 1;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 12px;
	background: none;
	border: none;
	cursor: pointer;
	border-radius: 8px;
	text-align: start;
	color: #101828;
	font-size: 14px;
	min-width: 0;
}
.search-suggest__item-btn:hover {
	background: #f5f7fb;
}
.search-suggest__item-thumb {
	width: 32px;
	height: 32px;
	border-radius: 6px;
	object-fit: cover;
	background: #f2f4f7;
	flex-shrink: 0;
}
.search-suggest__item-icon {
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 6px;
	background: #f2f4f7;
	color: #475467;
	font-size: 16px;
	flex-shrink: 0;
}
.search-suggest__item-meta {
	display: flex;
	flex-direction: column;
	min-width: 0;
}
.search-suggest__item-label {
	font-size: 14px;
	color: #101828;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.search-suggest__item-sub {
	font-size: 12px;
	color: #667085;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.search-suggest__item--recent .search-suggest__item-label {
	color: #475467;
}
.search-suggest__item-remove {
	background: none;
	border: none;
	padding: 0 12px;
	color: #98a2b3;
	cursor: pointer;
	font-size: 16px;
	display: inline-flex;
	align-items: center;
	border-radius: 6px;
}
.search-suggest__item-remove:hover {
	color: #f0002a;
	background: #fff0f3;
}

/* Listings page hero — wraps the same banner search pill with a slim
   gradient header, breadcrumbs, page title, and the autocomplete bar. */
.listings-hero {
	position: relative;
	padding: 24px 0 32px;
	background:
		radial-gradient(
			ellipse at 0% 0%,
			rgba(240, 0, 42, 0.06) 0%,
			transparent 55%
		),
		linear-gradient(-180deg, #ffffff 0%, #f7f8fb 100%);
	border-bottom: 1px solid #eef0f4;
}
/* Compact variant — used on category pages where the PageBanner already
   provides the breadcrumb + heading. Only the search input renders so
   the listings sit much closer to the top of the screen. */
.listings-hero--compact {
	padding: 12px 0 14px;
	background: #ffffff;
}
.listings-hero--compact::before {
	display: none;
}
.listings-hero--compact .listings-hero__search {
	margin-top: 0;
}
.listings-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(
		circle at 1px 1px,
		rgba(15, 23, 42, 0.04) 1px,
		transparent 0
	);
	background-size: 24px 24px;
	pointer-events: none;
	mask-image: linear-gradient(
		180deg,
		rgba(0, 0, 0, 0.6) 0%,
		transparent 80%
	);
	-webkit-mask-image: linear-gradient(
		180deg,
		rgba(0, 0, 0, 0.6) 0%,
		transparent 80%
	);
}
.listings-hero > .container {
	position: relative;
	z-index: 1;
}
.listings-hero__crumbs {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: #667085;
	margin-bottom: 6px;
}
.listings-hero__crumbs a {
	color: #667085;
	text-decoration: none;
	transition: color 0.15s;
}
.listings-hero__crumbs a:hover {
	color: #f0002a;
}
.listings-hero__crumbs span {
	color: #101828;
	font-weight: 500;
}
.listings-hero__crumbs i {
	font-size: 14px;
	color: #98a2b3;
}
[dir="rtl"] .listings-hero__crumbs i.ri-arrow-right-s-line {
	transform: scaleX(-1);
}
.listings-hero__title {
	font-size: 22px;
	font-weight: 700;
	color: #101828;
	margin: 0 0 4px;
	line-height: 1.25;
	letter-spacing: -0.2px;
}
.listings-hero__subtitle {
	font-size: 13px;
	color: #667085;
	margin: 0 0 14px;
	max-width: 640px;
}
.listings-hero__search {
	max-width: 720px;
}
.listings-hero__search .search-form--single {
	max-width: none;
}
@media (max-width: 767px) {
	.listings-hero {
		padding: 16px 0 22px;
	}
	.listings-hero__title {
		font-size: 18px;
	}
	.listings-hero__subtitle {
		font-size: 12px;
		margin-bottom: 10px;
	}
}

.banner-content .search-form .form-group {
	position: relative;
}

@media only screen and (min-width: 992px) {
	.banner-content .search-form .form-group {
		border: 1px solid #d8d8d8;
		border-radius: 6px;
		background-color: #ffffff;
		margin-left: 20px;
	}

	.banner-content .search-form .form-group::before {
		display: none;
	}
}

.banner-content .search-form .form-group::before {
	content: "";
	position: absolute;
	top: 0;
	left: 17px;
	width: 1px;
	height: 100%;
	border-left: 1px solid #d8d8d8;
}

.banner-content .search-form .form-group .form-control {
	padding-right: 50px;
	border: none;
	border-radius: 0;
	background-color: transparent;
}

.banner-content
	.search-form
	.form-group
	.form-control::-webkit-input-placeholder {
	font-weight: 300;
	font-size: 15px;
}

.banner-content .search-form .form-group .form-control:-ms-input-placeholder {
	font-weight: 300;
	font-size: 15px;
}

.banner-content .search-form .form-group .form-control::-ms-input-placeholder {
	font-weight: 300;
	font-size: 15px;
}

.banner-content .search-form .form-group .form-control::placeholder {
	font-weight: 300;
	font-size: 15px;
}

.banner-content .search-form .form-group img {
	position: absolute;
	top: 21px;
	right: 20px;
	font-size: 20px;
}

.banner-content .search-form .form-group i {
	position: absolute;
	top: 14px;
	right: 20px;
	font-size: 20px;
}

.banner-content .search-form .default-btn {
	padding: 18px 34px;
	float: left;
}

.banner-content .search-form.style-two {
	background-color: #ffffff;
}

.banner-content .search-form .col-lg-6:nth-child(2) .form-group::before {
	display: none;
}
ul.src-tag {
    color: #ffffff;
    border-radius: 0;
}

.banner-content .src-tag {
	padding-right: 0;
	margin-bottom: 0;
	margin-top: 24px;
	list-style-type: none;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	background: #ffffffd9;
    padding: 10px;
	border-radius: 5px;
}

.banner-content .src-tag li {
	display: inline-flex;
	margin-left: 0;
}

.banner-content .src-tag li:last-child {
	margin-left: 0;
}

.banner-content .src-tag li span {
	color: #101010;
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.3px;
	text-transform: uppercase;
	opacity: 0.85;
	margin-left: 4px;
}

.banner-content .src-tag li > div,
.banner-content .src-tag li a {
	display: inline-flex;
	align-items: center;
	padding: 6px 14px;
	background: rgba(255, 255, 255, 0.12);
    border: 1px solid #00000040;
	border-radius: 999px;
	color: #101010;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.2;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}

.banner-content .src-tag li > div:hover,
.banner-content .src-tag li a:hover {
	background: #ffffff;
	border-color: #ffffff;
	color: #101010;
}

.banner-content .src-tag li .read-more {
	background: #f0002a;
	border-color: #f0002a;
	color: #ffffff !important;
}

.banner-content .src-tag li .read-more:hover {
	background: #ffffff;
	border-color: #ffffff;
	color:  #101010 !important;
	
}

.banner-content .shape {
	position: absolute;
}

.banner-content .shape.shape-1 {
	right: -200px;
	top: 50px;
}

.banner-content .shape.shape-2 {
	right: 100px;
	top: 215px;
}

.banner-content .shape.shape-3 {
	left: -200px;
	top: 70px;
}

.banner-content.style-two {
	max-width: 960px;
}

.banner-content.style-two .search-form {
	max-width: 919px;
	margin: auto;
	margin-bottom: 40px;
}

.banner-content.style-three {
	text-align: right;
	margin-right: 106px;
}

.banner-content.style-three .top-title {
	font-family: var(--font-dancing-script);
	font-size: 30px;
	color: #ffc039;
	margin-bottom: 15px;
}

.banner-content.style-three h1 {
	color: #ffffff;
	margin-bottom: 30px;
}

.banner-content.style-three p {
	color: #c5c5c5;
	margin-bottom: 35px;
	max-width: 700px;
}

.banner-content.style-three .search-form {
	background-color: #ffffff;
}

.banner-content.style-three .src-tag li span {
	color: #ffffff;
}

.banner-content.style-three .src-tag li a {
	color: #c5c5c5;
}

.banner-content.style-three .src-tag li a:hover {
	color: #f0002a;
}

.banner-content.style-three .src-tag li .read-more {
	color: #f0002a;
}

.hero-item {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
	padding-top: 185px;
	padding-bottom: 185px;
	position: relative;
	z-index: 1;
}

.hero-item::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: -webkit-gradient(
		linear,
		right top,
		left top,
		color-stop(30.78%, #0c0b0b),
		color-stop(77.08%, rgba(12, 11, 11, 0.3))
	);
	background: linear-gradient(
		-90deg,
		#0c0b0b 30.78%,
		rgba(12, 11, 11, 0.3) 77.08%
	);
	opacity: 0.78;
	z-index: -1;
}

.hero-item.bg-1 {
	background-image: url(/images/banner/hero-bg-1.jpg);
}

.hero-item.bg-2 {
	background-image: url(/images/banner/hero-bg-2.jpg);
}

/*
Category Area Style
======================================================*/
.category-area {
	background-color: #f8f8f8;
	padding-top: 50px;
	padding-bottom: 30px;
}

/* Home — category grid (replaces the old swiper strip).
   Each card carries its own --cat-color / --cat-tint set via inline style. */
.cat-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 16px;
}
.cat-card {
	--cat-color: #582949;
	--cat-tint: #f3eef1;
	position: relative;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 18px;
	background: #ffffff;
	border: 1px solid #ececef;
	border-radius: 14px;
	color: #101828;
	text-decoration: none;
	overflow: hidden;
	transition: transform 0.18s ease, box-shadow 0.18s ease,
		border-color 0.18s ease, background 0.18s ease;
	isolation: isolate;
}
.cat-card::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		-135deg,
		var(--cat-tint) 0%,
		transparent 70%
	);
	opacity: 0;
	transition: opacity 0.18s ease;
	z-index: -1;
}
.cat-card:hover {
	transform: translateY(-3px);
	border-color: var(--cat-color);
	box-shadow: 0 14px 28px -14px rgba(16, 24, 40, 0.18),
		0 4px 8px -4px rgba(16, 24, 40, 0.06);
	color: #101828;
	text-decoration: none;
}
.cat-card:hover::before {
	opacity: 1;
}
.cat-card:focus-visible {
	outline: 2px solid var(--cat-color);
	outline-offset: 2px;
}
.cat-card__icon-wrap {
	flex: 0 0 auto;
	width: 52px;
	height: 52px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 14px;
	background: var(--cat-tint);
	color: var(--cat-color);
	transition: background 0.18s ease, color 0.18s ease,
		transform 0.18s ease;
}
.cat-card:hover .cat-card__icon-wrap {
	background: var(--cat-color);
	color: #ffffff;
	transform: scale(1.05);
}
.cat-card__icon {
	font-size: 26px;
	line-height: 1;
}
.cat-card__name {
	flex: 1 1 auto;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	color: #101828;
}
.cat-card__arrow {
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: transparent;
	color: #98a2b3;
	font-size: 16px;
	line-height: 1;
	transform: translateX(0);
	transition: transform 0.18s ease, background 0.18s ease,
		color 0.18s ease;
}
.cat-card:hover .cat-card__arrow {
	color: var(--cat-color);
	transform: translateX(-2px);
}
[dir="rtl"] .cat-card:hover .cat-card__arrow {
	transform: translateX(2px) scaleX(-1);
}
[dir="rtl"] .cat-card__arrow {
	transform: scaleX(-1);
}

@media (max-width: 575px) {
	.cat-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
	}
	.cat-card {
		padding: 14px;
		gap: 10px;
		border-radius: 12px;
	}
	.cat-card__icon-wrap {
		width: 44px;
		height: 44px;
		border-radius: 12px;
	}
	.cat-card__icon {
		font-size: 22px;
	}
	.cat-card__name {
		font-size: 14px;
	}
	.cat-card__arrow {
		display: none;
	}
}

.category-section {
	padding-top: 30px;
	padding-bottom: 30px;
}

.category-section + .category-section {
	border-top: 1px solid #ececec;
	margin-top: 10px;
}

.category-section-title {
	text-align: start;
	margin-bottom: 30px;
	max-width: 720px;
}

.category-section-title h2 {
	margin-bottom: 8px;
	font-size: 28px;
	display: inline-flex;
	align-items: center;
	gap: 12px;
}

.category-section-title h2::before {
	content: "";
	display: inline-block;
	width: 6px;
	height: 26px;
	border-radius: 3px;
	background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
}

.category-section-b2b .category-section-title h2::before {
	background: #0f172ac7;
}

.category-section-title p {
	margin: 0;
	color: #6b6b6b;
	font-size: 15px;
}

@media (max-width: 575px) {
	.category-section-title h2 {
		font-size: 22px;
	}
	.category-section-title h2::before {
		height: 20px;
	}
}

.section-badge {
	display: inline-flex;
	align-items: center;
	padding: 7px 14px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.2px;
	line-height: 1;
	white-space: nowrap;
	color: #fff;
}

.section-badge-services {
	background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
}

.section-badge-b2b {
	background: #0f172ac7;
}

.section-badge-on-image {
	position: absolute;
	top: 14px;
	inset-inline-start: 14px;
	z-index: 2;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

.featured-strip {
	padding-top: 40px;
	padding-bottom: 20px;
}

.featured-strip + .featured-strip {
	border-top: 1px solid #ececec;
	margin-top: 30px;
	padding-top: 60px;
}

.featured-strip-header {
	margin-bottom: 24px;
}

.featured-strip-title h2 {
	font-size: 26px;
	margin-bottom: 6px;
	display: inline-flex;
	align-items: center;
	gap: 12px;
}

.featured-strip-title h2::before {
	content: "";
	display: inline-block;
	width: 5px;
	height: 24px;
	border-radius: 3px;
	background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
}

.featured-strip-b2b .featured-strip-title h2::before {
	background: #0f172ac7;
}

.featured-strip-title p {
	color: #6b6b6b;
	font-size: 15px;
	margin: 0;
}

.featured-strip-tabs-row {
	margin-bottom: 28px;
	padding-bottom: 4px;
	border-bottom: 1px solid #ececec;
}

.featured-strip-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 4px 2px 12px;
}

.fst-pill {
	flex: 0 0 auto;
	padding: 9px 18px;
	border-radius: 999px;
	border: 1.5px solid #e5e5e5;
	background: #fff;
	color: #555;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
	transition: all 0.18s ease;
}

.fst-pill:hover {
	border-color: #c9c9c9;
	color: #1a1a1a;
}

.featured-strip-services .fst-pill.is-active {
	background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
	border-color: #582949;
	color: #fff;
}

.featured-strip-b2b .fst-pill.is-active {
	background: #0f172ac7;
	border-color: #0f172ac7;
	color: #fff;
}

@media (max-width: 575px) {
	.featured-strip-title h2 {
		font-size: 21px;
	}
	.featured-strip-title p {
		font-size: 14px;
	}
	.fst-pill {
		padding: 8px 14px;
		font-size: 13px;
	}
}

/* Listings page toolbar (filters btn / count / view) */
.lp-toolbar {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 8px 0 18px;
	border-bottom: 1px solid #ececec;
	margin-bottom: 24px;
}

.lp-filters-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 18px;
	border-radius: 10px;
	border: 1.5px solid #e5e5e5;
	background: #fff;
	color: #1a1a1a;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: all 0.18s ease;
}

.lp-filters-btn i {
	font-size: 18px;
}

.lp-filters-btn:hover {
	border-color: #1a1a1a;
}

.lp-filters-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	border-radius: 999px;
	background: #582949;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
}

.lp-results-count {
	flex: 1 1 auto;
}

.lp-results-count p {
	margin: 0;
	color: #6b6b6b;
	font-size: 14px;
}

.lp-results-count p span {
	color: #1a1a1a;
	font-weight: 700;
}

.lp-view {
	display: inline-flex;
	flex: 0 0 auto;
	padding: 4px;
	border-radius: 10px;
	border: 1.5px solid #e5e5e5;
	background: #f7f7f7;
}

.lp-view-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 32px;
	border-radius: 7px;
	border: none;
	background: transparent;
	color: #888;
	font-size: 18px;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease,
		box-shadow 0.15s ease;
	padding: 0;
}

.lp-view-btn i {
	line-height: 1;
}

.lp-view-btn:hover {
	color: #1a1a1a;
}

.lp-view-btn.is-active {
	background: #fff;
	color: #582949;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* 2-column layout */
.lp-layout {
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 30px;
	align-items: start;
}

.lp-aside {
	position: sticky;
	top: 90px;
	max-height: calc(100vh - 110px);
	overflow-y: auto;
	padding-inline-end: 6px;
}

.lp-aside::-webkit-scrollbar {
	width: 6px;
}

.lp-aside::-webkit-scrollbar-thumb {
	background: #d4d4d4;
	border-radius: 3px;
}

.lp-empty {
	border: 1px dashed #d4d4d4;
	border-radius: 12px;
	padding: 40px 20px;
	text-align: center;
	color: #6b6b6b;
	background: #fafafa;
}

.lp-infinite-sentinel {
	width: 100%;
	min-height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px 0 8px;
}

.lp-infinite-spinner {
	display: flex;
	align-items: center;
	justify-content: center;
}

.lp-spinner {
	width: 28px;
	height: 28px;
	border: 3px solid #e5e5e5;
	border-top-color: #ff5722;
	border-radius: 50%;
	animation: spin 0.8s linear infinite;
}

/* Filter sidebar */
.filter-sidebar {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.fs-block {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.fs-block-title {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	color: #6b6b6b;
	margin: 0;
}

.fs-search {
	position: relative;
}

.fs-search-input {
	width: 100%;
	padding: 10px 14px 10px 36px;
	border-radius: 10px;
	border: 1.5px solid #e5e5e5;
	background: #fff;
	font-size: 14px;
	color: #1a1a1a;
	transition: border-color 0.18s ease;
}

[dir="rtl"] .fs-search-input {
	padding: 10px 36px 10px 14px;
}

.fs-search-input::placeholder {
	color: #999;
}

.fs-search-input:focus {
	outline: none;
	border-color: #582949;
}

.fs-search-clear {
	position: absolute;
	top: 50%;
	inset-inline-end: 8px;
	transform: translateY(-50%);
	width: 24px;
	height: 24px;
	border-radius: 999px;
	border: none;
	background: #f0f0f0;
	color: #555;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
}

.fs-search-clear:hover {
	background: #e0e0e0;
	color: #1a1a1a;
}

.fs-group-title {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	margin: 14px 0 6px;
	padding-inline-start: 10px;
	border-inline-start: 3px solid #ddd;
}

.fs-group-services {
	color: #582949;
	border-inline-start-color: #582949;
}

.fs-group-b2b {
	color: #0f172a;
	border-inline-start-color: #0f172ac7;
}

.fs-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.fs-item {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 9px 10px;
	border-radius: 8px;
	border: none;
	background: transparent;
	color: #333;
	font-size: 14px;
	line-height: 1.3;
	text-align: start;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.fs-item:hover {
	background: #f4f4f4;
	color: #1a1a1a;
}

.fs-item.is-active {
	background: #f3eef1;
	color: #582949;
	font-weight: 600;
}

.fs-radio {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	border-radius: 999px;
	border: 1.5px solid #c9c9c9;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: border-color 0.15s ease;
}

.fs-radio-dot {
	width: 9px;
	height: 9px;
	border-radius: 999px;
	background: transparent;
	transition: background 0.15s ease;
}

.fs-item.is-active .fs-radio {
	border-color: #582949;
}

.fs-item.is-active .fs-radio-dot {
	background: #582949;
}

.fs-empty {
	color: #6b6b6b;
	font-size: 13px;
	padding: 14px 10px;
	text-align: center;
	background: #fafafa;
	border-radius: 8px;
	margin: 0;
}

.fs-item-label {
	flex: 1 1 auto;
}

.fs-item-icon {
	flex: 0 0 auto;
	font-size: 17px;
	line-height: 1;
	width: 22px;
	text-align: center;
	color: #98a2b3;
	transition: color 0.15s ease;
}

.fs-item:hover .fs-item-icon,
.fs-item.is-active .fs-item-icon {
	color: #582949;
}

/* Mobile drawer */
.lp-aside-desktop {
	display: block;
}

.lp-drawer {
	position: fixed;
	top: 0;
	inset-inline-start: 0;
	width: min(360px, 92vw);
	height: 100dvh;
	background: #fff;
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.15);
	z-index: 1000;
	/* rtlcss auto-flips translateX values, which together with the
	   `inset-inline-start: 0` → `right: 0` flip in RTL ends up sliding
	   the drawer INTO view instead of off-screen. Mark these rules as
	   "do not flip" so the same transform direction holds in both. */
	transform: translateX(-100%);
	transition: transform 0.25s ease;
	display: flex;
	flex-direction: column;
}

[dir="rtl"] .lp-drawer {
	transform: translateX(100%);
}

.lp-drawer.is-open {
	transform: translateX(0);
}

.lp-drawer-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	border-bottom: 1px solid #ececec;
}

.lp-drawer-head h3 {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
}

.lp-drawer-close {
	width: 36px;
	height: 36px;
	border-radius: 999px;
	border: none;
	background: #f4f4f4;
	color: #1a1a1a;
	font-size: 22px;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.lp-drawer-close:hover {
	background: #e8e8e8;
}

.lp-drawer-body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 20px;
}

.lp-drawer-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: 999;
	animation: lpFadeIn 0.2s ease;
}

@keyframes lpFadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

.lp-filters-btn {
	display: none;
}

@media (max-width: 991px) {
	.lp-layout {
		grid-template-columns: 1fr;
	}
	.lp-aside-desktop {
		display: none;
	}
	.lp-filters-btn {
		display: inline-flex;
	}
}

.active-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	padding: 10px 0 16px;
}

.active-filters-label {
	font-size: 13px;
	font-weight: 600;
	color: #6b6b6b;
}

.active-filter-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 12px;
	border-radius: 999px;
	border: 1px solid #d4d4d4;
	background: #f7f7f7;
	color: #1a1a1a;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.18s ease;
}

.active-filter-chip:hover {
	background: #fff;
	border-color: #582949;
	color: #582949;
}

.active-filter-chip-x {
	font-size: 18px;
	line-height: 1;
	color: #999;
}

.active-filter-chip:hover .active-filter-chip-x {
	color: #582949;
}

.active-filters-clear {
	margin-inline-start: 4px;
	padding: 6px 12px;
	border: none;
	background: transparent;
	color: #d97706;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.active-filters-clear:hover {
	color: #b45309;
}

.results-summary {
	padding: 14px 0 22px;
	border-top: 1px solid #f0f0f0;
}

.results-summary p {
	margin: 0;
	color: #6b6b6b;
	font-size: 14px;
}

.results-summary p span {
	color: #1a1a1a;
	font-weight: 700;
}

.category-area.style-two {
	position: relative;
	z-index: 1;
}

.category-area.style-two .category-shape {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: -1;
}

.single-category {
	text-align: center;
	margin-bottom: 20px;
}

.single-category .category-img {
	display: block;
	position: relative;
}

.single-category .category-img img {
	margin-bottom: 12px;
	border-radius: 12px;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

.single-category .category-img i {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	background-color: rgba(88, 41, 73, 0.9);
	font-size: 30px;
	color: #ffc039;
	border-radius: 5px;
	opacity: 0;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	border-radius: 15px;
}

.single-category.style-three {
	margin-bottom: 30px;
	position: relative;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-category.style-three::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(12, 11, 11, 0.2);
	border-radius: 5px;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-category.style-three img {
	border-radius: 5px;
	margin-bottom: 0;
}

.single-category.style-three .category-content {
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	padding: 30px;
	text-align: right;
}

.single-category.style-three .category-content h3 {
	font-weight: 500;
	font-size: 22px;
	margin-bottom: 12px;
}

.single-category.style-three .category-content h3 a {
	color: #ffffff;
}

.single-category.style-three .category-content span {
	color: #ffffff;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	font-size: 14px;
}

.single-category.style-three .listing-link {
	opacity: 0;
}

.single-category.style-three .listing-link i {
	width: 60px;
	height: 60px;
	line-height: 60px;
	border: 1px solid #f0002a;
	border-radius: 50%;
	display: inline-block;
	text-align: center;
	font-size: 30px;
	color: #f0002a;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-category.style-three .listing-link:hover i {
	background-color: #f0002a;
	color: #ffffff;
}

.single-category.style-three:hover {
	-webkit-transform: translateY(-5px);
	transform: translateY(-5px);
}

.single-category.style-three:hover::before {
	background-color: rgba(12, 11, 11, 0.5);
}

.single-category.style-three:hover .category-content span {
	color: #ffffff;
}

.single-category.style-three:hover .listing-link {
	opacity: 1;
}

.single-category .category-content h3 {
	font-size: 15px;
	margin-bottom: 8px;
	line-height: 1.3;
}

.single-category .category-content h3 a {
	color: #0c0b0b;
}

.single-category .category-content span {
	font-size: 14px;
}

.single-category:hover .category-img i {
	opacity: 1;
}

.single-category:hover .category-content span {
	color: #582949;
}

.all-categories {
	text-align: center;
	margin-top: 20px;
	font-size: 18px;
}

.all-categories.mt-20 {
	margin-top: 20px;
}

/*
Featured Area Style
======================================================*/
.featured-area .section-title.left-title p {
	color: #848484;
	font-size: 20px;
	font-weight: 600;
}

.featured-area .section-title.left-title p span {
	color: #0c0b0b;
}

.featured-area .row {
	--bs-gutter-x: 1.9rem;
}

.featured-area .section-title-wrap .form-control {
	font-weight: 300;
	font-size: 15px;
	cursor: pointer;
}

.featured-tabs {
	border: none;
}

.featured-tabs.list-grid {
	display: block;
	text-align: center;
}

.featured-tabs.list-grid .nav-item {
	border: none;
	margin-left: 20px;
	display: inline-block;
}

.featured-tabs.list-grid .nav-item:last-child {
	margin-left: 0;
}

.featured-tabs.list-grid .nav-item .nav-link {
	padding: 18px 19px;
	background-color: #f6f6f6;
}

.featured-tabs.list-grid .nav-item .nav-link img {
	-webkit-filter: brightness(0.5);
	filter: brightness(0.5);
}

.featured-tabs.list-grid .nav-item .nav-link.active {
	background-color: #5146aa;
}

.featured-tabs.list-grid .nav-item .nav-link.active img {
	-webkit-filter: brightness(10);
	filter: brightness(10);
}

.featured-tabs .nav-item {
	border: none;
}

.featured-tabs .nav-link {
	background-color: transparent;
	color: #848484;
	border: none;
	padding: 13px 33px;
	font-weight: 400;
	border-radius: 8px;
}

.featured-tabs .nav-link.active {
	background-color: #582949;
	color: #ffffff;
	-webkit-box-shadow: 0px 2px 15px rgba(88, 41, 73, 0.3);
	box-shadow: 0px 2px 15px rgba(88, 41, 73, 0.3);
}

.single-featured {
	margin-bottom: 30px;
	background-color: #ffffff;
	-webkit-box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.02);
	box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.02);
	border-radius: 20px;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-featured .feature-img {
	display: block;
	overflow: hidden;
	position: relative;
}

.single-featured .feature-img img {
	border-radius: 20px 20px 0 0;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-featured.box-shadow {
	-webkit-box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.04);
	box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.04);
}

.single-featured .featured-content {
	padding: 30px;
}

.single-featured .featured-content h3 {
	font-size: 22px;
	margin-bottom: 0;
	font-weight: 500;
	padding-left: 10px;
}

.single-featured .featured-content h3 a {
	color: #0c0b0b;
}

.single-featured .featured-content .wish-btn {
	background-color: transparent;
}

.single-featured .featured-content .wish-btn i {
	font-size: 25px;
	color: #f0002a;
}

/* HeartButton — micro-interaction for the optimistic toggle. The heart
 * pops slightly when activated so the user gets immediate visual
 * feedback before the server responds. */
.wish-btn {
	border: none;
	background: transparent;
	cursor: pointer;
	padding: 4px 6px;
	line-height: 1;
	transition: transform 0.12s ease;
}
.wish-btn:hover {
	transform: scale(1.08);
}
.wish-btn:active {
	transform: scale(0.92);
}
.wish-btn i {
	transition: transform 0.18s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.wish-btn--active i {
	animation: wish-pop 0.28s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes wish-pop {
	0% { transform: scale(0.8); }
	50% { transform: scale(1.25); }
	100% { transform: scale(1); }
}

.single-featured .featured-content ul {
	padding-right: 0;
	margin-bottom: 0;
	list-style: none;
}

.single-featured .featured-content .featured-info {
	margin-top: 15px;
	margin-bottom: 25px;
	border-bottom: 1px solid #f1f1f1;
	padding-bottom: 20px;
}

.single-featured .featured-content .featured-info li {
	position: relative;
	padding-right: 25px;
	margin-bottom: 16px;
}

.single-featured .featured-content .featured-info li:last-child {
	margin-bottom: 0;
}

.single-featured .featured-content .featured-info li img {
	position: absolute;
	top: 3px;
	right: 0;
	color: #582949;
	font-size: 18px;
}

.single-featured .featured-content .featured-info li i {
	position: absolute;
	top: -3px;
	right: 0;
	color: #582949;
	font-size: 18px;
}

.single-featured .featured-content .priceing li .tag {
	padding: 5px 15px;
	border: 1px solid #ebebeb;
	display: inline-block;
	border-radius: 5px;
}

.single-featured .featured-content .priceing li .tag:hover {
	border-color: #ffffff;
	background-color: #ffffff;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	color: #582949;
}

.single-featured .featured-content .priceing li .price {
	color: #582949;
	font-size: 20px;
}

.single-featured.style-two {
	padding: 30px;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-featured.style-two .featured-content {
	padding: 0;
}

.single-featured.style-two .featured-content .featured-info {
	padding-bottom: 0;
}

.single-featured.style-two .featured-content .featured-info li {
	display: inline-block;
	margin-left: 15px;
}

.single-featured.style-two .featured-content .featured-info li:last-child {
	margin-left: 0;
}

.single-featured.style-two .bg-img {
	display: block;
	overflow: hidden;
	position: relative;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-featured.style-two:hover {
	-webkit-transform: translateY(-5px);
	transform: translateY(-5px);
}

.single-featured.style-two:hover .bg-img {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
	border-radius: 10px;
}

.single-featured:hover {
	-webkit-box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.08);
	box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.08);
}

.single-featured:hover img {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}

.single-featured:hover .featured-content h3 a {
	color: #f0002a;
}

.single-featured:hover .featured-content img {
	-webkit-transform: scale(1);
	transform: scale(1);
}

.featured-area {
	overflow: hidden;
}

@media only screen and (min-width: 1400px) {
	.featured-area .container-fluid {
		right: calc((100% - 1400px) / 2);
		position: relative;
	}
}

.featured-slide .swiper-pagination {
	position: initial;
}
.featured-slide
	.swiper-pagination
	.swiper-pagination-bullet.swiper-pagination-bullet-active {
	background-color: #f0002a;
}

/*
Location Area Style
======================================================*/
.location-area {
	overflow: hidden;
}

.location-area .row {
	--bs-gutter-x: 1.9rem;
}

.single-location {
	position: relative;
	margin-bottom: 30px;
	background-color: #ffebd1;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	padding: 30px;
	border-radius: 20px;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	margin-bottom: 30px;
}

.single-location.bg-c7f1e4 {
	background-color: #c7f1e4;
}

.single-location.bg-b5d3f0 {
	background-color: #b5d3f0;
}

.single-location.bg-ffdfd3 {
	background-color: #ffdfd3;
}

.single-location.bg-ffeeee {
	background-color: #ffeeee;
}

.single-location.bg-dbcee9 {
	background-color: #dbcee9;
}

.single-location img {
	border-radius: 50%;
}

.single-location .location-content {
	margin-right: 20px;
}

.single-location .location-content h3 {
	font-size: 22px;
	font-weight: 500;
}

.single-location .location-content span {
	display: block;
	margin-bottom: 12px;
}

.single-location .location-content ul {
	padding-right: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.single-location .location-content ul li {
	display: inline-block;
	margin-left: 3px;
}
.single-location .location-content ul li:last-child {
	margin-left: 0;
}
.single-location .location-content ul li i {
	color: #ffb800;
}

.single-location .map-link {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.single-location:hover {
	background-color: #ffffff;
}

/*
For Shape Area Style
======================================================*/
.for-shape {
	position: relative;
}

.for-shape .shape {
	position: absolute;
}

.for-shape .shape.shape-1 {
	top: -75px;
	left: 100px;
}

.for-shape .shape.shape-2 {
	top: -50px;
	right: -100px;
}

/* ═══════════════════════════════════════════════════════════════════
   How It Works — three-step value proposition section on the home page.
   Numbered cards with branded icon badges + checkable highlight bullets,
   linked by a soft horizontal connector on desktop. Replaces the older
   `.single-work` block.
   ═══════════════════════════════════════════════════════════════════ */
.how-it-works {
	padding: 96px 0 80px;
	background: linear-gradient(
		-180deg,
		#fffaf6 0%,
		#fffcf8 60%,
		#ffffff 100%
	);
}
.how-it-works__header {
	max-width: 760px;
	margin: 0 auto 56px;
	text-align: center;
}
.how-it-works__eyebrow {
	display: inline-block;
	padding: 5px 14px;
	background: rgba(240, 0, 42, 0.08);
	color: #f0002a;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin-bottom: 16px;
}
.how-it-works__title {
	font-size: clamp(26px, 3.2vw, 38px);
	font-weight: 800;
	color: #101828;
	margin: 0 0 14px;
	letter-spacing: -0.02em;
	line-height: 1.2;
}
.how-it-works__subtitle {
	font-size: 16px;
	color: #475467;
	margin: 0;
	line-height: 1.6;
	max-width: 620px;
	margin-right: auto;
	margin-left: auto;
}

/* Steps grid + the dotted connector behind it */
.how-it-works__grid {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}
.how-it-works__connector {
	position: absolute;
	top: 64px;
	right: calc(16.66% + 36px);
	left: calc(16.66% + 36px);
	height: 2px;
	background-image: linear-gradient(
		to left,
		#d0d5dd 50%,
		transparent 50%
	);
	background-size: 12px 2px;
	background-repeat: repeat-x;
	z-index: 0;
}

/* Step card */
.hiw-step {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 32px 26px 28px;
	background: #ffffff;
	border: 1px solid #ececef;
	border-radius: 18px;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
	transition: transform 0.2s ease, box-shadow 0.2s ease,
		border-color 0.2s ease;
}
.hiw-step:hover {
	transform: translateY(-4px);
	border-color: #e4e6ea;
	box-shadow: 0 18px 40px -16px rgba(15, 23, 42, 0.18);
}

/* Step number — small numeric tag in the top corner */
.hiw-step__number {
	position: absolute;
	top: 18px;
	inset-inline-end: 22px;
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.05em;
	color: #d0d5dd;
	font-feature-settings: "tnum" 1;
}

/* Icon badge — large, brand-tinted */
.hiw-step__icon {
	width: 64px;
	height: 64px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 18px;
	font-size: 30px;
	transition: transform 0.2s ease;
}
.hiw-step:hover .hiw-step__icon {
	transform: scale(1.05);
}

/* Color tones — each step gets a distinct accent */
.hiw-step--blue .hiw-step__icon {
	background: linear-gradient(-135deg, #eef4ff 0%, #dbe8ff 100%);
	color: #1d4ed8;
}
.hiw-step--blue .hiw-step__number {
	color: #93c5fd;
}
.hiw-step--violet .hiw-step__icon {
	background: linear-gradient(-135deg, #f5f3ff 0%, #e9e4ff 100%);
	color: #7c3aed;
}
.hiw-step--violet .hiw-step__number {
	color: #c4b5fd;
}
.hiw-step--red .hiw-step__icon {
	background: linear-gradient(-135deg, #fff5f6 0%, #ffe4e6 100%);
	color: #f0002a;
}
.hiw-step--red .hiw-step__number {
	color: #fda4af;
}

.hiw-step__title {
	font-size: 19px;
	font-weight: 700;
	color: #101828;
	margin: 4px 0 0;
	line-height: 1.3;
	letter-spacing: -0.01em;
}
.hiw-step__desc {
	font-size: 14.5px;
	line-height: 1.6;
	color: #475467;
	margin: 0;
}

/* Highlight bullets — small checkable items */
.hiw-step__bullets {
	list-style: none;
	margin: 4px 0 0 !important;
	padding: 0 !important;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.hiw-step__bullets > li {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 13px;
	color: #344054;
	margin: 0 !important;
	padding: 0 !important;
	font-weight: 500;
	line-height: 1.45;
}
.hiw-step__bullets > li::before {
	display: none !important;
}
.hiw-step__bullets > li i {
	color: #16a34a;
	font-size: 16px;
	flex-shrink: 0;
	line-height: 1.45;
}

/* CTA row */
.how-it-works__cta {
	margin-top: 56px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	flex-wrap: wrap;
}
.how-it-works__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 13px 24px;
	border-radius: 12px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	border: 1.5px solid transparent;
	transition: all 0.18s ease;
	white-space: nowrap;
}
.how-it-works__btn i {
	font-size: 16px;
}
.how-it-works__btn--primary {
	background: linear-gradient(-135deg, #f0002a 0%, #c8001f 100%);
	color: #ffffff !important;
	box-shadow: 0 8px 18px -8px rgba(240, 0, 42, 0.45);
}
.how-it-works__btn--primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 26px -10px rgba(240, 0, 42, 0.55);
	color: #ffffff !important;
}
.how-it-works__btn--ghost {
	background: #ffffff;
	color: #344054 !important;
	border-color: #d0d5dd;
}
.how-it-works__btn--ghost:hover {
	border-color: #582949;
	color: #582949 !important;
}
[dir="rtl"] .how-it-works__btn--ghost i {
	transform: scaleX(-1);
}

@media (max-width: 991px) {
	.how-it-works__grid {
		grid-template-columns: 1fr;
		gap: 18px;
	}
	.how-it-works__connector {
		display: none;
	}
}
@media (max-width: 575px) {
	.how-it-works {
		padding: 72px 0 60px;
	}
	.how-it-works__header {
		margin-bottom: 36px;
	}
	.hiw-step {
		padding: 24px 20px 22px;
	}
	.how-it-works__cta {
		flex-direction: column;
		align-items: stretch;
		max-width: 320px;
		margin-right: auto;
		margin-left: auto;
	}
	.how-it-works__btn {
		justify-content: center;
	}
}

/*
Testimony Area Style
======================================================*/
.testimony-img {
	text-align: center;
	position: relative;
	z-index: 1;
}

.testimony-img .shape {
	position: absolute;
	z-index: -1;
}

.testimony-img .shape.shape-1 {
	top: -30px;
	right: -30px;
}

.testimony-img .shape.shape-2 {
	bottom: 0;
	left: 0;
}

.testimony-content {
	margin-right: 35px;
}

.testimony-content h2 {
	font-size: 46px;
	margin-bottom: 50px;
	letter-spacing: -0.01em;
}

.single-testimony .quotes {
	font-size: 50px;
	color: #582949;
	margin: 5px;
}

.single-testimony ul {
	padding-right: 0;
	list-style-type: none;
	margin-bottom: 0;
}

.single-testimony ul li {
	display: inline-block;
	margin-left: 3px;
}
.single-testimony ul li:last-child {
	margin-left: 0;
}

.single-testimony ul li i {
	color: #ffb800;
}

.single-testimony p {
	margin-top: 15px;
	margin-bottom: 30px;
	font-size: 20px;
	line-height: 36px;
	color: #582949;
}

.single-testimony .for-post .traveller {
	margin-right: 15px;
}

.single-testimony .for-post .traveller h3 {
	font-size: 16px;
	font-weight: 500;
}

.single-testimony .for-post .traveller span {
	font-size: 14px;
}

/*
Favourite Area Style
======================================================*/
.favourite-area.bg-1 {
	background-image: url(/images/favourite-bg.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	z-index: 1;
}

.favourite-area.bg-1::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(
		-90.01deg,
		#0c0b0b 0.01%,
		rgba(12, 11, 11, 0.31) 88.46%
	);
	opacity: 0.9;
	z-index: -1;
}

.favourite-content {
	margin-left: 30px;
}

.favourite-content .top-title {
	font-family: var(--font-dancing-script);
	font-size: 20px;
	color: #f0002a;
	display: block;
	margin-bottom: 15px;
}

.favourite-content h2 {
	font-size: 46px;
	margin-bottom: 25px;
	letter-spacing: -0.01em;
}

.favourite-content p {
	margin-bottom: 30px;
}

.favourite-content.style-three {
	max-width: 700px;
	margin-bottom: 0;
	margin-top: -7px;
}

.favourite-content.style-three h2 {
	color: #ffffff;
}

.favourite-content.style-three p {
	color: #c5c5c5;
}

/*
Subscribe Area Style
======================================================*/
.subscribe-bg {
	background-image: url(/images/subscribe-bg.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
	border-radius: 20px;
	padding: 100px;
	position: relative;
	z-index: 1;
}

.subscribe-bg .shape {
	position: absolute;
	z-index: -1;
}

.subscribe-bg .shape.shape-1 {
	bottom: 115px;
	left: 95px;
}

.subscribe-bg .shape.shape-2 {
	top: 50px;
	right: 100px;
}

.subscribe-content {
	max-width: 730px;
	margin: auto;
	text-align: center;
}

.subscribe-content h2 {
	font-size: 46px;
	margin-bottom: 30px;
	letter-spacing: -0.01em;
}

.subscribe-content .newsletter-wrap .newsletter-form {
	position: relative;
}

.subscribe-content .newsletter-wrap .newsletter-form .form-control {
	background-color: #ffffff;
	height: 84px;
	border-radius: 6px;
	padding: 10px 40px;
}

.subscribe-content .newsletter-wrap .newsletter-form .form-control:focus {
	border-color: #f0002a;
}

.subscribe-content
	.newsletter-wrap
	.newsletter-form
	.form-control::-webkit-input-placeholder {
	font-size: 15px;
	font-weight: 300;
}

.subscribe-content
	.newsletter-wrap
	.newsletter-form
	.form-control:-ms-input-placeholder {
	font-size: 15px;
	font-weight: 300;
}

.subscribe-content
	.newsletter-wrap
	.newsletter-form
	.form-control::-ms-input-placeholder {
	font-size: 15px;
	font-weight: 300;
}

.subscribe-content
	.newsletter-wrap
	.newsletter-form
	.form-control::placeholder {
	font-size: 15px;
	font-weight: 300;
}

.subscribe-content .newsletter-wrap .newsletter-form .default-btn {
	position: absolute;
	top: 12.5px;
	left: 11.5px;
	height: 60px;
	padding: 18px 33px;
}

.subscribe-content .newsletter-wrap .validation-danger {
	font-size: 14px;
	color: #ff0000;
	margin-top: 5px;
}

/*
Blog Area Style — editorial card. Used both by the public blog grid
(BlogCard.js / BlogContent.js) and the homepage Swiper (Index/Blog.js)
so visual changes here propagate everywhere blog posts surface.
======================================================*/
.single-blog {
	display: flex;
	flex-direction: column;
	background: #ffffff;
	border: 1px solid #ececec;
	border-radius: 14px;
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease,
		border-color 0.3s ease;
	margin-bottom: 24px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

/* Wrapper around the cover image — owns the positioning context so the
   category chip can sit ABOVE the cover Link (and link somewhere else)
   without nesting <a> inside <a>. */
.single-blog .blog-img-wrap {
	position: relative;
}

.single-blog .blog-img {
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 3 / 2;
	background: #f3f3f5;
}

.single-blog .blog-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
	transition: transform 0.6s ease;
}

/* Soft top-down gradient so the floating chip + date stay readable on
   any cover image. */
.single-blog .blog-img::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		-180deg,
		rgba(15, 23, 42, 0.32) 0%,
		rgba(15, 23, 42, 0) 38%,
		rgba(15, 23, 42, 0) 62%,
		rgba(15, 23, 42, 0.45) 100%
	);
	pointer-events: none;
}

/* Category chip pinned to the top-left of the cover. Sits as a sibling
   of the image Link so clicking it can navigate to a different URL
   (the blog index filtered by this category). */
.single-blog .blog-img-wrap .tag-on-image {
	position: absolute;
	top: 12px;
	inset-inline-start: 12px;
	z-index: 1;
	background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	padding: 5px 11px;
	border-radius: 999px;
	box-shadow: 0 4px 10px rgba(15, 23, 42, 0.2);
	text-decoration: none;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

a.tag-on-image:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 14px rgba(15, 23, 42, 0.28);
}

.single-blog .blog-content {
	background-color: #ffffff;
	padding: 16px 18px 18px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

/* Small date eyebrow above the title — keeps the cover image clean and
   provides a subtle metadata cue inside the body. */
.single-blog .blog-content .blog-meta-date {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 500;
	color: #6b7280;
	letter-spacing: 0.2px;
}

.single-blog .blog-content .blog-meta-date i {
	font-size: 14px;
	color: #6d3358;
}

.single-blog .blog-content h3 {
	font-size: 17px;
	margin: 0;
	line-height: 1.4;
	font-weight: 700;
	letter-spacing: -0.01em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

.single-blog .blog-content h3 a {
	color: #0f172a;
	transition: color 0.2s ease;
}

.single-blog .blog-content .blog-excerpt {
	color: #6b7280;
	font-size: 13.5px;
	line-height: 1.55;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

.single-blog .blog-content .read-more {
	font-size: 13px;
	font-weight: 600;
	color: #582949;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
}

.single-blog .blog-content .read-more i {
	transition: transform 0.25s ease;
}

.single-blog:hover {
	transform: translateY(-6px);
	box-shadow: 0 24px 50px -20px rgba(15, 23, 42, 0.22);
	border-color: #e2d4dc;
}

.single-blog:hover .blog-img img {
	transform: scale(1.06);
}

.single-blog:hover .blog-content h3 a {
	color: #582949;
}

.single-blog:hover .blog-content .read-more i {
	transform: translateX(-4px);
}

/* RTL: arrow flips the other way, keep the same animation feel. */
[dir="rtl"] .single-blog:hover .blog-content .read-more i {
	transform: translateX(4px);
}

/* Public blog page padding. PageBanner above already provides the page
   title; we keep this block tight so the grid lands directly under it. */
.blog-area {
	padding-top: 56px;
	padding-bottom: 80px;
}

.blog-area__empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	padding: 80px 24px;
	border: 1px dashed #e5e7eb;
	border-radius: 18px;
	background: #fafafa;
	color: #6b7280;
}

.blog-area__empty-icon {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
	color: #582949;
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
}

.blog-area__empty p {
	margin: 0;
	font-size: 15px;
	font-weight: 500;
}

/* Horizontal pill row of blog categories, mounted above the grid on both
   /blog and /blog/category/<slug>. Behaves as a tab control: the active
   category fills, the others stay outlined; the count badge inside each
   pill hints at content density. Overflows horizontally on narrow
   viewports so we don't have to truncate names. */
.blog-tabs {
	background: #fff;
	border-bottom: 1px solid #ececec;
	padding: 18px 0 16px;
	margin-bottom: 32px;
	position: sticky;
	top: 0;
	z-index: 1;
}

.blog-tabs__scroll {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	scrollbar-width: thin;
	-webkit-overflow-scrolling: touch;
	padding-bottom: 4px;
}
.blog-tabs__scroll::-webkit-scrollbar {
	height: 4px;
}
.blog-tabs__scroll::-webkit-scrollbar-thumb {
	background: rgba(15, 23, 42, 0.15);
	border-radius: 2px;
}

.blog-tabs__tab {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border-radius: 999px;
	border: 1px solid #e5e7eb;
	background: #fafafa;
	color: #475569;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	white-space: nowrap;
	flex-shrink: 0;
	transition: background 0.15s ease, color 0.15s ease,
		border-color 0.15s ease, transform 0.15s ease;
}

.blog-tabs__tab:hover {
	background: #fff;
	color: #582949;
	border-color: rgba(88, 41, 73, 0.3);
	transform: translateY(-1px);
}

.blog-tabs__tab.is-active {
	background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
	color: #fff;
	border-color: #582949;
	box-shadow: 0 4px 10px rgba(88, 41, 73, 0.2);
}

.blog-tabs__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 7px;
	border-radius: 999px;
	background: rgba(15, 23, 42, 0.06);
	color: #6b7280;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
}

.blog-tabs__tab.is-active .blog-tabs__count {
	background: rgba(255, 255, 255, 0.18);
	color: #fff;
}

@media (max-width: 575px) {
	.blog-tabs {
		padding: 12px 0 10px;
		margin-bottom: 20px;
	}
	.blog-tabs__tab {
		padding: 7px 12px;
		font-size: 13px;
	}
}

/* "Related Posts" strip under a single blog detail page. Sits just below
   the article body so readers can jump to the next post. Visually
   distinct from the article via a top border + tinted background. */
.related-blogs {
	padding: 56px 0 80px;
	margin-top: 24px;
	border-top: 1px solid #e5e7eb;
	background: #fafafa;
}

.related-blogs__title {
	font-size: 24px;
	font-weight: 700;
	color: #0f172a;
	margin: 0 0 28px;
}

@media (max-width: 575px) {
	.related-blogs {
		padding: 40px 0 56px;
	}
	.related-blogs__title {
		font-size: 20px;
		margin-bottom: 20px;
	}
}

/*
Footer Area Style
======================================================*/
.footer-area {
	position: relative;
}

.single-footer-widget {
	margin-bottom: 30px;
}

.single-footer-widget.ml-55 {
	margin-right: 55px;
}

.single-footer-widget.ml-105 {
	margin-right: 105px;
}

.single-footer-widget.ml-90 {
	margin-right: 90px;
}

.single-footer-widget .footer-logo {
	margin-bottom: 30px;
	display: block;
}

.single-footer-widget h3 {
	font-size: 22px;
	margin-bottom: 30px;
	font-weight: 600;
}

.single-footer-widget ul {
	padding-right: 0;
	margin-bottom: 0;
	list-style: none;
}

.single-footer-widget .contact-info li {
	position: relative;
	padding-right: 25px;
	margin-bottom: 20px;
	font-size: 16px;
	font-weight: 500;
	color: #646464;
}

.single-footer-widget .contact-info li:last-child {
	margin-bottom: 0;
}

.single-footer-widget .contact-info li img {
	position: absolute;
	top: 4px;
	right: 0;
	color: #582949;
}

.single-footer-widget .contact-info li i {
	position: absolute;
	top: 0;
	right: 0;
	color: #582949;
}

.single-footer-widget .contact-info li span {
	font-weight: 400;
}

.single-footer-widget .contact-info li a {
	color: #646464;
	font-weight: 400;
}

.single-footer-widget .contact-info li a:hover {
	color: #f0002a;
}

.single-footer-widget .import-link li {
	position: relative;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	padding-right: 0;
	margin-bottom: 20px;
	font-size: 16px;
	font-weight: 400;
}

.single-footer-widget .import-link li a {
	display: block;
	color: #646464;
}

.single-footer-widget .import-link li:last-child {
	margin-bottom: 0;
}

.single-footer-widget .import-link li img {
	position: absolute;
	top: 2px;
	right: 0;
	opacity: 0;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-footer-widget .import-link li:hover {
	padding-right: 20px;
}

.single-footer-widget .import-link li:hover a {
	color: #f0002a;
}

.single-footer-widget .import-link li:hover img {
	opacity: 1;
}

.single-footer-widget .social-link li {
	display: inline-block;
	margin-left: 10px;
	margin-top: 15px;
}

.single-footer-widget .social-link li:last-child {
	margin-left: 0;
}

.single-footer-widget .social-link li a {
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	display: inline-block;
	background-color: #582949;
	color: #ffffff;
	border-radius: 50px;
}

.single-footer-widget .social-link li a:hover {
	background-color: #f0002a;
}

/* ── Footer — Popular Categories block ─────────────────────────────
 * Replaces the old image-bullet list with an icon-tiled category list.
 * Each row is a soft card with a tinted icon badge that fills with the
 * brand red on hover, plus a corner arrow that slides into view. */
.footer-cat-widget .footer-cat-hint {
	font-size: 13px;
	color: #6b6b6b;
	line-height: 1.55;
	margin: -18px 0 16px;
	max-width: 260px;
}
.footer-cat-list {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding-right: 0 !important;
	margin-bottom: 18px !important;
	list-style: none;
}
.footer-cat-item {
	margin: 0 !important;
	padding: 0 !important;
	font-size: inherit !important;
	font-weight: inherit !important;
}
.footer-cat-item::before {
	display: none !important;
}
.footer-cat-link {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 9px 12px;
	border-radius: 10px;
	border: 1px solid transparent;
	color: #1a1a1a !important;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	transition: background-color 0.18s ease, border-color 0.18s ease,
		color 0.18s ease, transform 0.18s ease;
}
.footer-cat-link:hover {
	background: #ffffff;
	border-color: #f0e1e5;
	color: #582949 !important;
	transform: translateX(-2px);
}
[dir="rtl"] .footer-cat-link:hover {
	transform: translateX(2px);
}
.footer-cat-icon {
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 9px;
	background: rgba(240, 0, 42, 0.08);
	color: #f0002a;
	font-size: 18px;
	transition: background-color 0.18s ease, color 0.18s ease,
		transform 0.18s ease;
}
.footer-cat-link:hover .footer-cat-icon {
	background: #f0002a;
	color: #ffffff;
	transform: scale(1.05);
}
.footer-cat-label {
	flex: 1 1 auto;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.footer-cat-arrow {
	flex-shrink: 0;
	font-size: 16px;
	color: #cfcfcf;
	opacity: 0;
	transform: translateX(4px);
	transition: opacity 0.18s ease, transform 0.18s ease, color 0.18s ease;
}
[dir="rtl"] .footer-cat-arrow {
	transform: translateX(-4px) scaleX(-1);
}
.footer-cat-link:hover .footer-cat-arrow {
	opacity: 1;
	color: #f0002a;
	transform: translateX(0);
}
[dir="rtl"] .footer-cat-link:hover .footer-cat-arrow {
	transform: translateX(0) scaleX(-1);
}
.footer-cat-cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 16px;
	border-radius: 999px;
	background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
	color: #ffffff !important;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	transition: transform 0.18s ease, box-shadow 0.18s ease,
		background 0.18s ease;
}
.footer-cat-cta:hover {
	background: linear-gradient(-135deg, #f0002a 0%, #c8001f 100%);
	transform: translateY(-1px);
	box-shadow: 0 8px 18px -8px rgba(240, 0, 42, 0.45);
	color: #ffffff !important;
}
.footer-cat-cta i {
	font-size: 15px;
	transition: transform 0.18s ease;
}
.footer-cat-cta:hover i {
	transform: translateX(-3px);
}
[dir="rtl"] .footer-cat-cta i {
	transform: scaleX(-1);
}
[dir="rtl"] .footer-cat-cta:hover i {
	transform: translateX(3px) scaleX(-1);
}

/*
Footer Area Style
======================================================*/
.copy-right-area {
	position: relative;
}

.copy-right-content {
	padding-top: 25px;
	padding-bottom: 25px;
	text-align: center;
}

.copy-right-content p {
	color: #646464;
	letter-spacing: -0.02em;
}

.copy-right-content p span {
	color: #f0002a;
	font-weight: 700;
}

.copy-right-content p a {
	color: #f0002a;
	font-weight: 700;
}

/*
Pricing Area Style
======================================================*/
.most-populer {
	margin-bottom: 20px;
	margin-top: -20px;
}

.single-pricing {
	background-color: #ffffff;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	padding: 30px;
	border-radius: 20px;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	margin-bottom: 30px;
}

.single-pricing .title {
	margin-bottom: 40px;
}

.single-pricing .title h3 {
	font-size: 16px;
	margin-bottom: 0;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-pricing .title span {
	font-size: 12px;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-pricing .title h1 {
	color: #5146aa;
	font-size: 46px;
	margin-bottom: 0;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-pricing .title h1 sup {
	font-size: 16px;
	position: relative;
	top: -30px;
}

.single-pricing ul {
	padding-right: 0;
	margin-bottom: 25px;
	list-style-type: none;
}

.single-pricing ul li {
	position: relative;
	padding-right: 25px;
	margin-bottom: 15px;
	color: #0c0b0b;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-pricing ul li:last-child {
	margin-bottom: 0;
}

.single-pricing ul li i {
	position: absolute;
	top: -3px;
	right: 0;
	color: #f0002a;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	font-size: 20px;
}

.single-pricing ul .desabel {
	color: #d4d4d4;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-pricing ul .desabel i {
	color: #d4d4d4;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-pricing .default-btn {
	width: 100%;
	background-color: #f4ebfd;
	border-color: #f4ebfd;
	color: #0c0b0b;
}

.single-pricing .default-btn:hover {
	background-color: #f0002a;
	color: #ffffff;
}

.single-pricing.active {
	background-color: #5146aa;
}

.single-pricing.active .title h3 {
	color: #ffe874;
}

.single-pricing.active .title span {
	color: #bbb6e5;
}

.single-pricing.active .title h1 {
	color: #ffffff;
}

.single-pricing.active ul li {
	color: #ffffff;
}

.single-pricing.active ul li i {
	color: #ffffff;
}

.single-pricing.active .default-btn {
	background-color: #f0002a;
	border-color: #f0002a;
	color: #ffffff;
}

.single-pricing.active .desabel {
	color: #8a83c9;
}

.single-pricing.active .desabel i {
	color: #8a83c9;
}

.single-pricing:hover {
	background-color: #5146aa;
}

.single-pricing:hover .title h3 {
	color: #ffe874;
}

.single-pricing:hover .title span {
	color: #bbb6e5;
}

.single-pricing:hover .title h1 {
	color: #ffffff;
}

.single-pricing:hover ul li {
	color: #ffffff;
}

.single-pricing:hover ul li i {
	color: #ffffff;
}

.single-pricing:hover .default-btn {
	background-color: #f0002a;
	border-color: #f0002a;
	color: #ffffff;
}

.single-pricing:hover .desabel {
	color: #8a83c9;
}

.single-pricing:hover .desabel i {
	color: #8a83c9;
}

/*
Destination Area Style
======================================================*/
.single-destination {
	margin-bottom: 30px;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-destination .destination-img {
	position: relative;
	display: block;
}

.single-destination .destination-img img {
	border-radius: 5px;
	margin-bottom: 15px;
}

.single-destination .destination-img i {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	background-color: rgba(12, 11, 11, 0.6);
	font-size: 30px;
	color: #ffc039;
	border-radius: 5px;
	opacity: 0;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.single-destination h3 {
	font-size: 22px;
	margin-bottom: 10px;
	font-weight: 500;
}

.single-destination h3 a {
	color: #0c0b0b;
}

.single-destination ul {
	padding-right: 0;
	margin-bottom: 0;
	list-style-type: none;
	line-height: 1;
}

.single-destination ul li {
	display: inline-block;
	margin-left: 1px;
}

.single-destination ul li:last-child {
	margin-left: 0;
}

.single-destination ul li i {
	color: #ffb800;
}

.single-destination:hover i {
	opacity: 1;
}

.single-destination:hover h3 a {
	color: #f0002a;
}

/*
Page Banner Area Style
======================================================*/
.page-banner-area {
	background: #fff5e1;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	z-index: 1;
}

/* The default 100px top/bottom padding from `.ptb-100` makes the hero
   block feel cavernous. Tighten the banner specifically without
   touching the global `.ptb-100` utility used elsewhere. */
.page-banner-area.ptb-100 {
	padding-top: 56px;
	padding-bottom: 48px;
}

.page-banner-area .page-banner-content h2 {
	font-size: clamp(24px, 3vw, 34px);
	margin-bottom: 8px;
}

.page-banner-area .page-banner-content ul {
	margin-bottom: 0;
}

/* Slim PLP banner — clean white base with a soft brand-red radial glow
   in the top-left corner and a subtle dotted pattern overlay that fades
   to transparent. Premium-feel, no hero image, tight padding. */
.page-banner-area--slim {
	position: relative;
	padding: 26px 0 22px;
	background:
		radial-gradient(
			ellipse 800px 320px at 0% 0%,
			rgba(240, 0, 42, 0.07) 0%,
			transparent 55%
		),
		radial-gradient(
			ellipse 600px 240px at 100% 0%,
			rgba(99, 102, 241, 0.05) 0%,
			transparent 55%
		),
		linear-gradient(-180deg, #ffffff 0%, #f8fafc 100%);
	border-bottom: 1px solid rgba(15, 23, 42, 0.06);
	overflow: hidden;
}
.page-banner-area--slim::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(
		circle at 1px 1px,
		rgba(15, 23, 42, 0.05) 1px,
		transparent 0
	);
	background-size: 22px 22px;
	pointer-events: none;
	mask-image: linear-gradient(
		180deg,
		rgba(0, 0, 0, 0.5) 0%,
		transparent 75%
	);
	-webkit-mask-image: linear-gradient(
		180deg,
		rgba(0, 0, 0, 0.5) 0%,
		transparent 75%
	);
}
.page-banner-area--slim > .container {
	position: relative;
	z-index: 1;
}
.page-banner-content--slim h1 {
	margin: 0;
	font-size: clamp(22px, 2.4vw, 28px);
	font-weight: 700;
	color: #0f172a;
	line-height: 1.2;
}
.page-banner-content--slim ul {
	margin: 0 0 6px;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	font-size: 13px;
}
.page-banner-content--slim ul li {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: #64748b;
}
.page-banner-content--slim ul li:not(:last-child)::after {
	content: "›";
	color: #cbd5e1;
	margin-inline-start: 6px;
}
.page-banner-content--slim ul li a {
	color: #64748b;
	text-decoration: none;
	transition: color 0.15s ease;
}
.page-banner-content--slim ul li a:hover {
	color: #f0002a;
}
.page-banner-content--slim ul li:last-child span {
	color: #f0002a;
	font-weight: 600;
}
.page-banner-content__slot {
	margin-top: 14px;
}

/* Subcategory chip strip — slim pills rendered below the search inside
   the slim PageBanner. Compact alternative to the full SubcategoryGrid. */
.subcat-chips {
	margin-top: 14px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	max-width: 100%;
}
.subcat-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 10px 7px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.85);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	border: 1px solid rgba(15, 23, 42, 0.08);
	font-size: 13px;
	font-weight: 500;
	color: #334155;
	text-decoration: none;
	transition: background 0.15s ease, border-color 0.15s ease,
		color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.subcat-chip:hover {
	background: #ffffff;
	border-color: rgba(240, 0, 42, 0.4);
	color: #f0002a;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(240, 0, 42, 0.1);
}
.subcat-chip__icon {
	font-size: 15px;
	color: #94a3b8;
	transition: color 0.15s ease;
}
.subcat-chip:hover .subcat-chip__icon {
	color: #f0002a;
}
.subcat-chip__label {
	white-space: nowrap;
}
.subcat-chip__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	padding: 1px 7px;
	border-radius: 999px;
	background: #f1f5f9;
	font-size: 11px;
	font-weight: 700;
	color: #64748b;
	transition: background 0.15s ease, color 0.15s ease;
}
.subcat-chip:hover .subcat-chip__count {
	background: rgba(240, 0, 42, 0.1);
	color: #f0002a;
}

/* ───── Services / Consumer grid card ───── */
.svc-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #eaecf0;
	border-radius: 16px;
	overflow: hidden;
	margin-bottom: 24px;
	height: calc(100% - 24px);
	transition: transform 0.18s ease, box-shadow 0.18s ease,
		border-color 0.18s ease;
}
.svc-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08);
	border-color: rgba(240, 0, 42, 0.35);
}
.svc-card__cover {
	position: relative;
	display: block;
	aspect-ratio: 16 / 10;
	background: #f4f6fa;
	overflow: hidden;
}
.svc-card__cover-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.svc-card__cover-fallback {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 56px;
	color: rgba(255, 255, 255, 0.7);
	background: linear-gradient(-135deg, #f0002a 0%, #c8001f 60%, #7a0014 100%);
}
.svc-card__cover-fallback::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(
			circle at 25% 25%,
			rgba(255, 255, 255, 0.18) 0,
			transparent 42%
		),
		radial-gradient(
			circle at 80% 80%,
			rgba(255, 255, 255, 0.12) 0,
			transparent 50%
		);
	pointer-events: none;
}
.svc-card__type-pill {
	position: absolute;
	top: 12px;
	inset-inline-start: 12px;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px;
	border-radius: 999px;
	background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
	backdrop-filter: blur(6px);
	color: #fff;
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.02em;
}
.svc-card__type-pill i {
	font-size: 13px;
}
.svc-card__open {
	position: absolute;
	top: 12px;
	inset-inline-end: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 9px;
	border-radius: 999px;
	font-size: 11.5px;
	font-weight: 600;
}
.svc-card__open--open {
	background: rgba(16, 185, 129, 0.95);
	color: #fff;
}
.svc-card__open--closed {
	background: rgba(244, 63, 94, 0.92);
	color: #fff;
}
.svc-card__open-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
}

.svc-card__body {
	padding: 16px 18px 18px;
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 6px;
	position: relative;
}
.svc-card__logo {
	width: 48px;
	height: 48px;
	border-radius: 12px;
	background: #fff;
	border: 2px solid #fff;
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
	overflow: hidden;
	margin-top: -32px;
	margin-bottom: 6px;
}
.svc-card__logo img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}
.svc-card__title-line {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
}
.svc-card__title {
	font-size: 17px;
	font-weight: 700;
	margin: 0;
	line-height: 1.3;
	color: #101828;
	flex: 1;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.svc-card__title a {
	color: inherit;
	text-decoration: none;
}
.svc-card__title a:hover {
	color: #f0002a;
}
.svc-card__tagline {
	font-size: 13px;
	line-height: 1.45;
	color: #667085;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.svc-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
}
.svc-card__meta span {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12.5px;
	color: #667085;
}
.svc-card__meta i {
	font-size: 14px;
	color: #98a2b3;
}
.svc-card__footer {
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid #eef0f3;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}
.svc-card__cat-link {
	font-size: 12.5px;
	font-weight: 500;
	color: #475467;
	text-decoration: none;
	background: #f3f4f6;
	padding: 5px 10px;
	border-radius: 999px;
	transition: background 0.15s ease, color 0.15s ease;
}
.svc-card__cat-link:hover {
	background: rgba(240, 0, 42, 0.1);
	color: #f0002a;
}
.svc-card__cta {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 13px;
	font-weight: 600;
	color: #f0002a;
	text-decoration: none;
	transition: gap 0.15s ease, color 0.15s ease;
}
.svc-card__cta:hover {
	color: #c8001f;
	gap: 7px;
}
[dir="rtl"] .svc-card__cta i {
	transform: scaleX(-1);
}

/* ───── B2B grid card (LinkedIn-style company card) ───── */
.b2b-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #eaecf0;
	border-radius: 16px;
	overflow: hidden;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
	margin-bottom: 24px;
	height: calc(100% - 24px);
}
.b2b-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08);
	border-color: #d4dcef;
}

/* Cover */
.b2b-card__cover {
	position: relative;
	display: block;
	aspect-ratio: 16 / 8;
	background: #f4f6fa;
	overflow: hidden;
}
.b2b-card__cover-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.b2b-card__cover-fallback {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 56px;
	color: rgba(255, 255, 255, 0.7);
	background: linear-gradient(-135deg, #2563eb 0%, #1e3a8a 60%, #0f172a 100%);
}
.b2b-card__cover-fallback::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(
			circle at 20% 20%,
			rgba(255, 255, 255, 0.18) 0,
			transparent 40%
		),
		radial-gradient(
			circle at 80% 80%,
			rgba(255, 255, 255, 0.12) 0,
			transparent 50%
		);
	pointer-events: none;
}

/* Cover-overlay pills */
.b2b-card__type-pill {
	position: absolute;
	top: 12px;
	inset-inline-start: 12px;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px;
	border-radius: 999px;
	background: #0f172ac7;
	backdrop-filter: blur(6px);
	color: #fff;
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.02em;
}
.b2b-card__verified-pill {
	position: absolute;
	top: 12px;
	inset-inline-end: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px;
	border-radius: 999px;
	background: rgba(16, 185, 129, 0.95);
	color: #fff;
	font-size: 11.5px;
	font-weight: 600;
}
.b2b-card__type-pill i,
.b2b-card__verified-pill i {
	font-size: 13px;
}

/* Logo + heart row, half-overlapping the cover */
.b2b-card__logo-wrap {
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	padding: 0 18px;
	margin-top: -36px;
}
.b2b-card__logo {
	width: 72px;
	height: 72px;
	border-radius: 14px;
	background: #fff;
	border: 3px solid #fff;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
	overflow: hidden;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.b2b-card__logo-img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}
.b2b-card__logo-fallback {
	font-size: 22px;
	font-weight: 700;
	color: #2563eb;
	background: linear-gradient(-135deg, #eef2ff, #dbeafe);
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.b2b-card__heart {
	margin-bottom: 4px;
}

/* Body */
.b2b-card__body {
	padding: 12px 18px 18px;
	display: flex;
	flex-direction: column;
	flex: 1;
}
.b2b-card__title {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 4px;
	line-height: 1.3;
	color: #101828;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.b2b-card__title a {
	color: inherit;
	text-decoration: none;
}
.b2b-card__title a:hover {
	color: #2563eb;
}
.b2b-card__tagline {
	font-size: 13.5px;
	line-height: 1.45;
	color: #475467;
	margin: 0 0 12px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.b2b-card__meta {
	list-style: none;
	padding: 0;
	margin: 0 0 14px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
}
.b2b-card__meta li {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12.5px;
	color: #667085;
}
.b2b-card__meta i {
	font-size: 14px;
	color: #98a2b3;
}

.b2b-card__footer {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding-top: 12px;
	border-top: 1px solid #eef0f3;
}
.b2b-card__cat {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12.5px;
	font-weight: 500;
	color: #475467;
	background: #f3f4f6;
	padding: 5px 10px;
	border-radius: 999px;
	text-decoration: none;
	transition: all 0.15s ease;
}
.b2b-card__cat:hover {
	background: #e0e7ff;
	color: #2563eb;
}
.b2b-card__cat i {
	font-size: 13px;
}
.b2b-card__cta {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 13px;
	font-weight: 600;
	color: #2563eb;
	text-decoration: none;
	transition: gap 0.15s ease, color 0.15s ease;
}
.b2b-card__cta:hover {
	color: #1d4ed8;
	gap: 7px;
}
.b2b-card__cta i {
	font-size: 15px;
}
[dir="rtl"] .b2b-card__cta i {
	transform: scaleX(-1);
}

/* ───── B2B list row (compact, scannable directory style) ───── */
.b2b-row {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 16px;
	align-items: center;
	background: #fff;
	border: 1px solid #eaecf0;
	border-radius: 12px;
	padding: 14px 18px;
	margin-bottom: 10px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease,
		transform 0.15s ease;
}
.b2b-row:hover {
	border-color: #d4dcef;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
	transform: translateY(-1px);
}

.b2b-row__logo {
	width: 64px;
	height: 64px;
	border-radius: 12px;
	background: #fff;
	border: 1px solid #ececef;
	overflow: hidden;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
}
.b2b-row__logo-img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}
.b2b-row__logo-fallback {
	font-size: 19px;
	font-weight: 700;
	color: #2563eb;
	background: linear-gradient(-135deg, #eef2ff, #dbeafe);
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.b2b-row__main {
	min-width: 0;
}
.b2b-row__title-line {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}
.b2b-row__title {
	font-size: 16.5px;
	font-weight: 700;
	color: #101828;
	margin: 0;
	line-height: 1.25;
}
.b2b-row__title a {
	color: inherit;
	text-decoration: none;
}
.b2b-row__title a:hover {
	color: #2563eb;
}
.b2b-row__verified {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 2px 7px;
	border-radius: 999px;
	background: rgba(16, 185, 129, 0.12);
	color: #047857;
	font-size: 11px;
	font-weight: 600;
}
.b2b-row__type {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 3px 10px;
	border-radius: 999px;
	background: rgba(15, 23, 42, 0.78);
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.02em;
	flex-shrink: 0;
}
.b2b-row__type--services {
background: linear-gradient(-135deg, #6d3358 0%, #582949 100%);
}
.b2b-row__type i {
	font-size: 12px;
	opacity: 0.9;
}
.b2b-row__verified i {
	font-size: 12px;
}
.b2b-row__tagline {
	margin: 3px 0 6px;
	font-size: 12.5px;
	line-height: 1.4;
	color: #667085;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.b2b-row__meta {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 4px 14px;
}
.b2b-row__meta li {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 12.5px;
	color: #667085;
}
.b2b-row__meta li i {
	font-size: 13px;
	color: #98a2b3;
}
.b2b-row__meta-cat a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: #2563eb;
	text-decoration: none;
	font-weight: 500;
}
.b2b-row__meta-cat a:hover {
	color: #1d4ed8;
	text-decoration: underline;
}
.b2b-row__meta-cat i {
	color: #2563eb !important;
}

.b2b-row__actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}
.b2b-row__cta {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 7px 14px;
	border-radius: 8px;
	background: #fff;
	border: 1px solid #d4dcef;
	color: #2563eb;
	font-size: 12.5px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease, border-color 0.15s ease,
		gap 0.15s ease;
	white-space: nowrap;
}
.b2b-row__cta:hover {
	background: #2563eb;
	border-color: #2563eb;
	color: #fff;
	gap: 6px;
}
.b2b-row__cta i {
	font-size: 14px;
}
[dir="rtl"] .b2b-row__cta i {
	transform: scaleX(-1);
}

/* Mobile: stack actions below content */
@media (max-width: 575px) {
	.b2b-row {
		grid-template-columns: auto 1fr;
		row-gap: 10px;
	}
	.b2b-row__actions {
		grid-column: 1 / -1;
		justify-content: flex-end;
	}
	.b2b-row__title {
		font-size: 15.5px;
	}
}

/* ───── Profile forms (settings + edit-my-info) ───── */
.profile-form-area {
	background: #fafbfc;
	min-height: 70vh;
	padding: 48px 0 80px;
}
.profile-form {
	max-width: 760px;
	margin: 0 auto;
	background: #fff;
	border: 1px solid #eaecf0;
	border-radius: 16px;
	padding: 32px;
}
.profile-form__intro {
	margin-bottom: 28px;
	padding-bottom: 20px;
	border-bottom: 1px solid #eef0f3;
}
.profile-form__intro h2 {
	font-size: 24px;
	font-weight: 700;
	margin: 0 0 6px;
	color: #101828;
}
.profile-form__intro p {
	margin: 0;
	color: #667085;
	font-size: 14px;
}
.profile-form__section {
	margin-bottom: 28px;
}
.profile-form__section--security {
	margin-top: 8px;
	padding-top: 24px;
	border-top: 2px dashed #eef0f3;
}
.profile-form__security-toggle {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 16px;
	background: #fafbfc;
	border: 1px dashed #d0d5dd;
	border-radius: 10px;
	cursor: pointer;
	text-align: start;
	transition: background 0.15s ease, border-color 0.15s ease;
}
.profile-form__security-toggle[aria-expanded="true"] {
	background: #fff;
	border-style: solid;
	border-color: #ececef;
	margin-bottom: 14px;
}
.profile-form__security-toggle:hover {
	background: #f5f6f8;
}
.profile-form__security-toggle i {
	font-size: 18px;
	color: #475467;
}
.profile-form__security-toggle > span {
	font-size: 14px;
	font-weight: 600;
	color: #344054;
	flex-shrink: 0;
}
.profile-form__security-toggle > small {
	color: #98a2b3;
	font-size: 12px;
	flex: 1;
}
.profile-form__security-body {
	padding-top: 4px;
}
.profile-form__section-title {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #475467;
	margin: 0 0 14px;
}
.profile-form__section-hint {
	font-size: 13px;
	color: #667085;
	margin: -8px 0 14px;
}
.profile-form__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 16px;
}
.profile-form__grid > .form-group {
	margin-bottom: 14px;
}

/* Form field common look (overrides only what's needed) */
.profile-form .form-group {
	margin-bottom: 14px;
}
.profile-form .form-group label,
.profile-form .form-label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #344054;
	margin-bottom: 6px;
}
.profile-form .form-control {
	display: block;
	width: 100%;
	padding: 9px 12px;
	font-size: 14px;
	border: 1px solid #d0d5dd;
	border-radius: 8px;
	background: #fff;
	color: #101828;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.profile-form .form-control:focus {
	outline: none;
	border-color: #f0002a;
	box-shadow: 0 0 0 3px rgba(240, 0, 42, 0.12);
}
.profile-form .form-control:disabled,
.profile-form .form-control[readonly] {
	background: #f5f6f8;
	color: #667085;
	cursor: not-allowed;
}
.profile-form textarea.form-control {
	resize: vertical;
	min-height: 96px;
	line-height: 1.5;
}
.profile-form select.form-control {
	appearance: none;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
	background-repeat: no-repeat;
	background-position: left 12px center;
	padding-left: 36px;
}
[dir="rtl"] .profile-form select.form-control {
	background-position: right 12px center;
	padding-left: 12px;
	padding-right: 36px;
}
.profile-form .form-hint {
	display: block;
	margin-top: 6px;
	font-size: 12px;
	color: #98a2b3;
	line-height: 1.4;
}
.profile-form .invalid-feedback {
	display: block;
	font-size: 12px;
	color: #b42318;
	margin-top: 4px;
}
.profile-form .is-invalid {
	border-color: #fda29b;
}

.profile-form__avatar-row {
	margin-bottom: 18px;
}
.profile-form__footer {
	display: flex;
	justify-content: flex-end;
	padding-top: 20px;
	border-top: 1px solid #eef0f3;
}
.profile-form__footer button {
	min-width: 160px;
}

@media (max-width: 575px) {
	.profile-form {
		padding: 22px 18px;
	}
	.profile-form__grid {
		grid-template-columns: 1fr;
	}
	.profile-form__footer {
		justify-content: stretch;
	}
	.profile-form__footer button {
		width: 100%;
	}
}

/* Company name autocomplete (string-based; no Company entity yet) */
.company-ac {
	position: relative;
}
.company-ac__input-wrap {
	position: relative;
}
.company-ac__spinner {
	position: absolute;
	top: 50%;
	inset-inline-end: 12px;
	transform: translateY(-50%);
	color: #98a2b3;
	font-size: 16px;
	pointer-events: none;
	display: inline-flex;
	animation: company-ac-spin 1s linear infinite;
}
@keyframes company-ac-spin {
	to {
		transform: translateY(-50%) rotate(-360deg);
	}
}
.company-ac__list {
	position: absolute;
	top: calc(100% + 4px);
	right: 0;
	left: 0;
	z-index: 50;
	max-height: 240px;
	overflow-y: auto;
	margin: 0;
	padding: 6px;
	list-style: none;
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 10px;
	box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1);
}
.company-ac__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 8px 10px;
	border-radius: 7px;
	font-size: 13.5px;
	color: #344054;
	cursor: pointer;
	transition: background 0.1s ease;
}
.company-ac__item--active,
.company-ac__item:hover {
	background: #f3f4f6;
	color: #101828;
}
.company-ac__name {
	flex: 1;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.company-ac__count {
	flex-shrink: 0;
	font-size: 11.5px;
	color: #98a2b3;
	background: #f3f4f6;
	padding: 2px 8px;
	border-radius: 999px;
}
.company-ac__item--active .company-ac__count,
.company-ac__item:hover .company-ac__count {
	background: #fff;
}
.company-ac__empty {
	position: absolute;
	top: calc(100% + 4px);
	right: 0;
	left: 0;
	z-index: 50;
	padding: 10px 12px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12.5px;
	color: #475467;
	background: #fff;
	border: 1px dashed #d0d5dd;
	border-radius: 10px;
}
.company-ac__empty i {
	color: #98a2b3;
	font-size: 14px;
}

/* Opening hours public display (status pill + weekly table) */
.oh-display {
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 12px;
	padding: 14px 16px;
	margin: 16px 0;
}
.oh-display__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 10px;
}
.oh-display__status {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 12.5px;
	font-weight: 600;
}
.oh-display__status--open {
	background: rgba(16, 185, 129, 0.12);
	color: #047857;
}
.oh-display__status--closed {
	background: rgba(244, 63, 94, 0.12);
	color: #b91c1c;
}
.oh-display__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: currentColor;
}
.oh-display__label {
	font-size: 12.5px;
	color: #98a2b3;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	font-weight: 600;
}
.oh-display__table {
	width: 100%;
	font-size: 13px;
	border-collapse: collapse;
}
.oh-display__table th,
.oh-display__table td {
	padding: 6px 0;
	text-align: start;
	font-weight: 500;
	color: #475467;
	border-top: 1px solid #f3f4f6;
}
.oh-display__table tr:first-child th,
.oh-display__table tr:first-child td {
	border-top: none;
}
.oh-display__table th {
	color: #344054;
	font-weight: 600;
	width: 35%;
}
.oh-display__off {
	color: #98a2b3;
}

/* Opening hours weekly editor */
.opening-hours {
	background: #fafbfc;
	border: 1px solid #ececef;
	border-radius: 10px;
	padding: 14px 16px;
}
.opening-hours__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 10px;
}
.opening-hours__hint {
	font-size: 12.5px;
	color: #667085;
	margin: 0;
	max-width: 60%;
}
.opening-hours__head-actions {
	display: flex;
	gap: 6px;
}
.opening-hours__quick {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px;
	border: 1px solid #d0d5dd;
	border-radius: 6px;
	background: #fff;
	color: #475467;
	font-size: 12px;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.12s ease;
}
.opening-hours__quick:hover:not(:disabled) {
	border-color: #f0002a;
	color: #f0002a;
}
.opening-hours__quick--ghost {
	background: transparent;
}
.opening-hours__quick i {
	font-size: 13px;
}
.opening-hours__list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
}
.opening-hours__row {
	display: grid;
	grid-template-columns: 110px 100px 1fr;
	align-items: center;
	gap: 10px;
	padding: 8px 0;
	border-top: 1px solid #f1f3f5;
}
.opening-hours__row:first-child {
	border-top: none;
}
.opening-hours__day {
	font-size: 13.5px;
	font-weight: 600;
	color: #344054;
}
.opening-hours__closed-toggle {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12.5px;
	color: #475467;
	cursor: pointer;
	user-select: none;
}
.opening-hours__closed-toggle input {
	cursor: pointer;
}
.opening-hours__times {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.opening-hours__time {
	width: 110px !important;
	font-size: 13px;
	padding: 6px 10px !important;
}
.opening-hours__sep {
	color: #98a2b3;
	font-size: 13px;
}
@media (max-width: 575px) {
	.opening-hours__row {
		grid-template-columns: 1fr 1fr;
		row-gap: 8px;
	}
	.opening-hours__times {
		grid-column: 1 / -1;
	}
	.opening-hours__time {
		flex: 1;
		width: auto !important;
	}
}

/* Avatar uploader (compact, circular) */
.avatar-upload {
	display: flex;
	align-items: center;
	gap: 16px;
}
.avatar-upload__preview {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	overflow: hidden;
	border: 2px solid #eaecf0;
	background: #f4f6fa;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.avatar-upload__img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}
.avatar-upload__fallback {
	font-size: 28px;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(-135deg, #f0002a, #ff5773);
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.avatar-upload__actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
.avatar-upload__btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	font-size: 13px;
	font-weight: 600;
	border-radius: 8px;
	background: #f0002a;
	color: #fff;
	border: 1px solid #f0002a;
	cursor: pointer;
	transition: background 0.15s ease, border-color 0.15s ease;
}
.avatar-upload__btn:hover:not(:disabled) {
	background: #d8001f;
	border-color: #d8001f;
}
.avatar-upload__btn:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}
.avatar-upload__btn--ghost {
	background: #fff;
	color: #475467;
	border-color: #d0d5dd;
}
.avatar-upload__btn--ghost:hover:not(:disabled) {
	background: #fafbfc;
	color: #101828;
	border-color: #98a2b3;
}
.avatar-upload__btn i {
	font-size: 15px;
}

/* Floating admin-only edit button on public listing detail pages */
.admin-edit-fab {
	position: fixed;
	bottom: 24px;
	inset-inline-end: 24px;
	z-index: 1040;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 18px;
	background: #101828;
	color: #fff;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	box-shadow: 0 10px 24px rgba(15, 23, 42, 0.28);
	transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.admin-edit-fab:hover {
	background: #f0002a;
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 14px 28px rgba(240, 0, 42, 0.32);
}
.admin-edit-fab i {
	font-size: 18px;
}
@media (max-width: 575px) {
	.admin-edit-fab {
		bottom: 16px;
		inset-inline-end: 16px;
		padding: 10px 14px;
		font-size: 13px;
	}
}

/* Slim admin-page header — used for /dashboard/* */
.page-banner-area--admin {
	background: #fff;
	border-bottom: 1px solid #eef0f3;
	padding: 22px 0 18px;
}
.page-banner-area--admin::before {
	display: none;
}
.page-banner-content--admin ul {
	margin-bottom: 6px;
	padding-right: 0;
	list-style-type: none;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
}
.page-banner-content--admin ul li {
	font-size: 12px;
	color: #98a2b3;
	margin: 0;
	position: relative;
	display: inline-flex;
	align-items: center;
}
.page-banner-content--admin ul li::before {
	content: "";
	position: absolute;
	top: 50%;
	left: -11px;
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: #cfd4dc;
	transform: translateY(-50%);
}
.page-banner-content--admin ul li:last-child::before {
	display: none;
}
.page-banner-content--admin ul li a {
	color: #667085;
	text-decoration: none;
	transition: color 0.15s ease;
}
.page-banner-content--admin ul li a:hover {
	color: #f0002a;
}
.page-banner-content--admin ul li span {
	color: #344054;
	font-weight: 500;
}
.page-banner-content--admin h2 {
	font-size: 22px;
	font-weight: 700;
	color: #101828;
	margin: 0;
	letter-spacing: -0.01em;
}
[dir="rtl"] .page-banner-content--admin ul li::before {
	left: auto;
	right: -11px;
}

.page-banner-area.overly::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: -webkit-gradient(
		linear,
		right top,
		left top,
		color-stop(30.78%, #0c0b0b),
		color-stop(77.08%, rgba(12, 11, 11, 0.69))
	);
	background: linear-gradient(
		-90deg,
		#0c0b0b 30.78%,
		rgba(12, 11, 11, 0.69) 77.08%
	);
	opacity: 0.75;
	z-index: -1;
}

.page-banner-area.bg-1 {
	background-image: url(/images/banner/banner-bg.webp);
}

.page-banner-area.bg-2 {
	background-image: url(/images/banner/banner-bg.webp);
}

.page-banner-area.bg-3 {
	background-image: url(/images/banner/banner-bg.webp);
}

.page-banner-area.bg-4 {
	background-image: url(/images/banner/banner-bg.webp);
}

.page-banner-area.bg-5 {
	background-image: url(/images/banner/banner-bg.webp);
}

.page-banner-area.bg-6 {
	background-image: url(/images/banner/banner-bg.webp);
}

.page-banner-area.bg-7 {
	background-image: url(/images/banner/banner-bg.webp);
}

.page-banner-area.bg-8 {
	background-image: url(/images/banner/banner-bg.webp);
}

.page-banner-area.bg-9 {
	background-image: url(/images/banner/banner-bg.webp);
}

.page-banner-area.bg-10 {
	background-image: url(/images/banner/banner-bg.webp);
}

.page-banner-content ul {
	padding-right: 0;
	margin-bottom: 10px;
	list-style-type: none;
}

.page-banner-content ul li {
	display: inline-block;
	position: relative;
	margin-left: 30px;
}

.page-banner-content ul li::before {
	content: "";
	position: absolute;
	top: 9px;
	left: -17px;
	width: 6px;
	height: 6px;
	background-color: #5146aa;
	border-radius: 50px;
}

.page-banner-content ul li:last-child {
	margin-left: 0;
}

.page-banner-content ul li:last-child::before {
	display: none;
}

.page-banner-content ul li a {
	color: #582949;
}

.page-banner-content ul li a:hover {
	color: #f0002a;
}

.page-banner-content ul li span {
	color: #f0002a;
}

.page-banner-content h2 {
	font-size: 46px;
	margin-bottom: 0;
	letter-spacing: -0.01em;
}

.page-banner-content .search-result {
	margin-top: 50px;
}

.page-banner-content .search-result .form-group {
	position: relative;
	margin-bottom: 30px;
}

.page-banner-content .search-result .form-group .form-control {
	padding: 10px 40px;
	padding-right: 68px;
	background-color: #ffffff;
	border-color: #ffe1a1;
	height: 84px;
	border-radius: 6px;
}

.page-banner-content
	.search-result
	.form-group
	.form-control::-webkit-input-placeholder {
	color: #646464;
	font-weight: 300;
	font-size: 15px;
}

.page-banner-content
	.search-result
	.form-group
	.form-control:-ms-input-placeholder {
	color: #646464;
	font-weight: 300;
	font-size: 15px;
}

.page-banner-content
	.search-result
	.form-group
	.form-control::-ms-input-placeholder {
	color: #646464;
	font-weight: 300;
	font-size: 15px;
}

.page-banner-content .search-result .form-group .form-control::placeholder {
	color: #646464;
	font-weight: 300;
	font-size: 15px;
}

.page-banner-content .search-result .form-group .form-control:focus {
	border-color: #f0002a;
}

.page-banner-content .search-result .form-group .form-control.form-select {
	cursor: pointer;
	font-weight: 300;
	font-size: 15px;
	background-position: left 40px center;
}

.page-banner-content .search-result .form-group img {
	position: absolute;
	top: 32px;
	right: 40px;
}

.page-banner-content .search-result .form-group i {
	position: absolute;
	top: 30px;
	right: 20px;
}

.page-banner-content .search-result .form-group .default-btn {
	width: 100%;
	height: 84px;
}

.page-banner-content .search-result .form-group .default-btn img {
	position: relative;
	right: 0;
	top: 2px;
}

.page-banner-content .search-result .form-group .default-btn i {
	position: relative;
	top: 2px;
	right: 0;
}

.page-banner-content.white-title ul li {
	color: #ffffff;
}

.page-banner-content.white-title ul li::before {
	background-color: #ffc039;
}

.page-banner-content.white-title ul li a {
	color: #ffffff;
}

.page-banner-content.white-title h2 {
	color: #ffffff;
}

/*
Map Src Area Style
======================================================*/
.search-map-area {
	overflow: hidden;
}

.src-map iframe {
	width: 100%;
	height: 100vh;
	display: block;
}

.src-map.is-sticky {
	position: fixed;
	top: 105px;
	width: 100%;
	-webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
	animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
}

.featured-wrap .page-banner-content {
	max-width: 900px;
	margin: auto;
}

.featured-wrap .featured-area {
	max-width: 948px;
	margin: auto;
}

/*
Map Src Area Style
======================================================*/
.about-content h2 {
	font-size: 46px;
	margin-bottom: 20px;
	letter-spacing: -0.01em;
}

.about-content p {
	margin-bottom: 30px;
}

/*
Authors Area Style
======================================================*/
.single-authors {
	margin-bottom: 30px;
}

.single-authors img {
	border-radius: 17px 17px 0 0;
}

.single-authors .authors-content {
	background-color: #ffffff;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	padding: 30px;
	border-radius: 0 0 17px 17px;
}

.single-authors .authors-content h3 {
	font-size: 22px;
}

.single-authors .authors-content h3 a {
	color: #0c0b0b;
}

.single-authors .authors-content span {
	font-size: 15px;
}

.single-authors .authors-content .auther-btn {
	display: inline-block;
	width: 60px;
	height: 60px;
	line-height: 60px;
	text-align: center;
	background-color: #ffffff;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	border-radius: 50px;
	color: #f0002a;
	font-size: 30px;
}

.single-authors .authors-content .auther-btn i {
	position: relative;
	right: 2px;
}

.single-authors .authors-content .auther-btn:hover {
	background-color: #f0002a;
	color: #ffffff;
}

.single-authors:hover .auther-btn {
	background-color: #f0002a;
	color: #ffffff;
}

.author-details-img img {
	border-radius: 17px;
}

.author-details-content .author-info {
	margin-bottom: 20px;
}

.author-details-content .author-info h3 {
	font-size: 24px;
	margin-bottom: 10px;
	font-weight: 700;
}

.author-details-content .author-info span {
	font-size: 15px;
	margin-bottom: 15px;
	display: block;
}

.author-details-content .author-info p {
	font-size: 15px;
	position: relative;
	padding-right: 20px;
	margin-bottom: 25px;
}

.author-details-content .author-info p i {
	position: absolute;
	top: 0;
	right: 0;
	color: #f0002a;
}

.author-details-content .author-info ul {
	padding-right: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.author-details-content .author-info ul li {
	display: inline-block;
	margin-left: 5px;
}

.author-details-content .author-info ul li:last-child {
	margin-left: 0;
}

.author-details-content .author-info ul li a {
	width: 35px;
	height: 35px;
	line-height: 35px;
	text-align: center;
	color: #ffffff;
	background-color: #582949;
	display: inline-block;
	border-radius: 50px;
}

.author-details-content .author-info ul li a:hover {
	background-color: #f0002a;
}

.author-details-content .contact-info .default-btn {
	display: block;
	margin-bottom: 30px;
}

.author-details-content .contact-info .default-btn.active {
	background: #5146aa;
	border-color: #5146aa;
}

.author-details-content .contact-info .default-btn.active:hover {
	background-color: #5146aa;
	border-color: #5146aa;
}

.author-details-content .contact-info .default-btn:last-child {
	margin-bottom: 0;
}

/* ═══════════════════════════════════════════════════════════════════
   FAQ page — search + category filter + grouped accordion + CTA card.
   Replaces the old plain accordion treatment.
   ═══════════════════════════════════════════════════════════════════ */
.faq-page {
	padding: 56px 0 96px;
	background: linear-gradient(-180deg, #fafbfc 0%, #ffffff 100%);
}
.faq-page__head {
	max-width: 760px;
	margin: 0 auto 32px;
	text-align: center;
}
.faq-page__heading {
	font-size: clamp(26px, 3.2vw, 36px);
	font-weight: 800;
	color: #101828;
	letter-spacing: -0.02em;
	margin: 0 0 12px;
}
.faq-page__lede {
	font-size: 15px;
	color: #475467;
	line-height: 1.65;
	margin: 0 0 28px;
}

/* Search bar */
.faq-search {
	position: relative;
	max-width: 580px;
	margin: 0 auto 22px;
}
.faq-search__icon {
	position: absolute;
	top: 50%;
	inset-inline-start: 18px;
	transform: translateY(-50%);
	color: #98a2b3;
	font-size: 20px;
	pointer-events: none;
}
.faq-search__input {
	width: 100%;
	height: 52px;
	padding: 0 50px;
	font-size: 15px;
	color: #101828;
	background: #ffffff;
	border: 1.5px solid #e4e6ea;
	border-radius: 14px;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
	font-family: inherit;
}
.faq-search__input:focus {
	outline: none;
	border-color: #f0002a;
	box-shadow: 0 0 0 4px rgba(240, 0, 42, 0.1);
}
.faq-search__input::placeholder {
	color: #98a2b3;
}
.faq-search__clear {
	position: absolute;
	top: 50%;
	inset-inline-end: 12px;
	transform: translateY(-50%);
	width: 30px;
	height: 30px;
	border: none;
	border-radius: 50%;
	background: #f1f5f9;
	color: #475467;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	transition: background 0.15s ease, color 0.15s ease;
}
.faq-search__clear:hover {
	background: #e4e6ea;
	color: #101828;
}

/* Category filter pills */
.faq-cats {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: center;
	margin-bottom: 16px;
}
.faq-cat {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px;
	background: #ffffff;
	border: 1.5px solid #e4e6ea;
	border-radius: 999px;
	font-size: 13.5px;
	font-weight: 600;
	color: #475467;
	cursor: pointer;
	transition: all 0.15s ease;
	font-family: inherit;
}
.faq-cat i {
	font-size: 16px;
	color: #98a2b3;
}
.faq-cat:hover {
	border-color: #d0d5dd;
	color: #101828;
}
.faq-cat--active {
	background: linear-gradient(-135deg, #101828 0%, #1f2a3d 100%);
	border-color: #101828;
	color: #ffffff;
}
.faq-cat--active i {
	color: #ffffff;
}
.faq-cat__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 20px;
	padding: 0 6px;
	background: rgba(0, 0, 0, 0.06);
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
}
.faq-cat--active .faq-cat__count {
	background: rgba(255, 255, 255, 0.2);
	color: #ffffff;
}

.faq-result-count {
	font-size: 12.5px;
	color: #98a2b3;
	margin: 0;
}

/* Accordion list */
.faq-list {
	max-width: 880px;
	margin: 0 auto;
	padding: 0 !important;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.faq-list > li {
	margin: 0 !important;
	padding: 0 !important;
}
.faq-list > li::before {
	display: none !important;
}

.faq-item {
	background: #ffffff;
	border: 1px solid #ececef;
	border-radius: 14px;
	overflow: hidden;
	transition: border-color 0.18s ease, box-shadow 0.18s ease,
		transform 0.18s ease;
}
.faq-item:hover {
	border-color: #d0d5dd;
	box-shadow: 0 6px 18px -10px rgba(15, 23, 42, 0.12);
}
.faq-item--open {
	border-color: #d0d5dd;
	box-shadow: 0 12px 30px -16px rgba(15, 23, 42, 0.14);
}

/* Trigger button */
.faq-item__btn {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 18px 22px;
	background: transparent;
	border: none;
	cursor: pointer;
	text-align: start;
	font-family: inherit;
}
.faq-item__icon {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 11px;
	font-size: 19px;
	transition: transform 0.15s ease;
}
.faq-item--blue .faq-item__icon {
	background: #eef4ff;
	color: #1d4ed8;
}
.faq-item--violet .faq-item__icon {
	background: #f5f3ff;
	color: #7c3aed;
}
.faq-item--amber .faq-item__icon {
	background: #fffbeb;
	color: #d97706;
}
.faq-item--green .faq-item__icon {
	background: #ecfdf5;
	color: #16a34a;
}
.faq-item--open .faq-item__icon {
	transform: scale(1.05);
}
.faq-item__q {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 15.5px;
	font-weight: 600;
	color: #101828;
	line-height: 1.45;
	letter-spacing: -0.01em;
}
.faq-item__chevron {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #f1f5f9;
	color: #475467;
	font-size: 18px;
	transition: transform 0.2s ease, background 0.15s ease,
		color 0.15s ease;
}
.faq-item:hover .faq-item__chevron {
	background: #e4e6ea;
	color: #101828;
}
.faq-item--open .faq-item__chevron {
	transform: rotate(-180deg);
	background: #f0002a;
	color: #ffffff;
}

/* Panel */
.faq-item__panel {
	padding: 0 76px 20px 22px;
	animation: faqOpen 0.22s ease;
}
[dir="rtl"] .faq-item__panel {
	padding: 0 22px 20px 76px;
}
.faq-item__panel p {
	margin: 0;
	font-size: 14.5px;
	line-height: 1.75;
	color: #475467;
}
@keyframes faqOpen {
	from {
		opacity: 0;
		transform: translateY(-4px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Empty state */
.faq-empty {
	max-width: 520px;
	margin: 24px auto 0;
	text-align: center;
	padding: 48px 24px;
	background: #ffffff;
	border: 2px dashed #d0d5dd;
	border-radius: 14px;
}
.faq-empty i {
	font-size: 40px;
	color: #d0d5dd;
}
.faq-empty p {
	margin: 12px 0 0;
	font-size: 14px;
	color: #6b7280;
}

/* CTA card */
.faq-cta {
	max-width: 880px;
	margin: 56px auto 0;
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 28px 30px;
	background: linear-gradient(-135deg, #101828 0%, #1f2a3d 100%);
	border-radius: 18px;
	color: #ffffff;
	flex-wrap: wrap;
	position: relative;
	overflow: hidden;
}
.faq-cta::after {
	content: "";
	position: absolute;
	inset-inline-end: -60px;
	top: -60px;
	width: 200px;
	height: 200px;
	background: radial-gradient(
		circle,
		rgba(240, 0, 42, 0.18) 0,
		transparent 70%
	);
	pointer-events: none;
}
.faq-cta__icon {
	width: 56px;
	height: 56px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(240, 0, 42, 0.18);
	color: #ff5773;
	border-radius: 14px;
	font-size: 26px;
	flex-shrink: 0;
	z-index: 1;
}
.faq-cta__body {
	flex: 1 1 auto;
	min-width: 220px;
	z-index: 1;
}
.faq-cta__title {
	font-size: 18px;
	font-weight: 700;
	color: #ffffff;
	margin: 0 0 4px;
	letter-spacing: -0.01em;
}
.faq-cta__sub {
	font-size: 13.5px;
	color: #d0d5dd;
	margin: 0;
	line-height: 1.55;
}
.faq-cta__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 22px;
	background: #f0002a;
	color: #ffffff !important;
	border-radius: 12px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease, transform 0.15s ease;
	z-index: 1;
}
.faq-cta__btn:hover {
	background: #d10024;
	transform: translateY(-1px);
	color: #ffffff !important;
}
[dir="rtl"] .faq-cta__btn i {
	transform: scaleX(-1);
}

@media (max-width: 575px) {
	.faq-page {
		padding: 40px 0 64px;
	}
	.faq-cats {
		justify-content: flex-start;
		overflow-x: auto;
		flex-wrap: nowrap;
		margin-inline: -16px;
		padding-inline: 16px;
		scrollbar-width: none;
	}
	.faq-cats::-webkit-scrollbar {
		display: none;
	}
	.faq-cat {
		flex-shrink: 0;
	}
	.faq-item__btn {
		padding: 14px 16px;
		gap: 10px;
	}
	.faq-item__icon {
		width: 34px;
		height: 34px;
		font-size: 17px;
	}
	.faq-item__q {
		font-size: 14.5px;
	}
	.faq-item__panel {
		padding: 0 60px 16px 16px;
	}
	[dir="rtl"] .faq-item__panel {
		padding: 0 16px 16px 60px;
	}
	.faq-cta {
		padding: 22px 20px;
		flex-direction: column;
		text-align: center;
	}
	.faq-cta__btn {
		width: 100%;
		justify-content: center;
	}
}

/* Legacy classes — kept for any historic markup that still uses them. */
/*
FAQ Area CSS (legacy — superseded by .faq-page above)
=====================================================*/
.accordion-list .accordion__item {
	border-radius: 5px;
	border: none;
	max-width: 1095px;
	margin: auto;
	margin-bottom: 30px;
}
.accordion-list .accordion__item:last-child {
	margin-bottom: 0;
}
.accordion-list .accordion__item .accordion__button {
	border: 1px solid #f5f5f5;
	border-radius: 5px;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: normal;
	padding: 25px 40px;
}
.accordion-list .accordion__item .accordion__button::before {
	float: left;
	margin-left: 0;
	margin-top: 4px;
	margin-right: 10px;
}
.accordion-list .accordion-item .accordion__panel {
	border: none;
	border-top: none;
	border-radius: 0 0 5px 5px;
	background-color: #ffffff;
	padding: 30px;
	padding-bottom: 0;
}

.accordion-item:first-of-type .accordion-button {
	border-radius: 5px;
}

.accordion-item:last-of-type .accordion-button.collapsed {
	border-radius: 5px;
}

/* 
Main Contact Area Style
=====================================================*/
.contact-area {
	overflow: hidden;
}

.contact-info-wrap .border-shape {
	padding-top: 70px;
}

.single-contact-nfo {
	text-align: center;
	margin-bottom: 30px;
}

.single-contact-nfo img {
	margin-bottom: 50px;
}

.single-contact-nfo h3 {
	margin-bottom: 25px;
	font-size: 25px;
}

.single-contact-nfo a {
	display: block;
	margin-bottom: 5px;
}

.single-contact-nfo a:last-child {
	margin-bottom: 0;
}

.contact-form {
	max-width: 860px;
	margin: auto;
	position: relative;
}

.contact-form h2 {
	font-size: 25px;
	margin-bottom: 30px;
	letter-spacing: -0.01em;
}

.contact-form .form-group {
	margin-bottom: 30px;
}

.contact-form .form-group .form-control {
	background: #f5f5f5;
	border: 1px solid #ebebeb;
}

.contact-form .form-group .form-control:focus {
	border-color: #f0002a;
}

.contact-form .form-group .form-control::-webkit-input-placeholder {
	font-size: 14px;
	color: #ababab;
}

.contact-form .form-group .form-control:-ms-input-placeholder {
	font-size: 14px;
	color: #ababab;
}

.contact-form .form-group .form-control::-ms-input-placeholder {
	font-size: 14px;
	color: #ababab;
}

.contact-form .form-group .form-control::placeholder {
	font-size: 14px;
	color: #ababab;
}

.contact-form .form-check {
	padding-right: 12px;
	font-size: 14px;
	font-weight: 400;
}

.contact-form .form-check label {
	margin-bottom: 0;
	margin-top: 2px;
}

.contact-form .form-check .form-check .form-check-input:focus {
	-webkit-box-shadow: none;
	box-shadow: none;
}

.contact-form .form-check .form-check .form-check-input:checked {
	background-color: #f0002a;
	border-color: #f0002a;
}

.contact-form .default-btn {
	width: 100%;
}

.contact-form .shape {
	position: absolute;
}

.contact-form .shape.shape-1 {
	top: -200px;
	right: 70px;
}

.contact-form .shape.shape-2 {
	bottom: 100px;
	right: -300px;
}

.contact-form .shape.shape-3 {
	top: -100px;
	left: -300px;
}

.list-unstyled {
	color: #dc3545;
	margin-top: 10px;
	font-size: 14px;
}

.hidden {
	display: none;
}

#msgSubmit {
	margin-top: 30px;
	font-size: 20px;
}

/* 
Authentication Area Style
=====================================================*/
.authentication-content {
	max-width: 532px;
	margin: auto;
	background-color: #ffffff;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	border-radius: 10px;
	padding: 40px;
}

/* "Don't have an account? Sign up" / "Already a member? Sign in" line at
   the bottom of each auth card. Small, muted, with a single accent link. */
.auth-alt-cta {
	margin: 22px 0 0;
	text-align: center;
	font-size: 14px;
	color: #6b7280;
}
.auth-alt-cta__link {
	color: #f0002a;
	font-weight: 600;
	text-decoration: none;
	margin-inline-start: 4px;
	transition: color 0.15s ease;
}
.auth-alt-cta__link:hover {
	color: #c1001f;
	text-decoration: underline;
}

.authentication-content h3 {
	font-size: 30px;
	text-align: center;
	margin-bottom: 30px;
}

.authentication-content .nav-tabs {
	text-align: center;
	margin-bottom: 40px;
	padding-top: 40px;
	padding-bottom: 40px;
	border-bottom: 2px solid #e1e1e1;
}

.authentication-content .nav-tabs .nav-item {
	width: 50%;
	display: block;
}

.authentication-content .nav-tabs .nav-item .nav-link {
	border: none;
	padding: 0 30px;
	font-weight: 500;
	font-size: 20px;
	position: relative;
	display: block;
	width: 100%;
	color: #0c0b0b;
}

.authentication-content .nav-tabs .nav-item .nav-link::before {
	content: "";
	position: absolute;
	bottom: -41px;
	right: 0;
	width: 100%;
	height: 2px;
	background-color: #f0002a;
	opacity: 0;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.authentication-content .nav-tabs .nav-item .nav-link.active {
	border: none;
	background-color: transparent;
}

.authentication-content .nav-tabs .nav-item .nav-link.active::before {
	opacity: 1;
}

.authentication-content .authentication .form-group {
	margin-bottom: 15px;
}

.authentication-content .authentication .form-group .form-control {
	border-color: #ebebeb;
	background-color: #f6f6f6;
	height: 60px;
}

.authentication-content
	.authentication
	.form-group
	.form-control::-webkit-input-placeholder {
	color: #ababab;
	font-size: 14px;
}

.authentication-content
	.authentication
	.form-group
	.form-control:-ms-input-placeholder {
	color: #ababab;
	font-size: 14px;
}

.authentication-content
	.authentication
	.form-group
	.form-control::-ms-input-placeholder {
	color: #ababab;
	font-size: 14px;
}

.authentication-content .authentication .form-group .form-control::placeholder {
	color: #ababab;
	font-size: 14px;
}

.authentication-content .authentication .form-group .default-btn {
	width: 318px;
	margin: auto;
	display: block;
}

.authentication-content .authentication .forget {
	color: #0c0b0b;
	font-size: 14px;
}

.authentication-content .authentication .form-check-label {
	font-size: 14px;
}

/* 
Blog Details Area Style
=====================================================*/
.blog-details-content {
	max-width: 872px;
	margin: auto;
}
.blog-details-content-box h1,
.blog-details-content-box h2,
.blog-details-content-box h3,
.blog-details-content-box h4,
.blog-details-content-box h5,
.blog-details-content-box h6 {
	margin-bottom: 15px;
}
.blog-details-content-box h1 {
	font-size: 34px;
}
.blog-details-content-box h2 {
	font-size: 32px;
}
.blog-details-content-box h3 {
	font-size: 30px;
}
.blog-details-content-box h4 {
	font-size: 28px;
}
.blog-details-content-box h5 {
	font-size: 26px;
}
.blog-details-content-box h6 {
	font-size: 22px;
}
.blog-details-content-box ul li {
	line-height: 28px;
	margin-bottom: 10px;
}
.blog-details-content-box ol li {
	line-height: 28px;
	margin-bottom: 10px;
}

.blog-details-content-box img {
	margin-bottom: 20px;
}
.blog-details-content-box .title {
	font-size: 40px;
	margin-bottom: 20px;
	line-height: 60px;
}

.blog-details-content .tag-list {
	padding-right: 0;
	margin-bottom: 30px;
	list-style: none;
	margin-right: 20px;
}

.blog-details-content .tag-list li {
	display: inline-block;
	margin-left: 10px;
}

.blog-details-content .tag-list li:last-child {
	margin-left: 0;
}

.blog-details-content .tag-list li a {
	background-color: #f0f0f0;
	display: inline-block;
	padding: 10px 20px;
	font-size: 13px;
	border-radius: 5px;
}

.blog-details-content .blog-poster {
	padding-right: 0;
	margin-bottom: 30px;
	list-style-type: none;
}

.blog-details-content .blog-poster li {
	display: inline-block;
	margin-left: 40px;
	font-size: 14px;
	position: relative;
	z-index: 1;
}

.blog-details-content .blog-poster li::before {
	content: "";
	position: absolute;
	top: 7px;
	right: -22px;
	width: 6px;
	height: 6px;
	background-color: #f0002a;
	border-radius: 50px;
}

.blog-details-content .blog-poster li:first-child::before {
	display: none;
}

.blog-details-content .blog-poster li:last-child {
	margin-left: 0;
}

.blog-details-content .blog-poster li a {
	color: #0c0b0b;
	font-weight: 600;
}

.blog-details-content .blog-poster li a:hover {
	color: #f0002a;
}

.blog-details-content .blog-poster li a img {
	margin-left: 5px;
}

.blog-details-content .blog-post-img {
	margin-bottom: 30px;
}

.blog-details-content p a {
	color: #0071dc;
	font-weight: 600;
}

.blog-details-content p .color-change {
	color: #f0002a;
}

.blog-details-content blockquote {
	margin-top: 30px;
	margin-bottom: 30px;
}

.blog-details-content blockquote p {
	color: #2f2f2f;
	border-right: 2px solid #0071dc;
	padding: 30px;
	font-size: 20px;
	position: relative;
	padding-right: 70px;
}

.blog-details-content blockquote p i {
	color: #f0002a;
	position: absolute;
	top: 30px;
	right: 50px;
}

.blog-details-content h3 {
	margin-bottom: 10px;
	font-size: 30px;
}

.blog-details-content .video-wrapper {
	margin-top: 30px;
	margin-bottom: 30px;
}

.blog-details-content .social-link {
	padding-right: 0;
	margin-bottom: 0;
	list-style-type: none;
	border-top: 1px solid #eaeaea;
	border-bottom: 1px solid #eaeaea;
	text-align: center;
	padding-top: 30px;
	padding-bottom: 30px;
	margin-top: 30px;
	margin-bottom: 30px;
}

.blog-details-content .social-link li {
	display: inline-block;
	margin-left: 10px;
}

.blog-details-content .social-link li:last-child {
	margin-left: 0;
}

.blog-details-content .social-link li span {
	color: #0c0b0b;
	font-weight: 600;
	font-size: 18px;
}

.blog-details-content .social-link li a {
	width: 35px;
	height: 35px;
	line-height: 35px;
	text-align: center;
	display: inline-block;
	background-color: #582949;
	color: #ffffff;
	border-radius: 50%;
}

.blog-details-content .social-link li a:hover {
	background-color: #f0002a;
}

.blog-details-content .autor-details {
	border-bottom: 1px solid #eaeaea;
	padding-bottom: 50px;
	margin-bottom: 50px;
}

.blog-details-content .autor-details ul {
	padding-right: 0;
	margin-bottom: 20px;
	list-style: none;
}

.blog-details-content .autor-details ul li {
	display: inline-block;
}

.blog-details-content .autor-details ul li .binter {
	display: block;
	position: relative;
	padding-right: 70px;
}

.blog-details-content .autor-details ul li .binter img {
	border-radius: 50%;
	position: absolute;
	top: 0;
	right: 0;
	max-width: 58px;
}

.blog-details-content .autor-details ul li .binter h4 {
	font-size: 20px;
	color: #f0002a;
}

.blog-details-content .autor-details ul li .binter span {
	font-size: 14px;
}

.blog-details-content .autor-details a.read {
	color: #f0002a;
}

.blog-details-content .comments-wrap {
	margin-bottom: 50px;
}

.blog-details-content .comments-wrap h3 {
	font-size: 20px;
	margin-bottom: 30px;
}

.blog-details-content .comments-wrap ul {
	padding-right: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.blog-details-content .comments-wrap ul li {
	position: relative;
	padding-right: 100px;
	margin-bottom: 30px;
}

.blog-details-content .comments-wrap ul li:last-child {
	margin-bottom: 0;
}

.blog-details-content .comments-wrap ul li .read-more {
	position: absolute;
	top: 0;
	left: 0;
}

.blog-details-content .comments-wrap ul li h4 {
	font-size: 18px;
}

.blog-details-content .comments-wrap ul li h4 span {
	color: #848484;
	font-size: 16px;
	font-weight: 500;
}

.blog-details-content .comments-wrap ul li img {
	position: absolute;
	top: 0;
	right: 0;
	border-radius: 16px;
}

.blog-details-content .comments-wrap ul li p {
	margin-top: 10px;
}

.blog-details-content .leave-replay h3 {
	font-size: 20px;
	margin-bottom: 30px;
}

.blog-details-content .leave-replay .form-group {
	margin-bottom: 20px;
}

.blog-details-content .leave-replay .form-group .form-control {
	background-color: #f5f5f5;
	border: 1px solid #ebebeb;
}

/* 
Listing Details Area Style
=====================================================*/
.listing-details-box {
	margin-bottom: 30px;
}
.listing-details-box h1,
.listing-details-box h2,
.listing-details-box h3,
.listing-details-box h4,
.listing-details-box h5,
.listing-details-box h6 {
	margin-bottom: 15px;
}
.listing-details-box h1 {
	font-size: 25px;
}
.listing-details-box h2 {
	font-size: 24px;
}
.listing-details-box h3 {
	font-size: 23px;
}
.listing-details-box h4 {
	font-size: 22px;
}
.listing-details-box h5 {
	font-size: 21px;
}
.listing-details-box h6 {
	font-size: 20px;
}
.listing-details-box ul,
.listing-details-box ol {
	margin-bottom: 20px;
}
.listing-details-box li {
	line-height: 1.6;
	margin-bottom: 5px;
}
.listing-details-box li:last-child {
	margin-bottom: 0;
}

.listing-details-content .list-detail {
	padding-right: 0;
	margin-bottom: 30px;
	list-style-type: none;
}

.listing-details-content .list-detail li .info {
	padding-right: 0;
	list-style: none;
}

.listing-details-content .list-detail li .info li {
	display: inline-block;
	margin-left: 30px;
}

.listing-details-content .list-detail li .info li img {
	position: relative;
	top: -3px;
	margin-left: 5px;
}

.listing-details-content .list-detail li .review {
	padding-right: 0;
	margin-bottom: 0;
}

.listing-details-content .list-detail li .review li {
	display: inline-block;
	margin-left: 2px;
}

.listing-details-content .list-detail li .review li:last-child {
	margin-left: 0;
}

.listing-details-content .list-detail li .review li i {
	color: #ffb800;
}

.listing-details-content .list-detail li h3 {
	font-size: 30px;
	margin-bottom: 20px;
}

.listing-details-content .list-detail li.review-wraps h3 {
	color: #582949;
}

.listing-details-content .listing-details-slide {
	margin-bottom: 30px;
}

.listing-details-content .tag-sheare {
	margin-bottom: 30px;
}

.listing-details-content .tag-sheare .tags-list {
	padding-right: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.listing-details-content .tag-sheare .tags-list li {
	display: inline-block;
	margin-left: 5px;
}

.listing-details-content .tag-sheare .tags-list li:last-child {
	margin-left: 0;
}

.listing-details-content .tag-sheare .tags-list li a {
	font-size: 14px;
	background-color: #f0f0f0;
	display: inline-block;
	padding: 10px 20px;
	border-radius: 5px;
}

.listing-details-content .tag-sheare .share-save {
	padding-right: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.listing-details-content .tag-sheare .share-save li {
	display: inline-block;
}

.listing-details-content .tag-sheare .share-save li.save-list {
	margin-right: 15px;
	cursor: pointer;
	color: #582949;
}

.listing-details-content .tag-sheare .share-save li.save-list i {
	position: relative;
	top: 6px;
	color: #f0002a;
	font-size: 22px;
}
.listing-details-content .tag-sheare .share-save li.save-list .wish-btn {
	background-color: #fff;
}

.listing-details-content .tag-sheare .share-save .share-link {
	display: inline-block;
	position: relative;
}

.listing-details-content .tag-sheare .share-save .share-link span {
	position: relative;
	cursor: pointer;
	color: #582949;
}

.listing-details-content .tag-sheare .share-save .share-link span img {
	top: 4px;
}

.listing-details-content .tag-sheare .share-save .share-link span .icon {
	width: 30px;
	height: 30px;
	line-height: 30px;
	border-radius: 50%;
	text-align: center;
	font-size: 18px;
	margin-left: 10px;
	color: #f0002a;
	position: relative;
	top: 5px;
}

.listing-details-content .tag-sheare .share-save .share-link .social-icon {
	padding: 0;
	margin: 0;
	list-style-type: none;
	background-color: #ffffff;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	padding: 10px;
	border-radius: 5px;
	position: absolute;
	top: 60px;
	right: 0;
	left: 0;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	opacity: 0;
	text-align: center;
}

.listing-details-content .tag-sheare .share-save .share-link .social-icon li {
	display: inline-block;
	margin-bottom: 5px;
}

.listing-details-content
	.tag-sheare
	.share-save
	.share-link
	.social-icon
	li:last-child {
	margin-bottom: 0;
}

.listing-details-content .tag-sheare .share-save .share-link .social-icon li a {
	padding: 0 5px;
}

.listing-details-content
	.tag-sheare
	.share-save
	.share-link
	.social-icon
	li
	a
	i {
	font-size: 18px;
}

.listing-details-content
	.tag-sheare
	.share-save
	.share-link:hover
	.social-icon {
	top: 46px;
	opacity: 1;
}

.listing-details-content .video-wrapper {
	margin-top: 30px;
	margin-bottom: 30px;
}

.listing-details-content .features-content {
	margin-bottom: 50px;
}

.listing-details-content .features-content h3 {
	font-size: 25px;
	margin-bottom: 20px;
}

.listing-details-content .features-content ul li {
	margin-bottom: 5px;
	line-height: 1.6;
}

.listing-details-content .features-content ul li:last-child {
	margin-bottom: 0;
}

.listing-details-content .location-content {
	margin-bottom: 50px;
}

.listing-details-content .location-content h3 {
	font-size: 25px;
	margin-bottom: 20px;
}

.listing-details-content .location-content iframe {
	width: 100%;
	height: 500px;
	border-radius: 17px;
}

.listing-details-content .review-wrap {
	margin-bottom: 50px;
}

.listing-details-content .review-wrap h3 {
	font-size: 25px;
	margin-bottom: 30px;
}

.listing-details-content .review-wrap h3 span {
	font-size: 20px;
	color: #848484;
}

.listing-details-content .review-wrap .review-wrap-inner {
	padding-right: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.listing-details-content .review-wrap .review-wrap-inner .single-review-item {
	position: relative;
	padding-right: 100px;
	margin-bottom: 40px;
}

.listing-details-content
	.review-wrap
	.review-wrap-inner
	.single-review-item:last-child {
	margin-bottom: 0;
}

.listing-details-content
	.review-wrap
	.review-wrap-inner
	.single-review-item
	.review {
	position: absolute;
	top: 0;
	left: 0;
	padding-right: 0;
	list-style-type: none;
	margin-bottom: 0;
	background-color: transparent;
}

.listing-details-content
	.review-wrap
	.review-wrap-inner
	.single-review-item
	.review
	li {
	display: inline-block;
}

.listing-details-content
	.review-wrap
	.review-wrap-inner
	.single-review-item
	.review
	i {
	color: #ffb800;
}

.listing-details-content
	.review-wrap
	.review-wrap-inner
	.single-review-item
	h4 {
	font-size: 16px;
	font-weight: 600;
}

.listing-details-content
	.review-wrap
	.review-wrap-inner
	.single-review-item
	h4
	span {
	color: #848484;
	font-size: 14px;
	font-weight: 400;
	margin-right: 10px;
}

.listing-details-content
	.review-wrap
	.review-wrap-inner
	.single-review-item
	img {
	position: absolute;
	top: 0;
	right: 0;
	border-radius: 16px;
}

.listing-details-content .review-wrap .review-wrap-inner .single-review-item p {
	margin-top: 10px;
}

.listing-details-content .leave-replay {
	border-bottom: 1px solid #f5f5f5;
	padding-bottom: 100px;
}

.listing-details-content .leave-replay h3 {
	font-size: 25px;
	margin-bottom: 30px;
}

.listing-details-content .leave-replay ul {
	padding-right: 0;
	margin-bottom: 0;
	list-style-type: none;
}

.listing-details-content .leave-replay ul li {
	display: inline-block;
}

.listing-details-content .leave-replay ul li span {
	color: #582949;
	margin-left: 10px;
}

.listing-details-content .leave-replay ul li i {
	color: #ffb800;
	font-size: 20px;
	position: relative;
	top: 3px;
}

.listing-details-content .leave-replay .form-group {
	margin-bottom: 24px;
}

.listing-details-content .leave-replay .form-group .form-control {
	background-color: #f5f5f5;
	border: 1px solid #ebebeb;
}

.right-sidebar {
	margin-right: 30px;
}

.right-sidebar .bg-right-sidebar {
	background-color: #f5f5f5;
	padding: 30px;
	border-radius: 5px;
	margin-bottom: 30px;
}

.right-sidebar .bg-right-sidebar:last-child {
	margin-bottom: 0;
}

.right-sidebar .bg-right-sidebar h3 {
	font-size: 20px;
	margin-bottom: 30px;
}

.right-sidebar .bg-right-sidebar .information-img {
	margin-bottom: 30px;
	padding-bottom: 30px;
	border-bottom: 1px solid #e4e4e4;
}

.right-sidebar .bg-right-sidebar .information-img h4 {
	font-size: 16px;
	margin-bottom: 5px;
}
.right-sidebar .bg-right-sidebar .information-img p {
	font-size: 14px;
}
.right-sidebar .bg-right-sidebar .info {
	padding-right: 0;
	margin-bottom: 30px;
	list-style-type: none;
}

.right-sidebar .bg-right-sidebar .info li {
	position: relative;
	padding-right: 25px;
	margin-bottom: 15px;
	color: #646464;
}

.right-sidebar .bg-right-sidebar .info li:last-child {
	margin-bottom: 0;
}

.right-sidebar .bg-right-sidebar .info li i {
	position: absolute;
	top: -5px;
	right: 0;
	font-size: 20px;
	color: #582949;
}

.right-sidebar .bg-right-sidebar .info li span {
	color: #f0002a;
}

.right-sidebar .bg-right-sidebar .contact-btn {
	padding-right: 0;
	margin-bottom: 0;
	list-style: none;
}

.right-sidebar .bg-right-sidebar .contact-btn li {
	margin-bottom: 15px;
}

.right-sidebar .bg-right-sidebar .contact-btn li:last-child {
	margin-bottom: 0;
}

.right-sidebar .bg-right-sidebar .contact-btn li .default-btn {
	width: 100%;
	background-color: #5146aa;
	border-color: #5146aa;
	cursor: pointer;
}

.right-sidebar .bg-right-sidebar .contact-btn li .default-btn i {
	position: unset;
	color: #ffffff;
	position: relative;
	top: 2px;
}

.right-sidebar .bg-right-sidebar .contact-btn li .default-btn span {
	color: #ffffff;
}

.right-sidebar .bg-right-sidebar .contact-btn li .default-btn.active {
	border-color: #f0002a;
	background-color: transparent;
}

.right-sidebar .bg-right-sidebar .contact-btn li .default-btn.active span {
	color: #f0002a;
}

.right-sidebar .bg-right-sidebar .contact-btn li .default-btn.active i {
	color: #f0002a;
}

.right-sidebar .bg-right-sidebar .contact-btn li .default-btn.active:hover {
	background-color: #f0002a;
}

.right-sidebar
	.bg-right-sidebar
	.contact-btn
	li
	.default-btn.active:hover
	span {
	color: #ffffff;
}

.right-sidebar .bg-right-sidebar .contact-btn li .default-btn.active:hover img {
	-webkit-filter: brightness(10);
	filter: brightness(10);
}

.right-sidebar .bg-right-sidebar .contact-btn li .default-btn.active:hover i {
	color: #ffffff;
}

.right-sidebar .bg-right-sidebar .contact-form .form-group {
	margin-bottom: 20px;
}

.right-sidebar .bg-right-sidebar .contact-form .form-group .form-control {
	background-color: #ffffff;
	border-color: #ebebeb;
}

.right-sidebar .bg-right-sidebar .contact-form .form-group .form-control:focus {
	border-color: #f0002a;
}

.right-sidebar .bg-right-sidebar .attachment-btn {
	padding-right: 0;
	margin-bottom: 0;
}

.right-sidebar .bg-right-sidebar .attachment-btn li {
	display: block;
	margin-bottom: 20px;
}

.right-sidebar .bg-right-sidebar .attachment-btn li:last-child {
	margin-bottom: 0;
}

.right-sidebar .bg-right-sidebar .attachment-btn li button {
	position: relative;
	background-color: #ffffff;
	padding: 30px;
	display: block;
	width: 100%;
	text-align: right;
	padding-right: 80px;
	border-radius: 5px;
	border: 1px solid #ebebeb;
}

.right-sidebar .bg-right-sidebar .attachment-btn li button img {
	position: absolute;
	top: 20px;
	right: 30px;
}

/*
Submit Property Area Style
=====================================================*/
.submit-property-form {
	max-width: 1200px;
	padding: 30px;
	background-color: #ffffff;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	border-radius: 5px;
	margin: auto;
}

.submit-property-form .form-group {
	margin-bottom: 20px;
}

.submit-property-form .form-group label {
	margin-bottom: 10px;
	color: #656565;
	font-weight: 600;
	font-size: 15px;
}

.submit-property-form .form-group .form-control {
	background-color: #f6f6f6;
	border-color: #ebebeb;
}

.submit-property-form .form-group .form-select {
	color: #848484;
}

.submit-property-form .default-btn {
	width: 100%;
}

.submit-property-form .file-upload {
	position: relative;
	border: 1px solid #d7d7d7;
	border-radius: 5px;
}

.submit-property-form .file-upload .inputfile {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

.submit-property-form .file-upload label {
	display: block;
}

.submit-property-form .file-upload .inputfile + label {
	color: #0c0b0b;
	background-color: #ffffff;
	margin-bottom: 0;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	padding: 14px 20px;
	position: relative;
	height: 55px;
	text-align: center;
	font-size: 16px;
}

.submit-property-form .file-upload i {
	position: relative;
	top: 2px;
	margin-left: 5px;
}

.submit-property-form .file-upload .inputfile:focus + label,
.submit-property-form .file-upload .inputfile + label:hover {
	background-color: #f0002a;
	color: #ffffff;
}

.submit-property-form .file-upload .inputfile + label {
	cursor: pointer;
}

/* 
Main Content Text Style
=====================================================*/
.main-content-text h1,
.main-content-text h2,
.main-content-text h3,
.main-content-text h4,
.main-content-text h5,
.main-content-text h6 {
	margin-bottom: 15px;
}

.main-content-text h1 {
	font-size: 30px;
}

.main-content-text h2 {
	font-size: 26px;
}

.main-content-text h3 {
	font-size: 22px;
}

.main-content-text h4 {
	font-size: 22px;
}

.main-content-text h5 {
	font-size: 20px;
}

.main-content-text h6 {
	font-size: 18px;
}

.main-content-text .gap-20 {
	margin-bottom: 30px;
}

.main-content-text p {
	font-size: 15px;
}

.main-content-text ul {
	padding: 0;
	list-style-type: none;
	margin-bottom: 0;
}

.main-content-text ul li {
	position: relative;
	margin-bottom: 10px;
	padding-right: 35px;
}

.main-content-text ul li:last-child {
	margin-bottom: 0;
}

.main-content-text ul li i {
	position: absolute;
	top: -6px;
	right: 0;
	color: #f0002a;
	font-size: 25px;
}

.main-content-text ol {
	padding-right: 18px;
}

.main-content-text ol li {
	margin-bottom: 10px;
}

.main-content-text ol li::marker {
	color: #f0002a;
}

.main-content-text ol li:last-child {
	margin-bottom: 0;
}

.main-content-text a {
	color: #f0002a;
}

.main-content-text a:hover {
	text-decoration: underline;
}

.main-content-text .content-gap-mb-20 {
	margin-bottom: 20px;
}

.main-content-text .content-gap-mb-30 {
	margin-bottom: 30px;
}

/*
Error Area CSS
=====================================================*/
.error-content {
	text-align: center;
	position: relative;
}

.error-content .default-btn {
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	margin: auto;
	max-width: 200px;
}

/*
Coming Soon Area Style
=====================================================*/
.coming-soon-area {
	height: 100vh;
}

.coming-soon-content {
	max-width: 700px;
	border-radius: 5px;
	overflow: hidden;
	text-align: center;
	padding: 60px;
	background-color: #ffffff;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	margin: auto;
}

.coming-soon-content .logo {
	margin-bottom: 30px;
	display: inline-block;
}

.coming-soon-content h2 {
	font-size: 46px;
	margin-top: -10px;
	margin-bottom: 0;
	letter-spacing: -0.01em;
}

.coming-soon-content #timer {
	margin-top: 40px;
}

.coming-soon-content #timer div {
	border: 4px solid #f0002a;
	color: #f0002a;
	width: 100px;
	height: 105px;
	border-radius: 5px;
	font-size: 40px;
	font-weight: 800;
	margin-right: 10px;
	margin-left: 10px;
}

.coming-soon-content #timer div span {
	display: block;
	margin-top: -2px;
	font-size: 17px;
	font-weight: 600;
}

.coming-soon-content form {
	position: relative;
	max-width: 500px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 50px;
}

.coming-soon-content form .form-group {
	margin-bottom: 25px;
	width: 100%;
	position: relative;
}

.coming-soon-content form .form-group .label-title {
	margin-bottom: 0;
	position: absolute;
	display: block;
	right: 0;
	top: 0;
	pointer-events: none;
	width: 100%;
	height: 100%;
	color: #0c0b0b;
}

.coming-soon-content form .form-group .label-title i {
	position: absolute;
	right: 0;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	top: 9px;
	font-size: 22px;
}

.coming-soon-content form .form-group .label-title::before {
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 0;
	height: 2px;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	background: #f0002a;
}

.coming-soon-content form .form-group .input-newsletter {
	border-radius: 0;
	border: 1px solid #eeeeee;
	padding: 10px 20px;
	color: #0c0b0b;
	height: 50px;
	display: block;
	width: 100%;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	font-size: 16px;
	font-weight: 400;
	background-color: #ffffff;
}

.coming-soon-content
	form
	.form-group
	.input-newsletter::-webkit-input-placeholder {
	color: #848484;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.coming-soon-content form .form-group .input-newsletter:-ms-input-placeholder {
	color: #848484;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.coming-soon-content form .form-group .input-newsletter::-ms-input-placeholder {
	color: #848484;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.coming-soon-content form .form-group .input-newsletter::placeholder {
	color: #848484;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.coming-soon-content form .form-group .input-newsletter:focus {
	border-color: #f0002a;
	outline: 0 !important;
}

.coming-soon-content
	form
	.form-group
	.input-newsletter:focus::-webkit-input-placeholder {
	color: transparent;
}

.coming-soon-content
	form
	.form-group
	.input-newsletter:focus:-ms-input-placeholder {
	color: transparent;
}

.coming-soon-content
	form
	.form-group
	.input-newsletter:focus::-ms-input-placeholder {
	color: transparent;
}

.coming-soon-content form .form-group .input-newsletter:focus::placeholder {
	color: transparent;
}

.coming-soon-content form .validation-danger {
	margin-top: 15px;
	color: #ff0000;
}

.coming-soon-content form .validation-success {
	margin-top: 15px;
}

.coming-soon-content form p {
	margin-bottom: 0;
	margin-top: 20px;
}

.coming-soon-content .newsletter-form .default-btn {
	margin-top: 0;
	height: 49px;
	position: absolute;
	top: 0;
	left: 0;
	line-height: 11px;
}

/*====================================================
OTHERS STYLE AREA
=====================================================*/
/*
Preloader Area Style*/
.preloader {
	width: 100%;
	height: 100%;
	position: fixed;
	background-color: #ffffff;
	top: 0;
	right: 0;
	z-index: 99999;
}

.preloader .lds-ripple {
	position: absolute;
	width: 80px;
	height: 80px;
	-webkit-animation: spin-six 2.5s infinite
		cubic-bezier(0.17, 0.72, 0.55, 1.66);
	animation: spin-six 2.5s infinite cubic-bezier(0.17, 0.72, 0.55, 1.66);
	right: 50%;
	top: 50%;
	-webkit-transform: translate(40px, -50px);
	transform: translate(40px, -50px);
}

.preloader .preloader-container {
	width: 80px;
	height: 80px;
}

.preloader .petal {
	position: absolute;
	width: 30%;
	height: 50%;
	bottom: 50%;
	right: 50%;
	-webkit-transform-origin: bottom center;
	transform-origin: bottom center;
	border-radius: 50%;
	z-index: 2;
}

.preloader .petal::before {
	position: absolute;
	content: "";
	width: 100%;
	height: 100%;
	bottom: 0%;
	right: 0%;
	-webkit-transform-origin: bottom center;
	transform-origin: bottom center;
	border-radius: 50%;
	background-color: #f0002a;
	z-index: 2;
	-webkit-animation: opacity-nine 0.8s infinite linear;
	animation: opacity-nine 0.8s infinite linear;
	opacity: 1;
	border-right: 1px solid #ffffff;
}

.preloader .petal:nth-of-type(6) {
	-webkit-transform: translate(50%, 0%) rotate(-225deg);
	transform: translate(50%, 0%) rotate(-225deg);
}

.preloader .petal:nth-of-type(6)::before {
	background-color: transparent;
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
}

.preloader .petal:nth-of-type(7) {
	-webkit-transform: translate(50%, 0%) rotate(-270deg);
	transform: translate(50%, 0%) rotate(-270deg);
}

.preloader .petal:nth-of-type(7)::before {
	background-color: transparent;
	-webkit-animation-delay: 0.6s;
	animation-delay: 0.6s;
}

.preloader .petal:nth-of-type(8) {
	-webkit-transform: translate(50%, 0%) rotate(-315deg);
	transform: translate(50%, 0%) rotate(-315deg);
}

.preloader .petal:nth-of-type(8)::before {
	background-color: transparent;
	-webkit-animation-delay: 0.7s;
	animation-delay: 0.7s;
}

.preloader .petal:nth-of-type(1) {
	-webkit-transform: translate(50%, 0%);
	transform: translate(50%, 0%);
}

.preloader .petal:nth-of-type(1)::before {
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}

.preloader .petal:nth-of-type(2) {
	-webkit-transform: translate(50%, 0%) rotate(-45deg);
	transform: translate(50%, 0%) rotate(-45deg);
}

.preloader .petal:nth-of-type(2)::before {
	-webkit-animation-delay: 0.1s;
	animation-delay: 0.1s;
}

.preloader .petal:nth-of-type(3) {
	-webkit-transform: translate(50%, 0%) rotate(-90deg);
	transform: translate(50%, 0%) rotate(-90deg);
}

.preloader .petal:nth-of-type(3)::before {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}

.preloader .petal:nth-of-type(4) {
	-webkit-transform: translate(50%, 0%) rotate(-135deg);
	transform: translate(50%, 0%) rotate(-135deg);
}

.preloader .petal:nth-of-type(4)::before {
	-webkit-animation-delay: 0.3s;
	animation-delay: 0.3s;
}

.preloader .petal:nth-of-type(5) {
	-webkit-transform: translate(50%, 0%) rotate(-180deg);
	transform: translate(50%, 0%) rotate(-180deg);
}

.preloader .petal:nth-of-type(5)::before {
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;
}

.preloader .petal-1 {
	position: absolute;
	width: 30%;
	height: 50%;
	bottom: 50%;
	right: 50%;
	-webkit-transform-origin: bottom center;
	transform-origin: bottom center;
	border-radius: 50%;
	z-index: -1;
}

.preloader .petal-1::before {
	position: absolute;
	content: "";
	width: 100%;
	height: 100%;
	bottom: 0%;
	right: 0%;
	-webkit-transform-origin: bottom center;
	transform-origin: bottom center;
	border-radius: 50%;
	background-color: #f0002a;
	z-index: 2;
	-webkit-animation: opacity-nine 0.8s infinite linear;
	animation: opacity-nine 0.8s infinite linear;
	opacity: 1;
}

.preloader .petal-1:nth-of-type(9) {
	-webkit-transform: translate(50%, 0%) rotate(-225deg);
	transform: translate(50%, 0%) rotate(-225deg);
}

.preloader .petal-1:nth-of-type(9)::before {
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
}

.preloader .petal-1:nth-of-type(10) {
	-webkit-transform: translate(50%, 0%) rotate(-270deg);
	transform: translate(50%, 0%) rotate(-270deg);
}

.preloader .petal-1:nth-of-type(10)::before {
	-webkit-animation-delay: 0.6s;
	animation-delay: 0.6s;
}

.preloader .petal-1:nth-of-type(11) {
	-webkit-transform: translate(50%, 0%) rotate(-315deg);
	transform: translate(50%, 0%) rotate(-315deg);
}

.preloader .petal-1:nth-of-type(11)::before {
	-webkit-animation-delay: 0.7s;
	animation-delay: 0.7s;
}

.preloader .ball {
	position: absolute;
	width: 28%;
	height: 28%;
	top: 50%;
	right: 50%;
	-webkit-transform: translate(50%, -50%);
	transform: translate(50%, -50%);
	border-radius: 50%;
	border: 1px solid #ffffff;
	background-color: #f0002a;
	z-index: 3;
}

.preloader.preloader-deactivate {
	visibility: hidden;
}

@-webkit-keyframes opacity-nine {
	0% {
		opacity: 1;
	}
	95% {
		opacity: 0.2;
	}
	100% {
		opacity: 0.2;
	}
}

@keyframes opacity-nine {
	0% {
		opacity: 1;
	}
	95% {
		opacity: 0.2;
	}
	100% {
		opacity: 0.2;
	}
}

/*
Go Top Style*/
.go-top {
	position: fixed;
	cursor: pointer;
	left: 3%;
	top: 87%;
	background-color: #f0002a;
	z-index: 4;
	width: 40px;
	text-align: center;
	height: 42px;
	line-height: 42px;
	-webkit-transform: scale(0);
	transform: scale(0);
	visibility: hidden;
	-webkit-transition: 0.9s;
	transition: 0.9s;
}

.go-top i {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	right: 0;
	left: 0;
	margin: 0 auto;
	color: #ffffff;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	font-size: 20px;
}

.go-top i:last-child {
	opacity: 0;
	visibility: hidden;
	top: 60%;
}

.go-top::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	background-color: #f0002a;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: 0.5s;
	transition: 0.5s;
}

.go-top:hover {
	color: #ffffff;
	background-color: #f0002a;
}

.go-top:hover::before {
	opacity: 1;
	visibility: visible;
}

.go-top:hover i:first-child {
	opacity: 0;
	top: 0;
	visibility: hidden;
}

.go-top:hover i:last-child {
	opacity: 1;
	visibility: visible;
	top: 50%;
}

.go-top:focus {
	color: #ffffff;
}

.go-top:focus::before {
	opacity: 1;
	visibility: visible;
}

.go-top:focus i:first-child {
	opacity: 0;
	top: 0;
	visibility: hidden;
}

.go-top:focus i:last-child {
	opacity: 1;
	visibility: visible;
	top: 50%;
}

.go-top.active {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
	visibility: visible;
	left: 3%;
	top: 87%;
	-webkit-transform: scale(1);
	transform: scale(1);
}

/*
Video wave Style*/
.video-btn {
	display: inline-block;
	width: 70px;
	height: 70px;
	line-height: 70px;
	text-align: center;
	border-radius: 0;
	color: #f0002a;
	position: relative;
	top: 3px;
	z-index: 1;
	background-color: rgba(98, 189, 94, 0.8);
	border-radius: 50%;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.video-btn i {
	font-size: 42px;
	color: #ffffff;
	position: absolute;
	top: 0;
	right: 3px;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 100%;
	height: 100%;
}

.video-btn::after,
.video-btn::before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	bottom: 0;
	right: 0;
	border-radius: 0;
	border-radius: 50%;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	-webkit-animation: ripple 1.6s ease-out infinite;
	animation: ripple 1.6s ease-out infinite;
	background-color: rgba(98, 189, 94, 0.8);
}

.video-btn:hover {
	background-color: rgba(27, 27, 27, 0.8);
}

.video-btn:hover::before,
.video-btn:hover::after {
	background-color: rgba(27, 27, 27, 0.8);
}

@-webkit-keyframes ripple {
	0%,
	35% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 1;
	}
	50% {
		-webkit-transform: scale(1.5);
		transform: scale(1.5);
		opacity: 0.8;
	}
	100% {
		opacity: 0;
		-webkit-transform: scale(2);
		transform: scale(2);
	}
}

@keyframes ripple {
	0%,
	35% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 1;
	}
	50% {
		-webkit-transform: scale(1.5);
		transform: scale(1.5);
		opacity: 0.8;
	}
	100% {
		opacity: 0;
		-webkit-transform: scale(2);
		transform: scale(2);
	}
}

.video-btn-2 span {
	top: 50%;
	right: 50%;
	-webkit-transform: translate(50%, -50%);
	transform: translate(50%, -50%);
	position: absolute;
	content: "";
	display: block;
	border-radius: 50%;
	width: 90px;
	height: 90px;
}

.video-btn-2 span::after {
	top: 50%;
	right: 50%;
	-webkit-transform: translate(50%, -50%);
	transform: translate(50%, -50%);
	position: absolute;
	content: "";
	width: 100%;
	height: 100%;
	border-radius: 50%;
	border: 0.1px solid #f0002a;
	-webkit-animation: videoTwo 8s linear infinite;
	animation: videoTwo 8s linear infinite;
}

.video-btn-2 span::before {
	top: 50%;
	right: 50%;
	-webkit-transform: translate(50%, -50%);
	transform: translate(50%, -50%);
	position: absolute;
	content: "";
	width: 100%;
	height: 100%;
	border-radius: 50%;
	border: 0.1px solid #f0002a;
	-webkit-animation: videoTwo 8s linear infinite;
	animation: videoTwo 8s linear infinite;
}

.video-btn-2 span:nth-child(1)::after {
	-webkit-animation-delay: 1s;
	animation-delay: 1s;
}

.video-btn-2 span:nth-child(1)::before {
	-webkit-animation-delay: 5s;
	animation-delay: 5s;
}

.video-btn-2 span:nth-child(2)::after {
	-webkit-animation-delay: 2s;
	animation-delay: 2s;
}

.video-btn-2 span:nth-child(2)::before {
	-webkit-animation-delay: 6s;
	animation-delay: 6s;
}

.video-btn-2 span:nth-child(3)::after {
	-webkit-animation-delay: 3s;
	animation-delay: 3s;
}

.video-btn-2 span:nth-child(3)::before {
	-webkit-animation-delay: 7s;
	animation-delay: 7s;
}

.video-btn-2 span:nth-child(4)::after {
	-webkit-animation-delay: 4s;
	animation-delay: 4s;
}

.video-btn-2 i {
	width: 90px;
	height: 90px;
	line-height: 80px;
	text-align: center;
	border-radius: 50%;
	display: inline-block;
	background: #ffffff;
	color: #f0002a;
	border: 5px solid #f0002a;
	font-size: 60px;
}

.video-btn-2.video-btn-3 i {
	color: #0c0b0b;
	border-color: #0c0b0b;
}

.video-btn-2.video-btn-3 span::before {
	border: 0.1px solid #0c0b0b;
}

.video-btn-2.video-btn-3 span::after {
	border: 0.1px solid #0c0b0b;
}

@-webkit-keyframes videoTwo {
	0% {
		-webkit-transform: translate(50%, -50%) scale(1);
		transform: translate(50%, -50%) scale(1);
		opacity: 1;
	}
	100% {
		-webkit-transform: translate(50%, -50%) scale(5);
		transform: translate(50%, -50%) scale(5);
		opacity: 0;
	}
}

@keyframes videoTwo {
	0% {
		-webkit-transform: translate(50%, -50%) scale(1);
		transform: translate(50%, -50%) scale(1);
		opacity: 1;
	}
	100% {
		-webkit-transform: translate(50%, -50%) scale(5);
		transform: translate(50%, -50%) scale(5);
		opacity: 0;
	}
}

/*
Go Top Style*/
.go-top {
	position: fixed;
	cursor: pointer;
	left: 3%;
	top: 87%;
	background-color: #f0002a;
	z-index: 4;
	width: 40px;
	text-align: center;
	height: 42px;
	line-height: 42px;
	-webkit-transform: scale(0);
	transform: scale(0);
	visibility: hidden;
	-webkit-transition: 0.9s;
	transition: 0.9s;
}

.go-top i {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	right: 0;
	left: 0;
	margin: 0 auto;
	color: #ffffff;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	font-size: 20px;
}

.go-top i:last-child {
	opacity: 0;
	visibility: hidden;
	top: 60%;
}

.go-top::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	background-color: #f0002a;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: 0.5s;
	transition: 0.5s;
}

.go-top:hover {
	color: #ffffff;
	background-color: #f0002a;
}

.go-top:hover::before {
	opacity: 1;
	visibility: visible;
}

.go-top:hover i:first-child {
	opacity: 0;
	top: 0;
	visibility: hidden;
}

.go-top:hover i:last-child {
	opacity: 1;
	visibility: visible;
	top: 50%;
}

.go-top:focus {
	color: #ffffff;
}

.go-top:focus::before {
	opacity: 1;
	visibility: visible;
}

.go-top:focus i:first-child {
	opacity: 0;
	top: 0;
	visibility: hidden;
}

.go-top:focus i:last-child {
	opacity: 1;
	visibility: visible;
	top: 50%;
}

.go-top.active {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
	visibility: visible;
	left: 3%;
	top: 84%;
	-webkit-transform: scale(1);
	transform: scale(1);
}

/*
Video wave Style*/
.video-btn {
	display: inline-block;
	width: 80px;
	height: 80px;
	line-height: 80px;
	text-align: center;
	border-radius: 0;
	color: #f0002a;
	position: relative;
	z-index: 1;
	background-color: #ffffff;
	border-radius: 50%;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
}

.video-btn i {
	font-size: 42px;
	color: #f0002a;
	position: absolute;
	top: 0;
	right: 0px;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 100%;
	height: 100%;
}

.video-btn::after,
.video-btn::before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	bottom: 0;
	right: 0;
	border-radius: 0;
	border-radius: 50%;
	-webkit-transition: all ease 0.5s;
	transition: all ease 0.5s;
	-webkit-animation: ripple 1.6s ease-out infinite;
	animation: ripple 1.6s ease-out infinite;
	background-color: #ffffff;
}

.video-btn span {
	position: absolute;
	top: 0;
	left: -105px;
	width: 100px;
	font-size: 15px;
}

.video-btn:hover {
	background-color: #582949;
}

.video-btn:hover i {
	color: #ffffff;
}

.video-btn:hover::before,
.video-btn:hover::after {
	background-color: #582949;
}

@keyframes ripple {
	0%,
	35% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 1;
	}
	50% {
		-webkit-transform: scale(1.5);
		transform: scale(1.5);
		opacity: 0.8;
	}
	100% {
		opacity: 0;
		-webkit-transform: scale(2);
		transform: scale(2);
	}
}

/*
Page-navigation Area Style*/
.pagination-area {
	margin-top: 10px;
	text-align: center;
}

.pagination-area .page-numbers {
	width: 45px;
	height: 45px;
	line-height: 45px;
	color: #898c90;
	text-align: center;
	display: inline-block;
	position: relative;
	margin-right: 3px;
	margin-left: 3px;
	font-size: 16px;
	background-color: #ffffff;
	border-radius: 50px;
}

.pagination-area .page-numbers:hover {
	color: #848484;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
}

.pagination-area .page-numbers i {
	font-size: 16px;
	font-weight: normal;
}

.pagination-area .page-numbers.next {
	top: 3px;
	border: 1px solid #f0002a;
	color: #f0002a;
}

.pagination-area .page-numbers.next:hover {
	background-color: #f0002a;
	color: #ffffff;
}

.pagination-area .page-numbers.next.current {
	background-color: #f0002a;
	color: #ffffff;
}

.pagination-area .page-numbers.current {
	color: #848484;
	-webkit-box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 20px 3px rgba(0, 0, 0, 0.05);
}

.g-sign-in-button {
	display: inline-block;
	height: 50px;
	background-color: #4285f4;
	color: #fff;
	border-radius: 1px;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25);
	transition: background-color 0.218s, border-color 0.218s, box-shadow 0.218s;
	margin: 10px 5px 0;
}
.bg-171515 {
	background-color: #171515;
}
.g-sign-in-button:hover {
	cursor: pointer;
	-webkit-box-shadow: 0 0 3px 3px rgba(66, 133, 244, 0.3);
	box-shadow: 0 0 3px 3px rgba(66, 133, 244, 0.3);
}
.g-sign-in-button:active {
	background-color: #3367d6;
	transition: background-color 0.2s;
}
.g-sign-in-button .content-wrapper {
	height: 100%;
	width: 100%;
	border: 1px solid transparent;
}
.g-sign-in-button img {
	width: 30px;
	height: 30px;
}
.g-sign-in-button .logo-wrapper {
	line-height: 48px;
	background: #fff;
	width: 45px;
	height: 100%;
	border-radius: 1px;
	display: inline-block;
	margin-left: 10px;
}
.g-sign-in-button .text-container {
	font-family: Roboto, arial, sans-serif;
	font-weight: 500;
	letter-spacing: 0.21px;
	font-size: 15px;
	line-height: 48px;
	vertical-align: top;
	border: none;
	display: inline-block;
	text-align: center;
	padding-left: 10px;
}

.search-list {
	list-style-type: none;
	padding: 20px 15px;
	margin: 0;
	position: absolute;
	right: 0;
	text-align: right;
	width: 95%;
	background-color: #f8f8f8;
	margin-top: 20px;
	border-radius: 10px;
	max-height: 300px;
	overflow-y: auto;
	z-index: 5;
}
.search-list li {
	cursor: pointer;
	display: block;
	font-size: 15px;
	padding: 10px 40px 10px 15px;
	border-radius: 6px;
	position: relative;
}
.search-list li img {
	position: absolute;
	right: 15px !important;
	top: 10px !important;
}
.search-list li:hover {
	background-color: #e1e1e1;
	color: #0c0b0b;
}
.mantine-bdajhj {
	z-index: 0;
}

/* ── Dashboard sidebar ─────────────────────────────────────────────
 * Sticky rail with grouped nav. Each section has a small uppercase
 * label, each item is a pill with icon + label. Active pill gets a
 * tinted background and brand-colored icon; hover gets a subtle wash.
 */
.db-sidebar {
	position: sticky;
	top: 24px;
	background: #ffffff;
	border: 1px solid #e5e7eb;
	border-radius: 14px;
	padding: 18px 14px;
	margin-bottom: 30px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
	max-height: calc(100vh - 48px);
	overflow-y: auto;
}
.db-sidebar__brand {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 4px 10px 14px;
	margin-bottom: 8px;
	border-bottom: 1px solid #f1f5f9;
	font-size: 14px;
	font-weight: 600;
	color: #0f172a;
}
.db-sidebar__brand i {
	font-size: 20px;
	color: #1d4ed8;
}
.db-sidebar__list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.db-sidebar__link {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 12px;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 500;
	color: #475569;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}
.db-sidebar__link:hover {
	background: #f8fafc;
	color: #0f172a;
	text-decoration: none;
}
.db-sidebar__icon {
	font-size: 18px;
	color: #64748b;
	flex-shrink: 0;
	transition: color 0.15s ease;
}
.db-sidebar__link:hover .db-sidebar__icon {
	color: #1d4ed8;
}
.db-sidebar__link--active,
.db-sidebar__link--active:hover {
	background: #eff6ff;
	color: #1d4ed8;
}
.db-sidebar__link--active .db-sidebar__icon {
	color: #1d4ed8;
}

/* Mobile: drop the sticky rail; sit inline above the page content. */
@media (max-width: 991px) {
	.db-sidebar {
		position: static;
		max-height: none;
		overflow-y: visible;
	}
}
.fs-14 {
	font-size: 14px;
}

.review-card ul {
	padding-right: 17px;
}
.review-card ul li {
	margin-bottom: 5px;
}
.review-card ul li:last-child {
	margin-bottom: 0;
}

.db-listing-card ul {
	padding-right: 17px;
}
.db-listing-card ul li {
	margin-bottom: 5px;
}

.main-textarea h1,
.main-textarea h2,
.main-textarea h3,
.main-textarea h4,
.main-textarea h5,
.main-textarea h6 {
	margin-bottom: 15px;
}
.main-textarea h1 {
	font-size: 30px;
}
.main-textarea h2 {
	font-size: 28px;
}
.main-textarea h3 {
	font-size: 25px;
}
.main-textarea h4 {
	font-size: 23px;
}
.main-textarea h5 {
	font-size: 20px;
}
.main-textarea h6 {
	font-size: 18px;
}
.main-textarea ul,
.main-textarea ol {
	margin-bottom: 20px;
}
.main-textarea ul li,
.main-textarea ol li {
	margin-bottom: 10px;
	line-height: 1.8;
}

/* ═══════════════════════════════════════════════════════════════════════
   B2B Supplier Landing Page
   Section-by-section styles. Light, conversion-focused, responsive.
   Color tokens (page-local):
     accent     #f0002a   brand red (CTA)
     ink        #101828   primary text
     ink-soft   #475467   secondary text
     ink-muted  #98a2b3   meta text
     border     #e4e6ea   neutral borders
     bg         #fafbfc   subtle page bg
     bg-card    #ffffff   cards
     wa-green   #25d366   WhatsApp brand
   ═══════════════════════════════════════════════════════════════════════ */

.b2b-page {
	background: #fafbfc;
	min-height: 100vh;
	color: #101828;
	font-feature-settings: "ss01", "cv01";
}

/* ── HERO ───────────────────────────────────────────────────────────── */
.b2b-hero {
	background: linear-gradient(-180deg, #ffffff 0%, #fafbfc 100%);
	border-bottom: 1px solid #ececef;
	padding: 0 0 28px;
}
.b2b-hero__cover {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 5;
	max-height: 360px;
	overflow: hidden;
	background: #f4f6fa;
}
.b2b-hero__cover-img {
	object-fit: cover;
	object-position: center;
}
.b2b-hero__cover-fallback {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 96px;
	color: rgba(255, 255, 255, 0.55);
	background: linear-gradient(-135deg, #2563eb 0%, #1e3a8a 60%, #0f172a 100%);
}
.b2b-hero__cover-fallback::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(
			circle at 18% 22%,
			rgba(255, 255, 255, 0.18) 0,
			transparent 42%
		),
		radial-gradient(
			circle at 82% 78%,
			rgba(255, 255, 255, 0.12) 0,
			transparent 50%
		);
	pointer-events: none;
}
.b2b-hero__cover-fade {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		-180deg,
		transparent 55%,
		rgba(15, 23, 42, 0.18) 100%
	);
	pointer-events: none;
}
.b2b-hero__inner {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 28px;
	align-items: start;
	padding-top: 24px;
	position: relative;
	z-index: 2;
}
.b2b-hero__logo {
	flex-shrink: 0;
	margin-top: -76px;
}
.b2b-hero__logo-img,
.b2b-hero__logo-fallback {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	object-fit: cover;
	background: #fff;
	border: 4px solid #fff;
	box-shadow: 0 8px 24px -10px rgba(16, 24, 40, 0.18);
}
.b2b-hero__logo-fallback {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 36px;
	font-weight: 700;
	color: #475467;
	letter-spacing: 1px;
	background: linear-gradient(-135deg, #f1f5f9 0%, #e4e6ea 100%);
}
.b2b-hero__main {
	min-width: 0;
}
.b2b-hero__name {
	font-size: 28px;
	font-weight: 700;
	color: #101828;
	margin: 0 0 6px;
	line-height: 1.2;
	letter-spacing: -0.01em;
}
.b2b-hero__tagline {
	font-size: 15px;
	color: #475467;
	margin: 0 0 12px;
	line-height: 1.5;
}
.b2b-hero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
	margin-bottom: 14px;
}
.b2b-hero__meta-item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13.5px;
	color: #475467;
	line-height: 1;
}
.b2b-hero__meta-item i {
	font-size: 16px;
	color: #98a2b3;
}
.b2b-hero__meta-link {
	color: #475467;
	text-decoration: none;
	transition: color 0.15s ease;
}
.b2b-hero__meta-link:hover {
	color: #f0002a;
	text-decoration: underline;
}
.b2b-hero__verified {
	color: #059669;
	font-weight: 600;
}
.b2b-hero__verified i {
	color: #059669;
}
.b2b-hero__categories {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 4px;
}
.b2b-hero__categories-label {
	font-size: 12.5px;
	color: #98a2b3;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.b2b-hero__categories-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
.b2b-hero__chip {
	display: inline-flex;
	align-items: center;
	padding: 5px 11px;
	font-size: 12.5px;
	font-weight: 500;
	color: #475467;
	background: #fff;
	border: 1px solid #e4e6ea;
	border-radius: 999px;
	text-decoration: none;
	transition: all 0.15s ease;
}
.b2b-hero__chip:hover {
	color: #f0002a;
	border-color: #f0002a;
	background: #fff5f6;
}
.b2b-hero__cta {
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex-shrink: 0;
	min-width: 200px;
}

/* ── BUTTONS ─────────────────────────────────────────────────────────── */
.b2b-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 11px 22px;
	border-radius: 10px;
	border: 1.5px solid transparent;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	text-decoration: none;
	transition: all 0.15s ease;
	white-space: nowrap;
	background: transparent;
}
.b2b-btn i {
	font-size: 16px;
	line-height: 1;
}
.b2b-btn--primary {
	background: #f0002a;
	color: #fff;
	border-color: #f0002a;
}
.b2b-btn--primary:hover {
	background: #d10024;
	border-color: #d10024;
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px -8px rgba(240, 0, 42, 0.45);
}
.b2b-btn--secondary {
	background: #fff;
	color: #25d366;
	border-color: #25d366;
}
.b2b-btn--secondary:hover {
	background: #25d366;
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px -8px rgba(37, 211, 102, 0.4);
}
/* WhatsApp CTA — brand green to match the prominent channel button below the fold. */
.b2b-btn--whatsapp {
	background: #25d366;
	color: #fff;
	border-color: #25d366;
}
.b2b-btn--whatsapp:hover {
	background: #1ebe5d;
	color: #fff;
	border-color: #1ebe5d;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px -8px rgba(37, 211, 102, 0.5);
}
.b2b-btn--lg {
	padding: 14px 28px;
	font-size: 15px;
	border-radius: 12px;
}

/* ── BODY LAYOUT (Left rail + Main) ────────────────────────────────── */
.b2b-body {
	padding: 32px 0 96px;
}
.b2b-layout {
	display: grid;
	grid-template-columns: 220px 1fr;
	gap: 32px;
	align-items: start;
	/* Prevent any deep child (rail list, sticky CTAs, wide images) from
	   forcing the grid wider than its container — root cause of the RTL
	   horizontal-overflow seen on mobile listing pages. */
	min-width: 0;
	max-width: 100%;
}

/* ── LEFT RAIL ─────────────────────────────────────────────────────── */
.b2b-rail {
	position: sticky;
	top: 124px;
	align-self: start;
	/* Grid track auto-min defaults to "auto" which is the rail's content
	   width. Without explicit min-width:0 the rail can refuse to shrink
	   below its content and push the grid wider than the viewport. */
	min-width: 0;
}
.b2b-rail__list {
	list-style: none;
	margin: 0;
	padding: 8px;
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 14px;
	box-shadow: 0 2px 8px -4px rgba(16, 24, 40, 0.04);
}
.b2b-rail__item {
	margin: 0;
	padding: 0;
}
.b2b-rail__link {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 10px 12px;
	background: transparent;
	border: none;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 500;
	color: #475467;
	text-align: start;
	cursor: pointer;
	transition: all 0.15s ease;
}
.b2b-rail__link:hover {
	background: #fafbfc;
	color: #101828;
}
.b2b-rail__link--active {
	background: #fff5f6;
	color: #f0002a;
	font-weight: 600;
}
.b2b-rail__dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #d0d5dd;
	transition: all 0.15s ease;
	flex-shrink: 0;
}
.b2b-rail__link--active .b2b-rail__dot {
	background: #f0002a;
	transform: scale(1.4);
	box-shadow: 0 0 0 4px rgba(240, 0, 42, 0.12);
}
.b2b-rail__label {
	flex: 1;
}

/* ── MAIN + SECTIONS ──────────────────────────────────────────────── */
.b2b-main {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 28px;
}
.b2b-section {
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 16px;
	padding: 28px;
	scroll-margin-top: 80px;
	box-shadow: 0 1px 3px rgba(16, 24, 40, 0.03);
}
.b2b-section__header {
	display: flex;
	align-items: center;
	margin-bottom: 20px;
	padding-bottom: 14px;
	border-bottom: 1px solid #ececef;
}
.b2b-section__title {
	font-size: 18px;
	font-weight: 700;
	color: #101828;
	margin: 0;
	letter-spacing: -0.01em;
	display: flex;
	align-items: center;
	gap: 10px;
}
.b2b-section__title::before {
	content: "";
	display: inline-block;
	width: 4px;
	height: 18px;
	background: #f0002a;
	border-radius: 2px;
}

/* ── INSTAGRAM ALBUM (replaces photo album when supplier provides IG URLs) */
.b2b-album--instagram .b2b-section__title {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}
.b2b-album__ig-icon {
	font-size: 26px;
	background: linear-gradient(-45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.b2b-album__ig-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 18px;
	margin-top: 8px;
}
/* Each tile clips its iframe to hide Instagram's chrome (profile header
 * on top + like/comment/share/View-on-Instagram footer on the bottom).
 * The iframe is positioned absolutely with a negative top offset to push
 * the header out of view; the container's fixed height (smaller than the
 * iframe's natural height) clips off everything below the media. */
.b2b-album__ig-tile {
	position: relative;
	background: #fafafa;
	border: 1px solid #efefef;
	border-radius: 12px;
	overflow: hidden;
}
.b2b-album__ig-tile--post {
	height: 480px;
}
.b2b-album__ig-tile--reel,
.b2b-album__ig-tile--tv {
	height: 700px;
}
.b2b-album__ig-iframe {
	position: absolute;
	top: -54px; /* hide IG header */
	right: 0;
	width: 100%;
	border: none;
	display: block;
	background: #fff;
}
.b2b-album__ig-tile--post .b2b-album__ig-iframe {
	height: 640px; /* taller than container → footer clipped */
}
.b2b-album__ig-tile--reel .b2b-album__ig-iframe,
.b2b-album__ig-tile--tv .b2b-album__ig-iframe {
	height: 920px;
}

/* Edit-form Instagram URL inputs (lives inside AlbumBlock). */
.album-block__instagram {
	margin-top: 24px;
	padding: 18px;
	background: #fafafa;
	border: 1px dashed #d0d5dd;
	border-radius: 12px;
}
.album-block__instagram-head {
	margin-bottom: 14px;
}
.album-block__instagram-title {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 4px;
	font-size: 15px;
	font-weight: 600;
	color: #1f2937;
}
.album-block__instagram-title i {
	font-size: 20px;
	background: linear-gradient(-45deg, #f09433, #dc2743, #bc1888);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.album-block__instagram-hint {
	margin: 0;
	font-size: 13px;
	color: #6b7280;
	line-height: 1.5;
}
.album-block__instagram-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 10px;
}
.album-block__instagram-field {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-size: 12.5px;
	font-weight: 500;
	color: #475467;
}
.album-block__instagram-field input {
	padding: 9px 12px;
	border: 1.5px solid #d0d5dd;
	border-radius: 8px;
	font-size: 13.5px;
	font-family: inherit;
	background: #fff;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.album-block__instagram-field input:focus {
	outline: none;
	border-color: #dc2743;
	box-shadow: 0 0 0 3px rgba(220, 39, 67, 0.10);
}

/* ── ALBUM (carousel) ─────────────────────────────────────────────── */
.b2b-album__swiper {
	padding-bottom: 36px !important;
	margin: 0 -8px;
	padding: 0 8px 36px !important;
}
/* When swiper has fewer slides than needed for navigation, Swiper adds the
 * `swiper-button-lock` class and our custom styles were leaving the inert
 * buttons visible — overlapping the slide thumbnail. Hide them entirely. */
.b2b-album__swiper .swiper-button-lock {
	display: none !important;
}
/* When Instagram block + photo album both render, give the photo block
 * a clear visual break so they don't blur into one section. */
.b2b-album--instagram + .b2b-album {
	margin-top: 32px;
	padding-top: 28px;
	border-top: 1px solid #ececef;
}
.b2b-album__slide {
	height: auto !important;
}
.b2b-album__tile {
	display: block;
	width: 100%;
	background: #f1f5f9;
	border: none;
	border-radius: 12px;
	overflow: hidden;
	cursor: pointer;
	padding: 0;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
	text-align: start;
}
.b2b-album__tile:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px -10px rgba(16, 24, 40, 0.18);
}
.b2b-album__media {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
}
.b2b-album__img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	display: block;
	transition: transform 0.3s ease;
}
.b2b-album__tile:hover .b2b-album__img {
	transform: scale(1.05);
}
.b2b-album__placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(-135deg, #1e293b 0%, #334155 100%);
	color: #fff;
	font-size: 48px;
}
.b2b-album__play {
	position: absolute;
	top: 50%;
	right: 50%;
	transform: translate(50%, -50%);
	width: 56px;
	height: 56px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.95);
	border-radius: 50%;
	color: #f0002a;
	font-size: 28px;
	box-shadow: 0 6px 18px -4px rgba(0, 0, 0, 0.3);
	transition: transform 0.15s ease;
}
.b2b-album__tile:hover .b2b-album__play {
	transform: translate(50%, -50%) scale(1.1);
}
.b2b-album__caption {
	display: block;
	padding: 10px 14px;
	font-size: 13px;
	font-weight: 500;
	color: #475467;
	background: #fff;
}
.b2b-album__swiper .swiper-button-next,
.b2b-album__swiper .swiper-button-prev {
	width: 36px;
	height: 36px;
	background: #fff;
	border-radius: 50%;
	box-shadow: 0 4px 12px -2px rgba(16, 24, 40, 0.18);
	color: #101828;
	margin-top: -28px;
	z-index: 10;
}
.b2b-album__swiper .swiper-button-next::after,
.b2b-album__swiper .swiper-button-prev::after {
	font-size: 16px;
	font-weight: 700;
}
.b2b-album__swiper .swiper-pagination-bullet {
	background: #d0d5dd;
	opacity: 1;
}
.b2b-album__swiper .swiper-pagination-bullet-active {
	background: #f0002a;
	width: 24px;
	border-radius: 4px;
}

/* Album modal (lightbox + video player) */
.b2b-album__modal {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.85);
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	animation: b2bFadeIn 0.18s ease;
}
@keyframes b2bFadeIn {
	from { opacity: 0; }
	to   { opacity: 1; }
}
.b2b-album__modal-inner {
	position: relative;
	max-width: 1100px;
	width: 100%;
	max-height: 90vh;
	display: flex;
	align-items: center;
	justify-content: center;
}
.b2b-album__modal-close {
	position: absolute;
	top: -44px;
	left: 0;
	width: 36px;
	height: 36px;
	background: rgba(255, 255, 255, 0.15);
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 50%;
	color: #fff;
	font-size: 20px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.15s ease;
}
.b2b-album__modal-close:hover {
	background: rgba(255, 255, 255, 0.3);
}
[dir="rtl"] .b2b-album__modal-close {
	left: auto;
	right: 0;
}
.b2b-album__modal-img {
	max-width: 100%;
	max-height: 90vh;
	width: auto !important;
	height: auto !important;
	object-fit: contain;
	border-radius: 8px;
}
.b2b-album__modal-iframe,
.b2b-album__modal-video {
	width: min(1100px, 100vw - 48px);
	aspect-ratio: 16 / 9;
	max-height: 90vh;
	border: none;
	border-radius: 8px;
	background: #000;
}

/* ── OVERVIEW ─────────────────────────────────────────────────────── */
.b2b-overview__grid {
	display: grid;
	grid-template-columns: 1fr 280px;
	gap: 28px;
	align-items: start;
}
.b2b-overview__description {
	font-size: 15px;
	line-height: 1.7;
	color: #344054;
}
.b2b-overview__description p {
	margin: 0 0 12px;
}
.b2b-overview__description h2,
.b2b-overview__description h3 {
	color: #101828;
	font-weight: 700;
	margin: 18px 0 10px;
}
.b2b-overview__description ul,
.b2b-overview__description ol {
	margin: 8px 0 12px;
	padding-inline-start: 1.4em;
}
.b2b-overview__description-empty {
	color: #98a2b3;
	font-style: italic;
}
.b2b-info {
	margin: 24px 0 0;
	padding: 18px 20px;
	background: #fafbfc;
	border-radius: 12px;
}
.b2b-info__title {
	font-size: 13px;
	font-weight: 700;
	color: #475467;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin: 0 0 12px;
}
.b2b-info__row {
	display: grid;
	grid-template-columns: 180px 1fr;
	gap: 12px;
	padding: 9px 0;
	border-bottom: 1px solid #ececef;
	margin: 0;
}
.b2b-info__row:last-child {
	border-bottom: none;
}
.b2b-info__label {
	font-size: 13.5px;
	color: #6b7280;
	font-weight: 500;
	margin: 0;
}
.b2b-info__value {
	font-size: 14px;
	color: #101828;
	font-weight: 500;
	margin: 0;
}

/* Trust card (right column) */
.b2b-trust {
	display: flex;
	flex-direction: column;
	gap: 10px;
	background: linear-gradient(-180deg, #fefefe 0%, #fafbfc 100%);
	border: 1px solid #ececef;
	border-radius: 14px;
	padding: 18px;
	position: sticky;
	top: 24px;
}
.b2b-trust__row {
	display: flex;
	gap: 12px;
	align-items: center;
	padding: 10px;
	border-radius: 10px;
	background: #fff;
}
.b2b-trust__row > i {
	font-size: 22px;
	flex-shrink: 0;
}
.b2b-trust__rating {
	background:
		linear-gradient(-135deg, rgba(251, 191, 36, 0.10) 0%, rgba(245, 158, 11, 0.14) 100%),
		linear-gradient(-180deg, #ffffff 0%, #fffbeb 100%);
	border: 1px solid rgba(251, 191, 36, 0.35);
	box-shadow:
		0 1px 3px rgba(180, 83, 9, 0.08),
		inset 0 1px 0 rgba(255, 255, 255, 0.7);
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	position: relative;
	overflow: hidden;
}
.b2b-trust__rating::after {
	content: "";
	position: absolute;
	top: -24px;
	inset-inline-end: -24px;
	width: 96px;
	height: 96px;
	background: radial-gradient(
		circle,
		rgba(251, 191, 36, 0.22) 0%,
		transparent 70%
	);
	border-radius: 50%;
	pointer-events: none;
}
.b2b-trust__rating-num {
	font-size: 34px;
	font-weight: 800;
	color: #b45309;
	line-height: 1;
	letter-spacing: -0.02em;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
	position: relative;
}
.b2b-trust__rating-out {
	font-size: 14px;
	font-weight: 600;
	color: #92400e;
	margin-inline-start: 4px;
	opacity: 0.7;
}
.b2b-trust__rating-meta {
	width: 100%;
	position: relative;
}
.b2b-trust__stars {
	display: flex;
	gap: 2px;
	color: #f59e0b;
	font-size: 16px;
	margin-bottom: 2px;
	filter: drop-shadow(0 1px 1px rgba(180, 83, 9, 0.15));
}
.b2b-trust__rating-count {
	font-size: 12.5px;
	color: #78350f;
	font-weight: 500;
}
.b2b-trust__verified {
	background: linear-gradient(-135deg, #ecfdf5 0%, #d1fae5 100%);
	border: 1px solid #a7f3d0;
}
.b2b-trust__verified > i {
	color: #059669;
}
.b2b-trust__pending {
	background: linear-gradient(-135deg, #fff5f5 0%, #fee2e2 100%);
	border: 1px solid #fca5a5;
}
.b2b-trust__pending > i {
	color: #dc2626;
}
/* Featured card — bold solid brand-colored variants with white text and
 * a gold star icon. A diagonal shimmer animation sweeps across the card
 * every ~6s, catching the eye without being annoying. Feels like a
 * premium membership badge. */
.b2b-trust__featured {
	position: relative;
	overflow: hidden;
	gap: 16px;
	padding: 16px 18px;
	border: none;
	color: #ffffff;
}

/* Sweeping diagonal shimmer — gives the card a "this is special" feel. */
.b2b-trust__featured::before {
	content: "";
	position: absolute;
	top: 0;
	right: -150%;
	width: 60%;
	height: 100%;
	background: linear-gradient(
		-115deg,
		transparent 0%,
		rgba(255, 255, 255, 0) 30%,
		rgba(255, 255, 255, 0.18) 50%,
		rgba(255, 255, 255, 0) 70%,
		transparent 100%
	);
	transform: skewX(20deg);
	animation: b2b-trust-shimmer 6s ease-in-out infinite;
	pointer-events: none;
	z-index: 1;
}

/* Static highlight in the top-right corner — a stationary glow that
 * makes the card look 3D even before the shimmer animates. */
.b2b-trust__featured::after {
	content: "";
	position: absolute;
	top: -40px;
	inset-inline-end: -40px;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	background: radial-gradient(
		circle,
		rgba(255, 255, 255, 0.20) 0%,
		transparent 65%
	);
	pointer-events: none;
	z-index: 0;
}

@keyframes b2b-trust-shimmer {
	0%, 50%, 100% {
		right: -150%;
	}
	75% {
		right: 150%;
	}
}

.b2b-trust__featured .b2b-trust__line-label {
	font-weight: 800;
	font-size: 16px;
	letter-spacing: -0.01em;
	color: #ffffff;
	position: relative;
	z-index: 2;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.b2b-trust__featured .b2b-trust__line-sub {
	font-weight: 500;
	font-size: 12.5px;
	color: rgba(255, 255, 255, 0.85);
	position: relative;
	z-index: 2;
	letter-spacing: 0.005em;
}
.b2b-trust__featured > i {
	font-size: 32px;
	color: #fbbf24;
	position: relative;
	z-index: 2;
	flex-shrink: 0;
	filter:
		drop-shadow(0 0 8px rgba(251, 191, 36, 0.6))
		drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25));
}

/* Services variant — solid burgundy with deep wine shadow. */
.b2b-trust__featured--services {
	background: linear-gradient(-135deg, #7d3a62 0%, #582949 60%, #3d1c33 100%);
	box-shadow:
		0 10px 24px rgba(88, 41, 73, 0.35),
		0 2px 6px rgba(88, 41, 73, 0.20),
		inset 0 1px 0 rgba(255, 255, 255, 0.20);
}

/* B2B variant — solid navy with cool deep shadow. */
.b2b-trust__featured--b2b {
	background: linear-gradient(-135deg, #334155 0%, #1e293b 60%, #0f172a 100%);
	box-shadow:
		0 10px 24px rgba(15, 23, 42, 0.40),
		0 2px 6px rgba(15, 23, 42, 0.20),
		inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

/* Respect motion preferences. */
@media (prefers-reduced-motion: reduce) {
	.b2b-trust__featured::before {
		animation: none;
	}
}
.b2b-trust__line-label {
	font-size: 13.5px;
	font-weight: 600;
	color: #101828;
	line-height: 1.3;
}
.b2b-trust__line-sub {
	font-size: 12px;
	color: #6b7280;
	margin-top: 2px;
}

/* ── WHY US ───────────────────────────────────────────────────────── */
.b2b-why__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 14px;
}
.b2b-why__item {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 16px 18px;
	background: #fafbfc;
	border: 1px solid #ececef;
	border-radius: 12px;
	transition: all 0.15s ease;
}
.b2b-why__item:hover {
	background: #fff;
	border-color: #f0002a;
	transform: translateY(-2px);
	box-shadow: 0 8px 20px -10px rgba(240, 0, 42, 0.18);
}
.b2b-why__check {
	width: 28px;
	height: 28px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #ecfdf5;
	color: #059669;
	font-size: 18px;
}
.b2b-why__text {
	font-size: 14px;
	color: #344054;
	line-height: 1.55;
	font-weight: 500;
}

/* ── PRODUCTS placeholder ─────────────────────────────────────────── */
.b2b-products__placeholder {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 36px 24px;
	background: linear-gradient(-180deg, #fafbfc 0%, #f1f5f9 100%);
	border: 2px dashed #d0d5dd;
	border-radius: 14px;
}
.b2b-products__icon {
	width: 64px;
	height: 64px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border-radius: 16px;
	color: #f0002a;
	font-size: 32px;
	margin-bottom: 14px;
	box-shadow: 0 4px 12px -4px rgba(16, 24, 40, 0.08);
}
.b2b-products__title {
	font-size: 17px;
	font-weight: 700;
	color: #101828;
	margin: 0 0 6px;
}
.b2b-products__sub {
	font-size: 14px;
	color: #6b7280;
	margin: 0;
	max-width: 460px;
	line-height: 1.55;
}

/* ── CATALOGS ─────────────────────────────────────────────────────── */
.b2b-catalogs__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 18px;
}
.b2b-catalog-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 14px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: all 0.15s ease;
}
.b2b-catalog-card:hover {
	transform: translateY(-3px);
	border-color: #f0002a;
	box-shadow: 0 14px 30px -14px rgba(16, 24, 40, 0.18);
	color: inherit;
	text-decoration: none;
}
.b2b-catalog-card__cover {
	aspect-ratio: 3 / 4;
	background: #f1f5f9;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}
.b2b-catalog-card__img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}
.b2b-catalog-card__cover-fallback {
	font-size: 56px;
	color: #f0002a;
	background: linear-gradient(-135deg, #fff 0%, #fff5f6 100%);
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.b2b-catalog-card__body {
	padding: 14px 16px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
}
.b2b-catalog-card__title {
	font-size: 14px;
	font-weight: 600;
	color: #101828;
	margin: 0;
	line-height: 1.35;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.b2b-catalog-card__meta {
	display: flex;
	gap: 12px;
	font-size: 12px;
	color: #6b7280;
}
.b2b-catalog-card__meta i {
	font-size: 14px;
	color: #98a2b3;
	margin-inline-end: 4px;
}
.b2b-catalog-card__cta {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
	color: #f0002a;
	padding-top: 6px;
}

/* ── LOCATION ─────────────────────────────────────────────────────── */
.b2b-location__card {
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid #ececef;
}
.b2b-location__map {
	aspect-ratio: 16 / 7;
	background: #f1f5f9;
	overflow: hidden;
}
.b2b-location__map iframe {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}
.b2b-location__info {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	padding: 14px 18px;
	background: #fafbfc;
	border-top: 1px solid #ececef;
}
.b2b-location__address {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 14px;
	color: #344054;
	line-height: 1.5;
}
.b2b-location__address i {
	font-size: 18px;
	color: #f0002a;
	margin-top: 1px;
}
.b2b-location__directions {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	font-size: 13px;
	font-weight: 600;
	color: #f0002a;
	background: #fff;
	border: 1px solid #f0002a;
	border-radius: 8px;
	text-decoration: none;
	transition: all 0.15s ease;
}
.b2b-location__directions:hover {
	background: #f0002a;
	color: #fff;
}

/* ── CONTACT ─────────────────────────────────────────────────────── */
.b2b-contact__channels {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 12px;
	margin-bottom: 24px;
}
.b2b-channel {
	box-sizing: border-box;
	width: 100%;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px 18px;
	background: #fafbfc;
	border: 1px solid #ececef;
	border-radius: 12px;
	text-decoration: none;
	color: inherit;
	transition: all 0.15s ease;
}
.b2b-channel:hover {
	background: #fff;
	transform: translateY(-2px);
	box-shadow: 0 10px 22px -10px rgba(16, 24, 40, 0.12);
	color: inherit;
	text-decoration: none;
}
.b2b-channel__icon {
	width: 44px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 10px;
	font-size: 22px;
	flex-shrink: 0;
}
.b2b-channel--website .b2b-channel__icon {
	background: #dbeafe;
	color: #2563eb;
}
/* WhatsApp = primary CTA. Brand green so it stands out from the other channels. */
.b2b-channel--whatsapp {
	background: #25d366;
	border-color: #25d366;
	color: #ffffff;
}
.b2b-channel--whatsapp:hover {
	background: #1ebe5d;
	border-color: #1ebe5d;
	color: #ffffff;
}
.b2b-channel--whatsapp .b2b-channel__icon {
	background: rgba(255, 255, 255, 0.18);
	color: #ffffff;
}
.b2b-channel--whatsapp .b2b-channel__label,
.b2b-channel--whatsapp .b2b-channel__value {
	color: #ffffff;
}
.b2b-channel--whatsapp .b2b-channel__arrow {
	color: rgba(255, 255, 255, 0.85);
}
.b2b-channel--whatsapp:hover .b2b-channel__arrow {
	color: #ffffff;
}
.b2b-channel__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	min-width: 0;
}
.b2b-channel__label {
	font-size: 12.5px;
	color: #6b7280;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: 2px;
}
.b2b-channel__value {
	font-size: 14px;
	font-weight: 600;
	color: #101828;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.b2b-channel__arrow {
	font-size: 18px;
	color: #98a2b3;
	flex-shrink: 0;
}
.b2b-channel:hover .b2b-channel__arrow {
	color: #f0002a;
}

/* RFQ form */
.b2b-rfq {
	background: linear-gradient(-180deg, #fafbfc 0%, #ffffff 100%);
	border: 1px solid #ececef;
	border-radius: 14px;
	padding: 24px;
}
.b2b-rfq__head {
	margin-bottom: 18px;
}
.b2b-rfq__title {
	font-size: 17px;
	font-weight: 700;
	color: #101828;
	margin: 0 0 4px;
}
.b2b-rfq__sub {
	font-size: 13.5px;
	color: #6b7280;
	margin: 0;
	line-height: 1.5;
}
.b2b-rfq__form {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.b2b-rfq__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}
.b2b-rfq__field label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #475467;
	margin-bottom: 5px;
}
.b2b-rfq__field input,
.b2b-rfq__field textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1.5px solid #d0d5dd;
	border-radius: 8px;
	font-size: 14px;
	color: #101828;
	background: #fff;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
	font-family: inherit;
	resize: vertical;
}
.b2b-rfq__field input:focus,
.b2b-rfq__field textarea:focus {
	outline: none;
	border-color: #f0002a;
	box-shadow: 0 0 0 3px rgba(240, 0, 42, 0.1);
}
.b2b-rfq__field input.is-invalid,
.b2b-rfq__field textarea.is-invalid {
	border-color: #d92d20;
}
.b2b-rfq__err {
	font-size: 12.5px;
	color: #d92d20;
	margin: 4px 0 0;
}

.phone-input {
	display: grid;
	grid-template-columns: 150px 1fr;
	gap: 8px;
	align-items: stretch;
}
.phone-input__country {
	position: relative;
}
.phone-input__country .phone-input-select__control {
	min-height: 42px;
	border: 1.5px solid #d0d5dd;
	border-radius: 8px;
	background: #fff;
	box-shadow: none;
	padding-inline: 4px;
}
.phone-input__country .phone-input-select__control--is-focused {
	border-color: #f0002a;
	box-shadow: 0 0 0 3px rgba(240, 0, 42, 0.1);
}
.phone-input__country .phone-input-select__value-container {
	padding-inline: 6px;
}
.phone-input__country .phone-input-select__indicators {
	padding-inline-end: 4px;
}
.phone-input__country .phone-input-select__single-value {
	display: flex;
	align-items: center;
	gap: 6px;
}
.phone-input__country .phone-input-select__menu {
	z-index: 20;
	min-width: 320px;
	width: max-content;
	max-width: 360px;
}
.phone-input__country .phone-input-select__option {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 12px;
	font-size: 13.5px;
	white-space: nowrap;
}
.phone-input__opt-flag,
.phone-input__sv-flag {
	font-size: 18px;
	line-height: 1;
}
.phone-input__opt-label {
	flex: 1;
	color: #101828;
}
.phone-input__opt-code {
	color: #667085;
	font-variant-numeric: tabular-nums;
}
.phone-input__sv-code {
	color: #101828;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
}
.phone-input__number {
	width: 100%;
	padding: 10px 12px;
	border: 1.5px solid #d0d5dd;
	border-radius: 8px;
	font-size: 14px;
	color: #101828;
	background: #fff;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.phone-input__number:focus {
	outline: none;
	border-color: #f0002a;
	box-shadow: 0 0 0 3px rgba(240, 0, 42, 0.1);
}

.b2b-country-opt {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.b2b-country-opt__flag {
	font-size: 18px;
	line-height: 1;
}
.b2b-country-select__control {
	min-height: 42px !important;
	border: 1.5px solid #d0d5dd !important;
	border-radius: 8px !important;
	background: #fff !important;
	box-shadow: none !important;
}
.b2b-country-select__control--is-focused {
	border-color: #f0002a !important;
	box-shadow: 0 0 0 3px rgba(240, 0, 42, 0.1) !important;
}
.b2b-country-select__menu {
	z-index: 20 !important;
}
.b2b-rfq__actions {
	margin-top: 6px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	align-items: flex-start;
}
.b2b-rfq__legal {
	font-size: 11.5px;
	color: #98a2b3;
	margin: 0;
}
.b2b-rfq__success {
	display: flex;
	gap: 14px;
	align-items: center;
	padding: 24px;
	background: linear-gradient(-135deg, #ecfdf5 0%, #d1fae5 100%);
	border: 1px solid #a7f3d0;
	border-radius: 12px;
}
.b2b-rfq__success > i {
	font-size: 36px;
	color: #059669;
	flex-shrink: 0;
}
.b2b-rfq__success-title {
	font-size: 16px;
	font-weight: 700;
	color: #065f46;
}
.b2b-rfq__success-sub {
	font-size: 13.5px;
	color: #047857;
	margin-top: 2px;
}

/* ── MOBILE STICKY CTA ────────────────────────────────────────────── */
.b2b-sticky-cta {
	display: none;
}
@media (max-width: 767px) {
	.b2b-sticky-cta {
		display: flex;
		gap: 8px;
		position: fixed;
		bottom: 0;
		right: 0;
		left: 0;
		padding: 10px 12px calc(env(safe-area-inset-bottom, 0px) + 10px);
		background: rgba(255, 255, 255, 0.96);
		backdrop-filter: blur(8px);
		-webkit-backdrop-filter: blur(8px);
		border-top: 1px solid #ececef;
		z-index: 90;
	}
	.b2b-sticky-cta .b2b-btn {
		flex: 1;
		padding: 12px 14px;
		font-size: 14px;
	}
	.b2b-body {
		padding-bottom: 96px;
	}
}

/* ── RESPONSIVE ───────────────────────────────────────────────────── */
@media (max-width: 1199px) {
	.b2b-layout {
		grid-template-columns: 200px 1fr;
		gap: 24px;
	}
}
@media (max-width: 991px) {
	.b2b-hero__cover {
		aspect-ratio: 16 / 7;
	}
	.b2b-hero__inner {
		grid-template-columns: auto 1fr;
		row-gap: 18px;
	}
	.b2b-hero__logo {
		margin-top: -56px;
	}
	.b2b-hero__logo-img,
	.b2b-hero__logo-fallback {
		width: 96px;
		height: 96px;
	}
	.b2b-hero__cta {
		grid-column: 1 / -1;
		/* Keep column direction so Request-Quote and WhatsApp buttons
		   stack full-width on mobile instead of squeezing side-by-side. */
		flex-direction: column;
		min-width: 0;
		max-width: 100%;
	}
	.b2b-hero__cta .b2b-btn {
		width: 100%;
	}
	.b2b-layout {
		grid-template-columns: 1fr;
		gap: 16px;
	}
	.b2b-rail {
		position: static;
	}
	.b2b-rail__list {
		display: flex;
		gap: 6px;
		padding: 6px;
		overflow-x: auto;
		scrollbar-width: none;
	}
	.b2b-rail__list::-webkit-scrollbar {
		display: none;
	}
	.b2b-rail__link {
		white-space: nowrap;
	}
	.b2b-overview__grid {
		grid-template-columns: 1fr;
	}
	.b2b-trust {
		position: static;
		flex-direction: row;
		flex-wrap: wrap;
	}
	.b2b-trust__row {
		flex: 1 1 200px;
	}
}
@media (max-width: 575px) {
	.b2b-hero {
		padding: 24px 0 22px;
	}
	.b2b-hero__inner {
		grid-template-columns: 1fr;
		text-align: start;
	}
	.b2b-hero__logo {
		margin-bottom: 4px;
	}
	.b2b-hero__logo-img,
	.b2b-hero__logo-fallback {
		width: 84px;
		height: 84px;
	}
	.b2b-hero__name {
		font-size: 22px;
	}
	.b2b-hero__cta {
		width: 100%;
	}
	.b2b-section {
		padding: 20px 16px;
		border-radius: 12px;
	}
	.b2b-info__row {
		grid-template-columns: 1fr;
		gap: 2px;
	}
	.b2b-rfq__row {
		grid-template-columns: 1fr;
	}
	.b2b-rfq {
		padding: 18px;
	}
	/* Compact channel cards (WhatsApp / Send Inquiry / Visit Website) on
	   phones — full padding + 44px icon makes them oversized on narrow
	   screens, especially the prominent WhatsApp variant. */
	.b2b-channel {
		padding: 12px 14px;
		gap: 12px;
		width: 80%;
		margin-inline: auto;
	}
	.b2b-channel__icon {
		width: 36px;
		height: 36px;
		font-size: 18px;
		border-radius: 8px;
	}
	.b2b-channel__label {
		font-size: 11.5px;
	}
	.b2b-channel__value {
		font-size: 13px;
	}
	/* Hide the trailing chevron / external-link arrow on phones — frees up
	   width and removes visual noise. The card itself is still tappable. */
	.b2b-channel__arrow {
		display: none;
	}
}

/* ── RTL FLIPS ────────────────────────────────────────────────────── */
[dir="rtl"] .b2b-album__swiper .swiper-button-next {
	right: 10px;
	left: auto;
	transform: rotate(-180deg);
	margin-top: -28px;
}
[dir="rtl"] .b2b-album__swiper .swiper-button-prev {
	left: 10px;
	right: auto;
	transform: rotate(-180deg);
	margin-top: -28px;
}
[dir="rtl"] .b2b-channel__arrow {
	transform: rotate(-180deg);
}

/* ── B2B SAVE / SHARE actions (in hero) ──────────────────────────── */
.b2b-actions {
	position: relative;
	display: flex;
	gap: 8px;
	margin-bottom: 4px;
}
.b2b-actions__btn {
	width: 40px;
	height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 10px;
	background: #fff;
	border: 1px solid #e4e6ea;
	color: #475467;
	font-size: 18px;
	cursor: pointer;
	transition: all 0.15s ease;
	padding: 0;
}
.b2b-actions__btn:hover {
	border-color: #f0002a;
	color: #f0002a;
	background: #fff5f6;
}
/* Wrap the existing HeartButton (uses .wish-btn) and override its layout. */
.b2b-actions__heart {
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: #fff;
	border: 1px solid #e4e6ea;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: all 0.15s ease;
}
.b2b-actions__heart:hover {
	border-color: #f0002a;
	background: #fff5f6;
}
.b2b-actions__heart .wish-btn {
	width: 100%;
	height: 100%;
	border: none;
	background: transparent;
	color: #475467;
	font-size: 20px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	cursor: pointer;
	transition: color 0.15s ease;
}
.b2b-actions__heart .wish-btn .ri-heart-fill,
.b2b-actions__heart:hover .wish-btn {
	color: #f0002a;
}

/* Share popover */
.b2b-share-pop {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	z-index: 80;
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 12px;
	padding: 12px;
	box-shadow: 0 12px 32px -10px rgba(16, 24, 40, 0.18),
		0 4px 8px rgba(16, 24, 40, 0.06);
	min-width: 220px;
	animation: b2bPopIn 0.16s ease;
}
[dir="rtl"] .b2b-share-pop {
	left: auto;
	right: 0;
}
@keyframes b2bPopIn {
	from { opacity: 0; transform: translateY(-4px); }
	to   { opacity: 1; transform: translateY(0); }
}
.b2b-share-pop__row {
	display: flex;
	gap: 8px;
	margin-bottom: 10px;
	justify-content: center;
}
.b2b-share-pop__row > button {
	cursor: pointer;
	transition: transform 0.12s ease;
}
.b2b-share-pop__row > button:hover {
	transform: scale(1.08);
}
.b2b-share-pop__copy {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 9px 12px;
	background: #fafbfc;
	border: 1px solid #e4e6ea;
	border-radius: 8px;
	font-size: 13.5px;
	font-weight: 500;
	color: #475467;
	cursor: pointer;
	transition: all 0.15s ease;
}
.b2b-share-pop__copy:hover {
	background: #fff;
	border-color: #d0d5dd;
	color: #101828;
}

/* ── REVIEWS SECTION ─────────────────────────────────────────────── */
.b2b-section__count {
	font-size: 14px;
	font-weight: 500;
	color: #98a2b3;
	margin-inline-start: 4px;
}

.b2b-rev__summary {
	display: grid;
	grid-template-columns: minmax(140px, 200px) 1fr;
	gap: 28px;
	align-items: center;
	padding: 20px 24px;
	background: linear-gradient(-135deg, #fff5f6 0%, #ffeef0 50%, #fff 100%);
	border: 1px solid #ffe4e6;
	border-radius: 14px;
	margin-bottom: 24px;
}
.b2b-rev__avg {
	display: flex;
	flex-direction: column;
	gap: 6px;
	align-items: flex-start;
}
.b2b-rev__avg-num {
	font-size: 44px;
	font-weight: 800;
	color: #f0002a;
	line-height: 1;
	letter-spacing: -0.02em;
}
.b2b-rev__avg-count {
	font-size: 13px;
	color: #6b7280;
}
.b2b-rev__stars {
	display: inline-flex;
	gap: 2px;
	color: #fbbf24;
	font-size: 16px;
}
.b2b-rev__dist {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.b2b-rev__dist-row {
	display: grid;
	grid-template-columns: 14px 16px 1fr 28px;
	align-items: center;
	gap: 8px;
	font-size: 12.5px;
	color: #475467;
}
.b2b-rev__dist-label {
	font-weight: 600;
	text-align: end;
}
.b2b-rev__dist-bar {
	height: 8px;
	background: #f1f5f9;
	border-radius: 999px;
	overflow: hidden;
	position: relative;
}
.b2b-rev__dist-fill {
	display: block;
	height: 100%;
	background: linear-gradient(-90deg, #fbbf24, #f59e0b);
	border-radius: 999px;
	transition: width 0.4s ease;
}
.b2b-rev__dist-count {
	font-variant-numeric: tabular-nums;
	color: #6b7280;
}

.b2b-rev__empty {
	color: #6b7280;
	background: #fafbfc;
	border: 1px dashed #d0d5dd;
	border-radius: 10px;
	padding: 18px 16px;
	text-align: center;
	font-size: 14px;
	margin: 0 0 24px;
}

.b2b-rev__list {
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.b2b-rev__item {
	display: flex;
	gap: 14px;
	padding: 16px;
	background: #fafbfc;
	border: 1px solid #ececef;
	border-radius: 12px;
}
.b2b-rev__avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	flex-shrink: 0;
	background: linear-gradient(-135deg, #f0002a 0%, #c5001f 100%);
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.5px;
}
.b2b-rev__body {
	flex: 1;
	min-width: 0;
}
.b2b-rev__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 4px;
}
.b2b-rev__name {
	font-size: 14px;
	font-weight: 600;
	color: #101828;
}
.b2b-rev__date {
	font-size: 12px;
	color: #98a2b3;
}
.b2b-rev__comment {
	font-size: 14px;
	color: #344054;
	line-height: 1.55;
	margin: 6px 0 0;
}

/* Leave-review form */
.b2b-rev__form {
	background: linear-gradient(-180deg, #fafbfc 0%, #fff 100%);
	border: 1px solid #ececef;
	border-radius: 14px;
	padding: 22px;
}
.b2b-rev__form-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 12px;
	flex-wrap: wrap;
}
.b2b-rev__form-title {
	font-size: 16px;
	font-weight: 700;
	color: #101828;
	margin: 0;
}
.b2b-rev__rating-input {
	display: inline-flex;
	gap: 2px;
}
.b2b-rev__rating-star {
	background: transparent;
	border: none;
	color: #d0d5dd;
	font-size: 24px;
	cursor: pointer;
	padding: 2px;
	line-height: 1;
	transition: transform 0.1s ease, color 0.12s ease;
}
.b2b-rev__rating-star:hover {
	transform: scale(1.18);
}
.b2b-rev__rating-star--filled {
	color: #fbbf24;
}
.b2b-rev__form textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1.5px solid #d0d5dd;
	border-radius: 10px;
	font-size: 14px;
	font-family: inherit;
	color: #101828;
	background: #fff;
	resize: vertical;
	min-height: 100px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.b2b-rev__form textarea:focus {
	outline: none;
	border-color: #f0002a;
	box-shadow: 0 0 0 3px rgba(240, 0, 42, 0.1);
}
.b2b-rev__form textarea.is-invalid {
	border-color: #d92d20;
}
.b2b-rev__err {
	color: #d92d20;
	font-size: 12.5px;
	margin: 6px 0 0;
}
.b2b-rev__form-actions {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	margin-top: 14px;
}
.b2b-rev__signin-note {
	font-size: 12.5px;
	color: #98a2b3;
}

@media (max-width: 575px) {
	.b2b-rev__summary {
		grid-template-columns: 1fr;
		gap: 16px;
		padding: 18px;
	}
	.b2b-rev__avg-num {
		font-size: 36px;
	}
}

/* ═══════════════════════════════════════════════════════════════════
   B2B Form (conditional field groups inside the listing form)
   ═══════════════════════════════════════════════════════════════════ */
.b2b-form {
	display: flex;
	flex-direction: column;
	gap: 18px;
	margin: 18px 0;
}
.b2b-form-block {
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 14px;
	padding: 22px;
}
.b2b-form-block--note {
	background: #f0f9ff;
	border-color: #bae6fd;
	color: #075985;
	font-size: 13.5px;
}
.b2b-form-block--note p {
	margin: 0;
}
.b2b-form-block__header {
	margin-bottom: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid #ececef;
}
.b2b-form-block__title {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 16px;
	font-weight: 700;
	color: #101828;
	margin: 0 0 4px;
}
.b2b-form-block__title i {
	color: #f0002a;
	font-size: 20px;
}
.b2b-form-block__hint {
	font-size: 13px;
	color: #6b7280;
	margin: 0;
	line-height: 1.5;
}

/* Logo upload */
.b2b-logo-upload__preview {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	overflow: hidden;
	border: 1px solid #ececef;
	background: #fafbfc;
	display: flex;
	align-items: center;
	justify-content: center;
}
.b2b-logo-upload__img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}
.b2b-logo-upload__empty {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	border: 2px dashed #d0d5dd;
	background: #fafbfc;
	color: #6b7280;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	cursor: pointer;
	transition: all 0.15s ease;
	padding: 8px;
	text-align: center;
}
.b2b-logo-upload__empty:hover {
	border-color: #f0002a;
	color: #f0002a;
	background: #fff5f6;
}
.b2b-logo-upload__empty i {
	font-size: 28px;
}
.b2b-logo-upload__empty span {
	font-size: 12.5px;
	font-weight: 600;
}
.b2b-logo-upload__empty small {
	font-size: 10.5px;
	color: #98a2b3;
}
.b2b-logo-upload__actions {
	display: flex;
	gap: 6px;
	margin-top: 8px;
}
.b2b-logo-upload__btn {
	flex: 1;
	padding: 6px 10px;
	font-size: 12px;
	font-weight: 600;
	border-radius: 7px;
	background: #fff;
	border: 1px solid #d0d5dd;
	color: #475467;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	transition: all 0.15s ease;
}
.b2b-logo-upload__btn:hover:not(:disabled) {
	background: #fafbfc;
	color: #101828;
}
.b2b-logo-upload__btn--danger {
	color: #d92d20;
	border-color: #fecaca;
}
.b2b-logo-upload__btn--danger:hover:not(:disabled) {
	background: #fee2e2;
	color: #d92d20;
}

/* Bullet editor (Why Us) */
.b2b-bullet-editor__list {
	list-style: none;
	margin: 0 0 8px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.b2b-bullet-editor__row {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #fafbfc;
	border: 1px solid #ececef;
	border-radius: 9px;
	padding: 6px 8px;
	transition: border-color 0.15s ease;
}
.b2b-bullet-editor__row:focus-within {
	border-color: #f0002a;
}
.b2b-bullet-editor__check {
	width: 22px;
	height: 22px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #ecfdf5;
	color: #059669;
	border-radius: 50%;
	font-size: 14px;
	flex-shrink: 0;
}
.b2b-bullet-editor__input {
	flex: 1;
	border: none;
	background: transparent;
	font-size: 13.5px;
	color: #101828;
	outline: none;
	padding: 4px;
	min-width: 0;
}
.b2b-bullet-editor__controls {
	display: inline-flex;
	gap: 2px;
	flex-shrink: 0;
}
.b2b-bullet-editor__ctrl {
	width: 26px;
	height: 26px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 5px;
	color: #6b7280;
	font-size: 14px;
	cursor: pointer;
	transition: all 0.12s ease;
}
.b2b-bullet-editor__ctrl:hover:not(:disabled) {
	background: #fff;
	border-color: #d0d5dd;
	color: #101828;
}
.b2b-bullet-editor__ctrl:disabled {
	opacity: 0.3;
	cursor: not-allowed;
}
.b2b-bullet-editor__ctrl--danger:hover:not(:disabled) {
	color: #d92d20;
	border-color: #fecaca;
	background: #fee2e2;
}
.b2b-bullet-editor__add {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px;
	background: #fff;
	border: 1px dashed #d0d5dd;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	color: #475467;
	cursor: pointer;
	transition: all 0.15s ease;
}
.b2b-bullet-editor__add:hover:not(:disabled) {
	border-color: #f0002a;
	color: #f0002a;
	background: #fff5f6;
}
.b2b-bullet-editor__add:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}
.b2b-bullet-editor__empty {
	font-size: 12.5px;
	color: #98a2b3;
	margin: 0 0 8px;
	font-style: italic;
}

/* Album manager */
.b2b-album-mgr__grid {
	list-style: none;
	margin: 0 0 14px;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 12px;
}
.b2b-album-mgr__item {
	background: #fafbfc;
	border: 1px solid #ececef;
	border-radius: 10px;
	padding: 8px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.b2b-album-mgr__media {
	position: relative;
	aspect-ratio: 4 / 3;
	background: #f1f5f9;
	border-radius: 7px;
	overflow: hidden;
}
.b2b-album-mgr__img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}
.b2b-album-mgr__video-thumb {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	background: linear-gradient(-135deg, #1e293b 0%, #334155 100%);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
}
.b2b-album-mgr__video-thumb i {
	font-size: 32px;
}
.b2b-album-mgr__type-badge {
	position: absolute;
	top: 6px;
	right: 6px;
	width: 24px;
	height: 24px;
	background: rgba(255, 255, 255, 0.95);
	color: #f0002a;
	border-radius: 6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
}
[dir="rtl"] .b2b-album-mgr__type-badge {
	right: auto;
	left: 6px;
}
.b2b-album-mgr__caption,
.b2b-album-mgr__url-input {
	width: 100%;
	padding: 6px 8px;
	border: 1px solid #ececef;
	border-radius: 6px;
	background: #fff;
	font-size: 12px;
	color: #344054;
	transition: border-color 0.15s ease;
	font-family: inherit;
}
.b2b-album-mgr__caption:focus,
.b2b-album-mgr__url-input:focus {
	outline: none;
	border-color: #f0002a;
}
.b2b-album-mgr__controls {
	display: flex;
	gap: 4px;
	justify-content: flex-end;
}
.b2b-album-mgr__ctrl {
	width: 26px;
	height: 26px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 5px;
	color: #475467;
	cursor: pointer;
	font-size: 13px;
	transition: all 0.12s ease;
}
.b2b-album-mgr__ctrl:hover:not(:disabled) {
	border-color: #f0002a;
	color: #f0002a;
}
.b2b-album-mgr__ctrl:disabled {
	opacity: 0.4;
	cursor: not-allowed;
}
.b2b-album-mgr__ctrl--danger:hover:not(:disabled) {
	border-color: #fecaca;
	background: #fee2e2;
	color: #d92d20;
}
.b2b-album-mgr__empty {
	font-size: 13px;
	color: #98a2b3;
	margin: 0 0 12px;
	padding: 18px;
	background: #fafbfc;
	border: 1px dashed #d0d5dd;
	border-radius: 9px;
	text-align: center;
	font-style: italic;
}
.b2b-album-mgr__actions {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	align-items: center;
}
.b2b-album-mgr__btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 9px 16px;
	background: #f0002a;
	border: 1px solid #f0002a;
	border-radius: 8px;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.15s ease;
}
.b2b-album-mgr__btn:hover:not(:disabled) {
	background: #d10024;
	border-color: #d10024;
}
.b2b-album-mgr__btn--secondary {
	background: #fff;
	color: #f0002a;
}
.b2b-album-mgr__btn--secondary:hover:not(:disabled) {
	background: #fff5f6;
}
.b2b-album-mgr__btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}
.b2b-album-mgr__video-input {
	display: flex;
	gap: 8px;
	flex: 1;
	min-width: 220px;
}
.b2b-album-mgr__video-input-field {
	flex: 1;
	padding: 9px 12px;
	border: 1px solid #d0d5dd;
	border-radius: 8px;
	font-size: 13px;
	font-family: inherit;
}
.b2b-album-mgr__video-input-field:focus {
	outline: none;
	border-color: #f0002a;
}

/* Catalog manager */
.b2b-catalog-mgr__list {
	list-style: none;
	margin: 0 0 18px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.b2b-catalog-mgr__row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 14px;
	background: #fafbfc;
	border: 1px solid #ececef;
	border-radius: 9px;
}
.b2b-catalog-mgr__row-icon {
	width: 36px;
	height: 36px;
	background: #fff;
	border-radius: 8px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	color: #f0002a;
	flex-shrink: 0;
}
.b2b-catalog-mgr__row-cover {
	width: 56px;
	height: 72px;
	flex-shrink: 0;
	border-radius: 6px;
	overflow: hidden;
	background: #fff;
	border: 1px solid #ececef;
	display: flex;
	align-items: center;
	justify-content: center;
}
.b2b-catalog-mgr__row-cover-img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}
.b2b-catalog-mgr__row-cover-fallback {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: linear-gradient(-180deg, #fef2f2, #fff);
	color: #b91c1c;
	font-size: 28px;
}
.b2b-catalog-mgr__staged {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 10px;
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 8px;
	font-size: 13px;
	color: #475467;
	margin-bottom: 10px;
	max-width: 100%;
}
.b2b-catalog-mgr__staged i {
	color: #b91c1c;
	font-size: 18px;
}
.b2b-catalog-mgr__staged-link {
	color: #475467;
	text-decoration: none;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 320px;
	flex: 1;
}
.b2b-catalog-mgr__staged-link:hover {
	color: #f0002a;
}
.b2b-catalog-mgr__staged-clear {
	width: 24px;
	height: 24px;
	border-radius: 6px;
	border: none;
	background: transparent;
	color: #98a2b3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	font-size: 16px;
}
.b2b-catalog-mgr__staged-clear:hover {
	background: #fee2e2;
	color: #b91c1c;
}
.b2b-catalog-mgr__progress {
	position: relative;
	height: 18px;
	background: #f1f3f5;
	border-radius: 9px;
	overflow: hidden;
	margin-bottom: 10px;
}
.b2b-catalog-mgr__progress-bar {
	position: absolute;
	inset: 0 auto 0 0;
	background: linear-gradient(-90deg, #f0002a, #ff5773);
	transition: width 0.15s ease-out;
}
.b2b-catalog-mgr__progress-label {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: 600;
	color: #fff;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
	letter-spacing: 0.02em;
}
.b2b-catalog-mgr__cover-block {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid #ececef;
}
.b2b-catalog-mgr__cover-label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #344054;
	margin-bottom: 4px;
}
.b2b-catalog-mgr__cover-hint {
	font-size: 12.5px;
	color: #667085;
	margin: 0 0 10px;
}
.b2b-catalog-mgr__row-body {
	flex: 1;
	min-width: 0;
}
.b2b-catalog-mgr__row-title {
	font-size: 13.5px;
	font-weight: 600;
	color: #101828;
}
.b2b-catalog-mgr__row-meta {
	font-size: 12px;
	color: #6b7280;
	display: flex;
	gap: 12px;
	margin-top: 2px;
}
.b2b-catalog-mgr__row-btn {
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 6px;
	color: #475467;
	font-size: 16px;
	cursor: pointer;
	transition: all 0.12s ease;
	text-decoration: none;
}
.b2b-catalog-mgr__row-btn:hover {
	border-color: #f0002a;
	color: #f0002a;
}
.b2b-catalog-mgr__row-btn--danger:hover {
	border-color: #fecaca;
	background: #fee2e2;
	color: #d92d20;
}
.b2b-catalog-mgr__empty {
	font-size: 13px;
	color: #98a2b3;
	margin: 0 0 14px;
	font-style: italic;
}
.b2b-catalog-mgr__draft {
	background: #fafbfc;
	border: 1px dashed #d0d5dd;
	border-radius: 12px;
	padding: 14px;
}
.b2b-catalog-mgr__draft-title {
	font-size: 13.5px;
	font-weight: 700;
	color: #101828;
	margin: 0 0 10px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.b2b-catalog-mgr__draft-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	margin-bottom: 10px;
}
.b2b-catalog-mgr__draft-row input {
	padding: 8px 10px;
	border: 1px solid #d0d5dd;
	border-radius: 7px;
	font-size: 13px;
	font-family: inherit;
}
.b2b-catalog-mgr__draft-row input:focus {
	outline: none;
	border-color: #f0002a;
}
.b2b-catalog-mgr__draft-uploads {
	display: flex;
	gap: 10px;
	margin-bottom: 10px;
	flex-wrap: wrap;
}
.b2b-catalog-mgr__upload-actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-top: 8px;
}
.b2b-catalog-mgr__upload-btn {
	flex: 1;
	min-width: 160px;
	padding: 9px 14px;
	background: #fff;
	border: 1px solid #d0d5dd;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	color: #475467;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	transition: all 0.15s ease;
}
.b2b-catalog-mgr__upload-btn:hover:not(:disabled) {
	border-color: #f0002a;
	color: #f0002a;
}
.b2b-catalog-mgr__upload-btn--primary {
	background: #f0002a;
	border-color: #f0002a;
	color: #fff;
}
.b2b-catalog-mgr__upload-btn--primary:hover:not(:disabled) {
	background: #d8001f;
	border-color: #d8001f;
	color: #fff;
}
.b2b-catalog-mgr__upload-btn:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}
.b2b-catalog-mgr__save {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 9px 16px;
	background: #f0002a;
	border: 1px solid #f0002a;
	border-radius: 8px;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.15s ease;
}
.b2b-catalog-mgr__save:hover:not(:disabled) {
	background: #d10024;
	border-color: #d10024;
}
.b2b-catalog-mgr__save:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Slot-availability notification card — sits just above the admin
   toggles, tells the operator how many sponsor slots are left in the
   current listing's category (we sell 6 per category as a promise).
   Tone shifts colour: ok (green-ish) → warn (amber) → full (red). */
.b2b-form-slots {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 12px 14px;
	border-radius: 10px;
	margin-bottom: 14px;
	border: 1px solid transparent;
}
.b2b-form-slots i {
	font-size: 22px;
	line-height: 1;
	flex-shrink: 0;
}
.b2b-form-slots__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.b2b-form-slots__title {
	font-size: 13px;
	font-weight: 700;
	line-height: 1.3;
}
.b2b-form-slots__hint {
	font-size: 12px;
	line-height: 1.4;
}
.b2b-form-slots--ok {
	background: #ecfdf5;
	border-color: #a7f3d0;
	color: #047857;
}
.b2b-form-slots--warn {
	background: #fffbeb;
	border-color: #fde68a;
	color: #b45309;
}
.b2b-form-slots--full {
	background: #fef2f2;
	border-color: #fecaca;
	color: #b91c1c;
}

/* Admin toggles */
.b2b-form-toggles {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.b2b-form-toggle {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	background: #fafbfc;
	border: 1px solid #ececef;
	border-radius: 9px;
	cursor: pointer;
	transition: border-color 0.15s ease;
}
.b2b-form-toggle:hover {
	border-color: #d0d5dd;
}
.b2b-form-toggle input[type="checkbox"] {
	width: 18px;
	height: 18px;
	accent-color: #f0002a;
	cursor: pointer;
}
.b2b-form-toggle__label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	font-weight: 600;
	color: #101828;
}
.b2b-form-toggle__label i {
	color: #f0002a;
	font-size: 18px;
}

/* WhatsApp meta-link in the B2B hero — green accent on hover so the
   contact channel is recognizable at a glance, matching the WhatsApp brand. */
.b2b-hero__meta-wa i {
	color: #25d366;
}
.b2b-hero__meta-wa:hover {
	color: #25d366;
}

/* "Pending verification" pill — light tomato treatment, matched to the
   slate / red trust row in the Overview so the hero pill + side badge
   read as the same signal. */
.b2b-hero__not-verified {
	color: #b91c1c;
	background: #fef2f2;
	border-color: #fecaca !important;
}
.b2b-hero__not-verified i {
	color: #dc2626;
}
.b2b-trust__not-verified {
	background: linear-gradient(-135deg, #fef3c7 0%, #fde68a 100%);
	border: 1px solid #fcd34d;
}
.b2b-trust__not-verified > i {
	color: #d97706;
}

/* ═══════════════════════════════════════════════════════════════════
   Listing Form layout — sticky left rail + section wrappers
   Mirrors the B2B landing-page pattern so editing a listing feels
   structurally familiar to viewing one.
   ═══════════════════════════════════════════════════════════════════ */

.lf-layout {
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: 28px;
	align-items: start;
	margin-top: 12px;
}

.lf-main {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 22px;
}

/* ── Left rail (sticky scroll-spy) ───────────────────────────────── */
.lf-rail {
	position: sticky;
	top: 24px;
	align-self: start;
}
.lf-rail__list {
	list-style: none;
	margin: 0;
	padding: 8px;
	background: #ffffff;
	border: 1px solid #ececef;
	border-radius: 14px;
	box-shadow: 0 2px 8px -4px rgba(16, 24, 40, 0.04);
	margin-top:90px;
}
.lf-rail__item {
	margin: 0;
	padding: 0;
}
.lf-rail__link {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 10px 12px;
	background: transparent;
	border: none;
	border-radius: 10px;
	font-size: 13.5px;
	font-weight: 500;
	color: #475467;
	text-align: start;
	cursor: pointer;
	transition: all 0.15s ease;
}
.lf-rail__link:hover {
	background: #fafbfc;
	color: #101828;
}
.lf-rail__link--active {
	background: #fff5f6;
	color: #f0002a;
	font-weight: 600;
}
.lf-rail__icon {
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #98a2b3;
	transition: color 0.15s ease;
	font-size: 16px;
}
.lf-rail__link:hover .lf-rail__icon,
.lf-rail__link--active .lf-rail__icon {
	color: #f0002a;
}
.lf-rail__label {
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ── Form section card ───────────────────────────────────────────── */
.lf-form-section {
	background: #ffffff;
	border: 1px solid #ececef;
	border-radius: 16px;
	padding: 24px;
	scroll-margin-top: 90px;
	box-shadow: 0 1px 3px rgba(16, 24, 40, 0.03);
}
.lf-form-section__header {
	margin-bottom: 18px;
	padding-bottom: 14px;
	border-bottom: 1px solid #ececef;
}
.lf-form-section__title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 16px;
	font-weight: 700;
	color: #101828;
	margin: 0 0 4px;
	letter-spacing: -0.01em;
}
.lf-form-section__icon {
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #fff5f6;
	color: #f0002a;
	border-radius: 9px;
	font-size: 18px;
	flex-shrink: 0;
}
.lf-form-section__hint {
	font-size: 13px;
	color: #6b7280;
	margin: 0;
	line-height: 1.5;
	margin-inline-start: 42px;
}
.lf-form-section__body {
	min-width: 0;
}

/* Catalog "save the listing first" note (no section header here, sits
   inline as a soft inform card). */
.lf-catalogs-note {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 16px;
	background: #f0f9ff;
	border: 1px solid #bae6fd;
	border-radius: 10px;
	color: #075985;
	font-size: 13.5px;
}
.lf-catalogs-note i {
	font-size: 18px;
	color: #0284c7;
}

/* Submit button bar — full-width below the layout grid. */
.lf-form-submit {
	margin-top: 24px;
	display: flex;
	justify-content: flex-end;
	gap: 12px;
}
.lf-form-submit > * {
	margin-bottom: 0 !important;
}

/* ── Floating action panel for the blog & listing editors ──────────
 * Pinned to the bottom-right of the viewport so Save / Back /
 * Unpublish are always one click away while scrolling long forms. */
.edit-actions {
	position: fixed;
	bottom: 24px;
	inset-inline-end: 24px;
	z-index: 1020;
	width: 200px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 10px;
	background: #ffffff;
	border: 1px solid #e4e7eb;
	border-radius: 12px;
	box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}

/* Single button system inside the panel — every child uses the same
 * size, padding, border-radius, and typography. Variants only swap
 * colors. */
.edit-actions__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	height: 38px;
	padding: 0 12px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	border-radius: 8px;
	border: 1px solid transparent;
	background: transparent;
	color: #1f2937;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease,
		color 0.15s ease;
}
.edit-actions__btn:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}
.edit-actions__btn i {
	font-size: 15px;
	line-height: 1;
}

/* Ghost — Back to Blog */
.edit-actions__btn--ghost {
	color: #475467;
	border-color: transparent;
}
.edit-actions__btn--ghost:hover:not(:disabled) {
	background: #f3f4f6;
	color: #101828;
}

/* Primary — Save changes / Publish */
.edit-actions__btn--primary {
	background: #1d4ed8;
	border-color: #1d4ed8;
	color: #ffffff;
}
.edit-actions__btn--primary:hover:not(:disabled) {
	background: #1e40af;
	border-color: #1e40af;
	color: #ffffff;
}

/* Success — Admin one-click Approve (no validation pass). */
.edit-actions__btn--success {
	background: #16a34a;
	border-color: #16a34a;
	color: #ffffff;
}
.edit-actions__btn--success:hover:not(:disabled) {
	background: #15803d;
	border-color: #15803d;
	color: #ffffff;
}

/* Warning — Unpublish to draft (visible action on a published post) */
.edit-actions__btn--warning {
	background: #fffbeb;
	border-color: #fcd34d;
	color: #92400e;
}
.edit-actions__btn--warning:hover:not(:disabled) {
	background: #fef3c7;
	border-color: #f59e0b;
	color: #78350f;
}

/* Neutral — Save as draft (when editing a draft) */
.edit-actions__btn--neutral {
	background: #ffffff;
	border-color: #d1d5db;
	color: #374151;
}
.edit-actions__btn--neutral:hover:not(:disabled) {
	background: #f9fafb;
	border-color: #9ca3af;
	color: #111827;
}

/* Mobile: drop the floating card; pin a horizontal bar to the top. */
@media (max-width: 991px) {
	.edit-actions {
		position: sticky;
		top: 0;
		bottom: auto;
		inset-inline-end: auto;
		width: auto;
		flex-direction: row;
		flex-wrap: wrap;
		margin: 0 0 16px;
		border-radius: 10px;
	}
	.edit-actions__btn {
		flex: 1 1 auto;
		min-width: 110px;
	}
}

/* ── Responsive: rail collapses to top horizontal pill bar ───────── */
@media (max-width: 991px) {
	.lf-layout {
		grid-template-columns: 1fr;
		gap: 16px;
	}
	.lf-rail {
		position: static;
	}
	.lf-rail__list {
		display: flex;
		gap: 6px;
		padding: 6px;
		overflow-x: auto;
		scrollbar-width: none;
	}
	.lf-rail__list::-webkit-scrollbar {
		display: none;
	}
	.lf-rail__link {
		white-space: nowrap;
		padding: 8px 12px;
	}
	.lf-rail__label {
		max-width: 160px;
	}
}
@media (max-width: 575px) {
	.lf-form-section {
		padding: 18px 14px;
		border-radius: 12px;
	}
	.lf-form-section__hint {
		margin-inline-start: 0;
	}
	.lf-form-section__icon {
		width: 28px;
		height: 28px;
		font-size: 16px;
	}
}

/* ═══════════════════════════════════════════════════════════════════
   Dashboard — Quotations (list + detail)
   ═══════════════════════════════════════════════════════════════════ */

/* Status-tinted dashboard tabs (extends the existing .dlp-tab styles). */
.dlp-tab--new {
	color: #475467;
}
.dlp-tab--new.dlp-tab--active {
	color: #f0002a;
}
.dlp-tab--replied .dlp-tab__count {
	background: #dbeafe;
	color: #1d4ed8;
}
.dlp-tab--closed .dlp-tab__count {
	background: #ecfdf5;
	color: #059669;
}

/* ── Status pills ──────────────────────────────────────────────── */
.dq-status-pill {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 11.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	white-space: nowrap;
}
.dq-status-pill i {
	font-size: 13px;
}
.dq-status-pill--new {
	background: #fff5f6;
	color: #f0002a;
}
.dq-status-pill--replied {
	background: #dbeafe;
	color: #1d4ed8;
}
.dq-status-pill--closed {
	background: #ecfdf5;
	color: #059669;
}

/* ── List rows ─────────────────────────────────────────────────── */
.dq-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 16px;
}
.dq-row {
	display: grid;
	grid-template-columns: 110px 1.4fr 1.2fr 2fr 140px auto;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 10px;
	text-decoration: none;
	color: inherit;
	transition: all 0.15s ease;
}
.dq-row:hover {
	border-color: #d0d5dd;
	background: #fafbfc;
	transform: translateY(-1px);
	box-shadow: 0 6px 14px -8px rgba(16, 24, 40, 0.08);
	color: inherit;
	text-decoration: none;
}
.dq-row--new {
	border-color: #ffe4e6;
	background: #fffbfb;
}
.dq-row__buyer-name {
	font-size: 14px;
	font-weight: 600;
	color: #101828;
	margin-bottom: 4px;
	line-height: 1.3;
}
.dq-row__buyer-company {
	color: #6b7280;
	font-weight: 500;
}
.dq-row__buyer-meta {
	display: flex;
	flex-direction: column;
	gap: 2px;
	font-size: 12px;
	color: #6b7280;
}
.dq-row__buyer-meta span {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.dq-row__buyer-meta i {
	font-size: 13px;
}
.dq-row__listing {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: #344054;
	min-width: 0;
}
.dq-row__listing i {
	color: #98a2b3;
	flex-shrink: 0;
}
.dq-row__listing-title {
	font-weight: 500;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.dq-row__listing-missing {
	color: #b45309;
	font-style: italic;
}
.dq-row__msg {
	min-width: 0;
}
.dq-row__product {
	display: inline-block;
	margin-bottom: 4px;
	padding: 2px 8px;
	background: #f1f5f9;
	border-radius: 6px;
	font-size: 11.5px;
	font-weight: 600;
	color: #475467;
}
.dq-row__msg-text {
	display: block;
	font-size: 13px;
	color: #344054;
	line-height: 1.5;
}
.dq-row__date {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: #6b7280;
	white-space: nowrap;
}
.dq-row__chev {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #d0d5dd;
	font-size: 18px;
	transition: color 0.15s ease;
}
.dq-row:hover .dq-row__chev {
	color: #f0002a;
}
[dir="rtl"] .dq-row__chev {
	transform: rotate(-180deg);
}

/* Per-row action buttons in /dashboard/quotations.
   Reply (WhatsApp green) deep-links wa.me/<buyerPhone>; Forward (blue)
   deep-links wa.me/<supplierPhone> with the full lead pre-filled. Buttons
   sit alongside the navigation chevron in the last grid column. */
.dq-row__actions {
	display: flex;
	align-items: center;
	gap: 6px;
	justify-content: flex-end;
}
.dq-action {
	width: 36px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 9px;
	font-size: 17px;
	color: #fff;
	cursor: pointer;
	text-decoration: none;
	transition: transform 0.12s ease, background 0.12s ease,
		box-shadow 0.12s ease;
}
.dq-action:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 10px -4px rgba(16, 24, 40, 0.18);
	text-decoration: none;
	color: #fff;
}
.dq-action:focus-visible {
	outline: 2px solid #1a73e8;
	outline-offset: 2px;
}
.dq-action--reply {
	background: #25d366;
}
.dq-action--reply:hover {
	background: #1ebe5d;
}
.dq-action--forward {
	background: #2563eb;
}
.dq-action--forward:hover {
	background: #1d4ed8;
}

/* ── Empty state ───────────────────────────────────────────────── */
.dq-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 56px 24px;
	background: #fff;
	border: 2px dashed #d0d5dd;
	border-radius: 14px;
	margin-top: 16px;
}
.dq-empty__icon {
	width: 64px;
	height: 64px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fafbfc;
	border-radius: 16px;
	color: #f0002a;
	font-size: 30px;
	margin-bottom: 14px;
}
.dq-empty h3 {
	font-size: 17px;
	font-weight: 700;
	color: #101828;
	margin: 0 0 6px;
}
.dq-empty p {
	font-size: 14px;
	color: #6b7280;
	margin: 0;
	max-width: 400px;
	line-height: 1.55;
}

/* ── Search ────────────────────────────────────────────────────── */
.dq-search {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-width: 260px;
}
.dq-search__icon {
	position: absolute;
	inset-inline-start: 10px;
	color: #98a2b3;
	font-size: 16px;
	pointer-events: none;
}
.dq-search__input {
	width: 100%;
	padding: 9px 36px;
	background: #fff;
	border: 1px solid #d0d5dd;
	border-radius: 8px;
	font-size: 13.5px;
	color: #101828;
	font-family: inherit;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.dq-search__input:focus {
	outline: none;
	border-color: #f0002a;
	box-shadow: 0 0 0 3px rgba(240, 0, 42, 0.08);
}
.dq-search__clear {
	position: absolute;
	inset-inline-end: 6px;
	width: 24px;
	height: 24px;
	background: transparent;
	border: none;
	color: #98a2b3;
	cursor: pointer;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.dq-search__clear:hover {
	color: #101828;
	background: #f1f5f9;
}

/* ── Pagination + summary ───────────────────────────────────────── */
.dq-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: 24px;
}
.dq-pagination__btn {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 8px 14px;
	background: #fff;
	border: 1px solid #d0d5dd;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	color: #475467;
	text-decoration: none;
	transition: all 0.15s ease;
}
.dq-pagination__btn:hover {
	border-color: #f0002a;
	color: #f0002a;
}
.dq-pagination__info {
	font-size: 13px;
	color: #6b7280;
}
.dq-summary {
	margin-top: 12px;
	font-size: 12.5px;
	color: #98a2b3;
	text-align: center;
}

/* ── Detail page ───────────────────────────────────────────────── */
.dq-detail__header {
	margin-bottom: 20px;
}
.dq-back {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 13px;
	color: #6b7280;
	text-decoration: none;
	margin-bottom: 12px;
	transition: color 0.15s ease;
}
.dq-back:hover {
	color: #f0002a;
}
[dir="rtl"] .dq-back i {
	transform: rotate(-180deg);
}
.dq-detail__title {
	font-size: 26px;
	font-weight: 700;
	color: #101828;
	margin: 0 0 8px;
	letter-spacing: -0.01em;
}
.dq-detail__sub {
	display: flex;
	gap: 16px;
	font-size: 13px;
	color: #6b7280;
}
.dq-detail__sub span {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.dq-detail__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-top: 18px;
}
.dq-card {
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 12px;
	padding: 18px;
}
.dq-card--wide {
	grid-column: 1 / -1;
}
.dq-card__header {
	margin-bottom: 14px;
	padding-bottom: 10px;
	border-bottom: 1px solid #ececef;
}
.dq-card__title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 700;
	color: #101828;
	margin: 0;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.dq-card__title i {
	color: #f0002a;
	font-size: 16px;
}
.dq-card__empty {
	color: #98a2b3;
	font-style: italic;
	margin: 0;
}
.dq-fields {
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
}
.dq-fields > div {
	display: grid;
	grid-template-columns: 130px 1fr;
	gap: 10px;
	align-items: baseline;
}
.dq-fields dt {
	font-size: 12.5px;
	font-weight: 600;
	color: #6b7280;
	margin: 0;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}
.dq-fields dd {
	margin: 0;
	font-size: 14px;
	color: #101828;
	font-weight: 500;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}
.dq-link {
	color: #f0002a;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.dq-link:hover {
	color: #d10024;
	text-decoration: underline;
}
.dq-wa {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	background: #ecfdf5;
	color: #25d366;
	border-radius: 6px;
	text-decoration: none;
	transition: all 0.15s ease;
}
.dq-wa:hover {
	background: #25d366;
	color: #fff;
}

/* Inquiry message */
.dq-message {
	margin-top: 14px;
	padding: 14px;
	background: #fafbfc;
	border: 1px solid #ececef;
	border-radius: 10px;
}
.dq-message__label {
	font-size: 11.5px;
	font-weight: 700;
	color: #6b7280;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: 8px;
}
.dq-message__body {
	font-size: 14.5px;
	color: #101828;
	line-height: 1.65;
	white-space: pre-wrap;
}
.dq-attachment {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	margin-top: 12px;
	background: #fff;
	border: 1px solid #d0d5dd;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	color: #475467;
	text-decoration: none;
}
.dq-attachment:hover {
	border-color: #f0002a;
	color: #f0002a;
}

/* Status updater */
.dq-status-updater {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	background: #fff;
	border: 1px solid #ececef;
	border-radius: 12px;
	padding: 12px 14px;
	margin-bottom: 16px;
}
.dq-status-updater__group {
	display: inline-flex;
	gap: 4px;
	background: #fafbfc;
	border-radius: 9px;
	padding: 4px;
}
.dq-status-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 7px 14px;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 7px;
	font-size: 12.5px;
	font-weight: 600;
	color: #6b7280;
	cursor: pointer;
	transition: all 0.15s ease;
}
.dq-status-btn i {
	font-size: 14px;
}
.dq-status-btn:hover:not(:disabled) {
	color: #101828;
}
.dq-status-btn--active.dq-status-btn--new {
	background: #fff5f6;
	color: #f0002a;
	border-color: #ffe4e6;
}
.dq-status-btn--active.dq-status-btn--replied {
	background: #dbeafe;
	color: #1d4ed8;
	border-color: #bfdbfe;
}
.dq-status-btn--active.dq-status-btn--closed {
	background: #ecfdf5;
	color: #059669;
	border-color: #a7f3d0;
}
.dq-delete-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 7px 14px;
	background: #fff;
	border: 1px solid #fecaca;
	border-radius: 8px;
	font-size: 12.5px;
	font-weight: 600;
	color: #d92d20;
	cursor: pointer;
	transition: all 0.15s ease;
}
.dq-delete-btn:hover:not(:disabled) {
	background: #fee2e2;
}

/* Quick reply card */
.dq-quick-reply {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}
.dq-quick-reply__btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 18px;
	border-radius: 8px;
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none;
	transition: all 0.15s ease;
}
.dq-quick-reply__btn--email {
	background: #f0002a;
	color: #fff;
	border: 1px solid #f0002a;
}
.dq-quick-reply__btn--email:hover {
	background: #d10024;
	border-color: #d10024;
	color: #fff;
}
.dq-quick-reply__btn--wa {
	background: #fff;
	color: #25d366;
	border: 1px solid #25d366;
}
.dq-quick-reply__btn--wa:hover {
	background: #25d366;
	color: #fff;
}

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 991px) {
	.dq-row {
		grid-template-columns: 1fr;
		gap: 8px;
	}
	.dq-row__chev {
		display: none;
	}
	.dq-detail__grid {
		grid-template-columns: 1fr;
	}
	.dq-fields > div {
		grid-template-columns: 1fr;
		gap: 2px;
	}
	.dq-status-updater {
		flex-direction: column;
		align-items: stretch;
	}
}

/* ───── Listing chooser (entry-point split) ───── */
.listing-chooser__intro {
	max-width: 720px;
	margin: 0 auto 48px;
	text-align: center;
}
.listing-chooser__intro h2 {
	font-size: 32px;
	font-weight: 700;
	margin-bottom: 12px;
	color: #101828;
}
.listing-chooser__intro p {
	font-size: 16px;
	color: #667085;
	margin: 0;
}
.listing-chooser__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	gap: 24px;
	max-width: 960px;
	margin: 0 auto;
}
.listing-chooser__card {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 32px 28px;
	background: #fff;
	border: 1px solid #eaecf0;
	border-radius: 18px;
	text-decoration: none;
	color: inherit;
	transition: transform 0.18s ease, box-shadow 0.18s ease,
		border-color 0.18s ease;
	position: relative;
	overflow: hidden;
}
.listing-chooser__card::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 4px;
	background: linear-gradient(-90deg, #f0002a, #ff5773);
	opacity: 0;
	transition: opacity 0.18s ease;
}
.listing-chooser__card:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 36px rgba(15, 23, 42, 0.08);
	border-color: rgba(240, 0, 42, 0.35);
	color: inherit;
}
.listing-chooser__card:hover::before {
	opacity: 1;
}
.listing-chooser__icon {
	width: 56px;
	height: 56px;
	border-radius: 14px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 28px;
	color: #f0002a;
	background: rgba(240, 0, 42, 0.08);
}
.listing-chooser__card--b2b .listing-chooser__icon {
	color: #2563eb;
	background: rgba(37, 99, 235, 0.08);
}
.listing-chooser__title {
	font-size: 22px;
	font-weight: 700;
	margin: 0;
	color: #101828;
}
.listing-chooser__hint {
	font-size: 15px;
	line-height: 1.55;
	color: #475467;
	margin: 0;
}
.listing-chooser__points {
	list-style: none;
	padding: 0;
	margin: 4px 0 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.listing-chooser__points li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	color: #344054;
	line-height: 1.45;
}
.listing-chooser__points i {
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: rgba(16, 185, 129, 0.12);
	color: #059669;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	margin-top: 1px;
}
.listing-chooser__cta {
	margin-top: auto;
	padding-top: 8px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
	font-size: 15px;
	color: #f0002a;
}
.listing-chooser__card--b2b .listing-chooser__cta {
	color: #2563eb;
}
.listing-chooser__cta i {
	transition: transform 0.18s ease;
}
.listing-chooser__card:hover .listing-chooser__cta i {
	transform: translateX(-4px);
}
[dir="rtl"] .listing-chooser__card:hover .listing-chooser__cta i {
	transform: translateX(4px);
}
[dir="rtl"] .listing-chooser__cta i {
	transform: scaleX(-1);
}
@media (max-width: 575px) {
	.listing-chooser__intro h2 {
		font-size: 26px;
	}
	.listing-chooser__card {
		padding: 26px 22px;
	}
}

/* ── Admin analytics dashboard ───────────────────────────────────── */
.dashboard-analytics-page .da-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 16px;
	margin-bottom: 24px;
	flex-wrap: wrap;
}
.dashboard-analytics-page .da-title {
	font-size: 24px;
	font-weight: 700;
	color: #101828;
	margin: 0 0 4px;
}
.dashboard-analytics-page .da-subtitle {
	font-size: 14px;
	color: #667085;
	margin: 0;
}

.da-range {
	display: inline-flex;
	background: #f2f4f7;
	border-radius: 10px;
	padding: 4px;
	gap: 2px;
}
.da-range__btn {
	padding: 8px 14px;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 500;
	color: #475467;
	text-decoration: none;
	transition: all 0.15s;
}
.da-range__btn:hover {
	color: #101828;
}
.da-range__btn--active {
	background: #fff;
	color: #101828;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.da-kpi-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 14px;
	margin-bottom: 24px;
}
.da-kpi {
	background: #fff;
	border: 1px solid #eef0f4;
	border-radius: 12px;
	padding: 16px;
	display: flex;
	gap: 12px;
	align-items: flex-start;
}
.da-kpi__icon {
	width: 40px;
	height: 40px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	flex-shrink: 0;
}
.da-kpi--blue .da-kpi__icon {
	background: #eff6ff;
	color: #2563eb;
}
.da-kpi--violet .da-kpi__icon {
	background: #f5f3ff;
	color: #7c3aed;
}
.da-kpi--green .da-kpi__icon {
	background: #ecfdf5;
	color: #16a34a;
}
.da-kpi--amber .da-kpi__icon {
	background: #fffbeb;
	color: #d97706;
}
.da-kpi__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.da-kpi__label {
	font-size: 12px;
	color: #667085;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.4px;
}
.da-kpi__value {
	font-size: 24px;
	color: #101828;
	font-weight: 700;
	line-height: 1.2;
}

.da-trend {
	background: #fff;
	border: 1px solid #eef0f4;
	border-radius: 12px;
	padding: 18px;
	margin-bottom: 24px;
}
.da-trend__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 14px;
	gap: 12px;
	flex-wrap: wrap;
}
.da-trend__title {
	font-size: 15px;
	font-weight: 600;
	color: #101828;
	margin: 0;
}
.da-trend__tabs {
	display: inline-flex;
	gap: 4px;
	flex-wrap: wrap;
}
.da-trend__tab {
	background: none;
	border: 1px solid transparent;
	padding: 6px 12px;
	font-size: 12px;
	font-weight: 500;
	color: #667085;
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.15s;
}
.da-trend__tab:hover {
	background: #f9fafb;
	color: #101828;
}
.da-trend__tab--active {
	background: #f9fafb;
	border-color: #eef0f4;
	font-weight: 600;
}
.da-trend__svg {
	width: 100%;
	height: auto;
	display: block;
}
.da-trend__empty {
	font-size: 14px;
	color: #98a2b3;
	text-align: center;
	padding: 40px 0;
	margin: 0;
}

.da-top {
	background: #fff;
	border: 1px solid #eef0f4;
	border-radius: 12px;
	padding: 18px;
}
.da-top__head {
	margin-bottom: 14px;
}
.da-top__title {
	font-size: 15px;
	font-weight: 600;
	color: #101828;
	margin: 0 0 4px;
}
.da-top__subtitle {
	font-size: 13px;
	color: #667085;
	margin: 0;
}
.da-top__empty {
	font-size: 14px;
	color: #98a2b3;
	text-align: center;
	padding: 28px 0;
	margin: 0;
}
.da-top__table-wrap {
	overflow-x: auto;
}
.da-top__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}
.da-top__table thead th {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	color: #98a2b3;
	font-weight: 600;
	padding: 8px 10px;
	border-bottom: 1px solid #eef0f4;
	text-align: start;
}
.da-top__th-metric {
	text-align: end !important;
}
.da-top__th-metric--active {
	color: #101828;
}
.da-top__sort-link {
	color: inherit;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.da-top__sort-link:hover {
	color: #101828;
}
.da-top__table tbody td {
	padding: 10px;
	border-bottom: 1px solid #f2f4f7;
	color: #475467;
}
.da-top__table tbody tr:last-child td {
	border-bottom: none;
}
.da-top__td-metric {
	text-align: end;
	font-variant-numeric: tabular-nums;
	color: #667085;
}
.da-top__td-metric--active {
	color: #101828;
	font-weight: 600;
}
.da-top__td-listing {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 200px;
}
.da-top__listing-link {
	color: #101828;
	font-weight: 500;
	text-decoration: none;
}
.da-top__listing-link:hover {
	color: #f0002a;
}
.da-top__listing-meta {
	font-size: 11px;
	color: #98a2b3;
}

@media (max-width: 767px) {
	.dashboard-analytics-page .da-header {
		flex-direction: column;
		align-items: stretch;
	}
	.da-kpi__value {
		font-size: 20px;
	}
}

/* ── Outbound link interstitial (single-tab + warning) ───────────── */
.outbound-modal {
	position: fixed;
	inset: 0;
	z-index: 1080;
	background: rgba(15, 23, 42, 0.55);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
}
.outbound-modal__panel {
	background: #ffffff;
	border-radius: 14px;
	max-width: 460px;
	width: 100%;
	padding: 28px 24px;
	box-shadow: 0 20px 50px rgba(15, 23, 42, 0.25);
	text-align: center;
}
.outbound-modal__icon {
	width: 56px;
	height: 56px;
	margin: 0 auto 16px;
	border-radius: 50%;
	background: #fff7e6;
	color: #d46b08;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 26px;
}
.outbound-modal__title {
	font-size: 18px;
	font-weight: 600;
	margin: 0 0 8px;
	color: #111827;
}
.outbound-modal__body {
	margin: 0 0 12px;
	color: #4b5563;
	font-size: 14px;
	line-height: 1.5;
}
.outbound-modal__url {
	margin: 0 0 12px;
	padding: 8px 12px;
	background: #f3f4f6;
	border-radius: 8px;
	font-family: ui-monospace, SFMono-Regular, monospace;
	font-size: 12px;
	color: #1f2937;
	word-break: break-all;
}
.outbound-modal__notice {
	margin: 0 0 18px;
	padding: 8px 12px;
	background: #eff6ff;
	border: 1px solid #bfdbfe;
	border-radius: 8px;
	color: #1e40af;
	font-size: 12.5px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.outbound-modal__actions {
	display: flex;
	gap: 10px;
	justify-content: center;
	flex-wrap: wrap;
}
.outbound-modal__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 110px;
	height: 40px;
	padding: 0 18px;
	font-size: 14px;
	font-weight: 600;
	border-radius: 8px;
	border: 1px solid transparent;
	cursor: pointer;
	transition: background 0.15s, border-color 0.15s;
}
.outbound-modal__btn--ghost {
	background: #ffffff;
	border-color: #d1d5db;
	color: #374151;
}
.outbound-modal__btn--ghost:hover {
	background: #f9fafb;
	border-color: #9ca3af;
}
.outbound-modal__btn--primary {
	background: #1d4ed8;
	border-color: #1d4ed8;
	color: #ffffff;
}
.outbound-modal__btn--primary:hover {
	background: #1e40af;
	border-color: #1e40af;
}

/* ── Favourites page header ──────────────────────────────────────── */
.favourites-area {
	background: #fff5e1;
}

.ad-banner {
	position: relative;
	max-width: 720px;
	margin: 20px auto 28px;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ad-banner:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12);
}
.ad-banner__link {
	display: block;
	line-height: 0;
}
.ad-banner__img {
	width: 100%;
	height: auto;
	display: block;
}
.ad-banner__label {
	position: absolute;
	top: 10px;
	inset-inline-start: 12px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #fff;
	background: rgba(15, 23, 42, 0.55);
	padding: 3px 8px;
	border-radius: 999px;
	backdrop-filter: blur(4px);
	pointer-events: none;
}
.favourites-header {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 28px;
	padding-bottom: 16px;
	border-bottom: 1px solid #f1e3c5;
}
.favourites-heading {
	font-size: 28px;
	font-weight: 700;
	margin: 0;
	color: #1f2937;
}
.favourites-count {
	font-size: 14px;
	color: #6b7280;
	background: #ffffff;
	border: 1px solid #e5e7eb;
	padding: 4px 12px;
	border-radius: 999px;
}

.inquiries-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}
.inquiry-card {
	background: #ffffff;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	padding: 20px 22px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.inquiry-card__header {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	margin-bottom: 12px;
	flex-wrap: wrap;
}
.inquiry-card__title {
	margin: 0;
	font-size: 18px;
	font-weight: 600;
	color: #0f172a;
	line-height: 1.4;
}
.inquiry-card__title a {
	color: inherit;
	text-decoration: none;
}
.inquiry-card__title a:hover {
	color: #0b3d91;
	text-decoration: underline;
}
.inquiry-card__title--muted {
	color: #94a3b8;
	font-weight: 500;
	font-style: italic;
}
.inquiry-card__date {
	font-size: 13px;
	color: #6b7280;
	white-space: nowrap;
}
.inquiry-card__meta {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 8px 16px;
	margin: 0 0 12px;
	padding: 10px 12px;
	background: #f9fafb;
	border-radius: 8px;
}
.inquiry-card__meta-row {
	display: flex;
	gap: 6px;
	align-items: baseline;
	font-size: 14px;
}
.inquiry-card__meta-row dt {
	color: #6b7280;
	font-weight: 500;
	margin: 0;
}
.inquiry-card__meta-row dd {
	color: #1f2937;
	margin: 0;
	font-weight: 500;
}
.inquiry-card__message {
	margin: 0;
	color: #374151;
	font-size: 15px;
	line-height: 1.6;
	white-space: pre-wrap;
	background: #fff8e6;
	border-right: 3px solid #e0a800;
	border-radius: 4px;
	padding: 10px 14px;
}
[dir="rtl"] .inquiry-card__message {
	border-right: none;
	border-left: 3px solid #e0a800;
}

/* ── Subcategory grid (parent category page) ────────────────────────
 * Icon-led cards with parent-category accent color. Each card shows:
 * tinted icon disc, name, optional one-line description, listing count.
 * Hover lifts and recolors the title/arrow with the accent color. */
.subcat-section {
	padding: 56px 0 32px;
	background: #ffffff;
}
.subcat-section__header {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: 28px;
	padding-inline-end: 16px;
}
.subcat-section__title {
	font-size: 24px;
	font-weight: 700;
	margin: 0;
	color: #0f172a;
	letter-spacing: -0.01em;
}
.subcat-section__hint {
	font-size: 14px;
	margin: 0;
	color: #64748b;
}
.subcat-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 18px;
}
.subcat-card {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 22px 20px;
	background: #ffffff;
	border: 1px solid #e5e7eb;
	border-radius: 14px;
	text-decoration: none;
	color: inherit;
	transition: transform 0.18s ease, border-color 0.18s ease,
		box-shadow 0.18s ease;
	position: relative;
	overflow: hidden;
}
.subcat-card::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		-135deg,
		var(--cat-tint, #f3f4f6) 0%,
		transparent 60%
	);
	opacity: 0.4;
	pointer-events: none;
	transition: opacity 0.18s ease;
}
.subcat-card:hover {
	transform: translateY(-3px);
	border-color: var(--cat-color, #0f172a);
	box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
	text-decoration: none;
	color: inherit;
}
.subcat-card:hover::before {
	opacity: 0.7;
}
.subcat-card__cover {
	position: relative;
	display: block;
	width: 100%;
	height: 140px;
	border-radius: 10px;
	overflow: hidden;
	background: var(--cat-tint, #f3f4f6);
}
.subcat-card__cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.subcat-card__icon-badge {
	position: absolute;
	bottom: 10px;
	inset-inline-start: 10px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #ffffff;
	color: var(--cat-color, #0f172a);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	box-shadow: 0 4px 10px rgba(15, 23, 42, 0.15);
}
.subcat-card__icon-tile {
	width: 56px;
	height: 56px;
	border-radius: 14px;
	background: var(--cat-tint, #f3f4f6);
	color: var(--cat-color, #0f172a);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 28px;
	flex-shrink: 0;
	position: relative;
	z-index: 1;
}
.subcat-card__body {
	display: flex;
	flex-direction: column;
	gap: 8px;
	position: relative;
	z-index: 1;
}
.subcat-card__title-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}
.subcat-card__title {
	font-size: 17px;
	font-weight: 600;
	margin: 0;
	color: #0f172a;
	transition: color 0.18s ease;
}
.subcat-card:hover .subcat-card__title {
	color: var(--cat-color, #0f172a);
}
.subcat-card__arrow {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: #f3f4f6;
	color: #64748b;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	flex-shrink: 0;
	transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
}
.subcat-card:hover .subcat-card__arrow {
	background: var(--cat-color, #0f172a);
	color: #ffffff;
	transform: translate(-2px, -2px);
}
[dir="rtl"] .subcat-card:hover .subcat-card__arrow {
	transform: translate(2px, -2px);
}
.subcat-card__desc {
	font-size: 13.5px;
	line-height: 1.5;
	color: #64748b;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.subcat-card__count {
	font-size: 12.5px;
	font-weight: 500;
	color: var(--cat-color, #0f172a);
	background: var(--cat-tint, #f3f4f6);
	padding: 4px 10px;
	border-radius: 999px;
	align-self: flex-start;
}
@media (max-width: 575px) {
	.subcat-section {
		padding: 36px 0 16px;
	}
	.subcat-grid {
		grid-template-columns: 1fr;
	}
}

/* ── Filter sidebar — root categories with nested children ─────────
 * Each root is a horizontal row: icon + label + child count + chevron.
 * Clicking the main area selects/navigates; clicking the chevron only
 * expands. Children render as a slim indented list below. */
.fs-root-li {
	margin-bottom: 4px;
}
.fs-root {
	display: flex;
	align-items: stretch;
	gap: 0;
	border-radius: 8px;
	transition: background 0.15s ease;
}
.fs-root:hover {
	background: #f8fafc;
}
.fs-root.is-active {
	background: #eff6ff;
}
.fs-root-main {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 1;
	min-width: 0;
	padding: 9px 10px;
	border: none;
	background: transparent;
	color: #334155;
	font-size: 14px;
	font-weight: 500;
	text-align: start;
	cursor: pointer;
	border-radius: 0 8px 8px 0;
}
[dir="rtl"] .fs-root-main {
	border-radius: 8px 0 0 8px;
}
.fs-root.is-active .fs-root-main {
	color: #1d4ed8;
	font-weight: 600;
}
.fs-root-icon {
	font-size: 17px;
	color: #64748b;
	flex-shrink: 0;
}
.fs-root.is-active .fs-root-icon {
	color: #1d4ed8;
}
.fs-root-label {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.fs-root-count {
	font-size: 11px;
	font-weight: 600;
	color: #64748b;
	background: #f1f5f9;
	padding: 2px 7px;
	border-radius: 999px;
	flex-shrink: 0;
}
.fs-root.is-active .fs-root-count {
	background: #dbeafe;
	color: #1d4ed8;
}
.fs-root-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	border: none;
	background: transparent;
	color: #94a3b8;
	font-size: 18px;
	cursor: pointer;
	border-radius: 8px 0 0 8px;
	transition: color 0.15s ease, background 0.15s ease;
}
[dir="rtl"] .fs-root-toggle {
	border-radius: 0 8px 8px 0;
}
.fs-root-toggle:hover {
	color: #1d4ed8;
	background: #e0e7ff;
}

.fs-children-list {
	list-style: none;
	margin: 4px 0 6px;
	padding: 0;
	padding-inline-start: 32px;
	border-inline-start: 1px solid #e5e7eb;
	margin-inline-start: 18px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.fs-child {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 7px 10px;
	border: none;
	background: transparent;
	border-radius: 6px;
	color: #475569;
	font-size: 13.5px;
	text-align: start;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}
.fs-child:hover {
	background: #f8fafc;
	color: #0f172a;
}
.fs-child.is-active {
	background: #dbeafe;
	color: #1d4ed8;
	font-weight: 600;
}
.fs-child-bullet {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #cbd5e1;
	flex-shrink: 0;
}
.fs-child:hover .fs-child-bullet {
	background: #64748b;
}
.fs-child.is-active .fs-child-bullet {
	background: #1d4ed8;
}
.fs-child-label {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ===========================================================================
   Contact Us page
   Hero + 2-column (info card | form card) + map. Modern soft palette,
   neutral slate accents with a single emerald CTA. Cards have subtle
   shadows and round-12 radii consistent with the dashboard refresh.
   =========================================================================== */
.contact-hero {
	position: relative;
	padding: 90px 0 70px;
	background:
		radial-gradient(circle at 20% 20%, rgba(240, 0, 42, 0.1), transparent 50%),
		radial-gradient(circle at 80% 30%, rgba(240, 0, 42, 0.06), transparent 55%),
		linear-gradient(-180deg, #fffaf0 0%, #fffefc 100%);
	overflow: hidden;
}
.contact-hero__inner {
	max-width: 720px;
	text-align: center;
	margin: 0 auto;
}
.contact-hero__eyebrow {
	display: inline-block;
	padding: 6px 14px;
	border-radius: 999px;
	background: rgba(240, 0, 42, 0.1);
	color: #c1001f;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	margin-bottom: 16px;
}
.contact-hero__title {
	margin: 0 0 14px;
	font-size: clamp(28px, 4vw, 42px);
	line-height: 1.15;
	color: #0f172a;
	font-weight: 700;
}
.contact-hero__subtitle {
	margin: 0;
	font-size: 16px;
	line-height: 1.65;
	color: #475569;
}

.contact-section {
	padding: 60px 0 80px;
	background: #f8fafc;
}
.contact-section__grid {
	display: grid;
	grid-template-columns: minmax(280px, 380px) 1fr;
	gap: 28px;
	align-items: start;
}
@media (max-width: 991px) {
	.contact-section__grid {
		grid-template-columns: 1fr;
	}
}

/* ---------- Info card (left column) ---------- */
.contact-info-card {
	padding: 28px;
	border-radius: 16px;
	background: #fff;
	border: 1px solid rgba(15, 23, 42, 0.06);
	box-shadow: 0 4px 24px rgba(15, 23, 42, 0.04);
	display: flex;
	flex-direction: column;
	gap: 22px;
}
.contact-info-card__header {
	border-bottom: 1px solid rgba(15, 23, 42, 0.06);
	padding-bottom: 18px;
}
.contact-info-card__eyebrow {
	margin: 0 0 6px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #64748b;
}
.contact-info-card__title {
	margin: 0;
	font-size: 20px;
	font-weight: 700;
	color: #0f172a;
	line-height: 1.3;
}
.contact-info-card__list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 18px;
}
.contact-info-card__item {
	display: flex;
	gap: 14px;
	align-items: flex-start;
}
.contact-info-card__icon {
	flex-shrink: 0;
	width: 42px;
	height: 42px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	background: linear-gradient(-135deg, rgba(240, 0, 42, 0.12), rgba(240, 0, 42, 0.04));
	color: #f0002a;
	font-size: 20px;
}
.contact-info-card__item-body {
	min-width: 0;
	flex: 1;
}
.contact-info-card__item-body h3 {
	margin: 0 0 2px;
	font-size: 14px;
	font-weight: 700;
	color: #0f172a;
}
.contact-info-card__hint {
	margin: 0 0 6px;
	font-size: 12px;
	color: #94a3b8;
}
.contact-info-card__values {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.contact-info-card__values a,
.contact-info-card__values span {
	font-size: 13.5px;
	color: #334155;
	text-decoration: none;
	line-height: 1.5;
	transition: color 0.15s ease;
	word-break: break-word;
}
.contact-info-card__values a:hover {
	color: #f0002a;
}
.contact-info-card__hours {
	padding: 16px 18px;
	border-radius: 12px;
	background: #f8fafc;
	border: 1px solid rgba(15, 23, 42, 0.06);
}
.contact-info-card__hours h3 {
	margin: 0 0 10px;
	font-size: 13px;
	font-weight: 700;
	color: #0f172a;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.contact-info-card__hours h3 i {
	color: #94a3b8;
}
.contact-info-card__hours dl {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.contact-info-card__hours dl > div {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	font-size: 13px;
}
.contact-info-card__hours dt {
	color: #64748b;
	font-weight: 500;
}
.contact-info-card__hours dd {
	margin: 0;
	color: #0f172a;
	font-weight: 600;
}
.contact-info-card__social {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding-top: 16px;
	border-top: 1px solid rgba(15, 23, 42, 0.06);
}
.contact-info-card__social-label {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: #64748b;
}
.contact-info-card__social-icons {
	display: flex;
	gap: 6px;
}
.contact-info-card__social-icons a {
	width: 36px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #f1f5f9;
	color: #475569;
	font-size: 16px;
	transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}
.contact-info-card__social-icons a:hover {
	background: linear-gradient(-135deg, #f0002a 0%, #c1001f 100%);
	color: #fff;
	transform: translateY(-2px);
}

/* ---------- Form card (right column) ---------- */
.contact-form-card {
	padding: 32px;
	border-radius: 16px;
	background: #fff;
	border: 1px solid rgba(15, 23, 42, 0.06);
	box-shadow: 0 4px 24px rgba(15, 23, 42, 0.04);
}
.contact-form-card__header {
	margin-bottom: 24px;
}
.contact-form-card__header h2 {
	margin: 0 0 6px;
	font-size: 22px;
	font-weight: 700;
	color: #0f172a;
}
.contact-form-card__header p {
	margin: 0;
	font-size: 14px;
	color: #64748b;
}
.contact-form-card__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
@media (max-width: 640px) {
	.contact-form-card {
		padding: 22px;
	}
	.contact-form-card__grid {
		grid-template-columns: 1fr;
	}
}
.contact-form__field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}
.contact-form__field--full {
	grid-column: 1 / -1;
}
.contact-form__field label {
	font-size: 12px;
	font-weight: 700;
	color: #334155;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.contact-form__input-wrap {
	position: relative;
	display: flex;
	align-items: center;
}
.contact-form__input-wrap i {
	position: absolute;
	right: 12px;
	color: #94a3b8;
	font-size: 16px;
	pointer-events: none;
}
html[dir="rtl"] .contact-form__input-wrap i {
	right: auto;
	left: 12px;
}
.contact-form__field input,
.contact-form__field textarea {
	width: 100%;
	padding: 11px 38px 11px 14px;
	border-radius: 10px;
	border: 1px solid rgba(15, 23, 42, 0.12);
	background: #fff;
	font-size: 14px;
	color: #0f172a;
	font-family: inherit;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
html[dir="rtl"] .contact-form__field input,
html[dir="rtl"] .contact-form__field textarea {
	padding: 11px 14px 11px 38px;
}
.contact-form__field textarea {
	padding-right: 14px;
	resize: vertical;
	min-height: 140px;
}
html[dir="rtl"] .contact-form__field textarea {
	padding-left: 14px;
}
.contact-form__field input::placeholder,
.contact-form__field textarea::placeholder {
	color: #94a3b8;
}
.contact-form__field input:focus,
.contact-form__field textarea:focus {
	outline: none;
	border-color: #f0002a;
	box-shadow: 0 0 0 3px rgba(240, 0, 42, 0.18);
}
.contact-form__field--error input,
.contact-form__field--error textarea {
	border-color: #ef4444;
}
.contact-form__field--error input:focus,
.contact-form__field--error textarea:focus {
	box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.18);
}
.contact-form__error {
	font-size: 12px;
	color: #dc2626;
}
.contact-form__field--consent {
	margin-top: 4px;
}
.contact-form__consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 13px;
	font-weight: 500;
	color: #475569;
	cursor: pointer;
	line-height: 1.55;
	text-transform: none;
	letter-spacing: 0;
}
.contact-form__consent input[type="checkbox"] {
	width: 18px;
	height: 18px;
	margin-top: 2px;
	flex-shrink: 0;
	accent-color: #f0002a;
	cursor: pointer;
}
.contact-form-card__footer {
	margin-top: 24px;
	display: flex;
	justify-content: flex-end;
}
.contact-form-card__submit {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 13px 28px;
	border-radius: 12px;
	border: none;
	background: linear-gradient(-135deg, #f0002a 0%, #c1001f 100%);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
	box-shadow: 0 4px 14px rgba(240, 0, 42, 0.3);
}
.contact-form-card__submit:hover:not(:disabled) {
	transform: translateY(-1px);
	box-shadow: 0 6px 20px rgba(240, 0, 42, 0.4);
}
.contact-form-card__submit:disabled {
	opacity: 0.7;
	cursor: not-allowed;
}
.contact-form-card__submit i {
	font-size: 16px;
}

/* ---------- Map ---------- */
.contact-map {
	padding: 0 0 80px;
	background: #f8fafc;
}
.contact-map__header {
	max-width: 720px;
	margin: 0 auto 24px;
	text-align: center;
}
.contact-map__header h2 {
	margin: 0 0 8px;
	font-size: 24px;
	font-weight: 700;
	color: #0f172a;
}
.contact-map__header p {
	margin: 0;
	font-size: 14px;
	color: #64748b;
}
.contact-map__frame {
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid rgba(15, 23, 42, 0.08);
	box-shadow: 0 4px 24px rgba(15, 23, 42, 0.06);
	height: 440px;
}
.contact-map__frame iframe {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}
@media (max-width: 640px) {
	.contact-map__frame {
		height: 340px;
	}
}

/* ===========================================================================
   Category description — collapsible prose under the page banner
   Default: 1 line preview with a gradient mask fading the last few
   characters, signalling there's more content. Keeps the listings /
   subcategories above the fold while preserving the long-form text for SEO.
   =========================================================================== */
.cat-desc {
	max-width: 880px;
	margin: 0 auto;
	padding: 10px 16px;
	background: linear-gradient(-180deg, #fffdf7 0%, #ffffff 100%);
	border: 1px solid rgba(15, 23, 42, 0.05);
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 4px;
}

/* Chips strip and description card side-by-side inside the slim PageBanner.
   Chips take the remaining inline space; the description card sits on the
   inline-end at a fixed width. Stacks on small screens. */
.cat-banner-row {
	margin-top: 14px;
	display: flex;
	align-items: flex-start;
	gap: 12px;
}
.cat-banner-row .subcat-chips {
	margin-top: 0;
	flex: 0 0 calc(50% - 6px);
	min-width: 0;
}
.cat-banner-row .cat-desc {
	max-width: none;
	flex: 0 0 calc(50% - 6px);
	margin: 0;
	padding: 8px 12px;
	border-radius: 8px;
}
.cat-banner-row .cat-desc__body {
	font-size: 11.5px;
	line-height: 1.5;
}
.cat-banner-row .cat-desc__toggle {
	width: 22px;
	height: 18px;
}
.cat-banner-row .cat-desc__toggle i {
	font-size: 18px;
}
@media (max-width: 767px) {
	.cat-banner-row {
		flex-direction: column;
	}
	.cat-banner-row .cat-desc {
		flex-basis: auto;
		width: 100%;
	}
}

.cat-desc__body {
	min-width: 0;
	color: #475569;
	font-size: 12px;
	line-height: 1.55;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: var(--cat-desc-clamp, 1);
	line-clamp: var(--cat-desc-clamp, 1);
	-webkit-box-orient: vertical;
	-webkit-mask-image: linear-gradient(
		to bottom,
		#000 0%,
		#000 55%,
		transparent 100%
	);
	mask-image: linear-gradient(
		to bottom,
		#000 0%,
		#000 55%,
		transparent 100%
	);
}

.cat-desc__body p {
	margin: 0;
	display: inline;
}
.cat-desc__body p + p::before {
	content: " · ";
	color: #cbd5e1;
}
.cat-desc__body strong {
	color: #0f172a;
	font-weight: 600;
}

/* Expanded state: drop the clamp + mask, lay paragraphs out properly,
   give the card normal breathing room. */
.cat-desc--expanded {
	padding: 18px 22px;
	border-radius: 12px;
	display: block;
}
.cat-desc--expanded .cat-desc__body {
	display: block;
	-webkit-line-clamp: unset;
	line-clamp: unset;
	-webkit-box-orient: unset;
	font-size: 13px;
	line-height: 1.65;
	color: #334155;
	-webkit-mask-image: none;
	mask-image: none;
}
.cat-desc--expanded .cat-desc__body p {
	display: block;
	margin: 0 0 10px;
}
.cat-desc--expanded .cat-desc__body p:last-child {
	margin-bottom: 0;
}
.cat-desc--expanded .cat-desc__body p + p::before {
	content: none;
}

/* Toggle: borderless chevron centered under the preview. */
.cat-desc__toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 22px;
	margin: 0 auto;
	padding: 0;
	border: none;
	background: transparent;
	color: #f0002a;
	cursor: pointer;
	transition: color 0.15s ease, transform 0.15s ease;
}
.cat-desc__toggle:hover {
	color: #c20023;
}
.cat-desc__toggle i {
	font-size: 22px;
	line-height: 1;
}
.cat-desc--expanded .cat-desc__toggle {
	margin-top: 6px;
}

@media (max-width: 575px) {
	.cat-desc {
		padding: 8px 12px;
		gap: 8px;
	}
	.cat-desc__body {
		font-size: 11.5px;
	}
}

/* Mobile nav — center the language switcher + Add Listing button so they
   sit aligned in the middle of the row instead of bunching to one side. */
@media (max-width: 1199px) {
	.main-nav .navbar .others-options ul {
		justify-content: center;
		gap: 12px;
		flex-wrap: wrap;
	}
}

/* Sponsored cells — wrapper is invisible (no padding / no background)
   so the card fills the cell naturally with zero misalignment. The
   "premium" cue is applied directly to the card element via:
     1. A 2 px violet ring (border + box-shadow) tracing the card edge.
     2. A soft outer glow giving the card a subtle lift.
     3. A vibrant gradient "Sponsored" tag pinned over the top edge so
        it half-overlaps the card (treats the disclosure as a label,
        not a decal). */
.lp-cell {
	position: relative;
}
.lp-cell--sponsored .b2b-card,
.lp-cell--sponsored .svc-card,
.lp-cell--sponsored .b2b-row {
	border-color: #ddd6fe;
	box-shadow: 0 0 0 1px #c4b5fd, 0 6px 18px rgba(139, 92, 246, 0.1);
	transition: box-shadow 0.2s ease, transform 0.2s ease,
		border-color 0.2s ease;
}
.lp-cell--sponsored .b2b-card:hover,
.lp-cell--sponsored .svc-card:hover,
.lp-cell--sponsored .b2b-row:hover {
	box-shadow: 0 0 0 1px #a78bfa, 0 10px 24px rgba(139, 92, 246, 0.16);
}
.lp-cell__sponsored-tag {
	position: absolute;
	top: -8px;
	inset-inline-end: 22px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px 7px 3px 9px;
	border-radius: 999px;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: #6b21a8;
	background: #f5f3ff;
	border: 1px solid #ddd6fe;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
	white-space: nowrap;
	pointer-events: none;
}
.lp-cell__sponsored-tag i {
	font-size: 11px;
	line-height: 1;
	color: #8b5cf6;
}