/**
 * Module: article_text
 */

/* ============================================
   TEXT MODULE
   ============================================ */

.t1-text {
    font-size: 1.0625rem;
    line-height: 1.8;
    color: var(--ink);
}

.t1-text > *:first-child {
    margin-top: 0;
}

.t1-text p {
    margin: 0 0 1.5rem;
}

.t1-text h2 {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 2.5rem 0 1rem;
    color: var(--ink);
}

.t1-text h3 {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 2rem 0 0.75rem;
    color: var(--ink);
}

.t1-text h4 {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 1.5rem 0 0.5rem;
    color: var(--ink);
}

.t1-text a {
    color: var(--jade);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.t1-text a:hover {
    color: var(--jade-dark);
}

.t1-text ul,
.t1-text ol {
    margin: 1.5rem 0;
    padding-left: 1.5rem;
}

.t1-text li {
    margin-bottom: 0.5rem;
}

.t1-text ul li {
    list-style: disc;
}

.t1-text ol li {
    list-style: decimal;
}

.t1-text blockquote {
    margin: 2rem 0;
    padding: 1.25rem 1.5rem;
    background: var(--jade-light);
    border-left: 3px solid var(--jade);
    border-radius: 0 8px 8px 0;
    font-style: italic;
    color: var(--jade-dark);
}

.t1-text code {
    font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, monospace;
    font-size: 0.9375em;
    background: var(--pearl);
    padding: 0.125rem 0.375rem;
    border-radius: 4px;
}

.t1-text img {
    border-radius: 8px;
    margin: 2rem 0;
    display: block;
    max-width: 100%;
    height: auto;
}

/* ========================================
   LIGHT THEME OVERRIDE
   ======================================== */

.t1-text--light {
    color: var(--ink);
}

.t1-text--light h2,
.t1-text--light h3,
.t1-text--light h4 {
    color: var(--ink);
}

.t1-text--light a {
    color: var(--jade);
}

.t1-text--light a:hover {
    color: var(--jade-dark);
}

.t1-text--light blockquote {
    background: var(--jade-light);
    border-left-color: var(--jade);
    color: var(--jade-dark);
}

.t1-text--light code {
    background: var(--pearl);
}