/* =========================================================================
   Middleout FiboSearch Skin
   Allt färg/typsnitt går via --mofs-*-variabler med neutrala fallbacks.
   Temat mappar dem mot sitt designsystem, t.ex.:
     :root { --mofs-ink: var(--nws-black); --mofs-accent: var(--nws-green); }
   Selektorerna är FiboSearchs egna klasser — samma DOM, bara omstylad.
   ========================================================================= */

/* ---- Sökfält ---------------------------------------------------------- */

.dgwt-wcas-search-wrapp.dgwt-wcas-search-wrapp {
	max-width: var(--mofs-field-max-width, none);
	font-family: var(--mofs-font, inherit);
}

.dgwt-wcas-search-wrapp .dgwt-wcas-sf-wrapp {
	background: transparent;
}

.dgwt-wcas-search-wrapp .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
	border: var(--mofs-field-border, 1.5px solid #d4d4d4);
	border-radius: var(--mofs-field-radius, 10px);
	padding: 1.3rem 1.8rem 1.3rem 5.6rem;
	font-family: inherit;
	font-size: var(--mofs-field-size, 1.7rem);
	color: var(--mofs-ink, #111111);
	background: var(--mofs-field-bg, #fff);
	height: auto;
	box-shadow: none;
	transition: border-color 0.15s ease;
	background: var(--mofs-field-bg, #fff) !important;
}

.dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input::placeholder {
	color: var(--mofs-placeholder, #666666);
	opacity: 1;
}

.dgwt-wcas-search-wrapp.dgwt-wcas-active .dgwt-wcas-search-input,
.dgwt-wcas-search-wrapp .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input:focus,
.dgwt-wcas-search-wrapp.dgwt-wcas-active .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input,
.dgwt-wcas-search-wrapp.dgwt-wcas-search-filled .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
	border-color: var(--mofs-ink, #111111);
	border-width: 2px;
	background: var(--mofs-field-bg, #fff);
	/* Pirx gör fältet till en pill och flyttar in texten med !important när
	   sökningen aktiveras. Geometrin ska vara densamma som i viloläget —
	   texten börjar där platshållaren står och inget hoppar. Höger sida får
	   plats för Rensa-krysset. */
	border-radius: var(--mofs-field-radius, 10px) !important;
	padding: 1.3rem 4.8rem 1.3rem 5.6rem !important;
}

/* Skissens cirkel-ikon till vänster; FiboSearchs egen magnifier i fältet göms */
.dgwt-wcas-sf-wrapp { position: relative; }
.dgwt-wcas-sf-wrapp::before {
	content: "";
	position: absolute;
	left: 3rem;
	top: 50%;
	translate: 0 -50%;
	width: 1.6rem;
	height: 1.6rem;
	border: 2px solid var(--mofs-muted, #666666);
	border-radius: 50%;
	pointer-events: none;
	z-index: 2;
}
.dgwt-wcas-sf-wrapp .dgwt-wcas-ico-magnifier-handler,
.dgwt-wcas-sf-wrapp .dgwt-wcas-ico-magnifier,
.dgwt-wcas-search-wrapp .dgwt-wcas-search-icon { display: none !important; }

/* "Rensa"-krysset */
.dgwt-wcas-close:not(.dgwt-wcas-inner-preloader) path { fill: var(--mofs-muted-strong, #666666); }

/* ---- Dropdown --------------------------------------------------------- */

.dgwt-wcas-suggestions-wrapp,
.dgwt-wcas-details-wrapp {
	border: 0;
	box-shadow: 0 30px 70px -34px rgba(20, 24, 26, 0.4);
	font-family: var(--mofs-font, inherit);
}

.dgwt-wcas-suggestions-wrapp {
	border-radius: var(--mofs-panel-radius, 14px);
	padding: 1.2rem 0 1rem;
	margin-top: 1rem;
}

.dgwt-wcas-suggestions-wrapp:not(.dgwt-wcas-has-details) { overflow: hidden; }

/* Rubrikrader (Kategorier / Produkter) */
.dgwt-wcas-suggestion-headline,
.dgwt-wcas-suggestions-wrapp .dgwt-wcas-st-more,
.dgwt-wcas-suggestion.dgwt-wcas-suggestion-headline {
	font-size: 1.3rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--mofs-muted-strong, #666666);
	border-bottom: 1px solid var(--mofs-line, #e9e9e9);
	padding: 1.4rem 2rem 1rem;
	margin: 0 0.6rem 0.4rem;
}

/* ---- Träffrad --------------------------------------------------------- */

.dgwt-wcas-suggestion {
	padding: 1.4rem 1.8rem;
	margin: 0.3rem 0.8rem;
	border-radius: 1rem;
	border-left: 3px solid transparent;
	align-items: center;
	font-family: inherit;
}

.dgwt-wcas-suggestion.dgwt-wcas-suggestion-selected,
.dgwt-wcas-suggestion:hover {
	background: var(--mofs-row-active, #f5f5f5);
	border-left-color: var(--mofs-accent, #bbb);
}

.dgwt-wcas-si {
	width: 5.2rem;
	height: 5.2rem;
	flex: none;
	margin-right: 1.8rem;
}
.dgwt-wcas-si img,
.dgwt-wcas-si > * {
	width: 5.2rem;
	height: 5.2rem;
	object-fit: contain;
	border: 1px solid var(--mofs-line-strong, #d4d4d4);
	border-radius: 0.8rem;
	background: var(--mofs-thumb-bg, #f4f4f4);
}

.dgwt-wcas-st { font-size: 1.7rem; }

.dgwt-wcas-st-title,
.dgwt-wcas-st span.dgwt-wcas-st-title {
	font-size: 1.7rem;
	font-weight: 500;
	line-height: 1.25;
	color: var(--mofs-ink, #111111);
}

.dgwt-wcas-st-title strong,
.dgwt-wcas-suggestion strong.dgwt-wcas-highlight,
.dgwt-wcas-highlight {
	font-weight: 600;
	color: var(--mofs-link, #111111);
	background: none;
}

.dgwt-wcas-st-breadcrumbs,
.dgwt-wcas-sd {
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 1.4;
	color: var(--mofs-muted-strong, #666666);
	margin-top: 0.5rem;
}

/* Skick-etiketten (fylls i av temat via mofs/suggestion_desc) */
.mofs-grade {
	display: inline-block;
	margin-top: 0.6rem;
	font-size: 1.2rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--mofs-steel, #666666);
	border: 1px solid var(--mofs-line-strong, #d4d4d4);
	border-radius: 0.5rem;
	padding: 0.5rem 0.7rem;
	margin-left: 0.8rem;
	vertical-align: middle;
}

/* ---- Pris: håll det på en rad ---------------------------------------- */

.dgwt-wcas-sp {
	flex: 0 0 auto;
	min-width: 11rem;
	text-align: right;
	white-space: nowrap;
	font-family: var(--mofs-font-display, inherit);
	font-size: 1.7rem;
	font-weight: 600;
	color: var(--mofs-ink, #111111);
}
/*
 * "Från" kommer från PriceDisplay och delas med produktkorten. Utan egen regel
 * ärver den prisets 600 och blir lika tung som siffran — samma lättare vikt och
 * mindre grad som i cards.css håller raden underordnad priset.
 */
.dgwt-wcas-sp .nws-price-from {
	display: block;
	font-size: 1.3rem;
	font-weight: 400;
	line-height: 1;
	margin-bottom: 0.3rem;
}
.dgwt-wcas-sp del {
	font-family: var(--mofs-font, inherit);
	font-size: 1.4rem;
	font-weight: 400;
	color: var(--mofs-muted-strong, #666666);
	display: block;
	margin-top: 0.4rem;
}
.dgwt-wcas-sp ins { text-decoration: none; }
.dgwt-wcas-sp small,
.dgwt-wcas-sp .woocommerce-Price-taxLabel {
	font-family: var(--mofs-font, inherit);
	font-size: 1.3rem;
	font-weight: 400;
	color: var(--mofs-muted-strong, #666666);
	display: block;
	margin-top: 0.4rem;
}

/* ---- Kategoriförslag -------------------------------------------------- */

.dgwt-wcas-suggestion-tax .dgwt-wcas-si {
	width: 3.6rem;
	height: 3.6rem;
}
.dgwt-wcas-suggestion-tax .dgwt-wcas-st-title { font-weight: 600; }

/* ---- Detaljpanel (Pro) ------------------------------------------------ */

.dgwt-wcas-details-wrapp {
	width: var(--mofs-details-width, 48rem);
	border-left: 1px solid var(--mofs-line, #e9e9e9);
	border-radius: 0 var(--mofs-panel-radius, 14px) var(--mofs-panel-radius, 14px) 0;
	background: #fff;
	padding: 2.6rem 3rem;
}
.dgwt-wcas-details-wrapp .dgwt-wcas-details-title,
.dgwt-wcas-details-wrapp .dgwt-wcas-dp-title {
	font-family: var(--mofs-font-display, inherit);
	font-size: 2.6rem;
	line-height: 1.15;
	font-weight: 400;
	color: var(--mofs-ink, #111111);
}
.dgwt-wcas-details-wrapp .price {
	font-family: var(--mofs-font-display, inherit);
	font-size: 3rem;
	font-weight: 600;
	color: var(--mofs-ink, #111111);
}
.dgwt-wcas-details-wrapp .price del { font-size: 1.6rem; color: var(--mofs-muted-strong, #666666); }
.dgwt-wcas-details-more-products,
.dgwt-wcas-details-wrapp a { color: var(--mofs-link, #111111); }
.dgwt-wcas-details-wrapp .button,
.dgwt-wcas-details-wrapp .single_add_to_cart_button {
	background: var(--mofs-ink, #111111);
	color: #fff;
	font-weight: 600;
	border-radius: 0.9rem;
	padding: 1.4rem 2rem;
}

/* ---- Botten & inga träffar -------------------------------------------- */

.dgwt-wcas-suggestion-more,
.dgwt-wcas-st-more {
	letter-spacing: 0;
	text-transform: none;
}
.dgwt-wcas-suggestion-more .dgwt-wcas-st-more,
.dgwt-wcas-all-results {
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--mofs-ink, #111111);
	border-top: 1px solid var(--mofs-line, #e9e9e9);
	padding: 1.6rem 0;
	margin: 1rem 0.6rem 0;
	text-align: center;
}
.dgwt-wcas-suggestion-more:hover { background: transparent; border-left-color: transparent; }
.dgwt-wcas-suggestion-more:hover .dgwt-wcas-st-more { color: var(--mofs-link, #111111); }

.dgwt-wcas-suggestion-nores,
.dgwt-wcas-nores,
.dgwt-wcas-nores-info {
	font-size: 1.6rem;
	line-height: 1.55;
	color: var(--mofs-steel, #666666);
	padding: 2.2rem 2rem;
}

/* ---- Mobilt fullskärmsläge -------------------------------------------- */

.dgwt-wcas-overlay-mobile .dgwt-wcas-om-bar { background: var(--mofs-ink, #111111); }
.dgwt-wcas-overlay-mobile .dgwt-wcas-om-return svg path,
.dgwt-wcas-om-return path { fill: #fff; }
.dgwt-wcas-overlay-mobile .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
	border: 0;
	border-radius: 0.8rem;
}
.dgwt-wcas-overlay-mobile .dgwt-wcas-suggestion { min-height: 6rem; }
