/* =============================================================================
   Nodra — базовые стили и типографика.
   Всё скоупится в .nodra, чтобы не задеть существующие (Radzen/bootstrap) страницы.
   Оберни новый UI в <div class="nodra n-surface"> ... </div>.
   ============================================================================= */

.nodra,
.nodra *,
.nodra *::before,
.nodra *::after {
    box-sizing: border-box;
}

.nodra {
    font-family: var(--n-font-sans);
    font-size: 0.875rem;
    line-height: 1.42857;
    font-weight: 400;
    color: var(--n-text-primary);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Холст (фон страницы под тему Carbon) */
.n-surface {
    background-color: var(--n-background);
    color: var(--n-text-primary);
    min-height: 100%;
}

/* Базовый цвет — только для «голых» ссылок без классов.
   Компонентные ссылки (.n-btn, .n-sn__item, .n-breadcrumb a и т.п.) задают цвет сами. */
.nodra a:not([class]) {
    color: var(--n-link-primary);
    text-decoration: none;
}

.nodra a:not([class]):hover {
    color: var(--n-link-primary-hover);
    text-decoration: underline;
}

.nodra h1,
.nodra h2,
.nodra h3,
.nodra h4,
.nodra h5,
.nodra h6,
.nodra p {
    margin: 0;
}

/* ---- Типографические токены Carbon (классы-хелперы) ---- */
.n-label-01        { font-size: 0.75rem;  line-height: 1.33333; font-weight: 400; letter-spacing: 0.32px; }
.n-helper-text-01  { font-size: 0.75rem;  line-height: 1.33333; font-weight: 400; color: var(--n-text-helper); }
.n-legal-01        { font-size: 0.75rem;  line-height: 1.33333; font-weight: 400; }

.n-body-compact-01 { font-size: 0.875rem; line-height: 1.28572; font-weight: 400; }
.n-body-01         { font-size: 0.875rem; line-height: 1.42857; font-weight: 400; }
.n-body-02         { font-size: 1rem;     line-height: 1.5;     font-weight: 400; }

.n-heading-compact-01 { font-size: 0.875rem; line-height: 1.28572; font-weight: 600; }
.n-heading-01      { font-size: 0.875rem; line-height: 1.42857; font-weight: 600; }
.n-heading-02      { font-size: 1rem;     line-height: 1.5;     font-weight: 600; }
.n-heading-03      { font-size: 1.25rem;  line-height: 1.4;     font-weight: 400; }
.n-heading-04      { font-size: 1.75rem;  line-height: 1.28572; font-weight: 400; }
.n-heading-05      { font-size: 2rem;     line-height: 1.25;    font-weight: 400; }
.n-heading-06      { font-size: 2.625rem; line-height: 1.199;   font-weight: 300; }
.n-heading-07      { font-size: 3.375rem; line-height: 1.19;    font-weight: 300; }

.n-code-01         { font-family: var(--n-font-mono); font-size: 0.75rem;  line-height: 1.33333; }
.n-code-02         { font-family: var(--n-font-mono); font-size: 0.875rem; line-height: 1.42857; }

/* ---- Цветовые хелперы текста ---- */
.n-text-primary   { color: var(--n-text-primary); }
.n-text-secondary { color: var(--n-text-secondary); }
.n-text-helper    { color: var(--n-text-helper); }
.n-text-error     { color: var(--n-text-error); }
.n-text-success   { color: var(--n-support-success); }
.n-text-warning   { color: var(--n-support-warning); }

/* ---- Простые утилиты раскладки ---- */
.n-stack   { display: flex; flex-direction: column; }
.n-cluster { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; }
.n-gap-03  { gap: var(--n-spacing-03); }
.n-gap-04  { gap: var(--n-spacing-04); }
.n-gap-05  { gap: var(--n-spacing-05); }
.n-gap-06  { gap: var(--n-spacing-06); }
.n-gap-07  { gap: var(--n-spacing-07); }

.n-mt-03 { margin-top: var(--n-spacing-03); }
.n-mt-05 { margin-top: var(--n-spacing-05); }
.n-mt-07 { margin-top: var(--n-spacing-07); }
.n-mb-03 { margin-bottom: var(--n-spacing-03); }
.n-mb-05 { margin-bottom: var(--n-spacing-05); }
.n-mb-07 { margin-bottom: var(--n-spacing-07); }