/*Email Sign Up */

#email-sign-up-form span.text-error {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    line-height: 1;
}

    #email-sign-up-form span.text-error::before {
        content: "";
        width: 1em;
        height: 1em;
        flex-shrink: 0;
        background-color: currentColor;
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32a224 224 0 1 1 0 448 224 224 0 1 1 0-448zm0 480A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c-8.8 0-16 7.2-16 16V272c0 8.8 7.2 16 16 16s16-7.2 16-16V144c0-8.8-7.2-16-16-16zm24 224a24 24 0 1 0 -48 0 24 24 0 1 0 48 0z'/%3E%3C/svg%3E");
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32a224 224 0 1 1 0 448 224 224 0 1 1 0-448zm0 480A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c-8.8 0-16 7.2-16 16V272c0 8.8 7.2 16 16 16s16-7.2 16-16V144c0-8.8-7.2-16-16-16zm24 224a24 24 0 1 0 -48 0 24 24 0 1 0 48 0z'/%3E%3C/svg%3E");
        mask-repeat: no-repeat;
        mask-size: contain;
    }

#email-sign-up-form input::placeholder {
    color: var(--c-near-black) !important;
    font-family: var(--font-primary);
    opacity: 1;
}

#email-sign-up-form input::-moz-placeholder {
    color: var(--c-near-black) !important;
    font-family: var(--font-primary);
    opacity: 1;
}

/*Request Call back form*/

#callback-form span.text-error {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    line-height: 1;
}

    #callback-form span.text-error::before {
        content: "";
        width: 1em;
        height: 1em;
        flex-shrink: 0;
        background-color: currentColor;
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32a224 224 0 1 1 0 448 224 224 0 1 1 0-448zm0 480A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c-8.8 0-16 7.2-16 16V272c0 8.8 7.2 16 16 16s16-7.2 16-16V144c0-8.8-7.2-16-16-16zm24 224a24 24 0 1 0 -48 0 24 24 0 1 0 48 0z'/%3E%3C/svg%3E");
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32a224 224 0 1 1 0 448 224 224 0 1 1 0-448zm0 480A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c-8.8 0-16 7.2-16 16V272c0 8.8 7.2 16 16 16s16-7.2 16-16V144c0-8.8-7.2-16-16-16zm24 224a24 24 0 1 0 -48 0 24 24 0 1 0 48 0z'/%3E%3C/svg%3E");
        mask-repeat: no-repeat;
        mask-size: contain;
    }

#callback-form input::placeholder {
    color: var(--c-near-black) !important;
    font-family: var(--font-primary);
    opacity: 1;
}

#callback-form input::-moz-placeholder {
    color: var(--c-near-black) !important;
    font-family: var(--font-primary);
    opacity: 1;
}

#callback-form .toggle:has(.toggle__input:checked):before {
    background-color: var(--c-navy-blue);
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='9' fill='none'%3E%3Cpath fill='%23fff' d='M10.195.469c.117-.117.305-.117.399 0l.68.656c.093.117.093.305 0 .398L4.241 8.555a.27.27 0 0 1-.398 0L.704 5.438c-.095-.118-.095-.305 0-.399l.679-.68c.094-.093.281-.093.398 0l2.25 2.274L10.195.469Z'/%3E%3C/svg%3E");
    border-color: var(--c-near-black)
}

#callback-form .toggle + span.text-error {
    display: flex;
    width: 100%;
    margin-top: -1.5rem;
}

/* Callback Modal layout – header + input text fixes */

#callback-modal {
    align-items: flex-start;
    padding-block: 1rem;
    /* Scroll lives on the dialog element, not inside the white card */
    overflow-y: auto;
    max-height: 100dvh;
    scrollbar-width: none; /* Firefox – hide scrollbar track */
}

    #callback-modal::-webkit-scrollbar {
        display: none; /* Chrome / Safari – hide scrollbar track */
    }

    #callback-modal .modal__inr {
        margin-block: 0;
        padding-block-start: 3.5rem;
        /* Remove internal scroll – let the dialog element scroll instead */
        overflow: visible;
        max-height: none;
    }

#callback-modal-title {
    display: block;
    visibility: visible;
    opacity: 1;
    color: var(--c-near-black);
    clip: auto;
    width: auto;
    height: auto;
}

/* Input text: --c-grey-1 (#666) is too low contrast on #f9f9f9 */
#callback-form .form-field__input input,
#callback-form .form-field__input select,
#callback-form .form-field__input textarea {
    color: var(--c-near-black);
}

#callback-form input.text-error,
#callback-form select.text-error,
#callback-form textarea.text-error {
    color: var(--c-near-black);
}

#callback-form .form-field__label,
#callback-form p,
#callback-form .toggle__label {
    color: var(--c-near-black);
}

.slide-out-panel {
    transform: translateX(100%) translateY(0%);
    visibility: hidden;
    transition: transform .9s ease, visibility 0s linear 0.9s;
}

    .slide-out-panel.slide-in {
        transform: translateX(0) translateY(0%);
        visibility: visible;
        transition: transform .9s ease, visibility 0s linear 0s;
    }
.masthead-carousel .swiper-button-prev, .masthead-carousel .swiper-button-next {
    height: 1.5rem !important;
    margin-top: -0.90rem !important; /* re-centre: -(height/2) */
   
}

    .masthead-carousel .swiper-button-prev::after, .masthead-carousel .swiper-button-next::after {
        font-size: 1rem !important; /* controls the arrow glyph size */
    }
.swiper-button-prev svg path,
.swiper-button-next svg path {
    fill: #f3f4f5;
    text-shadow: 0 0 5px #f3f4f5, 0 0 5px #f3f4f5; /* Creates a slightly thicker edge */
}

.cookie-manager__wrapper {
    max-width: var(--rt-max-width, 52.6875rem);
    margin-inline: auto;
}
#modal-current-price, #modal-was-price {
    color: var(--c-navy-blue) !important;
}
/* Force override all default Swiper styles */
.masthead-carousel .swiper-button-prev svg,
.masthead-carousel .swiper-button-next svg {
    width: 2px !important;
    height: 20px !important;
    max-width: 20px !important;
    min-width: 20px !important;
    filter: none !important;
    overflow: visible !important; /* required so stroke doesn't get clipped */
}

    .masthead-carousel .swiper-button-prev svg path,
    .masthead-carousel .swiper-button-next svg path {
        fill: #ffffff !important;
        stroke: #ffffff !important;
        stroke-width: 1 !important; /* increase this value for thicker icon */
        stroke-linejoin: round !important;
        stroke-linecap: round !important;
        filter: none !important;
    }

#mastheadCarouselSwiper,
#mastheadCarouselSwiper .swiper-wrapper,
#mastheadCarouselSwiper .swiper-slide {
    margin: 0 !important;
    padding: 0 !important;
}

#mastheadCarouselSwiper .swiper-slide {
    width: 100% !important;
    transform: translateZ(0); /* forces GPU layer — eliminates sub-pixel bleed */
}