.slide-enter-active,
.slide-leave-active {
    transition: all 0.25s ease-out;
}

.slide-enter-from {
    opacity: 0;
    transform: translateX(20px);
}

.slide-leave-to {
    opacity: 0;
    transform: translateX(-20px);
}

.item-page-top, .item-related{
    max-width: 1450px;
    margin: 0 auto;
    width: 80%;
}
.item-page-top {
    justify-content: center;
}
.item-image {
    overflow: hidden;
    border: 1px solid #ddd;
    height: min-content;
}
.item-icons, .item-image {
    margin-top: 20px;
}

.item-icons-div {
    border: 1px solid #fff;
}

.item-icons-div.active {
    border: 1px solid #ddd;
}

.item-icons-div:hover,
.item-preview:hover {
    cursor: pointer;
}
.item-preview {
    width:100%;
    height: auto;
}

.item-image img {
    max-width: 100%;
}

.item-image img.active {
    display: inline-block;
}

.item-image {
    /*width: 60%;*/
    order:1;
}

.item-content {
    width: 40%;
    max-width: 520px;
    order:3;
}

.fancybox-slide--image .fancybox-content{
    background: #fff !important;
}

h1 {
    word-break: break-word;
}

.item-content .price {
    font-size: 22px;
}

.variations {
    display: flex;
    width: 250px;
    flex-direction: column;
    justify-content: space-between;
}

.variations label {
    font-size: 14px;
}

.variations select {
    width: 100%;
}

.item-content select {
    border-radius: 0px;
}

.item-content .sub_title {
    font-size: 1.25rem;
    color: #1D1D1D;
}

.item-content .stock svg{
    height: 12px;
    margin-right: 5px;
}
.item-content .stock .text-success{
    color: #1c8132 !important;
}
.item-content .stock .text-success svg path{
    fill: #1c8132;
}
.item-content .stock .text-danger svg path{
    fill: #dc3545;
}
.item-content .stock {
    text-transform: uppercase;
    font-size: 12px;
    margin-top: 10px;
    display: flex;
}
.item-content .stock span{
    display: inline-flex;
    margin-left: 5px;
    align-items: center;
    justify-content: center;
}

.item-content .shipping_policy {
    font-size: 12px;
}

google-pay-button {
    min-width: 250px;
}

.engraving {
    width: 100%;
}
.engraving input[type=checkbox] {
    margin-top: .35rem;
}
.engraving .form-group {
    width: 250px;
}
.engraving input, select {
    border-radius: 0;
}

.cta button {
    padding: 16px;
    border-radius: 0px;
    min-width: 250px;
}
.cta .btn-add-to-cart {
    background: #3172ab;
    border: 1px solid #3172ab;
}
.cta .btn-add-to-cart:hover,
.cta .btn-add-to-cart:focus {
    opacity: 0.9;
}
.cta .btn-request-info {
    border: 1px solid #3172ab;
    color: #3172ab;
}

.cta .btn-request-info:hover {
    background: #3172ab;
    color: #fff;
}

.item-actions {
    display: flex;
    flex-wrap: wrap;
}

.item-actions a,
.item-actions button {
    text-decoration: none;
    color: #333;
    text-transform: uppercase;
    font-size: 12px;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    line-height: 1.5;
}
.item-actions a svg,
.item-actions button svg {
    height: 10px;
    margin-right: 2px;
}

.item-actions a:hover,
.item-actions button:hover {
    opacity:0.8;
}

.item-authorized-retailer {
    text-transform: uppercase;
    text-decoration: none;
    color: #444;
    font-size: 14px;
}

.item-authorized-retailer:hover {
    color: #999;
    text-decoration: none;
}

.item-specifications ul {
    list-style: none;
    font-size: 12px;
    line-height: 1.8;
}

.item-specifications ul li:first-child {
    padding-top: .5rem;
}

.item-specifications .btn_collapse {
    width: 100%;
    font-size: 1.1rem;
    font-weight: 500;
    text-align: left;
    background: transparent;
    border: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.need-call h5 {
    font-size: 1.1rem;
}
.item-specifications .btn_collapse svg {
    padding: 0 10px;
    height: 14px;
    transition: all 0.2s ease-in;
}

.item-specifications button[aria-expanded="true"] svg {
    transform: rotate(90deg);
}

.affirm a {
    white-space: nowrap;
    color: #444;
}
.need-call {
    text-transform: uppercase;
}
.need-call span {
    white-space: nowrap;
    font-size: 12px;
    display: block;
    margin-top:3px;
}

.need-call a {
    color: #444;
}

.item-brand-logo-container img {
    border: 1px solid #ddd;
}

.item-certificates {
    max-height: 100px;
    cursor: pointer;
    border: 1px solid #ddd;
}

.brand-overview {
    padding: 40px 15px;
    max-width: 800px;
    margin: 0 auto;
}

.brand-overview-desktop {
    display: block;
}
.brand-overview-tablet,
.brand-overview-mobile {
    display: none;
}

.about-us {
    background: #424750;
    padding: 40px 15px;
}

.about-us .about-us-content {
    max-width: 800px;
    margin: 0 auto;
    color: #fff;
}
.about-us .about-us-content h2 {
    color: white !important;
    font-weight: normal;
    letter-spacing: 3px;
}

.about-us-description * {
    color: white !important;
    font-size: 1rem !important;
    margin-bottom: 0;
}

/*Related Products*/
.item-related {
    padding: 40px 0;
}

.products-list {
    flex-wrap: wrap;
    justify-content: center;
}

.products-list .slick-track {
    display: flex !important;
}

.products-list .item {
    width: 25%;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: #222;
    text-decoration: none;
    text-align: center;
    margin-left: -1px;
    margin-top: -1px;
}

.products-list .item .item-title {
    font-size: 1.25rem;
    word-break: break-word;
}

.products-list .item img {
    max-width: 100%;
    height: auto;
}

.products-list .item .item-info {
    padding: 20px;
}

.item-related .products-list .item img {
    max-width: 100%;
    margin: auto;
    padding: 25px;
    transition: all 0.2s ease;
}  

.item-page-top .alert {
    display: flex;
    align-items: center;
}

.item-page-top .alert svg {
    height: 22px;
    margin-right: 6px;
}
.item-page-top .alert svg path {
    fill: #3172ab;
}

#inquiry-modal .modal-xl {
    max-width: 1200px;
}

#inquiry-modal textarea {
    resize: none;
    min-height: 100px;
}

#inquiry-modal .img-container,
#email-this-item-modal .img-container {
    width: 34%;
}

#comparison-modal .modal-footer button {
    margin: 0;
    padding: 10px 35px;
    border-radius: 0;
}

.item-page-top .view-sizing-guide a{
    color: #3172ab;
    text-decoration: none;
}
.item-page-top .view-sizing-guide a:hover {
    opacity: 0.9;
    text-decoration: none;
}
.item-actions .open_comparison_modal {
    position: fixed;
    left: 0;
    bottom: 20%;
    z-index: 101;
    background: #3172ab;
    box-shadow: 1px 1px 6px #666;
    border: 1px solid #3172ab;  
    display: inline-flex;
    -moz-transform: rotate(270deg);
    -moz-transform-origin: bottom left;
    -webkit-transform: rotate(270deg);
    -webkit-transform-origin: bottom left;
    -o-transform: rotate(270deg);
    -o-transform-origin: bottom left;
    -ms-transform: rotate(270deg);    
    -ms-transform-origin: bottom left;
    transform: rotate(270deg);
    transform-origin: left top;
    padding: 5px 15px;
}
.item-actions .open_comparison_modal span {   
    color: #fff;
    display: inline-block;
}

div.grecaptcha-badge[data-style="bottomleft"] {
    opacity: 0;
}

/*SA slick buttons*/

.slick-next.slick-arrow:before,
.slick-prev.slick-arrow:before {
    /*display: none;*/
}
.slick-next.slick-arrow {
    background-image: url(https://s3.amazonaws.com/ISHOWIMAGES/Rolex/Rolex+Module/right_arrow_21.jpg);
    background-repeat: no-repeat;
    right: -50px;
    height: 48px;
    width: 26px;
    display: block;
    top: 40%;
}
.slick-next.slick-arrow:hover {
    background-image: url(https://s3.amazonaws.com/ISHOWIMAGES/Rolex/Rolex+Module/right_arrow_c1.jpg);
}
.slick-next.slick-arrow:focus {
    background-image: url(https://s3.amazonaws.com/ISHOWIMAGES/Rolex/Rolex+Module/right_arrow_21.jpg);
}
.slick-prev.slick-arrow {
    background-image: url(https://s3.amazonaws.com/ISHOWIMAGES/Rolex/Rolex+Module/left_arrow_21.jpg);
    background-repeat: no-repeat;
    left: -50px;
    height: 48px;
    width: 26px;
    top: 40%;
    display: block;
}
.slick-prev.slick-arrow:hover {
    background-image: url(https://s3.amazonaws.com/ISHOWIMAGES/Rolex/Rolex+Module/left_arrow_c1.jpg);
}
.slick-prev.slick-arrow:focus {
    background-image: url(https://s3.amazonaws.com/ISHOWIMAGES/Rolex/Rolex+Module/left_arrow_21.jpg);
}




.main_page_container .item-page-top .item-icons {
    flex-wrap: wrap;
}
.main_page_container .item-page-top .item-icons.d-none {
    display: none !important;
}
/***********/
@media (max-width: 991.9px) {
    h1 {
        font-size: 30px;
    }

    .products-list h5 {
        font-size: 14px;
    }

    h2 {
        font-size: 30px;
    }
    .item-related{
        width: 90%;
    }

    .slick-next.slick-arrow, .slick-prev.slick-arrow {
        height: 36px;
        width: 20px;
        background-size: 14px;
        background-position: center;
    }

    .slick-next.slick-arrow {
        right: -5%;
    }

    .slick-prev.slick-arrow {
        left: -5%;
    }

    .item-specifications .btn_collapse {
        font-size: 1rem;
    }

    .brand-overview-tablet {
        display: block;
    }
    .brand-overview-desktop,
    .brand-overview-mobile {
        display: none;
    }

    #inquiry-modal .modal-xl {
        max-width: 500px;
    }

    .inquiry-container {
        flex-wrap: wrap;
    }

    #inquiry-modal .img-container,
    #email-this-item-modal .img-container {
        width: 100%;
        min-height: 400px;
    }
}

@media (max-width: 767.9px) {
    .main_page_container .item-page-top .item-icons {
        flex-wrap: nowrap;
        overflow-x: scroll;
        padding-left: 0px;
    }
    .item-image {
        border: none;
    }
    .item-page-top {
        flex-wrap: wrap;
        width: 100%;
        padding: 15px;
    }

    .item-page-top > aside,
    .item-page-top > div {
        width: 100%;
    }

    .item-icons, .item-image {
        margin-top: 0;
    }

    h2 {
        font-size: 24px;
    }

    .products-list .item {
        width: 50%;
    }
    .item-image {
        order: 0;
    }
    .item-icons {
        order: 1;
    }

    .brand-overview-mobile {
        display: block;
    }
    .brand-overview-desktop,
    .brand-overview-tablet {
        display: none;
    }

    #inquiry-modal,
    #email-this-item-modal {
        z-index: 9999999999;
    }
}

.btn-citi-pay-learn {
    background: rgb(49, 114, 171);
    border: 1px solid rgb(49, 114, 171);
    border-radius: 0px;
    padding: 10px 40px 13px 40px;
    line-height: 1;
    color:#fff!important;
}
.btn-citi-pay-learn:hover {
    opacity: 0.9;
}
#citi-pay-modal {
    font-size: 14px;
}

.slick-slider .products-list h5 {
    word-break: break-all;
}

.slide-enter-active, .slide-leave-active {
    transition: all 0.5s ease;
}

.slide-enter, .slide-leave-to {
    opacity: 0;
    transform: translateY(20px); /* Example slide effect */
}

/* Container for horizontal scrolling */
.model-filters .button-scroll-container {
    display: flex; /* Keeps items inline and doesn't expand the container */
    gap: 10px;
    flex-wrap: wrap; /* Ensures content wraps properly if needed */
    justify-content: flex-start;
}

/*!* Hide scrollbar for Webkit browsers *!*/
/*.model-filters .button-scroll-container::-webkit-scrollbar {*/
/*    display: none;*/
/*}*/

/* Styling for buttons */
.model-filters .model-btn {
    display: flex;
    flex: 0 0 auto; /* Prevent buttons from shrinking */
    cursor: pointer;
    justify-content: end;
    flex-direction: column;
    align-items: center;
    font-size: .875rem;
    line-height: 1.5;
    border: 1.5px solid #DDDDDD;
    background-color: #ffffff;
    height: fit-content;
}
.model-filters .model-btn .model-label {
    padding: .25rem .5rem;
    background-color: #DDDDDD;
    width: 100%;
    text-align: center;
}
.model-filters .model-img{
    background-color: #ffffff;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.model-filters .model-btn.active{
    border-color: #FF3C3C;
}
/* Selected button style */
.model-filters .model-btn.active .model-label {
    color: #ffffff;
    border-color: #FF3C3C;
    background-color: #FF3C3C;
}
/* Button hover effect */
.model-filters .model-btn:hover{
    border-color: #FF3C3C;
}
.model-filters .model-btn:hover .model-label {
    background-color: #FF3C3C;
    color: #ffffff;
    border-color: #FF3C3C;
}

.model-filters .model-row{
    display: flex;
    width: 100%;
    flex-direction: column;
}
#mcanvas {
    width: 100%;
    max-width: 100%;
    height: 500px;
}
/*, .product-html-div #mcanvas*/
.product-html-div iframe, .product-html-div video{
    width: 100%;
    aspect-ratio: 1/1;
    height: auto;
}
@media (min-width: 768px) and (max-width: 1260px) {
    .product-html-div {
        display: contents;
    }
}
@media (min-width: 768px) {
    .item-icons, .item-image {
        margin-top: 20px;
        position: sticky;
        top: 10px;
        height: min-content;
    }
}
/* Container for horizontal scrolling */
.metal-container {
    display: flex; /* Keeps items inline and doesn't expand the container */
    gap: 10px;
    flex-wrap: wrap; /* Ensures content wraps properly if needed */
    justify-content: flex-start;
    position: relative;
}
.metal-container img{
    width: 30px;
    height: 30px;
    border: 2px solid #fff;
    border-radius: 50%;
}
.metal-container .metal-img{
    display: block;
    border: 1.8px solid #fff;
    border-radius: 50px;
}
.metal-container .metal-img.active{
    border-color: #000;
}

.metal-container .metal-img:hover{
    border-color: #000;
}
.matertial-title{
    font-size: 12px;
}
body div:last-child[style*="position: absolute"][style*="z-index: 9999"] {
    display: none !important;
}