/* Typography Styles */

/* Base typography settings */
.ds-typeset {
  font-family: var(--ds-font-family-sans);
  line-height: var(--ds-line-height-m);
  color: var(--ds-color-text);
}

/* Headings */
.ds-typeset h1,
.ds-typescale-xxxl {
  font-size: var(--ds-font-size-xxxl);
  line-height: var(--ds-line-height-xs);
  font-weight: var(--ds-font-weight-bold);
  margin-bottom: var(--ds-space-l);
  color: var(--ds-color-text);
}

.ds-typeset h2,
.ds-typescale-xxl {
  font-size: var(--ds-font-size-xxl);
  line-height: var(--ds-line-height-s);
  font-weight: var(--ds-font-weight-semibold);
  margin-bottom: var(--ds-space-m);
  color: var(--ds-color-text);
}

.ds-typeset h3,
.ds-typescale-xl {
  font-size: var(--ds-font-size-xl);
  line-height: var(--ds-line-height-s);
  font-weight: var(--ds-font-weight-semibold);
  margin-bottom: var(--ds-space-m);
  color: var(--ds-color-text);
}

.ds-typeset h4,
.ds-typescale-l {
  font-size: var(--ds-font-size-l);
  line-height: var(--ds-line-height-m);
  font-weight: var(--ds-font-weight-medium);
  margin-bottom: var(--ds-space-s);
  color: var(--ds-color-text);
}

.ds-typeset h5,
.ds-typescale-m {
  font-size: var(--ds-font-size-m);
  line-height: var(--ds-line-height-m);
  font-weight: var(--ds-font-weight-medium);
  margin-bottom: var(--ds-space-s);
  color: var(--ds-color-text);
}

.ds-typeset h6,
.ds-typescale-s {
  font-size: var(--ds-font-size-s);
  line-height: var(--ds-line-height-m);
  font-weight: var(--ds-font-weight-medium);
  margin-bottom: var(--ds-space-s);
  color: var(--ds-color-text);
}

/* Paragraphs */
.ds-typeset p {
  font-size: var(--ds-font-size-m);
  line-height: var(--ds-line-height-l);
  margin-bottom: var(--ds-space-m);
  color: var(--ds-color-text);
}

.ds-typeset p:last-child {
  margin-bottom: 0;
}

/* Links */
.ds-typeset a {
  color: var(--ds-color-text-link);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
  transition: color var(--ds-duration-fast) var(--ds-ease-out);
}

.ds-typeset a:hover {
  color: var(--ds-color-accent);
  text-decoration-thickness: 2px;
}

.ds-typeset a:focus-visible {
  outline: var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);
  outline-offset: var(--ds-focus-ring-offset);
  border-radius: var(--ds-radius-xs);
}

/* Lists */
.ds-typeset ul,
.ds-typeset ol {
  margin-bottom: var(--ds-space-m);
  padding-left: var(--ds-space-l);
}

.ds-typeset ul {
  list-style-type: disc;
}

.ds-typeset ol {
  list-style-type: decimal;
}

.ds-typeset li {
  margin-bottom: var(--ds-space-xs);
  line-height: var(--ds-line-height-l);
}

.ds-typeset li:last-child {
  margin-bottom: 0;
}

.ds-typeset ul ul,
.ds-typeset ol ol,
.ds-typeset ul ol,
.ds-typeset ol ul {
  margin-top: var(--ds-space-xs);
  margin-bottom: 0;
}

/* Blockquotes */
.ds-typeset blockquote {
  margin: var(--ds-space-l) 0;
  padding: var(--ds-space-m) var(--ds-space-l);
  border-left: 4px solid var(--ds-color-border-strong);
  background-color: var(--ds-color-surface-raised);
  font-style: italic;
  color: var(--ds-color-text-weak);
}

.ds-typeset blockquote p:last-child {
  margin-bottom: 0;
}

/* Code */
.ds-typeset code {
  font-family: var(--ds-font-family-mono);
  font-size: 0.875em;
  background-color: var(--ds-color-surface-raised);
  padding: 0.125em 0.25em;
  border-radius: var(--ds-radius-xs);
  color: var(--ds-color-text);
}

.ds-typeset pre {
  font-family: var(--ds-font-family-mono);
  font-size: var(--ds-font-size-s);
  background-color: var(--ds-color-surface-raised);
  padding: var(--ds-space-m);
  border-radius: var(--ds-radius-s);
  overflow-x: auto;
  margin-bottom: var(--ds-space-m);
  line-height: var(--ds-line-height-m);
}

.ds-typeset pre code {
  background: none;
  padding: 0;
  border-radius: 0;
}

/* Horizontal rule */
.ds-typeset hr {
  border: none;
  height: 1px;
  background-color: var(--ds-color-border);
  margin: var(--ds-space-xl) 0;
}

/* Tables */
.ds-typeset table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: var(--ds-space-l);
}

.ds-typeset th,
.ds-typeset td {
  padding: var(--ds-space-s) var(--ds-space-m);
  text-align: left;
  border-bottom: 1px solid var(--ds-color-border);
}

.ds-typeset th {
  font-weight: var(--ds-font-weight-semibold);
  background-color: var(--ds-color-surface-raised);
  color: var(--ds-color-text);
}

.ds-typeset tbody tr:hover {
  background-color: var(--ds-color-surface-raised);
}

/* Text utilities */
.ds-text-xs {
  font-size: var(--ds-font-size-xs);
}

.ds-text-s {
  font-size: var(--ds-font-size-s);
}

.ds-text-m {
  font-size: var(--ds-font-size-m);
}

.ds-text-l {
  font-size: var(--ds-font-size-l);
}

.ds-text-xl {
  font-size: var(--ds-font-size-xl);
}

.ds-text-xxl {
  font-size: var(--ds-font-size-xxl);
}

.ds-text-xxxl {
  font-size: var(--ds-font-size-xxxl);
}

/* Font weight utilities */
.ds-font-normal {
  font-weight: var(--ds-font-weight-normal);
}

.ds-font-medium {
  font-weight: var(--ds-font-weight-medium);
}

.ds-font-semibold {
  font-weight: var(--ds-font-weight-semibold);
}

.ds-font-bold {
  font-weight: var(--ds-font-weight-bold);
}

/* Text color utilities */
.ds-text-weak {
  color: var(--ds-color-text-weak);
}

.ds-text-weaker {
  color: var(--ds-color-text-weaker);
}

.ds-text-weakest {
  color: var(--ds-color-text-weakest);
}

.ds-text-error {
  color: var(--ds-color-text-error);
}

.ds-text-success {
  color: var(--ds-color-text-success);
}

.ds-text-warning {
  color: var(--ds-color-text-warning);
}

.ds-text-info {
  color: var(--ds-color-text-info);
}

/* Text alignment utilities */
.ds-text-left {
  text-align: left;
}

.ds-text-center {
  text-align: center;
}

.ds-text-right {
  text-align: right;
}

.ds-text-justify {
  text-align: justify;
}

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

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

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