:root {
  --brand-color: #C64A11;
  --brand-color-hover: #B03E0F;
  --brand-color-light: #F6C9B0;
  --brand-color-dark: #9B360E;
  --brand-contrast: #ffffff;

  --ink: #111827;
  --muted: #6b7280;
  --bg: #F5F7FB;
  --surface: #F9FAFB;
  --sidebar: #F3F4F6;
  --border: #E5E7EB;

  --primary: var(--brand-color);
  --primary-hover: var(--brand-color-hover);
  --primary-light: var(--brand-color-light);
  --primary-dark: var(--brand-color-dark);

  --success: #198754;
  --success-light: #DCFCE7;
  --success-dark: #166534;
  --warning: #fd7e14;
  --warning-light: #FEF9C3;
  --warning-dark: #854D0E;
  --danger: #dc3545;
  --danger-light: #F8D7DA;
  --danger-dark: #721C24;
  --secondary: #6c757d;
  --secondary-light: #E5E7EB;
  --secondary-dark: #495057;

  --shadow: rgba(17, 24, 39, .06);
  --shadow-hover: rgba(17, 24, 39, .10);
  --shadow-strong: rgba(17, 24, 39, .12);
}

html, body {
  font-family: "Plus Jakarta Sans", "Manrope", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  color: var(--ink);
  background: var(--bg);
}

:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--primary) 30%, transparent);
  outline-offset: 2px;
}

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

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

.text-primary { color: var(--primary) !important; }
.bg-primary { background-color: var(--primary) !important; }
.border-primary { border-color: var(--primary) !important; }
.link-primary { color: var(--primary) !important; }
.link-primary:hover { color: var(--primary-hover) !important; }

.form-check-input:checked {
  background-color: var(--primary);
  border-color: var(--primary);
}

.page-link { color: var(--primary); }
.page-item.active .page-link {
  background-color: var(--primary);
  border-color: var(--primary);
}

.form-range::-webkit-slider-thumb { background: var(--primary); }
.form-range::-moz-range-thumb { background: var(--primary); }

.btn-brand {
  background-color: var(--brand-color) !important;
  border-color: var(--brand-color) !important;
  color: var(--brand-contrast) !important;
}

.btn-brand:hover,
.btn-brand:focus {
  background-color: var(--brand-color-hover) !important;
  border-color: var(--brand-color-hover) !important;
}