/* Theme tokens: single source of truth for light/dark values
   - Keep names compatible with Bootstrap's --bs-* tokens where useful
   - Centralize gradients/colors/borders for all pages
*/

:root {
  /* Core body */
  --bs-body-bg: #ffffff;
  --bs-body-color: #0f1720;
  --bs-bg-subtle: #f8f9fa;
  --bs-link-color: #0b5ed7;
  --bs-link-hover: #0a58ca;

  /* Surfaces */
  --card-bg: #ffffff;
  --card-border: rgba(0,0,0,0.06);
  --card-contrast: rgba(0,0,0,0.06);
  --modal-bg: #ffffff;
  --modal-border: rgba(0,0,0,0.1);

  /* Text */
  --muted: #6c757d;
  --text-light: #ffffff;
  --text-dark: #0f1720;

  /* Borders */
  --border-color: #e9ecef;
  --border-color-subtle: rgba(0,0,0,0.08);
  --border-width: 1px;
  --border-radius: 6px;
  --border-radius-sm: 4px;
  --border-radius-lg: 8px;

  /* Brand / accents */
  --bs-primary: #667eea;
  --bs-primary-hover: #5a67d8;
  --bs-secondary: #764ba2;
  --bs-secondary-hover: #6a4191;

  /* Semantic */
  --bs-success: #2ecc71;
  --bs-success-hover: #27ae60;
  --bs-danger: #e74c3c;
  --bs-danger-hover: #c0392b;
  --bs-warning: #f39c12;
  --bs-warning-hover: #e67e22;
  --bs-info: #3498db;
  --bs-info-hover: #2980b9;

  /* Gradients */
  --gradient-primary: linear-gradient(135deg,#667eea,#764ba2);
  --gradient-success: linear-gradient(135deg,#2ecc71,#27ae60);
  --gradient-danger: linear-gradient(135deg,#e74c3c,#c0392b);
  --gradient-info: linear-gradient(135deg,#3498db,#2980b9);
  --gradient-warning: linear-gradient(135deg,#f39c12,#e67e22);
  --gradient-light: linear-gradient(135deg,#F8F9FA,#e3f2fd);
  --gradient-accent: var(--gradient-primary);
  --navbar-gradient: linear-gradient(135deg,#ffffff,#f8fafc);

  /* Focus / shadows */
  --focus-ring: rgba(102, 126, 234, 0.25);
  --focus-border: rgba(102, 126, 234, 0.55);
  --shadow-sm: 0 2px 4px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.1);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
  --shadow-focus: 0 0 0 0.2rem var(--focus-ring);

  /* Transitions */
  --transition-base: all 0.15s ease-in-out;
  --transition-fast: all 0.1s ease;
  --transition-slow: all 0.3s ease;

  /* Table */
  --table-head-bg: linear-gradient(135deg,#f1f5f9,#e2e8f0);
  --table-head-color: #0f1720;

  /* Toast */
  --toast-bg: rgba(0,0,0,0.85);
  --toast-color: #ffffff;
}

/* Dark theme (explicit) */
[data-theme="dark"] {
  --bs-body-bg: #0b1220;
  --bs-body-color: #e6eef8;
  --bs-bg-subtle: #0f1726;
  --bs-link-color: #93c5fd;
  --bs-link-hover: #7cc0ff;

  --card-bg: #0f1726;
  --card-border: rgba(255,255,255,0.04);
  --card-contrast: rgba(255,255,255,0.04);
  --modal-bg: #111827;
  --modal-border: rgba(255,255,255,0.08);

  --muted: #9aa6b2;
  --text-light: #e6eef8;
  --text-dark: #0f1720;

  --border-color: rgba(255,255,255,0.1);
  --border-color-subtle: rgba(255,255,255,0.04);

  --bs-primary: #7c8efb;
  --bs-primary-hover: #8e9cfc;
  --bs-secondary: #8f6cb8;
  --bs-secondary-hover: #a07dc7;

  --bs-success: #3ddc84;
  --bs-success-hover: #4ee896;
  --bs-danger: #f56565;
  --bs-danger-hover: #fc8181;
  --bs-warning: #f6ad55;
  --bs-warning-hover: #fbb462;
  --bs-info: #63b3ed;
  --bs-info-hover: #76c0f4;

  --gradient-primary: linear-gradient(135deg,#6d28d9,#9333ea);
  --gradient-success: linear-gradient(135deg,#3ddc84,#2ecc71);
  --gradient-danger: linear-gradient(135deg,#f56565,#fc8181);
  --gradient-info: linear-gradient(135deg,#63b3ed,#76c0f4);
  --gradient-warning: linear-gradient(135deg,#f6ad55,#fbb462);
  --gradient-light: linear-gradient(135deg,#0f1726,#111827);
  --gradient-accent: var(--gradient-primary);
  --navbar-gradient: linear-gradient(135deg,#0b1220,#0f1726);

  --focus-ring: rgba(124, 142, 251, 0.35);
  --focus-border: rgba(124, 142, 251, 0.55);
  --shadow-sm: 0 2px 4px rgba(0,0,0,0.3);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.4);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.5);
  --shadow-focus: 0 0 0 0.2rem var(--focus-ring);

  --table-head-bg: linear-gradient(135deg,#0f1726,#111827);
  --table-head-color: #e6eef8;

  --toast-bg: rgba(255,255,255,0.06);
  --toast-color: #e6eef8;
}

/* Light theme explicit (optional) */
[data-theme="light"] {
  --bs-body-bg: #ffffff;
  --bs-body-color: #0f1720;
  --bs-bg-subtle: #f8f9fa;
  --card-bg: #ffffff;
  --card-border: rgba(0,0,0,0.06);
  --card-contrast: rgba(0,0,0,0.06);
  --muted: #6c757d;
  --border-color: #e9ecef;
  --bs-primary: #667eea;
  --bs-primary-hover: #5a67d8;
  --bs-secondary: #764ba2;
  --bs-secondary-hover: #6a4191;
  --gradient-primary: linear-gradient(135deg,#667eea,#764ba2);
  --gradient-accent: var(--gradient-primary);
  --navbar-gradient: linear-gradient(135deg,#ffffff,#f8fafc);
}

/* Fallback to prefers-color-scheme when no data-theme is set */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --bs-body-bg: #0b1220;
    --bs-body-color: #e6eef8;
    --bs-bg-subtle: #0f1726;
    --card-bg: #0f1726;
    --card-border: rgba(255,255,255,0.04);
    --muted: #9aa6b2;
    --border-color: rgba(255,255,255,0.1);
    --bs-primary: #7c8efb;
    --bs-primary-hover: #8e9cfc;
    --gradient-primary: linear-gradient(135deg,#6d28d9,#9333ea);
    --gradient-accent: var(--gradient-primary);
    --navbar-gradient: linear-gradient(135deg,#0b1220,#0f1726);
  }
}

/* Helpers */
html, body { background: var(--bs-body-bg); color: var(--bs-body-color); }
.bg-body { background: var(--bs-body-bg) !important; }
.text-body { color: var(--bs-body-color) !important; }
.text-muted { color: var(--muted) !important; }
.border-muted { border-color: var(--border-color) !important; }

.card, .form-card, .distribution-card, .directory-card, .receiver-card {
  background: var(--card-bg);
  border-color: var(--border-color);
  color: var(--bs-body-color);
  box-shadow: var(--shadow-sm);
}

.table, .premium-table { background: transparent; color: var(--bs-body-color); }
.premium-table th, .premium-table thead th { background: var(--table-head-bg); color: var(--table-head-color); }

/* Breadcrumbs centralized to theme tokens */
.breadcrumb { background: transparent; color: var(--bs-body-color); }
.breadcrumb .breadcrumb-item { color: var(--bs-body-color); }
.breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: var(--muted); }
.breadcrumb a { color: var(--bs-body-color); text-decoration: none; font-weight: 600; }
.breadcrumb a:hover { color: var(--bs-primary); text-decoration: underline; }

.user-avatar-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--gradient-accent);
  color: #ffffff;
  font-weight: 600;
  font-size: 0.875rem;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  flex-shrink: 0;
  transition: var(--transition-base);
}

.user-avatar-badge:hover { box-shadow: 0 4px 8px rgba(0,0,0,0.15); transform: translateY(-1px); }
