/* public/assets/css/reports/report.css
 * Screen styles for Scoring-Band reports.
 */

.report-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1rem;
}

.report-header {
    margin-bottom: 1rem;
    border-bottom: 1px solid #ddd;
    padding-bottom: 0.5rem;
}

.report-header h1 {
    margin: 0 0 0.25rem 0;
}

.report-back-link {
    margin-bottom: 0.75rem;
    display: inline-block;
}

.report-section {
    margin-top: 1.5rem;
}

.report-section h2 {
    margin-bottom: 0.5rem;
}

.report-section h3 {
    margin: 0.75rem 0 0.25rem 0;
}

.report-table-wrapper {
    overflow-x: auto;
}

.report-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.report-table th,
.report-table td {
    border: 1px solid #ddd;
    padding: 0.4rem 0.5rem;
    text-align: left;
}

.report-table th {
    background-color: #f5f5f5;
    font-weight: 600;
}

.report-table tfoot td {
    font-weight: 600;
}

.report-meta-summary {
    margin-top: 2rem;
    padding: 0.75rem 1rem;
    border: 1px solid #ddd;
    background-color: #fafafa;
    font-size: 0.9rem;
}

.report-meta-summary h2 {
    margin-top: 0;
    font-size: 1.1rem;
}

.report-meta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.5rem 1.5rem;
    margin-top: 0.5rem;
}

.report-meta-item strong {
    display: block;
    margin-bottom: 0.15rem;
}

/* Band labels */
.band-label {
    display: inline-block;
    padding: 0.1rem 0.4rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    margin-right: 0.25rem;
}

.band-label-1 {
    background-color: #e8f3ff;
    border: 1px solid #b5d2ff;
}

.band-label-2 {
    background-color: #e9f9e8;
    border: 1px solid #b7e2b4;
}

.band-label-3 {
    background-color: #fff5e5;
    border: 1px solid #f1d19b;
}

.band-label-4 {
    background-color: #f9ecff;
    border: 1px solid #dfbff5;
}

.band-label-5 {
    background-color: #f7f7f7;
    border: 1px solid #d0d0d0;
}

/* Missing-score highlight */
td.derived-score {
    background-color: #fff7cc;
}

.missing-icon {
    display: inline-block;
    margin-left: 0.15rem;
    font-size: 0.8rem;
    color: #b37b00;
}

/* Overall totals table */
.overall-totals-section {
    margin-top: 2rem;
}

.overall-totals-section h2 {
    margin-bottom: 0.5rem;
}

.overall-totals-section .report-table th,
.overall-totals-section .report-table td {
    white-space: nowrap;
}

/* Small helper text */
.report-helper-text {
    font-size: 0.8rem;
    color: #555;
    margin-top: 0.25rem;
}

/* Compact on smaller screens */
@media (max-width: 768px) {
    .report-container {
        padding: 0.5rem;
    }
    .report-table th,
    .report-table td {
        font-size: 0.8rem;
    }
}

/* --- Scoring Band report: compact columns + sortable indicators + resizable columns --- */

.report-table th,
.report-table td {
    padding: 4px 6px;
    font-size: 0.85rem;
}

/* Header layout: two-line event header with truncated name */
.report-table th .th-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.report-table th .event-name {
    display: block;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-table th .event-date {
    font-size: 0.75rem;
    opacity: 0.8;
}

/* Sortable header indicators */
.report-table th.sortable {
    cursor: pointer;
}

.report-table th.sortable::after {
    content: "⇵";
    font-size: 0.7rem;
    opacity: 0.6;
    margin-left: 4px;
}

.report-table th.sortable.sort-asc::after {
    content: "▲";
}

.report-table th.sortable.sort-desc::after {
    content: "▼";
}

/* Column resize handle */
.report-table th {
    position: relative;
}

.col-resize-handle {
    position: absolute;
    top: 0;
    right: 0;
    width: 5px;
    height: 100%;
    cursor: col-resize;
}

/* Ensure table wrapper scrolls horizontally when many events exist */
.report-table-wrapper {
    overflow-x: auto;
}

/* Enhancement 1: highlight active sorted column */
.sorted-col {
    background-color: #f4f8ff !important;
    transition: background-color 0.15s ease-in-out;
}

/* =========================================================
   Scoring Bands Report – Enhancement #2
   Sticky Header for Overall Totals Table
   ========================================================= */

/* Force the table wrapper to be the scroll container */
.report-section.overall-totals-section {
  overflow: hidden;
}

.report-section.overall-totals-section .report-table-wrapper {
  max-height: 70vh;
  overflow: auto;
}

/* Sticky header cells */
.report-section.overall-totals-section .report-table {
  border-collapse: separate;
  border-spacing: 0;
}

.report-section.overall-totals-section .report-table thead th {
  position: sticky;
  top: 0;
  z-index: 10;
  background: #fff;
  background-clip: padding-box;
}

/* Keep active sorted column above others */
.report-section.overall-totals-section .report-table thead th.sorted-col {
  z-index: 11;
}


/* =========================================================
   Scoring Bands Report – Enhancement #3
   Freeze First & Last Name Columns
   ========================================================= */

/* Ensure stacking context behaves correctly */
.report-section.overall-totals-section .report-table {
  position: relative;
}

/* Freeze FIRST NAME column */
.report-section.overall-totals-section .report-table thead th:nth-child(1),
.report-section.overall-totals-section .report-table tbody td:nth-child(1) {
  position: sticky;
  left: 0;
  z-index: 20;
  background: #fff;
}

/* Freeze LAST NAME column */
.report-section.overall-totals-section .report-table thead th:nth-child(2),
.report-section.overall-totals-section .report-table tbody td:nth-child(2) {
  position: sticky;
  left: 160px;
  z-index: 19;
  background: #fff;
}

/* Header cells should sit above body cells */
.report-section.overall-totals-section .report-table thead th:nth-child(1),
.report-section.overall-totals-section .report-table thead th:nth-child(2) {
  z-index: 30;
}

/* Optional visual separation */
.report-section.overall-totals-section .report-table thead th:nth-child(2),
.report-section.overall-totals-section .report-table tbody td:nth-child(2) {
  box-shadow: 2px 0 0 rgba(0,0,0,0.08);
}

/* =========================================================
   Scoring Bands Report – Enhancement #3 (Fix Pack)
   Freeze First & Last Name Columns – dynamic offset (no gap)
   ========================================================= */

.report-section.overall-totals-section .report-table {
  position: relative;
  /* JS will set these based on actual column widths */
  --sticky-col-1: 0px;   /* First Name width */
  --sticky-col-2: 0px;   /* First + Last widths (optional future) */
}

/* Freeze FIRST NAME (col 1) */
.report-section.overall-totals-section .report-table thead th:nth-child(1),
.report-section.overall-totals-section .report-table tbody td:nth-child(1) {
  position: sticky;
  left: 0;
  z-index: 20;
  background: #fff;
  background-clip: padding-box;
}

/* Freeze LAST NAME (col 2) — offset equals actual width of col 1 */
.report-section.overall-totals-section .report-table thead th:nth-child(2),
.report-section.overall-totals-section .report-table tbody td:nth-child(2) {
  position: sticky;
  left: var(--sticky-col-1);
  z-index: 19;
  background: #fff;
  background-clip: padding-box;
}

/* Header cells above body cells */
.report-section.overall-totals-section .report-table thead th:nth-child(1),
.report-section.overall-totals-section .report-table thead th:nth-child(2) {
  z-index: 30;
}

/* Subtle divider after Last Name (no extra “gap”) */
.report-section.overall-totals-section .report-table thead th:nth-child(2),
.report-section.overall-totals-section .report-table tbody td:nth-child(2) {
  box-shadow: 2px 0 0 rgba(0,0,0,0.08);
}

/* =========================================================
   Enhancement #4 – Sticky Last Name Column Fix (CSS-only)
   Purpose:
   - Reassert sticky positioning for the 2nd column (Last Name)
   - Does NOT touch JS or layout logic
   ========================================================= */

/* First Name already sticky at left: 0 */
/* Force Last Name to stick immediately after First Name */
.report-section.overall-totals-section .report-table thead th:nth-child(2),
.report-section.overall-totals-section .report-table tbody td:nth-child(2) {
  position: sticky !important;
  left: var(--sticky-col-1, 0px) !important;
  z-index: 25 !important;
  background: #fff !important;
  background-clip: padding-box;
}

/* =========================================================
   Enhancement #4 – Last Name HEADER Sticky Fix (CSS-only)
   Purpose:
   - Ensure the Last Name HEADER cell remains sticky vertically
   - While preserving horizontal stickiness
   ========================================================= */

/* Explicitly reassert sticky header behavior for Last Name */
.report-section.overall-totals-section .report-table thead th:nth-child(2) {
  position: sticky !important;
  top: 0 !important;
  left: var(--sticky-col-1, 0px) !important;
  z-index: 35 !important; /* Above body cells + frozen cols */
  background: #fff !important;
  background-clip: padding-box;
}

/* =========================================================
   Enhancement #4 – Restore Sorting Clicks (CSS-only)
   Fix:
   - Ensure header cells receive pointer events
   - Prevent sticky body cells from blocking clicks
   ========================================================= */

/* Header cells must always receive clicks */
.report-section.overall-totals-section .report-table thead th {
  pointer-events: auto !important;
}

/* Sticky BODY cells should not intercept header clicks */
.report-section.overall-totals-section .report-table tbody td:nth-child(1),
.report-section.overall-totals-section .report-table tbody td:nth-child(2) {
  pointer-events: none;
}

/* Re-enable pointer events when cursor is below header row */
.report-section.overall-totals-section .report-table tbody {
  pointer-events: auto;
}

/* =========================================================
   Enhancement #4 – FINAL FIX
   - Correct sticky column stacking
   - Prevent horizontal overlap
   - Restore sortable header clickability
   ========================================================= */

/* Base table stacking context */
.report-section.overall-totals-section .report-table {
  position: relative;
}

/* HEADER CELLS */
.report-section.overall-totals-section .report-table thead th {
  position: sticky;
  top: 0;
  z-index: 40;              /* Always above body cells */
  background: #fff;
  pointer-events: auto;    /* Ensure header receives clicks */
}

/* FIRST NAME COLUMN */
.report-section.overall-totals-section .report-table thead th:nth-child(1),
.report-section.overall-totals-section .report-table tbody td:nth-child(1) {
  position: sticky;
  left: 0;
  z-index: 30;
  background: #fff;
}

/* LAST NAME COLUMN – offset is dynamic (set by JS) */
.report-section.overall-totals-section .report-table thead th:nth-child(2),
.report-section.overall-totals-section .report-table tbody td:nth-child(2) {
  position: sticky;
  left: var(--sticky-col-2-left, 0px);
  z-index: 29;
  background: #fff;
}

/* BODY CELLS SHOULD NOT BLOCK HEADER CLICKS */
.report-section.overall-totals-section .report-table tbody td {
  pointer-events: auto;
}

/* Subtle divider after frozen columns */
.report-section.overall-totals-section .report-table thead th:nth-child(2),
.report-section.overall-totals-section .report-table tbody td:nth-child(2) {
  box-shadow: 2px 0 0 rgba(0,0,0,0.08);
}

/* =========================================================
   RECOVERY OVERRIDE – Sticky Header + Freeze First/Last (No Overlap)
   Purpose:
   - Fix Last Name overlapping First Name on horizontal scroll
   - Ensure First Name HEADER remains sticky vertically
   - Restore clickability for sorting headers
   This block is designed to OVERRIDE prior appended rules safely.
   ========================================================= */

/* Ensure header is always on top and clickable */
.report-section.overall-totals-section .report-table thead th{
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
  background: #fff !important;
  pointer-events: auto !important;
  background-clip: padding-box;
}

/* Reset any earlier pointer-events hacks that block clicks */
.report-section.overall-totals-section .report-table tbody td{
  pointer-events: auto !important;
}

/* Frozen column 1 (First Name) – body */
.report-section.overall-totals-section .report-table tbody td:nth-child(1){
  position: sticky !important;
  left: 0 !important;
  z-index: 30 !important;
  background: #fff !important;
  background-clip: padding-box;
}

/* Frozen column 2 (Last Name) – body (offset uses JS-set var) */
.report-section.overall-totals-section .report-table tbody td:nth-child(2){
  position: sticky !important;
  left: var(--sticky-col-1, 0px) !important;
  z-index: 29 !important;
  background: #fff !important;
  background-clip: padding-box;
  box-shadow: 2px 0 0 rgba(0,0,0,0.08);
}

/* Frozen column 1 (First Name) – header */
.report-section.overall-totals-section .report-table thead th:nth-child(1){
  left: 0 !important;
  z-index: 60 !important; /* above body frozen cells */
}

/* Frozen column 2 (Last Name) – header */
.report-section.overall-totals-section .report-table thead th:nth-child(2){
  left: var(--sticky-col-1, 0px) !important;
  z-index: 59 !important;
  box-shadow: 2px 0 0 rgba(0,0,0,0.08);
}

.report-section.overall-totals-section .report-table thead th {
  position: sticky;
  top: 0;
  z-index: 10;
  background: #fff;
}

.report-section.overall-totals-section .report-table tbody td:nth-child(1),
.report-section.overall-totals-section .report-table thead th:nth-child(1) {
  position: sticky;
  left: 0;
  z-index: 20;
  background: #fff;
}

.report-section.overall-totals-section .report-table tbody td:nth-child(2),
.report-section.overall-totals-section .report-table thead th:nth-child(2) {
  position: sticky;
  left: var(--sticky-col-1, 0px);
  z-index: 19;
  background: #fff;
}

.report-section.overall-totals-section .report-table thead th {
  position: sticky;
  top: 0;
  z-index: 10;
  background: #fff;
}

.report-section.overall-totals-section .report-table tbody td:nth-child(1),
.report-section.overall-totals-section .report-table thead th:nth-child(1) {
  position: sticky;
  left: 0;
  z-index: 20;
  background: #fff;
}

.report-section.overall-totals-section .report-table tbody td:nth-child(2),
.report-section.overall-totals-section .report-table thead th:nth-child(2) {
  position: sticky;
  left: var(--sticky-col-1, 0px);
  z-index: 19;
  background: #fff;
}