:root {
    --geno-primary: #1f6f54;
    --geno-primary-dark: #164f3c;
    --geno-accent: #c8a24a;
}
body { background: #f4f6f5; font-size: 0.95rem; }
.navbar-geno { background: linear-gradient(90deg, var(--geno-primary), var(--geno-primary-dark)); }
.navbar-geno .navbar-brand, .navbar-geno .nav-link { color: #fff !important; }
.navbar-geno .nav-link.active { font-weight: 600; border-bottom: 2px solid var(--geno-accent); }
.role-badge { font-size: 0.75rem; letter-spacing: 0.04em; }
.card-geno { border: none; box-shadow: 0 1px 4px rgba(0,0,0,0.08); }
th.sortable { cursor: pointer; user-select: none; white-space: nowrap; }
th.sortable:hover { background: #eef3f1; }
.masked { color: #adb5bd; font-style: italic; }
.field-group-title {
    font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em;
    color: var(--geno-primary); font-weight: 700;
    border-bottom: 1px solid #e3e8e6; padding-bottom: 4px; margin: 18px 0 10px;
}
.btn-geno { background: var(--geno-primary); color: #fff; }
.btn-geno:hover { background: var(--geno-primary-dark); color: #fff; }
.readonly-note { background: #fff8e6; border: 1px solid #f0e0b0; color: #8a6d1a; font-size: 0.85rem; }
.login-wrap {
    min-height: 100vh; display: flex; align-items: center; justify-content: center;
    background: radial-gradient(circle at top, #2b8a68, #12402f);
}
.login-card { max-width: 420px; width: 100%; }
/* SP16: prominent validation errors */
.validation-banner {
    background: #fde8e8; border: 2px solid #dc3545; color: #842029;
    font-weight: 600; border-radius: 6px; padding: 10px 14px;
    margin-bottom: 12px; font-size: 0.9rem;
}
.is-invalid, .is-invalid-geno {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}
.ts-wrapper.multi .ts-control > div { background: #e8f3ee; border-color: #b7d4c6; }
.ts-wrapper.disabled .ts-control { background: #e9ecef; opacity: 1; }
.table-hover tbody tr { cursor: pointer; }
/* Report generation overlay (SP20.3) */
.generating-overlay {
    position: fixed; inset: 0; z-index: 2000;
    display: flex; align-items: center; justify-content: center;
    background: rgba(244, 246, 245, 0.85);
    backdrop-filter: blur(2px);
}
.generating-overlay .generating-panel {
    background: #fff; border-radius: 8px; padding: 28px 36px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
    text-align: center; min-width: 260px;
}
.generating-overlay .spinner-border {
    width: 2.5rem; height: 2.5rem;
    color: var(--geno-primary);
}
.generating-overlay .generating-text {
    margin-top: 14px; font-weight: 600; color: var(--geno-primary-dark);
}