/* FlatMJ prototype visual language, scoped to the CartUser storefront. */
:root {
    --flatmj-blue: #075bb5;
    --flatmj-orange: #f58220;
    --flatmj-navy: #092f57;
    --flatmj-surface: #f5f7fa;
}

body.flatmj-theme {
    background: var(--flatmj-surface);
    color: #171717;
}

body.flatmj-theme .header-bottom {
    background: linear-gradient(135deg, #ffffff 0%, #fff8e8 55%, #eef7ff 100%);
    border-bottom: 1px solid #dfe4ea;
}

body.flatmj-theme .header-logo img {
    max-height: 58px;
    object-fit: contain;
}

body.flatmj-theme .search-bar .search,
body.flatmj-theme .mobile-search .search {
    border: 2px solid var(--flatmj-orange);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 3px 12px rgba(0, 0, 0, .07);
}

body.flatmj-theme .search-bar .search input:focus,
body.flatmj-theme .mobile-search .search input:focus {
    border-color: var(--flatmj-orange);
    box-shadow: none;
}

body.flatmj-theme .btn--primary,
body.flatmj-theme .bg--primary,
body.flatmj-theme .btn-primary {
    background-color: var(--flatmj-blue) !important;
    border-color: var(--flatmj-blue) !important;
}

body.flatmj-theme .btn--secondary,
body.flatmj-theme .btn-secondary {
    background-color: var(--flatmj-orange) !important;
    border-color: var(--flatmj-orange) !important;
}

body.flatmj-theme .footer {
    background-color: var(--flatmj-navy);
}

body.flatmj-theme .product-card,
body.flatmj-theme .product-item,
body.flatmj-theme .product-box {
    border-radius: 14px;
    box-shadow: 0 2px 9px rgba(0, 0, 0, .08);
    overflow: hidden;
}

body.flatmj-theme .product-card img,
body.flatmj-theme .product-item img,
body.flatmj-theme .product-box img {
    background: #f7f7f7;
}

body.flatmj-theme .section-title h2,
body.flatmj-theme .title-left-content h3 {
    font-weight: 800;
}

@media (max-width: 650px) {
    body.flatmj-theme .header-bottom {
        padding-inline: 3%;
    }

    /* Keep the search field visible in the mobile header instead of hiding it
       behind the magnifying-glass trigger. */
    body.flatmj-theme .header-bottom-container {
        grid-template-columns: minmax(108px, .85fr) minmax(0, 2.15fr);
        column-gap: .65rem;
    }

    body.flatmj-theme .header-logo > a {
        width: 100%;
        max-width: 118px;
    }

    body.flatmj-theme .mobile-search {
        position: relative;
        inset: auto;
        width: 100%;
        padding: 0;
        box-shadow: none;
        display: block;
        z-index: 10;
    }

    body.flatmj-theme .mobile-search-close,
    body.flatmj-theme .mobile-search-tigger {
        display: none !important;
    }

    body.flatmj-theme .mobile-search .search {
        min-height: 38px;
        border-width: 1px;
    }

    body.flatmj-theme .mobile-search .search input {
        min-width: 0;
        width: 100%;
        padding: .55rem .55rem .55rem 2rem;
        font-size: 12px;
    }

    body.flatmj-theme .search-bar .search,
    body.flatmj-theme .mobile-search .search {
        border-radius: 15px;
    }
}
