/*
 * Caliber Studio - regulated templates, compliance reports, importers, tracker sync, OSLC QM, AI assistance, plan and packages,
 * diagnostics (caliber_compliance.js, caliber_interop.js, caliber_ai.js, caliber_onboarding.js). [UI round 2026-10-13, U2]
 * Carbon tokens only; logical properties; phone width (400 px) is one column with no horizontal page scroll.
 */
.u2-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: var(--cds-spacing-05); margin: 0 0 var(--cds-spacing-06); }
.u2-cards > [role="listitem"] { min-width: 0; display: flex; }
/* X1-013: the three plans sit side by side where there is room for them, never two and one */
.u2-cards > .u2-cards__detail { grid-column: 1 / -1; display: block; }
.u2-cards--tiers { grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); }
.u2-card {
  display: flex; flex-direction: column; gap: var(--cds-spacing-03); inline-size: 100%; min-inline-size: 0;
  background: var(--cds-layer-02); border: 1px solid var(--cds-border-subtle-02); border-block-start: 3px solid transparent;
  padding: var(--cds-spacing-05);
}
.u2-card.is-on { border-block-start-color: var(--cds-support-success); border-color: var(--cds-border-strong-01); }
.u2-card.is-locked { border-block-start-color: var(--cds-support-warning); }
.u2-card__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--cds-spacing-03); }
.u2-card__title { margin: 0; font-size: var(--f-lg); line-height: var(--lh-normal); font-weight: var(--fw-semibold); color: var(--cds-text-primary); min-inline-size: 0; overflow-wrap: anywhere; }
.u2-card__text { margin: 0; color: var(--cds-text-secondary); }
.u2-card__facts { margin: 0; padding-inline-start: var(--cds-spacing-05); font-size: var(--f-sm); color: var(--cds-text-secondary); }
.u2-card__actions { margin-block-start: auto; display: flex; flex-wrap: wrap; gap: var(--cds-spacing-03); align-items: center; }
.u2-card__actions p { margin: 0; }

.u2-list { margin: 0; padding-inline-start: var(--cds-spacing-05); }
.u2-list li + li { margin-block-start: var(--cds-spacing-01); }
.u2-tight { margin: var(--cds-spacing-02) 0 0; font-size: var(--f-sm); }
.u2-tags { display: flex; flex-wrap: wrap; gap: var(--cds-spacing-02); margin: 0; }
.u2-detail { margin-block-start: var(--cds-spacing-06); }
.u2-outline { margin: 0; padding-inline-start: var(--cds-spacing-05); }
.u2-fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: var(--cds-spacing-03); }
.u2-fieldset legend { padding: 0; margin-block-end: var(--cds-spacing-03); font-weight: var(--fw-semibold); }
.u2-bar { justify-content: space-between; margin-block-end: var(--cds-spacing-04); }
.u2-file { overflow-wrap: anywhere; }
.u2-form { display: grid; gap: var(--cds-spacing-05); margin-block-end: var(--cds-spacing-06); min-inline-size: 0; }
.u2-pick { min-inline-size: 0; }
.u2-form .ct-form-grid { align-items: start; }
.u2-ask { display: grid; gap: var(--cds-spacing-04); max-inline-size: 480px; }
.u2-steps { margin: 0 0 var(--cds-spacing-05); padding-inline-start: var(--cds-spacing-06); }
.u2-steps li + li { margin-block-start: var(--cds-spacing-02); }
.u2-upgrade { margin: 0; padding: var(--cds-spacing-03) var(--cds-spacing-04); border-inline-start: 3px solid var(--cds-support-warning); background: var(--cds-layer-01); color: var(--cds-text-primary); }
.u2-ai-off { border-inline-start: 3px solid var(--cds-support-warning); background: var(--cds-layer-02); padding: var(--cds-spacing-04) var(--cds-spacing-05); margin: 0 0 var(--cds-spacing-05); }
.u2-ai-off p { margin: 0 0 var(--cds-spacing-03); max-inline-size: 72ch; }
.u2-ai-off p:last-child { margin-block-end: 0; }
.u2-ai-panel { margin-block-start: var(--cds-spacing-05); padding: var(--cds-spacing-04) var(--cds-spacing-05); background: var(--cds-layer-01); border: 1px solid var(--cds-border-subtle-01); border-inline-start: 3px solid var(--cds-support-info); }
.u2-ai-panel .ct-h { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-03); }
.u2-ai-panel p { margin: var(--cds-spacing-03) 0 0; }

@media (max-width: 671px) {
  .u2-card { padding: var(--cds-spacing-04); }
  .u2-bar { align-items: flex-start; }
}