/*
 * HSI Reports Dashboard styling. Depends on hsi-portal-shell.css for design
 * tokens (see wp_register_style() deps in class-hsi-portal-reports-render.php).
 */

.hsi-reports {
	max-width: var(--hsi-shell-max);
}

.hsi-reports__nav {
	display: flex;
	justify-content: center;
	width: 100%;
	gap: var(--hsi-space-2);
	margin-bottom: var(--hsi-space-6);
}

.hsi-reports__nav-chip {
	padding: 6px 14px;
	border-radius: 999px;
	background: var(--hsi-blue-tint);
	color: var(--hsi-navy);
	font-size: 0.85em;
	font-weight: 600;
	text-decoration: none;
}

.hsi-reports__nav-chip:hover {
	background: #d9ebf8;
}

.hsi-reports__section {
	margin-bottom: var(--hsi-space-8);
	scroll-margin-top: calc(var(--hsi-header-height) + var(--hsi-space-4));
}

.hsi-reports__section h3 {
	margin-bottom: var(--hsi-space-1);
}

.hsi-reports__definition {
	margin: 0 0 var(--hsi-space-3);
	font-size: 0.9em;
	font-style: italic;
	color: #555;
}

.hsi-reports__metric {
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	margin: 0 0 var(--hsi-space-3);
	padding: var(--hsi-space-2) var(--hsi-space-4);
	background: var(--hsi-neutral-tint);
	border-radius: var(--hsi-radius);
	font-size: 1.6rem;
	font-weight: 700;
	font-family: var(--hsi-font-head);
	color: var(--hsi-navy);
}

.hsi-reports__empty {
	padding: var(--hsi-space-3) var(--hsi-space-4);
	background: var(--hsi-blue-tint);
	border-radius: var(--hsi-radius);
	color: #0c2e4e;
}

.hsi-reports__table-wrap {
	overflow-x: auto;
}

.hsi-reports__table {
	width: 100%;
	border-collapse: collapse;
}

.hsi-reports__table th,
.hsi-reports__table td {
	text-align: left;
	padding: var(--hsi-space-2) var(--hsi-space-3);
	border-bottom: 1px solid var(--hsi-neutral-tint);
	font-size: 0.9em;
}

.hsi-reports__table th {
	font-weight: 600;
	border-bottom: 2px solid #c9ccd1;
}

.hsi-reports__open-link {
	padding: 4px 14px;
	font-size: 0.82em;
}

/* Pager (pagination build 2026-08-06, client request: default 10 rows/page
   with a size selector) — controls injected by hsi-portal-reports.js after
   each table's wrapper. */
.hsi-reports__pager {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--hsi-space-3);
	margin: var(--hsi-space-3) 0 var(--hsi-space-4);
}

.hsi-reports__pager-size {
	font-weight: normal;
	display: inline-flex;
	align-items: center;
	gap: var(--hsi-space-2);
}

.hsi-reports__pager-indicator {
	color: #555;
}

/* Pager layout fix (client report 2026-09-09): the theme stretches buttons
   full-width, stacking Prev/Next as giant bars — pin pager controls to
   natural inline size on one row. */
.hsi-reports__pager button {
	width: auto !important;
	flex: 0 0 auto;
	display: inline-flex;
	padding: 6px 18px;
	margin: 0;
}

/* Renewal Reminder Sends time-period dropdown (client decision 2026-09-11:
   a labeled dropdown, not a button pair) — same inline label+select
   treatment as the pager's page-size control above; width kept natural
   against the theme's full-width form controls. */
.hsi-reports__renewal-range {
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: var(--hsi-space-2);
	margin: 0 0 var(--hsi-space-3);
}

.hsi-reports__renewal-range select {
	width: auto !important;
	font-weight: normal;
}