/* ============================================================
   Payda PRO Admin — тема под payda.kz
   Tabler UI + Bootstrap override
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* ── Переменные ──────────────────────────────────────────── */
:root {
  --brand:        #004EEB;
  --brand-hover:  #0040c1;
  --brand-light:  #eff4ff;
  --brand-border: #b2ccff;
  --success:      #16b364;
  --error:        #f04438;
  --gray-50:      #fafafa;
  --gray-100:     #f0f0f1;
  --gray-200:     #e5e7eb;
  --gray-600:     #535862;
  --gray-900:     #181d27;
}

/* ── Шрифт (только текстовые элементы, не иконки) ───────── */
body, h1, h2, h3, h4, h5, h6, p, span, div, a, td, th, label,
input, select, textarea, button, .btn, .nav-link, .card-title,
.card-header, .form-label, .form-control, .form-select,
.page-title, .page-pretitle, .table, .dropdown-item, .modal {
  font-family: 'Inter', ui-sans-serif, system-ui, sans-serif !important;
}

/* ── Боковая панель (aside.navbar-vertical) ──────────────── */
.navbar-vertical {
  background-color: var(--gray-900) !important;
  border-right: 1px solid rgba(255,255,255,.08) !important;
}

.navbar-vertical .navbar-brand h3,
.navbar-vertical .navbar-brand-autodark h3 {
  color: #ffffff !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  margin: 0 !important;
}

/* Ссылки меню */
.navbar-vertical .nav-link {
  color: rgba(255,255,255,.7) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  margin: 1px 8px !important;
  transition: background 0.15s, color 0.15s;
}

.navbar-vertical .nav-link:hover {
  background-color: rgba(255,255,255,.08) !important;
  color: #ffffff !important;
}

.navbar-vertical .nav-link.active,
.navbar-vertical .nav-link[aria-current="page"] {
  background-color: var(--brand) !important;
  color: #ffffff !important;
}

.navbar-vertical .nav-link .nav-link-icon {
  color: inherit !important;
  opacity: 1 !important;
}

/* Logout кнопка */
.navbar-vertical .btn-secondary {
  background-color: rgba(255,255,255,.1) !important;
  border-color: transparent !important;
  color: rgba(255,255,255,.8) !important;
  font-size: 0.875rem !important;
  border-radius: 6px !important;
}

.navbar-vertical .btn-secondary:hover {
  background-color: rgba(255,255,255,.2) !important;
  color: #ffffff !important;
}

/* ── Основной контент ────────────────────────────────────── */
.page-wrapper {
  background-color: var(--gray-50) !important;
}

.page-header {
  background-color: #ffffff !important;
  border-bottom: 1px solid var(--gray-200) !important;
  padding: 16px 24px !important;
}

.page-title {
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  color: var(--gray-900) !important;
}

/* ── Кнопки ──────────────────────────────────────────────── */
.btn-primary {
  background-color: var(--brand) !important;
  border-color: var(--brand) !important;
  color: #ffffff !important;
  font-weight: 500 !important;
  font-size: 0.875rem !important;
  border-radius: 6px !important;
  transition: background 0.15s, box-shadow 0.15s;
}

.btn-primary:hover, .btn-primary:focus {
  background-color: var(--brand-hover) !important;
  border-color: var(--brand-hover) !important;
  box-shadow: 0 0 0 3px rgba(0,78,235,.2) !important;
}

.btn:not(.btn-primary):not(.btn-danger) {
  border-radius: 6px !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
}

/* ── Карточки ────────────────────────────────────────────── */
.card {
  border: 1px solid var(--gray-200) !important;
  border-radius: 8px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.05) !important;
}

.card-header {
  background-color: #ffffff !important;
  border-bottom: 1px solid var(--gray-200) !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  color: var(--gray-900) !important;
  padding: 12px 16px !important;
}

/* ── Таблицы ─────────────────────────────────────────────── */
.table {
  font-size: 0.875rem !important;
}

.table thead th {
  background-color: var(--gray-50) !important;
  color: var(--gray-600) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  border-bottom: 1px solid var(--gray-200) !important;
  padding: 10px 14px !important;
}

.table tbody tr:hover td {
  background-color: var(--brand-light) !important;
}

.table tbody td {
  padding: 10px 14px !important;
  vertical-align: middle !important;
  color: var(--gray-900) !important;
  border-bottom: 1px solid var(--gray-100) !important;
}

/* ── Формы ───────────────────────────────────────────────── */
.form-control, .form-select {
  border-radius: 6px !important;
  border: 1px solid var(--gray-200) !important;
  font-size: 0.875rem !important;
}

.form-control:focus, .form-select:focus {
  border-color: var(--brand) !important;
  box-shadow: 0 0 0 3px rgba(0,78,235,.15) !important;
}

.form-label {
  font-weight: 500 !important;
  font-size: 0.875rem !important;
  color: var(--gray-900) !important;
}

/* ── Пагинация ───────────────────────────────────────────── */
.page-link {
  color: var(--brand) !important;
  font-size: 0.875rem !important;
}

.page-item.active .page-link {
  background-color: var(--brand) !important;
  border-color: var(--brand) !important;
  color: #ffffff !important;
}

/* ── Select2 ─────────────────────────────────────────────── */
.select2-container--default .select2-results__option--highlighted {
  background-color: var(--brand) !important;
}

.select2-container--default .select2-selection--single:focus,
.select2-container--default .select2-selection--multiple:focus {
  border-color: var(--brand) !important;
}

/* ── Scrollbar ───────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--gray-100); }
::-webkit-scrollbar-thumb { background: var(--gray-200); border-radius: 3px; }