@font-face {
  font-family: "Barlow";
  src: url("/fonts/Barlow-Medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Barlow";
  src: url("/fonts/Barlow-SemiBold.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Barlow";
  src: url("/fonts/Barlow-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

html,
body {
  font-family: "Barlow", sans-serif !important;
}

.auth-shell,
#root {
  font-family: "Barlow", sans-serif !important;
}

button,
input,
select,
textarea {
  font: inherit !important;
}

/* Mantiene la barra inferior en una sola capa de composicion en Safari PWA. */
.bottom-nav,
.ma-bottom-nav {
  -webkit-backface-visibility: hidden !important;
  backface-visibility: hidden !important;
  isolation: isolate !important;
}

.bottom-nav .nav-item,
.bottom-nav .nav-item-link,
.ma-bottom-nav .nav-item,
.ma-bottom-nav .nav-item-link {
  -webkit-backface-visibility: hidden !important;
  backface-visibility: hidden !important;
}

/* Mantiene el icono de Tina identico desde el primer frame en todas las vistas. */
.ma-nav-icon--tina {
  align-items: center !important;
  background-color: currentColor !important;
  display: flex !important;
  flex: 0 0 22px !important;
  height: 22px !important;
  justify-content: center !important;
  margin: 0 auto !important;
  transform: translateY(-1px) !important;
  width: 22px !important;
  -webkit-mask-image: url("/imgs/ui/tina-nav.svg") !important;
  -webkit-mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
  -webkit-mask-size: 16px 15px !important;
  mask-image: url("/imgs/ui/tina-nav.svg") !important;
  mask-position: center !important;
  mask-repeat: no-repeat !important;
  mask-size: 16px 15px !important;
}

.ma-nav-icon--tina svg,
.ma-nav-icon--tina img {
  display: none !important;
}