/**======================================================================
Palet warna Koperasi Yastengz (https://coolors.co/087e8b-ff5a5f-3c3c3c-f5f5f5-c1839f)
Primary  : #087e8b (teal)
Secondary: #c1839f (mauve)
Danger   : #ff5a5f (coral)
Teks     : #3c3c3c (charcoal)
Latar    : #f5f5f5 (off-white)
Dimuat setelah style.css & style-preset.css supaya menang di cascade
tanpa perlu mengubah file bawaan template.
=========================================================================== */

:root {
  --bs-body-bg: #f5f5f5;
  --bs-body-bg-rgb: 245, 245, 245;
  --bs-body-color: #3c3c3c;
  --pc-heading-color: #3c3c3c;

  /* --pc-header-background bukan bagian dari sistem preset warna template
     (dipakai apa adanya oleh .pc-header terlepas dari data-pc-preset),
     jadi harus di-override manual di sini supaya header ikut berubah. */
  --pc-header-background: linear-gradient(to right, #087e8b, #0baabb);

  --bs-secondary: #c1839f;
  --bs-secondary-rgb: 193, 131, 159;

  --bs-danger: #ff5a5f;
  --bs-danger-rgb: 255, 90, 95;
  --bs-danger-text-emphasis: #4d1b1d;
  --bs-danger-bg-subtle: #ffdedf;
  --bs-danger-border-subtle: #ffbdbf;
}

.bg-light-secondary {
  background: #f9f3f5;
  color: #c1839f;
}

/* .bg-grd-danger juga fixed (tidak ikut sistem preset), dipakai untuk kartu KPI */
.bg-grd-danger {
  background: linear-gradient(45deg, #ff5a5f, #ff8c8f);
}

/* --- Primary (teal #087e8b), berbasis preset-9 bawaan template --- */
[data-pc-preset=preset-9] {
  --pc-sidebar-active-color: #087e8b;
  --bs-blue: #087e8b;
  --bs-primary: #087e8b;
  --bs-primary-rgb: 8, 126, 139;
  --bs-primary-light: #e6f2f3;
  --bs-link-color: #087e8b;
  --bs-link-color-rgb: 8, 126, 139;
  --bs-link-hover-color: #06656f;
  --dt-row-selected: 8, 126, 139;
}
[data-pc-preset=preset-9] .bg-light-primary {
  background: #e6f2f3;
  color: #087e8b;
}
[data-pc-preset=preset-9] .bg-grd-primary {
  background: linear-gradient(45deg, #087e8b, #0baabb);
}
[data-pc-preset=preset-9] .link-primary {
  color: #087e8b !important;
}
[data-pc-preset=preset-9] .link-primary:hover, [data-pc-preset=preset-9] .link-primary:focus {
  color: #06656f !important;
}
[data-pc-preset=preset-9] .btn-primary {
  --bs-btn-color: #ffffff;
  --bs-btn-bg: #087e8b;
  --bs-btn-border-color: #087e8b;
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: #076c77;
  --bs-btn-hover-border-color: #06656f;
  --bs-btn-focus-shadow-rgb: 45, 145, 156;
  --bs-btn-active-color: #ffffff;
  --bs-btn-active-bg: #06656f;
  --bs-btn-active-border-color: #065f69;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #ffffff;
  --bs-btn-disabled-bg: #087e8b;
  --bs-btn-disabled-border-color: #087e8b;
}
[data-pc-preset=preset-9] .btn-link {
  --bs-btn-color: #087e8b;
  --bs-btn-hover-color: #06656f;
  --bs-btn-active-color: #06656f;
}
[data-pc-preset=preset-9] .text-bg-primary {
  color: #ffffff !important;
  background-color: RGBA(8, 126, 139, var(--bs-bg-opacity, 1)) !important;
}
[data-pc-preset=preset-9] .accordion {
  --bs-accordion-btn-focus-border-color: #087e8b;
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.2rem rgba(8, 126, 139, 0.25);
  --bs-accordion-active-color: #087e8b;
  --bs-accordion-active-bg: #e6f2f3;
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23087e8b'%3e%3cpath fill-rule=' evenodd' d=' M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
[data-pc-preset=preset-9] .alert-primary {
  --bs-alert-color: #054c54;
  --bs-alert-bg: #cee5e8;
  --bs-alert-border-color: #b5d8dc;
  --bs-alert-link-color: #043d44;
}
[data-pc-preset=preset-9] .list-group {
  --bs-list-group-active-bg: #087e8b;
  --bs-list-group-active-border-color: #087e8b;
}
[data-pc-preset=preset-9] .list-group-item-primary {
  color: #054c54;
  background-color: #cee5e8;
}
[data-pc-preset=preset-9] .nav {
  --bs-nav-link-hover-color: #06656f;
}
[data-pc-preset=preset-9] .nav-pills {
  --bs-nav-pills-link-active-bg: #087e8b;
}
[data-pc-preset=preset-9] .pagination {
  --bs-pagination-hover-color: #06656f;
  --bs-pagination-focus-color: #06656f;
  --bs-pagination-focus-box-shadow: 0 0 0 0.2rem rgba(8, 126, 139, 0.25);
  --bs-pagination-active-bg: #087e8b;
  --bs-pagination-active-border-color: #087e8b;
}
[data-pc-preset=preset-9] .progress {
  --bs-progress-bar-bg: #087e8b;
}
[data-pc-preset=preset-9] .form-check .form-check-input.input-primary:checked {
  border-color: #087e8b;
  background-color: #087e8b;
}
[data-pc-preset=preset-9] .form-check .form-check-input.input-light-primary:checked {
  border-color: #e6f2f3;
  background-color: #e6f2f3;
}
[data-pc-preset=preset-9] .form-check .form-check-input.input-light-primary:checked[type=checkbox] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23087e8b' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
}
[data-pc-preset=preset-9] .form-check .form-check-input.input-light-primary:checked[type=radio] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23087e8b'/%3e%3c/svg%3e");
}
[data-pc-preset=preset-9] .form-check .form-check-input.input-primary:focus[type=checkbox], [data-pc-preset=preset-9] .form-check .form-check-input.input-primary:focus[type=radio], [data-pc-preset=preset-9] .form-check .form-check-input.input-light-primary:focus[type=checkbox], [data-pc-preset=preset-9] .form-check .form-check-input.input-light-primary:focus[type=radio] {
  box-shadow: 0 0 0 0.2rem rgba(8, 126, 139, 0.25);
  border-color: #087e8b;
}
[data-pc-preset=preset-9] .form-check.form-switch .form-check-input.input-light-primary:checked {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23087e8b'/%3e%3c/svg%3e");
}
[data-pc-preset=preset-9] .btn-light-primary {
  background: #e6f2f3;
  color: #087e8b;
  border-color: #e6f2f3;
}
[data-pc-preset=preset-9] .btn-light-primary .material-icons-two-tone {
  background-color: #087e8b;
}
[data-pc-preset=preset-9] .btn-light-primary:hover {
  background: #087e8b;
  color: #fff;
  border-color: #087e8b;
}
[data-pc-preset=preset-9] .btn-light-primary.focus, [data-pc-preset=preset-9] .btn-light-primary:focus {
  background: #087e8b;
  color: #fff;
  border-color: #087e8b;
}
[data-pc-preset=preset-9] .btn-light-primary:not(:disabled):not(.disabled).active, [data-pc-preset=preset-9] .btn-light-primary:not(:disabled):not(.disabled):active, .show > [data-pc-preset=preset-9] .btn-light-primary.dropdown-toggle {
  background: #087e8b;
  color: #fff;
  border-color: #087e8b;
}
[data-pc-preset=preset-9] .btn-check:active + .btn-light-primary,
[data-pc-preset=preset-9] .btn-check:checked + .btn-light-primary {
  background: #087e8b;
  color: #fff;
  border-color: #087e8b;
}
[data-pc-preset=preset-9] .btn-link-primary {
  background: transparent;
  color: #087e8b;
  border-color: transparent;
}
[data-pc-preset=preset-9] .btn-link-primary .material-icons-two-tone {
  background-color: #087e8b;
}
[data-pc-preset=preset-9] .btn-link-primary:hover {
  background: #e6f2f3;
  color: #087e8b;
  border-color: #e6f2f3;
}
[data-pc-preset=preset-9] .btn-link-primary.focus, [data-pc-preset=preset-9] .btn-link-primary:focus {
  background: #e6f2f3;
  color: #087e8b;
  border-color: #e6f2f3;
}
[data-pc-preset=preset-9] .btn-link-primary:not(:disabled):not(.disabled).active, [data-pc-preset=preset-9] .btn-link-primary:not(:disabled):not(.disabled):active, .show > [data-pc-preset=preset-9] .btn-link-primary.dropdown-toggle {
  background: #e6f2f3;
  color: #087e8b;
  border-color: #e6f2f3;
}
[data-pc-preset=preset-9] .btn-check:active + .btn-link-primary,
[data-pc-preset=preset-9] .btn-check:checked + .btn-link-primary {
  background: #e6f2f3;
  color: #087e8b;
  border-color: #e6f2f3;
}
[data-pc-preset=preset-9] .table-primary {
  --bs-table-color: #ffffff;
  --bs-table-bg: #087e8b;
  --bs-table-border-color: #218b97;
  --bs-table-striped-bg: #148491;
  --bs-table-striped-color: #ffffff;
  --bs-table-active-bg: #218b97;
  --bs-table-active-color: #ffffff;
  --bs-table-hover-bg: #0d818d;
  --bs-table-hover-color: #ffffff;
  color: var(--bs-table-color);
  border-color: var(--bs-table-border-color);
}