/* Shared typography source. Load before core/global/module styles on every UI entry point. */
@font-face {
    font-family: "Inter";
    src: url("../fonts/inter/Inter-Variable.ttf") format("truetype");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("../fonts/inter/Inter-Italic-Variable.ttf") format("truetype");
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
}

:root {
    --fd-font-main: "Inter", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
    /* Legacy compact/brand role: keep until its separate visual review. */
    --fd-font-condensed: "Arial Narrow", "Aptos Narrow", "Roboto Condensed", "Segoe UI Condensed", var(--fd-font-main);
    --fd-type-sidebar-size: 14px;
    --fd-type-sidebar-weight: 700;
    --fd-type-sidebar-leading: 1.5;
    --fd-page-intro-tab-gap: 16px;
}

/* Single owner for sidebar-link typography; layout and state styles stay separate.
   Existing collapsed/mobile rules deliberately hide the text with font-size: 0. */
.sidebar .fd-type-sidebar-link {
    font-family: var(--fd-font-main);
    font-size: var(--fd-type-sidebar-size);
    font-weight: var(--fd-type-sidebar-weight);
    font-style: normal;
    line-height: var(--fd-type-sidebar-leading);
    letter-spacing: normal;
    text-transform: none;
}

/* Semantic roles, migrated component by component. */
.fd-type-heading {
    font-family: var(--fd-font-main) !important;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: 0;
}

.fd-page-intro {
    margin-bottom: var(--fd-page-intro-tab-gap);
    max-width: 980px;
}

/* Shared vertical rhythm from a page intro to its immediate tab bar. */
.fd-page-intro + .fd-page-tabbar {
    margin-top: 0 !important;
}

.fd-page-intro-title {
    margin: 0;
    color: #111827;
    font-size: clamp(20px, 1.7vw, 24px);
    font-weight: 700;
    line-height: 1.2;
}

.fd-page-intro-subtitle {
    margin: 4px 0 0;
    color: #536173;
    font-size: 14px;
    line-height: 1.45;
}

body.darkmode .fd-page-intro-title {
    color: #f8fafc;
}

body.darkmode .fd-page-intro-subtitle {
    color: #aeb8c8;
}

.fd-type-dialog-title {
    font-family: var(--fd-font-main);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -.02em;
}
.fd-type-section-title {
    font-family: var(--fd-font-main);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}
.fd-type-field-label {
    font-family: var(--fd-font-main);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.5;
}
.fd-type-field-value {
    font-family: var(--fd-font-main);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
}

/* Page-content migration: all functional UI text is Inter; flow product names stay condensed. */
.fd-type-page-content,
.fd-type-page-content :is(h1, h2, h3, h4, h5, h6, p, a, button, input, select, textarea, label, small, summary, th, td, option, .card-title, .card-info) {
    font-family: var(--fd-font-main) !important;
    font-stretch: normal !important;
    letter-spacing: 0 !important;
}
