/* ============================================================
   QUALEAD — Enterprise Minimal Mode
   Loaded AFTER qualead-brand.css to refine visual weight.
   ============================================================ */

/* ----------------------------------------------------------
   TOKENS (override / extend brand tokens)
   ---------------------------------------------------------- */
:root {
  /* Surfaces */
  --qa-bg:        #F7F9FB;
  --qa-surface:   #FFFFFF;
  --qa-surface-2: #F2F4F7;
  --qa-border:    #E4E7EB;

  /* Text */
  --qa-text:       #1F2933;
  --qa-text-muted: #6B7280;

  /* Radius — enterprise: not pill, not boxy */
  --qa-radius:    12px;
  --qa-radius-sm: 10px;

  /* Shadows — extremely subtle, border-first approach */
  --qa-shadow:      0 1px 2px rgba(16,24,40,.06);
  --qa-shadow-none: none;

  /* Focus ring — brand-tinted */
  --qa-focus: rgba(15,76,92,.22);
}

[data-theme="dark"] {
  --qa-bg:        #0d1117;
  --qa-surface:   #1f2937;
  --qa-surface-2: #283548;
  --qa-border:    #374151;
  --qa-text:       #f0f6fc;
  --qa-text-muted: #9ca3af;
  --qa-shadow:     0 1px 2px rgba(0,0,0,.3);
  --qa-focus:      rgba(15,76,92,.4);
}

/* ----------------------------------------------------------
   A) BACKGROUNDS — flat, calm
   ---------------------------------------------------------- */
body {
  background-color: var(--qa-bg);
}

/* ----------------------------------------------------------
   B) CARDS — border-first, minimal shadow, consistent radius
   ---------------------------------------------------------- */
.card {
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius);
  box-shadow: var(--qa-shadow);
  background-color: var(--qa-surface);
}

.card-header {
  border-radius: var(--qa-radius) var(--qa-radius) 0 0;
}

.card-header:last-child {
  border-radius: 0 0 var(--qa-radius) var(--qa-radius);
}

/* Kill heavy Bootstrap shadows on cards */
.card.shadow,
.card.shadow-sm,
.card.shadow-lg {
  box-shadow: var(--qa-shadow) !important;
}

/* Remove bouncy card hover transforms */
.card:hover {
  transform: none !important;
}

.rfi-card:hover {
  transform: none !important;
}

/* ----------------------------------------------------------
   C) MODALS — consistent radius
   ---------------------------------------------------------- */
.modal-content {
  border-radius: var(--qa-radius);
  border: 1px solid var(--qa-border);
  box-shadow: var(--qa-shadow);
}

/* ----------------------------------------------------------
   D) TABLES — audit-ready: clean header, subtle hover
   ---------------------------------------------------------- */
.table {
  border-color: var(--qa-border);
}

.table > thead {
  background-color: var(--qa-surface-2);
}

.table > thead > tr > th {
  background-color: var(--qa-surface-2);
  border-bottom: 2px solid var(--qa-border);
  font-weight: 600;
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--qa-text-muted);
  padding: 0.625rem 0.75rem;
}

.table > tbody > tr > td {
  padding: 0.5rem 0.75rem;
  vertical-align: middle;
  border-bottom: 1px solid var(--qa-border);
  font-size: 0.8125rem;
}

/* Alternating rows on all tables by default */
.table > tbody > tr:nth-of-type(even) > * {
  background-color: var(--qa-surface-2);
}

/* Canonical marker for list tables across modules */
.qa-table {
  border-color: var(--qa-border);
}

/* Subtle audit-ready striping */
.table.table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: var(--qa-surface-2);
}

/* Subtle hover (must still be visible) */
.table.table-hover > tbody > tr:hover > * {
  background-color: rgba(15, 76, 92, 0.06);
}

[data-theme="dark"] .table > thead > tr > th {
  background-color: var(--qa-surface-2);
  color: var(--qa-text-muted);
  border-bottom-color: var(--qa-border);
}

/* ----------------------------------------------------------
   E) BUTTONS — consistent radius, no transform
   ---------------------------------------------------------- */
.btn {
  border-radius: var(--qa-radius-sm);
}

.btn-qa-primary,
.btn-qa-outline {
  border-radius: var(--qa-radius-sm);
}

/* Align Bootstrap .btn-primary with brand teal */
.btn-primary {
  --bs-btn-bg: var(--qa-brand);
  --bs-btn-border-color: var(--qa-brand);
  --bs-btn-hover-bg: var(--qa-brand-dark);
  --bs-btn-hover-border-color: var(--qa-brand-dark);
  --bs-btn-active-bg: var(--qa-brand-dark);
  --bs-btn-active-border-color: var(--qa-brand-dark);
  --bs-btn-disabled-bg: var(--qa-brand);
  --bs-btn-disabled-border-color: var(--qa-brand);
}

.btn-outline-primary {
  --bs-btn-color: var(--qa-brand);
  --bs-btn-border-color: var(--qa-brand);
  --bs-btn-hover-bg: var(--qa-brand);
  --bs-btn-hover-border-color: var(--qa-brand);
  --bs-btn-active-bg: var(--qa-brand);
  --bs-btn-active-border-color: var(--qa-brand);
}

/* Keep dark-mode outline-primary readable */
[data-theme="dark"] .btn-outline-primary {
  --bs-btn-color: #6ea8fe;
  --bs-btn-border-color: #6ea8fe;
  --bs-btn-hover-bg: #6ea8fe;
  --bs-btn-hover-border-color: #6ea8fe;
  --bs-btn-hover-color: #000;
}

/* ----------------------------------------------------------
   F) FOCUS / ACCESSIBILITY — brand focus ring
   ---------------------------------------------------------- */
.form-control:focus,
.form-select:focus {
  border-color: var(--qa-brand);
  box-shadow: 0 0 0 3px var(--qa-focus);
}

.btn:focus-visible,
.btn-qa-primary:focus-visible,
.btn-qa-outline:focus-visible {
  box-shadow: 0 0 0 3px var(--qa-focus);
}

a:focus-visible {
  outline: 2px solid var(--qa-brand);
  outline-offset: 2px;
}

/* ----------------------------------------------------------
   G) INPUTS — consistent border & radius
   ---------------------------------------------------------- */
.form-control,
.form-select {
  border-radius: var(--qa-radius-sm);
  border: 1px solid var(--qa-border);
}

/* ----------------------------------------------------------
   H) BADGES — slightly tighter, consistent
   ---------------------------------------------------------- */
.badge {
  font-weight: 500;
  font-size: 0.75rem;
  padding: 0.3em 0.6em;
  border-radius: 6px;
}

/* Role badge with inline background-color: auto-picks white text */
.role-badge {
  color: #fff;
  font-weight: 600;
  font-size: 0.7rem;
  padding: 0.25em 0.55em;
  border-radius: 4px;
  white-space: nowrap;
}

/* ----------------------------------------------------------
   I) NAVBAR — calm, no transforms
   ---------------------------------------------------------- */
.navbar {
  box-shadow: var(--qa-shadow);
}

/* Kill the nav-link bouncing */
.nav-link:hover {
  transform: none !important;
}

/* Kill dropdown item slide */
.dropdown-item:hover {
  transform: none !important;
}

.dropdown-menu {
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-sm);
  box-shadow: var(--qa-shadow);
}

/* ----------------------------------------------------------
   J) ALERTS — border-first
   ---------------------------------------------------------- */
.alert {
  border: 1px solid var(--qa-border);
  border-radius: var(--qa-radius-sm);
  box-shadow: none;
}

/* ----------------------------------------------------------
   K) LIST GROUPS — consistent radius
   ---------------------------------------------------------- */
.list-group {
  border-radius: var(--qa-radius);
}

.list-group-item:first-child {
  border-top-left-radius: var(--qa-radius);
  border-top-right-radius: var(--qa-radius);
}

.list-group-item:last-child {
  border-bottom-left-radius: var(--qa-radius);
  border-bottom-right-radius: var(--qa-radius);
}
