/* ================================================================
   FMP REDESIGN — Design System CSS

   TABLE OF CONTENTS
   ─────────────────────────────────────────────────────────────
   1.  DESIGN TOKENS  (:root CSS variables)
   2.  GLOBAL UTILITIES  (scroll-to-top, floating help, animations)
   3.  NAVIGATION  (promo bar, top nav, bottom nav, mobile nav, footer)
   4.  HOMEPAGE  (layout, section titles, product cards, category cards,
                  brand cards, bottom banner)
   5.  FILTER & SEARCH  (sidebar, chips, modal/drawer, sort)
   6.  PRODUCT DETAIL PAGE  (gallery, options, description, related)
   7.  CART  (page layout, line items, email modals, suggested carousel)
   8.  CHECKOUT  (sections, address tiles, payment inputs, summary)
   9.  DAILY DEALS / PROMOTIONS  (carousel, banner, dots)
   10. MY ORDERS  (order cards, expanded panel, totals)
   11. MY RIGS  (form, rig boxes, category cards, delete modal)
   12. PARTS FINDER  (page layout, equipment, manual tabs/cards, video)
   13. MY LIST  (list index layout, product cards)
   14. MY ACCOUNT / SETTINGS  (sidebar, payment, address management)
   15. AUTH  (login, register, forgot password, reset password)
   16. CONTACT US  (form, sidebar, success page)
   17. POLICIES  (tabs, heading, body, modified date)
   18. MODALS  (FMP modal standards, rig select, address, cookie)
   19. PAGINATION
   20. RESPONSIVE BREAKPOINTS  (tablet ≤ 991px, mobile ≤ 767px)
   ================================================================ */


/* ================================================================
   1. DESIGN TOKENS
   ================================================================ */

:root {
    /* ---- Brand Colors ---- */
    --fmp-gradient:       linear-gradient(90deg, #0068E2 0%, #0341C7 100%);
    --fmp-blue-light:     #0068E2;
    --fmp-blue:           #0341C7;
    --fmp-blue-dark:      #0A3C9E;
    --fmp-blue-darker:      #0C265F;
    --fmp-blue-border:    #3879C8;
    --fmp-orange:         #F67E07;
    --fmp-orange-dark:    #e06e00;
    --fmp-teal:           #3DCEC7;
    --fmp-teal-light:     #1CDCD2;

    /* ---- Text Colors ---- */
    --fmp-text-dark:      #282A36;
    --fmp-text-black:     #3F4254;
    --fmp-text-gray:      #727583;
    --fmp-text-light:     #BABAC7;
    --fmp-white:          #FEFEFE;

    /* ---- Backgrounds ---- */
    --fmp-bg:             #F3F6F9;
    --fmp-bg-card:        #F9F9FA;
    --fmp-bg-blue-soft:   #F2F7FB;
    --fmp-bg-teal-soft:   #EFFDFC;
    --fmp-bg-orange-soft: #fff8f0;

    /* ---- Borders ---- */
    --fmp-border:         #EBEDF3;
    --fmp-border-blue:    #3879C8;

    /* ---- Status ---- */
    --fmp-error:          #F42C00;
    --fmp-error-dark:     #d92600;

    /* ---- Typography ---- */
    --fmp-font:           'Poppins', sans-serif;

    /* ---- Shape / Radius ---- */
    --fmp-radius-card:    28px;   /* product cards, filter sidebar, info cards */
    --fmp-radius-lg-card: 48px;   /* category cards */
    --fmp-radius-btn:     68px;   /* all pill buttons */
    --fmp-radius-modal:   20px;   /* modals (legacy: was md-card) */
    --fmp-radius-input:   68px;   /* form inputs */

    /* ---- Spacing ---- */
    --fmp-gap-sm:         8px;
    --fmp-gap-md:         16px;
    --fmp-gap-lg:         24px;
    --fmp-gap-xl:         32px;

    /* ---- Layout ---- */
    --fmp-max-width:      1394px;
    --fmp-side-pad:       max(40px, calc((100% - var(--fmp-max-width)) / 2));
    --fmp-side-pad-sm:    max(20px, calc((100% - var(--fmp-max-width)) / 2));
}

/* ---- Global Base — inherited properties set once, cascade down ----
   CSS only inherits: font-*, color, line-height, text-*, cursor, visibility.
   Layout properties (display, padding, border-radius, flex) are NOT inherited
   and must remain on individual rules. The 22 !important font-family overrides
   in component rules stay to fight Bootstrap's own font-family declarations.
   ---- */

/* Font family: 224 individual declarations reduced to one rule */
[class*="fmp-"],
[class*="home-brand"],
[class*="home-category"],
[class*="home-bottom"],
[class*="home-brands"],
[class*="fmp-order"],
[class*="fmp-checkout"],
[class*="fmp-rig"],
[class*="fmp-contact"],
[class*="fmp-policy"],
[class*="fmp-promo"],
[class*="fmp-cart"],
[class*="fmp-list"],
.discounted-product,
.discounted-product *,
#top-bottom-navbar,
#top-nav,
#bottom-nav,
.footer {
    font-family: var(--fmp-font);
}

/* Text-decoration: all FMP links decoration-free by default */
[class*="fmp-"] a,
a[class*="fmp-"],
.home-brand-card a,
.home-category-link,
.fmp-nav-link,
.fmp-nav-dropdown-link {
    text-decoration: none;
}

/* Cursor: all interactive FMP elements */
[class*="fmp-btn"],
[class*="fmp-link"],
[class*="fmp-tab"],
[class*="fmp-option"],
[class*="fmp-page-link"],
.fmp-nav-dropdown,
.fmp-filter-chip,
.fmp-sort-option,
.fmp-sort-desktop-option,
.fmp-active-pill {
    cursor: pointer;
}


/* ================================================================
   2. GLOBAL UTILITIES
   ================================================================ */

/* Scroll-to-top button */
#scroll-top-btn {
    display: none;
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 999;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--fmp-gradient);
    color: var(--fmp-white);
    border: none;
    font-size: 24px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
}

/* Floating help button */
.fmp-help-btn {
    position: fixed;
    bottom: 80px;
    right: 24px;
    z-index: 998;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--fmp-gradient);
    color: var(--fmp-white);
    border: none;
    font-size: 28px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(3, 65, 199, 0.24);
    text-decoration: none !important;
}

.fmp-help-btn:hover {
    color: var(--fmp-white) !important;
    opacity: 0.9;
}

/* Mobile nav gradient overlay */
#top-mobile-nav {
    background: var(--fmp-gradient) !important;
}


/* ================================================================
   3. NAVIGATION
   ================================================================ */

/* ---- Promo Bar ---- */
#top-bottom-navbar .promo-nav {
    background: var(--fmp-gradient) !important;
    height: auto;
    padding: 12px var(--fmp-side-pad);
    justify-content: center;
}

#top-bottom-navbar .promo-nav p {
    color: var(--fmp-border) !important;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
}

#top-bottom-navbar .promo-nav p .cursor-pointer {
    color: var(--fmp-white) !important;
    font-weight: 500;
}

#top-bottom-navbar .promo-nav a {
    color: var(--fmp-white) !important;
    text-decoration: underline;
    font-size: 16px;
    font-weight: 400;
    margin-left: 6px;
}

#top-bottom-navbar .promo-nav .ri-arrow-drop-right-line {
    color: var(--fmp-white) !important;
    font-size: 20px;
    vertical-align: middle;
}

/* ---- Top Nav ---- */
#top-nav {
    background: var(--fmp-gradient) !important;
    justify-content: space-between;
    gap: 23px;
}

#top-bottom-navbar input.search:not(.fmp-desktop-header-search__input):not(.fmp-mobile-header-search__input) {
    background: var(--fmp-white) url(../media/icons/search.png) no-repeat 13px center;
    border-radius: var(--fmp-radius-modal);
    height: 50px;
    padding-left: 40px;
    font-size: 16px;
    color: var(--fmp-text-dark);
}

#top-bottom-navbar .search::placeholder {
    color: var(--fmp-text-light);
    opacity: 1;
}

#top-nav form.search-layout.fmp-desktop-header-search {
    flex: 1;
    max-width: 800px;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 50px;
    padding: 4px 17px;
    margin: 0;
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-btn);
    box-sizing: border-box;
    border: none;
}

#top-nav .fmp-desktop-header-search__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--fmp-text-light);
    font-size: 16px;
    line-height: 1;
}

#top-nav .fmp-desktop-header-search__input.search {
    flex: 1 1 auto;
    min-width: 0;
    height: auto !important;
    min-height: 0;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    padding: 0 !important;
    margin: 0;
    box-shadow: none !important;
    font-size: 16px;
    color: var(--fmp-text-dark);
}

#top-nav form.search-layout {
    flex: 1;
    max-width: 800px;
}

#top-nav .fmp-delivery-line {
    color: var(--fmp-white);
}

#top-nav .fmp-delivery-prefix {
    font-weight: 400;
}

#top-nav .fmp-delivery-place {
    font-weight: 600;
}

#top-nav .navbar-delivery-layout .ri-map-pin-line.navbar-icon {
    font-size: 20px;
}

#top-nav .navbar-rigs-layout a,
#top-nav .navbar-rigs-layout .fmp-nav-dropdown-link {
    color: var(--fmp-border);
}

#top-nav .navbar-icon {
    font-size: 28px;
    color: var(--fmp-white);
}

#top-nav .navbar-brand img.logo {
    height: 67px;
    width: auto;
}

#top-nav .navbar-delivery-layout a,
#top-nav .navbar-rigs-layout a,
#top-nav .navbar-orders-layout a,
#top-nav .navbar-signin-layout a {
    color: var(--fmp-white);
    font-size: 16px;
}

#top-nav .navbar-dropdown-layout a:after {
    background-image: none;
}

.ri-map-pin-line.navbar-icon,
.ri-inbox-archive-line.navbar-icon,
.ri-user-line.navbar-icon,
.ri-shopping-cart-line.navbar-icon,
.ri-shopping-cart-fill.navbar-icon {
    color: var(--fmp-white) !important;
}

/* ---- Bottom Nav ---- */
#bottom-nav {
    background: var(--fmp-gradient) !important;
    /*padding: 16px var(--fmp-side-pad);*/
    justify-content: flex-end;
    gap: 0;
}

#bottom-nav a {
    color: var(--fmp-white) !important;
}

#bottom-nav .navbar-left-layout  { display: none !important; }
#bottom-nav .navbar-right-layout { display: none !important; }

#bottom-nav .navbar-desktop-layout {
    display: flex !important;
    align-items: center;
}

#bottom-nav .navbar-dropdown-layout a:after,
#bottom-nav .fmp-nav-dropdown a:after {
    display: none !important;
    background-image: none !important;
}

#bottom-nav .navbar-dropdown-layout a,
#bottom-nav .fmp-nav-dropdown a {
    padding-right: 0 !important;
}

/* ---- Nav Helper Classes ---- */
.fmp-nav-dropdown {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
}

.fmp-nav-dropdown-link {
    color: var(--fmp-white) !important;
    font-size: 12px;
    font-weight: 400;
    text-decoration: none !important;
    white-space: nowrap;
    margin-left: 0 !important;
    padding-right: 0 !important;
}

.fmp-nav-dropdown-link:after { display: none !important; }

.fmp-nav-arrow {
    font-size: 16px;
    color: var(--fmp-white) !important;
    line-height: 1;
}

.fmp-nav-icon-white {
    color: var(--fmp-white) !important;
    font-size: 20px;
}

.fmp-rig-icon { flex-shrink: 0; }

/* Pill button (nav CTA) */
.fmp-pill-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--fmp-orange);
    color: var(--fmp-white) !important;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    padding: 6px 12px;
    border-radius: var(--fmp-radius-btn);
    text-decoration: none !important;
    white-space: nowrap;
    cursor: pointer;
    max-height: 32px;
}

.fmp-pill-btn i {
    font-size: 20px;
    color: var(--fmp-white) !important;
}

/* Nav link */
.fmp-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--fmp-white) !important;
    font-size: 16px;
    font-weight: 400;
    text-decoration: none !important;
    white-space: nowrap;
}

.fmp-nav-link i { font-size: 24px; color: var(--fmp-white) !important; }
.fmp-nav-link .fmp-arrow-up { font-size: 18px; vertical-align: top; margin-top: 2px; }

/* ---- Footer ---- */
.footer {
    background: var(--fmp-gradient) !important;
    padding: 24px var(--fmp-side-pad-sm) !important;
}

.footer .text-dark,
.footer .text-muted,
.footer a {
    color: var(--fmp-white) !important;
}

.footer span.text-muted {
    color: var(--fmp-white) !important;
    font-weight: 400 !important;
}


/* ================================================================
   4. HOMEPAGE
   ================================================================ */

/* ---- Section Titles ---- */
.promotion-discount-type-title {
    font-family: var(--fmp-font) !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    color: var(--fmp-text-dark) !important;
    line-height: 1.5 !important;
}

/* ---- Product Cards (discounted-product) ---- */
.discounted-product {
    background: var(--fmp-white);
    border: 1px solid var(--fmp-border);
    border-radius: var(--fmp-radius-card);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.discounted-product .top-container {
    background: var(--fmp-white) !important;
    max-height: 200px;
    padding: 0;
    border-radius: 0;
    position: relative;
    flex-grow: 1;
    display: flex;
    justify-content: center;
    padding-top: 16px;
}

.discounted-product .top-container .discount-perc {
    background: var(--fmp-error);
    padding: 2px 8px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    position: absolute;
    top: 12px;
    left: 0;
    font-size: 12px;
    font-weight: 600;
    color: #fff;
    line-height: 1.5;
}

.discounted-product .top-container .label-info {
    background: var(--fmp-teal) !important;
    padding: 2px 8px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    position: absolute;
    top: 12px;
    left: 0;
    font-size: 12px;
    font-weight: 400;
    color: #fff;
    line-height: 1.5;
}

.discounted-product .top-container .discount-perc span,
.discounted-product .top-container .label-info span {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
}

.discounted-product .img-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 162px;
    overflow: hidden;
}

.discounted-product .top-container img {
    max-height: 162px;
    object-fit: contain;
}

.discounted-product .bottom-container {
    background: var(--fmp-card-footer) !important;
    border-top: 1px solid var(--fmp-border);
    padding: 12px 16px 16px !important;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.price-container {
    padding: 0 !important;
}

.discounted-product .bottom-container .price-container {
    padding: 0 8px;
}

.discounted-product .bottom-container .price-container .price {
    font-family: var(--fmp-font) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--fmp-text-dark) !important;
    line-height: 1.5;
    margin-bottom: 0;
}

.discounted-product .bottom-container .price-container .sign_in_price {
    font-family: var(--fmp-font) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--fmp-text-dark) !important;
    line-height: 1.5;
}

.discounted-product .bottom-container .price-container .price-prev {
    font-size: 14px;
    color: var(--fmp-text-light);
    text-decoration: line-through;
    margin-left: 4px;
    margin-bottom: 0;
}

.discounted-product .bottom-container .product-name-layout .name,
.discounted-product .bottom-container a.product-name-layout .name {
    font-family: var(--fmp-font) !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    color: var(--fmp-text-gray) !important;
    line-height: 1.6;
}

.discounted-product .bottom-container .btn-primary,
.discounted-product .bottom-container button.btn-primary,
.discounted-product .bottom-container a.btn-primary {
    background: var(--fmp-orange) !important;
    border-color: var(--fmp-orange) !important;
    border-radius: var(--fmp-radius-btn) !important;
    font-family: var(--fmp-font) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--fmp-white) !important;
    height: 38px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.discounted-product .bottom-container .btn-primary:hover {
    background: var(--fmp-orange-dark) !important;
    border-color: var(--fmp-orange-dark) !important;
}

/* ---- Category Cards ---- */
.home-category-link {
    display: block;
    text-decoration: none !important;
}

.home-category-card {
    background: var(--fmp-white) !important;
    border: 2px solid transparent !important;
    border-radius: 48px !important;
    height: 218px !important;
    position: relative !important;
    overflow: hidden !important;
    display: block !important;
    transition: border-color 0.2s ease;
    cursor: pointer;
}

.home-category-card:hover {
    border-color: var(--fmp-orange) !important;
}

.home-category-card--active {
    border-color: var(--fmp-orange) !important;
}

/* Text block — absolutely positioned at left */
.home-category-card-text {
    position: absolute;
    left: 30px;
    top: 40px;
    width: 164px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.home-category-card-title {
    font-family: var(--fmp-font) !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    color: var(--fmp-text-dark) !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

.home-category-card-rig-label {
    font-family: var(--fmp-font) !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    color: var(--fmp-text-light) !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}

.home-category-card-rig-name {
    font-family: var(--fmp-font) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: var(--fmp-text-gray) !important;
    margin: 0 !important;
    line-height: 1.6 !important;
}

.home-category-card-img-wrap {
    position: absolute;
    left: 213px;
    top: 14px;
    width: 190px;
    height: 190px;
    border-radius: var(--fmp-radius-card);
    overflow: hidden;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-category-card-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* LightSlider: allow JS to handle horizontal swipe on touch devices.
   .lSSlideWrapper is a parent of the slider (created dynamically by lightSlider). */
.home-cat-desktop .lSSlideWrapper,
.d-block.d-lg-none > .lSSlideOuter > .lSSlideWrapper {
    touch-action: pan-y;
    -ms-touch-action: pan-y;
}

/* LightSlider: gap between the two stacked category cards in each slide */
#categorySlider li {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

#categorySlider .home-category-link {
    display: block !important;
}

/* ---- Brand Cards — base (mobile/tablet) ---- */
.home-brand-card {
    background: var(--fmp-white) !important;
    border-radius: 8px !important;
    padding: 8px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 90px;
    flex-shrink: 0;
}

.home-brand-card .img-container {
    width: 72px !important;
    height: 72px !important;
    border-radius: var(--fmp-radius-modal) !important;
    background: #fff !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0;
}

.home-brand-card .img-container img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.home-brand-card a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding-left: 4px;
    color: var(--fmp-orange) !important;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none !important;
    line-height: 1.5;
    margin-top: 4px;
    height: 32px;
}

.home-brand-card a h2 {
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-orange) !important;
    margin: 0;
    white-space: nowrap;
}

.home-brand-card a .right-icon {
    color: var(--fmp-orange) !important;
    font-size: 20px;
    flex-shrink: 0;
}

/* ---- Brand outer container + wrapper + scroller (base / mobile+tablet) ---- */
.home-brands-outer {
    position: relative;
}

.home-brands-wrapper {
    background: var(--fmp-white);
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}

.home-brands-scroller {
    display: flex;
    align-items: center;
    gap: 20px;
    overflow-x: auto;
    padding: 8px 12px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    touch-action: pan-x;
    -ms-touch-action: pan-x;
}

.home-brands-scroller::-webkit-scrollbar {
    display: none;
}

/* Navigation arrow buttons (hidden on mobile/tablet) */
.home-brands-btn {
    display: none;
}

/* ---- Bottom Banner (Foam Man Difference) ---- */
.home-bottom-banner {
    padding: 0;
}

.home-bottom-banner .fmp-banner-row {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 64px;
}

.home-bottom-banner .fmp-banner-row:last-child {
    margin-bottom: 0;
}

.home-bottom-banner .fmp-banner-img-card {
    background: var(--fmp-white);
    border: 1px solid var(--fmp-orange);
    border-radius: var(--fmp-radius-card);
    overflow: hidden;
    flex-shrink: 0;
    width: 400px;
    max-height: 270px;
    min-height: 245px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 24px;
}

.home-bottom-banner .fmp-banner-img-card img {
    max-height: 260px;
    width: 100%;
    object-fit: contain;
}

.home-bottom-banner .fmp-banner-content {
    flex: 1;
    padding: 24px 40px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.home-bottom-banner .fmp-banner-text {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.fmp-banner-text p {
    max-width: 750px;
}

.home-bottom-banner .fmp-banner-content h4 {
    font-family: var(--fmp-font) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--fmp-text-dark) !important;
    line-height: 1.5;
    margin-bottom: 0;
}

.home-bottom-banner .fmp-banner-content p {
    font-family: var(--fmp-font) !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    color: var(--fmp-text-gray) !important;
    line-height: 1.6;
    margin-bottom: 0;
}

.fmp-btn-outline-orange {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1.5px solid var(--fmp-orange) !important;
    color: var(--fmp-orange) !important;
    background: transparent !important;
    border-radius: var(--fmp-radius-btn) !important;
    font-size: 14px;
    font-weight: 500;
    padding: 10px 24px 10px 24px;
    text-decoration: none !important;
    line-height: 1.5;
    height: 44px;
}

.fmp-btn-outline-orange:hover {
    background: rgba(246, 126, 7, 0.06) !important;
    color: var(--fmp-orange) !important;
}

.fmp-btn-outline-orange i {
    font-size: 20px;
    color: var(--fmp-orange) !important;
}

.fmp-banner-content .fmp-btn-outline-orange {
    width: fit-content !important;
}

/* Desktop brand pill wrapper — see @media (min-width: 1200px) block below */

/* Mobile nav gradient */
#top-mobile-nav {
    background: var(--fmp-gradient) !important;
}

/* ==========================================================
   MY LIST — Redesign (6082-180952, 6082-180923, 6082-180415,
   6082-181031, 6082-181046, 6082-181056, 6082-181070)
   ========================================================== */

.fmp-my-list-card,
.fmp-my-list-detail-card {
    background: var(--fmp-white);
    border: 0;
    border-radius: var(--fmp-radius-card);
    box-shadow: none;
}

.fmp-my-list-card .card-body,
.fmp-my-list-detail-card .card-body {
    padding: 32px 48px 48px;
}

.fmp-my-list-title,
.fmp-my-list-detail-title {
    color: var(--fmp-text-dark);
    font-size: 24px;
    font-weight: 600;
    line-height: 1.5;
    margin-bottom: 8px;
}

.fmp-my-list-subtitle {
    color: var(--fmp-text-gray);
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 32px !important;
}

/* ── Index page layout ── */
.fmp-my-list-index-content {
    padding-top: 48px;
    padding-bottom: 48px;
    padding-left: 16px;
    padding-right: 16px;
    align-items: flex-start;
}

.fmp-my-list-card-outer {
    width: 100%;
    max-width: 752px;
}

/* ── List grid ── */
.fmp-my-list-grid {
    gap: 16px;
    margin-bottom: 20px;
}

.fmp-my-list-grid-item {
    width: calc(50% - 8px);
}

/* ── Summary card (each list item) ── */
.fmp-my-list-summary-card {
    border: 1px solid rgba(56, 121, 200, 0.3) !important;
    border-radius: 16px !important;
    box-shadow: none;
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s;
    height: 100%;
}

.fmp-my-list-summary-card:hover {
    border-color: rgba(56, 121, 200, 0.6) !important;
    box-shadow: 0 2px 12px rgba(56, 121, 200, 0.12);
    text-decoration: none;
}

.fmp-my-list-summary-card .card-title {
    color: var(--fmp-blue) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.5;
    margin-bottom: 8px;
}

.fmp-my-list-summary-card .card-text {
    color: var(--fmp-text-gray);
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 0;
}

.fmp-my-list-create-wrap {
    display: flex;
    justify-content: center;
    margin-top: 4px;
}

.fmp-my-list-create-btn {
    width: 320px;
    max-width: 100%;
    height: 44px;
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    border: 0 !important;
    border-radius: var(--fmp-radius-btn) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    text-transform: none;
    text-decoration: none;
}

.fmp-my-list-create-btn i {
    font-size: 20px;
    line-height: 1;
}

.fmp-my-list-actions-row {
    margin-bottom: 20px !important;
    padding: 0;
}

.fmp-my-list-action-link {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    text-decoration: none !important;
    color: var(--fmp-orange) !important;
}

.fmp-my-list-action-link i {
    font-size: 20px;
    color: var(--fmp-orange) !important;
}

.fmp-my-list-action-link--danger,
.fmp-my-list-action-link--danger i {
    color: var(--fmp-error) !important;
}

.fmp-my-list-action-link:hover {
    color: var(--fmp-orange-dark) !important;
    opacity: 0.85;
}

.fmp-my-list-action-link--danger:hover,
.fmp-my-list-action-link--danger:hover i {
    color: var(--fmp-error-dark) !important;
    opacity: 0.85;
}

.fmp-my-list-item-count {
    color: var(--fmp-text-gray);
    font-size: 14px;
    line-height: 1.6;
    border-bottom: 1px solid var(--fmp-border);
    padding-bottom: 14px;
    margin-bottom: 0 !important;
}

.fmp-my-list-product-image-wrap {
    padding-top: 12px !important;
    flex-shrink: 0 !important;
    width: 88px !important;
    min-width: 88px !important;
}

.fmp-my-list-product-image {
    width: 88px !important;
    height: 88px !important;
    object-fit: contain;
    border-radius: 4px;
    border: 1px solid white;
    display: block;
    max-width: 88px !important;
}

.fmp-my-list-product-card-body {
    padding: 12px 0 12px 12px !important;
}

.fmp-my-list-product-heading-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 4px;
    width: 100%;
}

.fmp-my-list-product-name-link {
    flex: 1;
    min-width: 0;
    text-decoration: none !important;
}

.fmp-my-list-product-date {
    color: var(--fmp-text-gray);
    font-size: 12px;
    line-height: 1.5;
    white-space: nowrap;
    flex-shrink: 0;
    margin-top: 3px;
}

.fmp-my-list-product-card .card-title {
    color: var(--fmp-orange) !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.6;
    margin-bottom: 0 !important;
}

.fmp-my-list-product-desc {
    color: var(--fmp-text-gray) !important;
    font-size: 12px !important;
    line-height: 1.5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 4px !important;
}

.fmp-my-list-product-option {
    color: var(--fmp-text-gray);
    font-size: 12px;
    line-height: 1.5;
    margin-bottom: 2px;
    display: block;
}

.fmp-my-list-product-price {
    color: var(--fmp-text-dark) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.5;
    margin-bottom: 0;
}

.fmp-my-list-product-list-item {
    border-bottom: 1px solid var(--fmp-border);
    padding: 12px 0;
}

.fmp-my-list-product-list-item:last-child {
    border-bottom: none;
}

.fmp-my-list-state-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 0;
}

.fmp-my-list-status-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #EFFDFC;
    color: #1CDCD2;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;
    height: 32px;
    padding: 0 12px;
    border-radius: 1000px;
    white-space: nowrap;
}

.fmp-my-list-status-tag i {
    font-size: 16px;
    color: #1CDCD2;
}

.fmp-my-list-undo-btn {
    color: var(--fmp-orange) !important;
    background: transparent !important;
    border: 0 !important;
    font-size: 14px !important;
    font-weight: 500;
    padding: 0 4px !important;
    height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: underline;
    cursor: pointer;
}

.fmp-my-list-product-actions {
    align-items: center;
    margin-top: 8px !important;
}

.fmp-my-list-add-cart-btn,
.fmp-my-list-move-btn,
.fmp-my-list-remove-btn {
    height: 32px !important;
    border-radius: var(--fmp-radius-btn) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.5;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px;
    padding: 0 12px !important;
}

.fmp-my-list-add-cart-btn {
    border: 0 !important;
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
}

.fmp-my-list-add-cart-btn:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

.fmp-my-list-move-btn,
.my-list-button .btn {
    color: var(--fmp-orange) !important;
    border-color: var(--fmp-orange) !important;
    background: transparent !important;
}

.fmp-my-list-move-btn:hover,
.my-list-button .btn:hover {
    background: rgba(246, 126, 7, 0.06) !important;
    color: var(--fmp-orange) !important;
}

.my-list-button .btn.dropdown-toggle::after {
    display: none;
}

.fmp-my-list-remove-btn {
    border-color: var(--fmp-error) !important;
    color: var(--fmp-error) !important;
    background: transparent !important;
    width: 48px !important;
    padding: 0 !important;
}

.fmp-my-list-remove-btn:hover {
    background: var(--fmp-error) !important;
    color: var(--fmp-white) !important;
}

.fmp-my-list-modal .modal-dialog {
    max-width: 855px;
}

#add_list_modal .modal-dialog,
#edit_list_modal .modal-dialog {
    max-width: 600px;
}

.fmp-my-list-modal .modal-content {
    border: 0;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(40, 42, 54, 0.12);
}

.fmp-my-list-modal .modal-header {
    padding: 16px 24px;
    border-bottom: 1px solid var(--fmp-border);
}

@media (min-width: 768px) {
    .fmp-my-list-modal .modal-header {
        padding: 24px 48px;
    }
}

.fmp-my-list-modal .modal-title {
    color: var(--fmp-text-dark);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    flex: 1;
}

@media (min-width: 768px) {
    .fmp-my-list-modal .modal-title {
        font-size: 24px;
    }
}

.fmp-my-list-modal .modal-header .btn-close,
.fmp-my-list-modal .modal-header .close {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--fmp-text-dark);
    font-size: 1.75rem;
    line-height: 1;
    opacity: 1;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.fmp-my-list-modal .modal-body {
    padding: 24px;
}

@media (min-width: 768px) {
    .fmp-my-list-modal .modal-body {
        padding: 32px 48px 48px;
    }
}

.fmp-my-list-input {
    height: 44px;
    border: 1.5px solid var(--fmp-border);
    border-radius: 24px;
    color: var(--fmp-text-dark);
    font-size: 14px;
    line-height: 1.6;
}

.fmp-my-list-input::placeholder {
    color: var(--fmp-text-light);
}

.fmp-my-list-modal .col-form-label {
    color: var(--fmp-text-gray);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    margin-bottom: 2px;
}

.fmp-my-list-modal-hint {
    color: var(--fmp-text-gray) !important;
    font-size: 12px;
    line-height: 1.5;
    display: block;
    padding-top: 8px !important;
}

.fmp-my-list-email-desc {
    color: var(--fmp-text-dark);
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 24px !important;
}

.fmp-my-list-modal-form-group {
    position: relative;
}

.fmp-my-list-optional-text {
    position: absolute;
    right: 12px;
    top: 54px;
    color: var(--fmp-text-light);
    font-size: 12px;
    line-height: 1.5;
}

.fmp-my-list-modal-actions {
    margin-top: 24px;
    display: flex;
    gap: 16px;
    align-items: stretch;
}

.fmp-my-list-modal-actions .fmp-custom-submit-btn,
.fmp-my-list-modal-actions .fmp-settings-cancel-btn {
    flex: 1;
    width: auto;
    min-width: 0;
    padding: 0 24px;
    box-sizing: border-box;
}

.fmp-my-list-modal-actions .fmp-custom-submit-btn {
    margin-top: 0;
}

.fmp-my-list-btn-secondary,
.fmp-my-list-btn-primary,
.fmp-my-list-btn-danger {
    height: 44px;
    border-radius: var(--fmp-radius-btn) !important;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    text-decoration: none;
}

.fmp-my-list-btn-secondary {
    color: var(--fmp-orange) !important;
    border: 1.5px solid var(--fmp-orange) !important;
    background: var(--fmp-white) !important;
}

.fmp-my-list-btn-secondary:hover {
    background: #fff8f0 !important;
    color: var(--fmp-orange) !important;
}

.fmp-my-list-btn-primary {
    background: var(--fmp-orange) !important;
    border: 1px solid var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
}

.fmp-my-list-btn-primary:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

.fmp-my-list-btn-danger {
    background: var(--fmp-error) !important;
    border: 1px solid var(--fmp-error) !important;
    color: var(--fmp-white) !important;
}

.fmp-my-list-btn-danger:hover {
    background: var(--fmp-error-dark) !important;
    color: var(--fmp-white) !important;
}

.fmp-my-list-success-body {
    gap: 8px;
}

.fmp-my-list-success-icon {
    font-size: 32px;
    color: var(--fmp-orange);
    line-height: 1;
}

.fmp-my-list-success-text {
    color: var(--fmp-text-gray);
    font-size: 18px;
    line-height: 1.5;
}

.fmp-my-list-cart-card {
    border-radius: 24px;
    box-shadow: 0 4px 30px rgba(31, 30, 46, 0.07);
}

.fmp-my-list-cart-title {
    color: var(--fmp-text-dark);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.5;
    padding: 24px 40px 0 !important;
}

.fmp-my-list-cart-items {
    padding: 0 40px 12px;
    max-height: 420px;
}

.fmp-my-list-cart-item {
    padding: 16px 8px 16px 0;
}

.fmp-my-list-cart-delete {
    color: var(--fmp-text-gray);
    font-size: 24px;
}

.fmp-my-list-cart-total {
    padding: 24px 40px 40px;
    border-top: 1px solid var(--fmp-border);
}

.fmp-my-list-cart-checkout,
.fmp-my-list-cart-continue {
    height: 44px;
    border-radius: var(--fmp-radius-btn) !important;
    font-size: 14px !important;
    font-weight: 500;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

.fmp-my-list-cart-checkout {
    background: var(--fmp-orange) !important;
    border-color: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
}

.fmp-my-list-cart-checkout:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

.fmp-my-list-cart-continue {
    color: var(--fmp-orange) !important;
    border-color: var(--fmp-orange) !important;
    background: transparent !important;
}

.fmp-my-list-cart-continue:hover {
    background: rgba(246, 126, 7, 0.06) !important;
    color: var(--fmp-orange) !important;
}

@media (max-width: 991.98px) {
    .fmp-my-list-grid-item {
        width: 100%;
    }

    .fmp-my-list-index-content {
        padding-top: 24px;
    }

    .fmp-my-list-card .card-body,
    .fmp-my-list-detail-card .card-body {
        padding: 24px 16px 24px;
    }

    .fmp-my-list-actions-row {
        flex-wrap: wrap;
        gap: 10px;
    }

    .fmp-my-list-modal .modal-body {
        padding: 24px 16px;
    }
}
.fmp-scrolltop {
    background: var(--fmp-orange) !important;
    border-radius: var(--fmp-radius-btn) !important;
    width: 44px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;

    @media (max-width: 991.98px) {
        display: none !important;
    }
}

.fmp-scrolltop i {
    color: var(--fmp-white) !important;
    font-size: 24px !important;
    line-height: 1 !important;
}

.fmp-scrolltop .svg-icon {
    display: none;
}

/* ==========================================================
   RESPONSIVE — DESKTOP hide tablet/mobile nav blocks
   ========================================================== */
@media only screen and (min-width: 1200px) {
    #bottom-nav .navbar-left-layout,
    #bottom-nav .navbar-right-layout {
        display: none !important;
    }
}

/* ==========================================================
   RESPONSIVE — TABLET (768px – 1199px)
   ========================================================== */
@media only screen and (min-width: 768px) and (max-width: 1199px) {

    /* ---- Layout container ---- */
    .fmp-content-wrapper {
        padding: 0 48px;
    }

    /* ---- Bottom-nav: show left + right layouts ---- */
    #bottom-nav {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 0 48px !important;
        height: 40px !important;
        background: var(--fmp-gradient) !important;
    }

    #bottom-nav .navbar-left-layout {
        display: flex !important;
        align-items: center !important;
        gap: 20px;
    }

    #bottom-nav .navbar-right-layout {
        display: flex !important;
        align-items: center !important;
        gap: 4px;
    }

    #bottom-nav .navbar-left-layout a,
    #bottom-nav .navbar-right-layout a {
        color: var(--fmp-white) !important;
        font-size: 12px;
        font-weight: 400;
        text-decoration: none;
        white-space: nowrap;
    }

    #bottom-nav .navbar-left-layout a:hover,
    #bottom-nav .navbar-right-layout a:hover {
        color: var(--fmp-orange) !important;
        text-decoration: none;
    }

    #bottom-nav .navbar-rigs-layout,
    #bottom-nav .navbar-delivery-layout {
        color: var(--fmp-white) !important;
    }

    #bottom-nav .navbar-rigs-layout i,
    #bottom-nav .navbar-delivery-layout i,
    #bottom-nav .navbar-orders-layout i,
    #bottom-nav .navbar-savings-layout i,
    #bottom-nav .navbar-my-list-layout i {
        color: var(--fmp-white) !important;
    }

    #bottom-nav .navbar-orders-layout,
    #bottom-nav .navbar-savings-layout,
    #bottom-nav .navbar-my-list-layout {
        display: flex !important;
        align-items: center !important;
    }

    /* hide old desktop layout on tablet */
    #bottom-nav .navbar-desktop-layout {
        display: none !important;
    }

    /* ---- Promo bar ---- */
    #top-bottom-navbar .promo-nav {
        padding: 8px 48px !important;
        height: auto !important;
        min-height: 40px;
    }

    /* ---- Section headings ---- */
    .promotion-discount-type-title {
        font-size: 18px !important;
    }

    /* ---- Product cards (tablet) ---- */
    .discounted-product {
        border-radius: var(--fmp-radius-card) !important;
    }

    .discounted-product .img-wrapper {
        height: 125px !important;
    }

    .discounted-product .top-container img {
        max-height: 110px !important;
    }

    .fmp-product-price {
        font-size: 16px !important;
    }

    .fmp-product-name {
        font-size: 16px !important;
    }

    /* ---- Category slider (tablet) ---- */
    #categorySliderMd .cat-md-link {
        text-decoration: none !important;
    }

    #categorySliderMd .cat-md-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        background: var(--fmp-white);
        border-radius: var(--fmp-radius-modal);
        padding: 16px;
        width: 131px;
        height: 179px;
    }

    #categorySliderMd .cat-md-img-wrap {
        width: 72px;
        height: 72px;
        border-radius: var(--fmp-radius-card);
        background: #fff;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }

    #categorySliderMd .cat-md-img-wrap img {
        max-width: 72px;
        max-height: 72px;
        object-fit: contain;
    }

    #categorySliderMd .cat-md-text-wrap {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 99px;
        min-height: 63px;
        text-align: center;
    }

    #categorySliderMd .cat-md-title {
        font-family: var(--fmp-font) !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        color: var(--fmp-text-dark) !important;
        text-align: center !important;
        line-height: 1.5 !important;
        margin: 0 !important;
    }

    #categorySliderMd .cat-md-rig-name {
        font-size: 10px;
        color: var(--fmp-text-gray);
        text-align: center;
        margin: 0 0 2px;
        line-height: 1.4;
    }

    #categorySliderMd .lslide {
        min-width: 131px;
    }

    /* ---- Brand cards (tablet) ---- */
    .home-brand-card {
        width: 90px;
    }

    .home-brand-card .img-container {
        width: 72px !important;
        height: 72px !important;
        border-radius: var(--fmp-radius-card) !important;
    }

    /* ---- Bottom banner (tablet: side-by-side, narrower) ---- */
    .fmp-banner-row {
        flex-direction: row !important;
        align-items: flex-start !important;
        gap: 20px !important;
    }

    .fmp-banner-img-card {
        width: 211px !important;
        min-width: 211px !important;
        max-width: 211px !important;
        height: 213px !important;
    }

    .fmp-banner-content {
        flex: 1 !important;
    }

    .fmp-banner-text h4 {
        font-size: 16px !important;
    }

    .fmp-banner-text p {
        font-size: 14px !important;
    }
}

/* ==========================================================
   RESPONSIVE — MOBILE (≤767px)
   ========================================================== */
@media only screen and (max-width: 767px) {

    /* ---- Bottom-nav: left layout only ---- */
    #bottom-nav {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 4px 16px !important;
        height: auto !important;
        min-height: 36px;
        background: var(--fmp-gradient) !important;
    }

    #bottom-nav .navbar-left-layout {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        gap: 0;
    }

    #bottom-nav .navbar-rigs-layout {
        display: flex !important;
        align-items: center !important;
    }

    #bottom-nav .navbar-delivery-layout {
        display: flex !important;
        align-items: center !important;
    }

    #bottom-nav .navbar-right-layout {
        display: none !important;
    }

    #bottom-nav .navbar-desktop-layout {
        display: none !important;
    }

    #bottom-nav .navbar-left-layout a,
    #bottom-nav .navbar-rigs-layout span,
    #bottom-nav .navbar-delivery-layout span {
        color: var(--fmp-white) !important;
        font-size: 12px;
        font-weight: 400;
        text-decoration: none;
        white-space: nowrap;
    }

    #bottom-nav .navbar-rigs-layout,
    #bottom-nav .navbar-delivery-layout {
        color: var(--fmp-white) !important;
    }

    #bottom-nav .navbar-rigs-layout i,
    #bottom-nav .navbar-delivery-layout i,
    #bottom-nav .navbar-orders-layout i,
    #bottom-nav .navbar-savings-layout i,
    #bottom-nav .navbar-my-list-layout i {
        color: var(--fmp-white) !important;
    }

    #top-mobile-nav .navbar-search-layout {
        display: flex !important;
        flex-basis: 100%;
        width: 100%;
        margin-bottom: 0 !important;
        padding-top: 4px;
        padding-bottom: 8px;
    }

    #top-mobile-nav {
        flex-wrap: wrap !important;
        align-items: center !important;
        height: auto !important;
        min-height: auto !important;
        padding: 4px 16px 0 !important;
    }

    #top-mobile-nav .fmp-mobile-header-search {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        min-height: 40px;
        padding: 4px 12px;
        background: var(--fmp-white);
        border-radius: 24px;
        border: none;
        box-sizing: border-box;
    }

    #top-mobile-nav .fmp-mobile-header-search__icon {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        color: var(--fmp-text-gray);
        font-size: 16px;
        line-height: 1;
    }

    #top-mobile-nav .fmp-mobile-header-search__input.search,
    #top-mobile-nav .fmp-mobile-header-search input.search {
        flex: 1 1 auto;
        min-width: 0;
        height: 36px !important;
        padding: 4px 4px 4px 0 !important;
        margin: 0 !important;
        background: transparent !important;
        background-image: none !important;
        border: none !important;
        border-radius: 0 !important;
        font-size: 14px !important;
        color: var(--fmp-text-dark) !important;
    }

    #top-mobile-nav .fmp-mobile-header-search__input.search::placeholder,
    #top-mobile-nav .fmp-mobile-header-search input.search::placeholder {
        color: var(--fmp-text-gray);
        opacity: 1;
    }

    /* ---- Promo bar ---- */
    #top-bottom-navbar .promo-nav {
        padding: 8px 16px !important;
        height: auto !important;
        min-height: 40px;
        justify-content: flex-start !important;
    }

    #top-bottom-navbar .promo-nav .promo-text {
        flex-direction: row !important;
        align-items: center !important;
        flex-wrap: wrap !important;
    }

    #top-bottom-navbar .promo-nav p {
        font-size: 14px !important;
    }

    /* ---- Section headings ---- */
    .promotion-discount-type-title {
        font-size: 16px !important;
    }

    /* ---- Product cards: 2-per-row, mobile sizes ---- */
    .discounted-product {
        border-radius: var(--fmp-radius-modal) !important;
    }

    .discounted-product .top-container {
        padding-top: 12px !important;
    }

    .discounted-product .img-wrapper {
        height: 109px !important;
    }

    .discounted-product .top-container img {
        max-height: 95px !important;
    }

    .fmp-product-price {
        font-size: 14px !important;
    }

    .fmp-product-name {
        font-size: 14px !important;
    }

    #categorySliderMd .cat-md-title {
        font-family: var(--fmp-font) !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        color: var(--fmp-text-dark) !important;
        text-align: center !important;
        line-height: 1.5 !important;
        margin: 0 !important;
    }

    #categorySliderMd .cat-md-rig-name {
        font-size: 10px;
        color: var(--fmp-text-gray);
        text-align: center;
        margin: 0 0 2px;
        line-height: 1.4;
    }

    #categorySliderMd .cat-md-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        background: var(--fmp-white);
        border-radius: var(--fmp-radius-modal);
        padding: 16px;
        width: 131px;
        height: 179px;
    }
    .discounted-product .card-footer,
    .discounted-product .bottom-container {
        padding: 10px 12px !important;
        gap: 8px !important;
    }

    /* ---- Category cards (mobile small) ---- */
    #categorySliderMd .cat-md-card {
        padding: 12px;
        width: 123px;
        height: 158px;
    }

    #categorySliderMd .cat-md-img-wrap {
        width: 63px !important;
        height: 63px !important;
    }

    #categorySliderMd .cat-md-img-wrap img {
        max-width: 63px !important;
        max-height: 63px !important;
    }

    #categorySliderMd .cat-md-text-wrap {
        min-height: 60px;
    }

    #categorySliderMd .cat-md-title {
        font-family: var(--fmp-font) !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        color: var(--fmp-text-dark) !important;
        text-align: center !important;
        line-height: 1.5 !important;
        margin: 0 !important;
    }

    #categorySliderMd .cat-md-rig-name {
        font-size: 10px;
        color: var(--fmp-text-gray);
        text-align: center;
        margin: 0 0 2px;
        line-height: 1.4;
    }

    #categorySliderMd .lslide {
        min-width: 123px !important;
    }

    /* ---- Brand cards (mobile) ---- */
    .home-brand-card {
        width: 90px !important;
        padding: 8px 4px !important;
    }

    .home-brand-card .img-container {
        width: 72px !important;
        height: 72px !important;
        border-radius: var(--fmp-radius-card) !important;
    }

    .home-brand-card a h2 {
        font-size: 12px !important;
    }

    #brandSlider .lslide {
        min-width: 90px !important;
    }

    /* ---- Bottom banner: STACKED on mobile ---- */
    .fmp-banner-row {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
    }

    .fmp-banner-img-card {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 227px !important;
    }

    .fmp-banner-content {
        padding: 0 !important;
        width: 100% !important;
    }

    .fmp-banner-text h4 {
        font-size: 16px !important;
    }

    .fmp-banner-text p {
        font-size: 14px !important;
    }

    .fmp-sections-wrapper {
        padding: 0 16px !important;
    }

    .home-page-wrapper {
        padding: 0 !important;
    }

    /* ---- Footer (mobile: stacked) ---- */
    #kt_footer .d-flex.flex-column.flex-sm-row {
        flex-direction: column !important;
        align-items: center !important;
        gap: 4px;
    }

    #kt_footer .nav {
        gap: 0 !important;
        justify-content: center;
    }

    #kt_footer .nav a {
        padding: 6px 12px !important;
        font-size: 14px !important;
    }

    #kt_footer span,
    #kt_footer > .d-flex > div > span,
    #kt_footer > .d-flex > div > a {
        font-size: 12px !important;
        order: 2;
    }
}


/* ==========================================================   COOKIE CONSENT BANNER — fixed bottom, no backdrop   ========================================================== */
.fmp-cookie-banner {
    position: fixed;
    bottom: 32px;
    left: 50%;
    transform: translateX(-50%);
    width: 760px;
    max-width: calc(100% - 32px);
    z-index: 9999;
}

.fmp-cookie-card {
    background: var(--fmp-white);
    border: none;
    border-radius: var(--fmp-radius-modal);
    padding: 40px;
    box-shadow: 0px -2px 50px 0px rgba(190, 193, 197, 0.15), 0px 4px 50px 0px rgba(190, 193, 197, 0.15);
    display: flex;
    flex-direction: column;
    gap: 0;
}

.fmp-cookie-card form {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.fmp-cookie-body {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.fmp-cookie-title {
    font-family: var(--fmp-font) !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    color: var(--fmp-text-dark) !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

.fmp-cookie-text {
    font-family: var(--fmp-font) !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    color: var(--fmp-text-dark) !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

.fmp-cookie-link {
    color: var(--fmp-orange) !important;
    text-decoration: underline !important;
    text-decoration-skip-ink: none;
    font-weight: 400;
}

.fmp-cookie-link:hover {
    color: var(--fmp-orange-dark) !important;
    text-decoration: underline !important;
}

.fmp-cookie-actions {
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.fmp-cookie-btn-reject {
    flex: 1;
    height: 44px;
    border: 1.5px solid var(--fmp-orange) !important;
    background: transparent !important;
    color: var(--fmp-orange) !important;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    border-radius: var(--fmp-radius-btn) !important;
    padding: 0 16px;
    cursor: pointer;
    text-transform: capitalize;
    transition: background 0.2s, color 0.2s;
    white-space: nowrap;
}

.fmp-cookie-btn-reject:hover {
    background: rgba(246, 126, 7, 0.06) !important;
}

.fmp-cookie-btn-accept {
    flex: 1;
    height: 44px;
    border: none !important;
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    border-radius: var(--fmp-radius-btn) !important;
    padding: 0 16px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: capitalize;
    transition: background 0.2s;
    white-space: nowrap;
}

.fmp-cookie-btn-accept:hover {
    background: var(--fmp-orange-dark) !important;
}

.fmp-cookie-btn-accept svg {
    flex-shrink: 0;
    width: 17px;
    height: 17px;
}

/* Mobile: stack buttons vertically, Accept Cookies on top */
@media (max-width: 480px) {
    .fmp-cookie-banner {
        bottom: 16px;
        left: 16px;
        right: 16px;
        width: auto;
        max-width: 100%;
        transform: none;
    }

    .fmp-cookie-card {
        padding: 24px;
    }

    .fmp-cookie-card form {
        gap: 32px;
    }

    .fmp-cookie-actions {
        flex-direction: column;
        align-items: stretch;
    }

    /* Accept Cookies moves to top on mobile */
    .fmp-cookie-btn-accept {
        order: -1;
        flex: none;
        width: 100%;
    }

    .fmp-cookie-btn-reject {
        flex: none;
        width: 100%;
    }

    .fmp-cookie-title {
        font-size: 20px !important;
    }

    .fmp-cookie-text {
        font-size: 14px !important;
    }
}

/* ==========================================================
   FILTER / PRODUCT LISTING PAGE
   ========================================================== */

/* ---- Desktop sidebar container ---- */
.fmp-filter-sidebar {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    padding-bottom: 40px;
}

.fmp-filter-sidebar-header {
    padding: 32px 32px 24px;
}

.fmp-filter-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    margin: 0;
    line-height: 1.5;
}

/* Thin horizontal divider lines within the filter card */
.fmp-filter-divider {
    height: 1px;
    background: var(--fmp-border);
    margin: 0 32px;
}

.fmp-filter-count-section {
    padding: 20px 32px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.fmp-filter-count-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.fmp-filter-count-text {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    margin: 0;
}

/* "Clear all" small red pill (count row) */
.fmp-filter-btn-clear-sm {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--fmp-error);
    border-radius: var(--fmp-radius-modal);
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-error);
    text-decoration: none;
    white-space: nowrap;
    opacity: 0.8;
    background: transparent;
    transition: opacity 0.2s;
    flex-shrink: 0;
}

.fmp-filter-btn-clear-sm:hover {
    opacity: 1;
    text-decoration: none;
    color: var(--fmp-error);
}

/* Active filter pills container */
.fmp-active-pills-wrap {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.fmp-active-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.fmp-active-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--fmp-bg-card);
    border: 1px solid var(--fmp-border-blue);
    border-radius: var(--fmp-radius-modal);
    padding: 8px 14px;
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    text-decoration: none;
    white-space: nowrap;
    opacity: 0.8;
    transition: opacity 0.2s, background 0.2s;
}

.fmp-active-pill:hover {
    opacity: 1;
    background: #eef4fb;
    text-decoration: none;
    color: var(--fmp-text-dark);
}

.fmp-active-pill i {
    font-size: 16px;
    color: var(--fmp-text-gray);
}

.fmp-active-pill--hidden {
    display: none;
}

.fmp-active-pill--hidden.fmp-active-pill--visible {
    display: inline-flex;
}

/* "Show N more" toggle button */
.fmp-pills-toggle {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: none;
    border: none;
    padding: 0;
    font-size: 13px;
    font-weight: 500;
    color: var(--fmp-border-blue);
    cursor: pointer;
    transition: color 0.2s;
}

.fmp-pills-toggle i {
    font-size: 16px;
    transition: transform 0.2s;
}

.fmp-pills-toggle.open i {
    transform: rotate(180deg);
}

/* ---- Filter section (collapsible group) ---- */
.fmp-filter-section {
    padding: 24px 32px;
}

.fmp-filter-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    user-select: none;
    margin-bottom: 0;
}

.fmp-filter-section-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    margin: 0;
    line-height: 1.5;
}

.fmp-filter-section-icon {
    font-size: 24px;
    color: var(--fmp-text-dark);
    transition: transform 0.2s;
    flex-shrink: 0;
}

.fmp-filter-section-header.collapsed .fmp-filter-section-icon {
    transform: rotate(45deg);
}

.fmp-filter-section-body {
    margin-top: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* ---- Custom checkbox ---- */
.fmp-checkbox-item {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
}

.fmp-checkbox-item input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 24px;
    height: 24px;
    min-width: 24px;
    border: 1.5px solid var(--fmp-border);
    border-radius: 4px;
    background: transparent;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    transition: background 0.15s, border-color 0.15s;
    margin: 0;
}

.fmp-checkbox-item input[type="checkbox"]:checked {
    background: var(--fmp-blue);
    border-color: var(--fmp-blue);
}

.fmp-checkbox-item input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    top: 4px;
    left: 7px;
    width: 6px;
    height: 10px;
    border: 2px solid var(--fmp-white);
    border-top: none;
    border-left: none;
    transform: rotate(45deg);
}

.fmp-checkbox-label {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    line-height: 1.6;
    cursor: pointer;
    margin: 0;
}

/* ---- Desktop filter action buttons ---- */
.fmp-filter-actions {
    padding: 24px 32px 0;
    display: flex;
    gap: 16px;
}

.fmp-filter-btn-clear {
    flex: 1;
    min-height: 44px;
    border: 1.5px solid var(--fmp-orange) !important;
    background: transparent !important;
    color: var(--fmp-orange) !important;
    font-size: 14px;
    font-weight: 500;
    border-radius: var(--fmp-radius-btn) !important;
    padding: 0 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}

.fmp-filter-btn-clear:hover {
    background: rgba(246,126,7,0.06) !important;
    color: var(--fmp-orange) !important;
    text-decoration: none;
}

.fmp-filter-btn-apply {
    flex: 1;
    min-height: 44px;
    border: none !important;
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    font-size: 14px;
    font-weight: 500;
    border-radius: var(--fmp-radius-btn) !important;
    padding: 0 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
}

.fmp-filter-btn-apply:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

/* ---- Mobile/Tablet: Filter + Sort buttons at top ---- */
.fmp-filter-top-bar {
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
}

.fmp-filter-open-btn,
.fmp-sort-btn {
    flex: 1;
    height: 44px;
    border: 1.5px solid var(--fmp-orange) !important;
    background: transparent !important;
    color: var(--fmp-orange) !important;
    font-size: 14px;
    font-weight: 500;
    border-radius: var(--fmp-radius-btn) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s;
}

.fmp-filter-open-btn:hover,
.fmp-sort-btn:hover {
    background: rgba(246,126,7,0.06) !important;
    color: var(--fmp-orange) !important;
    text-decoration: none;
}

.fmp-filter-open-btn i,
.fmp-sort-btn i {
    font-size: 18px;
    color: var(--fmp-orange);
}

/* ---- Items count + active filter chips ---- */
.fmp-filter-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.fmp-items-count {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    white-space: nowrap;
    padding: 5px 8px;
    background: var(--fmp-border);
    border-radius: var(--fmp-radius-btn);
}

.fmp-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--fmp-bg-card);
    border: 1px solid var(--fmp-border-blue);
    border-radius: var(--fmp-radius-modal);
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    text-decoration: none;
    line-height: 1.5;
    opacity: 0.8;
    transition: opacity 0.2s, background 0.2s;
}

.fmp-filter-chip i {
    font-size: 15px;
    color: var(--fmp-text-gray);
}

.fmp-filter-chip:hover {
    opacity: 1;
    background: #eef4fb;
    text-decoration: none;
    color: var(--fmp-text-dark);
}

/* ---- Filter modal / drawer (Bootstrap 4 modal styled as bottom sheet on mobile, side sheet on tablet) ---- */
.fmp-filter-modal .modal-dialog {
    margin: 0;
    max-width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    transform: none !important;
}

.fmp-filter-modal.fade .modal-dialog {
    transform: translateY(100%) !important;
    transition: transform 0.3s ease-out !important;
}

.fmp-filter-modal.show .modal-dialog {
    transform: translateY(0) !important;
}

.fmp-filter-modal .modal-content {
    border-radius: var(--fmp-radius-modal) 20px 0 0 !important;
    border: none !important;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
}

.fmp-filter-modal .modal-body {
    overflow-y: auto;
    padding: 0;
    flex: 1;
}

.fmp-filter-drawer-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 24px;
    border-bottom: 1px solid var(--fmp-border);
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-modal) 20px 0 0;
}
.fmp-filter-drawer-header i {
    font-size: 24px;
    color: var(--fmp-text-dark);
}

.fmp-filter-drawer-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    margin: 0;
    line-height: 1.5;
}

.fmp-filter-drawer-close {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--fmp-text-dark);
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
}

.fmp-filter-drawer-body {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.fmp-filter-drawer-section {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.fmp-filter-drawer-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding-bottom: 24px;
}

.fmp-filter-drawer-section-header i {
    font-size: 24px;
    color: var(--fmp-text-dark);
    transition: transform 0.2s;
}

.fmp-filter-drawer-section-header.collapsed i {
    transform: rotate(45deg);
}

.fmp-filter-drawer-section-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    margin: 0;
    line-height: 1.5;
}

.fmp-filter-drawer-items {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.fmp-filter-drawer-footer {
    padding: 0 24px 32px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Tablet: side drawer */
@media (min-width: 768px) {
    .fmp-filter-drawer-title {
        font-size: 18px;
    }

    .fmp-filter-modal .modal-dialog {
        width: 100%;
        left: auto;
        right: 0;
        bottom: 0;
        top: 0;
        position: fixed;
    }

    .fmp-filter-modal.fade .modal-dialog {
        transform: translateX(100%) !important;
    }

    .fmp-filter-modal.show .modal-dialog {
        transform: translateX(0) !important;
    }

    .fmp-filter-modal .modal-content {
        border-radius: var(--fmp-radius-modal) 0 0 20px !important;
        max-height: 100vh;
        height: 100%;
    }

    .fmp-filter-drawer-header {
        border-radius: var(--fmp-radius-modal) 0 0 0;
    }

    .fmp-filter-drawer-footer {
        flex-direction: row;
        gap: 16px;
    }

    /* Tablet: Clear All left, Apply right */
    .fmp-filter-drawer-footer .fmp-drawer-btn-clear {
        order: 1;
    }
    .fmp-filter-drawer-footer .fmp-drawer-btn-apply {
        order: 2;
    }
}

/* ---- Desktop: hide mobile/tablet elements ---- */
@media (min-width: 1200px) {
    .fmp-filter-top-bar,
    .fmp-filter-meta {
        display: none;
    }

    .fmp-home-container {
        padding-left: 70px !important;
        padding-right: 70px !important;
    }

    /* ---- Category slider: custom arrow buttons ---- */
    .home-cat-desktop {
        position: relative;
    }

    .home-cat-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 32px;
        height: 32px;
        background: transparent;
        border: none;
        cursor: pointer;
        z-index: 10;
        padding: 0;
        color: var(--fmp-text-gray);
        transition: color 0.2s;
        flex-shrink: 0;
    }

    .home-cat-btn:hover {
        color: var(--fmp-text-black);
    }

    .home-cat-btn i {
        font-size: 24px;
        line-height: 1;
    }

    .home-cat-btn--prev { left: -44px; }
    .home-cat-btn--next { right: -44px; }

    /* LightSlider wrapper — allow slide content to overflow so rounded corners show cleanly */
    .home-cat-desktop .lSSlideOuter {
        overflow: hidden;
    }

    /* ---- Desktop brand section */
    .home-brands-wrapper {
        border-radius: 48px !important;
        height: 188px !important;
        overflow: hidden !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    .home-brands-scroller {
        gap: 40px !important;
        padding: 20px 40px !important;
        overflow-x: auto !important;
        align-items: center !important;
        height: 100% !important;
        width: 100%;
        justify-content: space-around;
        cursor: grab;
    }

    .home-brand-card {
        width: 156px !important;
        padding: 8px !important;
    }

    .home-brand-card .img-container {
        width: 100px !important;
        height: 100px !important;
        border-radius: var(--fmp-radius-card) !important;
    }

    .home-brand-card .img-container img {
        width: 100px !important;
        height: 100px !important;
        object-fit: contain !important;
    }

    .home-brands-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 32px;
        height: 32px;
        background: transparent;
        border: none;
        cursor: pointer;
        z-index: 10;
        padding: 0;
        color: var(--fmp-text-gray);
        transition: color 0.2s;
        flex-shrink: 0;
    }

    .home-brands-btn:hover {
        color: var(--fmp-text-black);
    }

    .home-brands-btn i {
        font-size: 24px;
        line-height: 1;
    }

    /* Arrows positioned relative to home-brands-outer, outside home-brands-wrapper */
    .home-brands-btn--prev {
        left: -44px;
    }

    .home-brands-btn--next {
        right: -44px;
    }
}

/* ---- Mobile/Tablet: hide desktop sidebar ---- */
@media (max-width: 1199px) {
    .fmp-filter-desktop-only {
        display: none !important;
    }
}

/* ---- Rig banner redesign ---- */
.filter-add-rig-layout {
    border-radius: 24px;
    background: var(--fmp-blue-darker, #0C265F);
    padding: 24px 40px !important;
    margin-bottom: 40px !important;
    display: flex !important;
    align-items: center;
    overflow: hidden;
    justify-content: space-between;
}

.filter-add-rig-layout img {
    width: 214px;
    max-width: 214px;
    height: 80px;
    object-fit: contain;
    object-position: center;
    flex-shrink: 0;
}

.filter-add-rig-layout .shop-rig,
.filter-add-rig-layout > div.d-flex {
    flex: 1 1 0;
    min-width: 0;
    max-width: 500px;
}

.filter-add-rig-layout .shop-rig h2,
.filter-add-rig-layout .shop-rig h3 {
    color: var(--fmp-white) !important;
    margin: 0 0 4px;
}

.filter-add-rig-layout .shop-rig h2 {
    font-size: 24px;
    font-weight: 600;
}

.filter-add-rig-layout .shop-rig h3 {
    font-size: 18px;
    font-weight: 600;
}

.filter-add-rig-layout p {
    font-size: 18px;
    color: var(--fmp-border) !important;
    margin: 0;
    white-space: normal;
}

.filter-add-rig-layout .rig-span {
    color: var(--fmp-white);
    font-weight: 700;
}

.filter-add-rig-layout .add-new-rig,
.filter-add-rig-layout .btn.blue {
    background: var(--fmp-orange) !important;
    border: none !important;
    border-radius: var(--fmp-radius-btn) !important;
    color: var(--fmp-white) !important;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 16px !important;
    white-space: nowrap;
    flex-shrink: 0;
}

.filter-add-rig-layout .form-check-label {
    color: var(--fmp-white) !important;
    font-size: 14px;
}

.filter-add-rig-layout .filter-checkbox:checked {
    background-color: var(--fmp-orange) !important;
    border-color: var(--fmp-orange) !important;
}

/* ---- Rig banner: mobile — stack vertically, image on top ---- */
@media (max-width: 767px) {
    .filter-add-rig-layout {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center;
        padding: 20px 16px !important;
        gap: 12px;
        margin-bottom: 24px !important;
    }

    .filter-add-rig-layout img {
        order: -1;
        width: 140px;
        max-width: 140px;
        height: auto;
        flex-shrink: 0;
    }

    .filter-add-rig-layout .shop-rig,
    .filter-add-rig-layout > div.d-flex {
        align-items: center;
        text-align: center;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .filter-add-rig-layout .shop-rig h2,
    .filter-add-rig-layout .shop-rig h3 {
        font-size: 16px !important;
    }

    .filter-add-rig-layout p {
        font-size: 13px !important;
    }

    .filter-add-rig-layout .add-new-rig,
    .filter-add-rig-layout .btn.blue {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .filter-add-rig-layout .checkbox-container,
    .filter-add-rig-layout .filter-container {
        display: flex;
        justify-content: center;
        padding-left: 0 !important;
        margin-left: 0 !important;
    }
}

/* ---- Rig banner: tablet ---- */
@media (min-width: 768px) and (max-width: 1199px) {
    .filter-add-rig-layout {
        gap: 24px !important;
        padding: 20px 24px !important;
    }

    .filter-add-rig-layout img {
        width: 160px;
        max-width: 160px;
        height: 70px;
    }

    .filter-add-rig-layout .shop-rig h2,
    .filter-add-rig-layout .shop-rig h3 {
        font-size: 18px !important;
    }

    .filter-add-rig-layout p {
        font-size: 14px !important;
    }
}

/* ---- Sort drawer modal ---- */
.fmp-sort-modal .modal-dialog {
    max-width: 100%;
}

.fmp-sort-modal .modal-content {
    border-radius: var(--fmp-radius-modal) 20px 0 0 !important;
}

.fmp-sort-list {
    list-style: none;
    margin: 0;
    padding: 8px 0 24px;
}

.fmp-sort-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 24px;
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    text-decoration: none;
    transition: background 0.15s;
}

.fmp-sort-option:hover {
    background: var(--fmp-bg);
    color: var(--fmp-text-dark);
    text-decoration: none;
}

.fmp-sort-option--active {
    font-weight: 600;
    color: var(--fmp-blue);
}

.fmp-sort-option--active:hover {
    color: var(--fmp-blue);
}

.fmp-sort-option i {
    font-size: 20px;
    color: var(--fmp-blue);
}

@media (min-width: 768px) {
    .fmp-sort-modal .modal-dialog {
        width: 100%;
        right: 0;
        left: auto;
        bottom: 0;
        top: auto;
        position: fixed;
    }

    .fmp-sort-modal.fade .modal-dialog {
        transform: translateY(100%) !important;
    }

    .fmp-sort-modal.show .modal-dialog {
        transform: translateY(0) !important;
    }

    .fmp-sort-modal .modal-content {
        border-radius: var(--fmp-radius-modal) 20px 0 0 !important;
    }
}

/* ---- Desktop sort row (filter page, xl+) ---- */
.fmp-sort-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-bottom: 28px;
}

.fmp-sort-label {
    font-size: 18px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    white-space: nowrap;
    line-height: 1.5;
}

.fmp-sort-dropdown-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: max-content;
    height: 44px;
    border: 1.5px solid var(--fmp-border);
    border-radius: 24px;
    background: transparent;
    padding: 0 16px;
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    cursor: pointer;
    transition: border-color 0.2s;
}

.fmp-sort-dropdown-btn::after {
    display: none;
}

.fmp-sort-dropdown-btn:focus,
.fmp-sort-dropdown-btn:hover {
    border-color: var(--fmp-text-light);
    outline: none;
    box-shadow: none;
    color: var(--fmp-text-dark);
}

.fmp-sort-dropdown-btn i {
    font-size: 20px;
    color: var(--fmp-text-dark);
    flex-shrink: 0;
}

.fmp-sort-dropdown-menu {
    min-width: 160px;
    border-radius: 16px !important;
    border: 1px solid var(--fmp-border) !important;
    padding: 8px 0;
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}

.fmp-sort-desktop-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    padding: 10px 16px;
    transition: background 0.15s;
}

.fmp-sort-desktop-option:hover {
    background: var(--fmp-bg-card);
    color: var(--fmp-text-dark);
    text-decoration: none;
}

.fmp-sort-desktop-option--active {
    font-weight: 600;
    color: var(--fmp-blue);
}

.fmp-sort-desktop-option--active:hover {
    color: var(--fmp-blue);
}

.fmp-sort-desktop-option i {
    font-size: 18px;
    color: var(--fmp-blue);
}

/* ==========================================================
   PRODUCT DETAIL PAGE
   ========================================================== */

/* ---- Cards ---- */
/* =========================================================
   PDP MAIN SECTION
   Mobile/Tablet: single unified white card
   Desktop: gallery card (thumbstrip left) + info card
   ========================================================= */

/* Outer wrapper */
.fmp-pdp-main-section {
    margin-bottom: 32px;
}

/* Mobile/Tablet: unified white card */
@media (max-width: 991px) {
    .fmp-pdp-main-section {
        background: var(--fmp-white);
        border-radius: var(--fmp-radius-modal);
        box-shadow: 0px 5px 10px 0px rgba(124, 142, 159, 0.12);
        padding: 20px 16px;
    }
    .fmp-pdp-main-row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* Desktop: add gap between gallery and info columns (no-gutters zeroes Bootstrap default) */
@media (min-width: 992px) {
    .fmp-pdp-main-row > .col-lg-5 {
        padding-right: 12px;
    }
    .fmp-pdp-main-row > .col-lg-7 {
        padding-left: 12px;
    }
}

/* Mobile/Tablet: image slider container */
.fmp-pdp-img-box {
    border: 1px solid var(--fmp-border);
    border-radius: 16px;
    padding: 10px;
    background: var(--fmp-white);
    margin-bottom: 16px;
    overflow: hidden;
}

/* Desktop: image card with thumbnail strip on the LEFT */
.fmp-pdp-desktop-img-card {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    box-shadow: 0px 5px 10px 0px rgba(124, 142, 159, 0.12);
    padding: 24px;
    display: flex;
    align-items: flex-start;
    gap: 20px;
    height: 100%;
    min-height: 420px;
}

/* Vertical thumbnail strip */
.fmp-pdp-thumbstrip {
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex-shrink: 0;
}

/* Main image area — takes remaining width */
.fmp-pdp-main-img-area {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Desktop: product info card */
.fmp-product-info-wrap {
    height: 100%;
}

@media (min-width: 992px) {
    .fmp-product-info-wrap {
        background: var(--fmp-white);
        border-radius: var(--fmp-radius-card);
        box-shadow: 0px 5px 10px 0px rgba(124, 142, 159, 0.12);
        padding: 28px 40px 32px;
    }

    .fmp-product-info-wrap i {
        color: var(--fmp-orange) !important;
    }

    .fmp-product-info-wrap .btn-icon {
        background-color: var(--fmp-blue) !important;
    }
    .fmp-product-info-wrap .btn-icon i {
        color: #FFFFFF !important;
    }

    .fmp-product-info-wrap .ri-shopping-cart-line {
        color: #FFFFFF !important;
    }
}


/* ---- Typography ---- */
.fmp-product-name {
    font-family: var(--fmp-font) !important;
    font-size: 40px !important;
    font-weight: 600 !important;
    color: var(--fmp-text-dark) !important;
    line-height: 1.5 !important;
    margin-bottom: 0 !important;
}

.fmp-product-sign-in-price {
    font-family: var(--fmp-font) !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    color: var(--fmp-blue) !important;
    line-height: 1.5 !important;
    text-decoration: none !important;
}

.fmp-product-sign-in-price:hover {
    color: var(--fmp-blue) !important;
    text-decoration: underline !important;
}

.fmp-product-price {
    font-family: var(--fmp-font) !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    color: var(--fmp-orange) !important;
    line-height: 1.5 !important;
}

.fmp-product-price-orig {
    font-family: var(--fmp-font) !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    color: var(--fmp-text-gray) !important;
    text-decoration: line-through !important;
    margin-left: 8px;
}

.fmp-product-sku {
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-text-gray);
    line-height: 1.5;
    margin-top: 2px;
}

.fmp-product-short-desc {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    line-height: 1.6;
    margin: 0;
}

/* ---- Options box ---- */
.fmp-product-options-box {
    border: 1px solid var(--fmp-border);
    border-radius: 16px;
    padding: 12px;
    position: relative;
    overflow: hidden;
}

.fmp-product-options-box .item_options {
    border: 1px solid var(--fmp-border) !important;
    border-radius: 8px !important;
    padding: 6px 10px !important;
    font-size: 14px;
    color: var(--fmp-text-dark);
    background: var(--fmp-white);
    width: 100%;
    margin-bottom: 4px;
}

/* =========================================================
   PDP ACTION BUTTONS — responsive grid/flex layout
   Mobile   (<768px): Cart (full) / [Save + Rig] / Parts (full)
   Tablet (768–991px): Cart | Save | Rig | Parts — one row
   Desktop   (≥992px): [Cart + Save] / [Parts + Rig]
   ========================================================= */

/* Base flex container */
.fmp-pdp-btns-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 20px;
}

/* Each button slot */
.fmp-pdp-btn-item {
    display: flex;
    align-items: stretch;
}

.fmp-pdp-btn-item > * {
    width: 100%;
}

/* Mobile (<768px): Cart full-width → [Save + Rig] → Parts full-width */
@media (max-width: 767px) {
    .fmp-pdp-btn-cart  { width: 100%; order: 1; }
    .fmp-pdp-btn-save  { flex: 1; min-width: 100px; order: 2; }
    .fmp-pdp-btn-rig   { flex: 1; min-width: 100px; order: 3; }
    .fmp-pdp-btn-parts { width: 100%; order: 4; }
}

/* Tablet (768–991px): all 4 in one row */
@media (min-width: 768px) and (max-width: 991px) {
    .fmp-pdp-btn-cart  { flex: 3; order: 1; }
    .fmp-pdp-btn-save  { flex: 2; order: 2; }
    .fmp-pdp-btn-rig   { flex: 2; order: 3; }
    .fmp-pdp-btn-parts { flex: 2; order: 4; }
}

/* Desktop (≥992px): CSS grid — Cart/Save row, Parts/Rig row */
@media (min-width: 992px) {
    .fmp-pdp-btns-flex {
        display: grid;
        grid-template-columns: 3fr 1fr;
        grid-template-areas:
            "cart save"
            "parts rig";
        gap: 16px;
    }
    .fmp-pdp-btn-cart  { grid-area: cart; }
    .fmp-pdp-btn-save  { grid-area: save; }
    .fmp-pdp-btn-parts { grid-area: parts; }
    .fmp-pdp-btn-rig   { grid-area: rig; }
}

/* Legacy row classes (kept for other potential uses) */
.fmp-product-btns { display: flex; flex-direction: column; gap: 16px; margin-top: 24px; }
.fmp-product-btns-row { display: flex; gap: 16px; align-items: stretch; }

/* Base button shell */
.fmp-pbtn {
    height: 44px;
    border-radius: var(--fmp-radius-btn) !important;
    font-family: var(--fmp-font) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    text-decoration: none !important;
    padding: 0 16px;
    white-space: nowrap;
    transition: background 0.2s, color 0.2s;
    border: none;
}

/* Filled orange — Add to Cart / Find Parts (desktop secondary row) */
.fmp-pbtn-fill {
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    border: none !important;
}

.fmp-pbtn-fill:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

/* Outlined orange — Save, Add to Rig, Find Parts */
.fmp-pbtn-outline {
    background: transparent !important;
    color: var(--fmp-orange) !important;
    border: 1.5px solid var(--fmp-orange) !important;
}

.fmp-pbtn-outline:hover {
    background: rgba(246,126,7,0.06) !important;
    color: var(--fmp-orange) !important;
    text-decoration: none !important;
}

/* Dropdown wrapper */
.fmp-pbtn-dropdown {
    position: relative;
    display: flex;
    width: 100%;
}

/* PDP: Save + Add to Rig sit side-by-side; raise open menu above siblings */
.fmp-pdp-btns-flex .fmp-pbtn-dropdown .dropdown-menu {
    z-index: 1060;
}

.fmp-pbtn-dropdown > .btn,
.fmp-pbtn-dropdown > button {
    width: 100%;
    height: 44px;
    border-radius: var(--fmp-radius-btn) !important;
    font-family: var(--fmp-font) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: transparent !important;
    color: var(--fmp-orange) !important;
    border: 1.5px solid var(--fmp-orange) !important;
    padding: 0 16px;
    white-space: nowrap;
}

.fmp-pbtn-dropdown > .btn:hover,
.fmp-pbtn-dropdown > button:hover {
    background: rgba(246,126,7,0.06) !important;
}

.fmp-pbtn-dropdown .dropdown-menu {
    border-radius: 12px;
    border: 1px solid var(--fmp-border);
    box-shadow: 0px 5px 15px rgba(0,0,0,0.1);
}

/* Replace Bootstrap primary blue on press with light orange (Save / Add to Rig, compact Save to List) */
.fmp-pbtn-dropdown .dropdown-menu .dropdown-item:active,
.fmp-pbtn-dropdown .dropdown-menu .dropdown-item.active,
.my-list-button .dropdown-menu .dropdown-item:active,
.my-list-button .dropdown-menu .dropdown-item.active {
    color: var(--fmp-text-dark) !important;
    background-color: rgba(246, 126, 7, 0.14) !important;
    background-image: none !important;
}

.dropdown-item.fmp-dropdown-add-new {
    font-weight: 500 !important;
    color: var(--fmp-orange) !important;
    background: transparent !important;
}

.dropdown-item.fmp-dropdown-add-new:hover,
.dropdown-item.fmp-dropdown-add-new:focus {
    color: var(--fmp-orange-dark) !important;
}

.fmp-pbtn-dropdown .dropdown-menu .dropdown-item.fmp-dropdown-add-new:active,
.fmp-pbtn-dropdown .dropdown-menu .dropdown-item.fmp-dropdown-add-new.active,
.my-list-button .dropdown-menu .dropdown-item.fmp-dropdown-add-new:active,
.my-list-button .dropdown-menu .dropdown-item.fmp-dropdown-add-new.active {
    color: var(--fmp-orange-dark) !important;
    background-color: rgba(246, 126, 7, 0.18) !important;
    background-image: none !important;
}

/* ---- Product description section ---- */
.fmp-product-desc-section {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-modal);
    padding: 24px 32px;
    margin-top: 24px;
}

.fmp-product-desc-label {
    font-size: 18px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

.fmp-product-desc-content h3 {
    font-size: 16px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin-bottom: 8px;
}

.fmp-product-desc-content p,
.fmp-product-desc-content li {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    line-height: 1.6;
}

/* ---- "See more" button — centered below description row ---- */
.fmp-see-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    color: var(--fmp-orange);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    cursor: pointer;
    text-decoration: none !important;
    padding: 8px 16px;
    border-radius: var(--fmp-radius-btn);
}

.fmp-see-more-btn:hover {
    color: var(--fmp-orange-dark);
    background: rgba(246,126,7,0.06);
    text-decoration: none !important;
}

.fmp-see-more-icon {
    font-size: 20px;
    transition: transform 0.25s;
}

/* ---- Radio button groups ---- */

/* Scrollable wrapper */
.fmp-options-scroll {
    max-height: 140px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 14px; /* room for custom scrollbar */
    /* Custom scrollbar */
    scrollbar-width: thin;
    scrollbar-color: #E9EAF4 transparent;
}

.fmp-options-scroll::-webkit-scrollbar {
    width: 4px;
}

.fmp-options-scroll::-webkit-scrollbar-track {
    background: transparent;
}

.fmp-options-scroll::-webkit-scrollbar-thumb {
    background: #E9EAF4;
    border-radius: 7px;
}

/* 2-column grid — always two columns on desktop */
.fmp-options-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 12px;
}

/* Grid cells must have min-width:0 for text-overflow to work */
.fmp-options-grid > .fmp-radio-item {
    min-width: 0;
}

/* Hide native <input type="radio"> */
.fmp-radio-input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

/* Radio item row — min-width:0 lets the grid cell shrink for text truncation */
.fmp-radio-item {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    margin: 0;
    padding: 0;
    user-select: none;
    min-width: 0;
    overflow: hidden;
}

/* Custom circle */
.fmp-radio-circle {
    width: 16px;
    height: 16px;
    min-width: 16px;
    border-radius: 50%;
    border: 2px solid var(--fmp-text-gray);
    position: relative;
    flex-shrink: 0;
    transition: border-color 0.15s;
}

/* Inner dot (hidden by default) */
.fmp-radio-circle::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: transparent;
    transition: background 0.15s;
}

/* Label text — truncated with ellipsis, full text shown via tooltip */
.fmp-radio-label {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
    flex: 1;
    transition: color 0.15s;
}

/* Checked state: blue border + blue dot + blue label */
.fmp-radio-input:checked ~ .fmp-radio-circle {
    border-color: var(--fmp-blue);
}

.fmp-radio-input:checked ~ .fmp-radio-circle::after {
    background: var(--fmp-blue);
}

.fmp-radio-input:checked ~ .fmp-radio-label {
    color: var(--fmp-blue);
    font-weight: 400;
}

/* Active class (JS-toggled) */
.fmp-radio-item--active .fmp-radio-circle {
    border-color: var(--fmp-blue);
}

.fmp-radio-item--active .fmp-radio-circle::after {
    background: var(--fmp-blue);
}

.fmp-radio-item--active .fmp-radio-label {
    color: var(--fmp-blue);
}

/* Mobile/tablet: single column, labels wrap normally */
@media (max-width: 767px) {
    .fmp-options-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .fmp-options-scroll {
        max-height: 200px;
        padding-right: 10px;
    }

    .fmp-radio-label {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .fmp-options-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .fmp-options-scroll {
        max-height: 200px;
    }

    .fmp-radio-label {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }
}

/* ---- Related products section ---- */
.fmp-related-heading {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin-bottom: 20px;
}

/* ---- PDP page: breadcrumb in container-p ---- */
.fmp-pdp-page .fmp-pdp-breadcrumb > ol {
    padding: 12px 0 8px;
}

.fmp-pdp-breadcrumb {
    margin-top: 0;
    margin-bottom: 0;
}

.fmp-pdp-page .fmp-pdp-breadcrumb .breadcrumb-item a,
.fmp-pdp-page .fmp-pdp-breadcrumb .breadcrumb-item.active span {
    font-size: 14px;
    font-weight: 500;
}

.fmp-pdp-page .fmp-pdp-breadcrumb .breadcrumb-item a {
    color: var(--fmp-blue) !important;
}

.fmp-pdp-page .fmp-pdp-breadcrumb .breadcrumb-item.active span {
    color: var(--fmp-text-gray) !important;
    font-weight: 400;
}

/* ---- PDP gallery: desktop thumbnails ---- */
.fmp-pdp-main-wrap {
    min-height: 220px;
}

.fmp-pdp-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin-top: 16px;
}

.fmp-pdp-thumb {
    width: 72px;
    height: 72px;
    padding: 0;
    border: 2px solid var(--fmp-border);
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.2s;
}

.fmp-pdp-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fmp-pdp-thumb.is-active,
.fmp-pdp-thumb:hover {
    border-color: var(--fmp-orange);
}

/* ---- PDP gallery: mobile / tablet slider ---- */
.fmp-pdp-gallery-slides {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    gap: 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.fmp-pdp-gallery-slides::-webkit-scrollbar {
    display: none;
}

.fmp-pdp-gallery-slide {
    flex: 0 0 100%;
    scroll-snap-align: start;
    scroll-snap-stop: always;
}

.fmp-pdp-slide-inner {
    min-height: 220px;
}

.fmp-pdp-gallery-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 12px;
}

.fmp-pdp-gallery-dot {
    width: 8px;
    height: 8px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: var(--fmp-border);
    cursor: pointer;
    transition: background 0.2s, transform 0.2s;
}

.fmp-pdp-gallery-dot.is-active {
    background: var(--fmp-orange);
    transform: scale(1.15);
}

/* ---- PDP mobile collapsible sections (options + description) ---- */
.fmp-pdp-section-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    border: none;
    background: transparent;
    font-size: 16px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    padding: 0 0 12px;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--fmp-border);
    cursor: pointer;
    text-align: left;
}

.fmp-pdp-section-toggle-icon {
    font-size: 22px;
    color: var(--fmp-text-dark);
}

.fmp-product-options-box .fmp-pdp-section-toggle {
    margin-bottom: 12px;
}

@media (min-width: 992px) {
    .fmp-pdp-collapse-lg.collapse {
        display: block !important;
        height: auto !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* ---- Related products: horizontal scroller + arrows (md+) ---- */
.fmp-related-outer {
    position: relative;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.fmp-related-scroller {
    flex: 1;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.fmp-related-scroller::-webkit-scrollbar {
    display: none;
}

.fmp-related-track {
    display: flex;
    flex-direction: row;
    gap: 20px;
    padding: 4px 0 12px;
}

.fmp-related-slide {
    flex: 0 0 auto;
    width: 240px;
    max-width: 85vw;
}

.fmp-related-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    color: var(--fmp-text-gray);
    cursor: pointer;
    transition: color 0.2s;
    padding: 0;
}

.fmp-related-nav:hover {
    color: var(--fmp-text-black);
}

.fmp-related-nav i {
    font-size: 24px;
    line-height: 1;
}

/* ---- TABLET (768–991px) ---- */
@media (min-width: 768px) and (max-width: 991px) {
    .fmp-product-name {
        font-size: 24px !important;
    }

    .fmp-product-sign-in-price,
    .fmp-product-price {
        font-size: 20px !important;
    }

    .fmp-product-short-desc {
        font-size: 14px;
    }

    /* Tablet buttons: reduce font/padding to fit all 4 in one row */
    .fmp-pdp-btn-save .fmp-pbtn-dropdown > button,
    .fmp-pdp-btn-rig .fmp-pbtn-dropdown > button,
    .fmp-pdp-btn-parts .fmp-pbtn,
    .fmp-pdp-btn-save .fmp-pbtn {
        font-size: 12px !important;
        padding: 0 10px;
    }
}

/* ---- MOBILE (≤767px) ---- */
@media (max-width: 767px) {
    .fmp-product-name {
        font-size: 18px !important;
    }

    .fmp-product-sign-in-price,
    .fmp-product-price {
        font-size: 18px !important;
    }

    .fmp-product-price-orig {
        font-size: 14px !important;
    }

    .fmp-product-short-desc {
        font-size: 14px;
    }

    .fmp-product-desc-section {
        padding: 16px;
    }

    .fmp-related-heading {
        font-size: 18px;
    }
}

/* ==========================================================
   ADD RIG MODAL
   ========================================================== */

/* Dialog sizing */
#rigmodal .modal-dialog {
    max-width: 895px;
}

#rigmodal .btn-close,
#rigmodal .close {
    font-size: 24px;
    color: var(--fmp-text-dark);
    opacity: 1;
    padding: 0;
    margin: 0;
    background: none;
    border: none;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* ---- Rig form field styles ---- */

/* Rig name input */
.fmp-rig-input {
    border: 1.5px solid rgba(56, 121, 200, 0.3) !important;
    border-radius: 24px !important;
    height: 44px !important;
    padding: 0 16px !important;
    font-size: 14px;
    color: var(--fmp-text-dark);
    background: var(--fmp-white);
    width: 100%;
    box-shadow: none !important;
    outline: none;
}

.fmp-rig-input::placeholder { color: var(--fmp-text-light); }

.fmp-rig-input:focus {
    border-color: rgba(56, 121, 200, 0.6) !important;
    box-shadow: none !important;
}

/* Category select/dropdown */
.fmp-rig-select {
    border: 1.5px solid rgba(56, 121, 200, 0.3) !important;
    border-radius: 24px !important;
    height: 44px !important;
    padding: 0 40px 0 16px !important;
    font-size: 14px;
    color: var(--fmp-text-dark);
    background-color: var(--fmp-white) !important;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23282A36'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 20px !important;
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    box-shadow: none !important;
    cursor: pointer;
    outline: none;
}

.fmp-rig-select:focus {
    border-color: rgba(56, 121, 200, 0.6) !important;
    box-shadow: none !important;
}

/* Field wrapper: label row (name + "optional") + select below */
.fmp-rig-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
    width: 100%;
}

.fmp-rig-field-label-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 16px;
}

.fmp-rig-field-name {
    font-size: 12px;
    font-weight: 600;
    color: var(--fmp-text-gray);
    line-height: 1.5;
}

.fmp-rig-field-optional {
    font-size: 12px;
    font-weight: 400;
    color: var(--fmp-text-light);
}

/* Section title (Spray Machine, Spray Gun, etc.) */
.fmp-rig-section-title {
    font-size: 18px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin: 0;
    padding: 0 8px;
}

/* Desktop: brand + model side by side */
.fmp-rig-row {
    display: flex;
    gap: 24px;
    align-items: flex-end;
    width: 100%;
}

/* Hoses: extra field (length) on second row */
.fmp-rig-row-half {
    display: flex;
    gap: 24px;
    align-items: flex-end;
}

.fmp-rig-row-half > .fmp-rig-field {
    max-width: calc(50% - 12px);
}

/* Save button */
.fmp-rig-save-btn {
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    border: none !important;
    border-radius: var(--fmp-radius-btn) !important;
    height: 44px;
    font-size: 14px !important;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 48px;
}

.fmp-rig-cancel-btn {
    margin-top: 48px;
}

.fmp-rig-save-btn:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

/* Tablet / Mobile: stack brand + model */
@media (max-width: 1199px) {
    #rigmodal .modal-body {
        padding: 24px !important;
    }

    #rigmodal .modal-title {
        font-size: 18px !important;
    }

    .fmp-rig-section-title {
        font-size: 16px !important;
    }

    .fmp-rig-row {
        flex-direction: column;
        gap: 16px;
    }

    .fmp-rig-row-half {
        flex-direction: column;
        gap: 16px;
    }

    .fmp-rig-row-half > .fmp-rig-field {
        max-width: 100%;
    }

    .fmp-rig-save-btn {
        margin-top: 24px;
    }

    .fmp-rig-cancel-btn {
        margin-top: 24px;
    }
}

/* ==========================================================
   MY RIGS INDEX PAGE
   ========================================================== */

.fmp-rig-index-page {
    background: var(--fmp-bg);
    min-height: 100vh;
}

.fmp-rig-index-content {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 40px 24px 48px;
}

.fmp-rig-main-card-outer {
    width: 100%;
    max-width: 752px;
}

.fmp-rig-main-card {
    background: var(--fmp-white) !important;
    border-radius: var(--fmp-radius-card) !important;
    border: none !important;
    box-shadow: none !important;
}

.fmp-rig-main-card .card-body {
    padding: 32px 48px 48px !important;
}

.ri-close-line {
    font-size: 20px !important;
}

.ri-close-line:hover {
    color: var(--fmp-orange) !important;
}

.fmp-rig-main-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin-bottom: 8px;
}

.fmp-rig-main-subtitle {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.6;
    margin-bottom: 0;
}

/* --- Rig boxes list --- */
.fmp-rig-boxes-wrap {
    gap: 24px;
    margin-top: 24px;
    margin-bottom: 0;
}

.fmp-rig-box {
    border: 1px solid var(--fmp-border-blue);
    border-radius: 24px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    background: var(--fmp-white);
}

.fmp-rig-box {
    i {
        color: var(--fmp-text-black) !important;
        font-size: 20px !important;
    }
    i:hover {
        color: var(--fmp-orange) !important;
    }

}

.fmp-rig-box--selected {
    background: #F2F7FB;
}

/* Rig header: name + action icons */
.fmp-rig-box-header {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
}

.fmp-rig-box-name {
    flex: 1;
    font-size: 18px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

.fmp-rig-box-actions {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;
}

.fmp-rig-box-action-btn {
    color: var(--fmp-text-dark) !important;
    text-decoration: none !important;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    font-size: 20px;
    line-height: 1;
    transition: color 0.15s;
}

.fmp-rig-box-action-btn:hover {
    color: var(--fmp-orange) !important;
    text-decoration: none !important;
}

.fmp-rig-box-action-btn--danger:hover {
    color: var(--fmp-error) !important;
}

/* --- Category cards grid (3 columns) --- */
.fmp-rig-cat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.fmp-rig-cat-card {
    background: var(--fmp-white);
    border: 1px solid rgba(56, 121, 200, 0.3);
    border-radius: var(--fmp-radius-modal);
    padding: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-decoration: none !important;
    transition: border-color 0.15s, box-shadow 0.15s;
    cursor: pointer;
}

.fmp-rig-cat-card:hover {
    border-color: rgba(56, 121, 200, 0.6);
    box-shadow: 0 2px 8px rgba(56, 121, 200, 0.12);
    text-decoration: none !important;
}

.fmp-rig-cat-name {
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    text-align: center;
    white-space: nowrap;
}

.fmp-rig-cat-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.fmp-rig-cat-subtitle {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.6;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.fmp-rig-cat-subtitle--empty {
    color: var(--fmp-text-light) !important;
}

.fmp-rig-cat-img-wrap {
    width: 85px;
    height: 85px;
    border-radius: var(--fmp-radius-card);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFFFFF;
    flex-shrink: 0;
}

.fmp-rig-cat-img {
    width: 85px;
    height: 85px;
    object-fit: cover;
    border-radius: var(--fmp-radius-card);
    display: block;
}

.fmp-rig-cat-img-wrap--empty {
    background: var(--fmp-bg);
    border: 1px solid rgba(56, 121, 200, 0.2);
}

.fmp-rig-cat-placeholder-icon {
    font-size: 32px;
    color: var(--fmp-text-light);
}

/* --- Add New Rig button --- */
.fmp-rig-add-wrap {
    margin-top: 32px;
}

.fmp-rig-add-btn {
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    border: none !important;
    border-radius: var(--fmp-radius-btn) !important;
    height: 44px !important;
    width: 320px;
    max-width: 100%;
    font-size: 14px !important;
    font-weight: 500;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    transition: background 0.15s;
}

.fmp-rig-add-btn:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

/* --- Delete Rig confirmation modal (7790-137147) --- */
.fmp-rig-delete-modal-dialog {
    max-width: 770px;
    max-height: 150px;
}

.fmp-rig-delete-modal-content {
    border-radius: var(--fmp-radius-modal) !important;
    border: none !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15) !important;
    overflow: hidden;
}

.fmp-rig-delete-modal-header {
    border-bottom: 1px solid var(--fmp-border) !important;
    padding: 20px 24px !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fmp-rig-delete-modal-title {
    font-size: 18px !important;
    font-weight: 600;
    color: var(--fmp-text-dark);
    margin: 0;
}

.fmp-rig-delete-modal-close {
    font-size: 20px !important;
    color: var(--fmp-text-dark) !important;
    opacity: 1 !important;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fmp-rig-delete-modal-close:hover {
    color: var(--fmp-error) !important;
}

.fmp-rig-delete-modal-body {
    padding: 24px !important;
    text-align: center;
}

.fmp-rig-delete-modal-body > p {
    font-size: 14px;
    color: var(--fmp-text-dark);
    margin-bottom: 24px;
}

.fmp-rig-delete-modal-actions {
    display: flex;
    gap: 16px;
    justify-content: center;
}

.fmp-rig-delete-yes-btn {
    background: transparent !important;
    color: var(--fmp-orange) !important;
    border: 1.5px solid var(--fmp-orange) !important;
    border-radius: var(--fmp-radius-btn) !important;
    height: 44px !important;
    min-width: 120px;
    font-size: 14px !important;
    font-weight: 500;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.15s;
}

.fmp-rig-delete-yes-btn:hover {
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
}

.fmp-rig-delete-no-btn {
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    border: none !important;
    border-radius: var(--fmp-radius-btn) !important;
    height: 44px !important;
    min-width: 120px;
    font-size: 14px !important;
    font-weight: 500;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s;
}

.fmp-rig-delete-no-btn:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

/* --- Cancel button on create/edit forms --- */
.fmp-rig-cancel-btn {
    background: transparent !important;
    color: var(--fmp-orange) !important;
    border: 1.5px solid var(--fmp-orange) !important;
    border-radius: var(--fmp-radius-btn) !important;
    height: 44px !important;
    font-size: 14px !important;
    font-weight: 500;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer;
    transition: all 0.15s;
    text-decoration: none !important;
}

.fmp-rig-cancel-btn:hover {
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    text-decoration: none !important;
}

/* --- Responsive --- */
@media (max-width: 1199px) {
    .fmp-rig-index-content {
        padding: 24px 16px 40px;
    }
}

@media (max-width: 767px) {
    .fmp-rig-main-card .card-body {
        padding: 24px 20px 32px !important;
    }

    .fmp-rig-cat-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .fmp-rig-box-name {
        font-size: 16px;
    }

    .fmp-rig-add-btn {
        width: 100%;
        max-width: 320px;
    }
}

/* ==========================================================
   PARTS FINDER PAGE
   ========================================================== */

/* ---- Page heading ---- */
.fmp-pf-heading-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
    flex-wrap: nowrap;
}

.fmp-pf-heading {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin: 0;
    white-space: nowrap;
    flex-shrink: 0;
}

.fmp-pf-rig-name-btn {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: none;
    border: none;
    padding: 0;
    line-height: 1.5;
}

.fmp-pf-rig-name-btn i {
    font-size: 20px;
    color: var(--fmp-text-gray);
}

.fmp-pf-tutorial-btn {
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-radius: 50%;
    background: var(--fmp-orange);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin-left: auto;
    flex-shrink: 0;
}

.fmp-pf-tutorial-btn i {
    color: var(--fmp-white);
    font-size: 16px;
}

/* ---- Section label ---- */
.fmp-pf-section-label {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.6;
    margin-bottom: 16px;
}

/* ---- Equipment cards grid ---- */
.fmp-pf-equipment-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 32px;
}

.fmp-pf-equip-card {
    flex: 1;
    min-width: 130px;
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-modal);
    padding: 16px 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    box-shadow: 0 5px 10px rgba(124,142,159,0.25);
    border: 2px solid transparent;
    transition: border-color 0.15s;
    min-height: 110px;
    text-align: center;
    text-decoration: none !important;
}

.fmp-pf-equip-card:hover {
    border-color: rgba(246,126,7,0.4);
    text-decoration: none !important;
}

.fmp-pf-equip-card--active {
    border-color: var(--fmp-orange) !important;
    border-width: 1.5px;
}

.fmp-pf-equip-card img {
    max-height: 56px;
    max-width: 100%;
    object-fit: contain;
}

.fmp-pf-equip-card-name {
    font-size: 12px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.4;
    margin: 0;
}

.fmp-pf-equip-card-no {
    font-size: 12px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    margin: 0;
}

.fmp-pf-equip-card-specify {
    font-size: 12px;
    font-weight: 500;
    color: var(--fmp-orange);
    margin: 0;
}

/* ---- Manual type tabs ---- */
.fmp-pf-tabs {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.fmp-pf-tab {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    border: 1px solid var(--fmp-border);
    border-radius: var(--fmp-radius-btn);
    padding: 6px 16px;
    cursor: pointer;
    user-select: none;
    background: var(--fmp-white);
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    white-space: nowrap;
}

.fmp-pf-tab:hover {
    border-color: var(--fmp-orange);
    color: var(--fmp-orange);
}

.fmp-pf-tab--active {
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    border-color: var(--fmp-orange) !important;
    font-weight: 500;
}

/* ---- Manual cards ---- */
.fmp-pf-manual-card {
    background: var(--fmp-white);
    border-radius: 16px;
    padding: 16px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    cursor: pointer;
    box-shadow: 0 5px 10px rgba(124,142,159,0.15);
    border: 2px solid transparent;
    transition: border-color 0.15s;
    height: 100%;
}

.fmp-pf-manual-card:hover {
    border-color: rgba(246,126,7,0.4);
}

.fmp-pf-manual-card--active {
    border-color: var(--fmp-orange) !important;
    border-width: 1.5px;
}

.fmp-pf-manual-thumb {
    width: 44px;
    height: 44px;
    object-fit: contain;
    flex-shrink: 0;
}

.fmp-pf-manual-info {
    flex: 1;
    min-width: 0;
}

.fmp-pf-manual-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    background: var(--fmp-bg);
    border-radius: 6px;
    padding: 2px 8px;
    margin-bottom: 6px;
}

.fmp-pf-manual-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.4;
    margin: 0;
}

/* ---- "Click on part number" instruction ---- */
.fmp-pf-instruction {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    margin-bottom: 16px;
}

/* Pagination */
.fmp-pagination-nav {
    padding: 8px 0;
}

.fmp-pagination {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    justify-content: center;
}

.fmp-page-item {
    display: flex;
}

.fmp-page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 10px;
    border-radius: var(--fmp-radius-modal);
    border: 1.5px solid var(--fmp-border);
    background: var(--fmp-white);
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-black);
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
    line-height: 1;
}

.fmp-page-link:hover {
    border-color: var(--fmp-orange);
    color: var(--fmp-orange);
    text-decoration: none;
}

.fmp-page-link--active {
    background: var(--fmp-orange);
    border-color: var(--fmp-orange);
    color: var(--fmp-white) !important;
    font-weight: 500;
    cursor: default;
}

.fmp-page-link--arrow {
    min-width: 40px;
    font-size: 20px;
    padding: 0;
}

.fmp-page-link--dots {
    border-color: transparent;
    background: transparent;
    cursor: default;
    color: var(--fmp-text-light);
    min-width: 24px;
    padding: 0;
}

.fmp-page-link--dots:hover {
    border-color: transparent;
    background: transparent;
    color: var(--fmp-text-light);
}

.fmp-page-item--disabled .fmp-page-link {
    color: var(--fmp-text-light);
    border-color: var(--fmp-border);
    cursor: not-allowed;
    pointer-events: none;
}

.fmp-page-item--disabled .fmp-page-link:hover {
    color: var(--fmp-text-light);
    border-color: var(--fmp-border);
    background: var(--fmp-white);
}

/* Frequently purchased slider wrapper */
.fmp-pf-freq-wrap {
    position: relative;
}

.fmp-pf-freq-slider-viewport {
    overflow: hidden;
}

.fmp-pf-freq-slider-viewport .row {
    flex-wrap: nowrap;
    transition: transform 0.35s ease;
}

.fmp-pf-freq-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    background: transparent;
    border: none;
    color: var(--fmp-text-gray);
    font-size: 28px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    transition: color 0.15s;
}

.fmp-pf-freq-nav:hover {
    color: var(--fmp-text-black);
}

.fmp-pf-freq-nav--prev {
    left: -36px;
}

.fmp-pf-freq-nav--next {
    right: -36px;
}

/* Manual viewer toolbar */
.manual_viewer_actions_toolbar .card-body {
    background: var(--fmp-bg-card) !important;
    border: 1px solid var(--fmp-border) !important;
    border-top-left-radius: 12px !important;
    border-top-right-radius: 12px !important;
}

button.btn-bg-gray {
    background-color: var(--fmp-border) !important;
    color: var(--fmp-text-black) !important;
    border: none !important;
}

button.btn-bg-gray:hover {
    background-color: var(--fmp-text-light) !important;
}

button.btn-bg-gray i {
    color: var(--fmp-text-black) !important;
}

.manual_viewer_actions_toolbar .form-control,
.manual_viewer_actions_toolbar select.form-control {
    border-color: var(--fmp-border);
    font-size: 13px;
}

/* Mobile */
@media (max-width: 767px) {
    .fmp-pf-equip-card {
        min-width: calc(50% - 6px);
        flex: 0 0 calc(50% - 6px);
        max-width: calc(50% - 6px);
    }

    .fmp-pf-heading {
        font-size: 16px;
    }

    .fmp-pf-rig-name-btn {
        font-size: 16px;
    }

    .fmp-pf-freq-nav--prev {
        left: -24px;
    }

    .fmp-pf-freq-nav--next {
        right: -24px;
    }
}

/* ==========================================================
   CREATE ACCOUNT PAGE
   ========================================================== */

.fmp-custom-page {
    background: var(--fmp-bg);
    min-height: 100vh;
    padding: 0px 0 48px;
}

.fmp-custom-card {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    padding: 40px 48px;
    max-width: 635px;
    width: 100%;
    box-shadow: 0 5px 20px rgba(124,142,159,0.1);
}

.fmp-custom-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    display: block;
    margin: 0 0 8px;
}

.fmp-custom-subtitle {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.6;
    margin: 0 0 32px;
}

.fmp-register-fields {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.fmp-custom-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 0;
    margin-top: 24px;
}

.fmp-custom-label-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 16px;
}

.fmp-custom-label {
    font-size: 12px;
    font-weight: 600;
    color: var(--fmp-text-gray);
    line-height: 1.5;
}

.fmp-custom-optional {
    font-size: 12px;
    font-weight: 400;
    color: var(--fmp-text-light);
}

.fmp-custom-hint {
    font-size: 12px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.5;
    margin-top: 4px;
    padding: 0 16px;
}

.fmp-custom-input {
    border: 1.5px solid var(--fmp-border) !important;
    border-radius: 24px !important;
    height: 44px !important;
    padding: 0 16px !important;
    font-size: 14px;
    color: var(--fmp-text-dark);
    background: var(--fmp-white);
    width: 100%;
    box-shadow: none !important;
    outline: none;
}

.fmp-custom-input::placeholder { color: var(--fmp-text-light); }

.fmp-custom-input:focus {
    border-color: rgba(56, 121, 200, 0.6) !important;
    box-shadow: none !important;
}

.fmp-custom-input.fmp-custom-input--error {
    border-color: var(--fmp-error) !important;
}

.fmp-custom-input.fmp-custom-input--error:focus {
    border-color: var(--fmp-error) !important;
}

.fmp-field-error-msg {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.4;
    color: var(--fmp-error);
}

.fmp-custom-select {
    border: 1.5px solid var(--fmp-border) !important;
    border-radius: 24px !important;
    height: 44px !important;
    padding: 0 40px 0 16px !important;
    font-size: 14px;
    color: var(--fmp-text-dark);
    background-color: var(--fmp-white) !important;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23282A36'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 20px !important;
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    box-shadow: none !important;
    cursor: pointer;
    outline: none;
}

.fmp-custom-select:focus {
    border-color: rgba(56, 121, 200, 0.6) !important;
    box-shadow: none !important;
}

.fmp-custom-select option[value=""] { color: var(--fmp-text-light); }

/* Password field with eye icon wrapper */
.fmp-custom-password-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.fmp-custom-password-wrap .fmp-custom-input {
    padding-right: 44px !important;
}

.fmp-custom-password-toggle {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--fmp-text-gray);
    display: flex;
    align-items: center;
    justify-content: center;
}

.fmp-custom-password-toggle:hover { color: var(--fmp-text-dark); }

/* Password requirements */
.fmp-custom-requirements {
    display: flex;
    gap: 28px;
    padding: 0 8px;
    margin-top: 8px;
}

.fmp-custom-requirements-col {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.fmp-custom-req-item {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    font-weight: 400;
    color: var(--fmp-text-light);
    line-height: 1.5;
}

.fmp-custom-req-item::before {
    content: '';
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--fmp-text-light);
    flex-shrink: 0;
}

.fmp-custom-submit-btn {
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    border: 1.5px solid var(--fmp-orange) !important;
    border-radius: var(--fmp-radius-btn) !important;
    height: 44px;
    width: 100%;
    font-size: 14px !important;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 32px;
}

.fmp-custom-submit-btn:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

.fmp-custom-legal {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.6;
    text-align: center;
    margin: 16px 0 0;
}

.fmp-custom-signin-wrap {
    display: flex;
    align-items: baseline;
    gap: 8px;
    justify-content: center;
    margin-top: 40px;
}

.fmp-custom-signin-text {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    line-height: 1.6;
}

.fmp-custom-signin-link {
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-orange);
    text-decoration: none;
}

.fmp-custom-signin-link:hover {
    color: var(--fmp-orange-dark);
    text-decoration: underline;
}

@media (max-width: 767px) {
    .fmp-custom-card {
        padding: 32px 24px;
    }
}

/* ==========================================================
   LOGIN PAGE
   ========================================================== */

.fmp-login-page {
    background: var(--fmp-bg);
    min-height: 100vh;
    padding: 24px 0 48px;
}

.fmp-login-card {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    padding: 64px;
    max-width: 507px;
    width: 100%;
    box-shadow: 0 5px 20px rgba(124,142,159,0.1);
}

.fmp-login-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    display: block;
    margin: 0 0 8px;
}

.fmp-login-subtitle {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.6;
    margin: 0 0 32px;
}

.fmp-login-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 24px;
}

.fmp-login-input {
    border: 1.5px solid rgba(56, 121, 200, 0.3) !important;
    border-radius: 24px !important;
    height: 44px !important;
    padding: 0 16px !important;
    font-size: 14px;
    color: var(--fmp-text-dark);
    background: var(--fmp-white);
    width: 100%;
    box-shadow: none !important;
    outline: none;
}

.fmp-login-input::placeholder { color: var(--fmp-text-light); }

.fmp-login-input:focus {
    border-color: rgba(56, 121, 200, 0.6) !important;
    box-shadow: none !important;
}

.fmp-login-input.fmp-login-input--error {
    border-color: var(--fmp-error) !important;
}

.fmp-login-input.fmp-login-input--error:focus {
    border-color: var(--fmp-error) !important;
}

.fmp-login-error {
    font-size: 12px;
    font-weight: 400;
    color: var(--fmp-error);
    line-height: 1.5;
    padding: 0 8px;
    margin-top: 4px;
    text-align: right;
}

.fmp-login-password-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.fmp-login-password-wrap .fmp-login-input {
    padding-right: 44px !important;
}

.fmp-login-password-toggle {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--fmp-text-gray);
    display: flex;
    align-items: center;
    justify-content: center;
}

.fmp-login-password-toggle:hover { color: var(--fmp-text-dark); }

.fmp-login-options {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
}

.fmp-login-remember {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
}

.fmp-login-checkbox {
    width: 24px;
    height: 24px;
    border: 1.5px solid var(--fmp-border-blue);
    border-radius: 4px;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fmp-login-checkbox:checked {
    background: var(--fmp-blue);
    border-color: var(--fmp-blue);
}

.fmp-login-checkbox:checked::after {
    content: '\2713';
    color: var(--fmp-white);
    font-size: 14px;
    font-weight: bold;
    line-height: 1;
}

.fmp-login-remember-text {
    font-size: 12px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

.fmp-login-forgot {
    font-size: 12px;
    font-weight: 400;
    color: var(--fmp-orange);
    text-decoration: none;
}

.fmp-login-forgot:hover {
    color: var(--fmp-orange-dark);
    text-decoration: underline;
}

.fmp-login-submit-btn {
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    border: none !important;
    border-radius: var(--fmp-radius-btn) !important;
    height: 44px;
    width: 100%;
    font-size: 14px !important;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fmp-login-submit-btn:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

.fmp-login-register-wrap {
    display: flex;
    align-items: baseline;
    gap: 8px;
    justify-content: center;
    margin-top: 32px;
}

.fmp-login-register-text {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    line-height: 1.6;
}

.fmp-login-register-link {
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-orange);
    text-decoration: none;
}

.fmp-login-register-link:hover {
    color: var(--fmp-orange-dark);
    text-decoration: underline;
}

@media (max-width: 767px) {
    .fmp-login-card {
        padding: 32px 24px;
    }
}

/* ==========================================================
   FORGOT PASSWORD
   ========================================================== */

.fmp-forgot-page {
    background: var(--fmp-bg);
    min-height: 100vh;
    padding: 24px 0 48px;
}

.fmp-forgot-card {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    padding: 64px;
    max-width: 507px;
    width: 100%;
    box-shadow: 0 5px 20px rgba(124,142,159,0.1);
}

.fmp-forgot-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin: 0 0 8px;
}

.fmp-forgot-subtitle {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.6;
    margin: 0 0 32px;
}

.fmp-forgot-success .fmp-forgot-subtitle {
    margin-bottom: 0;
}

.fmp-forgot-success .fmp-forgot-subtitle strong {
    color: var(--fmp-text-dark);
    font-weight: 600;
}

.fmp-forgot-alert {
    font-size: 14px;
    padding: 12px 16px;
    border-radius: 12px;
    margin-bottom: 24px;
}

.fmp-forgot-alert--error {
    background: rgba(244, 44, 0, 0.08);
    color: var(--fmp-error);
}

.fmp-forgot-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 24px;
}

.fmp-forgot-input {
    border: 1.5px solid rgba(56, 121, 200, 0.3) !important;
    border-radius: 24px !important;
    height: 44px !important;
    padding: 0 16px !important;
    font-size: 14px;
    color: var(--fmp-text-dark);
    background: var(--fmp-white);
    width: 100%;
    box-shadow: none !important;
    outline: none;
}

.fmp-forgot-input::placeholder { color: var(--fmp-text-light); }

.fmp-forgot-input:focus {
    border-color: rgba(56, 121, 200, 0.6) !important;
    box-shadow: none !important;
}

.fmp-forgot-error {
    font-size: 12px;
    font-weight: 400;
    color: var(--fmp-error);
    line-height: 1.5;
    padding: 0 8px;
    margin-top: 4px;
}

.fmp-forgot-submit-btn {
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    border: none;
    border-radius: var(--fmp-radius-btn);
    height: 44px;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}

.fmp-forgot-submit-btn:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

.fmp-forgot-submit-btn:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

@media (max-width: 767px) {
    .fmp-forgot-card {
        padding: 32px 24px;
    }
}

/* ==========================================================
   RESET PASSWORD
   ========================================================== */

.fmp-reset-page {
    background: var(--fmp-bg);
    min-height: 100vh;
    padding: 24px 0 48px;
}

.fmp-reset-card {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    padding: 64px;
    max-width: 507px;
    width: 100%;
    box-shadow: 0 5px 20px rgba(124,142,159,0.1);
}

.fmp-reset-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin: 0 0 8px;
}

.fmp-reset-subtitle {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.6;
    margin: 0 0 32px;
}

.fmp-reset-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 24px;
}

.fmp-reset-input {
    border: 1.5px solid rgba(56, 121, 200, 0.3) !important;
    border-radius: 24px !important;
    height: 44px !important;
    padding: 0 16px !important;
    font-size: 14px;
    color: var(--fmp-text-dark);
    background: var(--fmp-white);
    width: 100%;
    box-shadow: none !important;
    outline: none;
}

.fmp-reset-input::placeholder { color: var(--fmp-text-light); }

.fmp-reset-input:focus {
    border-color: rgba(56, 121, 200, 0.6) !important;
    box-shadow: none !important;
}

.fmp-reset-input.fmp-reset-input--error {
    border-color: var(--fmp-error) !important;
}

.fmp-reset-input.fmp-reset-input--error:focus {
    border-color: var(--fmp-error) !important;
}

.fmp-reset-error {
    font-size: 12px;
    font-weight: 400;
    color: var(--fmp-error);
    line-height: 1.5;
    padding: 0 8px;
    margin-top: 4px;
}

.fmp-reset-password-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.fmp-reset-password-wrap .fmp-reset-input {
    padding-right: 44px !important;
}

.fmp-reset-password-toggle {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--fmp-text-gray);
    font-size: 20px;
}

.fmp-reset-password-toggle:hover { color: var(--fmp-text-dark); }

.fmp-reset-submit-btn {
    background: var(--fmp-orange) !important;
    color: var(--fmp-white) !important;
    border: none;
    border-radius: var(--fmp-radius-btn);
    height: 44px;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}

.fmp-reset-submit-btn:hover {
    background: var(--fmp-orange-dark) !important;
    color: var(--fmp-white) !important;
}

.fmp-reset-submit-btn:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

@media (max-width: 767px) {
    .fmp-reset-card {
        padding: 32px 24px;
    }
}

.ri-add-line {
    color: var(--fmp-white) !important;
}

#checkout_main {
    .ri-add-line {
        color: var(--fmp-orange) !important;
    }
}

/* ==========================================================
   SETTINGS — Change Password (reuses auth styles)
   ========================================================== */

.fmp-settings-card {
    border-radius: var(--fmp-radius-card);
}

.fmp-settings-card .fmp-custom-title {
    margin-bottom: 8px;
}

.fmp-settings-card .fmp-custom-subtitle {
    margin-bottom: 32px;
}

.fmp-settings-password-actions {
    display: flex;
    gap: 16px;
    margin-top: 32px;
}

.fmp-settings-password-actions .fmp-custom-submit-btn {
    flex: 1;
    margin-top: 0;
}

.fmp-settings-cancel-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    border-radius: var(--fmp-radius-btn);
    border: 1.5px solid var(--fmp-orange);
    background: var(--fmp-white) !important;
    color: var(--fmp-orange);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s, background 0.2s;
    flex: 1;
}

.fmp-settings-cancel-btn:hover {
    color: var(--fmp-orange-dark);
    border-color: var(--fmp-orange-dark);
    background: transparent !important;
    color: var(--fmp-orange-dark);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
}

/* ==========================================================
   SETTINGS — Email Settings (7839-410012)
   ========================================================== */

.fmp-email-section {
    margin-bottom: 32px;
}

.fmp-email-section-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    margin: 0 0 16px;
}

.fmp-email-toggle-wrap {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.fmp-email-toggle {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 28px;
    flex-shrink: 0;
}

.fmp-email-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
}

.fmp-email-toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #E2E8F0;
    border-radius: var(--fmp-radius-card);
    transition: 0.2s;
}

.fmp-email-toggle-slider::before {
    position: absolute;
    content: "";
    height: 22px;
    width: 22px;
    left: 3px;
    bottom: 3px;
    background-color: var(--fmp-white);
    border-radius: 50%;
    transition: 0.2s;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.fmp-email-toggle input:checked + .fmp-email-toggle-slider {
    background-color: var(--fmp-orange);
}

.fmp-email-toggle input:checked + .fmp-email-toggle-slider::before {
    transform: translateX(20px);
}

.fmp-email-toggle-label {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.5;
}

.fmp-email-checkbox-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.fmp-email-checkbox {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    user-select: none;
}

.fmp-email-checkbox--disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

.fmp-email-checkbox input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.fmp-email-checkbox-box {
    width: 24px;
    height: 24px;
    border: 1.5px solid var(--fmp-border-blue);
    border-radius: 4px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s, border-color 0.2s;
}

.fmp-email-checkbox input:checked + .fmp-email-checkbox-box {
    background: var(--fmp-blue);
    border-color: var(--fmp-blue);
}

.fmp-email-checkbox input:checked + .fmp-email-checkbox-box::after {
    content: '\2713';
    color: var(--fmp-white);
    font-size: 14px;
    font-weight: bold;
}

.fmp-email-checkbox-text {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
}

.fmp-email-profile-link {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    margin: 0 0 32px;
}

.fmp-email-profile-link a {
    color: var(--fmp-orange);
    font-weight: 500;
    text-decoration: none;
}

.fmp-email-profile-link a:hover {
    color: var(--fmp-orange-dark);
    text-decoration: underline;
}

/* ==========================================================
   SETTINGS — Add/Edit Address (7839-412707)
   ========================================================== */

.fmp-address-form .fmp-custom-field {
    margin-bottom: 24px;
}

.fmp-address-form .row .fmp-custom-field {
    margin-bottom: 24px;
}

.fmp-address-form select.fmp-custom-select {
    width: 100%;
}

/* ==========================================================
   SETTINGS — Payment Methods (7790-140554, 7790-140604, etc.)
   ========================================================== */

.fmp-payment-card-option {
    display: block;
    padding: 20px;
    border: 1.5px solid rgba(56, 121, 200, 0.3);
    border-radius: 16px;
    background: var(--fmp-white);
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.fmp-payment-card-option:hover {
    border-color: rgba(56, 121, 200, 0.6);
    box-shadow: 0 2px 8px rgba(124, 142, 159, 0.1);
}

.fmp-payment-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.fmp-payment-card-brand {
    font-size: 14px;
    font-weight: 600;
    color: var(--fmp-text-dark);
}

.fmp-payment-card-actions {
    display: flex;
    gap: 8px;
}

.fmp-payment-card-action {
    color: var(--fmp-text-gray);
    font-size: 18px;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}

.fmp-payment-card-action:hover {
    color: var(--fmp-text-dark);
}

.fmp-payment-card-action i {
    display: block;
}

.fmp-payment-card-number {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-gray);
}

.fmp-payment-add-wrap {
    margin-top: 24px;
    display: flex;
    justify-content: center;
}

.fmp-payment-add-wrap .fmp-custom-submit-btn.fmp-payment-add-btn {
    width: auto;
    min-width: min(100%, 360px);
    margin-top: 0;
}

.fmp-payment-add-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    width: auto !important;
    padding: 0 24px;
}

.fmp-settings-card #as_payment_create_form .card-body > .fmp-custom-field {
    margin-bottom: 24px;
}

.fmp-settings-card #as_payment_create_form .card-body > .row > [class*="col-"] .fmp-custom-field {
    margin-bottom: 0;
}

.fmp-settings-card #as_payment_create_form .card-body > .row {
    margin-bottom: 24px;
}

.fmp-settings-card #as_payment_create_form .card-body > .card-wrapper {
    margin-bottom: 32px !important;
}

.fmp-payment-add-address-wrap .fmp-custom-submit-btn.fmp-payment-add-btn {
    margin-top: 0;
    width: 100%;
}

.fmp-payment-billing-section {
    margin-top: 24px;
    padding-top: 0;
    border-top: none;
}

.fmp-payment-billing-section .fmp-email-section-title {
    margin-bottom: 16px;
}

.fmp-payment-add-address-wrap {
    margin-top: 16px;
}

.fmp-payment-billing-section .option {
    padding: 16px;
    border: 1.5px solid rgba(56, 121, 200, 0.3);
    border-radius: 16px;
    margin-bottom: 12px;
}

.fmp-payment-billing-section .option.bg-gray-200,
.fmp-payment-billing-section .option.bg-hover-light:hover {
    border-color: rgba(56, 121, 200, 0.6);
}

/* ==========================================================
   MODALS
   ========================================================== */

/* ==========================================================
   UNIFIED CUSTOMER MODAL SYSTEM
   ========================================================== */

.fmp-modal-dialog {
    max-width: 635px;
}

.fmp-modal-content {
    border-radius: 24px;
    border: none;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(40, 42, 54, 0.12);
}

.fmp-modal-header {
    display: flex !important;
    align-items: center !important;
    border-bottom: 1px solid var(--fmp-border) !important;
    padding: 16px 24px !important;
    background: var(--fmp-white) !important;
}

@media (min-width: 576px) {
    .fmp-modal-header {
        padding: 24px 40px !important;
    }
}

@media (min-width: 768px) {
    .fmp-modal-header {
        padding: 24px 48px !important;
    }
}

.fmp-modal-title {
    font-family: var(--fmp-font) !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    color: var(--fmp-text-dark) !important;
    margin: 0;
    flex: 1;
}

@media (min-width: 768px) {
    .fmp-modal-title {
        font-size: 24px !important;
    }
}

.fmp-modal-body {
    padding: 24px !important;
    background: var(--fmp-white) !important;
}

@media (min-width: 576px) {
    .fmp-modal-body {
        padding: 32px 40px 40px !important;
    }
}

@media (min-width: 768px) {
    .fmp-modal-body {
        padding: 32px 48px 48px !important;
    }
}

/* Blurred backdrop */
.modal-backdrop.show {
    backdrop-filter: blur(7.5px);
    -webkit-backdrop-filter: blur(7.5px);
}

/* Close button */
.fmp-modal-close-btn {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--fmp-text-dark);
    font-size: 1.75rem;
    line-height: 1;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    transition: color 0.2s;
}

.fmp-modal-close-btn:hover {
    color: var(--fmp-text-gray);
}

/* -------------------------------------------------------
   Address Cards (My address modal)
   ------------------------------------------------------- */
.fmp-address-card {
    border-radius: var(--fmp-radius-modal);
    border: 1px solid var(--fmp-border);
    background: var(--fmp-white);
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    margin-bottom: 16px;
}

.fmp-address-card--selected,
.fmp-address-card.primary {
    background: #F2F7FB;
    border-color: var(--fmp-border-blue);
    border-width: 1.5px;
}

.fmp-address-card-head {
    display: flex;
    align-items: center;
    gap: 16px;
}

.fmp-address-card-name {
    flex: 1;
    font-size: 16px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    margin: 0;
    line-height: 1.5;
}

.fmp-address-card-text {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0;
    line-height: 1.5;
}

.fmp-address-card-icons {
    display: flex;
    gap: 20px;
    align-items: center;
    flex-shrink: 0;
}

.fmp-address-card-icons a {
    color: var(--fmp-text-dark);
    text-decoration: none;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
}

.fmp-address-card-icons a:hover {
    color: var(--fmp-orange);
}

/* Primary rig badge */
/* Rig list cards */
.fmp-rig-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.fmp-rig-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    border: 1.5px solid rgba(56, 121, 200, 0.3);
    border-radius: 16px;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    position: relative;
    user-select: none;
    color: inherit;
}

.fmp-rig-card:hover {
    border-color: var(--fmp-border-blue);
}

.fmp-rig-card--selected {
    border-color: var(--fmp-border-blue);
    background: #F2F7FB;
}

.fmp-rig-card--no-rig {
    align-items: flex-start;
}

.fmp-rig-card-radio {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 2px;
}

.fmp-rig-radio {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid rgba(56, 121, 200, 0.4);
    background: #fff;
    flex-shrink: 0;
    transition: border-color 0.15s, background 0.15s;
    position: relative;
}

.fmp-rig-radio--active {
    border-color: var(--fmp-border-blue);
    background: var(--fmp-border-blue);
}

.fmp-rig-radio--active::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
}

.fmp-rig-card-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.fmp-rig-card-name-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.fmp-rig-card-name {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    line-height: 1.4;
}

.fmp-rig-card-sub {
    font-size: 12px;
    font-weight: 400;
    color: #9899A4;
    line-height: 1.4;
    margin-top: 2px;
}

.fmp-rig-card-actions {
    flex-shrink: 0;
    margin-left: auto;
}

.fmp-rig-primary-label {
    display: inline-flex;
    align-items: center;
    height: 26px;
    padding: 0 12px;
    border: 1px solid var(--fmp-border-blue);
    border-radius: var(--fmp-radius-modal);
    background: var(--fmp-bg-card);
    font-size: 12px;
    font-weight: 400;
    color: var(--fmp-border-blue);
    flex-shrink: 0;
}

/* Empty state */
.fmp-address-empty-text {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    text-align: center;
    margin-bottom: 24px;
    line-height: 1.5;
}

/* Add new address button */
.fmp-addr-btn-wrap {
    display: flex;
    justify-content: stretch;
    gap: 16px;
    margin-top: 8px;
}

.fmp-add-address-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 44px;
    padding: 0 24px;
    background: var(--fmp-orange);
    color: var(--fmp-white) !important;
    border: 1.5px solid var(--fmp-orange);
    border-radius: var(--fmp-radius-btn);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none !important;
    transition: background 0.2s;
    line-height: 1;
    flex: 1;
}

.fmp-add-address-btn:hover {
    background: var(--fmp-orange-dark);
    color: var(--fmp-white) !important;
}

/* Address form actions — equal-width Cancel + Save */
.fmp-addr-form-actions {
    margin-top: 40px !important;
    display: flex !important;
    gap: 16px !important;
}

/* Billing address modal — tighter gap above actions (Figma) */
.fmp-modal-body .fmp-address-form .fmp-addr-form-actions {
    margin-top: 24px !important;
}

.fmp-modal-body .fmp-custom-field {
    margin-bottom: 24px;
}

.fmp-modal-body .fmp-settings-password-actions {
    margin-top: 24px;
}

.fmp-modal-body .fmp-settings-password-actions .fmp-custom-submit-btn,
.fmp-addr-form-actions .fmp-custom-submit-btn {
    flex: 1;
    width: auto;
}

.fmp-modal-confirm-text {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    margin-bottom: 32px;
    line-height: 1.6;
}

.fmp-modal-confirm-actions {
    display: flex;
    gap: 16px;
    justify-content: stretch;
    align-items: stretch;
}

/* Add to list / Add to rig — equal primary + secondary (avoid w-50 vs flex + width:100% conflicts) */
#add-to-list-modal .fmp-modal-confirm-actions .fmp-custom-submit-btn,
#add-to-list-modal .fmp-modal-confirm-actions .fmp-settings-cancel-btn,
#add-to-rig-modal .fmp-modal-confirm-actions .fmp-custom-submit-btn,
#add-to-rig-modal .fmp-modal-confirm-actions .fmp-settings-cancel-btn {
    flex: 1;
    width: auto;
    min-width: 0;
    margin-top: 0;
    padding: 0 24px;
    box-sizing: border-box;
}

.fmp-add-to-list-modal-footer {
    padding-top: 0 !important;
}

.fmp-modal-confirm-btn {
    flex: 1;
}

.fmp-modal-confirm-delete-btn {
    background: var(--fmp-error) !important;
    color: var(--fmp-white) !important;
    border: 1.5px solid var(--fmp-error) !important;
    border-radius: var(--fmp-radius-btn) !important;
    height: 44px;
    font-size: 14px !important;
    font-weight: 500 !important;
    cursor: pointer;
    transition: background 0.2s;
}

.fmp-modal-confirm-delete-btn:hover {
    background: var(--fmp-error-dark) !important;
    border-color: var(--fmp-error-dark) !important;
    color: var(--fmp-white) !important;
}

/* ==========================================================
   CHECKOUT — Delivery Address, Payment (6082-179982, 6082-181137, 6082-180040)
   ========================================================== */

.fmp-checkout-card .card-body {
    padding: 32px;
}

.fmp-checkout-card .fmp-custom-title {
    margin-bottom: 8px;
}

.fmp-checkout-card .fmp-custom-subtitle {
    margin-bottom: 24px;
}

.fmp-checkout-section {
    margin-bottom: 24px;
}

.fmp-checkout-add-link {
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-orange);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    text-decoration: none;
}

.fmp-checkout-add-link:hover {
    color: var(--fmp-orange-dark);
    text-decoration: underline;
}

.fmp-checkout-add-link i {
    margin-right: 4px;
}

.fmp-checkout-option-selected {
    border-color: rgba(56, 121, 200, 0.6) !important;
    background: rgba(56, 121, 200, 0.04) !important;
}

.fmp-checkout-empty-state {
    display: flex;
    flex-direction: column;
    padding: 20px;
    border: 1.5px solid rgba(56, 121, 200, 0.3);
    border-radius: 16px;
}

.fmp-checkout-empty-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--fmp-text-gray);
}

.fmp-checkout-empty-desc {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-light);
    margin-top: 4px;
}

.fmp-checkout-add-card-section {
    padding: 24px;
    border: 1.5px solid rgba(56, 121, 200, 0.3);
    border-radius: 16px;
}

.fmp-checkout-add-card-section .fmp-email-section-title {
    margin-bottom: 20px;
}

/* ==========================================================
   CHECKOUT — Full redesign (6082-162165)
   ========================================================== */

/* Section card (white pill card) */
.fmp-checkout-section-card {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    padding: 32px 48px 48px;
    margin-bottom: 24px;
    border: none;
    box-shadow: none;
}

/* Address tile list */
.fmp-checkout-address-list {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 24px;
}

/* Individual address tile */
.fmp-checkout-address-tile {
    border: 1px solid var(--fmp-border);
    border-radius: var(--fmp-radius-modal);
    padding: 16px;
    background: var(--fmp-white);
    cursor: pointer;
    width: 294px;
    flex-shrink: 0;
    transition: border-color 0.2s, background 0.2s;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fmp-checkout-address-tile.option.bg-gray-200,
.fmp-checkout-address-tile.fmp-checkout-option-selected {
    border-color: rgba(56, 121, 200, 0.6) !important;
    background: rgba(56, 121, 200, 0.04) !important;
}

.fmp-checkout-address-tile-name {
    font-size: 18px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

.fmp-checkout-address-tile-addr {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    line-height: 1.6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Bank Card inputs panel */
.fmp-checkout-bank-card-box {
    border: 1.5px solid rgba(56, 121, 200, 0.3);
    border-radius: 16px;
    padding: 20px 20px 32px;
    width: 100%;
}

.fmp-checkout-bank-card-title {
    font-size: 18px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin-bottom: 16px;
}

/* Horizontal row of card inputs */
.fmp-checkout-card-input-row {
    display: flex;
    gap: 16px;
    align-items: flex-end;
}

.fmp-checkout-card-input-row .fmp-custom-field {
    flex: 1;
    margin-bottom: 0;
}

.fmp-checkout-card-input-row .fmp-custom-field--250 {
    flex: 0 0 250px;
    width: 250px;
}

/* Gray border inputs (inside checkout bank card) */
.fmp-checkout-bank-card-box .fmp-custom-input {
    border-color: var(--fmp-border) !important;
}

.fmp-checkout-bank-card-box .fmp-custom-input:focus {
    border-color: rgba(56, 121, 200, 0.4) !important;
}

/* Billing-same-as-delivery checkbox row */
.fmp-checkout-billing-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 32px;
    cursor: pointer;
}

.fmp-checkout-billing-checkbox input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 24px;
    height: 24px;
    min-width: 24px;
    border-radius: 4px;
    background: var(--fmp-white);
    border: 1.5px solid var(--fmp-border);
    flex-shrink: 0;
    cursor: pointer;
    position: relative;
    transition: background 0.2s, border-color 0.2s;
}

.fmp-checkout-billing-checkbox input[type="checkbox"]:checked {
    background: var(--fmp-blue);
    border-color: var(--fmp-blue);
}

.fmp-checkout-billing-checkbox input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 7px;
    top: 3px;
    width: 6px;
    height: 10px;
    border: 2px solid var(--fmp-white);
    border-top: none;
    border-left: none;
    transform: rotate(45deg);
}

.fmp-checkout-billing-checkbox-label {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    line-height: 1.6;
    cursor: pointer;
}

/* Confirm Order button */
.fmp-checkout-confirm-btn {
    background: var(--fmp-orange);
    color: var(--fmp-white) !important;
    border: none !important;
    border-radius: var(--fmp-radius-btn);
    height: 44px;
    width: 405px;
    max-width: 100%;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    transition: background 0.2s;
}

.fmp-checkout-confirm-btn:hover {
    background: var(--fmp-orange-dark);
    color: var(--fmp-white) !important;
}

/* Summary card */
.fmp-checkout-summary-card {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    padding: 40px 32px;
}

/* Bootstrap .sticky-top ships with z-index:1020, which puts the summary card
   above the mini-cart dropdown (z-index:1000). Override to let the cart show. */
.fmp-checkout-summary-card.sticky-top {
    z-index: 100;
}

.fmp-checkout-summary-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin: 0 0 24px;
}

.fmp-checkout-summary-rows {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 20px;
}

.fmp-checkout-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

.fmp-checkout-summary-row--discount {
    color: var(--fmp-error);
}

.fmp-checkout-summary-divider {
    height: 1px;
    background: var(--fmp-border);
    margin: 0 0 20px;
    border: none;
}

.fmp-checkout-summary-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin-bottom: 24px;
}

/* "Back to Cart" outlined button */
.fmp-checkout-back-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    border-radius: var(--fmp-radius-btn);
    border: 1.5px solid var(--fmp-orange) !important;
    background: transparent !important;
    color: var(--fmp-orange) !important;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none !important;
    width: 100%;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s;
}

.fmp-checkout-back-btn:hover {
    color: var(--fmp-orange-dark) !important;
    border-color: var(--fmp-orange-dark) !important;
    background: transparent !important;
}

/* Responsive checkout */
@media (max-width: 991px) {
    .fmp-checkout-section-card {
        padding: 24px 20px 32px;
        border-radius: var(--fmp-radius-modal);
        margin-bottom: 16px;
    }

    .fmp-checkout-address-tile {
        width: 100%;
    }

    .fmp-checkout-card-input-row {
        flex-direction: column;
        align-items: stretch;
    }

    .fmp-checkout-card-input-row .fmp-custom-field--250 {
        flex: 1;
        width: 100%;
    }

    .fmp-checkout-confirm-btn {
        width: 100%;
    }

    .fmp-checkout-summary-card {
        padding: 28px 20px;
        border-radius: var(--fmp-radius-modal);
        margin-top: 0;
    }
}

/* ==========================================================
   SETTINGS — My Addresses (7790-140658)
   ========================================================== */

.fmp-addresses-card .fmp-custom-title {
    margin-bottom: 32px;
}

.fmp-addresses-section {
    margin-bottom: 0;
}

.fmp-addresses-section .fmp-email-section-title {
    margin-bottom: 16px;
}

.fmp-addresses-hr {
    border-color: rgba(56, 121, 200, 0.3);
    margin: 32px 0;
}

.fmp-addresses-list {
    margin-bottom: 0;
}

.fmp-addresses-add-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    padding: 0 24px;
    text-decoration: none;
    margin-top: 16px;
}

@media (max-width: 576px) {
    .fmp-addresses-add-btn {
        width: 100% !important;
    }
}

.fmp-address-line {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    max-width: 100%;
}

@media (min-width: 576px) {
    .fmp-addresses-list .address_col {
        max-width: 50%;
    }
}

.fmp-cart-page {
    background: var(--fmp-bg);
    color: var(--fmp-text-dark);
    .splide__arrow {
        background-color: transparent !important;
        border: none !important;
    }
}

@media (max-width: 991.98px) {
    .fmp-cart-grid {
        display: flex;
        flex-direction: column;
    }

    .fmp-cart-col-summary {
        order: 1;
    }

    .fmp-cart-col-main {
        order: 2;
    }
}

@media (max-width: 1200px) {
    .fmp-cart-item-mobile__buttons {
        display: block !important;
    }
}


.fmp-cart-container {
    max-width: 1500px;
}

.fmp-cart-panel {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    box-shadow: 0 12px 40px rgba(40, 42, 54, 0.06);
    border: 1px solid var(--fmp-border);
}

.fmp-cart-panel--main {
    padding: 0 0 24px;
}

.fmp-cart-panel--summary {
    padding: 32px;
}

.fmp-cart-panel-head {
    border-bottom: 1px solid var(--fmp-border);
    padding: 24px 32px 16px;
}

.fmp-cart-rows {
    padding: 0 24px;
    overflow-y: auto !important;
    max-height: 400px !important;
}

.fmp-cart-voucher {
    padding: 12px 32px 24px !important;
}

.fmp-cart-page-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--fmp-text-dark);
}

.fmp-cart-item-count-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--fmp-text-gray);
    text-transform: capitalize;
}

.fmp-cart-rows-min {
    min-height: 120px;
}

.fmp-cart-item {
    border-bottom: 1px solid var(--fmp-border);
}

.fmp-cart-item:last-child {
    border-bottom: none;
}

.fmp-cart-item-thumb {
    width: 64px;
    height: 64px;
    border-radius: 8px;
    overflow: hidden;
    display: block;
    background: var(--fmp-bg-card);
}

.fmp-cart-item-thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.fmp-cart-item-thumb--sm {
    width: 56px;
    height: 56px;
}

.fmp-cart-item-title {
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.35;
}

.fmp-cart-item-title--sm {
    font-size: 0.9375rem;
}

.fmp-cart-item-subtitle,
.fmp-summary-muted {
    font-size: 0.875rem;
    color: var(--fmp-text-gray);
}

.fmp-cart-item-line-total {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--fmp-text-dark);
}

.fmp-cart-item-delete,
.fmp-cart-item-delete i {
    font-size: 1.35rem;
    color: var(--fmp-text-gray);
    line-height: 1;
}

.fmp-cart-item-delete:hover,
.fmp-cart-item-delete:focus {
    color: var(--fmp-orange);
}

.fmp-qty-btn {
    min-width: 24px !important;
    min-height: 24px !important;
    max-width: 32px !important;
    max-height: 32px !important;
    border-radius: 50%;
    border: none;
    background: var(--fmp-text-light);
    color: var(--fmp-white);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: background 0.15s ease, transform 0.1s ease;

    i {
        color: var(--fmp-white) !important;
        font-size: 18px !important;
    }
}

.fmp-qty-btn i {
    font-size: 1.1rem;
    line-height: 1;
}

.fmp-qty-btn:hover {
    background: #9b9cac;
}

.fmp-qty-value {
    min-width: 2rem;
    text-align: center;
    font-weight: 600;
    font-size: 1rem;
    color: var(--fmp-text-dark);
}

.fmp-cart-item-qty {
    gap: 0.35rem;
}

.fmp-cart-mobile-delete-label {
    font-size: 0.875rem;
    font-weight: 600;
    color: #F36343;
}

.fmp-cart-empty {
    padding: 2.5rem 1.5rem;
}

.fmp-cart-empty-title {
    font-size: 1.125rem;
    font-weight: 400;
    color: var(--fmp-text-dark);
}

.fmp-cart-voucher .fmp-voucher-input {
    border-radius: 24px;
    border: 1.5px solid #ebedf3 !important;
    background: var(--fmp-white);
    min-height: 44px;
    padding-left: 1rem;
    padding-right: 1rem;
    font-size: 0.875rem;
    color: var(--fmp-text-dark);
}

.fmp-cart-voucher .fmp-voucher-input::placeholder {
    color: var(--fmp-text-gray);
}

.fmp-cart-voucher #apply_voucher_form_btn.btn.fmp-btn-outline-accent,
.fmp-cart-voucher #remove_voucher_form_btn.btn.fmp-btn-outline-accent {
    border-radius: var(--fmp-radius-btn) !important;
    min-height: 44px;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.5;
    border-width: 1.5px !important;
    width: auto;
    flex-shrink: 0;
}

.fmp-cart-summary-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

.fmp-summary-list {
    gap: 0;
}

.fmp-summary-row {
    padding-top: 0.625rem !important;
    padding-bottom: 0.625rem !important;
}

.fmp-summary-label {
    color: var(--fmp-text-dark);
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.5;
}

.fmp-summary-value {
    color: var(--fmp-text-dark);
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.5;
    text-align: right;
}

.fmp-summary-voucher-code {
    color: var(--fmp-text-gray);
    font-size: 0.875rem;
}

.fmp-summary-hr {
    border-color: var(--fmp-border);
}

.fmp-summary-discount {
    color: #E01B2A;
    font-weight: 600;
}

.fmp-cart-total-label {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

.fmp-cart-total-value {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

.fmp-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    padding: 0 1.5rem;
    border-radius: var(--fmp-radius-btn);
    font-weight: 600;
    font-size: 0.9375rem;
    text-decoration: none !important;
    border: 1px solid transparent;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
    cursor: pointer;
}

.fmp-btn-primary {
    background: var(--fmp-orange);
    border-color: var(--fmp-orange);
    color: var(--fmp-white) !important;
}

.fmp-btn-primary:hover {
    background: var(--fmp-orange-dark);
    border-color: var(--fmp-orange-dark);
    color: var(--fmp-white) !important;
}

.fmp-btn-outline,
.fmp-btn-outline-accent {
    background: var(--fmp-white);
    border-color: var(--fmp-orange);
    color: var(--fmp-orange) !important;
}

.fmp-btn-outline:hover,
.fmp-btn-outline-accent:hover {
    background: rgba(246, 126, 7, 0.08);
    color: var(--fmp-orange) !important;
}

.fmp-checkout-proceed-disabled {
    background: var(--fmp-text-light) !important;
    border-color: var(--fmp-text-light) !important;
    color: var(--fmp-white) !important;
    opacity: 1;
    cursor: not-allowed;
    pointer-events: none;
}

.fmp-checkout-proceed-disabled:hover {
    background: var(--fmp-text-light) !important;
    border-color: var(--fmp-text-light) !important;
    color: var(--fmp-white) !important;
}

.fmp-cart-breadcrumb__list {
    font-size: 14px;
    line-height: 1.5;
}

.fmp-cart-breadcrumb__item {
    color: var(--fmp-text-gray);
}

.fmp-cart-breadcrumb__item.active {
    color: var(--fmp-text-dark);
    font-weight: 500;
}

.fmp-cart-breadcrumb__link {
    color: var(--fmp-border-blue);
    text-decoration: none;
}

.fmp-cart-breadcrumb__link:hover {
    color: var(--fmp-blue-dark);
    text-decoration: underline;
}

.fmp-cart-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    content: ">";
    color: var(--fmp-text-gray);
    padding-right: 0.35rem;
}

.fmp-cart-desktop-delete-label {
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-error);
    text-decoration: none;
    white-space: nowrap;
}

.fmp-cart-desktop-delete:hover .fmp-cart-desktop-delete-label,
.fmp-cart-desktop-delete:focus .fmp-cart-desktop-delete-label {
    text-decoration: underline;
    color: var(--fmp-error);
}

/* Suggested carousel */
.fmp-suggested-wrap {
    position: relative;
    margin-top: 0.5rem;
    /* Extra horizontal space for the out-of-bounds arrows (44px arrow + 12px gap) */
    padding-left: 64px;
    padding-right: 64px;
}

.fmp-suggested-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

/* Splide root: overflow visible so arrows can sit outside the track area */
.fmp-cart-suggested-splide {
    position: relative;
    overflow: visible;
}

.fmp-cart-suggested-splide .splide__arrow {
    width: 32px;
    height: 32px;
    border-radius: 0;
    background: transparent;
    border: none;
    box-shadow: none;
    opacity: 1;
    top: 50%;
    transform: translateY(-50%);
}

/* Push arrows completely outside the splide box */
.fmp-cart-suggested-splide .splide__arrow--prev {
    left: -40px;
}

.fmp-cart-suggested-splide .splide__arrow--next {
    right: -40px;
}

.fmp-cart-suggested-splide .splide__arrow:hover {
    background: transparent;
}

.fmp-cart-suggested-splide .splide__arrow svg {
    fill: var(--fmp-text-gray);
    width: 22px;
    height: 22px;
    transition: fill 0.2s;
}

.fmp-cart-suggested-splide .splide__arrow:hover svg {
    fill: var(--fmp-text-black);
}

.fmp-suggested-card.discounted-product {
    border: 1px solid var(--fmp-border);
    border-radius: var(--fmp-radius-card);
    overflow: hidden;
    background: var(--fmp-white);
    height: 100%;
}

/* Image area: white bg, consistent min-height so cards align */
.fmp-suggested-card .top-container {
    background: var(--fmp-white);
    padding: 1rem 1.25rem 0;
    min-height: 162px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.fmp-suggested-card .top-container .img-wrapper {
    height: auto !important;
    align-items: flex-end;
}

.fmp-suggested-card .top-container img {
    width: 144px;
    height: 144px;
    object-fit: contain;
    border-radius: 14px;
    display: block;
    max-height: 144px !important;
}

/* Info + button area: gray bg, top border */
.fmp-suggested-card .bottom-container {
    background: var(--fmp-bg-card);
    border-top: 1px solid var(--fmp-border);
    padding: 0.75rem 1rem 1rem;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.fmp-suggested-card .bottom-container .overlay_icon_span {
    display: none !important;
}

.fmp-suggested-card .price-container .price {
    font-size: 1.125rem !important;
    font-weight: 600 !important;
    color: var(--fmp-text-dark) !important;
    line-height: 1.5;
    margin: 0;
}

/* Crossed-out original price */
.fmp-suggested-card .price-container .price-prev {
    font-size: 0.875rem !important;
    color: var(--fmp-text-light) !important;
    text-decoration: line-through;
    margin: 0 0 0 0.25rem;
}

.fmp-suggested-card .product-name-layout .name {
    font-size: 1rem !important;
    font-weight: 400 !important;
    color: var(--fmp-text-gray) !important;
    line-height: 1.5;
    margin: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Add to Cart button: orange pill, full-width, 38px height */
.fmp-suggested-add-btn.btn-primary {
    background: var(--fmp-orange) !important;
    border-color: var(--fmp-orange) !important;
    border-radius: var(--fmp-radius-btn) !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    min-height: 38px;
    height: 38px;
    width: 100% !important;
    margin-top: auto;
}

.fmp-suggested-add-btn.btn-primary:hover {
    background: var(--fmp-orange-dark) !important;
    border-color: var(--fmp-orange-dark) !important;
}

@media (max-width: 767.98px) {
    .fmp-suggested-wrap {
        padding-left: 0;
        padding-right: 0;
    }
    .fmp-cart-suggested-splide .splide__arrows {
        display: none;
    }
}

/* Email cart modals */
.fmp-email-cart-dialog {
    max-width: 520px;
}

.fmp-email-cart-content {
    border-radius: 24px;
    border: 1px solid var(--fmp-border);
    padding: 0.5rem 0.5rem 1.5rem;
}

.fmp-email-cart-title {
    font-size: 1.375rem;
    font-weight: 600;
    color: var(--fmp-text-dark);
}

.fmp-email-cart-intro {
    font-size: 0.9375rem;
    color: var(--fmp-text-gray);
    line-height: 1.5;
}

.fmp-email-cart-label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--fmp-text-dark);
    margin-bottom: 0.35rem;
}

.fmp-email-cart-input,
.fmp-email-cart-textarea {
    border-radius: var(--fmp-radius-btn);
    border: 1px solid var(--fmp-border) !important;
    background: var(--fmp-white);
    min-height: 48px;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

.fmp-email-cart-textarea {
    border-radius: var(--fmp-radius-modal) !important;
    min-height: 120px;
    padding-top: 0.75rem;
    resize: vertical;
}

.fmp-email-cart-actions .fmp-btn {
    width: auto;
    min-width: 120px;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
}

.fmp-email-success-icon {
    font-size: 3.5rem;
    color: var(--fmp-orange);
    line-height: 1;
}

.fmp-email-success-text {
    font-size: 0.9375rem;
    color: var(--fmp-text-gray);
    line-height: 1.5;
    max-width: 26rem;
    margin-left: auto;
    margin-right: auto;
}

.fmp-email-success-email {
    font-weight: 600;
    color: var(--fmp-text-dark);
}

.fmp-email-success-ok {
    min-width: 150px;
}

/* Scroll-to-top button */

.ri-arrow-down-s-line {
    color: var(--fmp-orange) !important;
}

/* ---- Floating help button ---- */
.fmp-floating-help-btn {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--fmp-orange);
    border: none;
    display: none;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 1050;
    box-shadow: 0 4px 16px rgba(246, 126, 7, 0.35);
    text-decoration: none !important;
    transition: background 0.2s ease, box-shadow 0.2s ease;

    @media (max-width: 991.98px) {
        display:flex !important;
    }
}

.fmp-floating-help-btn:hover {
    background: var(--fmp-orange-dark);
    box-shadow: 0 6px 20px rgba(246, 126, 7, 0.45);
}

.fmp-floating-help-btn i {
    font-size: 22px;
    color: #fff !important;
    line-height: 1;
}
/* ---- Homepage section headings — responsive refinements ---- */
@media (max-width: 575.98px) {
    .home-bottom-banner h2.promotion-discount-type-title {
        font-size: 16px !important;
    }
}

.subheader-breadcrumb {
    --bs-breadcrumb-divider-color: var(--fmp-blue-dark);
}

.subheader-breadcrumb ol.breadcrumb {
    gap: 8px;
    align-items: center;
    font-family: var(--fmp-font);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    text-transform: capitalize;
    font-feature-settings: 'liga' off, 'clig' off;
}

.subheader-breadcrumb .breadcrumb-item {
    margin-left: 0 !important;
}

.subheader-breadcrumb .breadcrumb-item span {
    margin-left: 0 !important;
}

.subheader-breadcrumb .breadcrumb-item + .breadcrumb-item {
    padding-left: 0 !important;
}

.subheader-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    float: none !important;
    padding-left: 0 !important;
    padding-right: 8px !important;
    color: var(--fmp-blue-dark) !important;
    font-weight: 500;
}

.subheader-breadcrumb .breadcrumb-item:not(.active) a {
    color: var(--fmp-blue-dark) !important;
    font-weight: 500;
}

.subheader-breadcrumb .breadcrumb-item:not(.active) a:hover {
    color: var(--fmp-blue-darker, #0C265F) !important;
}

.subheader-breadcrumb .breadcrumb-item.active,
.subheader-breadcrumb .breadcrumb-item.active span,
.subheader-breadcrumb .breadcrumb-item.active a {
    color: var(--fmp-text-gray) !important;
    font-weight: 500;
}

.subheader-breadcrumb .breadcrumb-item.active a {
    text-decoration: none !important;
}

.fmp-settings-breadcrumb-inner {
    margin-bottom: 24px;
}

@media (min-width: 992px) {
    .fmp-settings-breadcrumb-inner {
        margin-bottom: 32px;
    }
}

.fmp-settings-breadcrumb-inner.subheader-breadcrumb > ol {
    padding-top: 0;
    padding-bottom: 0;
}

/* ================================================================
   My Account — Sidebar (fmp-account-sidebar)
   ================================================================ */
.fmp-account-sidebar {
    width: 220px;
    min-width: 220px;
    flex-shrink: 0;
    background: var(--fmp-white);
    border-right: 1px solid var(--fmp-border);
    padding-top: 28px;
    padding-bottom: 32px;
    align-self: stretch;
    min-height: 750px;
}

.fmp-account-sidebar-title {
    padding: 0 24px;
    margin-bottom: 4px;
    font-size: 18px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

.fmp-account-sidebar-nav {
    display: flex;
    flex-direction: column;
}

.fmp-account-sidebar-item {
    padding: 4px 8px;
}

.fmp-account-sidebar-link {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    width: 100%;
    border-radius: 10px;
    padding-left: 16px;
    padding-right: 16px;
    color: var(--fmp-text-dark);
    font-size: 14px;
    text-decoration: none !important;
    line-height: 1.6;
    transition: background 0.15s ease, color 0.15s ease, border-radius 0.15s ease;
}

.fmp-account-sidebar-link:hover {
    color: var(--fmp-blue);
    background: #F2F7FB;
    text-decoration: none !important;
}

.fmp-account-sidebar-link.active {
    background: #F2F7FB;
    color: var(--fmp-blue);
    border-radius: var(--fmp-radius-modal);
}

.fmp-account-sidebar-link i {
    font-size: 20px;
    flex-shrink: 0;
    line-height: 1;
    color: currentColor;
}

/* ================================================================
   My Account — Layout wrapper
   ================================================================ */
.fmp-account-layout {
    display: flex;
    align-items: stretch;
    margin-left: -15px;
    margin-right: -15px;
    min-height: calc(100vh - 88px);
}

.fmp-account-layout > .fmp-account-sidebar {
    min-height: calc(100vh - 88px);
}

.fmp-account-content-area {
    flex: 1;
    min-width: 0;
    padding: 40px 32px 64px;
}

/* ================================================================
   My Orders — Main card & order cards
   ================================================================ */
.fmp-orders-main-card {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    padding: 32px 48px 48px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.fmp-orders-title {
    padding: 0 20px;
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin: 0;
}

.fmp-order-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.fmp-order-list-group {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* Collapsed/header card */
.fmp-order-header-card {
    background: var(--fmp-white);
    border: 1px solid var(--fmp-border);
    border-radius: var(--fmp-radius-modal);
    padding: 16px 16px 20px 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    cursor: pointer;
    user-select: none;
}

.fmp-order-header-card.fmp-order-header-card--open {
    background: var(--fmp-bg-card);
}

.fmp-order-top-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.fmp-order-meta {
    display: flex;
    align-items: baseline;
    gap: 16px;
    flex-wrap: wrap;
}

.fmp-order-nr {
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-text-dark);
    white-space: nowrap;
}

.fmp-order-tags {
    display: flex;
    align-items: center;
    gap: 8px;
}

.fmp-order-tag {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 12px;
    border-radius: 1000px;
    background: var(--fmp-white);
    font-size: 14px;
    color: var(--fmp-text-gray);
    white-space: nowrap;
    line-height: 1.6;
}

.fmp-order-tag--gray {
    background: var(--fmp-bg);
}

.fmp-order-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 16px;
    border-radius: var(--fmp-radius-modal);
    border: 1px solid var(--fmp-border-blue);
    font-size: 14px;
    color: var(--fmp-text-dark);
    opacity: 0.8;
    white-space: nowrap;
    flex-shrink: 0;
}

.fmp-order-status--cancelled,
.fmp-order-status--failed {
    border-color: var(--fmp-error);
}

.fmp-order-status--processing {
    border-color: var(--fmp-orange);
}

.fmp-order-amount {
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

.fmp-order-bottom-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

.fmp-order-date {
    flex: 1;
    font-size: 12px;
    color: var(--fmp-text-gray);
    line-height: 1.5;
}

.fmp-order-chevron {
    font-size: 20px;
    color: var(--fmp-text-dark) !important;
    flex-shrink: 0;
    transition: transform 0.2s ease;
    display: block;
}

.fmp-order-header-card[aria-expanded="true"] .fmp-order-chevron {
    transform: rotate(180deg);
}

/* Expanded order panel */
.fmp-order-expanded-panel {
    background: var(--fmp-bg-card);
    border-radius: var(--fmp-radius-modal);
    padding: 20px 20px 32px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: flex-end;
}

.fmp-order-reorder-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 44px;
    padding: 0 16px;
    border-radius: var(--fmp-radius-btn);
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-orange);
    text-decoration: none !important;
    background: transparent;
    border: none;
    cursor: pointer;
    width: 100%;
}

.fmp-order-reorder-btn:hover {
    color: var(--fmp-orange-dark);
    text-decoration: none !important;
}

/* PO number box */
.fmp-order-po-box {
    width: 100%;
    border: 1.5px solid rgba(56, 121, 200, 0.3);
    border-radius: 12px;
    padding: 16px 20px 20px;
}

.fmp-order-po-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--fmp-text-gray);
    padding: 0 16px;
    margin-bottom: 4px;
}

.fmp-order-po-input-row {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    flex-wrap: wrap;
}

.fmp-order-po-input-wrap {
    flex: 1;
    min-width: 200px;
    max-width: 408px;
    position: relative;
}

.fmp-order-po-input {
    border: 1.5px solid rgba(56, 121, 200, 0.3) !important;
    border-radius: 24px !important;
    height: 44px;
    padding: 0 36px 0 16px !important;
    font-size: 14px;
    color: var(--fmp-text-dark);
    width: 100%;
    background: transparent;
    box-shadow: none !important;
}

.fmp-order-po-input:focus {
    border-color: rgba(56, 121, 200, 0.6) !important;
    outline: none;
    box-shadow: none !important;
}

.fmp-order-po-edit-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    color: var(--fmp-text-gray);
    pointer-events: none;
}

.fmp-order-po-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.fmp-order-save-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    padding: 0 20px;
    border-radius: var(--fmp-radius-btn);
    font-size: 14px;
    font-weight: 500;
    background: var(--fmp-orange);
    color: var(--fmp-white);
    border: none;
    cursor: pointer;
    white-space: nowrap;
}

.fmp-order-save-btn:hover {
    background: var(--fmp-orange-dark);
    color: var(--fmp-white);
}

.fmp-order-cancel-form-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    padding: 0 20px;
    border-radius: var(--fmp-radius-btn);
    font-size: 14px;
    font-weight: 500;
    background: transparent;
    color: var(--fmp-orange);
    border: 1.5px solid var(--fmp-orange);
    cursor: pointer;
    white-space: nowrap;
}

.fmp-order-cancel-form-btn:hover {
    background: rgba(246, 126, 7, 0.08);
}

/* Info panels (Delivery / Billing / Payment) */
.fmp-order-info-sections {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.fmp-order-info-row {
    display: flex;
    gap: 16px;
}

.fmp-order-info-panel {
    flex: 1;
    border: 1px solid rgba(56, 121, 200, 0.3);
    border-radius: 12px;
    padding: 16px 20px 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fmp-order-info-panel-title {
    font-size: 18px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin: 0;
}

.fmp-order-info-sub-label {
    font-size: 12px;
    color: var(--fmp-text-gray);
    line-height: 1.5;
    margin: 0;
}

.fmp-order-info-sub-value {
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-text-dark);
    line-height: 1.5;
    margin: 0;
}

.fmp-order-info-addr-label {
    font-size: 12px;
    color: var(--fmp-text-gray);
    line-height: 1.5;
    margin: 0;
}

.fmp-order-address-pin {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-text-dark);
    line-height: 1.5;
}

.fmp-order-address-pin i {
    font-size: 16px;
    flex-shrink: 0;
    color: var(--fmp-text-dark);
}

.fmp-order-info-addr-text {
    font-size: 14px;
    color: var(--fmp-text-dark);
    line-height: 1.6;
    margin: 0;
}

/* Payment method row */
.fmp-order-payment-method-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.fmp-order-payment-name {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-text-dark);
}

.fmp-order-payment-name i {
    font-size: 16px;
    color: var(--fmp-text-dark);
}

/* Product list */
.fmp-order-products {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
}

.fmp-order-product-row {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding-right: 8px;
}

.fmp-order-product-img {
    width: 64px;
    height: 64px;
    border-radius: 8px;
    box-shadow: 0 0 0 1px #B5B5C3;
    object-fit: cover;
    flex-shrink: 0;
}

.fmp-order-product-info {
    flex: 1;
    min-width: 0;
}

.fmp-order-product-name-row {
    display: flex;
    align-items: flex-start;
    gap: 4px;
}

.fmp-order-product-name {
    flex: 1;
    font-size: 16px;
    color: var(--fmp-text-dark);
    line-height: 1.6;
}

.fmp-order-product-price {
    font-size: 14px;
    font-weight: 500;
    color: var(--fmp-text-dark);
    white-space: nowrap;
    flex-shrink: 0;
    text-align: right;
}

.fmp-order-product-qty {
    font-size: 16px;
    color: var(--fmp-text-gray);
    line-height: 1.6;
}

.fmp-order-divider {
    border: none;
    border-top: 0.5px solid rgba(56, 121, 200, 0.3);
    margin: 0;
    width: 100%;
}

/* Order totals */
.fmp-order-totals {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    width: 100%;
}

.fmp-order-total-row {
    display: flex;
    align-items: baseline;
    width: 260px;
}

.fmp-order-total-label {
    flex: 1;
    font-size: 14px;
    color: var(--fmp-text-dark);
    line-height: 1.6;
}

.fmp-order-total-value {
    flex: 1;
    font-size: 16px;
    color: var(--fmp-text-dark);
    text-align: right;
    line-height: 1.6;
}

.fmp-order-total-row--bold .fmp-order-total-label,
.fmp-order-total-row--bold .fmp-order-total-value {
    font-weight: 500;
    font-size: 14px;
    line-height: 1.5;
}

/* Responsive adjustments */
@media (max-width: 991.98px) {
    .fmp-account-sidebar {
        display: none;
    }

    .fmp-account-layout {
        margin-left: 0;
        margin-right: 0;
    }

    .fmp-account-content-area {
        padding: 20px 0 40px;
    }

    .fmp-orders-main-card {
        border-radius: 16px;
        padding: 20px 16px 32px;
        gap: 20px;
    }

    .fmp-orders-title {
        font-size: 20px;
        padding: 0 8px;
    }

    .fmp-order-info-row {
        flex-direction: column;
    }

    .fmp-order-total-row {
        width: 100%;
    }

    .fmp-order-po-input-wrap {
        flex: 1 1 100%;
        max-width: 100%;
    }
}


/* ================================================================
   Promotion Banner (Daily Deals) – FMP redesign
   ================================================================ */
.fmp-promo-banner {
    display: flex;
    min-height: 269px;
    border-radius: var(--fmp-radius-card);
    border: 1.5px solid var(--fmp-border);
    overflow: hidden;
    width: 100%;
}

@media only screen and (min-width: 992px) {
    .fmp-promo-banner {
        min-height: 360px;
    }
}

/* LEFT dark section */
.fmp-promo-left {
    background: #0C265F;
    width: 40%;
    max-width: 547px;
    min-width: 240px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    padding: 52px 10px 53px 48px;
}

@media only screen and (min-width: 992px) {
    .fmp-promo-left {
        width: 547px;
        min-width: 547px;
    }
}

.fmp-promo-left-inner {
    display: flex;
    flex-direction: column;
    gap: 28px;
    width: 100%;
}

.fmp-promo-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--fmp-error);
    color: var(--fmp-white) !important;
    font-size: 16px;
    font-weight: 500;
    padding: 10px 22px;
    border-radius: 300px;
    text-decoration: none !important;
    width: fit-content;
    line-height: 1.5;
}

.fmp-promo-text-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fmp-promo-heading-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.fmp-promo-heading {
    color: var(--fmp-teal) !important;
    font-size: 36px;
    font-weight: 600;
    margin: 0;
    line-height: 1.4;
}

.fmp-promo-flash {
    color: var(--fmp-teal);
    font-size: 32px;
    flex-shrink: 0;
}

.fmp-promo-subtitle {
    color: var(--fmp-white);
    font-size: 18px;
    font-weight: 400;
    margin: 0;
    line-height: 1.5;
}

.fmp-promo-shop-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--fmp-orange);
    color: var(--fmp-white) !important;
    font-size: 14px;
    font-weight: 500;
    padding: 10px 16px 10px 24px;
    border-radius: var(--fmp-radius-btn);
    text-decoration: none !important;
    width: fit-content;
    line-height: 1.5;
    transition: background 0.18s;
}

.fmp-promo-shop-btn:hover {
    background: var(--fmp-orange-dark);
}

.fmp-promo-shop-btn i {
    font-size: 20px;
}

/* RIGHT white section */
.fmp-promo-right {
    flex: 1;
    background: var(--fmp-white);
    display: flex;
    align-items: center;
    padding: 32px 48px 32px 64px;
    min-width: 0;
}

.fmp-promo-right-inner {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 100%;
}

.fmp-promo-img-wrap {
    flex-shrink: 0;
    width: 220px;
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: var(--fmp-radius-card);
    overflow: hidden;
}

@media only screen and (min-width: 992px) {
    .fmp-promo-img-wrap {
        width: 293px;
        height: 293px;
    }
}

.fmp-promo-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.fmp-promo-content {
    flex: 1;
    min-width: 0;
}

.fmp-promo-desc {
    color: var(--fmp-text-gray);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.7;
}

/* Product specs list */
.fmp-promo-specs {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.fmp-promo-specs li {
    display: flex;
    align-items: center;
    gap: 48px;
    font-size: 18px;
    line-height: 1.5;
}

.fmp-promo-spec-label {
    color: var(--fmp-text-gray);
    font-weight: 400;
    min-width: 80px;
    position: relative;
    padding-left: 22px;
}

.fmp-promo-spec-label::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--fmp-text-gray);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.fmp-promo-spec-val {
    color: var(--fmp-text-dark);
    font-weight: 600;
}

/* Carousel – desktop fixed height so all slides are equal */
.fmp-banner-carousel {
    position: relative;
}

@media only screen and (min-width: 992px) {
    .fmp-banner-carousel {
        height: 360px;
    }

    .fmp-banner-carousel .carousel-inner,
    .fmp-banner-carousel .carousel-item {
        height: 100%;
    }

    .fmp-banner-carousel .carousel-item .fmp-promo-banner {
        height: 100%;
        min-height: 0;
    }
}

/* Mobile-only "Shop Now" button (below white card) */
.fmp-promo-shop-btn--bottom {
    display: none;
}

/* Desktop/tablet "Shop Now" button (inside dark section) */
.fmp-promo-shop-btn--top {
    display: inline-flex;
}

/* Bootstrap 5 carousel-indicators styled as FMP dots */
.fmp-carousel-dots {
    position: absolute !important;
    bottom: 20px !important;
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    transform: translateX(-50%) !important;
    display: flex !important;
    align-items: center;
    gap: 6px;
    padding: 0 !important;
    margin: 0 !important;
    z-index: 10;
    width: auto !important;
}

/* Override Bootstrap 5 default 30px×3px rectangle indicators */
.fmp-carousel-dots button,
.fmp-carousel-dots [data-bs-target] {
    width: 8px !important;
    min-width: 8px !important;
    max-width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: var(--fmp-text-light) !important;
    background-clip: unset !important;
    cursor: pointer;
    border: none !important;
    padding: 0 !important;
    flex: none !important;
    flex-shrink: 0;
    opacity: 1 !important;
    transition: background 0.2s, transform 0.2s;
    text-indent: -9999px;
    overflow: hidden;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.fmp-carousel-dots button.active,
.fmp-carousel-dots button[aria-current="true"] {
    background: var(--fmp-text-black) !important;
    transform: scale(1.2);
    opacity: 1 !important;
}

/* Section title + See All link */
.promotion-title-container {
    padding: 0 0 4px;
}

.fmp-see-all-link {
    color: var(--fmp-orange) !important;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none !important;
    white-space: nowrap;
    gap: 0;
}

.fmp-see-all-link i {
    font-size: 20px;
    color: var(--fmp-orange) !important;
    line-height: 1;
}

/* ---- Tablet (768-991px) ---- */
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .fmp-promo-banner {
        border-radius: var(--fmp-radius-modal);
        min-height: 269px;
    }

    .fmp-promo-left {
        width: 237px;
        min-width: 200px;
        padding: 24px 20px 24px 28px;
    }

    .fmp-promo-left-inner {
        gap: 24px;
    }

    .fmp-promo-badge {
        font-size: 14px;
        padding: 4px 12px;
    }

    .fmp-promo-heading {
        font-size: 22px;
    }

    .fmp-promo-flash {
        font-size: 22px;
    }

    .fmp-promo-subtitle {
        font-size: 14px;
    }

    .fmp-promo-right {
        padding: 32px 32px 32px 24px;
    }

    .fmp-promo-img-wrap {
        width: 110px;
        height: 110px;
        border-radius: 12px;
    }

    .fmp-promo-specs li {
        font-size: 16px;
        gap: 24px;
    }

    .fmp-promo-spec-label {
        min-width: 70px;
    }

    .fmp-promo-specs {
        gap: 16px;
    }

    .fmp-promo-desc {
        font-size: 14px;
    }

    .fmp-carousel-dots {
        bottom: 12px !important;
    }
}

/* ---- Mobile (< 768px) ---- */
@media only screen and (max-width: 767px) {
    .fmp-banner-carousel {
        background: #0C265F;
        border-radius: var(--fmp-radius-modal);
        overflow: hidden;
    }

    .fmp-promo-banner {
        flex-direction: column;
        background: #0C265F;
        border-radius: 0;
        border-color: transparent;
        min-height: auto;
        align-items: center;
        padding-bottom: 0;
    }

    .fmp-promo-left {
        width: 100%;
        max-width: 100%;
        min-width: unset;
        padding: 24px 16px 0;
        justify-content: center;
        align-items: center;
    }

    .fmp-promo-left-inner {
        align-items: center;
        text-align: center;
        gap: 16px;
    }

    /* Hide the inline button inside the dark section on mobile */
    .fmp-promo-shop-btn--top {
        display: none !important;
    }

    /* Show the bottom button (below the white card) on mobile */
    .fmp-promo-shop-btn--bottom {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        background: var(--fmp-orange);
        color: var(--fmp-white) !important;
        font-size: 14px;
        font-weight: 500;
        padding: 10px 16px 10px 24px;
        border-radius: var(--fmp-radius-btn);
        text-decoration: none !important;
        line-height: 1.5;
        transition: background 0.18s;
        margin-top: 4px;
        flex-shrink: 0;
    }

    .fmp-promo-shop-btn--bottom:hover {
        background: var(--fmp-orange-dark);
    }

    .fmp-promo-shop-btn--bottom i {
        font-size: 20px;
    }

    .fmp-promo-heading {
        font-size: 20px;
    }

    .fmp-promo-flash {
        font-size: 22px;
    }

    .fmp-promo-badge {
        font-size: 14px;
        padding: 4px 14px;
    }

    .fmp-promo-subtitle {
        font-size: 14px;
    }

    .fmp-promo-right {
        background: transparent;
        padding: 16px 16px 0;
        justify-content: center;
        width: 100%;
    }

    .fmp-promo-right-inner {
        flex-direction: column;
        align-items: center;
        background: var(--fmp-white);
        border-radius: 16px;
        padding: 20px 20px 28px;
        gap: 16px;
    }

    .fmp-promo-img-wrap {
        width: 110px;
        height: 110px;
        border-radius: 8px;
    }

    .fmp-promo-content {
        width: 100%;
    }

    .fmp-promo-specs {
        gap: 12px;
    }

    .fmp-promo-specs li {
        font-size: 14px;
        gap: 20px;
    }

    .fmp-promo-spec-label {
        min-width: 65px;
    }

    .fmp-promo-desc {
        font-size: 14px;
        text-align: center;
    }

    /* Dots: static flow on mobile, inside the dark blue wrapper */
    .fmp-carousel-dots {
        position: static !important;
        transform: none !important;
        justify-content: center;
        margin: 14px 0 14px !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        width: auto !important;
    }

    /* White dots on dark background for mobile */
    .fmp-carousel-dots button,
    .fmp-carousel-dots [data-bs-target] {
        background: rgba(255,255,255,0.35) !important;
    }

    .fmp-carousel-dots button.active,
    .fmp-carousel-dots button[aria-current="true"] {
        background: rgba(255,255,255,0.9) !important;
    }
}

/* ============================================================
   Contact Us page
   ============================================================ */

.fmp-contact-wrap {
    display: flex;
    justify-content: center;
    padding: 16px 0 32px;
}

.fmp-contact-card {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    padding: 40px 48px 48px;
    width: 100%;
    max-width: 70%;
}

.fmp-contact-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    text-align: center;
    margin-bottom: 32px;
    line-height: 1.5;
}

.fmp-contact-body {
    display: flex;
    gap: 24px;
    align-items: flex-start;
}

.fmp-contact-form-col {
    flex: 1;
    min-width: 0;
}

.fmp-contact-section-label {
    font-size: 18px;
    font-weight: 500;
    color: var(--fmp-text-dark);
    margin-bottom: 20px;
    line-height: 1.5;
}

.fmp-contact-fields {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 20px;
}

.fmp-contact-field {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.fmp-contact-label {
    font-size: 12px;
    font-weight: 600;
    color: var(--fmp-text-gray);
    padding: 0 16px;
    display: flex;
    justify-content: space-between;
    margin-bottom: 2px;
}

.fmp-contact-optional {
    font-weight: 400;
    color: var(--fmp-text-light);
}

.fmp-contact-input {
    font-size: 14px;
    font-weight: 400;
    color: var(--fmp-text-dark);
    background: var(--fmp-white);
    border: 1.5px solid var(--fmp-border);
    border-radius: 24px;
    height: 44px;
    padding: 12px 16px;
    width: 100%;
    line-height: 1.6;
    outline: none;
    transition: border-color 0.2s;
}

.fmp-contact-input:focus {
    border-color: var(--fmp-border-blue);
    box-shadow: none;
}

.fmp-contact-input::placeholder {
    color: var(--fmp-text-light);
}

.fmp-contact-textarea {
    height: 100px;
    resize: vertical;
}

.fmp-contact-recaptcha {
    margin-top: 4px;
}

.fmp-contact-error {
    font-size: 12px;
    color: var(--fmp-error);
    padding: 0 16px;
    margin-top: 2px;
}

.fmp-contact-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 44px;
    background: var(--fmp-orange);
    color: var(--fmp-white);
    font-size: 14px;
    font-weight: 500;
    border: none;
    border-radius: var(--fmp-radius-btn);
    cursor: pointer;
    text-transform: capitalize;
    transition: opacity 0.2s;
    margin-top: 4px;
}

.fmp-contact-submit:hover { opacity: 0.88; }
.fmp-contact-submit:disabled { opacity: 0.6; cursor: not-allowed; }

/* Sidebar (desktop) */
.fmp-contact-sidebar {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    max-width: 30%;
    flex-shrink: 0;
}

.fmp-contact-sidebar-card {
    background: var(--fmp-bg-card);
    border-radius: var(--fmp-radius-modal);
    padding: 16px 20px 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fmp-contact-sidebar-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    margin: 0;
    line-height: 1.5;
}

.fmp-contact-sidebar-desc {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    margin: 0;
    line-height: 1.5;
}

.fmp-contact-sidebar-text {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.5;
}
.fmp-contact-sidebar-text p { margin: 0; }

.fmp-contact-phone {
    color: var(--fmp-text-dark);
    text-decoration: none;
}
.fmp-contact-phone:hover { color: var(--fmp-blue); }

.fmp-contact-outline-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    border: 1px solid var(--fmp-orange);
    background: transparent;
    color: var(--fmp-orange);
    font-size: 14px;
    font-weight: 500;
    border-radius: var(--fmp-radius-btn);
    cursor: pointer;
    padding: 0 12px;
    text-transform: capitalize;
    transition: background 0.2s, color 0.2s;
    margin-top: 8px;
}
.fmp-contact-outline-btn:hover {
    background: var(--fmp-orange);
    color: var(--fmp-white);
}

/* Mobile/Tablet: show "Call us" top section + stacked alternative cards */
.fmp-contact-callus-top {
    display: none;
    text-align: center;
    margin-bottom: 16px;
}

.fmp-contact-callus-title {
    font-size: 18px;
    font-weight: 600;
    color: var(--fmp-text-gray);
    margin-bottom: 8px;
}

.fmp-contact-callus-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 16px;
    color: var(--fmp-text-dark);
}
.fmp-contact-callus-row i { font-size: 20px; }

.fmp-contact-divider {
    border: none;
    border-top: 1px solid var(--fmp-border);
    margin: 16px 0;
    display: none;
}

.fmp-contact-or {
    display: none;
    align-items: center;
    gap: 16px;
    margin: 24px 0;
}

.fmp-contact-or-line {
    flex: 1;
    height: 1px;
    background: var(--fmp-border);
}

.fmp-contact-or-text {
    font-size: 16px;
    color: var(--fmp-text-dark);
    line-height: 1.6;
}

.fmp-contact-alt-cards {
    display: none;
    gap: 16px;
}

.fmp-contact-alt-card {
    background: var(--fmp-bg-card);
    border-radius: 16px;
    padding: 24px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fmp-contact-alt-title {
    font-size: 18px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    margin: 0;
    line-height: 1.5;
}

.fmp-contact-alt-desc {
    font-size: 16px;
    color: var(--fmp-text-gray);
    margin: 0;
    line-height: 1.5;
}

.fmp-contact-alt-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    border: 1.5px solid var(--fmp-orange);
    background: transparent;
    color: var(--fmp-orange);
    font-size: 14px;
    font-weight: 500;
    border-radius: var(--fmp-radius-btn);
    cursor: pointer;
    padding: 0 16px;
    text-transform: capitalize;
    transition: background 0.2s, color 0.2s;
    margin-top: 8px;
}
.fmp-contact-alt-btn:hover {
    background: var(--fmp-orange);
    color: var(--fmp-white);
}

/* Success page */
.fmp-contact-success-card {
    max-width: 824px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
}

.fmp-contact-success-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center;
}

.fmp-contact-success-icon {
    font-size: 32px;
    color: var(--fmp-orange);
    margin-bottom: 4px;
}

.fmp-contact-success-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-orange);
    margin: 0;
    line-height: 1.5;
}

.fmp-contact-success-subtitle {
    font-size: 16px;
    color: var(--fmp-text-dark);
    margin: 0;
    line-height: 1.6;
}

.fmp-contact-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 44px;
    background: var(--fmp-orange);
    color: var(--fmp-white);
    font-size: 14px;
    font-weight: 500;
    border-radius: var(--fmp-radius-btn);
    padding: 0 16px;
    text-decoration: none;
    text-transform: capitalize;
    transition: opacity 0.2s;
}
.fmp-contact-back-btn:hover { opacity: 0.88; color: var(--fmp-white); }
.fmp-contact-back-btn i { font-size: 20px; }

/* Tablet (< 992px): switch to single-column layout */
@media (max-width: 991.98px) {
    .fmp-contact-card {
        border-radius: var(--fmp-radius-modal);
        padding: 28px 32px 32px;
        max-width: 668px;
    }

    .fmp-contact-title {
        font-size: 28px;
    }

    .fmp-contact-body {
        flex-direction: column;
    }

    .fmp-contact-sidebar {
        display: none;
    }

    .fmp-contact-callus-top {
        display: block;
    }

    .fmp-contact-divider {
        display: block;
    }

    .fmp-contact-or {
        display: flex;
    }

    .fmp-contact-alt-cards {
        display: flex;
        flex-direction: row;
    }

    .fmp-contact-success-card {
        max-width: 668px;
        gap: 32px;
    }

    .fmp-contact-success-title {
        font-size: 18px;
    }
}

/* Mobile (< 576px) */
@media (max-width: 575.98px) {
    .fmp-contact-card {
        border-radius: var(--fmp-radius-modal);
        padding: 16px;
        max-width: 100%;
    }

    .fmp-contact-title {
        font-size: 20px;
    }

    .fmp-contact-section-label {
        font-size: 16px;
    }

    .fmp-contact-callus-title {
        font-size: 16px;
    }

    .fmp-contact-callus-row {
        font-size: 14px;
    }

    .fmp-contact-alt-cards {
        flex-direction: column;
    }

    .fmp-contact-alt-title {
        font-size: 16px;
    }

    .fmp-contact-alt-desc {
        font-size: 14px;
    }

    .fmp-contact-success-card {
        max-width: 100%;
        gap: 32px;
    }

    .fmp-contact-success-title {
        font-size: 16px;
    }

    .fmp-contact-success-subtitle {
        font-size: 14px;
    }
}

/* ============================================================
   Policies / Terms & Conditions page
   ============================================================ */

.fmp-policy-wrap {
    max-width: 688px;
    margin: 0 auto;
    padding: 32px 0 48px;
}

.fmp-policy-tabs {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 32px;
}

.fmp-policy-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 16px;
    border-radius: var(--fmp-radius-modal);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
    background: var(--fmp-bg-card);
    border: 1px solid var(--fmp-border-blue);
    color: var(--fmp-text-dark);
    opacity: 0.8;
}

.fmp-policy-tab.active {
    background: var(--fmp-blue);
    color: var(--fmp-white);
    border-color: var(--fmp-blue);
    opacity: 1;
}

.fmp-policy-tab:hover:not(.active) {
    opacity: 1;
    color: var(--fmp-text-dark);
    text-decoration: none;
}

.fmp-policy-heading {
    font-size: 24px;
    font-weight: 600;
    color: var(--fmp-text-dark);
    margin-bottom: 24px;
    line-height: 1.5;
}

.fmp-policy-body {
    font-size: 16px;
    font-weight: 400;
    color: var(--fmp-text-gray);
    line-height: 1.6;
    margin-bottom: 24px;
}

.fmp-policy-body p { margin-bottom: 16px; }

.fmp-policy-modified {
    font-size: 14px;
    color: var(--fmp-text-light);
    margin: 0;
    line-height: 1.6;
}

.fmp-policy-modified-date {
    font-weight: 500;
    color: var(--fmp-text-light);
}

@media (max-width: 767.98px) {
    .fmp-policy-wrap {
        padding: 16px 0 32px;
    }

    .fmp-policy-heading {
        font-size: 20px;
    }

    .fmp-policy-body {
        font-size: 14px;
    }
}

/* ============================================================
   Checkout purchase confirmation
   ============================================================ */

.fmp-order-confirmed-page {
    background: var(--fmp-bg);
}

.fmp-order-confirmed-container {
    max-width: 1113px;
    margin: 56px auto 0;
    padding: 0;
}

.fmp-order-confirmed-card {
    background: var(--fmp-white);
    border-radius: var(--fmp-radius-card);
    padding: 40px 48px 48px;
}

.fmp-order-confirmed-card--figma {
    border-radius: 28px;
    padding: 48px;
}

.fmp-order-confirmed-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 28px;
}

.fmp-order-confirmed-icon {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--fmp-orange);
    font-size: 24px;
    margin-bottom: 4px;
}

.fmp-order-confirmed-title {
    margin: 0;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.5;
    color: var(--fmp-orange);
}

.fmp-order-confirmed-subtitle {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    color: #282A36;
}

.fmp-order-confirmed-details {
    border: 1px solid rgba(56, 121, 200, 0.3);
    border-radius: var(--fmp-radius-modal);
    padding: 20px 24px 24px;
}

.fmp-order-confirmed-details-title {
    margin: 0 0 10px;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.5;
    color: var(--fmp-text-dark);
}

.fmp-order-confirmed-carrier {
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
    color: #282A36;
    margin-bottom: 12px;
}

.fmp-order-confirmed-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px 40px;
}

.fmp-order-confirmed-item {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.fmp-order-confirmed-item-label {
    font-size: 12px;
    line-height: 1.5;
    font-weight: 400;
    color: #727583;
}

.fmp-order-confirmed-item-value {
    font-size: 14px;
    line-height: 1.6;
    font-weight: 400;
    color: #282A36;
    word-break: break-word;
}

.fmp-order-confirmed-item-value--total {
    font-size: 24px;
    line-height: 1.4;
    font-weight: 600;
}

@media (max-width: 991px) {
    .fmp-order-confirmed-container {
        margin-top: 24px;
        max-width: 100%;
        padding: 0 12px;
    }

    .fmp-order-confirmed-card {
        border-radius: var(--fmp-radius-modal);
        padding: 28px 20px 24px;
    }

    .fmp-order-confirmed-card--figma {
        padding: 28px 20px 24px;
    }

    .fmp-order-confirmed-title {
        font-size: 24px;
    }

    .fmp-order-confirmed-details {
        padding: 20px;
    }

    .fmp-order-confirmed-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .fmp-order-confirmed-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}