/* Registry: institution settings, ID cards, report centre, bulk transcripts, promotion, student documents. */

:root {
    --utc-registry-navy: var(--utc-brand, #1f2a44);
    --utc-registry-maroon: var(--utc-brand-2, #7a1f2b);
    --utc-registry-gold: var(--utc-brand-3, #c9a227);
    --utc-registry-soft: #f8f7f3;
}
.dark { --utc-registry-soft: #1f1f23; }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }

/* ---------- toolbars ---------- */
.utc-registry-toolbar { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.utc-registry-toolbar .utc-field { min-width: 150px; }
.utc-registry-grow { flex: 1 1 220px; }
.utc-registry-seg { display: inline-flex; border: 1px solid var(--utc-line); border-radius: 10px; overflow: hidden; align-self: flex-end; }
.utc-registry-seg button { padding: 8px 16px; font-weight: 600; font-size: .875rem; background: transparent; color: var(--utc-text); border: 0; cursor: pointer; }
.utc-registry-seg button + button { border-left: 1px solid var(--utc-line); }
.utc-registry-seg button.is-on { background: var(--utc-registry-navy); color: #fff; }
.utc-registry-printbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px;
    border-left: 4px solid var(--utc-registry-gold); }
.utc-registry-printbar-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.utc-registry-inline-field { flex-direction: row; align-items: center; gap: 6px; display: flex; }
.utc-registry-link { background: none; border: 0; padding: 0 4px; color: var(--utc-accent); font-weight: 600; font-size: .82rem; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.utc-registry-disabled { opacity: .45; pointer-events: none; }
.utc-registry-check { display: inline-flex; gap: 6px; align-items: center; font-size: .875rem; color: var(--utc-text); }
.utc-registry-actions { white-space: nowrap; }
.utc-registry-actions .utc-registry-link { margin-left: 4px; }

/* ---------- people table ---------- */
.utc-registry-person { display: flex; align-items: center; gap: 10px; }
.utc-registry-avatar { width: 36px; height: 44px; border-radius: 6px; object-fit: cover; flex: none; border: 2px solid var(--utc-registry-gold); }
.utc-registry-avatar-none { display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: .8rem;
    color: #fff; background: var(--utc-registry-maroon); }
.utc-registry-warn { font-size: .72rem; color: var(--utc-warn); }
.utc-registry-chip { display: inline-block; font-size: .72rem; font-weight: 600; padding: 2px 8px; border-radius: 999px; margin: 1px 2px 1px 0;
    background: color-mix(in srgb, var(--utc-registry-navy) 12%, transparent); color: var(--utc-text);
    border: 1px solid color-mix(in srgb, var(--utc-registry-navy) 35%, transparent); }
.utc-registry-status { display: inline-block; font-size: .72rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.utc-registry-status-ok { background: var(--utc-ok-soft); color: var(--utc-ok); }
.utc-registry-status-expired { background: var(--utc-warn-soft); color: var(--utc-warn); }
.utc-registry-status-none { background: var(--utc-chip); color: var(--utc-muted); }

.utc-registry-photo-panel { display: flex; gap: 18px; flex-wrap: wrap; align-items: flex-start; border-left: 4px solid var(--utc-registry-maroon); }
.utc-registry-photo-now img, .utc-registry-photo-now span, .utc-registry-photo-new { width: 96px; height: 116px; border-radius: 10px; object-fit: cover;
    border: 3px solid var(--utc-registry-gold); display: flex; align-items: center; justify-content: center; }
.utc-registry-photo-now span { background: var(--utc-registry-maroon); color: #fff; font-size: 1.8rem; font-weight: 700; }
.utc-registry-photo-new { margin-top: 10px; }

/* ---------- on-screen ID card ---------- */
.utc-registry-cardpair { display: flex; flex-wrap: wrap; gap: 18px; }
.utc-registry-card { width: 342px; max-width: 100%; aspect-ratio: 85.6 / 53.98; border-radius: 14px; overflow: hidden; background: #fff; color: #1b1b1b;
    box-shadow: 0 6px 18px rgba(0,0,0,.18); display: flex; flex-direction: column; font-size: 11px; }
.utc-registry-card-band { display: flex; align-items: center; gap: 8px; padding: 8px 10px; background: var(--card-primary); color: #fff;
    border-bottom: 3px solid var(--card-accent); }
.utc-registry-card-logo { width: 32px; height: 32px; object-fit: contain; }
.utc-registry-card-seal { width: 32px; height: 32px; border-radius: 50%; background: var(--card-accent); color: var(--card-primary); display: inline-flex;
    align-items: center; justify-content: center; font-weight: 800; font-size: 10px; flex: none; }
.utc-registry-card-inst { flex: 1; font-family: Georgia, serif; font-weight: 700; font-size: 11px; text-transform: uppercase; line-height: 1.15; }
.utc-registry-card-kind { background: var(--card-accent); color: var(--card-primary); font-weight: 800; font-size: 9px; letter-spacing: .06em; padding: 2px 7px; border-radius: 6px; }
.utc-registry-card-body { flex: 1; display: flex; gap: 10px; padding: 8px 10px; min-height: 0; }
.utc-registry-card-photo { width: 76px; height: 94px; object-fit: cover; border: 2px solid var(--card-accent); flex: none; background: #f1efe9; }
.utc-registry-card-initials { display: flex; align-items: center; justify-content: center; font-size: 26px; font-weight: 700; color: #fff; background: var(--card-secondary); }
.utc-registry-card-info { display: flex; flex-direction: column; min-width: 0; }
.utc-registry-card-info strong { color: var(--card-primary); font-size: 13px; line-height: 1.15; margin-bottom: 2px; }
.utc-registry-card-info small { font-size: 8px; color: #777; text-transform: uppercase; letter-spacing: .05em; margin-top: 3px; }
.utc-registry-card-info span { font-weight: 600; font-size: 11px; overflow: hidden; text-overflow: ellipsis; }
.utc-registry-card-valid { color: var(--card-secondary); }
.utc-registry-card-foot { background: var(--card-secondary); color: #fff; font-size: 8.5px; letter-spacing: .08em; padding: 3px 10px; }
.utc-registry-card-backtop { height: 10px; background: var(--card-primary); flex: none; }
.utc-registry-card-qr { width: 96px; text-align: center; flex: none; }
.utc-registry-card-qr img { width: 92px; height: 92px; image-rendering: pixelated; }
.utc-registry-card-qr small { font-size: 8px; color: #555; }
.utc-registry-card-return { display: flex; flex-direction: column; font-size: 9.5px; line-height: 1.35; min-width: 0; }
.utc-registry-card-return strong { color: var(--card-primary); font-size: 10px; }
.utc-registry-card-return em { margin-top: auto; border-top: 1px solid #333; padding-top: 2px; font-style: normal; font-size: 8.5px; }
.utc-registry-card-backfoot { background: var(--card-accent); color: var(--card-primary); font: 700 8px/1 ui-monospace, monospace; padding: 4px 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- report centre ---------- */
.utc-registry-reports, .utc-registry-docs { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.utc-registry-report, .utc-registry-doc {
    --tone: var(--utc-registry-navy);
    position: relative; display: flex; gap: 12px; align-items: flex-start; text-align: left; cursor: pointer; text-decoration: none;
    padding: 16px; border-radius: 14px; background: var(--utc-card); color: var(--utc-text);
    border: 1px solid var(--utc-line); border-top: 4px solid var(--tone);
    box-shadow: 0 1px 2px rgba(0,0,0,.05); transition: transform .12s ease, box-shadow .12s ease;
}
.utc-registry-report:hover, .utc-registry-doc:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.08); }
.utc-registry-report:focus-visible, .utc-registry-doc:focus-visible { outline: 3px solid var(--tone); outline-offset: 2px; }
.utc-registry-report.is-active { background: color-mix(in srgb, var(--tone) 9%, var(--utc-card)); border-color: var(--tone); }
.utc-registry-report-icon { flex: none; width: 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center;
    background: color-mix(in srgb, var(--tone) 16%, transparent); color: var(--tone); }
.dark .utc-registry-report-icon { color: color-mix(in srgb, var(--tone) 55%, #fff); }
.utc-registry-icon { width: 24px; height: 24px; }
.utc-registry-report-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.utc-registry-report-text strong { font-size: 1rem; }
.utc-registry-report-text small { font-size: .8rem; color: var(--utc-muted); line-height: 1.35; }
.utc-registry-report-tag { position: absolute; top: 10px; right: 10px; font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
    padding: 2px 7px; border-radius: 6px; background: var(--utc-chip); color: var(--utc-muted); }
.utc-registry-report-navy { --tone: var(--utc-registry-navy); }
.utc-registry-report-maroon { --tone: var(--utc-registry-maroon); }
.utc-registry-report-gold { --tone: #b8901c; }
.utc-registry-report-green { --tone: #15803d; }
.utc-registry-report-teal { --tone: #0f766e; }
.utc-registry-report-purple { --tone: #6d28d9; }
.utc-registry-report-red { --tone: #b91c1c; }
.dark .utc-registry-report-navy { --tone: #6b8cc7; }
.utc-registry-params { margin-top: 16px; border-top: 4px solid var(--tone); }
.utc-registry-params-form { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.utc-registry-params-form .utc-field { min-width: 180px; }
.utc-registry-docs { margin-bottom: 16px; }

/* ---------- KPIs, meters, decisions ---------- */
.utc-registry-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.utc-registry-kpi { border-radius: 12px; padding: 14px 16px; color: #fff; display: flex; flex-direction: column; gap: 2px; }
.utc-registry-kpi span { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; opacity: .85; }
.utc-registry-kpi strong { font-size: 1.6rem; line-height: 1.1; }
.utc-registry-kpi small { font-size: .78rem; opacity: .85; }
.utc-registry-kpi-navy { background: linear-gradient(135deg, var(--utc-registry-navy), #2c5282); }
.utc-registry-kpi-maroon { background: linear-gradient(135deg, var(--utc-registry-maroon), #a33a4a); }
.utc-registry-kpi-green { background: linear-gradient(135deg, #116530, #22a355); }
.utc-registry-meter { height: 8px; border-radius: 999px; background: var(--utc-chip); overflow: hidden; }
.utc-registry-meter span { display: block; height: 100%; background: #22a355; border-radius: 999px; }
.utc-registry-meter span.is-low { background: var(--utc-err); }
.utc-registry-decision { display: inline-block; font-size: .75rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.utc-registry-decision-promote { background: var(--utc-ok-soft); color: var(--utc-ok); }
.utc-registry-decision-complete { background: var(--utc-info-soft); color: var(--utc-info); }
.utc-registry-decision-hold { background: var(--utc-err-soft); color: var(--utc-err); }
.utc-registry-confirm { border-left: 4px solid var(--utc-registry-gold); }

/* ---------- settings ---------- */
.utc-registry-settings { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.utc-registry-settings-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.utc-registry-settings-preview { position: sticky; top: 80px; min-width: 0; }
@media (max-width: 1100px) { .utc-registry-settings { grid-template-columns: 1fr; } .utc-registry-settings-preview { position: static; } }
.utc-registry-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.utc-registry-span-2 { grid-column: 1 / -1; }
.utc-registry-logo-row { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.utc-registry-logo-box { width: 84px; height: 84px; border-radius: 12px; border: 1px dashed var(--utc-line); display: flex; align-items: center; justify-content: center;
    background: var(--utc-registry-soft); overflow: hidden; font-weight: 800; color: var(--utc-muted); }
.utc-registry-logo-box img { width: 100%; height: 100%; object-fit: contain; }
.utc-registry-colours { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.utc-registry-colour { display: flex; gap: 6px; align-items: center; }
.utc-registry-colour input[type=color] { width: 42px; height: 36px; padding: 2px; border: 1px solid var(--utc-line); border-radius: 8px; background: var(--utc-card); cursor: pointer; flex: none; }

/* letterhead preview: always "paper" white, even in dark mode */
.utc-registry-paper { background: #fff; color: #222; border: 1px solid #ddd; border-radius: 6px; padding: 16px; box-shadow: 0 4px 14px rgba(0,0,0,.08);
    font-family: "DejaVu Sans", Arial, sans-serif; font-size: 11px; }
.utc-registry-lh { display: flex; gap: 12px; align-items: center; }
.utc-registry-lh-logo { width: 54px; height: 54px; flex: none; display: flex; align-items: center; justify-content: center; }
.utc-registry-lh-logo img { width: 54px; height: 54px; object-fit: contain; }
.utc-registry-lh-logo span { width: 54px; height: 54px; border-radius: 50%; background: var(--lh-secondary); color: #fff; font-weight: 700;
    display: flex; align-items: center; justify-content: center; font-size: 13px; }
.utc-registry-lh-name { font-family: Georgia, "DejaVu Serif", serif; font-weight: 700; font-size: 15px; color: var(--lh-primary); letter-spacing: .3px; }
.utc-registry-lh-motto { font-style: italic; color: var(--lh-secondary); font-size: 10px; }
.utc-registry-lh-contact { color: #555; font-size: 9.5px; margin-top: 2px; }
.utc-registry-lh-rule { height: 4px; background: var(--lh-secondary); border-bottom: 2px solid var(--lh-accent); margin: 8px 0 12px; }
.utc-registry-lh-title { font-weight: 700; font-size: 13px; color: var(--lh-primary); }
.utc-registry-lh-sub { color: #666; margin-bottom: 8px; }
.utc-registry-lh-table { width: 100%; border-collapse: collapse; }
.utc-registry-lh-table th { background: var(--lh-primary); color: #fff; text-align: left; padding: 4px 6px; font-size: 9px; text-transform: uppercase; }
.utc-registry-lh-table td { padding: 4px 6px; border-bottom: 1px solid #eee; }
.utc-registry-lh-sigs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 22px; text-align: center; font-size: 9.5px; }
.utc-registry-lh-sigs span { display: block; border-top: 1px solid #333; margin-bottom: 3px; }
.utc-registry-lh-sigs small { display: block; color: #777; }