/* ── Overrides panel — shared by device / user / group detail pages ── */

/* ─────────────────────────────────────────
   Panel wrapper
───────────────────────────────────────── */
.overrides-panel {
  padding: var(--cs-space-2) 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* ─────────────────────────────────────────
   Section card
───────────────────────────────────────── */
.overrides-section {
  background: var(--cs-glass-bg);
  backdrop-filter: var(--cs-glass-blur);
  -webkit-backdrop-filter: var(--cs-glass-blur);
  border: 1px solid var(--cs-glass-border);
  border-radius: var(--cs-radius-xl);
  box-shadow: var(--cs-glass-shadow);
  padding: var(--cs-space-4) var(--cs-space-5);
}

.ovr-section-gap {
  margin-top: var(--cs-space-4);
}

/* ─────────────────────────────────────────
   Section header (title + action button row)
───────────────────────────────────────── */
.overrides-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--cs-space-3);
  margin-bottom: var(--cs-space-4);
}

.overrides-section-header h4,
.overrides-section h4 {
  font-size: var(--cs-text-base);
  font-weight: var(--cs-weight-semibold);
  color: var(--cs-neutral-900);
  margin: 0 0 var(--cs-space-3);
}

.overrides-section-header h4 {
  margin: 0;
}

/* ─────────────────────────────────────────
   Override table
───────────────────────────────────────── */
.ovr-table-wrap {
  border: 1px solid var(--cs-neutral-200);
  border-radius: var(--cs-radius-md);
  overflow: hidden;
  margin-bottom: var(--cs-space-3);
}

.ovr-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--cs-text-sm);
}

.ovr-table thead th {
  padding: var(--cs-space-2) var(--cs-space-3);
  text-align: left;
  font-size: var(--cs-text-xs);
  font-weight: var(--cs-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--cs-neutral-500);
  background: var(--cs-neutral-50);
  border-bottom: 1px solid var(--cs-neutral-200);
  white-space: nowrap;
}

.ovr-table tbody td {
  padding: var(--cs-space-2) var(--cs-space-3);
  vertical-align: middle;
  color: var(--cs-neutral-800);
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}

.ovr-table tbody tr:last-child td {
  border-bottom: none;
}

.ovr-table tbody tr:hover td {
  background: rgba(59, 130, 246, 0.025);
}

/* Expired row */
.ovr-table__row--expired td {
  color: var(--cs-neutral-400);
  background: var(--cs-neutral-50);
}

/* Actions column */
.ovr-table__actions {
  text-align: right;
  white-space: nowrap;
}

.ovr-table__actions .disc-card__btn {
  margin-left: var(--cs-space-1);
}

/* ─────────────────────────────────────────
   Expiry cell labels
───────────────────────────────────────── */
.ovr-expired-label {
  font-size: var(--cs-text-xs);
  font-weight: var(--cs-weight-medium);
  color: var(--cs-neutral-400);
}

.ovr-date {
  font-size: var(--cs-text-xs);
  color: var(--cs-neutral-600);
  font-family: ui-monospace, 'Cascadia Code', monospace;
}

.ovr-permanent {
  font-size: var(--cs-text-xs);
  color: var(--cs-neutral-400);
}

/* Interim rows carry a long, explanatory label rather than a one-word badge:
   its whole job is to stop an operator reading a stop-gap as an exception
   somebody here authored. Wraps onto its own line under the name. */
.ovr-interim-badge {
  display: inline-block;
  margin-top: 4px;
  white-space: normal;
  font-size: var(--cs-text-xs);
}

/* ─────────────────────────────────────────
   Empty state
───────────────────────────────────────── */
.ovr-empty {
  font-size: var(--cs-text-sm);
  color: var(--cs-neutral-400);
  margin: 0 0 var(--cs-space-3);
}

/* ─────────────────────────────────────────
   Upload area
───────────────────────────────────────── */
.override-upload-area {
  display: flex;
  align-items: center;
  gap: var(--cs-space-3);
  padding-top: var(--cs-space-3);
  border-top: 1px solid var(--cs-neutral-100);
}

/* ─────────────────────────────────────────
   Override create modal supplements
   (base modal chrome comes from disc-modal
   in discover.css, already loaded)
───────────────────────────────────────── */
.ovr-modal {
  max-width: 540px;
}

.ovr-modal__inner {
  max-height: calc(100dvh - 80px);
  overflow-y: auto;
}

/* Two-column row (version min / max) */
.ovr-modal__row-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--cs-space-3);
}

/* Monospace input (hash field) */
.ovr-input--mono {
  font-family: ui-monospace, 'Cascadia Code', monospace;
  font-size: 0.8125rem;
  letter-spacing: 0.01em;
}

/* Textarea rendered with disc-modal__input class */
textarea.disc-modal__input,
.ovr-input--textarea {
  resize: vertical;
  min-height: 72px;
  line-height: var(--cs-leading-relaxed);
}