/* ========================================================
   CUSTOM.CSS - Override Bootstrap & Theme untuk Skema Red/Black
   BPBJ Kabupaten Kotim
   ======================================================== */

/* === Bootstrap CSS Variable Override === */
:root {
    --bs-primary: #E8353A;
    --bs-primary-rgb: 232, 53, 58;
    --bs-link-color: #E8353A;
    --bs-link-color-rgb: 232, 53, 58;
    --bs-link-hover-color: #C8252A;
    --bs-link-hover-color-rgb: 200, 37, 42;
    --bs-focus-ring-color: rgba(232, 53, 58, 0.25);
}

/* === Bootstrap btn-primary === */
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #E8353A;
    --bs-btn-border-color: #E8353A;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #C8252A;
    --bs-btn-hover-border-color: #C8252A;
    --bs-btn-focus-shadow-rgb: 232, 53, 58;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #A5161A;
    --bs-btn-active-border-color: #A5161A;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #E8353A;
    --bs-btn-disabled-border-color: #E8353A;
    background-color: #E8353A !important;
    border-color: #E8353A !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background-color: #C8252A !important;
    border-color: #C8252A !important;
    color: #fff !important;
}

/* === Bootstrap btn-outline-primary === */
.btn-outline-primary {
    --bs-btn-color: #E8353A;
    --bs-btn-border-color: #E8353A;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #E8353A;
    --bs-btn-hover-border-color: #E8353A;
    --bs-btn-focus-shadow-rgb: 232, 53, 58;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #E8353A;
    --bs-btn-active-border-color: #E8353A;
    color: #E8353A !important;
    border-color: #E8353A !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active {
    background-color: #E8353A !important;
    border-color: #E8353A !important;
    color: #fff !important;
}

/* === Bootstrap Text Colors === */
.text-primary {
    color: #E8353A !important;
}

/* === Bootstrap Badge === */
.badge.bg-primary,
.badge-primary {
    background-color: #E8353A !important;
    color: #fff !important;
}

/* === Bootstrap Alert === */
.alert-primary {
    --bs-alert-color: #A5161A;
    --bs-alert-bg: #fde8e9;
    --bs-alert-border-color: #f5c2c3;
    color: #A5161A;
    background-color: #fde8e9;
    border-color: #f5c2c3;
}

/* === Bootstrap Nav & Tabs === */
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    color: #E8353A !important;
    border-color: #E8353A !important;
}

/* === Bootstrap Pagination === */
.page-item.active .page-link {
    background-color: #E8353A !important;
    border-color: #E8353A !important;
    color: #fff !important;
}

.page-link {
    color: #E8353A !important;
}

.page-link:hover {
    color: #C8252A !important;
}

/* === Bootstrap Form Controls === */
.form-control:focus {
    border-color: #E8353A !important;
    box-shadow: 0 0 0 0.25rem rgba(232, 53, 58, 0.2) !important;
}

.form-select:focus {
    border-color: #E8353A !important;
    box-shadow: 0 0 0 0.25rem rgba(232, 53, 58, 0.2) !important;
}

/* === Bootstrap Check & Radio === */
.form-check-input:checked {
    background-color: #E8353A !important;
    border-color: #E8353A !important;
}

/* === Bootstrap Progress === */
.progress-bar {
    background-color: #E8353A !important;
}

/* === Bootstrap Spinner === */
.text-primary .spinner-border,
.spinner-border.text-primary {
    color: #E8353A !important;
}

/* === Bootstrap Dropdown === */
.dropdown-item.active,
.dropdown-item:active {
    background-color: #E8353A !important;
    color: #fff !important;
}

/* === Bootstrap List Group === */
.list-group-item.active {
    background-color: #E8353A !important;
    border-color: #E8353A !important;
    color: #fff !important;
}

/* === Bootstrap Border Color === */
.border-primary {
    border-color: #E8353A !important;
}

/* === Bootstrap Background === */
.bg-primary {
    background-color: #E8353A !important;
}

/* === Theme specific: text-default (Porto theme) === */
.text-default,
.text-color-default {
    color: #E8353A !important;
}

.bg-color-default,
.background-color-default {
    background-color: #E8353A !important;
}

/* === Owl Carousel Dots (aktif = merah) === */
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background: #E8353A !important;
}

/* === Owl Carousel Nav === */
.owl-theme .owl-nav [class*='owl-'] {
    color: #E8353A;
    background: rgba(232, 53, 58, 0.1);
}

.owl-theme .owl-nav [class*='owl-']:hover {
    background: #E8353A;
    color: #fff;
}