:root,
[data-bs-theme=light] {
  --bs-primary: #e8590c;
  --bs-primary-rgb: 232, 89, 12;
  --bs-primary-soft: #fdf0e8;
  --bs-primary-hover: #cf4f0a;
  --bs-primary-active: #b84609;
  --bs-link-color: #c94e0b;
  --bs-link-color-rgb: 201, 78, 11;
  --bs-link-hover-color: #a8420a;
  --bs-link-hover-color-rgb: 168, 66, 10;
  --bs-primary-text-emphasis: #5d2405;
  --bs-primary-bg-subtle: #fdf0e8;
  --bs-primary-border-subtle: #f4c4a3;
  --bs-custom-link-color: var(--bs-primary);
}

[data-bs-theme=dark] {
  --bs-primary: #e8590c;
  --bs-primary-rgb: 232, 89, 12;
  --bs-primary-soft: rgba(232, 89, 12, .15);
  --bs-primary-hover: #f06d2a;
  --bs-primary-active: #f58348;
  --bs-link-color: #f0956a;
  --bs-link-hover-color: #f3a57e;
  --bs-link-color-rgb: 240, 149, 106;
  --bs-link-hover-color-rgb: 243, 165, 126;
  --bs-primary-text-emphasis: #f0956a;
  --bs-primary-bg-subtle: #3d2518;
  --bs-primary-border-subtle: #7a4020;
}

/* ──────────────────────────────────────────
   BUTTONS
   ────────────────────────────────────────── */
.btn-primary {
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-color: #fff;
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-primary-hover);
  --bs-btn-hover-border-color: var(--bs-primary-active);
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-primary-active);
  --bs-btn-active-border-color: var(--bs-primary-active);
  --bs-btn-box-shadow-rgb: var(--bs-primary-rgb);
  --bs-btn-active-shadow-rgb: var(--bs-primary-rgb);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--bs-primary);
  --bs-btn-disabled-border-color: var(--bs-primary);
}

.btn-outline-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-primary-hover);
  --bs-btn-active-border-color: var(--bs-primary-hover);
  --bs-btn-disabled-color: var(--bs-primary);
  --bs-btn-disabled-border-color: var(--bs-primary);
}

.btn-label-primary {
  --bs-btn-color: #b84609;
  --bs-btn-bg: var(--bs-primary-bg-subtle);
  --bs-btn-border-color: var(--bs-btn-bg);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-primary-hover);
  --bs-btn-active-border-color: var(--bs-primary-hover);
}

.btn-text-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-hover-color: var(--bs-primary-hover);
  --bs-btn-active-color: var(--bs-primary-active);
  --bs-btn-hover-bg: var(--bs-primary-bg-subtle);
  --bs-btn-active-bg: var(--bs-primary-bg-subtle);
}

/* ──────────────────────────────────────────
   BADGES & LABELS — text gelap supaya kontras
   ────────────────────────────────────────── */
.bg-primary {
  background-color: var(--bs-primary) !important;
  color: #fff !important;
}

.bg-label-primary {
  background-color: var(--bs-primary-bg-subtle) !important;
  color: #b84609 !important;
}

.text-primary { color: var(--bs-primary) !important; }
.border-primary { border-color: var(--bs-primary) !important; }

/* ──────────────────────────────────────────
   FORMS
   ────────────────────────────────────────── */
.form-control:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--bs-primary-rgb), 0.2);
}

.form-select:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--bs-primary-rgb), 0.2);
}

.form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  box-shadow: 0 .125rem .375rem 0 rgba(var(--bs-primary-rgb), .2);
}

.form-check-input[type=checkbox]:indeterminate {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

.input-group:focus-within {
  box-shadow: 0 0 0 var(--bs-border-width) var(--bs-primary);
}

.input-group:focus-within::before {
  box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--bs-primary-rgb), 0.2);
}

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

.form-floating > .form-control:focus ~ label,
.form-floating > .form-select:focus ~ label {
  color: var(--bs-primary);
}

/* ──────────────────────────────────────────
   NAVIGATION
   ────────────────────────────────────────── */
.nav-tabs .nav-link.active,
.nav-tabs .nav-link.active:hover,
.nav-tabs .nav-link.active:focus,
.nav-tabs .nav-item.show .nav-link {
  box-shadow: 0 -2px 0 var(--bs-primary) inset;
  color: var(--bs-primary);
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: var(--bs-primary);
  color: #fff;
  box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--bs-primary-rgb), 0.3);
}

/* ──────────────────────────────────────────
   PAGINATION
   ────────────────────────────────────────── */
.pagination .page-item.active .page-link {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #fff;
  box-shadow: 0 0.125rem 0.25rem 0 rgba(var(--bs-primary-rgb), 0.4);
}

/* ──────────────────────────────────────────
   PROGRESS
   ────────────────────────────────────────── */
.progress .progress-bar {
  background-color: var(--bs-primary);
  box-shadow: 0 2px 4px 0 rgba(var(--bs-primary-rgb), 0.3);
}

/* ──────────────────────────────────────────
   SIDEBAR MENU
   ────────────────────────────────────────── */
.menu-item.active > .menu-link:not(.menu-toggle) {
  background: linear-gradient(270deg, rgba(var(--bs-primary-rgb), 0.7) 0%, var(--bs-primary) 100%);
  color: #fff;
  box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--bs-primary-rgb), 0.3);
}

:dir(rtl) .menu-item.active > .menu-link:not(.menu-toggle) {
  background: linear-gradient(-270deg, rgba(var(--bs-primary-rgb), 0.7) 0%, var(--bs-primary) 100%);
}

.menu.menu-horizontal .menu-inner > .menu-item.active > .menu-link.menu-toggle {
  background: linear-gradient(270deg, rgba(var(--bs-primary-rgb), 0.7) 0%, var(--bs-primary) 100%);
  color: #fff;
  box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--bs-primary-rgb), 0.3);
}

.menu-horizontal .menu-item.active > .menu-link:not(.menu-toggle) {
  background: var(--bs-primary-bg-subtle);
  color: #b84609;
}

/* ──────────────────────────────────────────
   BREADCRUMB
   ────────────────────────────────────────── */
.breadcrumb { --bs-breadcrumb-color: var(--bs-primary); }
.breadcrumb-item a { color: var(--bs-primary); }

/* ──────────────────────────────────────────
   CARD
   ────────────────────────────────────────── */
.card-border-shadow-primary {
  --bs-card-border-bottom-color: var(--bs-primary-border-subtle);
  --bs-card-hover-border-bottom-color: var(--bs-primary);
}

/* ──────────────────────────────────────────
   LIST GROUP & TIMELINE
   ────────────────────────────────────────── */
.list-group {
  --bs-list-group-active-bg: var(--bs-primary-bg-subtle);
  --bs-list-group-timeline-bg: var(--bs-primary);
}

.list-group .list-group-item.active { color: #b84609; }

.timeline {
  --bs-timeline-point-indicator-color: var(--bs-primary);
  --bs-timeline-point-indicator-bg: var(--bs-primary-bg-subtle);
}

/* ──────────────────────────────────────────
   ALERT
   ────────────────────────────────────────── */
.alert-primary {
  --bs-alert-color: #b84609;
  --bs-alert-bg: var(--bs-primary-bg-subtle);
  --bs-alert-close-icon: var(--bs-primary);
  --bs-alert-link-color: #b84609;
  --bs-alert-icon-bg: var(--bs-primary);
  --bs-alert-border-color: var(--bs-primary-border-subtle);
}

/* ──────────────────────────────────────────
   MISC COMPONENTS
   ────────────────────────────────────────── */
.accordion-header-primary { --bs-accordion-active-color: var(--bs-primary); }

.tooltip.tooltip-primary,
.tooltip-primary > .tooltip {
  --bs-tooltip-bg: var(--bs-primary);
  --bs-tooltip-color: #fff;
}

.popover.popover-primary {
  --bs-popover-bg: var(--bs-primary);
  --bs-popover-header-bg: var(--bs-primary);
  --bs-popover-header-color: #fff;
  --bs-popover-body-color: #fff;
}

.dropdown-item.active,
.dropdown-item:active {
  background-color: var(--bs-primary-bg-subtle);
  color: #b84609;
}

.custom-option.checked {
  --bs-custom-option-border-color: var(--bs-primary);
}

.layout-navbar .navbar-nav .nav-item .avatar-initial,
.navbar .avatar-initial {
  background-color: var(--bs-primary) !important;
  color: #fff !important;
}

.divider-primary { --bs-divider-color: var(--bs-primary); }

.table-primary {
  --bs-table-bg: var(--bs-primary-bg-subtle);
  --bs-table-color: #5d2405;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: var(--bs-primary) !important;
  color: #fff !important;
}

.apexcharts-theme-dark {
  --bs-primary: #e8590c;
  --bs-primary-rgb: 232, 89, 12;
}