/**
 * Rolex RCPO Contact Page (Hyvä) — category id 24
 * (/en/rolex-certified-pre-owned/contact).
 *
 * H9 — page-level overrides only:
 * - Hyvä 1-column shell (hide PLP chrome, full-width main)
 * - Stacking vs site header / mobile store overlay (H4 map ready)
 * - Section spacing not covered by landing-cms / keepExploring entries
 *
 * Component styles: rolex-rcpo-landing-cms.css, rolex-keepExploring.css,
 * rolex-rcpo-keepExploring-overrides.css,
 * rolex-rcpo-common-footer.css (via catalog_category_view_id_24.xml).
 *
 * @see dev-doc/rolex_rcpo_contact_page_implement_log.html#h9
 */

/* -------------------------------------------------------------------------
   1. Hyvä shell (H0)
   ------------------------------------------------------------------------- */

body.rolexrcpo-contact-page-body.category-rolex-certified-pre-owned #maincontent,
body.rolexrcpo-contact-page-body #maincontent {
    display: block !important;
    min-height: unset;
}

body.rolexrcpo-contact-page-body #maincontent.page-main,
body.rolexrcpo-contact-page-body.page-layout-1column #maincontent {
    margin: 0 !important;
    margin-block: 0 !important;
    padding-top: 0 !important;
    max-width: none;
    padding-inline: 0;
    flex-grow: 0 !important;
    min-height: unset;
}

body.rolexrcpo-contact-page-body #maincontent > .columns {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.rolexrcpo-contact-page-body .page-wrapper > div.page-main:not(#maincontent) {
    display: none !important;
    flex-grow: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.rolexrcpo-contact-page-body #maincontent:not(:has(#category-view-container)) {
    display: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.rolexrcpo-contact-page-body #category-view-container.rolex-wrapper.rolexrcpo {
    margin-top: 0;
    width: 100%;
}

body.rolexrcpo-contact-page-body .rolex-wrapper.rolexrcpo .breadcrumbs-wrapper {
    background-image: none;
    background-color: #000;
}

body.rolexrcpo-contact-page-body .rolex-wrapper.rolexrcpo .breadcrumbs {
    padding-bottom: 10px;
}

body.rolexrcpo-contact-page-body #maincontent .page.messages {
    margin: 0 !important;
    padding: 0 !important;
}

body.rolexrcpo-contact-page-body #maincontent .page.messages:not(:has(.message)) {
    display: none !important;
}

body.rolexrcpo-contact-page-body nav.breadcrumbs,
body.rolexrcpo-contact-page-body .breadcrumbs:not(.rolex-wrapper .breadcrumbs) {
    display: none !important;
}

body.rolexrcpo-contact-page-body .page-title-wrapper,
body.rolexrcpo-contact-page-body h1.page-title {
    display: none !important;
}

/* -------------------------------------------------------------------------
   2. Stacking — mobile header; store map overlay (when H4 enabled)
   ------------------------------------------------------------------------- */

@media only screen and (max-width: 1023px) {
    body.rolexrcpo-contact-page-body .page-header {
        position: relative;
        z-index: 20;
    }
}

@media only screen and (max-width: 767px) {
    body.rolexrcpo-contact-page-body.contactDetailsOpen .rolex-contactus-ourStores .rolexOurStores .rolexStores .storesList .storeListWrapper .storeListDetailsOverlay.active {
        z-index: 30;
    }
}

/* -------------------------------------------------------------------------
   3. Content parity — top hero CTA + content section spacing
   ------------------------------------------------------------------------- */

body.rolexrcpo-contact-page-body .rolexrcpo-contact-top .learnMoreBtn {
    margin-top: 16px;
}

/* Store image (noPaddingBottom) → contact grid panel */
body.rolexrcpo-contact-page-body .rolexrcpo-contact-content > .rolex-collection-block:not(.noPaddingBottom) {
    padding-top: max(7vh, 60px);
    padding-bottom: max(7vh, 60px);
}

@media only screen and (min-width: 1024px) {
    body.rolexrcpo-contact-page-body .rolexrcpo-contact-content > .rolex-collection-block:not(.noPaddingBottom) {
        padding-top: max(10vh, 90px);
        padding-bottom: max(10vh, 90px);
    }
}

/* CMS contactPanel is direct child of block — avoid double top pad on inner panel */
body.rolexrcpo-contact-page-body .rolexrcpo-contact-content .rolex-contactus-contactPanel.large {
    padding-top: 0;
}
