/* SMDL components 1.2.0 — semantic typography for the approved suite language.
   CORE owns this source. Consumers ship a digest-verified local snapshot.
   Product colors and domain layouts remain product-owned. */
:root {
  --smdl-text-body: .875rem;
  --smdl-text-control: .875rem;
  --smdl-text-meta: .75rem;
  --smdl-text-section: 1.125rem;
  --smdl-text-heading: 1.375rem;
  --smdl-text-metric: 1.75rem;
  --smdl-text-display: 2.25rem;
  --smdl-leading-body: 1.5;
  --smdl-leading-heading: 1.3;
  --smdl-weight-regular: 400;
  --smdl-weight-medium: 500;
  --smdl-weight-semibold: 600;
  --smdl-control-height: 36px;
  --smdl-control-small: 30px;
  --smdl-control-pad: 6px;
  --smdl-control-radius: 8px;
  --smdl-row-padding: 12px;
  --smdl-control-line: var(--line);
  --smdl-control-line-hover: var(--line-strong, var(--ink-3));
}
/* Compact also works before JavaScript and when browser storage is blocked.
   An explicitly saved Comfortable preference always wins. */
:root[data-smdl-ui-size="comfortable"] {
  --smdl-text-body: 1rem;
  --smdl-text-control: 1rem;
  --smdl-text-meta: .875rem;
  --smdl-text-section: 1.25rem;
  --smdl-text-heading: 1.5rem;
  --smdl-text-metric: 2rem;
  --smdl-text-display: 2.5rem;
  --smdl-control-height: 44px;
  --smdl-control-small: 36px;
  --smdl-control-pad: 10px;
  --smdl-row-padding: 18px;
}
.smdl {
  --smdl-side: 16rem;
  --smdl-rail-width: var(--smdl-side);
  --smdl-search-width: clamp(320px, 36vw, 520px);
  --ctl: var(--smdl-control-height);
  --ctl-h: var(--smdl-control-height);
  --ctl-h-sm: var(--smdl-control-small);
  --ctl-fs: var(--smdl-text-control);
  --ctl-radius: var(--smdl-control-radius);
  --text-body: var(--smdl-text-body);
  --text-caption: var(--smdl-text-meta);
  --text-h1: var(--smdl-text-heading);
  --text-h2: var(--smdl-text-section);
  font-size: var(--smdl-text-body); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-regular);
}
.smdl .smdl-heading h1 {
  font-size: var(--smdl-text-heading); line-height: var(--smdl-leading-heading);
  font-weight: var(--smdl-weight-semibold); text-transform: none; letter-spacing: normal;
}
.smdl :is(b,strong):not(:where(.rich-editor *, .doc-content *, .wm-site-preview *)) { font-weight: var(--smdl-weight-semibold); }
.smdl .smdl-switch-btn > .ic.chev { display: none; }
.smdl.is-slim { --smdl-rail-width: var(--smdl-side-slim); }
.smdl .smdl-top { background: var(--canvas); border-bottom: 0; }
.smdl .smdl-side-foot { border-top: 0; }
.smdl .smdl-org .who { flex: 1; min-width: 0; }
.smdl .smdl-side-scroll > :is(a,.smdl-soon,.smdl-side-soon) { min-height: var(--smdl-control-height); height: auto; flex-shrink: 0; }
.smdl .smdl-side a.is-active {
  background: var(--surface-2); color: var(--ink); font-weight: 600;
  box-shadow: inset 0 0 0 1px var(--line);
}
.smdl .smdl-side a.is-active > .ic { color: var(--accent-deep, var(--accent-ink)); }
/* Bind the actual shell markup, including non-link destinations and the
   mobile navigation host. One role includes size, leading, weight and case. */
:is(.smdl,.smdl-mobile-navigation) :is(.smdl-side a,.smdl-side-soon,.smdl-side-scroll > .smdl-soon),
.smdl :is(.smdl-new-item,.smdl-app-item,.smdl-appname,[data-smdl-side-toggle]) {
  font-size: var(--smdl-text-control); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal; text-transform: none;
}
.smdl .smdl-appname { font-weight: var(--smdl-weight-semibold); }
/* A user's larger text must wrap inside the expanded rail, not disappear
   behind a fixed-width label. Keep the icon-only rail's accessible hiding. */
@media (min-width: 901px) {
  .smdl:not(.is-slim) .smdl-side-scroll > :is(a,.smdl-soon,.smdl-side-soon) { padding-block: 8px; white-space: normal; }
  .smdl:not(.is-slim) .smdl-side-scroll > :is(a,.smdl-soon,.smdl-side-soon) .lbl {
    min-width: 0; white-space: normal; overflow-wrap: anywhere; overflow: visible; text-overflow: clip;
  }
  .smdl:not(.is-slim) :is(.smdl-cap,.smdl-org .who b,.smdl-org .who .org) { white-space: normal; overflow-wrap: anywhere; }
}
.smdl-mobile-navigation a.is-active { font-weight: var(--smdl-weight-semibold); }
:is(.smdl,.smdl-mobile-navigation) :is(.smdl-cap,.nav-group),
.smdl :is(.smdl-switch-sec,.smdl-new-sec,.smdl-search-group,.smdl-search-heading) {
  font-size: var(--smdl-text-meta); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal; text-transform: none;
}
.smdl :is(.smdl-app-item small,.smdl-new-item small,.smdl-switch-org,
  .smdl-search-heading small,.smdl-search-item small,.smdl-search-page-miss small,
  .smdl-search-empty small,.smdl-search-note,.smdl-search-error,.smdl-search-shortcut),
:is(.smdl,.smdl-mobile-navigation) :is(.smdl-org .who .org,.smdl-badge,.smdl-railcount,
  .smdl-side-soon .smdl-soon,.smdl-side-scroll > .smdl-soon .soon) {
  font-size: var(--smdl-text-meta); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-regular); letter-spacing: normal; text-transform: none;
}
.smdl :is(.smdl-brandrow,.smdl-search-item b,.smdl-search-page-miss strong,.smdl-search-empty strong),
:is(.smdl,.smdl-mobile-navigation) .smdl-org .who b {
  font-size: var(--smdl-text-body); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal; text-transform: none;
}
.smdl :is(.smdl-search-item,.smdl-search-page-miss,.smdl-search-note) { overflow-wrap: anywhere; }
.smdl .smdl-search-heading { flex-wrap: wrap; }
.smdl-tip {
  font-size: var(--smdl-text-meta); line-height: var(--smdl-leading-body); font-weight: var(--smdl-weight-medium);
  max-width: min(36ch,calc(100vw - 24px)); white-space: normal; overflow-wrap: anywhere;
}
.smdl .smdl-search { height: auto; min-height: var(--smdl-control-height); border-radius: var(--smdl-control-radius); }
.smdl .smdl-search input { font-size: var(--smdl-text-control); }
.smdl :is(.smdl-new-main,.smdl-new-caret,.smdl-iconbtn,.account-v3-create-main,.account-v3-create-caret) {
  min-height: var(--smdl-control-height); height: auto;
}
.smdl :is(.smdl-new-btn,.smdl-new-main,.account-v3-create-main) { font-size: var(--smdl-text-control); font-weight: var(--smdl-weight-medium); }
.smdl :is(.smdl-new-caret,.smdl-iconbtn,.account-v3-create-caret) { min-width: var(--smdl-control-height); }
/* Saved-status segments own their child styles; inheriting a new size on the
   anchor alone leaves the legacy 12.5px label behind. */
.smdl .smdl-count { height: auto; min-height: var(--smdl-control-small); padding-block: 6px; }
.smdl .smdl-count .k {
  font-size: var(--smdl-text-control); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal; text-transform: none;
}
.smdl .smdl-count.is-on .k { font-weight: var(--smdl-weight-semibold); }
.smdl .smdl-count :is(b,.d) {
  font-size: var(--smdl-text-meta); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal;
}

/* The approved ITSM geometry belongs to the family: a full-height rail and
   viewport-centered search. On smaller desktops tools get a separate row. */
@media (min-width: 761px) {
  .smdl > .smdl-side { grid-column: 1; grid-row: 1 / -1; padding-top: calc(var(--smdl-top) + 12px); }
  .smdl > .smdl-corner { height: var(--smdl-top); align-self: start; background: var(--smdl-rail); border-bottom: 0; border-right: 1px solid var(--rail-hair); }
  .smdl .smdl-top, .smdl .smdl-top:has(.smdl-live-actions) {
    grid-template-columns: minmax(0,calc((100vw - var(--smdl-search-width)) / 2 - var(--smdl-rail-width) - 24px)) var(--smdl-search-width) minmax(0,1fr);
    column-gap: 0; padding-inline: 24px;
  }
  .smdl .smdl-top .smdl-heading { padding-right: 24px; }
  .smdl .smdl-top .smdl-tools { padding-left: 24px; min-width: 0; flex-wrap: wrap; }
}
@media (min-width: 761px) and (max-width: 1199px) {
  .smdl .smdl-top, .smdl .smdl-top:has(.smdl-live-actions) { grid-template-rows: 44px 44px; row-gap: 12px; padding-block: 12px; }
  .smdl .smdl-top .smdl-heading { grid-column: 1 / 3; grid-row: 1; }
  .smdl .smdl-top > .smdl-search, .smdl .smdl-top > .smdl-search-gap, .smdl .smdl-top:has(.smdl-live-actions) > .smdl-search { grid-column: 2; grid-row: 2; }
}
@media (min-width: 761px) and (max-width: 900px) {
  .smdl { --smdl-rail-width: var(--smdl-side-slim); }
}

/* Selects retain native form state; their floating list is always neutral.
   A selected item has text plus a check. Color is never the only state cue. */
.smdl-select-trigger {
  box-sizing: border-box; width: 100%; height: auto; min-height: var(--smdl-control-height);
  padding: var(--smdl-control-pad) 12px; gap: 14px; border: 1px solid var(--smdl-control-line);
  border-radius: var(--smdl-control-radius); background: var(--surface); color: var(--ink);
  font: inherit; font-size: var(--smdl-text-control); font-weight: 400; line-height: 1.4;
  text-align: left; box-shadow: none;
}
.smdl-select-trigger:hover { border-color: var(--smdl-control-line-hover); }
.smdl-select-trigger:focus-visible { outline: 2px solid var(--ink-2); outline-offset: 2px; box-shadow: none; }
.smdl-select.is-open .smdl-select-trigger { border-color: var(--ink-2); box-shadow: none; }
.smdl-select-arrow { flex: none; align-self: center; margin: -3px 3px 0 auto; width: 6px; height: 6px; }
.smdl-select-menu {
  padding: 5px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--surface); color: var(--ink); box-shadow: 0 8px 24px rgb(0 0 0 / 10%);
}
.smdl-select-option {
  display: flex; align-items: center; min-height: var(--smdl-control-height); padding: var(--smdl-control-pad) 34px var(--smdl-control-pad) 11px;
  border-radius: 6px; background: transparent; color: var(--ink-2);
  font-size: var(--smdl-text-control); line-height: 1.4; font-weight: 400;
}
.smdl-select-option:is(.is-selected,.is-active,:hover) { background: var(--surface-2); color: var(--ink); }
.smdl-select-option.is-selected { font-weight: 500; }
.smdl-select-option.is-active { outline: 1px solid var(--smdl-control-line-hover); outline-offset: -1px; }
.smdl-select-option.is-selected::after { border-color: var(--accent-ink, var(--ink)); }
.smdl-select.is-disabled .smdl-select-trigger { color: var(--ink-3); background: var(--surface-2); cursor: not-allowed; }
.smdl-select-group, .smdl-select-option small, .smdl-mobile-navigation-label {
  font-size: var(--smdl-text-meta); line-height: var(--smdl-leading-body);
  font-weight: var(--smdl-weight-medium); letter-spacing: normal; text-transform: none;
}
.smdl-select-option small { font-weight: var(--smdl-weight-regular); }
/* The select behavior uses a native dialog on phones. Its geometry belongs
   with the shared capability, including CORE/Account which have no product shell. */
.smdl-select-sheet {
  inset: auto 0 0; margin: 0 auto; width: min(100%,560px); max-width: 100%;
  max-height: calc(100dvh - 16px); padding: 0; border: 1px solid var(--line);
  border-radius: 16px 16px 0 0; background: var(--surface); color: var(--ink); overflow: hidden;
  box-shadow: 0 8px 24px rgb(0 0 0 / 10%);
}
.smdl-select-sheet[open] { display: flex; flex-direction: column; }
.smdl-select-sheet::backdrop { background: var(--scrim, rgb(0 0 0 / 25%)); }
.smdl-select-sheet > header {
  display: flex; align-items: center; justify-content: space-between; flex: none;
  padding: 8px 12px 8px 20px; border-bottom: 1px solid var(--line); gap: 12px;
}
.smdl-select-sheet > header button { min-width: 44px; min-height: 44px; }
.smdl-select-sheet > header strong {
  font-size: var(--smdl-text-body); line-height: var(--smdl-leading-body); font-weight: var(--smdl-weight-semibold);
}
.smdl-select-sheet .smdl-select-menu {
  position: relative; inset: auto; min-width: 0; min-height: 0;
  max-height: calc(100dvh - 86px); width: 100%; border: 0; border-radius: 0;
  box-shadow: none; overflow-y: auto; padding: 8px 8px max(16px,env(safe-area-inset-bottom)); outline: none;
}

/* Existing product primitives, shared by the independent application shells.
   CORE/Account adapt their separately named content components locally. */
.smdl .smdl-canvas { font-size: var(--smdl-text-body); line-height: 1.5; }
.smdl :is(.card h2,.empty h2,.formpage h2) {
  font-size: var(--smdl-text-section); line-height: var(--smdl-leading-heading);
  font-weight: var(--smdl-weight-semibold); letter-spacing: normal; text-transform: none;
}
.smdl :is(table.list,.reader,.kv,.card-sub,.pagehead .lede,.checkline,.note) {
  font-size: var(--smdl-text-body); line-height: 1.5;
}
.smdl :is(.pagehead .eyebrow,.field .label,.field .help,.help,.hint,.row-sub,.rowsub,.pill,
  table.list .ref,table.list th,.listcap,.pager-count,.chip) { font-size: var(--smdl-text-meta); line-height: 1.5; }
.smdl table.list th { text-transform: none; letter-spacing: normal; font-weight: var(--smdl-weight-medium); }
.smdl :is(.pagehead .eyebrow,.field .label,.listcap) {
  font-weight: var(--smdl-weight-medium); text-transform: none; letter-spacing: normal;
}
.smdl table.list td { padding-block: var(--smdl-row-padding); }
.smdl :is(.field .label,.pagehead .eyebrow) { margin-bottom: 8px; }
.smdl :is(.field > input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=file]),
  .field > textarea,.field > select:not(.smdl-select-native)) {
  box-sizing: border-box; min-height: var(--smdl-control-height); height: auto;
  padding: var(--smdl-control-pad) 12px; border-radius: var(--smdl-control-radius);
  font-size: var(--smdl-text-control); line-height: 1.4;
}
.smdl :is(.smdl-canvas,dialog) .btn {
  min-height: var(--smdl-control-height); height: auto; padding: var(--smdl-control-pad) 14px;
  font-size: var(--smdl-text-control); line-height: 1.35; border-radius: var(--smdl-control-radius);
  font-weight: var(--smdl-weight-medium); text-transform: none; letter-spacing: normal;
}
.smdl :is(.smdl-canvas,dialog) .btn-sm { min-height: var(--smdl-control-small); padding: 7px 12px; }
.smdl .smdl-canvas .form-grid { gap: 20px; }
.smdl .card-sub, .smdl .pagehead .lede { max-width: 76ch; }

/* The same profile surface, whether its host is CORE, Account or a product. */
.smdl .user-pop {
  width: 320px; min-width: 0; max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px);
  overflow-y: auto; padding: 8px; border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 12px 36px rgb(0 0 0 / 13%);
}
.smdl .user-pop-id { padding: 16px 12px 20px; gap: 12px; border-bottom: 1px solid var(--line); margin-bottom: 8px; }
.smdl .user-pop-id :is(.user-dot,.avatar) { width: 36px; height: 36px; font-size: 14px; flex: none; }
.smdl .user-pop-who { gap: 4px; line-height: 1.35; min-width: 0; }
.smdl .user-pop-who b { font-size: var(--smdl-text-body); font-weight: 500; }
.smdl .user-pop-who small { font-size: var(--smdl-text-meta); color: var(--ink-3); overflow-wrap: anywhere; }
.smdl .smdl-side .user-pop .user-pop-item {
  min-height: var(--smdl-control-height); padding: var(--smdl-control-pad) 12px; border-radius: 8px;
  font-size: var(--smdl-text-control); font-weight: 400; gap: 12px;
}
.smdl.is-slim .user-pop [data-smdl-side-toggle] { justify-content: flex-start; gap: 12px; }
.smdl.is-slim .user-pop [data-smdl-side-toggle] .lbl { display: inline; }
.smdl .user-pop-appearance { padding: 16px 16px 4px; }
.smdl .user-pop-label { color: var(--ink-2); font-size: var(--smdl-text-meta); font-weight: 500; margin: 0 0 10px; }
.smdl .theme-seg { padding: 3px; gap: 2px; border: 1px solid var(--line); border-radius: 9px; box-shadow: none; }
.smdl .theme-seg button {
  min-height: 36px; height: auto; padding: 6px 8px; border: 1px solid transparent;
  border-radius: 6px; font-size: var(--smdl-text-meta); font-weight: 400; line-height: 1.4;
}
.smdl .theme-seg button[aria-pressed="true"] { background: var(--surface); border-color: var(--line); box-shadow: none; font-weight: 500; }
.smdl .user-pop > form { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); }
.smdl-size-preference { margin: 0; padding: 16px; border: 0; min-width: 0; }
.smdl-size-preference legend { float: left; width: 100%; margin: 0 0 10px; padding: 0; font-size: var(--smdl-text-meta); font-weight: 500; color: var(--ink-2); }
.smdl-size-options { clear: both; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2px; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); }
.smdl-size-options label { position: relative; display: flex; align-items: center; justify-content: center; min-height: 36px; padding: 6px 8px; margin: 0; border: 1px solid transparent; border-radius: 6px; color: var(--ink-2); cursor: pointer; font-size: var(--smdl-text-meta); line-height: 1.4; }
.smdl-size-options label:has(input:checked) { background: var(--surface); border-color: var(--line); color: var(--ink); font-weight: 500; }
.smdl-size-options label:has(input:focus-visible) { outline: 2px solid var(--ink-2); outline-offset: 2px; }
.smdl-size-options input[type=radio] { position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; margin: 0; opacity: 0; }
.smdl-size-preference p { margin: 10px 0 0; font-size: var(--smdl-text-meta); line-height: 1.5; color: var(--ink-3); }
.smdl-size-preference [role=status]:empty { display: none; }
@media (max-width: 760px) {
  .smdl-select-trigger, .smdl-select-option { font-size: 16px; }
  .smdl-select-sheet .smdl-select-option { min-height: 56px; }
  .smdl :is(.smdl-search,.smdl-new-main,.smdl-new-caret,.smdl-iconbtn) { min-height: 44px; }
}