/* Campus Virtual — sistema tipográfico global
   Primitive -> semantic -> component tokens. This file loads last on purpose. */
.campus-page {
  /* Primitive scale */
  --campus-type-2xs: 11px;
  --campus-type-xs: 12px;
  --campus-type-sm: 13px;
  --campus-type-md: 14px;
  --campus-type-lg: 16px;
  --campus-type-xl: 19px;
  --campus-type-2xl: 23px;
  --campus-type-metric: 27px;

  /* Semantic roles */
  --campus-type-meta: var(--campus-type-2xs);
  --campus-type-control: var(--campus-type-xs);
  --campus-type-body: var(--campus-type-sm);
  --campus-type-label: var(--campus-type-xs);
  --campus-type-card-title: var(--campus-type-md);
  --campus-type-section-title: var(--campus-type-lg);
  --campus-type-page-title: var(--campus-type-xl);

  font-size: var(--campus-type-body);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.campus-page button,
.campus-page input,
.campus-page select,
.campus-page textarea {
  font-family: Inter, Arial, sans-serif;
  line-height: 1.4;
}

/* Page and section hierarchy */
.campus-topbar h1,
.support-heading h2,
.teacher-heading h2,
.student-route-panel header h2 {
  font-size: var(--campus-type-page-title);
  font-weight: 750;
  line-height: 1.22;
  letter-spacing: -.02em;
}

.dash-panel h2,
.support-card > header h3,
.support-card > h3,
.teacher-panel h3,
.teacher-tool-head h3,
.module-manager > header h3,
.profile-dashboard h3,
.web-messages h3,
.support-booking h3,
.catalog-groups h4 {
  font-size: var(--campus-type-section-title);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.01em;
}

.support-card h4,
.teacher-panel h4,
.teacher-callout h4,
.proposal-notices h4,
.report-list h4,
.course-progress-grid h3,
.teacher-course-library article h3,
.student-route-content h3 {
  font-size: var(--campus-type-card-title);
  font-weight: 650;
  line-height: 1.35;
}

/* Red overlines/kickers: compact, bold and consistent */
.workspace-kicker,
.eyebrow,
.support-heading .workspace-kicker,
.teacher-heading .workspace-kicker,
.workspace-title p,
.pm-panel header p,
.module-heading p {
  font-size: var(--campus-type-2xs);
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: .09em;
  text-transform: uppercase;
}

/* Body copy and explanatory text */
.campus-topbar p,
.support-heading > div > p:last-child,
.teacher-heading > div > p:last-child,
.support-card > p,
.support-card header p,
.teacher-panel header p,
.teacher-tool-head p,
.module-manager header p,
.campus-hero p,
.course-progress-grid p,
.steps p,
.student-route-content p,
.premium-access-grid p,
.proposal-notices p,
.report-list > article > p,
.web-message-card > p,
.booking-empty,
.ticket-empty {
  font-size: var(--campus-type-body);
  font-weight: 400;
  line-height: 1.55;
}

/* Navigation */
.campus-sidebar nav a {
  font-size: var(--campus-type-sm);
  font-weight: 500;
  line-height: 1.35;
}

.campus-sidebar nav p {
  font-size: var(--campus-type-2xs);
  font-weight: 700;
  letter-spacing: .085em;
}

.sidebar-collapse,
.sidebar-help,
.sidebar-help a,
.sidebar-help p {
  font-size: var(--campus-type-xs);
  line-height: 1.45;
}

/* Forms, tabs and actions */
.campus-button,
.workspace-action,
.secondary-action,
.site-admin-tabs button,
.classroom-tabs button,
.quick-teacher button,
.teacher-course-library article button,
.teacher-courses nav button,
.ticket-list button,
.report-list > article > button,
.notification-center select,
.notification-center button,
.catalog-version-list button,
.account-menu button,
.password-mask,
.account-state,
.account-access,
.message-tools input,
.message-tools select,
.web-message-card select,
.support-booking button,
.delete-message,
.delete-agenda-event {
  font-size: var(--campus-type-control);
  font-weight: 650;
  line-height: 1.35;
}

.course-form-grid label,
.site-form-grid label,
.proposal-form-grid label,
.report-list label,
.profile-details label,
.support-booking label,
.login-panel form > label,
.brand-text-toggle,
.new-brand-toggle,
.permission-select-all,
.credit-control label {
  font-size: var(--campus-type-label);
  font-weight: 600;
  line-height: 1.4;
}

.course-form-grid input,
.course-form-grid select,
.course-form-grid textarea,
.site-form-grid input,
.site-form-grid select,
.site-form-grid textarea,
.home-admin-form input,
.home-admin-form textarea,
.brands-admin input,
.ai-integration-form input,
.ai-integration-form select,
.ai-integration-form textarea,
.profile-details input,
.profile-details select,
.profile-details textarea,
.support-booking input,
.support-booking select,
.support-booking textarea,
.login-panel input,
.login-panel select {
  font-size: var(--campus-type-sm);
  font-weight: 400;
}

/* Tables and structured lists */
.users-table-card table,
.teacher-student-table,
.course-manager,
.site-app-head,
.site-app-row,
.instructor-admin-row,
.catalog-version-list,
.report-list,
.ticket-list {
  font-size: var(--campus-type-xs);
  line-height: 1.45;
}

.users-table-card th,
.teacher-student-table th,
.course-manager-head,
.site-app-head {
  font-size: var(--campus-type-2xs);
  font-weight: 750;
  letter-spacing: .035em;
}

.users-table-card td,
.teacher-student-table td,
.managed-course,
.site-app-row,
.site-app-card {
  font-size: var(--campus-type-xs);
}

.site-app-card b {
  font-size: var(--campus-type-xs);
  font-weight: 800;
}

.site-app-card small,
.site-app-card .app-access-badge,
.site-app-card .app-card-link {
  font-size: var(--campus-type-2xs);
}

/* Metadata: 11px is the hard minimum for Campus UI text */
.campus-page small,
.campus-page .form-help,
.campus-page .active-time,
.campus-page .teacher-sync,
.campus-page .course-facts dt,
.campus-page .course-facts dd,
.campus-page .teacher-events span,
.campus-page .teacher-events small,
.campus-page .module-manager small,
.campus-page .forum-list small,
.campus-page .site-app-row small,
.campus-page .site-app-row em,
.campus-page .instructor-admin-row small,
.campus-page .instructor-admin-row em,
.campus-page .brands-admin small,
.campus-page .brands-columns small,
.campus-page .permission-app-list small,
.campus-page .ticket-list small,
.campus-page .notification-row small,
.campus-page .report-list header small,
.campus-page .audience-stats small,
.campus-page .journey-stats span,
.campus-page .proposal-notices span,
.campus-page .credit-control small,
.campus-page .credit-ranking small,
.campus-page .credit-ranking p,
.campus-page .web-message-card header small,
.campus-page .web-message-card dt,
.campus-page .web-message-card dd,
.campus-page .message-action-notes,
.campus-page .support-booking > small {
  font-size: var(--campus-type-meta) !important;
  line-height: 1.45;
}

/* Badges and statuses */
.status,
.role-pill,
.teacher-status,
.teacher-course-card em,
.ticket-status,
.premium-private-badge,
.premium-access-grid span,
.site-app-row em,
.instructor-admin-row em,
.web-message-card header em,
.account-state,
.account-access,
.student-app-grid article > em {
  font-size: var(--campus-type-2xs);
  font-weight: 750;
  line-height: 1.25;
}

/* Dashboard data */
.metric-grid span,
.metric-grid em,
.teacher-metrics span,
.teacher-metrics small,
.classroom-summary span,
.intelligence-metrics span,
.intelligence-metrics em,
.need-stats label,
.credit-ranking article > em,
.notification-center article > span,
.notification-center article p,
.notification-center article small {
  font-size: var(--campus-type-meta);
  line-height: 1.4;
}

.metric-grid b,
.teacher-metrics b,
.intelligence-metrics b {
  font-size: var(--campus-type-metric);
  font-weight: 750;
  line-height: 1.1;
  letter-spacing: -.025em;
}

/* User cards and identity */
.profile,
.profile b,
.active-user-identity b,
.credit-ranking-user b,
.profile-summary h3 {
  font-size: var(--campus-type-sm);
}

.profile small,
.active-user-identity small,
.active-user-record small,
.profile-summary p,
.profile-summary small,
.profile-summary span {
  font-size: var(--campus-type-meta);
  line-height: 1.4;
}

.profile-achievements span {
  font-size: 10px;
  line-height: 1.45;
}

/* Agenda: comfortable spacing and balanced helper copy */
.support-booking > small {
  display: block;
  margin-top: 12px;
  color: var(--campus-muted);
}

.support-booking > p {
  font-size: var(--campus-type-meta);
  line-height: 1.45;
}

.support-booking > p a {
  font-size: inherit;
  font-weight: 500;
}

.support-booking header b {
  font-size: var(--campus-type-md);
  line-height: 1.35;
}

.support-booking .booking-actions {
  gap: 10px;
  margin-top: 12px;
}

.booking-month {
  font-size: var(--campus-type-sm);
  font-weight: 650;
}

.booking-month button,
.booking-calendar > b,
.booking-calendar button,
.site-admin-tabs [data-booking-count] {
  font-size: var(--campus-type-meta);
}

.support-booking > div {
  gap: 10px;
  margin-top: 12px;
}

.support-booking > div > button {
  min-width: 118px;
  min-height: 38px;
  justify-content: center;
  text-align: center;
}

.notification-center .notification-row em {
  font-size: var(--campus-type-meta);
  line-height: 1.45;
}

.notification-center .delete-agenda-event {
  font-size: var(--campus-type-meta);
  font-weight: 650;
  line-height: 1.35;
}

/* Preserve display typography on access and hero screens */
.access-copy h1 {
  font-size: clamp(46px, 5vw, 74px);
}

.campus-hero h2 {
  font-size: clamp(28px, 2.3vw, 38px);
}

@media (max-width: 760px) {
  .campus-page {
    --campus-type-page-title: 18px;
    --campus-type-section-title: 15px;
  }

  .campus-sidebar nav a,
  .campus-page input,
  .campus-page select,
  .campus-page textarea {
    font-size: 13px;
  }
}

/* Control Maestro — estado de la conexión con Firebase */
.firebase-state {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  padding: 3px 9px;
  border: 1px solid var(--campus-line);
  border-radius: 999px;
  color: var(--campus-muted);
  font-size: 9px;
  font-style: normal;
  letter-spacing: .02em;
}
.firebase-state::before {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #d94343;
  content: "";
}
.firebase-state.is-connected {
  border-color: rgba(57, 201, 108, .35);
  color: #63dc9a;
}
.firebase-state.is-connected::before {
  background: #39c96c;
  box-shadow: 0 0 0 4px rgba(57, 201, 108, .12);
}