/* ==============================================
   Responsive CSS — Mobile / Tablet Overrides
   Loaded after custom.css
   ============================================== */

/* ----------------------------------------------
   Mobile (max-width: 767px)
   - Top bar: centered text, stacked
   - Header row: logo LEFT, hamburger RIGHT
   ---------------------------------------------- */
    .pages .action.next::before {
        line-height: 38px;
    }
    .pages .action.previous:before {
        line-height: 38px;
    }
    .pages .action.next:hover::before {
        color: #fff;
    }
    .pages .action.previous:hover::before {
        color: #fff;
    }

    .pages .item a:hover,
    .pages .item strong.page:hover {
    box-shadow: none;
}
.pages .item.pages-item-previous a,
.pages .item.pages-item-next a {
    box-shadow: none;
}

@media only screen and (max-width: 767px) {

    span.action.nav-toggle {
        display: none;
    }

    .page-header {
        margin-bottom: 0px;
    }

    /* ---- Top Bar: center align everything ---- */
    .page-header .wds-top-bar {
        text-align: center;
    }
    .page-header .wds-top-bar .wds-container {
        justify-content: center;
        padding: 8px 15px;
    }
    .page-header .wds-top-bar .wds-container > div:first-child {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        text-align: center;
        width: 100%;
    }
    .wds-top-bar .wds-top-bar__left,
    .wds-top-bar .wds-top-bar__right {
        width: 100%;
        text-align: center;
        justify-content: center;
        align-items: center;
        gap: 4px;
    }
    .wds-top-bar .wds-top-bar__right {
        flex-flow: column;
    }
    .wds-top-bar .wds-top-bar__message,
    .wds-top-bar .wds-top-bar__message p,
    .wds-top-bar .wds-top-bar__message span,
    .wds-top-bar .wds-top-bar__promo-line {
        text-align: center;
        width: 100%;
    }

    /* ---- Main Header: row layout, logo left, hamburger right ---- */
    .page-header .wds-header__main .wds-container {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        flex-wrap: nowrap;
        /*height: auto;
        padding: 8px 15px;
        position: relative;*/
    }

    /* Logo — LEFT */
    .wds-header__main .wds-header__logo {
        order: 1;
        flex: 0 0 auto;
        margin: 0;
        padding: 0;
        text-align: left;
        width: auto;
        max-width: 60%;
    }
    .wds-header__main .wds-header__logo a {
        display: inline-block;
        margin: 0;
        text-align: left;
    }
    .wds-header__main .wds-header__logo a img {
        max-height: 50px;
        width: auto;
        max-width: 100%;
        display: block;
    }

    /* Header icons — sit between logo and hamburger */
    .wds-header__main .wds-header__icons {
        order: 2;
        margin: 0 0 0 auto;
        padding: 0;
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .wds-header__icons .wds-minicart-wrap .wds-cart-link::after {
        display: none; /* hide decorative red triangle on mobile */
    }
    .wds-header__icons .wds-icon-label,
    .wds-header__icons .wds-minicart-wrap .wds-cart-link {
        line-height: normal;
        padding: 0 6px;
        font-size: 13px;
    }

    /* Hamburger — RIGHT */
    .wds-header__main .wds-nav__toggle {
        order: 3;
        display: flex;
        margin-left: 8px;
        padding: 6px;
        position: static;
    }
}

/* ----------------------------------------------
   Mobile Nav Drawer — Inline drop-down below header
   (max-width: 1024px so tablet also gets it)

   Mockup spec: menu opens inline BELOW the header,
   pushing page content down. Hamburger toggles it.
   No close X, no overlay — just an in-flow panel
   that collapses via max-height transition.

   Uses `nav.wds-nav` + !important to beat the
   competing position:fixed / width:300px rules in
   _megamenu.less and _header.less (compiled into
   styles-m.css).
   ---------------------------------------------- */
@media only screen and (max-width: 1024px) {

    /* Inline drop-down menu — collapsed by default.
       NOTE: _megamenu.less applies `display: flex; align-items: center;
       justify-content: flex-end` to .wds-nav unconditionally, which would
       shrink children to their content width and center them. We force
       `display: block` at mobile to defeat that. */
    nav.wds-nav,
    .wds-nav {
        position: static !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        transform: none !important;
        visibility: visible !important;
        display: block !important;
        flex: none !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        flex-direction: column !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: 0 !important;
        background: #fff !important;
        box-shadow: none !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        transition: max-height 0.3s ease !important;
        z-index: auto !important;
    }
    nav.wds-nav.wds-nav--open,
    .wds-nav.wds-nav--open {
        max-height: 2000px !important; /* large enough for full category list */
        overflow-y: auto !important;
    }

    /* Hide the close X — mockup has no close button.
       Hamburger in header toggles open/close. */
    .wds-nav .wds-nav__close {
        display: none !important;
    }

    /* Hide overlay — menu is inline now, doesn't darken the page. */
    .wds-nav__overlay,
    .wds-nav__overlay.wds-nav__overlay--visible {
        display: none !important;
    }

    /* Body should keep scrolling — menu is part of page flow. */
    body.nav-open,
    html.nav-open {
        overflow: auto !important;
        height: auto !important;
        width: auto !important;
    }

    /* Defeat Luma's mobile-nav drape + page shift, in case
       something still adds .nav-open / .nav-before-open. */
    .nav-open .page-wrapper,
    .nav-before-open .page-wrapper {
        left: 0 !important;
        position: static !important;
        overflow-y: visible !important;
    }
    .nav-open .nav-toggle::after,
    .nav-open .nav-toggle::before {
        display: none !important;
        content: none !important;
        background: transparent !important;
    }
    .nav-before-open body,
    .nav-before-open html {
        overflow: visible !important;
        height: auto !important;
        position: static !important;
    }

    /* Luma may also render a .nav-sections wrapper inside the header
       (because of <move element="navigation.sections"...> in default.xml).
       Make sure it doesn't paint a gray background or eat space. */
    .nav-sections {
        background: transparent !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Search bar at top of drop-down — single thin gray border
       wrapping both input and button, teal flat button on right
       with white magnifier icon. Matches mockup. */
    .wds-nav .wds-nav__search {
        padding: 15px !important;
        margin: 0 !important;
        border: 0 !important;
        background: #fff !important;
    }
    .wds-nav .wds-nav__search-form {
        display: flex !important;
        align-items: stretch !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 1px solid #d0d0d0 !important;
        border-radius: 0 !important;
        background: #fff !important;
        box-shadow: none !important;
        overflow: hidden;
    }
    .wds-nav .wds-nav__search-input {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        height: 42px !important;
        padding: 0 14px !important;
        margin: 0 !important;
        background: #fff !important;
        border: 0 !important;
        border-radius: 0 !important;
        font-family: 'Lato', sans-serif !important;
        font-size: 14px !important;
        font-weight: 400 !important;
        color: #555 !important;
        outline: none !important;
        box-shadow: none !important;
    }
    .wds-nav .wds-nav__search-input::placeholder {
        color: #9b9b9b !important;
        opacity: 1 !important;
    }
    .wds-nav .wds-nav__search-btn {
        flex: 0 0 auto !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 48px !important;
        height: 42px !important;
        padding: 0 !important;
        margin: 0 !important;
        background: #129dba !important;
        color: #fff !important;
        border: 0 !important;
        border-radius: 0 !important;
        font-size: 16px !important;
        line-height: 1 !important;
        cursor: pointer !important;
        outline: none !important;
        box-shadow: none !important;
    }
    .wds-nav .wds-nav__search-btn:hover,
    .wds-nav .wds-nav__search-btn:focus {
        background: #0e8aa3 !important;
    }
    .wds-nav .wds-nav__search-btn .fa,
    .wds-nav .wds-nav__search-btn i {
        color: #fff !important;
        font-size: 16px !important;
        line-height: 1 !important;
    }

    /* Reset list defaults — Luma adds `padding: 15px` on .navigation
       at mobile via its lib, which would inset our gray bars. Strip
       all padding/margin so items sit edge-to-edge. */
    .wds-nav .navigation,
    .wds-nav .navigation ul {
        background: #fff !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    .wds-nav .navigation > ul {
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
        width: 100% !important;
    }
    .wds-nav .navigation li.level0 {
        display: block !important;
        margin: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #fff !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
        position: relative;
    }

    /* Top-level link — flat gray bar, white uppercase text */
    .wds-nav .navigation li.level0 > a,
    .wds-nav .navigation li.level0 > a.level-top {
        display: block !important;
        background: #8a8a8a !important;
        color: #fff !important;
        font-family: 'Lato', sans-serif !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
        padding: 16px 45px 16px 20px !important;
        margin: 0 !important;
        line-height: 1.2 !important;
        text-decoration: none !important;
        position: relative;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    .wds-nav .navigation li.level0 > a:hover,
    .wds-nav .navigation li.level0 > a.level-top:hover,
    .wds-nav .navigation li.level0 > a:focus,
    .wds-nav .navigation li.level0 > a.level-top:focus {
        background: #7a7a7a;
        color: #fff;
        text-decoration: none;
    }
    .wds-nav .navigation li.level0 > a span,
    .wds-nav .navigation li.level0 > a.level-top span {
        color: inherit;
    }

    /* Hide Magento's default ui-menu-icon arrow */
    .wds-nav .navigation li.level0 > a .ui-menu-icon {
        display: none !important;
    }

    /* + / - indicator on parent items */
    .wds-nav .navigation li.level0.parent > a::after,
    .wds-nav .navigation li.level0.parent > a.level-top::after {
        content: '+';
        position: absolute;
        right: 20px;
        top: 50%;
        transform: translateY(-50%);
        font-size: 22px;
        font-weight: 400;
        line-height: 1;
        color: #fff;
    }
    .wds-nav .navigation li.level0.parent.is-open > a::after,
    .wds-nav .navigation li.level0.parent.is-open > a.level-top::after {
        content: '\2013'; /* en dash, looks cleaner than hyphen */
    }

    /* Submenu — hidden by default, shown when parent .is-open */
    .wds-nav .navigation li.level0 > ul.submenu,
    .wds-nav .navigation li.level0 > ul {
        display: none;
        position: static;
        background: #fff;
        box-shadow: none;
        border: 0;
        border-radius: 0;
        padding: 0;
        margin: 0;
        min-width: 0;
        list-style: none;
    }
    .wds-nav .navigation li.level0.parent.is-open > ul.submenu,
    .wds-nav .navigation li.level0.parent.is-open > ul {
        display: block;
    }

    /* Submenu items — white bg, dark uppercase bold text */
    .wds-nav .navigation li.level0 ul li {
        display: block;
        border: 0;
        border-bottom: 1px solid #ececec;
    }
    .wds-nav .navigation li.level0 ul li a {
        display: block;
        background: #fff;
        color: #1a1a1a;
        font-family: 'Lato', sans-serif;
        font-size: 14px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        padding: 14px 20px 14px 30px;
        line-height: 1.2;
        text-decoration: none;
        white-space: normal;
    }
    .wds-nav .navigation li.level0 ul li a:hover,
    .wds-nav .navigation li.level0 ul li a:focus {
        background: #f4f4f4;
        color: #1a1a1a;
        text-decoration: none;
    }
    .wds-nav .navigation li.level0 ul li a span {
        color: inherit;
    }

    /* Nested submenu (level2+) indentation */
    .wds-nav .navigation li.level0 ul ul li a {
        padding-left: 45px;
        font-weight: 400;
    }
}

/* ----------------------------------------------
   Hero / Skin Finder — mobile portrait
   Per Responsive-LidStyles-Hero.png:
   - Photo backdrop with a light overlay
   - Big stacked headline: red "FIND THE / PERFECT / SKIN"
     then darker "& SHOW OFF / YOUR / DEVICE!"
   - Teal CTA pill "Let's find your new skin!" above
     the dark form bar
   - Form bar: 4 stacked full-width dropdowns + full-width
     teal SHOP button

   _hero.less already has a mobile media query that drops
   the form to a single column — those rules are fine. We
   only override headline sizing/weight, overlay opacity,
   and the surrounding spacing so the layout matches the
   mockup.
   ---------------------------------------------- */
@media only screen and (max-width: 767px) {

    /* Let content dictate height — desktop sets a 360px min
       that crops things on phones. */
    .wds-hero {
        min-height: auto;
    }

    /* Lighter overlay — mostly white at top fading to
       transparent so the photo subject stays visible. */
    .wds-hero__overlay {
        background: linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.92) 0%,
            rgba(255, 255, 255, 0.85) 35%,
            rgba(255, 255, 255, 0.45) 65%,
            transparent 100%
        );
    }

    /* Headline pinned top-left with comfortable padding. */
    .wds-hero__content {
        padding: 28px 0 18px;
        align-items: flex-start;
    }
    .wds-hero__text {
        max-width: 100%;
        padding: 0 22px;
        margin: 0;
    }
    .wds-hero__headline {
        gap: 4px;
        line-height: 1;
    }

    /* Big bold red headline (matches mockup proportions) */
    .wds-hero__headline--red {
        font-size: 46px;
        line-height: 1;
        font-weight: 700;
        letter-spacing: -0.5px;
        color: #c0392b;
    }

    /* Slightly lighter weight on the black/dark line */
    .wds-hero__headline--black {
        font-size: 38px;
        line-height: 1.05;
        font-weight: 400;
        letter-spacing: -0.5px;
        color: #2c3e50;
    }

    /* Teal CTA pill — keep speech-bubble pointer at bottom */
    .wds-hero__cta-bubble {
        padding: 0 22px;
    }
    .wds-hero__cta-bubble span {
        font-size: 13px;
        padding: 9px 18px;
        background: #129dba;
        color: #fff;
    }

    /* Dark form bar with side padding so dropdowns aren't flush */
    .wds-hero__form-bar {
        padding: 14px 22px 18px;
        background: rgba(0, 0, 0, 0.78);
    }

    /* Single-column stack at mobile (≤767px) — 4 dropdowns + SHOP,
       matching Responsive-LidStyles-Hero.png.
       Use CSS grid so the SHOP cell can span via `grid-column: 1/-1`,
       and so the 768–1024 tablet block can flip to 2 columns cleanly.
       Override desktop's `display: flex; align-items: center; flex-wrap: wrap`
       by switching display to grid entirely. */
    .wds-skin-finder {
        display: grid !important;
        grid-template-columns: 1fr !important;
        column-gap: 10px !important;
        row-gap: 10px !important;
        align-items: stretch !important;
        width: 100% !important;
        /* Neutralise any leftover flex properties so they can't fight grid. */
        flex-direction: unset !important;
        flex-wrap: unset !important;
    }
    .wds-skin-finder__field {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    .wds-skin-finder__field select {
        width: 100% !important;
        height: 44px;
        font-size: 13px;
        font-family: 'Lato', sans-serif;
        color: #2c3e50;
        background-color: #fff;
        border: 1px solid #e0e0e0;
        border-radius: 3px;
    }
    /* SHOP button cell spans both columns */
    .wds-skin-finder__submit {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    .wds-skin-finder__btn {
        width: 100% !important;
        height: 46px;
        background: #129dba;
        color: #fff;
        font-family: 'Lato', sans-serif;
        font-size: 16px;
        font-weight: 700;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        border: 0;
        border-radius: 3px;
        cursor: pointer;
    }
    .wds-skin-finder__btn:hover,
    .wds-skin-finder__btn:focus {
        background: #0e8aa3;
    }
}

/* ----------------------------------------------
   Hero — Tablet (768–1024px)
   2-column grid for the dropdowns, SHOP spans both.
   ---------------------------------------------- */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .wds-skin-finder {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        column-gap: 12px !important;
        row-gap: 10px !important;
        align-items: stretch !important;
        width: 100% !important;
        flex-direction: unset !important;
        flex-wrap: unset !important;
    }
    .wds-skin-finder__field {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    .wds-skin-finder__field select {
        width: 100% !important;
        height: 46px;
    }
    .wds-skin-finder__submit {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    .wds-skin-finder__btn {
        width: 100% !important;
        height: 48px;
    }
}

/* ==============================================
   Wholesale teaser — mobile portrait
   Per Responsive-LidStyles-Wholesale.png:
   - Teal "WHOLESALE" header strip, thin/light caps
   - Dark panel with bg image + navy overlay
   - "Why Are Lidstyles Skins Right For Your
     Business?" heading
   - 2×2 grid of feature icons (img + label)
   - Centered description paragraph
   - Stacked full-width LEARN MORE (filled white)
     and DEALER PORTAL (outline) buttons

   _wholesale.less mobile rules drop features to a
   single column and cap buttons at 280px — we
   override both to match the mockup's 2×2 grid
   and full-width stacked buttons.
   ============================================== */
@media only screen and (max-width: 767px) {

    /* Header strip — bigger, lighter WHOLESALE title */
    .wds-wholesale .wds-wholesale__header {
        padding: 0 !important;
    }
    .wds-wholesale .wds-wholesale__header .wds-wholesale__header-title {
        font-size: 30px !important;
        font-weight: 300 !important;
        line-height: 1.2 !important;
        padding: 18px 16px !important;
        letter-spacing: 0.5px;
    }

    /* Body padding via overlay */
    .wds-wholesale .wds-wholesale__overlay {
        padding: 32px 20px !important;
    }

    /* Inner container */
    .wds-wholesale .wds-container {
        max-width: 100% !important;
        padding: 0 !important;
    }

    /* Heading — fill panel width */
    .wds-wholesale .wds-wholesale__heading {
        font-size: 22px !important;
        line-height: 1.3 !important;
        font-weight: 700 !important;
        max-width: 100% !important;
        margin: 0 0 28px !important;
        text-align: center !important;
    }

    /* Features — 2×2 grid (override LESS single-column + custom.css 25% width).
       No max-width — let the grid fill the panel; the overlay's 20px side
       padding is the only inset. */
    .wds-wholesale .wds-wholesale__features {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        column-gap: 16px !important;
        row-gap: 28px !important;
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 0 28px !important;
        flex-wrap: unset !important;
    }
    .wds-wholesale .wds-wholesale__features .wds-wholesale__feature {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        padding: 0 !important;
        text-align: center !important;
    }
    /* Icon is an <img> direct child of .wds-wholesale__feature
       (no .wds-wholesale__icon wrapper in this CMS block) */
    .wds-wholesale .wds-wholesale__features .wds-wholesale__feature img {
        display: block !important;
        width: 56px !important;
        height: 56px !important;
        margin: 0 auto 10px !important;
        object-fit: contain;
    }
    .wds-wholesale .wds-wholesale__feature .wds-wholesale__label {
        font-size: 14px !important;
        line-height: 1.3 !important;
        font-weight: 400 !important;
        text-transform: capitalize !important;
        margin: 0 !important;
        color: #fff;
    }

    /* Description — full panel width minus overlay padding */
    .wds-wholesale .wds-wholesale__desc {
        font-size: 13.5px !important;
        line-height: 1.55 !important;
        font-weight: 300 !important;
        color: rgba(255, 255, 255, 0.85) !important;
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 0 28px !important;
        text-align: center !important;
    }

    /* Actions — stacked full-width buttons (fill panel) */
    .wds-wholesale .wds-wholesale__actions {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 !important;
    }
    .wds-wholesale .wds-wholesale__actions .wds-wholesale__btn {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 13px 18px !important;
        height: auto !important;
        font-size: 14px !important;
        letter-spacing: 0.5px;
    }
}

/* ==============================================
   Footer — mobile portrait
   Per Responsive-LidStyles-Footer.png:
   single column on red hexagon bg.
   Stack order (different from DOM source order):
     1. Email Newsletter Signup (dark-wine box)
     2. Shop By Brand
     3. Shop By Device
     4. Website Links + Social Media
     5. Copyright + shipping disclaimer (no dark bar)

   The DOM order is Brand → Links → Newsletter
   inside .ls-footer-inner, with Device row as a
   sibling AFTER .ls-footer-inner. We use
   `display: contents` on the inner to promote
   its children to direct flex children of
   `.ls-footer-main`, then assign `order` values
   to all four blocks (Brand, Links, Newsletter,
   Device) so they render in mockup order.
   ============================================== */
@media only screen and (max-width: 767px) {

    /* Footer main becomes a flex column so we can use `order` */
    .footer .ls-footer-main {
        display: flex !important;
        flex-direction: column !important;
        padding: 0 !important;
    }
    .footer .ls-footer-main .ls-footer-inner {
        display: contents;
    }

    /* Order assignments (matches mockup) */
    .footer .ls-footer-newsletter {
        order: 1;
    }
    .footer .ls-footer-main .footer_shop_brand,
    .footer .ls-footer-main .ls-footer-inner > .ls-footer-col:nth-child(1) {
        order: 2;
    }
    .footer .ls-footer-main .footer_shop_device,
    .footer .ls-footer-main > .ls-footer-device-row {
        order: 3;
    }
    .footer .ls-footer-main .footer_website_links,
    .footer .ls-footer-main .ls-footer-inner > .ls-footer-col:nth-child(2) {
        order: 4;
    }

    /* ---- Newsletter — dark-wine full-width box, stacked form ---- */
    .footer .ls-footer-inner .ls-footer-newsletter {
        width: 100% !important;
        float: none !important;
        max-height: none !important;
        flex: 0 0 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 24px 20px !important;
        background: #6d1d19 !important;
        border-radius: 0 !important;
    }
    .footer .ls-footer-inner .ls-footer-newsletter .ls-footer-heading {
        font-size: 18px !important;
        line-height: 1.25 !important;
        margin: 0 0 10px 0 !important;
    }
    .footer .ls-footer-inner .ls-footer-newsletter p {
        font-size: 14px !important;
        line-height: 1.5 !important;
        margin: 0 0 16px 0 !important;
    }
    .footer .ls-footer-inner .ls-footer-newsletter .ls-newsletter-label {
        font-size: 14px !important;
        margin-bottom: 6px !important;
    }
    .footer .ls-footer-main .ls-footer-newsletter .ls-newsletter-form {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        align-items: flex-start !important;
    }
    .footer .ls-footer-main .ls-footer-newsletter .ls-newsletter-form input[type="email"] {
        width: 100% !important;
        max-width: 100% !important;
        height: 42px !important;
        padding: 10px 14px !important;
        background: #fff !important;
        border: 0 !important;
        color: #555 !important;
        font-family: 'Lato', sans-serif !important;
        font-size: 14px !important;
    }
    .footer .ls-footer-main .ls-footer-newsletter .ls-newsletter-form button:hover {
        background: #ffffff !important;
        color: #c0392b !important;
    }

    /* ---- Columns (Shop By Brand, Website Links, Shop By Device) ---- */
    .footer .ls-footer-main .ls-footer-col,
    .footer .ls-footer-main .footer_shop_brand,
    .footer .ls-footer-main .footer_website_links {
        padding: 18px 0px 6px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }
    .footer .ls-footer-main .footer_shop_device,
    .footer .ls-footer-main .ls-footer-device-row {
        max-width: 100% !important;
        padding: 18px 20px 6px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        width: 100% !important;
    }
    .footer .ls-footer-main .footer_shop_device .ls-footer-device-row {
        /*padding: 0 !important;*/
        margin: 0 !important;
    }
    .footer .ls-footer-main .ls-footer-device-row .ls-footer-col {
        padding: 0 !important;
    }

    /* Column headings + lists */
    .page-footer .footer .ls-footer .ls-footer-main .footer_website_links .ls-footer-col .ls-footer-heading.ls-footer-heading--social {
        margin: 18px 0 10px 0 !important;
    }
    .ls-footer .ls-footer-main .ls-footer-col ul li {
        margin: 0 0 4px 0 !important;
    }
    .ls-footer .ls-footer-main .ls-footer-col ul li a {
        font-size: 14px !important;
        font-weight: 600 !important;
        color: #fff;
    }

    /* Social icons — smaller squares, tighter gap */
    .footer .ls-footer-main .ls-social-links .ls-social-list {
        gap: 8px !important;
    }
    .footer .ls-footer-main .ls-social-links .ls-social-list li a {
        width: 32px !important;
        height: 32px !important;
    }
    .ls-social-links .ls-social-list li a svg {
        height: 16px !important;
    }

    /* ---- Bottom bar — transparent over red, left-aligned, white text ---- */
    .footer .ls-footer-bottom {
        background: transparent !important;
        padding: 14px 20px !important;
        border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
    }
    .footer .ls-footer-bottom .ls-footer-bottom-inner {
        max-width: 100% !important;
        padding: 0 !important;
        text-align: left !important;
        flex-direction: column !important;
        gap: 4px !important;
    }
    .footer .ls-footer-bottom .ls-footer-bottom-inner .ls-copyright {
        /*color: #fff !important;
        font-size: 13px !important;
        font-weight: 400 !important;
        margin: 0 !important;*/
    }
    .footer .ls-footer-bottom .ls-footer-bottom-inner .ls-shipping-note {
        /*color: rgba(255, 255, 255, 0.85) !important;
        font-size: 11px !important;
        font-style: italic !important;
        margin: 4px 0 0 0 !important;*/
    }
}

/* ----------------------------------------------
   Small mobile (max-width: 480px)
   - Tighter spacing
   ---------------------------------------------- */
@media only screen and (max-width: 480px) {
    .page-header .wds-top-bar,
    .wds-top-bar .wds-top-bar__message,
    .wds-top-bar .wds-top-bar__message p,
    .wds-top-bar .wds-top-bar__message span,
    .wds-top-bar .wds-top-bar__promo-line {
        font-size: 12px;
        line-height: 1.3;
    }
    .wds-header__main .wds-header__logo a img {
        max-height: 42px;
    }
    .wds-header__main .wds-nav__toggle-bar {
        width: 26px;
        height: 4px;
    }

    /* Hero — tighten headline a notch on very narrow phones */
    .wds-hero__headline--red {
        font-size: 38px;
    }
    .wds-hero__headline--black {
        font-size: 32px;
    }
    .wds-hero__text {
        padding: 0 18px;
    }
    .wds-hero__cta-bubble {
        padding: 0 18px;
    }
    .wds-hero__form-bar {
        padding: 12px 18px 16px;
    }

    /* Wholesale — tighter on narrow phones */
    .wds-wholesale .wds-wholesale__header .wds-wholesale__header-title {
        font-size: 26px !important;
        padding: 16px 12px !important;
    }
    .wds-wholesale .wds-wholesale__overlay {
        padding: 24px 16px !important;
    }
    .wds-wholesale .wds-wholesale__heading {
        font-size: 20px !important;
        margin: 0 auto 22px !important;
    }
    .wds-wholesale .wds-wholesale__features {
        row-gap: 22px !important;
        margin-bottom: 22px !important;
    }
    .wds-wholesale .wds-wholesale__features .wds-wholesale__feature img {
        width: 50px !important;
        height: 50px !important;
    }
    .wds-wholesale .wds-wholesale__feature .wds-wholesale__label {
        font-size: 13px !important;
    }
    .wds-wholesale .wds-wholesale__desc {
        font-size: 13px !important;
        margin-bottom: 22px !important;
    }
    .footer .ls-footer-inner .ls-footer-newsletter {
        padding: 20px 16px !important;
    }
    .footer .ls-footer-bottom {
        padding: 12px 16px !important;
    }
    .ls-footer .ls-footer-main .ls-footer-col ul li a {
        font-size: 13.5px !important;
    }
}
.wholesale-login .welcome,
.wholesale-links .button{
    color: #ffffff;
}
@media only screen and (max-width: 1199px){
    .wds-top-bar .wds-top-bar__right{
        gap: 0px;
    }
    .wds-header__icons .wds-minicart-wrap{
        margin-top: 0px;
    }
    .wds-dfd__body .wds-dfd__layout,
    .wds-complete-coverage .wds-cc__layout,
    .footer.content .ls-footer-main .ls-footer-inner{ 
        flex-direction: unset;
    }
    .footer .ls-footer-inner .ls-footer-newsletter{
        min-width: auto;
    }
    .wds-complete-coverage .wds-cc__content .wds-cc__title{
        font-size: 40px;
        line-height: 50px;
    }
    .wds-category-trust-bar .wds-category-trust-bar__item {
        gap: 12px;
        width: 25%;
        padding: 0 8px;
        box-sizing: border-box;
    }
    .wds-category-trust-bar .wds-category-trust-bar__icon {
        width: 48px;
        height: 48px;
    }
    .wds-category-trust-bar .wds-category-trust-bar__text strong,
    .wds-category-trust-bar .wds-category-trust-bar__text span {
        font-size: 14px;
    }
    .category-view .category-selector-dropdowns .wds-skin-finder-category {
        width: 25%;
    }
    .category-view .category-selector-wrapper h3 {
        font-size: 26px;
        line-height: 36px;
    }
    .category-view .category-selector-wrapper .category-selector-btn-wrap .action.primary {
        width: 280px;
    }
    .catalog-product-view .page-wrapper .column.main {
        grid-template-columns: 45% 1fr;
        gap: 0 16px;
    }
    .product-info-main .page-title-wrapper.product .page-title .base {
        font-size: 36px;
        line-height: 44px;
    }
    .catalog-product-view .columns .product-info-main .product-info-price .price-wrapper .price {
        font-size: 30px;
        line-height: 38px;
    }
    .wds-instructions-section__content .container {
        gap: 20px;
    }
    .catalog-product-view .wds-reviews-section .wds-reviews-section__subheading {
        font-size: 26px;
        line-height: 36px;
    }
    .page-products .product-item-info{
        width: auto;
    }
    .wholesale-login .col-md-24, .wholesale-main .col-md-24, .order-login .col-md-24, .skin-finder-content .col-md-24{
        margin-bottom: 20px;
    }
    .columns .sidebar.sidebar-additional .find-skin-form .find-example{
        margin: 15px 0 30px 0;
    }
    .au-right .std .team-block p {
	    height: 78px;
    }
    .pages .action.previous {
        margin-right: 0px;
    }
    .pages .action.next {
        margin-left: 0px;
    }
    .wds-top-bar__right .wds-top-bar__promo-line{
        font-size: 18px !important;
    }
    .wds-top-bar__right .wds-top-bar__promo-line.wds-top-bar__promo-line--bold{
        font-size: 11px !important;
    }
    .columns .sidebar.sidebar-main .block.filter .items .item a.remove{
        right: 0px;
    }
}
@media only screen and (max-width: 990px) {
    footer.page-footer{
        padding: 30px 0 0 0;
    }
  .footer.content .ls-footer-main .ls-footer-inner {
    display: flex;
    flex-wrap: wrap;
  }
  .footer_shop_brand {
    width: 50%;
    padding: 0;
  }
  .footer_website_links {
    width: 50%;
    padding: 0 0 0 10px;
  }
  .footer .ls-footer-inner .ls-footer-newsletter {
    width: 100%;
    float: none;
    max-height: none; 
    padding: 25px;
    box-sizing: border-box;
    margin-top: 20px;
  }
  .footer .ls-footer-main .ls-footer-newsletter .ls-newsletter-form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }
  .footer .ls-footer-main .ls-footer-newsletter .ls-newsletter-form input[type="email"] {
    flex: 1;
    min-width: 200px;
    width: 100%;
  }
  .footer .ls-footer-main .ls-footer-newsletter .ls-newsletter-form button {
    white-space: nowrap;
  }
  .footer .ls-footer-main .ls-footer-device-row .ls-footer-col ul {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 20px;
  }
  .wds-category-trust-bar .wds-category-trust-bar__inner {
    flex-wrap: wrap;
    padding: 16px;
  }
  .wds-category-trust-bar .wds-category-trust-bar__item {
    width: 50%;
    gap: 14px;
    padding: 12px 16px;
    box-sizing: border-box;
    justify-content: flex-start;
  }
  .wds-category-trust-bar .wds-category-trust-bar__icon {
    width: 50px;
    height: 50px;
  }
  .category-view .category-selector-wrapper h3 {
    font-size: 22px;
    line-height: 32px;
  }
  .category-view .category-selector-dropdowns {
    flex-wrap: wrap;
    gap: 12px;
  }
  .category-view .category-selector-dropdowns .wds-skin-finder-category {
    width: calc(50% - 6px);
  }
  .category-view .category-selector-dropdowns .wds-skin-finder-category::after {
    height: 43px;
  }
  .category-view .category-selector-wrapper .category-selector-btn-wrap .action.primary {
    width: 240px;
  }
  .catalog-product-view .page-wrapper .column.main {
    grid-template-columns: 1fr 1fr;
    gap: 0 14px;
  }
  .product-info-main .page-title-wrapper.product .page-title .base {
    font-size: 28px;
    line-height: 36px;
  }
  .catalog-product-view .columns .product-info-main .product-info-price .price-wrapper .price {
    font-size: 26px;
    line-height: 34px;
  }
  .catalog-product-view .columns .product.attribute.overview {
    font-size: 14px;
    line-height: 22px;
  }
  .catalog-product-view .product-info-main .box-tocart .actions .action.tocart {
    width: 120px;
    font-size: 14px;
  }
  .wds-instructions-section__content .container {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .wds-instructions-section__content .col-md-12:first-child .row .col-md-8 {
    width: 33.33%;
  }
  .catalog-product-view .wds-reviews-section .wds-reviews-section__subheading {
    font-size: 22px;
    line-height: 30px;
    padding: 16px 0 30px;
  }
  .catalog-product-view .columns .wds-reviews-section__cta {
    max-width: 100%;
  }
  .catalog-product-view #product-review-container .wds-review-list__author {
    flex: 0 0 180px;
  }
  .wds-category-trust-bar .wds-category-trust-bar__inner {
    flex-wrap: wrap;
  }
  .wds-category-trust-bar .wds-category-trust-bar__item {
    width: 50%;
    padding: 12px 16px;
    box-sizing: border-box;
    justify-content: flex-start;
  }
  .footer .ls-footer-bottom .ls-footer-bottom-inner,
  .footer .ls-footer-main .ls-footer-device-row, 
  .footer.content .ls-footer-main .ls-footer-inner{
    padding: 0px 20px;
  }
  .columns .wds-reviews-section{
    padding: 56px 20px 0;
  }
  .wds-instructions-section-mn .wds-instructions-section{
    padding: 25px 20px 23px;
  }
  .catalog-product-view .page-wrapper .column.main{
    padding: 0 20px;
  }
  .instructions .col-md-24{
    text-align: center;
  }
  .column.main .product-items{
    padding: 0px 15px;
  }
  .page-wrapper .products.products-grid .product-items{
    grid-template-columns: repeat(3, 1fr);
  }
  .cart-summary .checkout-methods-items .action.primary.checkout{
    font-size: 16px;
  }
  .wholesale-register-index #form-validate {
    padding: 0px;
  }
  .wholesale-register-index #form-validate h4 {
    font-size: 22px;
  }
 .home-special-slider .slick-arrow{
    width: 50px;
    height: 55px;
    margin-top: -20px;
 }
 .columns .sidebar.sidebar-main .filter-current .item{
    flex-wrap: wrap;
 }
 .home-special-slider .product-item{
    padding: 0px 5px;
 }
}
@media only screen and (max-width: 767px){
     .wds-dfd__body .wds-dfd__layout{
        flex-direction: column-reverse;
     }
     .wds-dfd__layout .wds-dfd__grid,
     .wds-dfd__layout .wds-dfd__preview{
        max-width: 100%;
     }
     .wds-complete-coverage .wds-cc__layout{
        flex-direction: column;
     }
     .wds-complete-coverage .wds-cc__viewer,
     .wds-complete-coverage .wds-cc__content{
        width: 100%;
        max-width: 100%;
     }
     .wds-category-trust-bar .wds-category-trust-bar__inner {
        padding: 12px;
    }
    .wds-category-trust-bar .wds-category-trust-bar__item {
        width: 50%;
        gap: 10px;
        padding: 10px 12px;
        justify-content: flex-start;
    }
    .wds-category-trust-bar .wds-category-trust-bar__icon {
        width: 44px;
        height: 44px;
    }
    .wds-category-trust-bar .wds-category-trust-bar__text strong,
    .wds-category-trust-bar .wds-category-trust-bar__text span {
        font-size: 13px;
    }
    .category-view .category-selector-wrapper {
        padding: 20px 0;
    }
    .category-view .category-selector-wrapper h3 {
        font-size: 20px;
        line-height: 28px;
        margin-bottom: 20px;
        padding: 0 15px;
    }
    .category-view .category-selector-dropdowns {
        flex-direction: column;
        gap: 10px;
        padding: 0 15px;
    }
    .category-view .category-selector-dropdowns .wds-skin-finder-category {
        width: 100%;
    }
    .category-view .category-selector-dropdowns select {
        width: 100%;
        font-size: 14px;
    }
    .category-view .category-selector-wrapper .category-selector-btn-wrap {
        padding: 0 15px;
    }
    .category-view .category-selector-wrapper .category-selector-btn-wrap .action.primary {
        width: 100%;
        box-sizing: border-box;
    }
    .catalog-product-view .page-wrapper .column.main {
        grid-template-columns: 1fr;
        padding: 0 12px;
        gap: 20px 0;
    }
    .catalog-product-view .columns .product.media {
        width: 100%;
    }
    .catalog-product-view .columns .product-info-main {
        width: 100%;
    }
    .product-info-main .page-title-wrapper.product .page-title .base {
        font-size: 24px;
        line-height: 30px;
    }
    .catalog-product-view .columns .product-info-main .product-info-price .price-wrapper .price {
        font-size: 24px;
        line-height: 30px;
    }
    .product-info-main .product-info-price .product-info-stock-sku .product.attribute.sku {
        font-size: 14px;
        margin-bottom: 16px;
    }
    .catalog-product-view .product-info-main .box-tocart .field.qty {
        width: 90px;
    }
    .product-info-main .product-social-links {
        margin: 24px 0 0 0;
    }
    .catalog-product-view .page-main .breadcrumbs .items {
        padding: 14px 12px 0;
        margin: 0 auto 12px;
    }
    .wds-instructions-section__content .container {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .wds-instructions-section__content .col-md-12:first-child .row .col-md-8 {
        width: 33.33%;
    }
    .wds-instructions-section__content .col-md-12:last-child .row h5,
    .wds-instructions-section__content .col-md-12:first-child .row h5 {
        font-size: 18px;
        padding: 12px 0 16px;
    }
    .wds-instructions-section-mn .wds-instructions-section {
        padding: 20px 15px;
    }
    .wds-instructions-section .wds-instructions-section__heading {
        font-size: 28px;
        line-height: 36px;
    }
    .columns .wds-reviews-section {
        padding: 30px 12px 0;
    }
    .columns .wds-reviews-section .wds-reviews-section__heading {
        font-size: 28px;
        line-height: 36px;
        padding: 0 0 20px;
    }
    .catalog-product-view .wds-reviews-section .wds-reviews-section__subheading {
        font-size: 20px;
        line-height: 28px;
        padding: 14px 0 28px;
    }
    .catalog-product-view .columns .wds-reviews-section__cta {
        max-width: 100%;
        padding: 10px;
    }
    .catalog-product-view .wds-reviews-section .block.review-add {
        padding: 40px 0 30px;
    }
    .catalog-product-view #product-review-container .wds-review-list__item {
        flex-direction: column;
        gap: 10px;
    }
    .catalog-product-view #product-review-container .wds-review-list__author {
        flex: none;
        width: 100%;
    }
    .wds-category-trust-bar .wds-category-trust-bar__item {
        width: 50%;
        gap: 10px;
        padding: 10px 12px;
        justify-content: flex-start;
        box-sizing: border-box;
    }
    .wds-category-trust-bar .wds-category-trust-bar__icon {
        width: 44px;
        height: 44px;
    }
    .wds-category-trust-bar .wds-category-trust-bar__text strong,
    .wds-category-trust-bar .wds-category-trust-bar__text span {
        font-size: 13px;
    }
    .footer .ls-footer-main .ls-footer-device-row{
        padding: 0px !important;
    }
    .home-special-slider .slick-arrow{
        width: 50px;
        height: 55px;
    }
    .home-special-slider .slick-next{
        right: 20px;
    }
    .home-special-slider .slick-prev{
        left: 20px;
    }
    .wds-complete-coverage .wds-container{
        padding: 0px 15px;
    }
    .columns .sidebar.sidebar-additional{
        padding-right: 0px;
        padding-bottom: 20px;
        padding-top: 20px;
    }
    .page-wrapper .wholesale-login .col-md-15, 
    .order-login .col-md-15,
    .page-wrapper .wholesale-login .col-md-9, 
    .order-login .col-md-9,
    body.wholesale-index-index .wholesale-info.row .col-md-16,
    body.wholesale-index-index .wholesale-info.row .col-md-8 + ul, 
    body.wholesale-index-index .wholesale-info.row .col-md-8{
        flex: auto;
        max-width: 100%;
        padding: 0px;
        width: 100%;
    }
    .page-main .page-title-wrapper .page-title{
        font-size: 36px;
    }
    .columns .sidebar-additional,
    .columns .sidebar-main,
    .catalog-product-view .product-info-main{
        order: 0;
    }
    .catalog-product-view .wds-instructions-section-mn{
        order: 4;
    }
    .sidebar.sidebar-main .block-title.filter-title{
        display: block;
        padding-bottom: 30px;
    }
    .sidebar.sidebar-main .filter-options{
        padding: 0px 15px;
    }
    .filter-title strong{
        background: #129dba;
        padding: 12px 15px;
        border: 2px solid #129dba;
        color: #ffffff;
        border-radius: 0;
        box-shadow: none;
        left: 12px;
        text-transform: uppercase;
        font-weight: 700;
        right: 12px;
    }
    .block-collapsible-nav{
        top: 0px;
    }
    .wholesale-login .col-md-4, .wholesale-main .col-md-4, .order-login .col-md-4, .skin-finder-content .col-md-4,
    .wholesale-main .col-md-19{
        max-width: 100% !important;
        flex: unset !important;
    }
    .sidebar.sidebar-additional .find-skin-form .find-skin-input-wrapper{
        max-width: 100%;
    }
    .sidebar.sidebar-additional .block.block-reorder{
        display: none;
    }
    .column.main .products.products-grid .product-items{
        padding: 0px;
    }
    .page-wrapper .products.products-grid .product-items{
        grid-template-columns: repeat(2, 1fr);
    }
    .filter-title strong{
        top: -30px;
    }
    .wds-dfd__laptop-wrap{
        margin-top: 30px;
    }
    .subcategories-section .wds-subcategory-grid{
        margin-bottom: 30px;
    }
    .au-right .std .team.row .team-block {
	    width: 100%;   
    }
    .au-right .std .team-block p {
        height: auto;
    }
    .pages .pages-items {
        display: block;
        padding: 2px 20px 0;
    }
    .pages-item-next {
        position: relative;
    }
    .pages-item-previous {
        position: relative;
    }
    .account .table-wrapper.orders-history {
        margin-top: 10px;
    }
    .catalog-product-view .wds-category-trust-bar {
        margin-top: 50px;
    }
    .toolbar-products .pages .item {
        vertical-align: center;
    }
    .columns .toolbar.toolbar-products .pages .items.pages-items .item {
        vertical-align: middle;
    }
    .wholesale-register-index #form-validate {
      padding: 24px 18px;
      margin: 20px auto;
    }
    .wholesale-register-index #form-validate h4 {
        font-size: 20px;
    }
    .wholesale-register-index #form-validate .btn-info {
        width: 100%;
        min-width: 100%;
    }
    .wholesale-register-index #form-validate input,
    .wholesale-register-index #form-validate select {
        height: 50px;
    }
    .home-special-slider .slick-arrow{
        margin-top: -10px;
    }
}
@media only screen and (max-width: 479px) {
    .wholesale-register-index #form-validate {
      padding: 0px;
    }
    .wholesale-register-index #form-validate h4 {
        font-size: 18px;
    }
    .wholesale-register-index #form-validate label {
        font-size: 13px;
    }
    .wholesale-register-index #form-validate .row{
        grid-template-columns: 1fr;
    }
    .wds-designs-for-days .wds-dfd__title{
        font-size: 30px;
        line-height: 40px;
        padding: 20px 0; 
    }
    .wds-hero__text .wds-hero__headline--black,
    .wds-hero__text .wds-hero__headline--red{
        font-size: 40px;
        line-height: 55px;
    } 
    .wds-category-trust-bar .wds-category-trust-bar__inner {
        padding: 8px 12px;
    }
    .wds-category-trust-bar .wds-category-trust-bar__item {
        width: 100%;
        gap: 12px;
        padding: 8px 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
        justify-content: flex-start;
    }
    .wds-category-trust-bar .wds-category-trust-bar__item:last-child {
        border-bottom: none;
    }
    .wds-category-trust-bar .wds-category-trust-bar__icon {
        width: 36px;
        height: 36px;
        flex-shrink: 0;
    }
    .wds-category-trust-bar .wds-category-trust-bar__text strong,
    .wds-category-trust-bar .wds-category-trust-bar__text span {
        font-size: 14px;
    }
    .category-view .category-selector-wrapper h3 {
        font-size: 17px;
        line-height: 25px;
        margin-bottom: 16px;
    }
    .category-view .category-selector-dropdowns {
        padding: 0 10px;
        gap: 8px;
    }
    .category-view .category-selector-dropdowns select {
        font-size: 14px;
        padding: 9px 12px;
    }
    .category-view .category-selector-dropdowns .wds-skin-finder-category::after {
        width: 34px;
        font-size: 14px;
        height: 38px;
        line-height: 14px;
    }
    .category-view .category-selector-wrapper .category-selector-btn-wrap {
        padding: 0 10px;
        margin-top: 10px;
    }
    .category-view .category-selector-wrapper .category-selector-btn-wrap .action.primary {
        width: 100%;
        font-size: 14px;
    }
    /* Product page */
    .catalog-product-view .page-wrapper .column.main {
        padding: 0 10px;
    }
    .product-info-main .page-title-wrapper.product .page-title .base {
        font-size: 20px;
        line-height: 26px;
    }
    .catalog-product-view .columns .product-info-main .product-info-price .price-wrapper .price {
        font-size: 22px;
        line-height: 28px;
    }
    .catalog-product-view .product-info-main .box-tocart .field.qty {
        width: 80px;
    }
    .catalog-product-view .product-info-main .box-tocart .actions .action.tocart {
        width: 100%;
        margin: 12px 0 0 0;
        box-sizing: border-box;
    }
    .wds-category-trust-bar .wds-category-trust-bar__inner {
        padding: 8px 10px;
    }
    .wds-category-trust-bar .wds-category-trust-bar__item {
        width: 100%;
        padding: 8px 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    }
    .wds-category-trust-bar .wds-category-trust-bar__item:last-child {
        border-bottom: none;
    }
    .wds-category-trust-bar .wds-category-trust-bar__icon {
        width: 36px;
        height: 36px;
        flex-shrink: 0;
    }
    .wds-instructions-section-mn .wds-instructions-section {
        padding: 16px 10px;
    }
    .wds-instructions-section .wds-instructions-section__heading {
        font-size: 22px;
        line-height: 30px;
    }
    .wds-instructions-section__content .col-md-12:first-child .row .col-md-8 {
        width: 100%;
        float: none;
        margin-bottom: 12px;
    }
    .wds-instructions-section__content .col-md-12:last-child ol li {
        font-size: 14px;
        line-height: 20px;
        padding: 0 0 12px 14px;
    }
    .columns .wds-reviews-section {
        padding: 24px 10px 0;
    }
    .columns .wds-reviews-section .wds-reviews-section__heading {
        font-size: 22px;
        line-height: 30px;
    }
    .catalog-product-view .wds-reviews-section .wds-reviews-section__subheading {
        font-size: 18px;
        line-height: 26px;
        padding: 12px 0 20px;
    }
    .review-add.wds-review-form .review-form .fieldset.review-fieldset h3 {
        font-size: 22px;
        line-height: 30px;
    }
    .wds-review-form__rating-section .wds-review-form__rating-label {
        font-size: 18px;
        line-height: 26px;
    }
    .block.review-add.wds-review-form .wds-review-form__actions .action.primary {
        width: 100%;
        box-sizing: border-box;
    }
    .catalog-product-view .wds-reviews-section .block.review-add {
        padding: 28px 0 20px;
    }
    #product-review-table .wds-review-form__radio-cell,
    #product-review-table .wds-review-form__label-cell{
        flex: 0 0 65px;
    }
    .product-info-price{
        width: 100% !important;
        margin: 0px !important;
    }
    .product-info-price > :first-child{
        padding-left: 0px;
    }
    .product-info-main .box-tocart .fieldset{
        flex-direction: unset;
    }
    .page-footer .footer .ls-footer .ls-footer-main .ls-footer-col .ls-footer-heading{
        font-size: 18px;
    }
    .page-main .page-title-wrapper .page-title{
        font-size: 30px;
    }
    .home-special-slider .slick-arrow{
        width: 40px;
        height: 45px;
    }
    .page-wrapper .products.products-grid .product-items{
        grid-template-columns: repeat(2, 1fr);
        padding: 0;
    }
    .catalog-product-view .wds-category-trust-bar{
        width: 100%;
    }
    .catalog-product-view .columns .wds-reviews-section__cta h3{
        font-size: 22px;
        line-height: 32px;
    }
    .catalog-product-view .product-info-main .box-tocart .fieldset{
        align-items: flex-end;
    }
    .instructions .container{
        grid-template-columns: 1fr;
    }
    .au-right .std .team.row .team-block,
    body.wholesale-index-index .wholesale-info.row .info.col-md-6{
        width: 50%;
    }
    .au-right .std h2{
        font-size: 26px;
        line-height: 36px;
    }
    .cms-page-view .columns h4,
    .wds-complete-coverage .wds-cc__content .wds-cc__title{
        font-size: 22px;
        line-height: 32px;
    }
    .page-wrapper .wholesale-login .login .login-form .content{
        padding: 20px;
    }
    .page-wrapper .wholesale-info h4{
        font-size: 30px;
        line-height: 48px;
    }
    .filter-title strong{
        width: auto;
        right: 10px;
        left: 10px;
    } 
}