@import "reset.css";
@import "variables.css";

/* Font */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');

/* Font Awesome */
@import "fontawesome/css/all.css";
@import "icons.css";

/* Margenes */
@import "margenes.css";

/* Texts */
@import "text.css";

/* Componentes */
@import "header.css";
@import "footer.css";
@import "botones.css";
@import "formularios.css";
@import "tabs.css";
@import "capsulas.css";
@import "cards.css";
@import "referencias.css";
@import "notificaciones.css";

/* Modulos */
@import "onboard.css";
@import "login.css";
@import "calendario.css";
@import "salud.css";
@import "perfil.css";


/* Popups */
@import "popups.css";

    
/* SPLASH */

body.splash {
    background: white;
}
body.splash a {
    width:100vw;
    height:100vh;
    display: flex;
    justify-content:center;
    align-items:center;
}
.splash-animation {
    position:relative;
}
.splash-animation svg {
    position:absolute;
    top:calc(50% - 1rem);
    left: 1.5625rem;
}
.circle-gradient {
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    background:var(--gradient-violeta-rojo);
    height:12rem;
    width:12rem;
    border-radius:50%;
    z-index:-2;
    animation-name:rotate;
    animation-duration:1s;
    animation-iteration-count: infinite;

}

@keyframes rotate {
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg)}
}

.circle-gradient:after {
    position:absolute;
    content:"";
    display:block;
    height:11rem;
    width:11rem;
    background:white;
    border-radius:50%;
    z-index:-1;
}






/*a,
a:active,
a:visited,
a:hover {
    color:inherit;
}*/

/* APP */

body {
    background: var(--color-gris-claro);
    font-family: 'Roboto', sans-serif;
    min-height:100vh; 
}

main {
    padding: 1.5rem 1rem;  
}

.pantalla-bottom-nav {
    padding-bottom: 3.5rem;
}

/* ONBOARDING */

*[class*="onboard"] {   
    background: var(--gradient-violeta-azul);     
}

*[class*="onboard"] a {
    display:flex;
    height: 100vh;
    width: 100vw;
    align-items:center;
    justify-content:center;
    color: white;
    text-align:center;
}

*[class*="onboard"] p {
    font-size:var(--font-size-14);
    line-height:150%;
}

.onboard1 img {
    width: 13.75rem;    
}

.linedots {
    display: flex;
    justify-content: space-between;
    width:3.25rem;
    margin: 3rem auto;
}

.linedots span:before {
    color: var(--color-gris-claro-intermedio);
    font-size:var(--font-size-12);
}


.selector-fecha {
    display:flex;
    align-items: center;
    justify-content:space-between;
    color: var(--color-violeta);
}
.selector-fecha i:before {
    color: var(--color-rosa);
}

/* UTILITIES */

.display-flex {
    display:flex;
    align-items:center;
}

.space-between {
    justify-content:space-between;
}

.flex-end {
    justify-content:flex-end;
}

.position-fixed {
    position:fixed !important;
}

.text-align-center {
    text-align:center;
}
.border-bottom {
    border-bottom: 1px solid var(--color-gris-claro-intermedio);
    padding:0.5rem;
}