/*
 * eDetal design-v3 mapped onto ListingHive 1.2.13 / HivePress 1.7.x markup.
 *
 * Loaded after tokens.css and components.css, and after the parent stylesheet together with its
 * Customizer inline CSS (handle "hivetheme-parent-frontend"). That inline CSS is generated from the
 * theme mods (primary_color #ffc107, secondary_color #15cd72, Poppins / Open Sans) and cached in the
 * "custom_styles" theme mod, so it cannot be changed from here. Every colour rule of that inline CSS
 * that is visible on eDetal pages is therefore restated below with the SAME selector and our token;
 * equal specificity + later source order wins. Nothing here uses !important.
 *
 * Parent selectors were checked against:
 *   listinghive/style.css, listinghive/vendor/hivepress/hivetheme/assets/css/frontend.less,
 *   listinghive/includes/configs/theme-styles.php, hivepress/assets/css/{common,frontend}.less.
 *
 * Sections: 1 base · 2 links and focus · 3 buttons · 4 forms · 5 header · 6 footer · 7 widgets, modal,
 * pagination · 8 Customizer colour restatement · 9 secondary text contrast.
 */

/* 1. Base ------------------------------------------------------------------------------------- */
body {
	font-family: var(--ed-font);
	font-size: var(--t-16);
	line-height: 1.5;
	color: var(--ed-ink);
	background-color: var(--ed-canvas);
	font-feature-settings: "cv11", "ss01";
}

h1,
h2,
h3,
h4,
h5,
h6,
fieldset legend,
.header-logo__name,
.comment__author,
.hp-review__author {
	font-family: var(--ed-font);
	color: var(--ed-ink);
}

h1 {
	font-size: 40px;
	line-height: 1.1;
	letter-spacing: -0.03em;
	font-weight: 800;
}

h2 {
	font-size: 30px;
	line-height: 1.15;
	letter-spacing: -0.022em;
	font-weight: 750;
}

h3 {
	font-size: 20px;
	line-height: 1.3;
	letter-spacing: -0.01em;
	font-weight: 700;
}

h4,
h5,
h6,
fieldset legend {
	font-size: var(--t-16);
	line-height: 1.35;
	font-weight: 650;
}

p {
	line-height: 1.5;
}

@media (max-width: 767px) {
	h1 {
		font-size: 30px;
	}

	h2 {
		font-size: 24px;
	}
}

/* 2. Links and focus -------------------------------------------------------------------------- */
a {
	color: var(--ed-action);
	text-underline-offset: 3px;
}

a:hover {
	color: var(--ed-action-hover);
}

/* Colour must not be the only link cue inside running text. */
.post__text a:not(.button),
.hp-listing__description a,
.hp-vendor__description a {
	text-decoration: underline;
}

:focus-visible {
	outline: 2px solid var(--ed-action);
	box-shadow: 0 0 0 5px rgba(216, 242, 124, 0.85);
}

.site-header :focus-visible,
.ed-on-dark :focus-visible {
	outline-color: var(--ed-lime);
	box-shadow: none;
}

::placeholder {
	color: var(--ed-subtle);
}

/* The parent Customizer sets Poppins on these controls (cached inline CSS); Poppins is no longer loaded. */
.button,
button,
input[type="submit"],
.wp-block-button__link,
.header-navbar__burger > ul > li > a,
.pagination > span,
.pagination .nav-links > a,
.pagination .nav-links > span,
.pagination > a {
	font-family: var(--ed-font);
	font-weight: 650;
}

/* 3. Buttons ---------------------------------------------------------------------------------- */
.button,
button[type="submit"],
input[type="submit"] {
	min-height: var(--ed-touch);
	padding: 0 18px;
	border: 1px solid transparent;
	border-radius: var(--r-sm);
	font-family: var(--ed-font);
	font-size: 15px;
	font-weight: 650;
	line-height: 1.2;
	transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease), color var(--dur) var(--ease);
}

.button,
button[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.button--large {
	min-height: 52px;
	padding: 0 24px;
	font-size: var(--t-16);
}

/* Neutral (no modifier) = ghost. Modifiers below come later and win at equal specificity. */
.button {
	background-color: var(--ed-surface-2);
	color: var(--ed-ink);
}

/* The parent hover layer is white on primary/secondary; the design darkens the fill instead. */
.button::before,
button[type="submit"]::before,
input[type="submit"]::before {
	background-color: transparent;
}

.button--secondary,
.wp-block-file .wp-block-file__button {
	background-color: var(--ed-surface);
	background-image: none;
	border-color: var(--ed-action);
	color: var(--ed-action);
}

.button--secondary:hover,
.wp-block-file .wp-block-file__button:hover {
	background-color: var(--ed-action-soft);
	color: var(--ed-action-hover);
}

.button--primary,
button[type="submit"],
input[type="submit"] {
	background-color: var(--ed-action);
	background-image: none;
	color: #fff;
}

.button--primary:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
	background-color: var(--ed-action-hover);
	color: #fff;
}

.button--primary:active,
button[type="submit"]:active,
input[type="submit"]:active {
	background-color: var(--ed-action-press);
}

/* Header and dark surfaces: green on petrol has no contrast, so primary becomes lime (.btn-lime). */
.site-header .button--primary,
.site-header button[type="submit"],
.ed-dark .button--primary {
	background-color: var(--ed-lime);
	color: var(--ed-petrol);
}

.site-header .button--primary:hover,
.site-header button[type="submit"]:hover,
.ed-dark .button--primary:hover {
	background-color: var(--ed-lime-hover);
	color: var(--ed-petrol);
}

.button[disabled],
button[disabled] {
	background-color: var(--ed-surface-2);
	border-color: var(--ed-border);
	color: #7d8983;
	opacity: 1;
}

/* 4. Forms ------------------------------------------------------------------------------------ */
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
select,
textarea {
	min-height: 48px;
	padding: 0 14px;
	border: 1px solid var(--ed-border-strong);
	border-radius: var(--r-sm);
	background-color: var(--ed-surface);
	font-size: var(--t-16);
	transition: border-color var(--dur) var(--ease);
}

textarea {
	min-height: 96px;
	padding: 12px 14px;
	resize: vertical;
}

input[type="date"]:hover,
input[type="datetime"]:hover,
input[type="datetime-local"]:hover,
input[type="email"]:hover,
input[type="month"]:hover,
input[type="number"]:hover,
input[type="password"]:hover,
input[type="search"]:hover,
input[type="tel"]:hover,
input[type="text"]:hover,
input[type="time"]:hover,
input[type="url"]:hover,
select:hover,
textarea:hover {
	border-color: #8e9b93;
}

input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="email"]:focus,
input[type="month"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
select:focus,
textarea:focus {
	outline: none;
	border-color: var(--ed-action);
	box-shadow: 0 0 0 3px rgba(23, 107, 69, 0.18);
}

input[type="date"][disabled],
input[type="datetime"][disabled],
input[type="datetime-local"][disabled],
input[type="email"][disabled],
input[type="month"][disabled],
input[type="number"][disabled],
input[type="password"][disabled],
input[type="search"][disabled],
input[type="tel"][disabled],
input[type="text"][disabled],
input[type="time"][disabled],
input[type="url"][disabled],
select[disabled],
textarea[disabled] {
	background-color: var(--ed-surface-2);
	border-color: var(--ed-border);
	color: #6e7a74;
}

select:not([multiple]):not([size]) {
	padding-right: 40px;
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2352615A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6l6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
}

/* HivePress field labels and the custom checkbox / radio (inputs are hidden, span draws the box). */
.hp-field__label {
	font-size: var(--t-14);
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	color: var(--ed-ink);
}

.hp-field__label small {
	font-weight: 500;
	color: var(--ed-muted);
}

.hp-field input[type="checkbox"] + span::before,
.hp-field input[type="radio"] + span::before {
	border-color: var(--ed-border-strong);
	background-color: var(--ed-surface);
}

.hp-field input[type="checkbox"]:focus-visible + span::before,
.hp-field input[type="radio"]:focus-visible + span::before {
	outline: 2px solid var(--ed-action);
	outline-offset: 2px;
}

/* Select2 (HivePress selects). Only the single / multiple variants; the inline pill variant is untouched. */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
	min-height: 48px;
	border-color: var(--ed-border-strong);
	border-radius: var(--r-sm);
	background-color: var(--ed-surface);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	padding: 11px 36px 11px 14px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	top: 1px;
	height: 46px;
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple {
	border-color: var(--ed-action);
	box-shadow: 0 0 0 3px rgba(23, 107, 69, 0.18);
}

/* HivePress form messages -> semantic notice colours (.note-*). */
.hp-form__messages {
	border-left-width: 4px;
	border-radius: 0 var(--r-sm) var(--r-sm) 0;
	color: var(--ed-ink);
}

.hp-form__messages--info {
	border-left-color: var(--ed-info);
	background-color: var(--ed-info-bg);
}

.hp-form__messages--warning {
	border-left-color: var(--ed-warn);
	background-color: var(--ed-warn-bg);
}

.hp-form__messages--error {
	border-left-color: var(--ed-err);
	background-color: var(--ed-err-bg);
}

.hp-form__messages--success {
	border-left-color: var(--ed-ok);
	background-color: var(--ed-ok-bg);
}

/* 5. Header (petrol bar, .hd) ----------------------------------------------------------------- */
.site-header {
	background-color: var(--ed-petrol);
	color: #fff;
}

.site-header .header-navbar {
	max-width: var(--ed-container);
	margin: 0 auto;
	min-height: 72px;
	padding: 0 32px;
	align-items: center;
	border-bottom: 0;
}

.site-header .header-navbar__start {
	margin-right: 28px;
}

.site-header .header-logo a,
.site-header .header-logo__name {
	color: #fff;
}

.site-header .header-logo__name {
	margin-bottom: 0;
	font-size: 26px;
	font-weight: 800;
	letter-spacing: -0.04em;
	line-height: 1;
}

.site-header .header-logo:hover .header-logo__name {
	color: #fff;
}

.site-header .header-logo__description {
	color: #cfe0d6;
}

.site-header .header-navbar__menu {
	margin: 0 0 0 auto;
}

.site-header .header-navbar__menu > ul > li {
	padding: 0 2px;
}

.site-header .header-navbar__menu ul li a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: var(--ed-touch);
	padding: 10px 12px;
	border-radius: 8px;
	color: #e4eee8;
	font-size: 15px;
	font-weight: 500;
}

.site-header .header-navbar__menu ul li a:hover {
	color: #fff;
	background-color: rgba(255, 255, 255, 0.08);
}

.site-header .header-navbar__menu ul li.active > a,
.site-header .header-navbar__menu ul li.current-menu-item > a {
	color: #fff;
	background-color: rgba(216, 242, 124, 0.14);
	box-shadow: inset 0 -2px 0 var(--ed-lime);
}

.site-header .header-navbar__menu > ul > li.current-menu-item::before {
	display: none;
}

.site-header .header-navbar__menu ul li.menu-item-has-children::after {
	color: #cfe0d6;
}

/* Sub-menus are white panels: restore dark text inside them. */
.site-header .header-navbar__menu ul li ul {
	color: var(--ed-ink);
	border-color: var(--ed-border);
	border-radius: 0 0 var(--r-sm) var(--r-sm);
	box-shadow: var(--sh-2);
}

.site-header .header-navbar__menu ul li ul li {
	padding: 2px 8px;
}

.site-header .header-navbar__menu ul li ul li a,
.site-header .header-navbar__menu ul li ul li a:hover {
	color: var(--ed-ink);
}

.site-header .header-navbar__menu ul li ul li a:hover {
	background-color: var(--ed-surface-2);
}

.site-header .header-navbar__menu .hp-link i,
.site-header .header-navbar__menu .hp-icon,
.site-header .header-navbar__actions .hp-icon {
	color: #cfe0d6;
}

.site-header .header-navbar__actions {
	margin-left: 8px;
}

/* Burger: light icon on the dark bar, full-screen white drawer keeps dark text. */
.site-header .header-navbar__burger > a {
	min-width: var(--ed-touch);
	min-height: var(--ed-touch);
	justify-content: center;
	color: #fff;
}

.site-header .header-navbar__burger > a:hover {
	color: var(--ed-lime);
}

.site-header .header-navbar__burger > ul {
	background-color: var(--ed-surface);
	color: var(--ed-ink);
}

.site-header .header-navbar__burger > ul > li > a,
.site-header .header-navbar__burger ul li a {
	color: var(--ed-ink);
}

.site-header .header-navbar__burger > ul::before {
	color: var(--ed-muted);
}

.site-header .header-navbar__burger > ul > li.current-menu-item::before {
	background-color: var(--ed-action);
	background-image: none;
}

.site-header .header-navbar__burger .hp-link i {
	color: var(--ed-muted);
}

.site-loader stop {
	stop-color: var(--ed-action);
}

/*
 * Burger breakpoint 1180px for all languages (design-v3 ed.css switched at 1024; the seller header with
 * 5 items does not fit below 1180). The parent switches menu/burger at max-width: 74.99em (1199.84px),
 * so in the 1180-1199px band the parent would still show the burger: restore the menu there.
 * Keep in step with the .ed-nav / .ed-burger breakpoint in components.css.
 */
@media (min-width: 1180px) and (max-width: 74.99em) {
	.site-header .header-navbar__menu {
		display: flex;
	}

	.site-header .header-navbar__burger > a {
		display: none;
	}
}

@media (max-width: 767px) {
	.site-header .header-navbar {
		min-height: 60px;
		padding: 0 16px;
	}

	.site-header .header-navbar__start {
		margin-right: 12px;
	}

	.site-header .header-logo__name {
		font-size: 22px;
	}
}

/* 6. Footer (.ft) ----------------------------------------------------------------------------- */
.site-footer {
	background-color: var(--ed-surface);
	border-top: 1px solid var(--ed-border);
}

.site-footer.ed-ft {
	margin-top: 0;
}

.site-footer .ed-ft-in .ed-logo {
	font-size: 22px;
}

.site-footer .ed-ft-in .ed-logo svg {
	width: 32px;
	height: 28px;
}

.ed-ft-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 0 24px;
}

.ed-ft-copy {
	margin-left: auto;
}

@media (max-width: 767px) {
	.ed-ft-copy {
		margin-left: 0;
	}
}

.footer-navbar__copyright {
	color: var(--ed-muted);
	font-size: var(--t-14);
}

.footer-navbar__menu ul li a {
	display: inline-flex;
	align-items: center;
	min-height: var(--ed-touch);
	color: var(--ed-muted);
	font-size: var(--t-14);
}

.footer-navbar__menu ul li a:hover {
	color: var(--ed-ink);
	text-decoration: underline;
}

.footer-widgets {
	border-color: var(--ed-border);
}

/* 7. Widgets, modal, titles, pagination ------------------------------------------------------- */
.widget--sidebar,
.widget.hp-menu {
	padding: 24px;
	border-color: var(--ed-border);
	border-radius: var(--r-lg);
	box-shadow: none;
}

.widget h2,
.widget .widget__title {
	font-size: 20px;
	line-height: 1.3;
	letter-spacing: -0.01em;
	font-weight: 700;
}

.widget_search,
.widget_product_search {
	padding: 0;
	border: 0;
}

.hp-form--listing-search,
.hp-form--vendor-search {
	border-color: var(--ed-border);
	border-radius: var(--r-md);
	box-shadow: var(--sh-1);
}

.fancybox-content {
	border-radius: var(--r-lg);
	box-shadow: var(--sh-3);
}

.fancybox-bg {
	background: #0c1c16;
}

/* ListingHive draws a short yellow bar above titles; design-v3 headings have none. */
.title,
.content-title,
.hp-page__title,
.hp-section__title,
.widget--footer .widget__title {
	padding-top: 0;
}

.title::before,
.content-title::before,
.footer-widgets .widget__title::before,
.hp-page__title::before,
.hp-section__title::before,
.widget--footer .widget__title::before {
	display: none;
}

.pagination .nav-links > span:not(.dots),
.pagination > span:not(.dots) {
	border-color: var(--ed-action);
}

/* 8. Customizer colour restatement (same selectors as the cached inline CSS) ------------------ */
.hp-menu--tabbed .hp-menu__item a:hover,
.hp-menu--tabbed .hp-menu__item--current a,
.widget_archive li a:hover,
.widget_categories li a:hover,
.widget_categories li.current-cat > a,
.widget_categories li.current-cat::before,
.widget_meta li a:hover,
.widget_nav_menu li a:hover,
.widget_nav_menu li.current-menu-item > a,
.widget_nav_menu li.current-menu-item::before,
.widget_pages li a:hover,
.widget_recent_entries li a:hover,
.wp-block-archives li a:hover,
.wp-block-categories li a:hover,
.wp-block-latest-posts li a:hover,
.wp-block-rss li a:hover,
.widget_archive li:hover > a,
.widget_categories li:hover > a,
.widget_meta li:hover > a,
.widget_nav_menu li:hover > a,
.widget_pages li:hover > a,
.widget_recent_entries li:hover > a,
.wp-block-archives li:hover > a,
.wp-block-categories li:hover > a,
.wp-block-latest-posts li:hover > a,
.wp-block-rss li:hover > a,
.widget_archive li:hover::before,
.widget_categories li:hover::before,
.widget_meta li:hover::before,
.widget_nav_menu li:hover::before,
.widget_pages li:hover::before,
.widget_recent_entries li:hover::before,
.wp-block-archives li:hover::before,
.wp-block-categories li:hover::before,
.wp-block-latest-posts li:hover::before,
.wp-block-rss li:hover::before,
.post-navbar__link:hover i,
.pagination > a:hover,
.pagination .nav-links > a:hover,
.post__details a:hover,
.tagcloud a:hover,
.wp-block-tag-cloud a:hover,
.comment__details a:hover,
.comment-respond .comment-reply-title a:hover,
.hp-link:hover,
.hp-link:hover i,
.pac-item:hover .pac-item-query {
	color: var(--ed-action);
}

.site-header .hp-link:hover,
.site-header .hp-link:hover i {
	color: #fff;
}

.header-navbar__menu > ul > li.current-menu-item::before,
.header-navbar__burger > ul > li.current-menu-item::before,
.hp-menu--tabbed .hp-menu__item--current::before {
	background-color: var(--ed-action);
	background-image: none;
}

blockquote,
.wp-block-quote,
.comment.bypostauthor .comment__image img {
	border-color: var(--ed-action);
}

.hp-listing__location i {
	color: var(--ed-action);
}

.hp-field--number-range .ui-slider-range,
.hp-field input[type="checkbox"]:checked + span::before,
.hp-field input[type="radio"]:checked + span::after {
	background-color: var(--ed-action);
}

.hp-field input[type="radio"]:checked + span::before,
.hp-field input[type="checkbox"]:checked + span::before {
	border-color: var(--ed-action);
}

.tagcloud a:hover,
.wp-block-tag-cloud a:hover,
.hp-listing__images-carousel .slick-current img,
.hp-listing--view-block.hp-listing--featured {
	border-color: var(--ed-action);
}

.hp-listing--view-block .hp-listing__featured-badge {
	background-color: var(--ed-lime);
	background-image: none;
	color: var(--ed-petrol);
}

.post__categories a:hover,
.hp-listing--view-block .hp-listing__categories a:hover,
.hp-listing--view-page .hp-listing__categories a:hover {
	background-color: var(--ed-action);
}

/* 9. Secondary text: the parent uses rgba(15,23,39,.45) (about 3.4:1 on white); use --ed-muted. */
.hp-meta,
.hp-result-count,
.hp-text--secondary,
.hp-listing--view-block .hp-listing__created-date,
.hp-listing--view-page .hp-listing__created-date,
.hp-form__label small,
.post__categories a {
	color: var(--ed-muted);
}
