/**
 * Rolex collection layout shell — shared grid widths + .rolex-collection-block variants.
 * CON-1 pilot: extracted from rolex-appointment-form.css (legacy rolex.min.css).
 * Block padding modifiers (noPadding*) — CON-5c; default block padding remains in rolex-base.css.
 * @see dev-doc/rolex_shared_assets_consolidation_plan.html#inventory-css
 */

/* —— Shell positioning —— */
.rolex-wrapper .rolex-collection-block,
.rolex-wrapper .rolex-collection-image,
.rolex-wrapper .rolex-collection-text,
.rolex-wrapper .rolex-collection-video,
.rolex-wrapper .rolex-model-infoWrapper,
.rolex-wrapper .rolex-newWatches-watchGridWrapper {
    margin: 0 auto;
    position: relative;
}

/* —— Width utilities (C2 subset; shared component class list from rolex.min) —— */
.rolex-appointmentForm-block.fullWidth,
.rolex-collection-block.fullWidth,
.rolex-collection-image.fullWidth,
.rolex-collection-text.fullWidth,
.rolex-collection-video.fullWidth,
.rolex-contactus-contactPanel.fullWidth,
.rolex-discoverRolex-discoverPanel.fullWidth,
.rolex-model-infoWrapper.fullWidth,
.rolex-newWatches-watchGridWrapper.fullWidth,
.rolex-productDetails-watchSpec.fullWidth,
.rolex-rolexWatches-watchCategory.fullWidth,
.rolex-worldOfRolex-grid.fullWidth {
    width: 100%;
}

.rolex-appointmentForm-block.large,
.rolex-collection-block.large,
.rolex-collection-image.large,
.rolex-collection-text.large,
.rolex-collection-video.large,
.rolex-contactus-contactPanel.large,
.rolex-discoverRolex-discoverPanel.large,
.rolex-model-infoWrapper.large,
.rolex-newWatches-watchGridWrapper.large,
.rolex-productDetails-watchSpec.large,
.rolex-rolexWatches-watchCategory.large,
.rolex-worldOfRolex-grid.large {
    max-width: 1620px;
    width: calc(100% - 48px);
    margin-left: auto;
    margin-right: auto;
}

@media only screen and (min-width: 768px) {
    .rolex-appointmentForm-block.large,
    .rolex-collection-block.large,
    .rolex-collection-image.large,
    .rolex-collection-text.large,
    .rolex-collection-video.large,
    .rolex-contactus-contactPanel.large,
    .rolex-discoverRolex-discoverPanel.large,
    .rolex-model-infoWrapper.large,
    .rolex-newWatches-watchGridWrapper.large,
    .rolex-productDetails-watchSpec.large,
    .rolex-rolexWatches-watchCategory.large,
    .rolex-worldOfRolex-grid.large {
        width: 84.375%;
    }
}

.rolex-appointmentForm-block.medium,
.rolex-collection-block.medium,
.rolex-collection-image.medium,
.rolex-collection-text.medium,
.rolex-collection-video.medium,
.rolex-contactus-contactPanel.medium,
.rolex-discoverRolex-discoverPanel.medium,
.rolex-model-infoWrapper.medium,
.rolex-newWatches-watchGridWrapper.medium,
.rolex-productDetails-watchSpec.medium,
.rolex-rolexWatches-watchCategory.medium,
.rolex-worldOfRolex-grid.medium {
    max-width: 1350px;
    width: calc(100% - 48px);
}

@media only screen and (min-width: 768px) {
    .rolex-appointmentForm-block.medium,
    .rolex-collection-block.medium,
    .rolex-collection-image.medium,
    .rolex-collection-text.medium,
    .rolex-collection-video.medium,
    .rolex-contactus-contactPanel.medium,
    .rolex-discoverRolex-discoverPanel.medium,
    .rolex-model-infoWrapper.medium,
    .rolex-newWatches-watchGridWrapper.medium,
    .rolex-productDetails-watchSpec.medium,
    .rolex-rolexWatches-watchCategory.medium,
    .rolex-worldOfRolex-grid.medium {
        width: 70.3125%;
    }
}

.rolex-appointmentForm-block.small,
.rolex-collection-block.small,
.rolex-collection-image.small,
.rolex-collection-text.small,
.rolex-collection-video.small,
.rolex-contactus-contactPanel.small,
.rolex-discoverRolex-discoverPanel.small,
.rolex-model-infoWrapper.small,
.rolex-newWatches-watchGridWrapper.small,
.rolex-productDetails-watchSpec.small,
.rolex-rolexWatches-watchCategory.small,
.rolex-worldOfRolex-grid.small {
    max-width: 810px;
    width: calc(100% - 48px);
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .rolex-appointmentForm-block.small,
    .rolex-collection-block.small,
    .rolex-collection-image.small,
    .rolex-collection-text.small,
    .rolex-collection-video.small,
    .rolex-contactus-contactPanel.small,
    .rolex-discoverRolex-discoverPanel.small,
    .rolex-model-infoWrapper.small,
    .rolex-newWatches-watchGridWrapper.small,
    .rolex-productDetails-watchSpec.small,
    .rolex-rolexWatches-watchCategory.small,
    .rolex-worldOfRolex-grid.small {
        width: 60%;
    }
}

@media only screen and (min-width: 1024px) {
    .rolex-appointmentForm-block.small,
    .rolex-collection-block.small,
    .rolex-collection-image.small,
    .rolex-collection-text.small,
    .rolex-collection-video.small,
    .rolex-contactus-contactPanel.small,
    .rolex-discoverRolex-discoverPanel.small,
    .rolex-model-infoWrapper.small,
    .rolex-newWatches-watchGridWrapper.small,
    .rolex-productDetails-watchSpec.small,
    .rolex-rolexWatches-watchCategory.small,
    .rolex-worldOfRolex-grid.small {
        width: 43%;
    }
}

/* —— First-child spacing reset —— */
.rolex-wrapper .rolex-collection-block .rolex-collection-image:first-child,
.rolex-wrapper .rolex-collection-block .rolex-collection-text:first-child,
.rolex-wrapper .rolex-collection-block .rolex-collection-video:first-child,
.rolex-wrapper .rolex-collection-quote50-normal:first-child,
.rolex-wrapper .rolex-collection-quote50:first-child {
    padding-top: 0;
}

/* —— Block padding modifiers (same element as .rolex-collection-block) —— */
/* [class] bumps specificity above page shells like .discoverRolex-topContent.rolex-collection-block */
.rolex-wrapper .rolex-collection-block.noPaddingTop[class] {
    padding-top: 0;
}

@media only screen and (min-width: 1024px) {
    .rolex-wrapper .rolex-collection-block.noPaddingTop[class] {
        padding-top: 0;
    }
}

.rolex-wrapper .rolex-collection-block.noPadding[class] {
    padding-top: 0;
    padding-bottom: 0;
}

@media only screen and (min-width: 1024px) {
    .rolex-wrapper .rolex-collection-block.noPadding[class] {
        padding-top: 0;
        padding-bottom: 0;
    }
}

.rolex-wrapper .rolex-collection-block.noPaddingBottom[class] {
    padding-bottom: 0;
}

@media only screen and (min-width: 1024px) {
    .rolex-wrapper .rolex-collection-block.noPaddingBottom[class] {
        padding-bottom: 0;
    }
}

/* —— Background variants —— */
.rolex-wrapper .rolex-collection-block.white {
    background-color: #fff;
}

.rolex-wrapper .rolex-collection-block.light {
    background-color: #f9f7f4;
}

.rolex-wrapper .rolex-collection-block.dark {
    background-color: #f4efea;
}

.rolex-wrapper .rolex-collection-productListWrapper .rolex-collection-productList .rolex-common-watchGrid .rolex-common-watchItem .rolex-common-watchItem-infoWrapper:after {
    background-color: #f4efea;
}

/* —— Nested image / text / video spacing —— */
.rolex-wrapper .rolex-collection-block .rolex-collection-image,
.rolex-wrapper .rolex-collection-block .rolex-collection-text,
.rolex-wrapper .rolex-collection-block .rolex-collection-video {
    padding-top: max(7vh, 60px);
}

@media only screen and (min-width: 1024px) {
    .rolex-wrapper .rolex-collection-block .rolex-collection-image,
    .rolex-wrapper .rolex-collection-block .rolex-collection-text,
    .rolex-wrapper .rolex-collection-block .rolex-collection-video {
        padding-top: max(10vh, 90px);
    }

    .rolex-wrapper .rolex-collection-block .rolex-collection-image:first-child,
    .rolex-wrapper .rolex-collection-block .rolex-collection-text:first-child,
    .rolex-wrapper .rolex-collection-block .rolex-collection-video:first-child {
        padding-top: 0;
    }
}

.rolex-wrapper .rolex-collection-block .rolex-collection-image.noPadding,
.rolex-wrapper .rolex-collection-block .rolex-collection-text.noPadding,
.rolex-wrapper .rolex-collection-block .rolex-collection-video.noPadding {
    padding-top: 0;
    padding-bottom: 0;
}

@media only screen and (min-width: 1024px) {
    .rolex-wrapper .rolex-collection-block .rolex-collection-image.noPadding,
    .rolex-wrapper .rolex-collection-block .rolex-collection-text.noPadding,
    .rolex-wrapper .rolex-collection-block .rolex-collection-video.noPadding {
        padding-top: 0;
        padding-bottom: 0;
    }
}