* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: Arial, sans-serif; font-size: 13px; color: #333; background: #f4f4f4; }
a { color: #0066cc; text-decoration: none; }
a:hover { text-decoration: underline; }

.hrsa-banner { background: #003366; color: #fff; padding: 8px 16px; display: flex; justify-content: space-between; align-items: center; }
.hrsa-logo-text { font-size: 22px; font-weight: bold; color: #fff; margin-right: 10px; }
.hrsa-subtitle { font-size: 12px; color: #cce0ff; }
.hrsa-user-area { font-size: 12px; }
.hrsa-user-area a { color: #cce0ff; }

.ehbs-title-bar { background: #005a9c; color: #fff; padding: 6px 16px; font-size: 14px; font-weight: bold; }

.top-nav { background: #1a6496; border-bottom: 3px solid #f90; }
.top-nav ul { list-style: none; display: flex; padding: 0 10px; }
.top-nav ul li { display: inline-block; }
.top-nav ul li a { display: block; padding: 10px 18px; color: #fff; font-size: 13px; font-weight: bold; text-decoration: none; }
.top-nav ul li:hover, .top-nav ul li.active { background: #f90; }
.top-nav ul li.active a, .top-nav ul li:hover a { color: #003366; }

.main-wrapper { display: flex; min-height: calc(100vh - 160px); }

.left-sidebar { width: 200px; min-width: 200px; background: #e8eef4; border-right: 1px solid #c0cfe0; }
.sidebar-section { margin-bottom: 4px; }
.sidebar-header { background: #1a6496; color: #fff; padding: 7px 12px; font-weight: bold; font-size: 12px; text-transform: uppercase; }
.left-sidebar ul { list-style: none; padding: 0; }
.left-sidebar ul li a { display: block; padding: 7px 16px; color: #003366; font-size: 12px; border-bottom: 1px solid #d0dce8; text-decoration: none; }
.left-sidebar ul li:hover a, .left-sidebar ul li.active a { background: #c0d8f0; font-weight: bold; }

.content-area { flex: 1; padding: 16px 20px; background: #fff; }

.page-header { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 2px solid #1a6496; }
.page-header h2 { font-size: 16px; color: #003366; margin: 0; }
.record-count { font-size: 12px; color: #666; }

.ehbs-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.ehbs-table thead tr { background: #1a6496; color: #fff; }
.ehbs-table th { padding: 8px 10px; text-align: left; font-weight: bold; white-space: nowrap; }
.ehbs-table td { padding: 7px 10px; border-bottom: 1px solid #dde; }
.ehbs-table tbody tr:nth-child(even) { background: #f5f8fc; }
.ehbs-table tbody tr:hover { background: #dceeff; }

.badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 11px; font-weight: bold; color: #fff; }
.badge-high { background: #cc2200; }
.badge-medium { background: #e68000; }
.badge-low { background: #4a9a4a; }
.badge-type { background: #1a6496; }

.status-active { color: #2a7a2a; font-weight: bold; }
.status-closed { color: #888; font-weight: bold; }
.status-pending { color: #e68000; font-weight: bold; }
.status-under-review { color: #1a6496; font-weight: bold; }
.status-approved { color: #2a7a2a; font-weight: bold; }
.status-draft { color: #888; font-weight: bold; }

.grant-link { color: #0066cc; font-weight: bold; }

.dashboard-tiles { display: flex; gap: 14px; margin-bottom: 18px; flex-wrap: wrap; }
.tile { flex: 1; min-width: 140px; padding: 16px; border-radius: 4px; text-align: center; color: #fff; }
.tile-blue { background: #1a6496; }
.tile-green { background: #2a7a2a; }
.tile-orange { background: #e68000; }
.tile-red { background: #cc2200; }
.tile-number { font-size: 36px; font-weight: bold; line-height: 1; }
.tile-label { font-size: 12px; margin: 4px 0 8px; }
.tile-link { color: #fff; font-size: 11px; text-decoration: underline; }

.dashboard-columns { display: flex; gap: 16px; }
.dashboard-col { flex: 1; display: flex; flex-direction: column; gap: 14px; }

.dashboard-panel { background: #fff; border: 1px solid #c0cfe0; }
.dashboard-panel-header { background: #1a6496; color: #fff; padding: 7px 12px; font-size: 13px; font-weight: bold; display: flex; justify-content: space-between; align-items: center; }
.panel-link { color: #cce0ff; font-size: 11px; text-decoration: underline; }

.notif-list { list-style: none; padding: 0; }
.notif-item { padding: 8px 12px; border-bottom: 1px solid #eee; font-size: 12px; }
.notif-item.unread { background: #f0f7ff; }
.notif-title { font-weight: bold; color: #003366; }
.notif-msg { color: #444; margin: 2px 0; }
.notif-date { color: #888; font-size: 11px; }
.new-badge { background: #cc2200; color: #fff; font-size: 10px; padding: 1px 5px; border-radius: 8px; margin-left: 6px; font-weight: bold; }

.footer { background: #003366; color: #cce0ff; padding: 8px 16px; font-size: 11px; overflow: hidden; }

.detail-panel { border: 1px solid #c0cfe0; background: #fff; margin-bottom: 14px; }
.detail-panel-header { background: #1a6496; color: #fff; padding: 7px 12px; font-size: 13px; font-weight: bold; }
.detail-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.detail-table th { padding: 6px 10px; background: #f0f5fa; color: #333; font-weight: bold; width: 40%; border-bottom: 1px solid #dde; text-align: left; }
.detail-table td { padding: 6px 10px; border-bottom: 1px solid #dde; }

.filter-bar { background: #f0f5fa; border: 1px solid #c0cfe0; padding: 8px 12px; margin-bottom: 12px; font-size: 12px; }

.announcement-bar { background: #fff8e1; border-left: 4px solid #f90; padding: 8px 14px; font-size: 12px; margin-bottom: 14px; }

.slingshot-bar { background: #1b2a4a; color: #c8d8f0; padding: 5px 16px; font-size: 11px; border-bottom: 1px solid #f90; }
.slingshot-bar strong { color: #f90; }

.notif-card { border: 1px solid #dde; margin-bottom: 10px; padding: 12px 14px; background: #fff; }
.notif-card.unread { border-left: 4px solid #1a6496; background: #f0f7ff; }

.report-summary-row { display: flex; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.report-summary-tile { background: #1a6496; color: #fff; padding: 12px 18px; border-radius: 4px; text-align: center; min-width: 120px; }

.quick-links { list-style: none; padding: 8px 12px; }
.quick-links li { padding: 6px 0; border-bottom: 1px solid #eee; font-size: 13px; }

.sam-active { color: #2a7a2a; font-weight: bold; }
.sam-pending { color: #e68000; font-weight: bold; }
.sam-expired { color: #cc2200; font-weight: bold; }

.workflow-released { color: #2a7a2a; font-weight: bold; }
.workflow-gms-review { color: #e68000; font-weight: bold; }
.workflow-gmo-review { color: #6a0dad; font-weight: bold; }
.workflow-qc-review { color: #8b4513; font-weight: bold; }
