/* ====================================
   RANDO BREVETS - FEATURE STYLES
   ==================================== */

/* Homologations table: jury-grid look */
.rando-homologations-section {
  margin: 2rem 0;
}

.rando-homologations-count {
  margin: 0.25rem 0 1rem;
  opacity: 0.75;
}

.rando-homologations-table-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--color-white);
}

.rando-homologations-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  min-width: 720px;
  background: var(--color-white);
}

.rando-homologations-table thead th {
  text-align: left;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.02em;
  color: var(--color-text);
  padding: 14px 16px;
  border-bottom: 2px dotted var(--color-border);
  white-space: nowrap;
}

.rando-homologations-table tbody td {
  padding: 18px 16px;
  border-bottom: 2px dotted var(--color-light-gray);
  vertical-align: middle;
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
}

.rando-homologations-table tbody tr:hover td {
  background: var(--color-surface-2);
}

.rando-homologations-table tbody td:nth-child(2) strong {
  display: inline-block;
  font-weight: 700;
}

/*.rando-homologations-table tbody td:nth-child(2) a {
  color: inherit;
  text-decoration: none;
}
*/
.rando-homologations-table tbody td:nth-child(2) a:hover {
  text-decoration: underline;
}

.rando-homologations-table thead th:nth-child(3),
.rando-homologations-table thead th:nth-child(4),
.rando-homologations-table thead th:nth-child(5),
.rando-homologations-table tbody td:nth-child(3),
.rando-homologations-table tbody td:nth-child(4),
.rando-homologations-table tbody td:nth-child(5) {
  text-align: center;
}

.rando-homologations-table thead th:nth-child(6),
.rando-homologations-table tbody td:nth-child(6) {
  text-align: center;
  white-space: nowrap;
}

@media (max-width: 768px) {
  .rando-homologations-table thead th,
  .rando-homologations-table tbody td {
    padding: 14px 12px;
  }
}

.rando-status {
  display: inline-block;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 600;
  background: var(--color-surface-2);
}

.rando-homologations-table tbody tr:not(.rando-row-status-homologated) td {
  background: var(--color-surface-2);
  color: var(--color-text-muted);
  border-bottom-color: var(--color-border);
}

/*.rando-homologations-table tbody tr:not(.rando-row-status-homologated) a {
  color: inherit;
  pointer-events: none;
  text-decoration: none;
}
*/
.rando-homologations-table tbody tr:not(.rando-row-status-homologated):hover td {
  background: var(--color-surface-2);
}

/* Ensure rider name links remain clickable regardless of row status */
.rando-homologations-table tbody td:nth-child(2) a.rando-link-allow-click,
.rando-homologations-table tbody td:nth-child(2) a[data-allow-click="1"] {
  pointer-events: auto !important;
  /*cursor: pointer;*/
}

/* Color the rider link so it's visually clear it's clickable */
.rando-homologations-table tbody td:nth-child(2) a.rando-link-allow-click {
  color: var(--color-primary) !important; /* theme primary blue */
  /*text-decoration: none;*/
}
.rando-homologations-table tbody td:nth-child(2) a.rando-link-allow-click:hover {
  color: var(--color-primary-dark) !important; /* darker blue on hover */
  /*text-decoration: underline;*/
}

/* Table header uses theme soft-blue background */
.rando-homologations-table thead.rando-header-theme th {
  background-color: var(--color-surface-2); /* theme soft blue */
}

/* Alternate row coloring for better readability; theme-aware */
.rando-homologations-table tbody tr:nth-child(odd) td:not(.rando-row-status-homologated) {
  background-color: var(--color-white);
}
.rando-homologations-table tbody tr:nth-child(even) td:not(.rando-row-status-homologated) {
  background-color: var(--color-near-white); /* very subtle off-white/soft-blue tint */
}

.rando-homologations-table tbody td:nth-child(6) a {
  color: var(--color-primary);
  text-decoration: none;
}

.rando-homologations-table tbody td:nth-child(6) a:hover {
  color: var(--color-primary-dark);
  text-decoration: underline;
}

/* Brevet column link (assuming column 3) */
.rando-homologations-table tbody td:nth-child(3) a {
  pointer-events: auto !important;
  color: var(--color-primary) !important;
  text-decoration: none;
}

.rando-homologations-table tbody td:nth-child(3) a:hover {
  color: var(--color-primary-dark) !important;
  text-decoration: underline;
}

/* ====================================
   UNIFIED DATA GRID STYLES
   Shared between Brevet Detail and User Profile pages
   ==================================== */

.rando-data-grid-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--radius-md, 8px);
  border: 1px solid var(--color-border, #e5e7eb);
  background: var(--color-white, #fff);
}

.rando-data-grid {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  min-width: 700px;
  background: var(--color-white, #fff);
}

.rando-data-grid thead th {
  background: var(--color-surface-2, #f8fafc);
  padding: 14px 16px;
  text-align: left;
  font-size: 12px;
  font-weight: 600;
  color: var(--color-text-muted, #475569);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  border-bottom: 2px dotted var(--color-border, #e5e7eb);
  white-space: nowrap;
  user-select: none;
}

.rando-data-grid thead th.sortable {
  cursor: pointer;
  transition: background-color 150ms ease;
}

.rando-data-grid thead th.sortable:hover {
  background: var(--color-light-gray, #cbd5e1);
}

.rando-data-grid thead th .sort-icon,
.rando-data-grid thead th .sort-indicator {
  margin-left: 4px;
  opacity: 0.5;
  font-size: 10px;
}

.rando-data-grid thead th.sort-asc .sort-icon,
.rando-data-grid thead th.sort-desc .sort-icon {
  opacity: 1;
  color: var(--color-primary, #2563eb);
}

.rando-data-grid tbody tr {
  transition: background-color 150ms ease;
}

.rando-data-grid tbody tr:hover {
  background: var(--color-surface-2, #f8fafc);
}

.rando-data-grid tbody td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--color-border, #e5e7eb);
  vertical-align: middle;
  color: var(--color-text, #0f172a);
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}

.rando-data-grid tbody tr:last-child td {
  border-bottom: none;
}

/* Primary link column - used for Rider name (brevet detail) or Brevet name (user profile) */
.rando-data-grid .col-primary-link a,
.rando-data-grid td a.rando-grid-link {
  color: var(--color-primary, #2563eb);
  text-decoration: none;
  font-weight: 600;
  transition: color 150ms ease;
}

.rando-data-grid .col-primary-link a:hover,
.rando-data-grid td a.rando-grid-link:hover {
  color: var(--color-primary-dark, #1e40af);
  text-decoration: underline;
}

/* Event type badge - small pill */
.rando-data-grid .event-type-badge {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 600;
  background: var(--color-surface-2, #f8fafc);
  color: var(--color-text-muted, #475569);
  white-space: nowrap;
}

/* Status badge styles */
.rando-data-grid .status-badge {
  display: inline-block;
  padding: 4px 12px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.rando-data-grid .status-badge.status-completed {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(5, 150, 105, 0.15) 100%);
  color: var(--color-success, #10b981);
}

.rando-data-grid .status-badge.status-dns,
.rando-data-grid .status-badge.status-dnf {
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.1) 0%, rgba(220, 38, 38, 0.1) 100%);
  color: var(--color-error, #ef4444);
}

.rando-data-grid .status-badge.status-pending {
  background: var(--color-surface-2, #f8fafc);
  color: var(--color-text-muted, #475569);
}

/* Row status styles for DNS/DNF */
.rando-data-grid tbody tr.status-dns,
.rando-data-grid tbody tr.status-dnf {
  background: rgba(239, 68, 68, 0.03);
}

.rando-data-grid tbody tr.status-dns:hover,
.rando-data-grid tbody tr.status-dnf:hover {
  background: rgba(239, 68, 68, 0.06);
}

/* Numeric columns - centered */
.rando-data-grid .col-center,
.rando-data-grid th[data-sort="time"],
.rando-data-grid th[data-sort="category"],
.rando-data-grid th[data-sort="status"] {
  text-align: center;
}

.rando-data-grid td.col-center {
  text-align: center;
}

/* Grid footer */
.rando-data-grid-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  margin-top: 15px;
}

.rando-data-grid-footer .table-count {
  font-size: 12px;
  color: var(--color-text-muted, #475569);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .rando-data-grid thead th,
  .rando-data-grid tbody td {
    padding: 12px 10px;
  }
  
  .rando-data-grid .event-type-badge {
    display: block;
    margin-left: 0;
    margin-top: 4px;
    width: fit-content;
  }
}