/* Felles størrelsesprofil. Bare apper med data-ui-size omfattes. */
html[data-ui-size] {
    --tt-ui-text: 13px; --tt-ui-label: 12px; --tt-ui-option: 13px;
    --tt-ui-control: 40px; --tt-ui-row: 38px; --tt-ui-pad: 8px;
}
/* Auto bruker samme primærpeker som komponentene, også i simulatoren.
   Et smalt PC-vindu og en PC med sekundær berøringsskjerm beholder Normal. */
@media (pointer: coarse) {
    html[data-ui-size="auto"] {
        --tt-ui-text: 16px; --tt-ui-label: 14px; --tt-ui-option: 18px;
        --tt-ui-control: 48px; --tt-ui-row: 48px; --tt-ui-pad: 12px;
    }
}
html[data-ui-size="readable"] {
    --tt-ui-text: 16px; --tt-ui-label: 14px; --tt-ui-option: 18px;
    --tt-ui-control: 48px; --tt-ui-row: 48px; --tt-ui-pad: 12px;
}
/* Lesevennlig: litt mer polstring i kort, kant og mellomrom som grunn.css. */
html[data-ui-size="readable"] { --ds1-rom-kort: 14px; }
@media (max-width: 640px) { html[data-ui-size="readable"] { --ds1-rom-kort: 12px; } }
/* Én tekstskala: temaets «liten» skrift (14 px) var større enn appteksten.
   Knapper, valg og hint følger nå tekststørrelsen i profilen. */
html[data-ui-size] { --ui-font-sm: var(--tt-ui-text); }
html[data-ui-size] [hidden] { display: none !important; }
html[data-ui-size] body { font-size: var(--tt-ui-text); }
html[data-ui-size] .tt-ui-field { display: grid; gap: 4px; min-width: 0; }
html[data-ui-size] .tt-ui-field > label { font-size: var(--tt-ui-label); font-weight: 600; color: var(--text-muted); }
html[data-ui-size] .tt-ui-input {
    box-sizing: border-box; min-width: 0; width: 100%; min-height: var(--tt-ui-control);
    padding: 8px 10px; border: 1px solid var(--border-alpha); border-radius: var(--radius);
    background: var(--input-bg); color: var(--text); font: inherit;
}
html[data-ui-size] .tt-ui-input:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
html[data-ui-size] .dc-btn { min-height: var(--tt-ui-control); font-size: var(--tt-ui-text); box-sizing: border-box; }
/* --primary-fg er tre tall i det gamle temaet (apps/design); -rgb virker i begge. */
html[data-ui-size] .dc-btn-primary { color: rgb(var(--primary-fg-rgb)); }
html[data-ui-size] .ws-shell-link { min-height: var(--tt-ui-control); font-size: var(--tt-ui-text); box-sizing: border-box; }
html[data-ui-size] .ws-shell-section { font-size: var(--tt-ui-label); }
@media (hover: none) and (pointer: coarse) {
    html[data-ui-size] .tt-bottom-nav__item { font-size: var(--tt-ui-label); }
    html[data-ui-size="readable"] .tt-bottom-nav__item i { font-size: 20px; }
}
html[data-ui-size] .design-ss { max-width: none; }
html[data-ui-size] .design-ss-trigger,
html[data-ui-size] .tt-dp-field,
html[data-ui-size] .tt-np-field { min-height: var(--tt-ui-control); height: var(--tt-ui-control); box-sizing: border-box; font-size: var(--tt-ui-text); }
html[data-ui-size] .tt-dp-input,
html[data-ui-size] .tt-np-input { font-size: var(--tt-ui-text); }
html[data-ui-size] .design-ss-option,
html[data-ui-size] .design-ss-option-col,
html[data-ui-size] .design-ss-search input { font-size: var(--tt-ui-option); }
html[data-ui-size] .design-ss-option,
html[data-ui-size] .design-ss-search input { min-height: var(--tt-ui-control); box-sizing: border-box; }
html[data-ui-size] .tt-table { font-size: var(--tt-ui-text); }
html[data-ui-size] .tt-table th,
html[data-ui-size] .tt-table td { height: var(--tt-ui-row); padding: 6px var(--tt-ui-pad); box-sizing: border-box; }
html[data-ui-size] .tt-table-search__input { min-height: var(--tt-ui-control); font-size: var(--tt-ui-text); }
html[data-ui-size="readable"] .tt-dp-pop { font-size: 16px; }
html[data-ui-size="readable"] .tt-dp-pop { width: 360px; }
html[data-ui-size="readable"] .tt-dp-day { font-size: 16px; }
html[data-ui-size="readable"] .tt-np-pop:not(.tt-np-pop--calculator) .tt-np-key { min-height: 48px; font-size: 20px; }

/* Design 2-kontroller og eksisterende TT-velgere deler størrelser. */
html[data-ui-size] {
    --ds1-kontrollhoeyde: var(--tt-ui-control);
    --color-divider-strong: var(--border-alpha);
    --color-danger: var(--destructive);
    --color-text-subtle: var(--text-muted);
    --space-3: 12px;
    --space-4: 16px;
}
html[data-ui-size] .input,
html[data-ui-size] .ds1_knapp { font-size: var(--tt-ui-text); }
html[data-ui-size] .felt__etikett,
html[data-ui-size] .felt__hjelp,
html[data-ui-size] .felt__feil { font-size: var(--tt-ui-label); }
html[data-ui-size] .input { width: 100%; }
html[data-ui-size] .ds1_knapp { box-sizing: border-box; }
html[data-ui-size] .ds1_segment__valg { min-height: calc(var(--tt-ui-control) - 2px); font-size: var(--tt-ui-text); }
/* Lister følger samme skala som skjemaet (LoadREG): tittel og rad som tekst, utdrag og meta som etikett. */
html[data-ui-size] :is(.ds1_liste__rad, .ds1_liste__tittel, .ds1_liste--nokkelverdi) { font-size: var(--tt-ui-text); }
html[data-ui-size] :is(.ds1_liste__utdrag, .ds1_liste__meta, .ds1_liste--kalender .ds1_liste__forklaring) { font-size: var(--tt-ui-label); }
html[data-ui-size] .ds1_liste__naar { font-size: calc(var(--tt-ui-label) - 1px); }
html[data-ui-size] .ds1_knapp--primaer { color: rgb(var(--primary-fg-rgb)); }
html[data-ui-size] .pm-item { min-height: var(--tt-ui-control); font-size: var(--tt-ui-text); box-sizing: border-box; }
html[data-ui-size] .design-ss[data-density] .design-ss-trigger { font-size: var(--tt-ui-text); min-height: var(--tt-ui-control); }
html[data-ui-size] .design-ss-dropdown[data-density] .design-ss-option,
html[data-ui-size] .design-ss-dropdown[data-density] .design-ss-option-col,
html[data-ui-size] .design-ss-dropdown[data-density] .design-ss-search input { font-size: var(--tt-ui-option); min-height: var(--tt-ui-control); }
html[data-ui-size] .design-ss-dropdown[data-density] .design-ss-option-col { min-height: 0; }
html[data-ui-size] .design-ss-option-fav,
html[data-ui-size] .design-ss-dropdown[data-density] .design-ss-option-fav { width: var(--tt-ui-control); height: var(--tt-ui-control); }