/*
 * MONTAAGE GLOBAL PRESENTATION R5
 *
 * Sitewide visual layer.
 * Presentation only.
 * No routing, catalog, database, cart, tax, payment or order logic.
 */

:root {
    --mi-r5-navy: #0b2540;
    --mi-r5-navy-2: #123b5d;
    --mi-r5-gold: #b68b4e;
    --mi-r5-gold-soft: #dcc8ad;
    --mi-r5-ink: #253341;
    --mi-r5-muted: #68747d;
    --mi-r5-paper: #fffdf8;
    --mi-r5-cream: #faf7f1;
    --mi-r5-cream-2: #f7f2e9;
    --mi-r5-line: #e6d8c1;
    --mi-r5-white: #ffffff;
    --mi-r5-shadow: 0 12px 34px rgba(72,53,31,.07);
}

html,
body {
    background:
        linear-gradient(
            180deg,
            var(--mi-r5-cream) 0,
            var(--mi-r5-cream-2) 100%
        );
    color: var(--mi-r5-ink);
}

/* ---------------------------------------------------------
   GLOBAL STOREFRONT HEADER / NAVIGATION
   --------------------------------------------------------- */

.navbar,
#navbar-default,
.mi-header {
    background: var(--mi-r5-white) !important;
    border-color: var(--mi-r5-line) !important;
}

.navbar {
    box-shadow: 0 6px 22px rgba(37,51,65,.055);
}

.navbar .container,
.navbar .container-fluid,
.mi-header-inner,
.mi-nav-inner {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}

.navbar a,
.mi-header a,
.mi-nav a {
    color: var(--mi-r5-navy) !important;
}

.navbar a:hover,
.mi-header a:hover,
.mi-nav a:hover {
    color: var(--mi-r5-gold) !important;
}

.navbar-brand img {
    max-height: 68px;
    width: auto;
}

header input[name="search_str"],
.navbar input[name="search_str"],
.mi-search input,
input.form-control {
    border: 1px solid var(--mi-r5-gold-soft) !important;
    border-radius: 999px !important;
    background: #fff !important;
    box-shadow: none !important;
}

header input[name="search_str"]:focus,
.navbar input[name="search_str"]:focus,
.mi-search input:focus,
input.form-control:focus {
    border-color: var(--mi-r5-gold) !important;
    box-shadow: 0 0 0 3px rgba(182,139,78,.12) !important;
}

.mi-top,
.mi-topbar {
    background: var(--mi-r5-navy) !important;
    color: #fff !important;
}

.mi-nav {
    background: var(--mi-r5-paper) !important;
    border-top: 1px solid var(--mi-r5-line);
    border-bottom: 1px solid var(--mi-r5-line);
}

/* ---------------------------------------------------------
   MAIN PAGE CANVAS — HOME / CATEGORY / SEARCH / PDP / SERVICE
   --------------------------------------------------------- */

main {
    color: var(--mi-r5-ink);
}

.montaage-category-page,
.mi-shell,
.mi-page,
.mi-pd-page {
    background:
        linear-gradient(
            180deg,
            var(--mi-r5-cream) 0,
            var(--mi-r5-cream-2) 100%
        ) !important;
}

main h1,
main h2,
main h3,
.montaage-category-page h1,
.montaage-category-page h2,
.mi-shell h1,
.mi-shell h2,
.mi-pd-page h1,
.mi-pd-page h2 {
    color: var(--mi-r5-navy);
    letter-spacing: -.018em;
}

main p,
main .text-muted {
    color: var(--mi-r5-muted);
}

/* ---------------------------------------------------------
   PRODUCT / DEPARTMENT / CONTENT CARDS
   --------------------------------------------------------- */

main .card,
.montaage-product-card,
.card-product,
.mi-card,
.mi-pd-gallery,
.mi-pd-buybox,
.mi-pd-service,
.mi-pd-section,
.mi-pd-other {
    border: 1px solid var(--mi-r5-line) !important;
    border-radius: 16px !important;
    background: var(--mi-r5-white) !important;
    box-shadow: var(--mi-r5-shadow) !important;
}

main .card {
    overflow: hidden;
}

main .card:hover,
.montaage-product-card:hover,
.mi-card:hover {
    border-color: #d5bd99 !important;
    box-shadow: 0 16px 38px rgba(62,46,28,.10) !important;
    transform: translateY(-2px);
}

.montaage-product-image-area,
.product_img,
.mi-media {
    background: #fbf7ef !important;
}

.montaage-product-title a,
.mi-design {
    color: var(--mi-r5-navy) !important;
    font-weight: 800;
}

.montaage-product-price,
.mi-price,
.mi-pd-price {
    color: var(--mi-r5-navy) !important;
    font-weight: 900;
}

/* ---------------------------------------------------------
   BUTTONS / CONTROLS / FILTERS
   --------------------------------------------------------- */

.btn-primary,
.montaage-details-btn,
.mi-view,
.mi-search button,
.mi-help a,
.mi-service-feature a {
    background: var(--mi-r5-navy) !important;
    border-color: var(--mi-r5-navy) !important;
    color: #fff !important;
    border-radius: 9px !important;
    font-weight: 800 !important;
}

.btn-primary:hover,
.montaage-details-btn:hover,
.mi-view:hover,
.mi-search button:hover,
.mi-help a:hover,
.mi-service-feature a:hover {
    background: var(--mi-r5-navy-2) !important;
    border-color: var(--mi-r5-navy-2) !important;
    color: #fff !important;
}

.btn-outline-primary,
.btn-outline-secondary {
    border-color: var(--mi-r5-gold-soft) !important;
    color: var(--mi-r5-navy) !important;
    border-radius: 9px !important;
}

select.form-select,
.mi-control select {
    border-color: var(--mi-r5-gold-soft) !important;
    border-radius: 9px !important;
    background-color: #fff !important;
}

.pagination .page-link {
    color: var(--mi-r5-navy);
    border-color: var(--mi-r5-line);
    background: #fff;
}

.pagination .active .page-link {
    background: var(--mi-r5-navy) !important;
    border-color: var(--mi-r5-navy) !important;
}

/* ---------------------------------------------------------
   BREADCRUMBS / HERO / INFORMATION ZONES
   --------------------------------------------------------- */

.breadcrumb,
.mi-breadcrumb,
.montaage-category-intro,
.mi-hero,
.mi-help,
.mi-service-feature {
    border-color: var(--mi-r5-line) !important;
}

.montaage-category-intro,
.mi-hero,
.mi-help,
.mi-service-feature {
    background: var(--mi-r5-paper) !important;
    border-radius: 16px !important;
}

.badge.bg-success {
    background: var(--mi-r5-navy) !important;
}

/* ---------------------------------------------------------
   FOOTER
   --------------------------------------------------------- */

footer {
    border-top: 1px solid var(--mi-r5-line);
}

footer a {
    color: var(--mi-r5-navy);
}

footer a:hover {
    color: var(--mi-r5-gold);
}

/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 991px) {
    .navbar-brand img {
        max-height: 54px;
    }

    main .card:hover,
    .montaage-product-card:hover,
    .mi-card:hover {
        transform: none;
    }
}

@media (max-width: 600px) {
    body {
        font-size: 15px;
    }

    main h1,
    .montaage-category-page h1,
    .mi-shell h1,
    .mi-pd-page h1 {
        font-size: clamp(26px, 8vw, 34px) !important;
    }

    main .card,
    .montaage-product-card,
    .mi-card {
        border-radius: 13px !important;
    }
}

/* MONTAAGE_GLOBAL_PRESENTATION_R5_END */
