@import url(./variables-formulit3.css?v=3);
@import url(./tables-quasar.css?v=3);
@import url(./cards-informativos.css?v=4);
@import url(./dias-inventario.css?v=1);
@import url(./animations-formulit3.css?v=7);
@import url(./other-buttons.css?v=2);
@import url(./resoluciones.css?v=2);
@import url(./info-page/main.css?v=2);
@import url(./login-formulit3.css?v=2);
@import url(./escritorio/main.css?v=2);

body{
    background-color: var(--background-color) !important;
}
/*
    FORMULIT3:
*/
.nav-function-top .page-sidebar .primary-nav .nav-menu > li a{
    font-size: .75rem;
}

.user-name-title-container{
    display: flex !important;
    justify-content: center;
    align-items: center;
}

.active-tab-fl3 {
    position: relative !important;
}

.active-tab-fl3::after {
    content: "";
    position: absolute;
    inset: 60% 0 0 0;
    margin: auto;
    border-bottom: 2px solid #ff6822;
    z-index: -1;
}

.alerta-vencimientos{
    background-color: var(--alerta-rangos-color-main-fl3);
    color: var(--alerta-rangos-color-texto-fl3);
    animation: alerta-vencimientos 1.5s infinite;
}

.bg-content-stadistics{
    background: #2e3f6423;
    border: #0582ac3f 1px solid;
}

.stadistics-title-tab-fl3 {
    background: var(--titile-tab-gradient-gradient-fl3);
    border-radius: 2px;
    font-size: 1.2rem;
    text-size-adjust: auto;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6);
    border: #001eff75 solid 1px;
}

.cursor-animated {
    animation: cursor-icon-pulse infinite .55s linear alternate;
}

.animated-none{
    animation: none !important;
}

.golden-card-fl3 .card-module-img-bg-fl3 {
    content: url(../../img/Farmi-eva-Azul.webp) !important;
}

.golden-card-fl3:hover .card-module-img-bg-fl3 {
    content: url(../../img/Farmi-eva-Blanco.webp) !important;
}

.ventas-title-fl3 {
    --titile-tab-gradient-gradient-fl3: linear-gradient(120deg, #a9d1ffe7 10%, rgba(128, 163, 240, 0.856), rgb(255, 255, 255));
}

.compras-title-fl3 {
    --titile-tab-gradient-gradient-fl3: linear-gradient(120deg, #fffc68 5%, rgba(236, 182, 101, 0.856), rgb(255, 255, 255));
}

.inventarios-title-fl3 {
    --titile-tab-gradient-gradient-fl3: linear-gradient(120deg, #bbffaa 5%, rgba(51, 218, 148, 0.856), rgb(255, 255, 255));
    
}

.ventas-perdidas-title-fl3 {
    --titile-tab-gradient-gradient-fl3: linear-gradient(120deg, #e26fa9e7 5%, rgba(250, 87, 87, 0.856), rgb(255, 255, 255));
}

.fill-mag-glass-icon-fl3 {
    fill: linear-gradient(120deg, rgb(158, 66, 29) 5%, rgba(255, 230, 0, 0.855), rgb(60, 94, 207)) !important;
    position: relative;
    isolation: isolate;
}

.fill-mag-glass-icon-fl3::after {
    content: "";
    position: absolute;
    top: 0;
    width: 100px;
    height: 100px;
    background: linear-gradient(120deg, rgb(158, 66, 29) 5%, rgba(255, 230, 0, 0.855), rgb(60, 94, 207));
}

.background-icon-button {
    width: calc(2vw + .71rem);
    height: calc(2vw + .71rem);
    filter: drop-shadow(#c5f1ff 0px 0px 3px) !important;
}

.text-critic-animated{
    animation: text-critic-animated infinite 1.35s linear alternate;
}

.card-modules-fl3:hover .card-module-small-text-fl3{
    color: #ffffff !important;
}

.active-tab-fl3 .nav-link-text, .active-tab-fl3 i {
    color: #ff6822 !important;
    text-shadow: #ff9029 0px 0px 1px !important;
}

.classVencimientos .nav-link-text, .classVencimientos i {
    color: #ffffff !important;
    text-shadow: #ffffff 0px 0px 1px !important;
}

.text-nombre-drogueria{
    font-size: calc(.3rem + 1vw) !important;
    font-weight: bold !important;
}

.asistent-ia-card-fl3::after {
    width: 130% !important;
    height: 130% !important;
    animation: distri-ia-card-fl3 infinite 2.5s alternate;
}

.asistent-ia-card-fl3 {
    --card-background-fl3: linear-gradient(120deg, rgb(255 196 64) 5%, #ff3c00e1, rgb(255, 244, 229));
    --image-bg-card-fillcolor-fl3:  rgba(186, 77, 75, 0.959);
}

.asistent-ia-card-fl3 .card-module-small-text-fl3{
    color: #ffffff !important;
}

.distri-card-fl3::after {
    width: 130% !important;
    height: 130% !important;
    animation: distri-card-fl3 infinite 2.5s alternate;
}

.distri-card-fl3 {
    --card-background-fl3: linear-gradient(120deg, rgb(7, 26, 31) 5%, #073a3a9f, rgb(12, 161, 161));
    --card-module-subtitle-color-fl3: #ffffff;
    --icon-gradient-gradient-color-fl3: linear-gradient(180deg, #0a9774, #0752359f);
    --image-bg-card-fillcolor-fl3:  rgba(0, 167, 153, 0.274);
}

.sparkly-card-fl3 {
    animation: shiny-bg infinite 2.5s;
    --card-background-fl3: linear-gradient(120deg, rgb(20, 193, 236) 5%, rgba(0, 109, 211, 0.855), rgb(22, 26, 255));
    --card-module-separator-color-fl3: #89e1fc;
    --card-module-title-color-fl3: #d4f3ff;
    --card-module-subtitle-color-fl3: #c0d5ff;
    --card-modules-circle-icon-color-container-fl3: #017a7a9f;
    --icon-gradient-gradient-color-fl3: linear-gradient(180deg, #0099cc, #001eff);
    --image-bg-card-fillcolor-fl3:  rgba(190, 205, 219, 0.1);
}

.golden-card-fl3 {
    animation: shiny-bg infinite 2.5s;
    --card-background-fl3: linear-gradient(120deg, rgb(255 253 172) 5%, rgb(255 153 0 / 64%), rgb(255 248 22 / 96%));
    --card-module-separator-color-fl3: #b38812;
    --card-module-title-color-fl3: #332121;
    --card-module-subtitle-color-fl3: #332121;
    --card-modules-circle-icon-color-container-fl3: #b38812;
}

.informes-card-fl3 {
    --card-module-title-size-fl3: 1rem;
    border-radius: 10px !important;
    display: flex;
    flex: 1 0 100%;
    align-items: center;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    padding: .61rem;
    border-radius: 20px;  /* Borde redondeado */
    box-shadow: #7f84ad 3px 3px 10px 2px;
    transition: all 0.4s ease-in-out;
}

.informes-golden-card-fl3 {
    
    --card-module-separator-color-fl3: #b38812;
    --card-module-title-color-fl3: #332121;
    --card-modules-circle-icon-color-container-fl3: #b38812;
    /* --card-module-subtitle-color-fl3: #332121; */
    
    animation: formulit3-bg-img-simple-pulse infinite 2.5s;
    transition: all 0.4s ease-in-out;
    background: linear-gradient(120deg, rgb(255 253 172) 5%, rgb(255 153 0 / 64%), rgb(255 248 22 / 96%));
}

.informes-card-fl3:hover {
    --card-module-title-color-fl3: #ffffff;
    --icon-gradient-gradient-color-fl3: #ffffff;
    --card-modules-circle-icon-color-container-fl3: #ffffff;
    background: linear-gradient(120deg, rgb(20, 157, 236) 5%, rgba(0, 49, 211, 0.855), rgb(60, 94, 207));
}

.informes-golden-card-fl3:hover {
    --card-module-title-color-fl3: #172b85;
    --icon-gradient-gradient-color-fl3: #6e4d0e;
    --card-modules-circle-icon-color-container-fl3: #976f24;
    background: linear-gradient(120deg, rgb(255, 254, 205) 5%, rgba(255, 251, 245, 0.855), rgb(236, 225, 175));
    border-image: linear-gradient(120deg, rgb(34, 34, 18) 5%, rgba(211, 127, 0, 0.855), rgb(255, 115, 22)) 1;
}


.card-modules-fl3 {
    border-radius: 10px !important;
    display: flex;
    flex: 1 0 100%;
    align-items: center;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    padding: .61rem;
    border-radius: 20px;  /* Borde redondeado */
    box-shadow: #7f84ad 3px 3px 10px 2px;
}

.card-modules-fl3::before {
    content: "";
    position: absolute;
    inset: -2px; /* Controla el grosor del borde */
    background: linear-gradient(180deg, #1ac6ff, #001eff); /* Degradado */
    border-radius: inherit; /* Mantiene el border-radius */
    z-index: -3; /* Se coloca detrás del contenido */
}

.card-modules-fl3::after {
    content: "";
    position: absolute;
    inset: 2px; /* Ajusta para que coincida con el borde real */
    background: var(--card-background-fl3);
    border-radius: inherit;
    transition: 0.15s ease-in-out all;
    z-index: -2; /* Se coloca encima del degradado, pero detrás del contenido */
}

.card-modules-circle-icon-container-fl3 {
    border: .4rem solid var(--card-modules-circle-icon-color-container-fl3) !important;
    border-radius: 50% !important;
    width: 5rem !important;
    height: 5rem !important;
    flex-shrink: 0;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    z-index: 1;
}

.icon-gradient {
    background: var(--icon-gradient-gradient-color-fl3); /* Degradado */
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    width: 100% !important;
}

.card-module-separator-fl3 {
    z-index: 1;
    margin: 0 1rem;
    border: var(--card-module-separator-color-fl3) solid 1px;
    max-height: 8rem;
    min-height: 5rem;
    height: fit-content;
}

.card-module-typography-section-fl3 {
    /*
    fill-available: Ocupa el espacio disponible dentro del contenedor
    */
    width: -moz-available; /* Firefox */
    width: -webkit-fill-available; /* Safari y Chrome */ 
    width: fill-available;
    z-index: 1;
}

.image-bg-card-fl3{
    position: absolute;
    bottom: -3%;
    left: 58%;
    fill: var(--image-bg-card-fillcolor-fl3);
    z-index: -1;
}

.grid-collection-fl3{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(clamp(200px, 30%, 35%), 1fr));
    gap: 1rem;
    padding: 1rem;
    margin: 0 auto;
}

.card-module-title-fl3 {
    font-size: var(--card-module-title-size-fl3);
    color: var(--card-module-title-color-fl3) !important;
    z-index: 2;
    text-shadow: 1px 0 2px #f57800 !important;
}

.card-module-subtitle-fl3 {
    font-size: .81rem !important;
    color: var(--card-module-subtitle-color-fl3);
    z-index: 2;
}

.card-module-img-bg-fl3{
    width: 90% !important;
    z-index: 1;
}

.card-modules-fl3:hover::after{
    background: #285999;
}

.card-modules-fl3:hover .card-module-title-fl3{
    color: #fff !important;
}

.card-modules-fl3:hover .card-module-subtitle-fl3{
    color: #ffffff !important;
}

.card-modules-fl3:hover .icon-gradient{
    background: linear-gradient(180deg, #ffffff, #c4cbff); /* Degradado */
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.card-modules-fl3:hover .image-bg-card-fl3{
    fill: #e5fbffbe !important;
    opacity: 0.5;
}

/* width */
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #888;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555;
}