/*
 * FiboSearch Modern Styling
 * Dark glassmorphism theme for FiboSearch – AJAX Search for WooCommerce
 * Designed to match the Antigravity dark theme (brand green: #c1ffb4)
 * Version 1.0.0
 */

/* ==========================================================================
   DESIGN TOKENS (reference)
   --brand:    #c1ffb4          Brand accent / neon green
   --glass-bg: rgba(128,128,128,0.08)  Input/surface background
   --border:   rgba(128,128,128,0.25)  Subtle border
   --glow:     rgba(193,255,180,0.15)  Focus ring colour
   --text:     #ececec          Primary text on dark theme
   --panel-bg: rgba(0,0,0,0.6)  Dropdown panel
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. MAIN SEARCH WRAPPER
   -------------------------------------------------------------------------- */

.dgwt-wcas-search-wrapp {
    font-family: inherit !important;
    color: #ececec !important;
}

/* --------------------------------------------------------------------------
   2. FORM WRAPPER (sf-wrapp)
   -------------------------------------------------------------------------- */

.dgwt-wcas-sf-wrapp {
    background: none !important;
}

/* Pirx style – no card background/border, just keep layout spacing */
.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp {
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   3. SEARCH INPUT FIELD
   -------------------------------------------------------------------------- */

.dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input,
input[type="search"].dgwt-wcas-search-input {
    width: 100% !important;
    height: auto !important;
    min-height: 50px !important;
    padding: 13px 56px 13px 20px !important;
    /* right padding leaves room for spinner */
    font-size: 15px !important;
    font-family: inherit !important;
    color: #ececec !important;
    background: rgba(128, 128, 128, 0.10) !important;
    background-color: rgba(128, 128, 128, 0.10) !important;
    border: 1px solid rgba(128, 128, 128, 0.25) !important;
    border-radius: 18px !important;
    box-shadow: none !important;
    transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
    box-sizing: border-box !important;
    outline: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

/* Placeholder */
.dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input::placeholder,
.dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input::-webkit-input-placeholder,
.dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input:-moz-placeholder,
.dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input::-moz-placeholder {
    color: rgba(200, 200, 200, 0.45) !important;
    font-weight: 400 !important;
    font-style: italic !important;
    line-height: normal !important;
}

/* Focus */
.dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input:focus {
    border-color: #c1ffb4 !important;
    box-shadow: 0 0 0 4px rgba(193, 255, 180, 0.15) !important;
    background: rgba(128, 128, 128, 0.05) !important;
    background-color: rgba(128, 128, 128, 0.05) !important;
    outline: 0 !important;
    color: #ececec !important;
}

/* When dropdown is open, square off just the bottom corners */
.dgwt-wcas-open .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-top-left-radius: 18px !important;
    border-top-right-radius: 18px !important;
    border-color: #c1ffb4 !important;
}

/* Pirx – use same 18px rounded style */
.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
    background-color: rgba(128, 128, 128, 0.10) !important;
    border: 1px solid rgba(128, 128, 128, 0.25) !important;
    border-radius: 18px !important;
    font-family: inherit !important;
    color: #ececec !important;
    padding-left: 44px !important;
    /* space for the inline magnifier icon */
}

.dgwt-wcas-style-pirx.dgwt-wcas-search-focused .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
    border-color: #c1ffb4 !important;
    box-shadow: 0 0 0 4px rgba(193, 255, 180, 0.15) !important;
    background-color: rgba(128, 128, 128, 0.05) !important;
}

.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input:hover {
    background-color: rgba(128, 128, 128, 0.15) !important;
}

.dgwt-wcas-style-pirx.dgwt-wcas-search-wrapp.dgwt-wcas-search-focused input[type="search"].dgwt-wcas-search-input:hover {
    background-color: rgba(128, 128, 128, 0.05) !important;
}

/* --------------------------------------------------------------------------
   4. SUBMIT BUTTON (magnifier button)
   -------------------------------------------------------------------------- */

.dgwt-wcas-sf-wrapp button.dgwt-wcas-search-submit,
input[type="submit"].dgwt-wcas-search-submit {
    background-color: #c1ffb4 !important;
    color: #1a1a1a !important;
    border: none !important;
    border-radius: 0 12px 12px 0 !important;
    padding: 0 20px !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transition: opacity 0.2s ease, filter 0.2s ease !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

.dgwt-wcas-sf-wrapp button.dgwt-wcas-search-submit:hover,
.dgwt-wcas-sf-wrapp button.dgwt-wcas-search-submit:focus {
    opacity: 0.85 !important;
    filter: brightness(108%) !important;
    outline: 0 !important;
}

/* The triangle arrow pseudo-element to match new button colour */
.dgwt-wcas-sf-wrapp .dgwt-wcas-search-submit:before {
    border-color: transparent #c1ffb4 transparent !important;
}

.dgwt-wcas-sf-wrapp .dgwt-wcas-search-submit:hover:before,
.dgwt-wcas-sf-wrapp .dgwt-wcas-search-submit:focus:before,
.dgwt-wcas-sf-wrapp .dgwt-wcas-search-submit:active:before {
    border-right-color: #c1ffb4 !important;
}

/* SVG magnifier icon inside the regular (non-pirx) submit button */
.dgwt-wcas-has-submit .dgwt-wcas-search-submit svg path {
    fill: #1a1a1a !important;
}

/* ── Magnifier icon colour (Pirx positions it on the LEFT natively) ─────────
   FiboSearch's Pirx CSS already places .dgwt-wcas-ico-magnifier at left:23px.
   We only override colour here – never touch position.
   ──────────────────────────────────────────────────────────────────────── */
.dgwt-wcas-no-submit .dgwt-wcas-ico-magnifier path,
.dgwt-wcas-style-pirx .dgwt-wcas-ico-magnifier path {
    fill: #c1ffb4 !important;
}

.dgwt-wcas-no-submit .dgwt-wcas-ico-magnifier,
.dgwt-wcas-style-pirx .dgwt-wcas-ico-magnifier {
    opacity: 0.7 !important;
}

/* Nudge left input padding so text doesn't overlap the icon */
.dgwt-wcas-no-submit .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
    padding-left: 44px !important;
    padding-right: 16px !important;
}

/* Pirx submit button – styled to look like a clear button outside the input */
.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp button.dgwt-wcas-search-submit {
    background: rgba(193, 255, 180, 0.1) !important;
    border: 1.5px solid rgba(193, 255, 180, 0.45) !important;
    border-radius: 50% !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
    box-shadow: 0 0 8px rgba(193, 255, 180, 0.12) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: background 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
}

.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp button.dgwt-wcas-search-submit:hover {
    background: rgba(193, 255, 180, 0.22) !important;
    border-color: rgba(193, 255, 180, 0.85) !important;
    box-shadow: 0 0 14px rgba(193, 255, 180, 0.35) !important;
    opacity: 1 !important;
    filter: none !important;
}

.dgwt-wcas-style-pirx .dgwt-wcas-search-submit svg path,
.dgwt-wcas-style-pirx .dgwt-wcas-close:not(.dgwt-wcas-inner-preloader) path {
    fill: #c1ffb4 !important;
}

/* --------------------------------------------------------------------------
   5. SUGGESTIONS DROPDOWN PANEL
   -------------------------------------------------------------------------- */

.dgwt-wcas-suggestions-wrapp {
    background: rgba(10, 10, 10, 0.85) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(193, 255, 180, 0.2) !important;
    border-top: none !important;
    border-radius: 0 0 12px 12px !important;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5) !important;
    color: #ececec !important;
}

/* When suggestions appear on top of the input */
.dgwt-wcas-suggestions-wrapp.dgwt-wcas-suggestions-wrapp--top {
    border: 1px solid rgba(193, 255, 180, 0.2) !important;
    border-bottom: none !important;
    border-radius: 12px 12px 0 0 !important;
}

.dgwt-wcas-details-left .dgwt-wcas-suggestions-wrapp {
    border-radius: 0 0 5px 0 !important;
    border-left-color: rgba(193, 255, 180, 0.1) !important;
}

.dgwt-wcas-details-right .dgwt-wcas-suggestions-wrapp {
    border-radius: 0 0 0 5px !important;
    border-right-color: rgba(193, 255, 180, 0.1) !important;
}

.dgwt-wcas-full-width .dgwt-wcas-suggestions-wrapp {
    border-radius: 0 0 0 5px !important;
}

/* --------------------------------------------------------------------------
   6. INDIVIDUAL SUGGESTION ROWS
   -------------------------------------------------------------------------- */

.dgwt-wcas-suggestion {
    color: #ececec !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
    transition: background 0.15s ease !important;
}

.dgwt-wcas-suggestion:last-child {
    border-bottom: none !important;
    border-radius: 0 0 12px 12px !important;
}

/* Hover */
.dgwt-wcas-suggestion:hover {
    background: rgba(193, 255, 180, 0.08) !important;
}

/* Selected (keyboard nav) */
.dgwt-wcas-suggestion-selected,
.dgwt-wcas-suggestion.dgwt-wcas-suggestion-selected {
    background: rgba(193, 255, 180, 0.12) !important;
}

/* "Show all results" / more row */
.dgwt-wcas-suggestion.dgwt-wcas-suggestion-more {
    color: rgba(200, 200, 200, 0.6) !important;
    border-bottom: none !important;
}

/* Suggestion text */
.dgwt-wcas-st {
    color: #ececec !important;
}

.dgwt-wcas-st strong {
    color: #c1ffb4 !important;
}

/* SKU / breadcrumbs / description subtexts */
.dgwt-wcas-st-breadcrumbs,
.dgwt-wcas-sku,
.dgwt-wcas-sd {
    color: rgba(200, 200, 200, 0.55) !important;
}

/* --------------------------------------------------------------------------
   7. PRODUCT PRICE
   -------------------------------------------------------------------------- */

.dgwt-wcas-sp,
.dgwt-wcas-pd-price,
.dgwt-wcas-tpd-price {
    color: #ececec !important;
}

.dgwt-wcas-sp del,
.dgwt-wcas-pd-price del .amount,
.dgwt-wcas-tpd-price del .amount {
    opacity: 0.45 !important;
    color: rgba(200, 200, 200, 0.55) !important;
}

.dgwt-wcas-sp ins,
.dgwt-wcas-pd-price ins,
.dgwt-wcas-tpd-price ins {
    background: transparent !important;
    text-decoration: none !important;
    color: #c1ffb4 !important;
}

/* --------------------------------------------------------------------------
   8. DETAILS PANEL (right/left sidebar in full-width mode)
   -------------------------------------------------------------------------- */

.dgwt-wcas-details-wrapp {
    background: rgba(10, 10, 10, 0.88) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(193, 255, 180, 0.15) !important;
    border-top: none !important;
    border-left: none !important;
    color: #ececec !important;
}

.rtl .dgwt-wcas-details-wrapp {
    border-left: 1px solid rgba(193, 255, 180, 0.15) !important;
    border-right: none !important;
}

.dgwt-wcas-details-right .dgwt-wcas-details-wrapp {
    border-left: none !important;
    border-right: 1px solid rgba(193, 255, 180, 0.15) !important;
    border-radius: 0 12px 12px 0 !important;
}

.dgwt-wcas-details-left .dgwt-wcas-details-wrapp {
    border-right: none !important;
    border-left: 1px solid rgba(193, 255, 180, 0.15) !important;
    border-radius: 12px 0 0 12px !important;
}

/* Details panel product title */
a.dgwt-wcas-details-product-title,
a.dgwt-wcas-details-post-title {
    color: #ececec !important;
}

a.dgwt-wcas-details-product-title:hover,
a.dgwt-wcas-details-post-title:hover {
    color: #c1ffb4 !important;
    text-decoration: none !important;
}

/* Details panel section title */
.dgwt-wcas-datails-title,
.dgwt-wcas-pd-title {
    border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
    color: #ececec !important;
}

.dgwt-wcas-pd-title .product-title {
    color: #ececec !important;
}

.dgwt-wcas-tpd-rest-title {
    color: #ececec !important;
}

.dgwt-wcas-details-hr {
    border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
}

/* Details panel description */
.dgwt-wcas-details-desc {
    color: rgba(200, 200, 200, 0.75) !important;
}

/* Product SKU in details */
.dgwt-wcas-details-product-sku {
    color: rgba(200, 200, 200, 0.45) !important;
}

/* "See all results" / "Read more" links in panel */
a.dgwt-wcas-details-more-products,
a.dgwt-wcas-product-details-readmore {
    border-top: 1px solid rgba(255, 255, 255, 0.07) !important;
    color: rgba(200, 200, 200, 0.55) !important;
}

a.dgwt-wcas-details-more-products:hover,
a.dgwt-wcas-product-details-readmore:hover {
    color: #c1ffb4 !important;
    text-decoration: none !important;
}

/* Details section title taxonomy */
.dgwt-wcas-details-title-tax {
    color: rgba(200, 200, 200, 0.65) !important;
}

/* Tax product details row */
.dgwt-wcas-tax-product-details:hover {
    box-shadow: 0 0 11px 2px rgba(193, 255, 180, 0.08) !important;
}

/* --------------------------------------------------------------------------
   9. PRODUCT IMAGE THUMBNAILS
   -------------------------------------------------------------------------- */

.dgwt-wcas-si img {
    background: rgba(128, 128, 128, 0.08) !important;
    border: 1px solid rgba(128, 128, 128, 0.2) !important;
    border-radius: 6px !important;
    padding: 2px !important;
    /* Force images to display immediately (override JS slow fade-in) */
    opacity: 1 !important;
    visibility: visible !important;
    transition: none !important;
    animation: none !important;
}

.dgwt-wcas-tpd-image {
    background-color: rgba(128, 128, 128, 0.08) !important;
    border: 1px solid rgba(128, 128, 128, 0.2) !important;
    border-radius: 8px !important;
}

/* Details main image area */
.dgwt-wcas-details-main-image {
    border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
}

/* --------------------------------------------------------------------------
   10. HEADING GROUPS (when headings enabled in FiboSearch settings)
   -------------------------------------------------------------------------- */

.dgwt-wcas-has-headings .dgwt-wcas-suggestion-headline .dgwt-wcas-st {
    border-bottom: 1px solid rgba(193, 255, 180, 0.2) !important;
    color: rgba(193, 255, 180, 0.7) !important;
    text-transform: uppercase !important;
    font-size: 11px !important;
    letter-spacing: 1px !important;
}

.dgwt-wcas-suggestion.dgwt-wcas-suggestion-headline-v2 .dgwt-wcas-st {
    border-bottom: 1px solid rgba(193, 255, 180, 0.2) !important;
    color: rgba(193, 255, 180, 0.7) !important;
    padding-bottom: 3px !important;
}

.dgwt-wcas-has-headings .dgwt-wcas-suggestion.dgwt-wcas-suggestion-tax:hover,
.dgwt-wcas-has-headings .dgwt-wcas-suggestion.dgwt-wcas-suggestion-tax.dgwt-wcas-suggestion-selected {
    background: transparent !important;
    color: #c1ffb4 !important;
}

/* --------------------------------------------------------------------------
   11. "NO RESULTS" MESSAGE
   -------------------------------------------------------------------------- */

.dgwt-wcas-suggestion-nores {
    color: rgba(200, 200, 200, 0.55) !important;
}

.dgwt-wcas-suggestion-nores p {
    color: rgba(200, 200, 200, 0.75) !important;
}

/* --------------------------------------------------------------------------
   12. PRELOADER / SPINNER
   -------------------------------------------------------------------------- */

/* SVG circular spinner path – brand green stroke */
.dgwt-wcas-loader-circular-path {
    stroke: #c1ffb4 !important;
}

/* Recolour voice search / close buttons */
.dgwt-wcas-voice-search path,
.dgwt-wcas-close path {
    fill: rgba(200, 200, 200, 0.6) !important;
}

.dgwt-wcas-close:hover path {
    fill: #c1ffb4 !important;
}

/* ── Preloader / spinner fix ─────────────────────────────────────────────────
   Layout when typing:
   [Text Field]  [X Button]  [Magnifier Button]  (Input Border)  [Spinner]
   ──────────────────────────────────────────────────────────────────────── */

/* A) LOADING SPINNER only (not the X button) – move to the right of X */
.dgwt-wcas-preloader:not(.dgwt-wcas-close) {
    z-index: 2 !important;
    background-image: none !important;
    background: none !important;
    right: 12px !important;
    /* Inside the input, to the right of the X button */
    left: auto !important;
    position: absolute !important;
    width: 30px !important;
}

/* Ensure the spinner isn't clipped by any overflowing wrapper */
.dgwt-wcas-sf-wrapp {
    overflow: visible !important;
}

/* Style the inner preloader as a flex container – NO absolute repositioning */
.dgwt-wcas-inner-preloader {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    background: none !important;
    background-image: none !important;
    z-index: 2 !important;
}

/* CSS-only brand-green spinner ring via ::after */
.dgwt-wcas-inner-preloader::after {
    content: '' !important;
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    flex-shrink: 0 !important;
    border: 2.5px solid rgba(193, 255, 180, 0.2) !important;
    border-top-color: #c1ffb4 !important;
    border-radius: 50% !important;
    animation: fms-spin 0.7s linear infinite !important;
    box-sizing: border-box !important;
}

/* Hide FiboSearch's own SVG loader circle (we replace it with ::after) */
.dgwt-wcas-inner-preloader .dgwt-wcas-loader-circular {
    display: none !important;
}

@keyframes fms-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* B) X / CLEAR BUTTON ───────────────────────────────────────────────────────
   Fix: Pin X inside the input, to the left of the spinner.
        Push Submit/Magnifier completely outside to the right edge.
   ──────────────────────────────────────────────────────────────────────── */

/* Override the inline style="right:32px" – pin X inside the left of spinner */
.dgwt-wcas-style-pirx .dgwt-wcas-preloader.dgwt-wcas-close,
.dgwt-wcas-preloader.dgwt-wcas-close {
    right: 44px !important;
    left: auto !important;
    z-index: 3 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 100% !important;
    cursor: pointer !important;
    background: none !important;
    background-image: none !important;
}

/* Style the X SVG to match theme */
.dgwt-wcas-preloader.dgwt-wcas-close svg path {
    fill: rgba(200, 200, 200, 0.55) !important;
    transition: fill 0.15s ease !important;
}

.dgwt-wcas-preloader.dgwt-wcas-close:hover svg path {
    fill: #c1ffb4 !important;
}

/* Pinned Magnifier Button: ALWAYS outside the input to the right */
.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp button.dgwt-wcas-search-submit {
    right: -40px !important;
    left: auto !important;
}

/* Ensure empty-state icons inside input don't appear (magnifier color override handles this) */
.dgwt-wcas-no-submit .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
    padding-left: 16px !important;
    /* text starts immediately */
}

/* Hide the default empty-state magnifier completely since we pinned the button outside */
.dgwt-wcas-style-pirx .dgwt-wcas-ico-magnifier-wrapp {
    display: none !important;
}

/* Right padding: always clear both X and Spinner when filled */
.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
    padding-right: 86px !important;
}


/* --------------------------------------------------------------------------
   13. STOCK BADGES
   -------------------------------------------------------------------------- */

.dgwt-wcas-stock.in-stock {
    color: #c1ffb4 !important;
}

.dgwt-wcas-stock.out-of-stock {
    color: #e2401c !important;
}

/* --------------------------------------------------------------------------
   14. STAR RATING (WooCommerce stars inside details panel)
   -------------------------------------------------------------------------- */

.woocommerce .dgwt-wcas-pd-rating .star-rating {
    color: #c1ffb4 !important;
}

.dgwt-wcas-pd-review {
    color: rgba(200, 200, 200, 0.5) !important;
}

/* --------------------------------------------------------------------------
   15. MOBILE OVERLAY
   -------------------------------------------------------------------------- */

.dgwt-wcas-overlay-mobile {
    background: rgba(10, 10, 10, 0.95) !important;
    -webkit-backdrop-filter: blur(24px) !important;
    backdrop-filter: blur(24px) !important;
}

.dgwt-wcas-om-bar {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.dgwt-wcas-om-bar button.dgwt-wcas-om-return,
.dgwt-wcas-om-bar button.dgwt-wcas-om-return:hover,
.dgwt-wcas-om-bar button.dgwt-wcas-om-return:focus,
.dgwt-wcas-om-bar button.dgwt-wcas-om-return:active {
    background: rgba(128, 128, 128, 0.1) !important;
}

.dgwt-wcas-om-bar .dgwt-wcas-om-return svg {
    fill: #c1ffb4 !important;
}

.dgwt-wcas-dgwt-wcas-search-wrapp-mobile input[type="search"].dgwt-wcas-search-input,
.dgwt-wcas-search-wrapp-mobile input[type="search"].dgwt-wcas-search-input {
    background: transparent !important;
    border-top: none !important;
    border-right: none !important;
    border-left: none !important;
    border-bottom: 1px solid rgba(128, 128, 128, 0.25) !important;
    border-radius: 0 !important;
    color: #ececec !important;
}

.dgwt-wcas-overlay-mobile-on .dgwt-wcas-suggestions-wrapp {
    background: rgba(10, 10, 10, 0.95) !important;
    border: none !important;
}

.dgwt-wcas-open-pirx.dgwt-wcas-overlay-mobile-on .dgwt-wcas-om-bar button.dgwt-wcas-om-return {
    background: rgba(128, 128, 128, 0.08) !important;
}

.dgwt-wcas-open-pirx.dgwt-wcas-overlay-mobile-on .dgwt-wcas-om-bar button.dgwt-wcas-om-return path {
    fill: #c1ffb4 !important;
}

.dgwt-wcas-open-pirx.dgwt-wcas-overlay-mobile-on .dgwt-wcas-suggestions-wrapp {
    border-top: 1px solid rgba(193, 255, 180, 0.1) !important;
}

/* --------------------------------------------------------------------------
   16. ICON LAYOUT (magnifier icon mode, popup search)
   -------------------------------------------------------------------------- */

.dgwt-wcas-layout-icon-open .dgwt-wcas-search-icon-arrow {
    background: rgba(10, 10, 10, 0.9) !important;
    border: 1px solid rgba(193, 255, 180, 0.2) !important;
}

/* --------------------------------------------------------------------------
   17. PIRX COMPACT VARIANT
   -------------------------------------------------------------------------- */

html:not(.dgwt-wcas-overlay-mobile-on) .dgwt-wcas-style-pirx.dgwt-wcas-style-pirx-compact .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
    background: rgba(128, 128, 128, 0.10) !important;
    box-shadow: 0 0 0 1px rgba(128, 128, 128, 0.25) !important;
    color: #ececec !important;
}

html:not(.dgwt-wcas-overlay-mobile-on) .dgwt-wcas-style-pirx.dgwt-wcas-style-pirx-compact.dgwt-wcas-search-focused .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input {
    border-color: #c1ffb4 !important;
    box-shadow: 0 0 0 4px rgba(193, 255, 180, 0.15) !important;
}

.dgwt-wcas-style-pirx.dgwt-wcas-style-pirx-compact .dgwt-wcas-sf-wrapp {
    border-radius: 12px 12px 0 0 !important;
}

/* --------------------------------------------------------------------------
   18. "HISTORY" / CLEAR LINK
   -------------------------------------------------------------------------- */

.dgwt-wcas-sugg-hist-clear {
    color: rgba(193, 255, 180, 0.6) !important;
}

.dgwt-wcas-sugg-hist-clear:hover {
    color: #c1ffb4 !important;
    opacity: 1 !important;
}

/* --------------------------------------------------------------------------
   19. "DARKENED OVERLAY" (dark veil behind the search bar when open)
      Keep mostly as-is, just match brand opacity
   -------------------------------------------------------------------------- */

.dgwt-wcas-darkened-overlay>div {
    background: #0a0a0a !important;
}

/* --------------------------------------------------------------------------
   20. ADD-TO-CART BUTTON (in details panel)
   -------------------------------------------------------------------------- */

.dgwt-wcas-pd-addtc .add_to_cart_button,
.dgwt-wcas-pd-addtc .add_to_cart_inline {
    background: #c1ffb4 !important;
    color: #1a1a1a !important;
    border: none !important;
    border-radius: 8px !important;
    transition: filter 0.2s ease !important;
}

.dgwt-wcas-pd-addtc .add_to_cart_button:hover {
    filter: brightness(108%) !important;
}

/* --------------------------------------------------------------------------
   21. RESPONSIVE FIXES
   -------------------------------------------------------------------------- */

@media screen and (max-width: 992px) {
    .dgwt-wcas-is-detail-box .dgwt-wcas-suggestions-wrapp {
        max-width: none !important;
    }
}