/* =========================================================
   AS APP · 01 · TIPOGRAFÍA GLOBAL
   ÚNICO PROPIETARIO DE FUENTES, TAMAÑOS, PESOS Y ALTURAS.
   NO DEFINE COLORES, FONDOS, POSICIONES NI ESPACIADOS DE LAYOUT.
   ========================================================= */

/* Base de toda la aplicación */
.as-app-ui,
.as-app,
.as-videos-shell,
.as-account-shell,
.as-subpage,
.as-notif-page,
.as-pref-page,
.as-app-ui button,
.as-app-ui input,
.as-app-ui select,
.as-app-ui textarea{
  font-family:var(--as-font-ui);
}

/* =========================================================
   TÍTULO PRINCIPAL DE PÁGINA
   Ej.: Vídeos, Favoritos, Editar perfil,
        Notificaciones, Preferencias, Privacidad
   ========================================================= */
.as-page-title,
.as-videos-head h1,
.as-subpage-heading h1,
.as-notif-title h1,
.as-pref-heading h1,
.as-support-head h1{
  font-family:var(--as-font-title);
  font-size:var(--as-size-page-title);
  line-height:var(--as-line-title);
  font-weight:var(--as-weight-title);
  letter-spacing:-.025em;
}

/* =========================================================
   SUBTÍTULO / INTRODUCCIÓN DE PÁGINA
   ========================================================= */
.as-page-subtitle,
.as-videos-head p,
.as-subpage-intro,
.as-notif-title p,
.as-pref-heading > p{
  font-family:var(--as-font-ui);
  font-size:var(--as-size-body);
  line-height:var(--as-line-body);
  font-weight:400;
}

/* =========================================================
   TÍTULO DE SECCIÓN
   ========================================================= */
.as-section-title,
.as-app-section-title,
.as-pref-section-head h2{
  font-family:var(--as-font-title);
  font-size:var(--as-size-section-title);
  line-height:var(--as-line-section);
  font-weight:var(--as-weight-title);
}

/* =========================================================
   TÍTULO DE TARJETA
   ========================================================= */
.as-card-title,
.as-app-card-title,
.as-pref-setting-head h2,
.as-support-card h2,
.as-support-field-label{
  font-family:var(--as-font-title);
  font-size:var(--as-size-card-title);
  line-height:1.15;
  font-weight:var(--as-weight-title);
}

/* =========================================================
   TÍTULO DE OPCIÓN / FILA
   ========================================================= */
.as-option-title,
.as-app-option-title,
.as-pref-option-row strong{
  font-family:var(--as-font-ui);
  font-size:var(--as-size-option-title);
  line-height:1.25;
  font-weight:var(--as-weight-semibold);
}

/* =========================================================
   TEXTO NORMAL
   ========================================================= */
.as-body-text,
.as-app-body{
  font-family:var(--as-font-ui);
  font-size:var(--as-size-body);
  line-height:var(--as-line-body);
  font-weight:400;
}

/* =========================================================
   TEXTO SECUNDARIO
   ========================================================= */
.as-secondary-text,
.as-pref-setting-head p,
.as-pref-option-row span{
  font-family:var(--as-font-ui);
  font-size:var(--as-size-small);
  line-height:var(--as-line-small);
  font-weight:400;
}

/* =========================================================
   META / TEXTO PEQUEÑO
   ========================================================= */
.as-meta-text,
.as-app-meta,
#as-video-status{
  font-family:var(--as-font-ui);
  font-size:var(--as-size-meta);
  line-height:var(--as-line-small);
  font-weight:400;
}

/* =========================================================
   KICKER / ETIQUETA SUPERIOR
   Ej.: AJUSTES DE LA APP, MI CUENTA...
   ========================================================= */
.as-kicker,
.as-app-section-label,
.as-pref-kicker{
  font-family:var(--as-font-ui);
  font-size:var(--as-size-kicker);
  line-height:1;
  font-weight:var(--as-weight-bold);
  letter-spacing:.16em;
  text-transform:uppercase;
}

/* =========================================================
   ENLACES
   Solo tipografía.
   El color pertenece al sistema visual/componentes.
   ========================================================= */
.as-link,
.as-link-accent{
  font-family:var(--as-font-ui);
  font-size:var(--as-size-small);
  line-height:1.3;
  font-weight:var(--as-weight-semibold);
}
