/* ============================================================
   MegaCash Portal — u.css  (SEC-AE3)
   Utility + micro-component classes.
   Eliminates all inline style= attributes from portal HTML/JS
   so style-src 'unsafe-inline' can be removed from CSP.
   Load AFTER portal.css on every portal page.
   ============================================================ */

/* ── Visibility ────────────────────────────────────────────── */
/* Initially-hidden elements; JS toggles via el.style.display   */
.u-hidden { display: none; }

/* ── Display ────────────────────────────────────────────────── */
.u-d-block       { display: block; }
.u-d-flex        { display: flex; }
.u-d-iblock      { display: inline-block; }
.u-d-grid        { display: grid; }

/* ── Flex helpers ────────────────────────────────────────────── */
.u-items-center  { align-items: center; }
.u-items-start   { align-items: flex-start; }
.u-jc-between    { justify-content: space-between; }
.u-jc-center     { justify-content: center; }
.u-flex-wrap     { flex-wrap: wrap; }
.u-flex-1        { flex: 1; }
.u-shrink-0      { flex-shrink: 0; }

/* ── Gap ─────────────────────────────────────────────────────── */
.u-gap-1 { gap: 0.35rem; }
.u-gap-2 { gap: 0.5rem; }
.u-gap-3 { gap: 0.75rem; }
.u-gap-4 { gap: 1rem; }
.u-gap-5 { gap: 1.25rem; }

/* ── Compound flex rows (most common combinations) ──────────── */
/* display:flex; gap:0.75rem */
.u-row-3       { display: flex; gap: 0.75rem; }
/* display:flex; gap:0.5rem; align-items:center */
.u-row-2       { display: flex; align-items: center; gap: 0.5rem; }
/* display:flex; gap:0.75rem; flex-wrap:wrap */
.u-row-3-wrap  { display: flex; gap: 0.75rem; flex-wrap: wrap; }
/* display:flex; align-items:center; gap:0.75rem */
.u-row-3-items { display: flex; align-items: center; gap: 0.75rem; }
/* display:flex; align-items:center; gap:0.6rem */
.u-row-3-items-6 { display: flex; align-items: center; gap: 0.6rem; }
/* display:flex; align-items:center; gap:0.65rem */
.u-row-3-items-65 { display: flex; align-items: center; gap: 0.65rem; }

/* ── Compound flex layouts ──────────────────────────────────── */
/* Filter bar: flex + gap + wrap + center */
.u-filter-bar {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
  align-items: center;
}
/* Panel header: space-between + center + mb */
.u-panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.25rem;
}
/* Panel header (flex-start alignment) */
.u-panel-header-start {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 1.25rem;
}
/* Reviewer row */
.u-reviewer-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  font-size: 0.875rem;
  margin-bottom: 1.25rem;
}

/* ── Grid ────────────────────────────────────────────────────── */
.u-grid-2      { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
.u-grid-3      { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1rem; }
.u-grid-span   { grid-column: 1 / -1; }
@media (max-width: 600px) {
  .u-grid-2, .u-grid-3 { grid-template-columns: 1fr; }
}

/* ── Margin ──────────────────────────────────────────────────── */
.u-m-0   { margin: 0; }
.u-mt-px { margin-top: 2px; }
.u-mt-1  { margin-top: 0.25rem; }
.u-mt-2  { margin-top: 0.5rem; }
.u-mt-3  { margin-top: 0.75rem; }
.u-mt-4  { margin-top: 1rem; }
.u-mt-5  { margin-top: 1.25rem; }
.u-mb-0  { margin-bottom: 0; }
.u-mb-1  { margin-bottom: 0.35rem; }
.u-mb-2  { margin-bottom: 0.5rem; }
.u-mb-3  { margin-bottom: 0.75rem; }
.u-mb-35 { margin-bottom: 0.9rem; }
.u-mb-4  { margin-bottom: 1rem; }
.u-mb-5  { margin-bottom: 1.25rem; }
.u-mb-6  { margin-bottom: 1.5rem; }
.u-ml-auto { margin-left: auto; }
.u-ml-1    { margin-left: 0.35rem; }
.u-ml-2    { margin-left: 0.4rem; }
.u-mr-1    { margin-right: 0.4rem; }
.u-mr-2    { margin-right: 5px; }

/* ── Padding ─────────────────────────────────────────────────── */
.u-p-0    { padding: 0; }
.u-p-card { padding: 1rem 1.5rem; }

/* ── Sizing ──────────────────────────────────────────────────── */
.u-w-full { width: 100%; }

/* ── Overflow ────────────────────────────────────────────────── */
.u-overflow-x { overflow-x: auto; }

/* ── Text color ──────────────────────────────────────────────── */
.u-text-muted   { color: #94a3b8; }
.u-text-dark    { color: #1e293b; }
.u-text-body    { color: #374151; }
.u-text-mid     { color: #64748b; }
.u-text-gray    { color: #6b7280; }
.u-text-success { color: #15803d; }
.u-text-success2 { color: #16a34a; }
.u-text-danger  { color: #dc2626; }
.u-text-warn    { color: #d97706; }
.u-text-amber   { color: #92400e; }
.u-text-link    { color: #2563eb; }
.u-text-brand   { color: #15803d; }
.u-text-orange  { color: #f59e0b; }
.u-text-white   { color: #ffffff; }

/* ── Font size ───────────────────────────────────────────────── */
.u-text-xxs  { font-size: 0.65rem; }
.u-text-tiny { font-size: 0.7rem; }
.u-text-xs   { font-size: 0.72rem; }
.u-text-xs2  { font-size: 0.75rem; }
.u-text-sm   { font-size: 0.78rem; }
.u-text-sm2  { font-size: 0.8rem; }
.u-text-sm3  { font-size: 0.82rem; }
.u-text-base { font-size: 0.875rem; }
.u-text-md   { font-size: 0.95rem; }
.u-text-lg   { font-size: 1rem; }
.u-text-xl   { font-size: 1.1rem; }
.u-text-2xl  { font-size: 1.25rem; }
.u-text-3xl  { font-size: 1.5rem; }
.u-text-4xl  { font-size: 2rem; }

/* ── Font weight ─────────────────────────────────────────────── */
.u-fw-500 { font-weight: 500; }
.u-fw-600 { font-weight: 600; }
.u-fw-700 { font-weight: 700; }
.u-fw-800 { font-weight: 800; }

/* ── Text alignment / decoration ─────────────────────────────── */
.u-text-center   { text-align: center; }
.u-text-right    { text-align: right; }
.u-underline     { text-decoration: underline; }
.u-no-underline  { text-decoration: none; }
.u-uppercase     { text-transform: uppercase; }
.u-letter-space  { letter-spacing: 0.04em; }
.u-letter-space2 { letter-spacing: 0.05em; }
.u-nowrap        { white-space: nowrap; }
.u-prewrap       { white-space: pre-wrap; }

/* ── Line height ─────────────────────────────────────────────── */
.u-lh-6  { line-height: 1.6; }
.u-lh-18 { line-height: 1.8; }

/* ── Interactive ─────────────────────────────────────────────── */
.u-pointer     { cursor: pointer; }
.u-pointer-sel { cursor: pointer; user-select: none; }

/* ── Accent color ────────────────────────────────────────────── */
.u-accent-green { accent-color: #16a34a; }

/* ── Border / radius ─────────────────────────────────────────── */
.u-rounded     { border-radius: 8px; }
.u-rounded-sm  { border-radius: 4px; }
.u-rounded-md  { border-radius: 6px; }
.u-rounded-lg  { border-radius: 10px; }
.u-rounded-xl  { border-radius: 12px; }
.u-rounded-2xl { border-radius: 14px; }
.u-rounded-full{ border-radius: 999px; }

/* ── Combined text shorthands ────────────────────────────────── */
/* Table empty state */
.u-tbl-empty  { color: #94a3b8; text-align: center; padding: 2rem; }
.u-tbl-error  { color: #dc2626; text-align: center; padding: 2rem; }
.u-tbl-center { text-align: center; padding: 2rem; }
/* Compact empty state */
.u-empty-sm   { color: #94a3b8; font-size: 0.875rem; text-align: center; padding: 1.5rem 0; }
/* Sub-text under a value */
.u-sub-text   { font-size: 0.8rem; color: #94a3b8; }
/* Result count (right-aligned in filter bar) */
.u-result-count { font-size: 0.8rem; color: #94a3b8; margin-left: auto; }
/* Cell name (bold, dark) */
.u-cell-name  { font-weight: 600; color: #1e293b; font-size: 0.875rem; }
/* Cell value */
.u-cell-val   { font-size: 0.875rem; color: #1e293b; }
/* Cell label (muted, small) */
.u-cell-label { font-size: 0.8rem; color: #64748b; }
/* Brand-color text + bold */
.u-text-green-600 { color: #15803d; font-weight: 600; }
/* Danger + bold */
.u-val-danger  { color: #dc2626; font-weight: 600; }
/* Success + bold */
.u-val-success { color: #16a34a; font-weight: 600; }
/* Warn + bold */
.u-val-warn    { color: #d97706; font-weight: 600; }
/* Meta label (tiny, uppercase) */
.u-meta-label {
  font-size: 0.7rem;
  color: #94a3b8;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.2rem;
}

/* ── Form controls ───────────────────────────────────────────── */
/* Standard filter-bar select */
.u-filter-select {
  padding: 0.5rem 0.75rem;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  font-size: 0.875rem;
  color: #374151;
  background: #f8fafc;
}
/* Standard text input (1e293b dark text) */
.portal-input {
  width: 100%;
  padding: 0.6rem 0.85rem;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  font-size: 0.875rem;
  color: #1e293b;
  background: #f8fafc;
  box-sizing: border-box;
}
/* Text input (374151 body text) */
.portal-input-sm {
  width: 100%;
  padding: 0.6rem 0.8rem;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  font-size: 0.875rem;
  color: #374151;
  background: #f8fafc;
  box-sizing: border-box;
}
/* Text input (larger font) */
.portal-input-lg {
  width: 100%;
  padding: 0.65rem 0.9rem;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  font-size: 0.95rem;
  color: #1e293b;
  background: #f8fafc;
  box-sizing: border-box;
}
/* Form label (0.875rem) */
.u-form-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  color: #374151;
  margin-bottom: 0.4rem;
}
/* Form label (0.8rem) */
.u-form-label-sm {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  color: #374151;
  margin-bottom: 0.35rem;
}
/* Hint / secondary text below input */
.u-field-hint { font-size: 0.875rem; color: #64748b; margin-bottom: 1rem; }
/* Checkbox + label row */
.u-checkbox-label {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.875rem;
  color: #374151;
  cursor: pointer;
  white-space: nowrap;
}
/* Checkbox + label row (flex-start) */
.u-checkbox-label-start {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  cursor: pointer;
  font-size: 0.875rem;
  color: #374151;
}
/* Checkbox + label row (with wrap) */
.u-checkbox-label-wrap {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.875rem;
  color: #374151;
  cursor: pointer;
}

/* ── Load more / progress bar ────────────────────────────────── */
.u-load-more      { display: none; font-size: 0.8rem; padding: 0.5rem 1.5rem; }
.u-upload-progress{ display: none; width: 100%; height: 6px; margin-top: 4px; accent-color: #16a34a; }

/* ── Buttons ─────────────────────────────────────────────────── */
/* Close / dismiss icon button */
.u-btn-close {
  background: none;
  border: none;
  cursor: pointer;
  color: #94a3b8;
  font-size: 1.25rem;
  padding: 0;
  line-height: 1;
}
/* Text-link style button */
.u-btn-text {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 0.8rem;
  color: #2563eb;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* Tertiary outline action button */
.u-btn-action {
  background: none;
  border: 1.5px solid #e2e8f0;
  border-radius: 6px;
  cursor: pointer;
  color: #64748b;
  font-size: 0.8rem;
  font-weight: 600;
  padding: 0.35rem 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}
/* btn-portal size overrides */
.u-btn-sm  { padding: 0.25rem 0.75rem; font-size: 0.75rem; }
.u-btn-xs  { padding: 0.3rem 0.7rem;   font-size: 0.8rem; }
.u-btn-xs2 { padding: 0.3rem 0.7rem;   font-size: 0.78rem; margin-right: 0.4rem; }
.u-btn-badge { font-size: 0.7rem; padding: 0.2rem 0.65rem; }
.u-btn-badge2 { font-size: 0.75rem; padding: 0.2rem 0.6rem; flex-shrink: 0; }

/* ── Modal overlay ───────────────────────────────────────────── */
.modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 1000;
  align-items: center;
  justify-content: center;
}
/* Confirmation / small modal card */
.u-modal-card {
  background: #fff;
  border-radius: 14px;
  padding: 32px 28px;
  max-width: 380px;
  width: 90%;
  text-align: center;
  box-shadow: 0 8px 32px rgba(0,0,0,0.18);
}

/* ── Alert / info boxes ──────────────────────────────────────── */
/* Base alert */
.u-alert {
  border-radius: 10px;
  padding: 0.85rem 1rem;
  margin-bottom: 1.25rem;
  font-size: 0.85rem;
  line-height: 1.6;
}
.u-alert-success  { background: #f0fdf4; border: 1px solid #bbf7d0; color: #166534; }
.u-alert-success2 { background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 10px; padding: 0.9rem 1rem; margin-bottom: 1.25rem; font-size: 0.82rem; color: #166534; line-height: 1.6; }
.u-alert-warning  { background: #fffbeb; border: 1.5px solid #fcd34d; color: #78350f; }
.u-alert-warning2 { background: #fffbeb; border: 1.5px solid #fde68a; }
.u-alert-warning3 { background: #fffbeb; border: 1.5px solid #fcd34d; border-radius: 8px; padding: 0.85rem 1rem; margin-bottom: 1.25rem; font-size: 0.85rem; color: #78350f; line-height: 1.8; }
.u-alert-danger   { background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; }
.u-alert-info     { background: #eff6ff; border: 1px solid #bfdbfe; color: #1e40af; }
/* Note / callout with left border */
.u-note-success { background: #f0fdf4; border-left: 3px solid #86efac; border-radius: 6px; padding: 0.85rem 1rem; margin-bottom: 1rem; }
.u-note-warning { background: #fef9c3; border-left: 3px solid #ca8a04; border-radius: 6px; padding: 0.85rem 1rem; }
.u-note-danger  { background: #fef2f2; border-left: 3px solid #f87171; border-radius: 6px; padding: 0.85rem 1rem; }

/* ── Card border variants ────────────────────────────────────── */
.card-amber { border: 2px solid #f59e0b; }
.card-green { border: 2px solid #86efac; }

/* ── Inline chips / tags (smaller than .badge pills) ─────────── */
.chip {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 0.72rem;
  font-weight: 700;
}
.chip-red    { background: #fee2e2; color: #991b1b; }
.chip-yellow { background: #fef9c3; color: #92400e; }
.chip-green  { background: #dcfce7; color: #166534; }
.chip-blue   { background: #dbeafe; color: #1e40af; }
.chip-gray   { background: #f1f5f9; color: #64748b; }
.chip-amber  { background: #fef3c7; color: #92400e; }

/* ── Small badge variants (with margin/vertical-align) ───────── */
.badge-xs {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 0.65rem;
  font-weight: 700;
  vertical-align: middle;
  margin-right: 5px;
}
.badge-xs-red    { background: #fee2e2; color: #991b1b; }
.badge-xs-blue   { background: #dbeafe; color: #1d4ed8; }
.badge-xs-gray   { background: #f1f5f9; color: #64748b; }
.badge-xs-green  { background: #dcfce7; color: #166534; }
.badge-xs-yellow { background: #fef3c7; color: #92400e; }

/* ── Avatar / media placeholders ────────────────────────────── */
.u-avatar-placeholder {
  background: #f1f5f9;
  border-radius: 8px;
  width: 180px;
  height: 180px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  font-size: 0.8rem;
}

/* ── Additional text combos ──────────────────────────────────── */
/* font-size:0.875rem; color:#94a3b8 */
.u-text-muted-base { font-size: 0.875rem; color: #94a3b8; }
/* font-size:0.82rem; color:#374151 */
.u-sm3-body { font-size: 0.82rem; color: #374151; }
/* color:#f59e0b; font-size:0.8rem; font-weight:600 */
.u-warn-label { color: #f59e0b; font-size: 0.8rem; font-weight: 600; }
/* color:#f59e0b; font-weight:600 */
.u-text-orange-bold { color: #f59e0b; font-weight: 600; }
/* font-size:1rem; font-weight:700; color:#1e293b; mb:1.25rem */
.u-section-title { font-size: 1rem; font-weight: 700; color: #1e293b; margin-bottom: 1.25rem; }
/* font-size:1rem; font-weight:700; color:#1e293b; mb:0.5rem */
.u-section-title-sm { font-size: 1rem; font-weight: 700; color: #1e293b; margin-bottom: 0.5rem; }
/* font-size:0.85rem; font-weight:700; color:#64748b; uppercase; letter-spacing; mb:0.75rem */
.u-section-label {
  font-size: 0.85rem; font-weight: 700; color: #64748b;
  text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.75rem;
}
/* margin:0; font-size:0.78rem; color:#94a3b8 */
.u-muted-hint { font-size: 0.78rem; color: #94a3b8; margin: 0; }
/* font-size:0.75rem; margin-top:0.35rem */
.u-hint-sm { font-size: 0.75rem; margin-top: 0.35rem; }
/* margin:0 auto 0.5rem; display:block */
.u-centered-block { margin: 0 auto 0.5rem; display: block; }

/* ── Additional table empties ─────────────────────────────────── */
/* text-align:center; padding:1rem 0 0.25rem */
.u-tbl-footer { text-align: center; padding: 1rem 0 0.25rem; }
/* text-align:center; padding:1.5rem 0 */
.u-tbl-center-sm { text-align: center; padding: 1.5rem 0; }
/* color:#94a3b8; text-align:center; padding:1rem */
.u-tbl-empty-1 { color: #94a3b8; text-align: center; padding: 1rem; }
/* padding:1.5rem; text-align:center; color:#94a3b8; font-size:0.85rem */
.u-tbl-empty-2 { padding: 1.5rem; text-align: center; color: #94a3b8; font-size: 0.85rem; }
/* text-align:center; margin:1.5rem 0 */
.u-text-center-my { text-align: center; margin: 1.5rem 0; }
/* text-align:center; margin-bottom:1.25rem */
.u-text-center-mb { text-align: center; margin-bottom: 1.25rem; }

/* ── Additional flex combos ──────────────────────────────────── */
/* display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem */
.u-panel-header-4 {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem;
}
/* display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem */
.u-panel-header-4b {
  display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem;
}
/* display:flex; align-items:flex-start; gap:1rem */
.u-row-items-start { display: flex; align-items: flex-start; gap: 1rem; }

/* ── Textarea inputs ─────────────────────────────────────────── */
/* width:100%; padding:0.6rem 0.85rem; border:1.5px solid #e2e8f0; border-radius:8px; font-size:0.875rem; color:#1e293b; background:#f8fafc; resize:vertical; box-sizing:border-box */
.portal-textarea {
  width: 100%; padding: 0.6rem 0.85rem;
  border: 1.5px solid #e2e8f0; border-radius: 8px;
  font-size: 0.875rem; color: #1e293b; background: #f8fafc;
  resize: vertical; box-sizing: border-box;
}
/* with font-family:inherit */
.portal-textarea-ff {
  width: 100%; padding: 0.65rem 0.9rem;
  border: 1.5px solid #e2e8f0; border-radius: 8px;
  font-size: 0.875rem; color: #1e293b; background: #f8fafc;
  resize: vertical; font-family: inherit;
}
/* smaller select variant with min-width */
.u-filter-select-wide { padding: 0.5rem 0.75rem; border: 1.5px solid #e2e8f0; border-radius: 8px; font-size: 0.875rem; color: #374151; background: #f8fafc; min-width: 220px; }
.u-filter-select-xl   { padding: 0.5rem 0.75rem; border: 1.5px solid #e2e8f0; border-radius: 8px; font-size: 0.875rem; color: #374151; background: #f8fafc; min-width: 260px; }
/* compact small input without width:100% */
.u-input-inline {
  padding: 0.55rem 0.85rem; border: 1.5px solid #e2e8f0;
  border-radius: 8px; font-size: 0.875rem; color: #1e293b; background: #f8fafc;
}
.u-input-sm2 {
  padding: 0.45rem 0.6rem; border: 1.5px solid #e2e8f0;
  border-radius: 6px; font-size: 0.8rem; color: #374151; background: #f8fafc;
}
/* input with box-sizing only (no width:100%) */
.portal-input-bare {
  width: 100%; padding: 0.5rem 0.75rem;
  border: 1.5px solid #e2e8f0; border-radius: 8px;
  font-size: 0.875rem; color: #1e293b; background: #f8fafc; box-sizing: border-box;
}

/* ── Button size variants ─────────────────────────────────────── */
/* font-size:0.8rem; padding:0.5rem 0.85rem */
.u-btn-sm2 { font-size: 0.8rem; padding: 0.5rem 0.85rem; }
/* padding:0.5rem 1.25rem; font-size:0.875rem */
.u-btn-md  { padding: 0.5rem 1.25rem; font-size: 0.875rem; }
/* padding:0.35rem 0.9rem; font-size:0.8rem */
.u-btn-xs3 { padding: 0.35rem 0.9rem; font-size: 0.8rem; }

/* ── Divider ─────────────────────────────────────────────────── */
.u-divider { border: none; border-top: 1px solid #e2e8f0; margin: 1.25rem 0; }

/* ── Modal cards (size variants) ─────────────────────────────── */
.u-modal-card-lg {
  background: #fff; border-radius: 16px; padding: 2rem;
  max-width: 400px; width: 90%; box-shadow: 0 8px 32px rgba(0,0,0,0.15);
}
.u-modal-card-sm {
  background: #fff; border-radius: 16px; padding: 2rem;
  max-width: 360px; width: 90%; box-shadow: 0 8px 32px rgba(0,0,0,0.15);
}

/* ── form-label variant (mb:0.3rem) ──────────────────────────── */
.u-form-label-xs {
  display: block; font-size: 0.8rem; font-weight: 600;
  color: #374151; margin-bottom: 0.3rem;
}

/* ── margin-top:0 / margin-top:0.3rem ────────────────────────── */
.u-mt-0  { margin-top: 0; }
.u-mt-05 { margin-top: 0.3rem; }

/* ── display:flex; gap:0.5rem (centre) ───────────────────────── */
.u-row-jc-2 { display: flex; gap: 10px; justify-content: center; }

/* ── modal overlay z-index:600 variant ───────────────────────── */
.modal-overlay-sm {
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,0.4); z-index: 600;
  align-items: center; justify-content: center;
}

/* ── margin:0 auto 0 auto (for centred elements) ─────────────── */
.u-mx-auto { margin-left: auto; margin-right: auto; }

/* ── Progress bar fill ───────────────────────────────────────── */
/* Width and background-color set via el.style after render */
.progress-fill {
  height: 100%;
  border-radius: 999px;
  transition: width 0.4s;
}
/* Timeline dot (color set via el.style after render) */
.tl-dot-sm {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 5px;
}

/* ── Round-3 additions ────────────────────────────────────────── */

/* Colours */
.u-text-green2        { color: #166534; }
.u-text-success-bold  { color: #15803d; font-weight: 700; }
.u-text-green2-bold   { color: #166534; font-weight: 600; }
.u-text-danger-bold   { color: #dc2626; font-weight: 600; }
.u-text-base-bold     { color: #1e293b; font-size: 0.875rem; font-weight: 700; }
.u-section-hdr        { color: #1e293b; font-size: 0.875rem; font-weight: 700; margin-bottom: 0.75rem; }
.u-panel-title        { color: #1e293b; font-size: 1.1rem; font-weight: 700; margin-bottom: 0.5rem; }
.u-item-title         { color: #1e293b; font-size: 0.875rem; font-weight: 600; margin-bottom: 0.2rem; }
.u-subsect-title      { color: #374151; font-size: 0.85rem; font-weight: 700; margin-bottom: 0.75rem; }
.u-text-body-sm       { color: #374151; font-size: 0.85rem; }

/* Monospace */
.u-mono             { font-family: monospace; }
.u-mono-sm          { font-family: monospace; font-size: 0.78rem; }
.u-mono-xs-muted    { font-family: monospace; font-size: 0.75rem; color: #94a3b8; }

/* Muted + size combos */
.u-text-xs2-muted   { font-size: 0.75rem; color: #94a3b8; }
.u-text-tiny-muted  { font-size: 0.7rem;  color: #94a3b8; }
.u-text-sm-muted-ml { font-size: 0.78rem; color: #94a3b8; margin-left: 0.75rem; }
.u-tbl-empty-lg     { color: #94a3b8; font-size: 0.875rem; padding: 2rem 0; text-align: center; }

/* Mid-colour combos */
.u-cell-label-mb5   { color: #64748b; font-size: 0.8rem; margin-bottom: 1.25rem; }
.u-field-label-sm   { display: block; font-size: 0.8rem; font-weight: 600; color: #64748b; margin-bottom: 0.3rem; }

/* Amber */
.u-link-amber        { color: #f59e0b; font-size: 0.8rem; font-weight: 600; text-decoration: none; }
.u-icon-amber-sm     { color: #f59e0b; font-size: 0.7rem; margin-left: 2px; }
.u-text-amber-bold-mr { color: #f59e0b; font-weight: 600; margin-right: 0.5rem; }

/* Border */
.u-border-danger-light { border-color: #fca5a5; }

/* Button variants */
.u-btn-xs5  { font-size: 0.8rem;  padding: 0.4rem 0.9rem; }
.u-btn-xs6  { font-size: 0.78rem; padding: 0.35rem 0.75rem; }
.u-btn-xs-row { display: flex; align-items: center; gap: 0.4rem; font-size: 0.8rem; padding: 0.4rem 0.9rem; }
.u-btn-as-sm  { align-self: flex-start; font-size: 0.8rem; padding: 0.45rem 1rem; }

/* Flex row variants */
.u-row-g2        { display: flex; gap: 0.5rem; }
.u-row-right-3   { display: flex; gap: 0.75rem; justify-content: flex-end; }
.u-row-flex1-sm  { display: flex; align-items: center; flex: 1; gap: 0.4rem; min-width: 0; }
.u-col-3-mt      { display: flex; flex-direction: column; gap: 0.6rem; margin-top: 0.75rem; }
.u-filter-bar-mb { display: flex; align-items: center; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 1.25rem; }
.u-collapsible-hdr {
  display: flex; align-items: center; gap: 0.5rem;
  font-size: 0.875rem; font-weight: 700; color: #1e293b;
  cursor: pointer; list-style: none; user-select: none;
}

/* Grid 0.75rem-gap variant */
.u-grid-2b { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
@media (max-width: 600px) { .u-grid-2b { grid-template-columns: 1fr; } }

/* Panel header mb:0.75rem variant */
.u-panel-header-3 { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem; }

/* Modal overlay z-index:500 */
.modal-overlay-xs {
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,0.4); z-index: 500;
  align-items: center; justify-content: center;
}

/* Modal card 440px */
.u-modal-card-md {
  background: #fff; border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.18);
  margin: 1rem; max-width: 440px; padding: 2rem; width: 100%;
}

/* Collapsible/expand panel */
.u-expand-panel {
  display: none; border-top: 1px solid #f1f5f9;
  padding-top: 0.75rem; margin-bottom: 1.25rem;
}

/* Avatar / upload placeholder */
.u-avatar-upload {
  display: flex; align-items: center; justify-content: center;
  background: #f1f5f9; border-radius: 8px;
  color: #94a3b8; font-size: 0.8rem;
  height: 180px; width: 180px; margin: 0 auto;
}

/* Input compact variant (padding 0.6/0.8, color #374151) */
.portal-input-compact {
  width: 100%; padding: 0.6rem 0.8rem;
  border: 1.5px solid #e2e8f0; border-radius: 8px;
  font-size: 0.875rem; color: #374151; background: #f8fafc;
}

/* ── Round-4.5: search widget + badges + alert patterns ─────── */

/* Search overlay widget */
.u-search-panel      { background:#fff; border-radius:16px; box-shadow:0 20px 60px rgba(0,0,0,0.25); margin:0 1rem; max-width:560px; overflow:hidden; width:100%; }
.u-search-input-bar  { display:flex; align-items:center; gap:0.6rem; padding:0.85rem 1rem; border-bottom:1.5px solid #f1f5f9; }
.u-search-input      { background:transparent; border:none; color:#1e293b; flex:1; font-size:0.95rem; outline:none; }
.u-kbd               { border-radius:4px; border:1px solid #e2e8f0; color:#94a3b8; font-size:0.7rem; padding:1px 5px; }
.u-search-results    { max-height:380px; overflow-y:auto; padding:0.5rem 0; }
.u-search-group-label { color:#94a3b8; font-size:0.7rem; font-weight:700; letter-spacing:0.07em; padding:0.25rem 1rem 0.1rem; text-transform:uppercase; }
.u-search-item       { display:flex; align-items:center; gap:0.75rem; padding:0.65rem 1rem; cursor:pointer; border-radius:8px; margin:0 0.25rem; }
.u-search-item:hover { background:#f8fafc; }
.u-search-item-title { color:#1e293b; font-size:0.875rem; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.u-search-item-sub   { color:#94a3b8; font-size:0.75rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.u-center-p6         { padding:1.5rem; text-align:center; }

/* Mini badges (tickets) */
.u-badge-sm-green   { background:#dcfce7; border-radius:12px; color:#166534; font-size:0.75rem; padding:2px 8px; }
.u-badge-sm-yellow  { background:#fef9c3; border-radius:12px; color:#92400e; font-size:0.75rem; padding:2px 8px; }
.u-badge-xxs-danger { background:#fee2e2; border-radius:4px; color:#991b1b; font-size:0.7rem; font-weight:700; padding:0.1rem 0.45rem; }
.u-badge-xxs-orange { background:#ffedd5; border-radius:4px; color:#9a3412; font-size:0.7rem; font-weight:700; padding:0.1rem 0.45rem; }
.u-badge-xxs-gray   { background:#f1f5f9; border-radius:4px; color:#64748b; font-size:0.7rem; font-weight:700; padding:0.1rem 0.45rem; }

/* Textarea colored states */
.portal-textarea-warn { width:100%; padding:0.65rem 0.9rem; border:1.5px solid #fcd34d; border-radius:8px; font-size:0.875rem; color:#1e293b; background:#fefce8; resize:vertical; font-family:inherit; box-sizing:border-box; }
.portal-textarea-err  { width:100%; padding:0.65rem 0.9rem; border:1.5px solid #fca5a5; border-radius:8px; font-size:0.875rem; color:#1e293b; background:#fef2f2; resize:vertical; font-family:inherit; box-sizing:border-box; }

/* Alert boxes (apply.html style, smaller border) */
.u-alert-app-warn  { background:#fef3c7; border-radius:8px; border:1px solid #f59e0b; color:#92400e; font-size:0.875rem; margin-bottom:1.25rem; padding:0.875rem 1rem; }
.u-alert-app-err   { background:#fef2f2; border-radius:8px; border:1px solid #fca5a5; color:#991b1b; font-size:0.875rem; margin-bottom:1.25rem; padding:0.875rem 1rem; }
.u-alert-app-warn2 { background:#fffbeb; border-radius:8px; border:1px solid #fcd34d; color:#92400e; font-size:0.875rem; margin-bottom:1.25rem; padding:0.875rem 1rem; }
.u-success-panel   { background:#f0fdf4; border-radius:12px; border:1.5px solid #bbf7d0; margin-bottom:1.5rem; padding:1.25rem 1.5rem; }
.u-alert-base      { border-radius:8px; font-size:0.875rem; line-height:1.5; margin-bottom:1.1rem; padding:0.75rem 1rem; }
.u-alert-warn-fold { background:#fefce8; border-radius:10px; border:1.5px solid #fcd34d; color:#92400e; font-size:0.875rem; line-height:1.5; margin-bottom:1rem; padding:0.9rem 1.1rem; }

/* Modal typography (apply.html overlay) */
.u-modal-title { color:#111827; font-size:1.15rem; font-weight:700; margin:0 0 0.4rem; }
.u-modal-body  { color:#6b7280; font-size:0.875rem; line-height:1.5; margin:0 0 1.25rem; }
.u-hint-text   { color:#9ca3af; font-size:0.75rem; margin:0.75rem 0 0; }

/* Inline note boxes */
.u-inline-ok   { background:#ecfdf5; border-left:3px solid #34d399; border-radius:5px; color:#065f46; font-size:0.8rem; margin-top:0.35rem; padding:0.35rem 0.6rem; }
.u-inline-warn { background:#fefce8; border-left:3px solid #fcd34d; border-radius:5px; color:#b45309; font-size:0.8rem; margin-top:0.35rem; padding:0.35rem 0.6rem; }

/* Checkbox label rows */
.u-check-label      { display:flex; align-items:flex-start; color:#374151; cursor:pointer; font-size:0.875rem; gap:0.75rem; margin-bottom:1.5rem; }
.u-check-label-sm   { display:flex; align-items:flex-start; color:#374151; cursor:pointer; font-size:0.875rem; gap:0.6rem; }
.u-check-label-bold { display:flex; align-items:center; color:#374151; cursor:pointer; font-weight:600; gap:0.5rem; }
.u-check-label-bare { display:flex; align-items:flex-start; cursor:pointer; gap:0.75rem; }

/* Collapsible body panel */
.u-expand-body { background:#f9fafb; border-radius:10px; border:1px solid #e5e7eb; margin-top:0.75rem; padding:1rem; }

/* Hint / note boxes */
.u-hint-box { background:#f8fafc; border-radius:8px; color:#64748b; font-size:0.8rem; line-height:1.6; margin-bottom:1.25rem; padding:1rem; }
.u-note-box { background:#f8fafc; border-radius:8px; border:1px solid #e2e8f0; margin-bottom:1rem; padding:0.75rem 1rem; }

/* ── Round-5 additions ────────────────────────────────────────── */

/* Section labels */
.u-section-label-amber  { color:#f59e0b; font-size:0.7rem; font-weight:700; letter-spacing:0.08em; margin-bottom:1rem; text-transform:uppercase; }
.u-section-label-danger { color:#dc2626; font-size:0.7rem; font-weight:700; letter-spacing:0.08em; margin-bottom:0.75rem; text-transform:uppercase; }
.u-section-label-gray   { color:#6b7280; font-size:0.7rem; font-weight:700; letter-spacing:0.08em; margin-bottom:0.75rem; text-transform:uppercase; }
.u-section-label-gray2  { color:#6b7280; font-size:0.7rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; }

/* Divider rows */
.u-divider-hidden     { display:none; border-top:1px solid #f1f5f9; margin-top:1.25rem; padding-top:0.75rem; }
.u-divider-top        { border-top:1px solid #f1f5f9; margin-top:1.25rem; padding-top:1rem; }
.u-divider-warn-hidden  { display:none; border-top:1px solid #fde68a; margin-top:1.25rem; padding-top:1rem; }
.u-divider-danger-hidden { display:none; border-top:1px dashed #fecaca; margin-top:1.25rem; padding-top:1rem; }
.u-divider-hidden-mt4 { display:none; border-top:1px solid #f1f5f9; margin-top:1rem; padding-top:1rem; }

/* Textarea variants */
.portal-textarea-sm      { width:100%; padding:0.5rem 0.7rem; border:1.5px solid #e2e8f0; border-radius:6px; font-size:0.8rem; color:#1e293b; background:#f8fafc; resize:vertical; font-family:inherit; box-sizing:border-box; margin-bottom:0.5rem; }
.portal-textarea-compact { width:100%; padding:0.5rem 0.75rem; border:1.5px solid #e2e8f0; border-radius:8px; font-size:0.875rem; color:#1e293b; background:#f8fafc; resize:vertical; font-family:inherit; box-sizing:border-box; }
.portal-textarea-mb4     { width:100%; padding:0.65rem 0.9rem; border:1.5px solid #e2e8f0; border-radius:8px; font-size:0.875rem; color:#1e293b; background:#f8fafc; resize:vertical; font-family:inherit; box-sizing:border-box; margin-bottom:1rem; }
.portal-textarea-compact2 { width:100%; padding:0.6rem 0.75rem; border:1.5px solid #e2e8f0; border-radius:8px; font-size:0.875rem; color:#1e293b; background:#fff; resize:vertical; font-family:inherit; box-sizing:border-box; margin-bottom:0.6rem; }

/* Collapsible row */
.u-collapsible-row { display:flex; align-items:center; justify-content:space-between; cursor:pointer; user-select:none; }

/* Alert variants */
.u-alert-warning3 { background:#fffbeb; border-radius:8px; border:1.5px solid #fcd34d; color:#78350f; font-size:0.85rem; line-height:1.8; margin-bottom:1.25rem; padding:0.85rem 1rem; }
.u-alert-success3 { background:#f0fdf4; border-radius:8px; border:1.5px solid #bbf7d0; color:#166534; font-size:0.85rem; line-height:1.8; margin-bottom:1rem; padding:0.75rem 1rem; }
.u-alert-app-err2 { background:#fef2f2; border-radius:8px; border:1.5px solid #fecaca; margin-top:1rem; padding:1rem; }
.u-row-card-hidden { display:none; display:flex; align-items:center; background:#f8fafc; border-radius:8px; border:1.5px solid #e2e8f0; gap:0.75rem; margin-bottom:1rem; padding:0.75rem 1rem; }
.u-err-inline { background:#fef2f2; border-radius:6px; color:#dc2626; font-size:0.8rem; margin-top:0.4rem; padding:0.5rem 0.75rem; }
.u-err-text      { color:#991b1b; font-size:0.875rem; margin:0 0 0.75rem; }
.u-err-text-bold { color:#991b1b; font-size:0.875rem; font-weight:600; margin:0 0 0.75rem; }

/* Note/display boxes */
.u-note-display        { background:#f8fafc; border-radius:8px; color:#374151; font-size:0.875rem; line-height:1.7; margin-bottom:0.5rem; padding:0.9rem 1rem; }
.u-note-display-hidden { background:#fff; border-radius:8px; border:1px solid #e2e8f0; color:#374151; font-size:0.8rem; line-height:1.8; margin-top:0.6rem; padding:0.85rem 1rem; }
.u-loan-summary-box    { background:#f0fdf4; border-radius:12px; border:2px solid #86efac; color:#374151; font-size:0.875rem; line-height:2; margin:0 auto 1.5rem; max-width:480px; padding:2rem; text-align:left; }

/* Amber button variants */
.u-btn-amber-xs5  { border-color:#f59e0b; color:#92400e; font-size:0.8rem; padding:0.4rem 0.9rem; }
.u-btn-amber-xs4  { border-color:#f59e0b; color:#b45309; font-size:0.8rem; padding:0.35rem 0.9rem; }

/* Modal cards */
.u-modal-card-460  { background:#fff; border-radius:12px; box-shadow:0 8px 32px rgba(0,0,0,0.18); margin:1rem; max-width:460px; padding:2rem; width:100%; }
.u-modal-card-440  { background:#fff; border-radius:14px; box-shadow:0 8px 32px rgba(0,0,0,0.18); max-width:440px; padding:2rem; width:100%; }
.u-modal-card-scroll { background:#fff; border-radius:12px; box-shadow:0 8px 32px rgba(0,0,0,0.18); margin:1rem; max-height:90vh; max-width:480px; overflow-y:auto; padding:2rem; width:100%; }
.modal-overlay-apply { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.55); z-index:900; align-items:center; justify-content:center; padding:1rem; }

/* Flex direction column */
.u-col-mb5 { display:flex; flex-direction:column; gap:0.75rem; margin-bottom:1.25rem; }
.u-col-sm  { display:flex; flex-direction:column; gap:0.6rem; }

/* Disabled flex item */
.u-disabled-flex { cursor:not-allowed; flex:1; opacity:0.5; }

/* Column/widget titles */
.u-col-title       { color:#1e293b; font-size:1.05rem; margin:0; }
.u-col-title-amber { color:#b45309; font-size:1.1rem; margin:0; }

/* Input variants */
.portal-input-narrow { width:100%; max-width:320px; padding:0.6rem 0.85rem; border:1.5px solid #e2e8f0; border-radius:8px; font-size:0.875rem; color:#1e293b; background:#f8fafc; }
.portal-input-fixed  { padding:0.45rem 0.75rem; border:1.5px solid #e2e8f0; border-radius:8px; font-size:0.875rem; color:#374151; background:#f8fafc; width:200px; }
.portal-input-sel    { padding:0.5rem 0.75rem; border:1.5px solid #e2e8f0; border-radius:8px; font-size:0.9rem; color:#1e293b; background:#f8fafc; cursor:pointer; }
.portal-input-flex   { flex:1; min-width:200px; padding:0.55rem 0.75rem; border:1.5px solid #e2e8f0; border-radius:8px; font-size:0.875rem; color:#1e293b; background:#f8fafc; font-family:inherit; }

/* Flex misc */
.u-row-3-mt2       { display:flex; align-items:center; gap:0.75rem; margin-top:0.5rem; }
.u-row-3-mt4       { display:flex; gap:0.75rem; margin-top:1rem; }
.u-row-btm-3       { display:flex; align-items:flex-end; flex-wrap:wrap; gap:0.75rem; }
.u-row-4-mb5       { display:flex; align-items:center; gap:1rem; margin-bottom:1.25rem; }
.u-row-wrap-4      { display:flex; align-items:center; flex-wrap:wrap; gap:1rem; }
.u-row-wrap-4-mt4  { display:flex; align-items:center; flex-wrap:wrap; gap:1rem; margin-top:1rem; }
.u-row-5-mb6       { display:flex; align-items:center; gap:1.25rem; margin-bottom:1.5rem; }
.u-row-baseline    { display:flex; align-items:baseline; flex-wrap:wrap; gap:0.75rem; }
.u-row-btm-3-mb4   { display:flex; align-items:flex-end; flex-wrap:wrap; gap:0.75rem; margin-bottom:1rem; }
.u-row-between-mb4 { display:flex; align-items:center; flex-wrap:wrap; gap:0.75rem; justify-content:space-between; margin-bottom:1rem; }
.u-row-g1          { display:flex; gap:0.4rem; }

/* Grid misc */
.u-grid-2d-mt4     { display:grid; grid-template-columns:1fr 1fr; gap:0.75rem; margin-top:1rem; }
.u-grid-auto-140   { display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); }
.u-grid-auto-160   { display:grid; gap:0.75rem; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); margin-bottom:0.5rem; }
.u-grid-2-start    { display:grid; align-items:start; gap:1.5rem; grid-template-columns:1fr 1fr; }
@media (max-width:600px) { .u-grid-2-start { grid-template-columns:1fr; } }

/* Payments.html stat widget */
.u-stat-hero  { background:linear-gradient(135deg,#15803d,#166534); border-radius:16px; color:#fff; margin-bottom:1.5rem; padding:1.5rem 1.75rem; }
.u-badge-hero { background:rgba(255,255,255,0.15); border-radius:8px; font-size:0.82rem; font-weight:600; margin-top:8px; padding:0.5rem 0.75rem; }
.u-stat-label { font-size:0.75rem; font-weight:700; letter-spacing:0.08em; margin-bottom:4px; opacity:0.75; text-transform:uppercase; }
.u-stat-value-lg { font-size:2rem; font-weight:800; letter-spacing:-0.5px; }
.u-stat-amount-success { color:#15803d; font-size:1.4rem; margin:0 0 0.35rem; }
.u-stat-sub     { color:#64748b; font-size:0.9rem; margin-bottom:2rem; }
.u-tbl-empty-c  { padding:2.5rem 2rem; text-align:center; }

/* Notification widget (supabase.js) */
.u-notif-link   { color:#1e293b; font-size:0.875rem; font-weight:700; text-decoration:none; }
.u-notif-footer { border-top:1px solid #f1f5f9; padding:0.6rem 1.1rem; text-align:center; }
.u-notif-action { color:#f59e0b; font-size:0.75rem; font-weight:600; text-decoration:none; }
.u-modal-title2 { color:#1f2937; font-size:1.1rem; margin:0 0 10px; }
.u-modal-body2  { color:#6b7280; font-size:0.93rem; margin:0 0 24px; }
.u-btn-portal-confirm { background:#16a34a; border-radius:8px; border:none; color:#fff; cursor:pointer; font-size:0.95rem; font-weight:600; padding:10px 22px; }
.u-btn-portal-cancel  { background:#f3f4f6; border-radius:8px; border:none; color:#374151; cursor:pointer; font-size:0.95rem; font-weight:600; padding:10px 22px; }

/* Typography */
.u-label-nowrap   { color:#374151; font-size:0.875rem; font-weight:600; white-space:nowrap; }
.u-section-title2 { color:#374151; font-size:0.875rem; font-weight:700; margin:1rem 0 0.75rem; }
.u-field-label-mb4 { color:#374151; font-size:0.82rem; font-weight:600; margin-bottom:1rem; }
.u-text-sm3-body-mb3 { color:#374151; font-size:0.82rem; margin-bottom:0.75rem; }
.u-text-sm3-body-lh  { color:#374151; font-size:0.82rem; line-height:1.5; }
.u-text-sm2-body-lh  { color:#374151; font-size:0.8rem; line-height:1.7; }
.u-link-dark-bold    { color:#374151; cursor:pointer; font-size:0.875rem; font-weight:700; }
.u-text-amber-xs2    { color:#92400e; font-size:0.75rem; font-weight:600; }
.u-field-desc        { color:#64748b; font-size:0.875rem; margin-bottom:0.25rem; }
.u-field-desc-mb6    { color:#64748b; font-size:0.875rem; margin-bottom:1.5rem; }
.u-field-label-xs    { color:#64748b; font-size:0.82rem; margin-bottom:0.2rem; }
.u-cell-label-3      { color:#64748b; font-size:0.82rem; margin-bottom:0.75rem; }
.u-text-sm2-muted-mb { color:#94a3b8; font-size:0.8rem; margin-bottom:0.6rem; }
.u-btn-inline-md { display:inline-flex; align-items:center; font-size:0.875rem; gap:0.4rem; padding:0.6rem 1.5rem; }

/* Misc */
.u-img-cover     { height:100%; object-fit:cover; width:100%; }
.u-dot-danger    { background:#ef4444; border-radius:50%; display:inline-block; height:9px; margin-left:6px; vertical-align:middle; width:9px; }
.u-icon-md       { height:36px; }
.u-btn-nowrap    { padding:0.6rem 1.2rem; white-space:nowrap; }
.u-btn-base      { font-size:0.875rem; padding:0.55rem 1.1rem; }
.u-btn-xs-md     { font-size:0.8rem; padding:0.55rem 1.25rem; }
.u-btn-xs5-lg    { font-size:0.8rem; padding:0.45rem 1rem; }
.u-btn-base-lg   { font-size:0.875rem; padding:0.6rem 1.4rem; }
.u-card-sm       { border-radius:10px; border:1.5px solid #e2e8f0; padding:1rem; }
.u-ml-auto       { margin-left: auto; }
.u-center-p4     { padding:1rem; text-align:center; }

/* ── Round-6 additions ────────────────────────────────────────── */

/* Tickets widget */
.u-row-fs-g2      { display:flex; align-items:flex-start; gap:0.5rem; }
.u-row-fs-sb-mb4  { display:flex; align-items:flex-start; gap:0.5rem; justify-content:space-between; margin-bottom:1rem; }
.u-row-shrink0-g2 { display:flex; align-items:center; flex-shrink:0; gap:0.5rem; }
.u-row-wrap-sm-mb4 { display:flex; align-items:center; flex-wrap:wrap; font-size:0.8rem; gap:0.6rem; margin-bottom:1rem; }
.u-row-baseline-sb { display:flex; align-items:baseline; gap:0.5rem; justify-content:space-between; margin-bottom:0.35rem; }
.u-row-baseline-sb2 { display:flex; align-items:baseline; gap:0.5rem; justify-content:space-between; margin-bottom:0.25rem; }
.u-list-row       { display:flex; align-items:flex-start; gap:0.65rem; padding:0.45rem 0; border-bottom:1px solid #f1f5f9; }
.u-list-row-sm    { display:flex; align-items:flex-start; gap:0.5rem; padding:0.5rem 0; border-bottom:1px solid #f1f5f9; }
.u-list-action    { display:flex; align-items:center; color:#64748b; cursor:pointer; font-size:0.8rem; font-weight:600; gap:0.4rem; list-style:none; padding:0.3rem 0; }
.u-list-baseline-row { display:flex; align-items:baseline; justify-content:space-between; font-size:0.8rem; padding:0.3rem 0; border-bottom:1px solid #f1f5f9; }
.u-row-divider    { border-bottom:1px solid #f1f5f9; padding:0.4rem 0; }
.u-row-fs-sb      { display:flex; align-items:flex-start; gap:0.5rem; justify-content:space-between; }
.u-icon-btn       { background:none; border:none; color:#94a3b8; cursor:pointer; line-height:1; padding:2px; flex-shrink:0; }
.u-checkbox-amber { accent-color:#f59e0b; cursor:pointer; flex-shrink:0; margin-top:3px; }
.u-checkbox-icon  { cursor:pointer; flex-shrink:0; height:16px; width:16px; margin-top:0.2rem; }
.u-tag-purple     { background:#faf5ff; border-color:#d8b4fe; color:#7c3aed; font-size:0.8rem; }
.u-tag-violet     { background:#f5f3ff; border-radius:4px; border:1px solid #ddd6fe; color:#6d28d9; cursor:pointer; font-size:0.7rem; margin-left:0.4rem; padding:0.1rem 0.4rem; }
.u-title-ellipsis { font-size:1rem; margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.u-btn-xs-outline { background:#f8fafc; border-radius:6px; border:1.5px solid #e2e8f0; color:#374151; cursor:pointer; font-size:0.75rem; padding:0.3rem 0.5rem; }
.u-mono-muted-sm  { color:#94a3b8; font-family:monospace; font-size:0.75em; }
.u-body-prewrap   { color:#374151; font-size:0.875rem; line-height:1.6; white-space:pre-wrap; }
.u-text-sm-body-bold { color:#374151; font-size:0.78rem; font-weight:600; }
.u-badge-danger-ml  { background:#fee2e2; color:#991b1b; margin-left:0.35rem; }
.u-badge-danger-ml2 { background:#fee2e2; color:#991b1b; margin-left:0.4rem; }
.u-badge-warn-ml  { background:#fef3c7; color:#92400e; margin-left:0.4rem; }
.u-input-amber    { background:#fff; border-radius:6px; border:1.5px solid #f59e0b; color:#1e293b; flex:1; font-size:0.9rem; font-weight:600; min-width:0; padding:0.25rem 0.5rem; }
.u-icon-slate-sm  { color:#cbd5e1; font-size:0.7rem; margin-left:2px; }
.u-grid-divider   { border-top:1px solid #f1f5f9; grid-column:1/-1; margin-top:0.25rem; padding-top:0.75rem; }
.u-grid-warn-box  { background:#fffbeb; border-radius:8px; border:1.5px solid #fcd34d; grid-column:1/-1; margin-top:0.5rem; padding:0.85rem 1rem; }
.u-section-label-yellow { color:#d97706; font-size:0.7rem; font-weight:700; letter-spacing:0.07em; margin-bottom:0.6rem; text-transform:uppercase; }
.u-text-xxs-muted { color:#94a3b8; font-size:0.72rem; }
.u-text-xxs-muted2 { color:#94a3b8; font-size:0.68rem; white-space:nowrap; }
.u-badge-sm-green2  { background:#dcfce7; border-radius:12px; color:#166534; font-size:0.78rem; padding:2px 8px; }
.u-badge-sm-yellow2 { background:#fef9c3; border-radius:12px; color:#92400e; font-size:0.78rem; padding:2px 8px; }
.u-text-green2-xs { color:#166534; font-size:0.72rem; font-weight:600; }
.u-text-body-xs   { color:#374151; font-size:0.72rem; font-weight:600; }

/* Customers widget */
.u-err-title      { color:#dc2626; font-size:0.875rem; font-weight:700; margin-bottom:0.75rem; }
.u-err-title-xl   { color:#dc2626; font-size:1.1rem; font-weight:700; margin-bottom:0.5rem; }
.u-item-title-break { color:#1e293b; font-size:0.875rem; font-weight:700; margin-bottom:1rem; word-break:break-all; }
.u-filter-bar-mb2 { display:flex; align-items:center; flex-wrap:wrap; gap:0.75rem; margin-bottom:0.5rem; }
.portal-input-sel2  { background:#f8fafc; border-radius:8px; border:1.5px solid #e2e8f0; color:#1e293b; cursor:pointer; font-size:0.8rem; padding:0.45rem 1rem; }
.portal-textarea-compact3 { width:100%; padding:0.5rem 0.75rem; border:1.5px solid #e2e8f0; border-radius:8px; font-size:0.875rem; color:#1e293b; background:#f8fafc; font-family:inherit; }
.portal-input-muted { background:#f8fafc; border-radius:8px; border:1.5px solid #e2e8f0; color:#94a3b8; cursor:pointer; font-size:0.78rem; padding:0.35rem 0.9rem; }
.portal-textarea-xs { width:100%; padding:0.5rem 0.75rem; border:1.5px solid #e2e8f0; border-radius:8px; font-size:0.875rem; color:#1e293b; background:#f8fafc; resize:vertical; font-family:inherit; box-sizing:border-box; margin-bottom:0.4rem; }

/* Index.html modals */
.modal-overlay-top { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:800; align-items:center; justify-content:center; }
.modal-overlay-mid { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:700; align-items:center; justify-content:center; }
.u-modal-card-440-90 { background:#fff; border-radius:16px; box-shadow:0 8px 32px rgba(0,0,0,0.18); max-width:440px; padding:2rem; width:90%; }
.u-modal-card-420 { background:#fff; border-radius:16px; box-shadow:0 8px 32px rgba(0,0,0,0.18); max-width:420px; padding:2rem; width:90%; }
.u-modal-title-hvy { color:#1e293b; font-size:1.1rem; font-weight:800; margin:0 0 0.75rem; }
.u-modal-hero-title { color:#1e293b; font-size:1.2rem; font-weight:800; margin:0; }
.u-field-desc-mt  { color:#64748b; font-size:0.875rem; margin-top:0.35rem; }
.u-list-body      { color:#374151; font-size:0.875rem; line-height:2; margin-bottom:1.25rem; padding-left:1.25rem; }
.u-icon-md2       { height:40px; margin-bottom:0.5rem; }
.u-alert-warn-bd  { background:#fef9c3; border-color:#ca8a04; }

/* application.html */
.u-text-link-muted { text-decoration:none; }
.u-tbl-empty-p3   { color:#94a3b8; padding:3rem; text-align:center; }
.u-icon-amber-xl  { color:#f59e0b; font-size:1.2rem; font-weight:700; }
.u-body-text-lh6  { color:#374151; font-size:0.875rem; line-height:1.6; }
.u-body-text-lh8  { color:#374151; font-size:0.875rem; line-height:1.8; }
.u-alert-warn-lg  { display:flex; align-items:flex-start; background:#fffbeb; border-radius:12px; border:1.5px solid #fde68a; flex-wrap:wrap; gap:1rem; margin-bottom:1.5rem; padding:0.75rem 1.25rem; }
.u-text-muted-base-link { color:#94a3b8; font-size:0.875rem; font-weight:500; text-decoration:none; }

/* nueva-solicitud.html */
.u-btn-inline-sm  { display:inline-flex; align-items:center; font-size:0.8rem; gap:0.4rem; padding:0.45rem 1rem; text-decoration:none; }
.u-stepper-bar    { display:flex; align-items:center; gap:0; margin-bottom:2rem; overflow-x:auto; }
.u-btn-amber-xs6  { background:none; border-radius:6px; border:1.5px solid #f59e0b; color:#92400e; cursor:pointer; font-size:0.78rem; font-weight:600; margin-left:auto; padding:0.3rem 0.75rem; }
.u-alert-warn-ca  { background:#fefce8; border-radius:8px; border:1.5px solid #ca8a04; color:#92400e; font-size:0.82rem; margin-bottom:1rem; padding:0.75rem 1rem; }
.u-note-card      { background:#f8fafc; border-radius:8px; border:1.5px solid #e2e8f0; margin:1.5rem 0; padding:1rem; }
.u-upload-zone    { border:2px solid #16a34a; padding:2.5rem; text-align:center; }
.u-page-title     { color:#1e293b; font-size:1.25rem; font-weight:700; margin-bottom:0.5rem; }
.u-row-center     { display:flex; flex-wrap:wrap; gap:0.75rem; justify-content:center; }
.u-subsect-xl     { color:#1e293b; font-size:0.95rem; font-weight:700; }
.u-jc-start       { justify-content:flex-start; }

/* dashboard/js/tickets.js */
.u-text-base-prewrap { color:#1e293b; font-size:0.875rem; margin:0; white-space:pre-wrap; }
.u-btn-amber-fill { background:#f59e0b; border-radius:8px; border:none; color:#fff; cursor:pointer; font-size:0.78rem; font-weight:600; padding:0.35rem 0.9rem; }
.u-btn-xs-muted   { background:#f8fafc; border-radius:8px; border:1.5px solid #e2e8f0; color:#64748b; cursor:pointer; font-size:0.78rem; padding:0.35rem 0.9rem; }

/* ── Round-7 additions ────────────────────────────────────────── */

/* apply.html */
.u-underline      { text-decoration: underline; }
.u-list-indent    { color:#374151; font-size:0.875rem; line-height:2; margin:0 0 1rem; padding-left:1.25rem; }
.u-alert-success4 { background:#f0fdf4; border-radius:8px; border:1px solid #86efac; margin-bottom:1.25rem; padding:1.25rem; }
.u-w-5rem         { width: 5rem; }

/* admin.js */
.u-stat-card-center { background:#f8fafc; border-radius:10px; padding:1rem; text-align:center; }
.u-stat-big        { color:#1e293b; font-size:1.3rem; font-weight:800; }
.u-text-xs2-mid    { color:#64748b; font-size:0.75rem; }
.u-progress-track  { background:#e2e8f0; border-radius:4px; height:4px; margin-top:0.4rem; overflow:hidden; }
.u-mono-ellipsis-220 { font-family:monospace; font-size:0.78rem; max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.u-ellipsis-180    { font-size:0.78rem; max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.u-ellipsis-280    { font-size:0.78rem; max-width:280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.u-p-footer        { padding:0.5rem 1rem 0.75rem; }
.u-code-block      { background:#f8fafc; border-radius:6px; color:#64748b; font-size:0.72rem; margin:0; padding:0.75rem; white-space:pre-wrap; word-break:break-all; }

/* documents.html */
.u-alert-warn-sm   { display:flex; align-items:center; background:#fffbeb; border-radius:8px; border:1.5px solid #fde68a; flex-wrap:wrap; gap:0.75rem; margin-top:0.75rem; padding:0.6rem 0.75rem; }
.u-w-2rem          { width:2rem; }
.u-doc-link-btn    { display:inline-flex; align-items:center; background:#f8fafc; border-radius:8px; border:1px solid #e2e8f0; color:#374151; font-size:0.875rem; font-weight:600; gap:0.5rem; padding:0.65rem 1rem; text-decoration:none; }
.portal-input-xs   { background:#f8fafc; border-radius:6px; border:1.5px solid #e2e8f0; color:#1e293b; font-size:0.875rem; padding:0.4rem 0.6rem; }

/* account.html */
.u-pos-rel         { position: relative; }
.u-avatar-btn      { display:flex; align-items:center; justify-content:center; background:#f59e0b; border-radius:50%; border:3px solid #fde68a; color:#fff; cursor:pointer; font-size:1.6rem; font-weight:700; height:72px; overflow:hidden; width:72px; }
.u-avatar-edit-btn { display:flex; align-items:center; justify-content:center; background:#1e293b; border-radius:50%; color:#fff; cursor:pointer; height:22px; position:absolute; bottom:0; right:-4px; width:22px; }
.u-row-sb-mb2      { display:flex; align-items:center; justify-content:space-between; margin-bottom:0.5rem; }

/* payments.js */
.u-note-box-p      { background:#f8fafc; border-radius:8px; padding:0.75rem 1rem; }
.u-btn-inline-xs   { display:inline-flex; align-items:center; font-size:0.75rem; gap:0.35rem; padding:0.3rem 0.65rem; }
.u-opacity-85      { opacity:0.85; }

/* tickets.html */
.u-row-sb-g2-mb4   { display:flex; align-items:center; gap:0.5rem; justify-content:space-between; margin-bottom:1rem; }
.u-row-hidden-sm   { display:none; align-items:center; font-size:0.8rem; gap:0.5rem; }
.u-badge-sm-success { background:#dcfce7; border-color:#86efac; color:#166534; font-size:0.75rem; padding:0.2rem 0.65rem; }
.u-icon-btn-lg     { background:none; border:none; color:#94a3b8; cursor:pointer; font-size:1rem; line-height:1; padding:0; }
.u-text-center-pt3 { padding:0.75rem 0 0.25rem; text-align:center; }
.u-text-center-pt0 { padding:0.75rem 0 0; text-align:center; }

/* payments.html */
.u-input-fixed-160 { background:#f8fafc; border-radius:8px; border:1.5px solid #e2e8f0; color:#1e293b; font-size:0.875rem; padding:0.5rem 0.75rem; width:160px; }

/* admin.html */
.u-flex-2-200  { flex:2; min-width:200px; }
.u-flex-1-150  { flex:1; min-width:150px; }
.u-grid-sm     { display:grid; gap:0.75rem; }
.u-btn-p-base  { padding:0.6rem 1.2rem; }

/* staff/index.html */
.u-nav-section-label { color:#94a3b8; font-size:0.7rem; font-weight:700; letter-spacing:0.08em; margin:1.25rem 0 0.6rem; text-transform:uppercase; }

/* staff-bell.js */
.u-bell-btn    { display:flex; align-items:center; justify-content:center; background:none; border-radius:8px; border:none; color:#64748b; cursor:pointer; padding:0.4rem; position:relative; transition:color 0.15s; }
.u-bell-badge  { display:none; display:flex; align-items:center; justify-content:center; background:#dc2626; border-radius:8px; color:#fff; font-size:0.6rem; font-weight:700; height:15px; min-width:15px; padding:0 3px; position:absolute; right:-1px; top:-1px; }
.u-bell-panel  { background:#fff; border-radius:12px; border:1px solid #e2e8f0; box-shadow:0 8px 32px rgba(0,0,0,0.14); overflow:hidden; position:absolute; right:0; top:calc(100% + 8px); width:280px; z-index:500; }
.u-panel-top   { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #f1f5f9; padding:0.75rem 1rem; }
.u-notif-row   { display:flex; align-items:center; gap:0.75rem; border-bottom:1px solid #f1f5f9; color:#374151; font-size:0.875rem; padding:0.85rem 1rem; text-decoration:none; }

/* reports.html */
.u-row-btm-4       { display:flex; align-items:flex-end; flex-wrap:wrap; gap:1rem; }
.u-row-wrap-g3     { display:flex; flex-wrap:wrap; gap:0.6rem; }
.u-row-wrap-4-mb4  { display:flex; flex-wrap:wrap; gap:1rem; margin-bottom:1rem; }
.u-text-sm4-body-mb4 { color:#374151; font-size:0.85rem; margin-bottom:1rem; }

/* contracts.html */
.u-alert-warn-lg2    { display:flex; align-items:flex-start; background:#fffbeb; border-radius:12px; border:1.5px solid #fde68a; gap:1rem; margin-bottom:1.5rem; padding:1.25rem 1.5rem; }
.u-text-amber-bold-title { color:#92400e; font-size:0.875rem; font-weight:700; margin-bottom:0.25rem; }
.u-input-plain       { background:#f8fafc; border:1px solid #e2e8f0; box-shadow:none; }
.u-btn-xs-lg4        { font-size:0.8rem; padding:0.5rem 1rem; }

/* tickets.html/payments */
.portal-textarea-lg  { width:100%; padding:0.65rem 0.9rem; border:1.5px solid #e2e8f0; border-radius:8px; font-size:0.95rem; color:#1e293b; background:#f8fafc; resize:vertical; font-family:inherit; box-sizing:border-box; }
.u-p-5               { padding:1.25rem; }
.u-input-full-lg     { font-size:1rem; padding:0.75rem; width:100%; }
.u-p-full            { padding:0.75rem; width:100%; }

/* dashboard-index.js */
.u-row-sb-mb-px { display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; }
.u-progress-bar { background:#e2e8f0; border-radius:999px; height:8px; overflow:hidden; }

/* step-up.js */
.u-panel-title2  { color:#1e293b; font-size:1.1rem; font-weight:700; margin-bottom:0.35rem; }
.u-field-label-upper { display:block; color:#374151; font-size:0.8rem; font-weight:700; letter-spacing:0.04em; margin-bottom:0.4rem; text-transform:uppercase; }
.u-otp-input     { width:100%; padding:0.75rem 1rem; border:1.5px solid #e2e8f0; border-radius:8px; font-family:monospace; font-size:1.25rem; letter-spacing:0.3em; text-align:center; background:#f8fafc; color:#1e293b; margin-bottom:0.75rem; box-sizing:border-box; }

/* signup.html */
.u-code-preview  { background:#f8fafc; border-radius:8px; color:#1e293b; font-family:monospace; font-size:0.85rem; line-height:2; padding:1rem; }

/* customers.js */
.u-mono-amber-bold { color:#92400e; font-family:monospace; font-size:0.875rem; font-weight:700; }

/* nueva-solicitud.js */
.u-row-sb-card    { display:flex; align-items:center; justify-content:space-between; background:#fff; border-radius:8px; border:1.5px solid #e2e8f0; margin-bottom:0.5rem; padding:0.65rem 0.75rem; }

/* Misc */
.u-text-xs3-mid    { color:#64748b; font-size:0.73rem; }
.u-text-xs3-muted  { color:#94a3b8; font-size:0.73rem; }
.u-badge-xxs-danger2 { background:#fee2e2; border-radius:4px; color:#991b1b; font-size:0.72rem; font-weight:700; padding:1px 6px; }
.u-badge-xxs-warn    { background:#fef9c3; border-radius:4px; color:#92400e; font-size:0.72rem; font-weight:700; padding:1px 6px; }
.u-btn-xs-nowrap   { font-size:0.8rem; padding:0.4rem 0.85rem; white-space:nowrap; }
.u-list-row3       { display:flex; align-items:flex-start; gap:0.75rem; padding:0.6rem 0; border-bottom:1px solid #f1f5f9; }
.u-btn-text-amber  { background:none; border:none; color:#f59e0b; cursor:pointer; font-size:0.8rem; font-weight:600; padding:0; }
.u-btn-icon-muted  { background:none; border:none; color:#cbd5e1; cursor:pointer; flex-shrink:0; font-size:0.75rem; padding:0 0.25rem; }
.u-section-label-amber2 { color:#f59e0b; font-size:0.7rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; }
.u-mono-sm-muted   { color:#94a3b8; font-family:monospace; font-size:0.78rem; }
.u-step-indent     { margin:0.4rem 0 0 1.1rem; padding:0; }
.u-row-between-4-mb6 { display:flex; align-items:center; flex-wrap:wrap; gap:1rem; justify-content:space-between; margin-bottom:1.5rem; }
.u-row-between-4   { display:flex; align-items:center; flex-wrap:wrap; gap:1rem; justify-content:space-between; }
.u-bg-brown        { background:#b45309; border-color:#b45309; flex:1; }
.u-input-amber     { background:#fff; border-radius:6px; border:1.5px solid #f59e0b; color:#1e293b; flex:1; font-size:0.9rem; font-weight:600; min-width:0; padding:0.25rem 0.5rem; }
.u-stepper-bar     { display:flex; align-items:center; gap:0; margin-bottom:2rem; overflow-x:auto; }
.u-note-card       { background:#f8fafc; border-radius:8px; border:1.5px solid #e2e8f0; margin:1.5rem 0; padding:1rem; }
.u-row-sb-mb2      { display:flex; align-items:center; justify-content:space-between; margin-bottom:0.5rem; }

/* Background colour utilities */
.u-bg-success2 { background: #16a34a; }
.u-bg-warn     { background: #f59e0b; }
.u-bg-blue     { background: #3b82f6; }
.u-bg-purple   { background: #8b5cf6; }

/* Table row state colours (payments schedule) */
.u-row-overdue { background: #fef2f2; }
.u-row-next    { background: #fefce8; }

/* Straggler entries */
.u-text-4xl2       { font-size: 2.5rem; }
.u-text-sm3-body-lh8 { color:#374151; font-size:0.82rem; line-height:1.8; }
.u-btn-xs7         { font-size:0.8rem; padding:0.35rem 0.75rem; }

/* ── Round-4 additions ────────────────────────────────────────── */

/* Font size */
.u-text-sm4  { font-size: 0.85rem; }

/* Margin */
.u-mt-15  { margin-top: 0.4rem; }
.u-mt-px2 { margin-top: 4px; }
.u-ml-3   { margin-left: 0.5rem; }
.u-mb-45  { margin-bottom: 1.1rem; }
.u-m0-mb5 { margin: 0 0 1.25rem; }
.u-m0-mb4 { margin: 0 0 1rem; }
.u-m0-mb2 { margin: 0 0 0.5rem; }

/* Monospace */
.u-mono-xs   { font-family: monospace; font-size: 0.75rem; }
.u-mono-bold { font-family: monospace; font-weight: 700; }

/* Grid new variants (u-grid-2 already defined above) */
.u-grid-2-mb6 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.5rem; }
.u-grid-2c   { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-bottom: 0.75rem; }
.u-grid-2d   { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
@media (max-width: 600px) {
  .u-grid-2-mb6, .u-grid-2c, .u-grid-2d { grid-template-columns: 1fr; }
}

/* Chip full-style variants (font-size:0.75rem, padding:2px 8px) */
.u-chip-danger { background: #fee2e2; border-radius: 4px; color: #991b1b; font-size: 0.75rem; font-weight: 700; padding: 2px 8px; }
.u-chip-warn   { background: #fef9c3; border-radius: 4px; color: #92400e; font-size: 0.75rem; font-weight: 700; padding: 2px 8px; }
.u-chip-purple { background: #f5f3ff; color: #7c3aed; border-radius: 4px; font-size: 0.75rem; font-weight: 700; padding: 2px 8px; }
.u-chip-amber2 { background: #fef9c3; color: #854d0e; }

/* Misc */
.u-text-danger-dark  { color: #991b1b; }
.u-text-red-400      { color: #ef4444; }
.u-text-purple-bold  { color: #7c3aed; font-weight: 600; }
.u-bg-success-dark   { background: #0f5c2e; }
.u-bg-danger         { background: #dc2626; border-color: #dc2626; }
.u-table-collapse    { border-collapse: collapse; width: 100%; }
.u-border-top        { border-top: 1px solid #e2e8f0; }
.u-iblock-link       { display: inline-block; text-decoration: none; }
.u-icon-sm           { height: 16px; width: 16px; }
.u-scroll-300        { max-height: 300px; overflow-y: auto; }
.u-text-center-p2v   { padding: 2rem 0; text-align: center; }
.u-strike            { text-decoration: line-through; }
.u-btn-xs-sm         { font-size: 0.75rem; padding: 0.35rem 0.75rem; }
.u-btn-xs5-sm        { font-size: 0.8rem; padding: 0.45rem 1rem; }
.u-text-sm2-nowrap   { font-size: 0.8rem; white-space: nowrap; }

/* ── SEC-AE3 final additions ──────────────────────────────────── */

/* Opacity */
.u-opacity-55 { opacity: 0.55; }

/* Cursor */
.u-cursor-pointer { cursor: pointer; }

/* Muted background (timeline dots / unassigned state) */
.u-bg-muted { background: #94a3b8; }

/* Ticket card border states */
.ticket-card-selected { border-color: #f59e0b; }
.ticket-card-overdue  { border-color: #fca5a5; }

/* Ticket message bubbles */
.ticket-msg-internal { background: #faf5ff; border: 1px solid #d8b4fe; border-radius: 8px; padding: 0.85rem 1rem; margin-bottom: 0.65rem; }
.ticket-msg-staff    { background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 8px; padding: 0.85rem 1rem; margin-bottom: 0.65rem; }
.ticket-msg-cust     { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 0.85rem 1rem; margin-bottom: 0.65rem; }

/* Income report type chips */
.chip-payment  { background: #d1fae5; border-radius: 20px; color: #065f46; font-size: 0.78rem; font-weight: 600; padding: 0.15rem 0.55rem; }
.chip-late-fee { background: #fef3c7; border-radius: 20px; color: #92400e; font-size: 0.78rem; font-weight: 600; padding: 0.15rem 0.55rem; }