body {
    font-size-adjust: .63
}

.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    margin-left: -1px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.input-group.has-validation>.dropdown-toggle:nth-last-child(n+4), .input-group.has-validation>:nth-last-child(n+3):not(.dropdown-toggle):not(.dropdown-menu), .input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3), .input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.input-group .btn {
    position: relative;
    z-index: 2;
}

/***** Cart *****/

.cartArea {
    position: sticky;
    z-index: 999;
    bottom: 0;
    right: 0;
    display: ruby-text;
}

.cartArea .btn-group {
    box-shadow: rgb(0 0 0 / 20%) 0px 0px 10px 2px;
    height: 60px;
    margin-bottom: 62px;
    
}

/* Aggiungi questa media query per dispositivi con una larghezza massima di 767px (o un'altra dimensione se preferisci) */
@media only screen and (max-width: 767px) {
    .mobile-only {
        display: block; /* Visualizza l'elemento solo su dispositivi mobili */
    }
}

/* Nascondi l'elemento su schermi più grandi */
@media only screen and (min-width: 768px) {
    .mobile-only {
        display: none; /* Nascondi l'elemento su schermi più grandi */
    }
}


@media (max-width: 767px) { 
    .cartArea {
        width: 100%;
    }
    .cartArea .btn {
        border-radius: 0;
    }
    .cartArea .btn-group {
        width: 100%;
    }
}

@media (min-width: 768px) { 
    .cartArea .btn-group {
        margin-bottom: 50px;
        margin-right: 50px;
        height: 50px;
        border-radius: 0.42rem;
    }
}

/* FA Icons style */
.svg-inline--fa.svg-icon-primary [fill]{
    fill: var(--primary)
}
.svg-inline--fa.svg-icon-success [fill]{
    fill: var(--success)
}
.svg-inline--fa.svg-icon-info [fill]{
    fill: var(--info)
}
.svg-inline--fa.svg-icon-warning [fill]{
    fill: var(--warning)
}
.svg-inline--fa.svg-icon-danger [fill]{
    fill: var(--danger)
}
.svg-inline--fa.svg-icon-md {
    width: 1rem;
    height: 1rem;
    padding: 0.25rem;
}
/*.svg-inline--fa.svg-icon-primary:hover [fill], .svg-inline--fa.svg-icon-success:hover [fill], .svg-inline--fa.svg-icon-info:hover [fill], .svg-inline--fa.svg-icon-warning:hover [fill], .svg-inline--fa.svg-icon-danger:hover [fill] {*/
.btn:hover:not(.btn-text):not(:disabled):not(.disabled) .svg-inline--fa [fill], .btn:focus:not(.btn-text) .svg-inline--fa [fill], .btn.focus:not(.btn-text) .svg-inline--fa [fill] {
    fill: var(--white)
}

/* React Select - Menu Portal con z-index elevato */
.react-select-portal-menu {
    /* Questa classe può essere applicata direttamente al componente Select */
}

.react-select-portal-menu .react-select__menu-portal {
    z-index: 9999 !important;
}

/* Rimuovo il padding-top  dal kt_aside */
@media (min-width: 992px) {
    .header-fixed.aside-static .aside {
        padding: 0!important; 
    }
.burger-icon span,.burger-icon span::before,.burger-icon span::after { background-color: white!important}
}

/* Stile paragrafo per IMS Guide */
.ims-guide-paragraph {
    font-size: 1.05rem;
    line-height: 1.6;
    color: #2c3e50;
    background: linear-gradient(180deg, rgba(0,0,0,0.03), rgba(0,0,0,0.01));
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

@media (max-width: 767px) {
    .ims-guide-paragraph {
        font-size: 1rem;
        padding: 0.65rem 0.9rem;
    }
}

/* Wrapper e container del video IMS per responsività */
.ims-guide-player-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0.75rem 0 1rem;
}

.ims-guide-player-container {
    display: block;
    background: #000;
    border-radius: 0.5rem;
    overflow: hidden;
}

/* Desktop: adattamento basato sull'altezza del video */
.ims-guide-player-container.desktop {
    height: 70vh; /* regola l'altezza per adattare il layout */
    aspect-ratio: 16 / 9;
    max-width: 100%;
}

/* Mobile: adattamento basato sulla larghezza (lunghezza) */
.ims-guide-player-container.mobile {
    /* width: 100%;
    aspect-ratio: 16 / 9;
    height: auto; */
}

.ims-guide-player {
    width: 100% !important;
    height: 100% !important;
}