/* ============================================================================
   Typography Components
   Classes semânticas para tipografia
   ============================================================================ */

/* Title */
.text-title-primary {
  font-family: var(--text-title-primary-font);
  font-size: var(--text-title-primary-size);
  font-weight: var(--text-title-primary-weight);
  line-height: var(--text-title-primary-height);
  letter-spacing: var(--text-title-primary-tracking);
  margin: 0;
}

.text-title-secondary {
  font-family: var(--text-title-secondary-font);
  font-size: var(--text-title-secondary-size);
  font-weight: var(--text-title-secondary-weight);
  line-height: var(--text-title-secondary-height);
  letter-spacing: var(--text-title-secondary-tracking);
  margin: 0;
}

/* Heading */
.text-heading-large {
  font-family: var(--text-heading-large-font);
  font-size: var(--text-heading-large-size);
  font-weight: var(--text-heading-large-weight);
  line-height: var(--text-heading-large-height);
  letter-spacing: var(--text-heading-large-tracking);
  margin: 0;
}

.text-heading-medium {
  font-family: var(--text-heading-medium-font);
  font-size: var(--text-heading-medium-size);
  font-weight: var(--text-heading-medium-weight);
  line-height: var(--text-heading-medium-height);
  letter-spacing: var(--text-heading-medium-tracking);
  margin: 0;
}

.text-heading-small {
  font-family: var(--text-heading-small-font);
  font-size: var(--text-heading-small-size);
  font-weight: var(--text-heading-small-weight);
  line-height: var(--text-heading-small-height);
  letter-spacing: var(--text-heading-small-tracking);
  margin: 0;
}

/* Body */
.text-body {
  font-family: var(--text-body-font);
  font-size: var(--text-body-size);
  font-weight: var(--text-body-weight);
  line-height: var(--text-body-height);
  letter-spacing: var(--text-body-tracking);
  margin: 0;
}

.text-body-small {
  font-family: var(--text-body-small-font);
  font-size: var(--text-body-small-size);
  font-weight: var(--text-body-small-weight);
  line-height: var(--text-body-small-height);
  letter-spacing: var(--text-body-small-tracking);
  margin: 0;
}

.text-body-large {
  font-family: var(--text-body-large-font);
  font-size: var(--text-body-large-size);
  font-weight: var(--text-body-large-weight);
  line-height: var(--text-body-large-height);
  letter-spacing: var(--text-body-large-tracking);
  margin: 0;
}

/* Caption */
.text-caption-primary {
  font-family: var(--text-caption-primary-font);
  font-size: var(--text-caption-primary-size);
  font-weight: var(--text-caption-primary-weight);
  line-height: var(--text-caption-primary-height);
  letter-spacing: var(--text-caption-primary-tracking);
  margin: 0;
}

/* Nav / Link */
.text-nav {
  font-family: var(--text-nav-font);
  font-size: var(--text-nav-size);
  font-weight: var(--text-nav-weight);
  line-height: var(--text-nav-height);
  letter-spacing: var(--text-nav-tracking);
  margin: 0;
}

/* Nav hover effect with animated green line */
.nav a,
nav a.text-nav,
.text-nav {
  position: relative;
  display: inline-block;
}

.nav a::after,
nav a.text-nav::after,
.text-nav::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background-color: var(--color-primary-500);
  transition: width 0.3s ease-in-out;
}

.nav a:hover::after,
nav a.text-nav:hover::after,
.text-nav:hover::after {
  width: 100%;
}

/* Nav footer - apenas mudança de cor no hover */
.nav-footer a:hover {
  color: var(--color-neutral-800) !important;
  transition: color 0.2s ease-in-out;
}

/* Text Colors */
.text-color-primary { color: var(--color-secundary-800); }
.text-color-secondary { color: var(--color-neutral-400); }
.text-color-tertiary { color: var(--color-neutral-0); }
.text-oncolor { color: var(--color-neutral-0); }
.text-color-placeholder { color: var(--color-neutral-300); }

/* Text Alignment */
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }

/* Text Transform */
.uppercase { text-transform: uppercase; }
.lowercase { text-transform: lowercase; }
.capitalize { text-transform: capitalize; }

/* Text Truncation */
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Text */
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-inherit { color: inherit; }
.text-neutral-0 { color: var(--color-neutral-0); }
.text-neutral-50 { color: var(--color-neutral-50); }
.text-neutral-300 { color: var(--color-neutral-300); }
.text-neutral-500 { color: var(--color-neutral-500); }
.text-neutral-700 { color: var(--color-neutral-700); }
.text-neutral-800 { color: var(--color-neutral-800); }
.text-primary-500 { color: var(--color-primary-500); }
.text-primary-600 { color: var(--color-primary-600); }
.no-underline { text-decoration: none; }
.underline { text-decoration: underline; }
.whitespace-nowrap { white-space: nowrap; }