/* Theme tokens */
:root {
  --ds-primary: #2563eb;
  --ds-primary-dark: #1e40af;
  --ds-secondary: #0ea5e9;
  --ds-bg: #f5f7fb;
  --ds-card-border: #dee5f2;
  --ds-muted: #94a3b8;
  --ds-success: #16a34a;
  --ds-danger: #dc2626;
}

body {
  background: var(--ds-bg);
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: #0f172a;
}

.navbar {
  box-shadow: 0 .5rem 1rem rgba(15, 23, 42, .15);
  background: linear-gradient(135deg, #0f172a 0%, #111827 100%);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.navbar .navbar-brand {
  font-weight: 700;
  letter-spacing: .03em;
  color: #fff;
}
.navbar .nav-link {
  font-weight: 600;
  color: #e2e8f0;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus {
  color: #fff;
}

main.container {
  max-width: 1180px;
}

.card,
.card-section,
.ds-card {
  border-radius: 1rem;
  border: 1px solid var(--ds-card-border);
  box-shadow: 0 .25rem .75rem rgba(15, 23, 42, .08);
  background: #fff;
}

.card-header {
  border-bottom: 1px solid var(--ds-card-border);
  background: linear-gradient(90deg, rgba(37, 99, 235, .06), transparent);
}

.sticky-actions {
  position: sticky;
  bottom: 0;
  background: rgba(255,255,255,.9);
  backdrop-filter: blur(6px);
  padding: .75rem;
  border-top: 1px solid var(--ds-card-border);
  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;
}

.section-title {
  font-size: 1.05rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--ds-muted);
  font-weight: 600;
}

.table-hover tbody tr:hover {
  background: rgba(37, 99, 235, .05);
}

.table-rounded {
  border-radius: 1rem;
  overflow: hidden;
}

.table thead th {
  background: #eef2ff;
  border-bottom: none;
  font-size: .85rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #475569;
}

[data-enhanced-table] {
  font-size: .95rem;
}

.table-controls {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: .75rem;
}

.btn {
  border-radius: .65rem;
  font-weight: 600;
}
.btn-primary {
  background: var(--ds-primary);
  border-color: var(--ds-primary);
}

.btn-primary:hover,
.btn-primary:focus {
  background: var(--ds-primary-dark);
  border-color: var(--ds-primary-dark);
}

.btn-outline-primary {
  color: var(--ds-primary);
  border-color: var(--ds-primary);
}

.btn-outline-primary:hover {
  color: #fff;
  background: var(--ds-primary);
}

.btn-outline-secondary {
  color: #475569;
  border-color: var(--ds-card-border);
}
.btn-outline-secondary:hover {
  color: #0f172a;
  background: #e2e8f0;
  border-color: #cbd5e1;
}

.badge-role-admin{background-color:#0d6efd;}
.badge-role-manager{background-color:#20c997;}
.badge-role-user{background-color:#6c757d;}
.badge-status-active{background-color:#198754;}
.badge-status-inactive{background-color:#adb5bd;color:#212529;}
.language-badge{
  background-color:#e2e6ea;
  color:#495057;
  font-weight:600;
}

.favorite-btn.btn-warning{color:#fff;background-color:#f0ad4e;border-color:#ec971f;}
.favorite-btn.btn-outline-secondary{color:#6c757d;border-color:#6c757d;}

.form-control,
.form-select {
  border-radius: .65rem;
  border-color: #d7deea;
}
.form-control:focus,
.form-select:focus {
  border-color: var(--ds-primary);
  box-shadow: 0 0 0 .15rem rgba(37, 99, 235, .15);
}

.list-timeline {
  padding-left: 1.5rem;
  position: relative;
}
.list-timeline::before {
  content: '';
  position: absolute;
  left: .5rem;
  top: .2rem;
  bottom: .2rem;
  width: 2px;
  background: var(--ds-card-border);
}
.list-timeline > li {
  position: relative;
  margin-bottom: 1rem;
  padding-left: 1rem;
}
.list-timeline > li::before {
  content: '';
  position: absolute;
  left: -.95rem;
  top: .2rem;
  width: .75rem;
  height: .75rem;
  border-radius: 50%;
  background: #fff;
  border: 2px solid var(--ds-primary);
}

.mobile-card {
  padding: 1.25rem;
}

@media (max-width: 768px) {
  .navbar .btn {
    width: 100%;
    margin-top: .75rem;
  }
  .sticky-actions {
    position: static;
    border-radius: .75rem;
  }
  .table-responsive {
    border-radius: .75rem;
  }
.card,
.ds-card {
    border-radius: .85rem;
  }
}