.cont_usuario{
    opacity: 0;
    margin-left: -200%;
    z-index: 10;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, .5);
    display: flex;
    justify-content: center;
    align-items: center;
}

    .cont_usuario_total{
        background-color: white;
        width: 100%;
        height: calc(100% - 6em);
        max-width: 65em;
        max-height: 65em;
        margin: 1em;
        border-radius: 1.5em;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 2em 2em;
        position: relative;
        box-shadow: 0 0 1em 5px var(--color_principal_3) inset ;
    }
    #body.select_modo_noche .cont_usuario_total{
        background-color: var(--fondo_noche);
    }

        .cont_usuario_contenedor{
            width: 100%;
            height: 100%;
            overflow: hidden;
            display: flex;
            position: relative;
            padding-right: 2em;
            /* margin-left: -100%; */
        }
            /*CONTENEDOR INFORMACION USUARIO */
            .cont_usuario_contenedor_user{
                position: absolute;
                opacity: 1;
                z-index: 1;
                width: calc(100% - 4em) !important;
                height: calc(100% - 2em) !important;
                display: flex;
                flex-direction: column;
                padding-left: 2em;
                padding-right: 1.6em;
                padding-bottom: 2em;
                overflow-y: auto;
            }
                /* CONTENEDOR 1 */
               .cont_informacion{
                    display: flex;
                    flex-direction: row !important;
                    flex-wrap: wrap;
                    align-items: center;
                    justify-content: space-around;
                    position: relative;
                    margin-top: 1em;
               }
               .cont_informacion::before{
                    content: '';
                    position: absolute;
                    width: 100%;
                    height: 70%;
                    background-color: var(--color_principal_3);
                    border-radius: 1.2em;
                    border:1px solid var(--color_principal_3);
               }
                    /* CONTENEDOR DATOS */
                    .cont_datos{
                        display: flex;
                        flex-direction: column;
                        z-index: 1;
                    }
                        .cont_datos_bienvenido,
                        .cont_datos_alias{
                            font-size: 2.5em;
                            font-weight: 700;
                        }
                        .cont_datos_categoria_usuario_titulo{
                            display: flex;
                            align-items: center;
                            margin: 1em 0;
                            color: rgba(0, 0, 0, .7);
                        }
                        
                        #body.select_modo_noche .cont_datos_categoria_usuario_titulo{
                            color: rgba(255, 255, 255, .7);
                        }
                        .cont_datos_categoria_usuario_icono{
                            font-size: 2em;
                            margin-left: .25em;
                        }
                        .cont_datos_categoria_usuario_bronce{
                            color: #FFA307;
                        }
                        .contenedor_design_puntos{
                            display: flex;
                        }
                            .punto,
                            .linea{
                                border-radius: 1.2em;
                                width: .5em;
                                height: .5em;
                                margin-right: .5em;
                                background-color: var(--color_principal_2);
                            }
                            .linea{
                                width: 3em;
                            }

                    /* CONTENEDOR IMAGEN */
                    .cont_imagen_total{
                        display: flex;
                        width: 18em;
                        height: 18em;
                        display: flex;
                        border-radius: 100%;
                        padding: 1em;
                        border-width: 2px;
                        border-style: solid;
                        border-color: var(--color_principal_2);
                        position: relative;
                        margin: 2em;
                    }
                        .cont_imagen_total .cont_imagen {
                            width: 100%;
                            height: 100%;
                            display: flex;
                            justify-content: center;
                            align-items: flex-end;
                            background-color: black;
                            border-radius: 100%;
                            overflow: hidden;
                            border:1px solid black;
                            position: relative;
                        }
                            .cont_imagen_total .cont_imagen .cont_imagen_img{  
                                max-width: 100%;
                                max-height: 100%;
                                object-fit: cover;
                            }
                            .cont_total_cont_imagen_scroll,
                            .cont_total_cont_color_scroll{
                                top: 0;
                                margin-top: 15%;
                                position: absolute;
                                width: 70%;
                                height: 70%;
                                overflow: hidden;
                                /* scroll-snap-type: x mandatory; */
                                visibility: hidden;
                            }
                            .opciones_editar_foto{
                                position: absolute;
                                background-color: rgba(255, 255, 255, .2);
                                border-radius: 100%;
                                width: 2em;
                                height: 2em;
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                visibility: hidden;
                                margin: .5em;
                                font-size: 1.2em;
                                z-index: 1;
                                cursor: pointer;
                                opacity: .5;
                                transition: background-color .4s, opacity .4s;
                                color: white;
                            }
                            .opciones_editar_foto:hover{
                                opacity: 1;
                            }
                            .opciones_editar_foto_visible{
                                visibility: visible;
                            }
                            #btn_seleccionar_editar_foto{
                                top: 0;
                                background-color: var(--color_success_2);
                            }
                            #btn_left_editar_foto{
                                left: 0;
                                top: 0;
                                margin-top: calc(50% - 1em);
                            }
                            #btn_right_editar_foto{
                                right: 0;
                                top: 0;
                                margin-top: calc(50% - 1em);
                            }
                            #btn_cerrar_editar_foto{
                                bottom: 0;
                                background-color: var(--color_danger_1);
                            }
                            .cont_total_cont_imagen_scroll_visible,
                            .cont_total_cont_color_scroll_visible{
                                visibility: visible;
                                animation: cont_total_cont_imagen_scroll_visible;
                                animation-duration: 1s;
                                animation-iteration-count: 1;
                                animation-fill-mode: forwards;
                            }
                            @keyframes cont_total_cont_imagen_scroll_visible{
                                0%{
                                    opacity: 0;
                                }
                                100%{
                                    opacity: 1;
                                }
                            }
                            .cont_total_cont_imagen_scroll .cont_total_cont_imagen_contenedor,
                            .cont_total_cont_color_scroll .cont_total_cont_color_contenedor{
                                display: flex;
                                width: 1000%;
                                height: 100%;
                            }
                            .cont_total_cont_imagen_img,
                            .cont_total_cont_imagen_color{
                                /* scroll-snap-align: start; */
                                width: 100%;
                                height: 100%;
                                display: flex;
                                justify-content: center;
                                align-items: center;
                            }
                            .cont_total_cont_imagen_color .color_avatar{
                                width: 4em;
                                height: 4em;
                                border-radius: 100%;
                                box-shadow: 0 0 .5em 1px white inset;
                            }
                            .color_avatar_1{
                                background-color: black !important;
                                border-color: black !important;
                            }
                            .color_avatar_2{
                                background-color: #9175DB !important;
                                border-color: #9175DB !important;
                            }
                            .color_avatar_3{
                                background-color: #FE4E58 !important;
                                border-color: #FE4E58 !important;
                            }
                            .color_avatar_4{
                                background-color: #FFA307 !important;
                                border-color: #FFA307 !important;
                            }
                            .color_avatar_5{
                                background-color: brown !important;
                                border-color: brown !important;
                            }
                            .color_avatar_6{
                                background-color: gold !important;
                                border-color: gold !important;
                            }
                            .color_avatar_7{
                                background-color: indigo !important;
                                border-color: indigo !important;
                            }
                            .color_avatar_8{
                                background-color: var(--color_categoria_activa) !important;
                                border-color: var(--color_categoria_activa) !important;
                            }
                            .color_avatar_9{
                                background-color: var(--color_principal) !important;
                                border-color: var(--color_principal) !important;
                            }
                            .color_avatar_10{
                                background-color: lightskyblue !important;
                                border-color: lightskyblue !important;
                            }
                            .cont_total_cont_imagen_img img{
                                max-width: 100%;
                                max-height: 100%;
                                object-fit: cover;

                            }
                            .cont_imagen_img_oculto,
                            .cont_editar_foto_oculto{
                                visibility: hidden;
                            }
                        .cirulo_desing_1,
                        .cirulo_desing_2{
                            position: absolute;
                            width: 3em;
                            height: 3em;
                            border-radius: 100%;
                            display: flex;
                            justify-content: center;
                            align-items: flex-end;
                            overflow: hidden;
                            background-color: black;
                        }
                        .cirulo_desing_1{
                            border:1px solid black;
                            margin-top: .7em;
                            left: 0;
                        }
                        .cirulo_desing_1 img,
                        .cirulo_desing_2 img{
                            max-width: 100%;
                            max-height: 100%;
                            object-fit: cover;
                        }
                        .cirulo_desing_2{
                            width: 5em;
                            height: 5em;
                            margin-bottom: 0;
                            margin-left: -1.8em;
                            left: 0;
                            border:1px solid black;
                            bottom: 0;
                        }
                        .cont_editar_foto{
                            position: absolute;
                            color: white;
                            right: 0 !important;
                            bottom: 0 !important;
                            margin-right: 1.2em;
                            display: flex;
                            align-items: center;
                            cursor: pointer;
                            padding: .2em;
                            background-color: var(--color_categoria_activa);
                            border-radius: 2em;
                        }

                        .cont_editar_foto:hover .btn_editar_foto{
                            /* width: 0;
                            opacity: 0; */

                            animation: animar_ocultar_foto_opcion;
                            animation-delay: .5s;
                            animation-duration: 1s;
                            animation-iteration-count: initial;
                            animation-fill-mode: forwards;
                        }
                        
                        @keyframes animar_ocultar_foto_opcion{
                            0%{
                                opacity: 1;
                            }
                            50%{
                                opacity: 0;
                            }
                            100%{
                                width: 0;
                                opacity: 0;
                            }
                        }
                        .cont_editar_foto:hover .btn_editar_foto_opcion{
                            /* width: 2.2em; */
                            /* opacity: 1; */
                            
                            animation: animar_foto_opcion;
                            animation-duration: 1s;
                            animation-iteration-count: initial;
                            animation-fill-mode: forwards;
                        }
                        @keyframes animar_foto_opcion{
                            0%{
                                width:0;
                                opacity: 0;
                            }
                            100%{
                                width: 2.2em;
                                opacity: 1;
                            }
                        }
                        .cont_editar_foto:hover .boton_eliminar_foto{
                            margin-right: .2em;
                        }

                            .btn_editar_foto{
                                background-color: var(--color_categoria_activa);
                                width: 2.2em;
                                height: 2.2em;
                                font-size: 1.3em;
                                border-radius: 100%;
                                display: flex;
                                align-items: center;
                                justify-content: center;
                                transition: width .4s, opacity.4s, background-color .4s;
                            }
                            .boton_eliminar_foto{
                            }
                            .btn_editar_foto_opcion{
                                width: 0;
                                opacity: 0;
                            }
                            .btn_editar_foto_opcion:hover{
                                background-color: var(--color_categoria_activa_2);
                            }


                /* CON DATOS PERSONALES */
                .cont_datos_personales{
                    display: flex;
                    flex-wrap: wrap;
                }
                    .cont_datos_titulo{
                        width: 100%;
                        font-size: 1.5em;
                        margin-bottom: 2.2em;
                    }
                    .cont_datos_personales .cont_datos{
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        width: calc(50% - 1em - 2px);
                        background-color: var(--color_principal_3);
                        border-radius: 1em;
                        margin: .5em;
                        border: 1px solid rgba(0, 0, 0, .025);
                    }
                        .cont_datos_personales .cont_datos .cont_datos_icono{
                            width: 2em;
                            height: 2em;
                            font-size: 1.2em;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            margin-left: .5em;
                            margin-top: .25em;
                            margin-bottom: .25em;
                            color: var(--color_principal_2);
                        }
                        .cont_datos_personales .cont_datos .cont_datos_input,
                        .cont_datos_personales .cont_datos .cont_select_sexo{
                            width: calc(100% - 5.5em);
                            border: none;
                            height: 2em;
                            background-color: transparent;
                            margin-left: .5em;
                        }
                        #body.select_modo_noche .cont_datos_personales .cont_datos .cont_datos_input{
                            color: white;
                        }
                        .cont_datos_personales .cont_datos .cont_datos_input:focus{
                          outline: none;
                        }

                        .cont_datos_personales .cont_datos .cont_select_sexo{
                            width: 100% !important;
                            display: flex;
                            align-items: center;
                            justify-content: space-between;
                            padding-left: .5em;
                            padding-right: 1em;
                        }
                        .cont_datos_personales .cont_datos .cont_select_sexo .combo_box .fondo{
                            filter: none !important;
                            background-color: var(--color_principal_3_solid);
                            margin-top: 3em;
                        }
                        #body.select_modo_noche .cont_datos_personales .cont_datos .cont_select_sexo .combo_box .fondo{
                            background-color: var(--fondo_noche);
                            border: 1px;
                            border-style: dashed;
                            border-color: var(--color_principal);
                        }
                        .cont_datos_personales .cont_datos .cont_select_sexo .combo_box .fondo .opcion:hover,
                        .cont_datos_personales .cont_datos .cont_select_sexo .combo_box .fondo .opcion.check{
                            background-color: var(--color_principal_2_solid);
                        }
                        #body.select_modo_noche .cont_datos_personales .cont_datos .cont_select_sexo .combo_box .fondo .opcion:hover,
                        #body.select_modo_noche .cont_datos_personales .cont_datos .cont_select_sexo .combo_box .fondo .opcion.check{
                            background-color: var(--color_principal_2);
                        }

            /* CONTENEDOR DESPACHO */
            .cont_datos_despacho{
                display: flex;
                flex-wrap: wrap;
                margin-top: 2.7em;
            }
                .cont_datos_despacho .cont_datos_titulo{
                    width: 100%;
                }
                .cont_datos_despacho .cont_datos{
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    width: calc(100% - 4em);
                    max-width: 10em;
                    padding: 1.5em;
                    border-radius: 1.2em;
                    margin: .5em;
                    background-color: var(--color_principal_3);
                    /* box-shadow: 0 0 .5em 1px var(--color_principal_2); */
                    position: relative;
                }
                    .cont_datos_despacho .cont_datos .cont_datos_num{
                        font-weight: 700;
                        font-size: 1.5em;
                        margin-bottom: .5em;
                    }
                    .cont_datos_despacho .cont_datos .cont_datos_grupo{
                        display: flex;
                        flex-direction: column;
                    }
                    .cont_datos_despacho .cont_datos .cont_datos_dir{
                        font-weight: 700;
                        margin-bottom: .5em;
                    }
                    .cont_datos_despacho .cont_datos .cont_datos_ref{
                        margin-bottom: 2em;
                    }
                    .cont_datos_despacho .cont_datos .cont_datos_icono{
                        display: flex;
                        align-items: center;
                    }

                    .cont_datos_despacho .cont_datos .cont_datos_icono .cont_datos_icono_icon{
                        width: 2.5em;
                        height: 2.5em;
                        display: flex;
                        margin-right: .5em;
                        justify-content: center;
                        align-items: center;
                        background-color: var(--color_principal_3);
                        border-radius: 100%;
                        color: var(--color_principal);
                        cursor: pointer;
                        transition: background-color .4s;
                    }
                    .cont_datos_despacho .cont_datos .cont_datos_icono .cont_datos_icono_icon:hover{
                        background-color: var(--color_principal_2);
                    }
                .cont_datos_despacho .cont_datos.agregar{
                    justify-content: center;
                    align-items: center;
                    background-color: rgba(0, 0, 255, .2);
                    cursor: pointer;
                    border: none;
                }
                .cont_datos_despacho .cont_datos.agregar:hover{
                    background-color: rgba(0, 0, 255, .15);
                }
                .cont_datos_despacho .cont_datos.agregar .cont_datos_icono{
                    font-size: 2em;
                    color: white;
                    background-color: rgba(0, 0, 0, .05);

                }
                .agregar_icono{
                    color: white;
                    font-size: 1.7em;
                    width: 2em;
                    height: 2em;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    border-radius: 100%;
                    background: rgba(255, 255, 255, .1);
                }
                /* Historial */

        .cont_usuario_contenedor_historial{
            opacity: 0;
            z-index: 0;
            position: absolute;
            width: calc(100% - 4em) !important;
            height: calc(100% - 2em) !important;
            display: flex;
            flex-direction: column;
            padding-left: 2em;
            padding-right: 1.6em;
            padding-bottom: 2em;
            overflow-y: auto;
        }
            .cont_usuario_contenedor_historial .cont_informacion{

            }
                .cont_usuario_contenedor_historial .cont_informacion .cont_datos{

                }
                    .cont_usuario_contenedor_historial .cont_informacion .cont_datos .cont_datos_felicidades{
                        font-weight: 600;
                        font-size: 1.5em;
                    }
                    .cont_usuario_contenedor_historial .cont_informacion .cont_datos .cont_datos_estado_cliente{
                        font-size: 1.3em;
                    }
                    .cont_usuario_contenedor_historial .cont_informacion .cont_imagen_total{
                        display: flex;
                        border:none;
                    }

                    .cont_usuario_contenedor_historial .cont_informacion .cont_imagen_total .cont_imagen_total_img{
                        object-fit: cover;
                    }

            /*  CONTENEDOR ESTADISTICAS */
            .cont_estadisticas{
                display: flex;
                flex-direction: column;
                margin-top: .5em;
            }
                /* <!-- CONTENEDOR COMPRAS --> */
                .cont_estadisticas_compra{
                    display: flex;
                    flex-direction: column;
                }
                    .cont_estadisticas_compra_titulo{
                        font-size: 1.5em;
                        margin-bottom: 1.5em;
                    }
                    /* <!-- CONTENEDOR FILTRO --> */
                    .cont_estadisticas_compra_filtro{
                        background: white;
                        position: sticky;
                        z-index: 3;
                        /* padding-top: .5em; */
                        top: 0;
                        padding-bottom: 1.5em;
                        display: flex;
                        flex-wrap: wrap;
                        flex-direction: row;
                        align-items: center;
                        justify-content: space-between;
                    }
                    #body.select_modo_noche .cont_estadisticas_compra_filtro{
                        background: var(--fondo_noche) !important;
                    }
                    /* <!-- CONTENEDOR PAGINACION --> */

                        .cont_estadisticas_compra_filtro .fondo .contenedor .opcion:hover,
                        .cont_estadisticas_compra_filtro .fondo .contenedor .opcion.check{
                            background-color: var(--color_principal_2);
                        }

                        .cont_estadisticas_compra_filtro .cont_filtro{
                            display: flex;
                            flex-wrap: wrap;
                        }
                        .cont_estadisticas_compra_filtro .cont_filtro .combo_box .fondo,
                        .cont_estado_select_estados .combo_box .fondo,
                        .cont_estadisticas_compra_filtro .pagina_seleccionada .fondo{
                            filter: none !important;
                            background-color: var(--color_principal_3_solid);
                            margin-top: 3.2em;
                        }
                        #body.select_modo_noche .cont_estadisticas_compra_filtro .cont_filtro .combo_box .fondo,
                        #body.select_modo_noche .cont_estado_select_estados .combo_box .fondo,
                        #body.select_modo_noche .cont_estadisticas_compra_filtro .pagina_seleccionada .fondo{
                            background-color: var(--fondo_noche);
                            border:1px;
                            border-style: dashed;
                            border-color: var(--color_principal_1);
                        }

                        .cont_estadisticas_compra_filtro .cont_filtro .combo_box .fondo .opcion:hover,
                        .cont_estadisticas_compra_filtro .cont_filtro .combo_box .fondo .opcion.check,
                        .cont_estado_select_estados .combo_box .fondo .opcion:hover,
                        .cont_estado_select_estados .combo_box .fondo .opcion.check{
                            background-color: var(--color_principal_2_solid);
                        }
                        #body.select_modo_noche .cont_estadisticas_compra_filtro .cont_filtro .combo_box .fondo .opcion:hover,
                        #body.select_modo_noche .cont_estadisticas_compra_filtro .cont_filtro .combo_box .fondo .opcion.check,
                        #body.select_modo_noche .cont_estado_select_estados .combo_box .fondo .opcion:hover,
                        #body.select_modo_noche .cont_estado_select_estados .combo_box .fondo .opcion.check{
                            background-color: var(--color_principal_1);
                        }
                        .select_filtro_anio,
                        .select_filtro_mes,
                        .cont_estadisticas_compra_filtro .pagina_seleccionada{
                            width: auto;
                            padding: .7em;
                            border-radius: .5em;
                            margin: .5em;
                            border: none;
                            background-color: var(--color_principal_3);
                        }
                        .select_filtro_mes{

                        }
                        .cont_buscar_productos_comprados{
                            display: flex;
                            align-items: center;
                            background-color: var(--color_principal_3);
                            padding: .4em .5em .4em .5em !important;
                            border-radius: .5em;
                            margin: .5em;
                        }
                            .cont_buscar_productos_comprados .input_buscar{
                                outline: none;
                                width: 100%;
                                border: none;
                                padding: 0;
                                margin: 0;
                                background-color: transparent;
                            }
                            #body.select_modo_noche .cont_buscar_productos_comprados .input_buscar{
                                color: white;
                            }
                            .cont_buscar_productos_comprados.icono{
                                width: 1em;
                                height: 1em;
                                display: flex;
                                justify-content: center;
                                cursor: pointer;
                                background-color: transparent;
                                border: 1px;
                                border-style: dashed;
                                border-color: transparent;
                                transition: border-color .4s;
                                margin: 0 !important;
                            }
                            .cont_buscar_productos_comprados.icono:hover{
                                border-color: black;
                            }

                    /* <!-- CONTENEDOR PRODUCTOS --> */

                .cont_estadisticas_compra_productos{
                    margin-bottom: 1em;
                }
                    .cont_productos_comprados{
                        margin-top: 1em;
                        display: flex;
                        flex-direction: column;
                        border: 1px solid var(--color_principal_2);
                        border-radius: .7em;
                        padding: 0 .5em;
                    }
                        .cont_productos_comprados.cont_cabecera{
                            border:none;
                            display: flex;
                            flex-wrap: wrap;
                            flex-direction: row;
                            justify-content: space-between;
                            align-items: center !important;
                            margin: 1em .5em;
                            border-radius: 0;
                            padding-bottom: 1em;
                            border-bottom: 1px solid var(--color_principal_2);
                        }
                            .cont_cabecera_orden_compra{}
                            .cont_cabecera.cont_estado{
                                display: flex;
                                flex-wrap: wrap;
                                align-items: center;
                            }
                                .cont_estado_titulo{}
                                .cont_estado_select_estados{
                                    width: auto;
                                    padding: .7em;
                                    border-radius: .5em;
                                    margin: .5em;
                                    border: none;
                                    background-color: var(--color_principal_3);
                                }
                    .cont_productos_comprados.cont_total_compra{
                        margin: 0 1em;
                        border:none;
                        border-top: 1px solid var(--color_principal_2);
                        padding: 1em;
                        border-radius: 0;
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: flex-end;
                    }
                        .cont_total_compra_titulo{

                        }
                        .cont_total_compra_valor{
                            font-weight: 700;
                            margin-left: 1em;
                            font-size: 1.2em;
                        }
                    .cont_productos_comprados.cont_detalle{
                        border:none;
                        display: flex;
                        flex-direction: row;
                        justify-content: space-around;
                        align-items: center;
                        flex-wrap: wrap;
                        margin-top: 1em;
                        margin-bottom: 2em;
                    }
                        .cont_productos_comprados.cont_detalle .fondo{
                            display: flex;
                            flex-direction: column;
                            align-items: flex-end;
                            filter: none !important;
                            width: 100%;
                            max-width: 15em;
                            border: 1px solid var(--color_principal_3);
                            border-radius: 1em;
                            margin: 1em;
                            overflow:initial;
                        }
                            .cont_estadisticas_compra_productos .fondo_superior{
                                display: flex;
                                flex-direction: column;
                                background: linear-gradient(125deg, var(--color_principal_1) 5%,var(--color_principal_2) 50%);
                                background: var(--color_principal_2);
                                padding: 1em;
                                border-top-left-radius: 1em;
                                border-top-right-radius: 1em;
                                position: relative;
                                height: 8em;
                                width: calc(100% - 2em);
                            }
                                .cont_estadisticas_compra_productos .fondo_superior_marca{
                                    font-weight: 700;
                                    margin-bottom: 1em;
                                }
                                .cont_estadisticas_compra_productos .fondo_superior_titulo{
                                    font-weight: bold;
                                    white-space: nowrap;
                                    letter-spacing: -5px;
                                    line-height: 100%;
                                    font-size: 6em;
                                    margin-bottom: .25em;
                                    opacity: .1;
                                    position: absolute;
                                    bottom: 0;
                                    left: 0;
                                    text-align: center;
                                    width: 100%;
                                    overflow: hidden;
                                    text-shadow: 0 0 5px rgba(0, 0, 0, 1);
                                    color: var(--color_principal_3);
                                }
                                .cont_estadisticas_compra_productos .fondo_superior_imagen{
                                    position: absolute;
                                    width: 10em;
                                    height: 10em;
                                    display: flex;
                                    right: 0;
                                    margin-right: -2em;
                                    top: 0;
                                    margin-top: -1em;
                                    z-index: 2;
                                }
                                    .cont_estadisticas_compra_productos .fondo_superior_imagen_img{
                                        position: absolute;
                                        width: 100%;
                                        height: 100%;
                                        object-fit: cover;
                                        z-index: 1;
                                    }
                                    .cont_estadisticas_compra_productos .fondo_superior_imagen_fondo{
                                        position: absolute;
                                        width: 100%;
                                        height: 100%;
                                        object-fit: cover;
                                        margin-top: 1.5em;
                                        margin-left: 1em;
                                        filter: blur(5px) opacity(.4) brightness(0);
                                    }
                            .cont_estadisticas_compra_productos .fondo_inferior{
                                width: 100%;
                                display: flex;
                                flex-direction: column;
                                align-items: flex-start;
                                border-top-left-radius: 5em;
                                z-index: 1;
                                position: relative;
                            }
                            .cont_estadisticas_compra_productos .fondo_inferior:before{
                                content: '';
                                position: absolute;
                                width: 100%;
                                height: 1em;
                                background: white;
                                border-top-left-radius: 1em;
                                border-top-right-radius: 1em;
                                margin-top: -1em;
                            }
                            #body.select_modo_noche .cont_estadisticas_compra_productos .fondo_inferior:before{
                                background: black;
                            }
                                .cont_estadisticas_compra_productos .fondo_inferior_titulo{
                                    padding: 0 1em;
                                    font-weight: 700;
                                }
                                .cont_estadisticas_compra_productos .fondo_inferior_fecha{
                                    padding: 0 1.2em;
                                    font-size: .8em;
                                    margin: .25em 0;
                                }
                                .cont_estadisticas_compra_productos .fondo_inferior_calificacion{
                                    padding: 0 1.2em;
                                    margin-top: .25em;
                                    font-size: .8em;
                                }
                                    .cont_estadisticas_compra_productos .fondo_inferior_calificacion_icon.active{
                                        color: var(--color_principal_2);
                                    }
                                    .cont_estadisticas_compra_productos .fondo_inferior_calificacion_icon{
                                        color: var(--color_principal_3);

                                    }
                                .cont_estadisticas_compra_productos .fondo_inferior_titulo_desc{
                                    margin-top: 1em;
                                    font-weight: 700;
                                    font-size: .8em;
                                    margin-bottom: 1em;
                                    margin-left: .3em;
                                }
                                .cont_estadisticas_compra_productos .fondo_inferior_cont_talla{
                                    display: flex;
                                    justify-content: space-between;
                                    flex-wrap: wrap;
                                    padding: 0 .8em;
                                    font-size: .8em;
                                    width: calc(100% - 1.5em);
                                }
                                    .cont_estadisticas_compra_productos .fondo_inferior_cont_talla_numero.active{
                                        background-color: var(--color_principal_2);
                                    }
                                    .cont_estadisticas_compra_productos .fondo_inferior_cont_talla_numero{
                                        padding: .25em;
                                        border-radius: 100%;
                                        display: flex;
                                        justify-content: center;
                                        align-items: center;
                                        margin: .5em;
                                        min-width: 1.5em;
                                        min-height: 1.5em;
                                    }

                                .cont_estadisticas_compra_productos .fondo_inferior_titulo_desc{
                                    padding: 0 1em;
                                    margin-top: 1em;
                                    font-weight: 700;
                                }
                                .cont_estadisticas_compra_productos .fondo_inferior_informacion{
                                    display: flex;
                                    align-items: center;
                                    width: 100%;
                                    margin-left: .7em;
                                    margin-bottom: 1.5em;
                                }
                                    .cont_estadisticas_compra_productos .fondo_inferior_informacion_color{
                                        display: flex;
                                        flex-wrap: wrap;
                                        width: calc(50% + .5em);
                                    }
                                        .cont_estadisticas_compra_productos .fondo_inferior_informacion_color_fondo.active{
                                            border-color:  chartreuse;
                                        }
                                            .cont_estadisticas_compra_productos .fondo_inferior_informacion_color_fondo_color{
                                                border-radius: 100%;
                                                background: chartreuse;
                                                width: 100%;
                                                height: 100%;
                                            }
                                        .cont_estadisticas_compra_productos .fondo_inferior_informacion_color_fondo{
                                            margin: .2em;
                                            border-radius: 100%;
                                            border-width: 1.5px;
                                            border-style: solid;
                                            border-color: transparent;
                                            padding: .2em;
                                            width: 1em;
                                            height: 1em;
                                            display: flex;
                                        }

                                    .cont_estadisticas_compra_productos .fondo_inferior_informacion_precio{
                                        padding: .5em 1em;
                                        font-weight: 700;
                                        background: var(--color_principal_2_solid);
                                        border-radius: .5em;
                                        margin-left: 1em;
                                        width: 50%;
                                        display: flex;
                                        justify-content: center;
                                    }
                                    #body.select_modo_noche .cont_estadisticas_compra_productos .fondo_inferior_informacion_precio{
                                        background: var(--color_principal);
                                        color: black;
                                    }


                /* <!-- CONTENEDOR ESTADISTICAS --> */
                .cont_estadisticas_fondo{
                    display: flex;
                    flex-wrap: wrap;
                    justify-content: center;
                    align-items: center;
                    flex-direction: row;
                    margin-bottom: 2.5em;
                }
                    .cont_estadisticas_fondo .cont_estadisticas_informacion_datos {
                        background-color: var(--color_categoria_activa_3);
                        border-radius: 1.5em;
                        padding: 1.5em;
                        width: 100%;
                        max-width: 16.8em;
                        min-height: 8em;
                        display: flex;
                        flex-direction: row;
                        align-items: flex-end;
                        margin: .5em;
                        margin-bottom: .5em;
                        position: relative;
                        overflow: hidden;
                    }
                    .cont_estadisticas_fondo .cont_estadisticas_informacion_datos:nth-child(2){
                        background-color: var(--color_categoria_activa);
                    }
                    .cont_estadisticas_fondo .cont_estadisticas_informacion_datos:nth-child(3){
                        background-color:#FFA307;
                    }
                        .cont_estadisticas_fondo .cont_datos_icon_1,
                        .cont_estadisticas_fondo .cont_datos_icon_2,
                        .cont_estadisticas_fondo .cont_datos_icon_3,
                        .cont_estadisticas_fondo .cont_datos_icon_4{
                            width: 2.2em;
                            height: 2.2em;
                            background-color:rgba(255, 255, 255, .1);
                            border-radius: 100%;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            color: white;
                            position: absolute;
                            top: 0;
                            right: 0;
                            font-size: 2.5em;
                            margin-right: -.2em;
                            margin-top: -.2em;
                        }
                        .cont_estadisticas_fondo .cont_datos_icon_2{
                            margin-right: 4em !important;
                            margin-top: 1.5em;
                            width: 2em;
                            height: 2em;
                            font-size: 2em;
                        }
                        .cont_estadisticas_fondo .cont_datos_icon_3{
                            bottom: 0 !important;
                            right: 0 !important;
                            top: auto !important;
                            font-size: 1.5em;
                            width: 1.7em;
                            height: 1.7em;
                            margin-bottom: 1em;
                            margin-right: 2em !important;
                        }
                        .cont_estadisticas_fondo .cont_datos_icon_4{
                            right: 0 !important;
                            font-size: 1.5em;
                            width: 1.7em;
                            height: 1.7em;
                            margin-top: 4em;
                            margin-right: .4em !important;
                        }
                        .cont_estadisticas_fondo .cont_datos_informacion{
                            display: flex;
                            flex-direction: column;
                            z-index: 1;
                        }
                            .cont_estadisticas_fondo .cont_datos_informacion_titulo{
                            }
                            .cont_estadisticas_fondo .cont_datos_informacion_dato{
                                font-weight: 700;
                                font-size: 1.2em;
                            }

        .cont_usuario_menu{
            position: absolute;
            bottom: 0;
            margin-bottom: -.5em;
            padding: .5em;
            background-color: white;
            display: flex;
            z-index: 3;
            border-radius: 1.2em;
            box-shadow: 0 0 1em 1px rgba(0, 0, 0, .15);
        }
        #body.select_modo_noche .cont_usuario_menu{
            background-color: var(--fondo_noche);
            box-shadow: 0 0 1em 1px rgba(255, 255, 255, .03),
            0 0 1em 5px var(--color_principal_3) inset;
        }
            .cont_usuario_menu_opcion{
                width: 2em;
                height: 2em;
                display: flex;
                justify-content: center;
                align-items: center;
                font-size: 1.2em;
                border-radius: 1.2em;
                margin:0 .25em;
                border-width: 1px;
                background-color: rgba(0, 0, 0, .05);
                border-style: dashed;
                border-color:transparent;
                transition: opacity .5s;
                cursor: pointer;
                color: white;
                transition: filter .5s, background-color .4s;
                position: relative;
            }

            .cont_usuario_menu_opcion.active{
                position: relative;
            }
            .cont_usuario_menu_opcion.active:after{
                content: '';
                background: var(--color_principal);
                width: 100%;
                height: .25em;
                margin-bottom: -.9em;
                border-radius: 2em;
                position: absolute;
                bottom: 0;
            }

        .cont_usuario_menu .cont_usuario_menu_opcion:nth-child(1){
            background-color: #9E82E8;
        }
        .cont_usuario_menu .cont_usuario_menu_opcion:nth-child(1):hover{
            background-color: #a78eea;
        }

        .cont_usuario_menu .cont_usuario_menu_opcion:nth-child(2){
            background-color:var(--color_warning_1);
        }
        .cont_usuario_menu .cont_usuario_menu_opcion:nth-child(2):hover{
            background-color: var(--color_warning_2);
        }
/* 
        .cont_usuario_menu .cont_usuario_menu_opcion:nth-child(3){
            background-color: var(--color_success_1);
        }
        .cont_usuario_menu .cont_usuario_menu_opcion:nth-child(3):hover{
            background-color:  var(--color_success_2); 
        }
*/
        .cont_usuario_menu .cont_usuario_menu_opcion:nth-child(3){
            background-color: var(--color_success_1);
        }
        .cont_usuario_menu .cont_usuario_menu_opcion:nth-child(3):hover{
            background-color: var(--color_success_2);
        }

        .cont_usuario_menu .cont_usuario_menu_opcion:nth-child(4){
            background-color: var(--color_danger_1);
        }
        .cont_usuario_menu .cont_usuario_menu_opcion:nth-child(4):hover{
            background-color: var(--color_danger_2);
        }

