
.cont_fondo_carrito{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 10;
    background: rgba(0, 0, 0, .5); 
    display: flex;
    justify-content: space-between;
    margin-left: 200%;
    opacity: 0;
}

.cont_fondo_carrito{
    justify-content: flex-end;
}
    #cont_fondo_carrito_info{
        margin: 1.5em;
        color: white;
        font-size: 1.2em;
        opacity: .8;
    }
    #cont_fondo_carrito_info span{
        position: relative;
        width: 1.65em;
        height: 1.5em;
        background-color: var(--color_componentes);
        border-radius: .3em;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    #cont_fondo_carrito_info span:after{
        content: '';
        width: 2em;
        height: 2em;
        background:var(--color_componentes);
        border-radius: .3em;
        margin-top: 2em;
        margin-left: 2em;
        position: absolute;
    }

    .cont_carrito{
        width: 100%;
        max-width: 23em;
        background: white;
        margin: 1em;
        border-radius: 1em;
        padding: 2em;
        display: flex;
        flex-direction: column;
        box-shadow: 0 0 1em 1px rgba(0, 0, 0, .3),
        0 0 1em 5px var(--color_principal_3) inset;
        position: relative;
    }
    #body.select_modo_noche .cont_carrito{
        background: var(--fondo_noche);
        box-shadow: 0 0 1em 1px rgba(255, 255, 255, .03),
        0 0 1em 5px var(--color_principal_3) inset;
    }
        #btn_cerrar_carrito{
            margin-left: -.5em;
            margin-top: -.5em;
            width: 2em;
            height: 2.2em;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 100%;
            margin-bottom: 1em;
            cursor: pointer;
            border: 1px;
            border-style: dashed;
            border-color: transparent;
            transition: background-color .5s, border-color .5s;
        }

        #btn_cerrar_carrito:hover{
            border-color: black;
        }
        #body.select_modo_noche #btn_cerrar_carrito:hover{
            border-color: var(--color_principal);
        }

        .cont_carrito .cont_titulo{
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: .5em;
        }
            .cont_carrito .cont_titulo .cont_titulo_icon_1,
            .cont_carrito .cont_titulo .cont_titulo_icon_2{
                opacity: .2;
                position: absolute;
                top: 0;
                right: 0;
                font-size: 4em;
                color: var(--color_principal);
                margin-right: .5em;
                margin-top: .3em;
            }
            .cont_carrito .cont_titulo .cont_titulo_icon_2{
                opacity: .13;
                font-size: 6em !important;
                margin-right: .5em;
                margin-top: .25em;
            }
            .cont_carrito .cont_titulo .cont_titulo_titulo{
                font-size: 1.3em;
                font-weight: bold;
            }
            .cont_carrito .cont_titulo .cont_titulo_productos{
                font-weight: 100;
                font-size: .9em;
            }

        /* CONTENEDOR PRODUCTOS */
        .cont_carrito .cont_productos{
            position: relative;
            padding-top: 2em ;
            height: calc(100% - 10em);
            overflow-y: auto;
            display: flex;
            flex-direction: column;
            border-radius: 1em;
            background-color: transparent;
        }
        
        .cont_carrito .cont_productos .productos{
            display: flex;
            flex-direction: row !important;
            align-items: center;
            /* background: white; */
            border-radius: 1.5em;
            margin-bottom: 2.5em;
            cursor: pointer;
        }

        .cont_carrito .cont_productos .productos:nth-last-child(1){
            margin-bottom: 1em !important;
        }
            .cont_carrito .productos .productos_fondo_imagen{
                background: var(--color_principal_3) !important;
                border-radius: 1em;
                width: 5em;
                height: 5em;
                position: relative;
                margin-right: 2em;
                position: relative;
                cursor: pointer;
            }
            .cont_carrito .productos .productos_fondo_imagen:after{
                content: '';
                top: 0;
                right: 0;
                position: absolute;
                background: var(--color_principal) !important;
                opacity: .2;
                border-radius: 1em;
                width: 4em;
                margin-top: -1em;
                margin-right: -1em;
                height: 4em;
                z-index: 1;
            }
                .cont_carrito .productos_cont_imagen{
                    margin-top: -.5em;
                    position: absolute;
                    width: 5.5em;
                    height: 5.5em;
                    bottom: 0;
                    left: 0;
                    z-index: 2;
                }
                    .cont_carrito .productos_imagen{
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        padding: 0;
                    }
            .cont_carrito .productos_datos{
                display: flex;
                flex-direction: column;
                width: calc(100% - 4em);
                margin-top: -1em;
            }
                .cont_carrito .productos_datos_titulo{
                    font-weight: 100;
                    cursor: pointer;
                }

                .cont_carrito .productos_datos_precio{
                    font-weight: bold;
                    cursor: pointer;
                    font-size: 1em;
                    margin-top: .3em;
                }
                .cont_carrito .productos_datos_cantidad{
                    display: flex;
                    align-items: center;
                    margin-top: .5em;
                }
                    .cont_carrito .productos_datos_cantidad .productos_datos_cantidad_btn,
                    .cont_carrito .productos_datos_cantidad .productos_datos_eliminar_btn,
                    .cont_carrito .productos_datos_cantidad .productos_datos_eliminar_carrito{
                        background-color: var(--color_principal);
                        width: 1.5em;
                        height: 1.5em;
                        display: flex;
                        cursor: pointer;
                        justify-content: center;
                        align-items: center;
                        border-radius: .5em;
                        border: 1px;
                        border-style: dashed;
                        border-color: transparent;
                        margin-left: .7em;
                        padding: .11em .15em;
                        font-size: .9em;
                        transition: background-color .5s, border-color .5s;
                    }
                    #body.select_modo_noche .cont_carrito .productos_datos_cantidad .productos_datos_cantidad_btn,
                    #body.select_modo_noche .cont_carrito .productos_datos_cantidad .productos_datos_eliminar_btn,
                    #body.select_modo_noche .cont_carrito .productos_datos_cantidad .productos_datos_eliminar_carrito{
                        color: black;
                    }

                    .cont_carrito .productos_datos_cantidad .productos_datos_cantidad_btn:hover,
                    .cont_carrito .productos_datos_cantidad .productos_datos_eliminar_btn:hover,
                    .cont_carrito .productos_datos_cantidad .productos_datos_eliminar_carrito:hover{
                        border-color: black;
                        background-color: var(--color_principal);
                    }

                    .cont_carrito .productos_datos_cantidad_lbl{
                        margin-left: .6em;
                    }
                    .cont_carrito .productos_datos_eliminar_btn{
                        margin-left:.6em;
                    }
                    .cont_carrito .productos_datos_eliminar_btn span{
                        font-size: .9em;
                    }

    /* CONTENEDOR PRECIO TOTAL */
    .cont_carrito .cont_total{
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 1em 0;
    }
        .cont_carrito .cont_total .cont_total_titulo{
            font-size: .9em;
        }
        .cont_carrito .cont_total .cont_total_precio{
            font-weight: bold;
        }

    .cont_carrito_btn_next,
    .cont_carrito_btn_add_todo{
        display: flex;
        justify-content: center;
        width: calc(100% - 2em);
        background: var(--color_principal);
        padding: .5em 1em;
        border-radius: .5em;
        cursor: pointer;
        border: 1px;
        border-style: dashed;
        border-color: transparent;
        transition: background-color .5s, border-color .5s;
    }
    #body.select_modo_noche .cont_carrito_btn_next,
    #body.select_modo_noche .cont_carrito_btn_add_todo,
    #body.select_modo_noche .cont_finalizar_btn_finalizar{
        color: black;
    }

    .cont_carrito_btn_next:hover,
    .cont_carrito_btn_add_todo:hover,
    .cont_finalizar_btn_finalizar:hover{
        border-color: black;
    }
    .cont_carrito_btn_add_todo{
        margin-top: 2em;
    }