/* 360care corporate application palette. Health-card designer colors remain independent. */
:root,
[data-bs-theme="light"] {
  --phoenix-primary: #344b5e;
  --phoenix-primary-rgb: 52, 75, 94;
  --phoenix-primary-text-emphasis: #273b4b;
  --phoenix-primary-bg-subtle: #e9edf0;
  --phoenix-primary-border-subtle: #aebbc4;
  --phoenix-secondary: #667780;
  --phoenix-secondary-rgb: 102, 119, 128;
  --phoenix-success: #5b7366;
  --phoenix-success-rgb: 91, 115, 102;
  --phoenix-success-text-emphasis: #405449;
  --phoenix-success-bg-subtle: #e9eeeb;
  --phoenix-success-border-subtle: #b2c0b8;
  --phoenix-info: #597184;
  --phoenix-info-rgb: 89, 113, 132;
  --phoenix-info-text-emphasis: #3e5668;
  --phoenix-info-bg-subtle: #e9edf0;
  --phoenix-info-border-subtle: #b3bec7;
  --phoenix-danger: #815858;
  --phoenix-danger-rgb: 129, 88, 88;
  --phoenix-danger-text-emphasis: #613f3f;
  --phoenix-danger-bg-subtle: #f0eaea;
  --phoenix-danger-border-subtle: #c6adad;
  --phoenix-link-color: #405f76;
  --phoenix-link-color-rgb: 64, 95, 118;
  --phoenix-link-hover-color: #2d4659;
  --phoenix-link-hover-color-rgb: 45, 70, 89;
}

[data-bs-theme="dark"] {
  --phoenix-primary: #8ba2b3;
  --phoenix-primary-rgb: 139, 162, 179;
  --phoenix-primary-text-emphasis: #a8c1d3;
  --phoenix-primary-bg-subtle: #192936;
  --phoenix-primary-border-subtle: #39556a;
  --phoenix-secondary: #8e9ba1;
  --phoenix-secondary-rgb: 142, 155, 161;
  --phoenix-success: #8ca498;
  --phoenix-success-rgb: 140, 164, 152;
  --phoenix-success-text-emphasis: #a6c6ba;
  --phoenix-success-bg-subtle: #1c2d28;
  --phoenix-success-border-subtle: #3c5b50;
  --phoenix-info: #8ca3b4;
  --phoenix-info-rgb: 140, 163, 180;
  --phoenix-info-text-emphasis: #adc5d6;
  --phoenix-info-bg-subtle: #1b2a35;
  --phoenix-info-border-subtle: #3b566a;
  --phoenix-danger: #b18a8a;
  --phoenix-danger-rgb: 177, 138, 138;
  --phoenix-danger-text-emphasis: #d8aaaa;
  --phoenix-danger-bg-subtle: #352323;
  --phoenix-danger-border-subtle: #704545;
  --phoenix-link-color: #89adc7;
  --phoenix-link-color-rgb: 137, 173, 199;
  --phoenix-link-hover-color: #b0cadc;
}

.btn-primary {
  --phoenix-btn-color: #fff;
  --phoenix-btn-bg: #344b5e;
  --phoenix-btn-border-color: #344b5e;
  --phoenix-btn-hover-bg: #293d4d;
  --phoenix-btn-hover-border-color: #293d4d;
  --phoenix-btn-active-bg: #223442;
  --phoenix-btn-active-border-color: #223442;
  --phoenix-btn-disabled-bg: #344b5e;
  --phoenix-btn-disabled-border-color: #344b5e;
}

.btn-success {
  --phoenix-btn-color: #fff;
  --phoenix-btn-bg: #5b7366;
  --phoenix-btn-border-color: #5b7366;
  --phoenix-btn-hover-bg: #4a5f54;
  --phoenix-btn-hover-border-color: #4a5f54;
  --phoenix-btn-active-bg: #405249;
  --phoenix-btn-active-border-color: #405249;
}

.btn-info {
  --phoenix-btn-color: #fff;
  --phoenix-btn-bg: #597184;
  --phoenix-btn-border-color: #597184;
  --phoenix-btn-hover-bg: #485d6d;
  --phoenix-btn-hover-border-color: #485d6d;
}

.btn-danger {
  --phoenix-btn-color: #fff;
  --phoenix-btn-bg: #815858;
  --phoenix-btn-border-color: #815858;
  --phoenix-btn-hover-bg: #6b4848;
  --phoenix-btn-hover-border-color: #6b4848;
  --phoenix-btn-active-bg: #5d3f3f;
  --phoenix-btn-active-border-color: #5d3f3f;
}

.btn-outline-primary {
  --phoenix-btn-color: #344b5e;
  --phoenix-btn-border-color: #344b5e;
  --phoenix-btn-hover-color: #fff;
  --phoenix-btn-hover-bg: #344b5e;
  --phoenix-btn-hover-border-color: #344b5e;
  --phoenix-btn-active-bg: #293d4d;
  --phoenix-btn-active-border-color: #293d4d;
}

.btn-outline-success {
  --phoenix-btn-color: #5b7366;
  --phoenix-btn-border-color: #5b7366;
  --phoenix-btn-hover-color: #fff;
  --phoenix-btn-hover-bg: #5b7366;
  --phoenix-btn-hover-border-color: #5b7366;
}

.btn-outline-danger {
  --phoenix-btn-color: #815858;
  --phoenix-btn-border-color: #815858;
  --phoenix-btn-hover-color: #fff;
  --phoenix-btn-hover-bg: #815858;
  --phoenix-btn-hover-border-color: #815858;
}

.navbar-vertical,
.navbar-top {
  --phoenix-navbar-active-color: #344b5e;
}

.navbar-vertical .nav-link.active,
.navbar-vertical .nav-link:hover {
  color: #344b5e;
}

.progress-bar.bg-primary,
.bg-primary {
  background-color: #344b5e !important;
}

.bg-success { background-color: #5b7366 !important; }
.bg-info { background-color: #597184 !important; }
.bg-danger { background-color: #815858 !important; }
.text-primary { color: #344b5e !important; }
.text-success { color: #5b7366 !important; }
.text-info { color: #597184 !important; }
.text-danger { color: #815858 !important; }
.border-primary { border-color: #344b5e !important; }
.border-success { border-color: #5b7366 !important; }
.border-info { border-color: #597184 !important; }
.border-danger { border-color: #815858 !important; }

.form-check-input:checked {
  background-color: #344b5e;
  border-color: #344b5e;
}

.form-control:focus,
.form-select:focus {
  border-color: #899aa6;
  box-shadow: 0 0 0 .2rem rgba(52, 75, 94, .13);
}

.page-link.active,
.active > .page-link {
  background-color: #344b5e;
  border-color: #344b5e;
}

.konsulta-sidebar-link .nav-link-icon {
  width: 1.75rem;
  height: 1.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #687984;
  background: transparent;
  border: 0;
  transition: color .15s ease, transform .15s ease;
}

.konsulta-sidebar-link .nav-link-icon svg {
  width: 1.05rem;
  height: 1.05rem;
  stroke-width: 1.6;
}

.konsulta-sidebar-link:hover .nav-link-icon,
.konsulta-sidebar-link.active .nav-link-icon {
  color: #344b5e;
  background: transparent;
  border-color: transparent;
}

.konsulta-sidebar-link:hover .nav-link-icon {
  transform: translateX(1px);
}

.konsulta-sidebar-link.active {
  position: relative;
  font-weight: 700;
}

.konsulta-sidebar-link.active::before {
  content: "";
  position: absolute;
  left: -.15rem;
  top: 50%;
  width: 2px;
  height: 1.15rem;
  border-radius: 2px;
  background: #344b5e;
  transform: translateY(-50%);
}

[data-bs-theme="dark"] .konsulta-sidebar-link .nav-link-icon {
  color: #aebdc7;
  background: transparent;
  border-color: transparent;
}

[data-bs-theme="dark"] .konsulta-sidebar-link:hover .nav-link-icon,
[data-bs-theme="dark"] .konsulta-sidebar-link.active .nav-link-icon {
  color: #b9cad6;
  background: transparent;
  border-color: transparent;
}

[data-bs-theme="dark"] .konsulta-sidebar-link.active::before {
  background: #8ba2b3;
}

/* Unified monochrome theme: meaning is communicated by text and icons, not hue. */
:root,
[data-bs-theme="light"] {
  --phoenix-primary: #303438;
  --phoenix-primary-rgb: 48, 52, 56;
  --phoenix-secondary: #656b70;
  --phoenix-secondary-rgb: 101, 107, 112;
  --phoenix-success: #50555a;
  --phoenix-success-rgb: 80, 85, 90;
  --phoenix-info: #62686d;
  --phoenix-info-rgb: 98, 104, 109;
  --phoenix-warning: #73787c;
  --phoenix-warning-rgb: 115, 120, 124;
  --phoenix-danger: #3d4145;
  --phoenix-danger-rgb: 61, 65, 69;
  --phoenix-primary-text-emphasis: #222528;
  --phoenix-success-text-emphasis: #35393c;
  --phoenix-info-text-emphasis: #3e4347;
  --phoenix-warning-text-emphasis: #474b4f;
  --phoenix-danger-text-emphasis: #292c2f;
  --phoenix-primary-bg-subtle: #eceeef;
  --phoenix-success-bg-subtle: #eff0f1;
  --phoenix-info-bg-subtle: #f1f2f3;
  --phoenix-warning-bg-subtle: #f3f4f4;
  --phoenix-danger-bg-subtle: #e8eaeb;
  --phoenix-primary-border-subtle: #b8bdc1;
  --phoenix-success-border-subtle: #c4c8cb;
  --phoenix-info-border-subtle: #cbd0d3;
  --phoenix-warning-border-subtle: #d1d4d6;
  --phoenix-danger-border-subtle: #aeb3b7;
  --phoenix-link-color: #34383c;
  --phoenix-link-color-rgb: 52, 56, 60;
  --phoenix-link-hover-color: #111315;
  --phoenix-link-hover-color-rgb: 17, 19, 21;
}

[data-bs-theme="dark"] {
  --phoenix-primary: #c2c6c9;
  --phoenix-primary-rgb: 194, 198, 201;
  --phoenix-secondary: #9ba1a5;
  --phoenix-secondary-rgb: 155, 161, 165;
  --phoenix-success: #aeb3b7;
  --phoenix-success-rgb: 174, 179, 183;
  --phoenix-info: #a2a8ac;
  --phoenix-info-rgb: 162, 168, 172;
  --phoenix-warning: #b4b8bb;
  --phoenix-warning-rgb: 180, 184, 187;
  --phoenix-danger: #d0d3d5;
  --phoenix-danger-rgb: 208, 211, 213;
  --phoenix-link-color: #c2c6c9;
  --phoenix-link-color-rgb: 194, 198, 201;
  --phoenix-link-hover-color: #f0f1f2;
}

.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger,
.btn-dark {
  --phoenix-btn-color: #fff;
  --phoenix-btn-bg: #303438;
  --phoenix-btn-border-color: #303438;
  --phoenix-btn-hover-color: #fff;
  --phoenix-btn-hover-bg: #1f2225;
  --phoenix-btn-hover-border-color: #1f2225;
  --phoenix-btn-active-color: #fff;
  --phoenix-btn-active-bg: #151719;
  --phoenix-btn-active-border-color: #151719;
  --phoenix-btn-disabled-color: #fff;
  --phoenix-btn-disabled-bg: #777d82;
  --phoenix-btn-disabled-border-color: #777d82;
}

.btn-outline-primary,
.btn-outline-success,
.btn-outline-info,
.btn-outline-warning,
.btn-outline-danger {
  --phoenix-btn-color: #3d4246;
  --phoenix-btn-border-color: #777d82;
  --phoenix-btn-hover-color: #fff;
  --phoenix-btn-hover-bg: #3d4246;
  --phoenix-btn-hover-border-color: #3d4246;
  --phoenix-btn-active-color: #fff;
  --phoenix-btn-active-bg: #292d30;
  --phoenix-btn-active-border-color: #292d30;
}

.bg-primary,
.bg-success,
.bg-info,
.bg-warning,
.bg-danger { background-color: #50555a !important; }

.text-primary,
.text-success,
.text-info,
.text-warning,
.text-danger { color: #3d4246 !important; }

.border-primary,
.border-success,
.border-info,
.border-warning,
.border-danger { border-color: #9ba1a5 !important; }

.form-check-input:checked,
.progress-bar,
.page-link.active,
.active > .page-link {
  background-color: #303438;
  border-color: #303438;
}

.form-control:focus,
.form-select:focus {
  border-color: #858b90;
  box-shadow: 0 0 0 .2rem rgba(48, 52, 56, .12);
}

.navbar-vertical,
.navbar-top { --phoenix-navbar-active-color: #303438; }

.navbar-vertical .nav-link.active,
.navbar-vertical .nav-link:hover,
.konsulta-sidebar-link:hover .nav-link-icon,
.konsulta-sidebar-link.active .nav-link-icon { color: #303438; }

.konsulta-sidebar-link.active::before { background: #303438; }

[data-bs-theme="dark"] .text-primary,
[data-bs-theme="dark"] .text-success,
[data-bs-theme="dark"] .text-info,
[data-bs-theme="dark"] .text-warning,
[data-bs-theme="dark"] .text-danger { color: #c2c6c9 !important; }

[data-bs-theme="dark"] .konsulta-sidebar-link.active::before { background: #c2c6c9; }

/* Royal blue gradient application theme. */
:root,
[data-bs-theme="light"] {
  --phoenix-primary: #4169e1;
  --phoenix-primary-rgb: 65, 105, 225;
  --phoenix-secondary: #5d74b8;
  --phoenix-secondary-rgb: 93, 116, 184;
  --phoenix-success: #315ac7;
  --phoenix-success-rgb: 49, 90, 199;
  --phoenix-info: #557ee8;
  --phoenix-info-rgb: 85, 126, 232;
  --phoenix-warning: #6d83c4;
  --phoenix-warning-rgb: 109, 131, 196;
  --phoenix-danger: #294aa8;
  --phoenix-danger-rgb: 41, 74, 168;
  --phoenix-primary-text-emphasis: #1d378c;
  --phoenix-primary-bg-subtle: #edf2ff;
  --phoenix-primary-border-subtle: #b9c9f8;
  --phoenix-link-color: #315ac7;
  --phoenix-link-color-rgb: 49, 90, 199;
  --phoenix-link-hover-color: #1d378c;
  --phoenix-link-hover-color-rgb: 29, 55, 140;
}

body {
  background-image: linear-gradient(145deg, rgba(237, 242, 255, .72) 0%, rgba(255, 255, 255, 0) 34%);
  background-attachment: fixed;
}

.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger,
.btn-dark {
  --phoenix-btn-bg: #4169e1;
  --phoenix-btn-border-color: #4169e1;
  --phoenix-btn-hover-bg: #294fbd;
  --phoenix-btn-hover-border-color: #294fbd;
  --phoenix-btn-active-bg: #1d3d9f;
  --phoenix-btn-active-border-color: #1d3d9f;
  --phoenix-btn-disabled-bg: #8da5eb;
  --phoenix-btn-disabled-border-color: #8da5eb;
  background-image: linear-gradient(135deg, #557ee8 0%, #315ac7 52%, #1d3d9f 100%);
  box-shadow: 0 .2rem .5rem rgba(41, 79, 189, .18);
}

.btn-primary:hover,
.btn-success:hover,
.btn-info:hover,
.btn-warning:hover,
.btn-danger:hover,
.btn-dark:hover {
  background-image: linear-gradient(135deg, #4169e1 0%, #294fbd 55%, #183486 100%);
}

.btn-outline-primary,
.btn-outline-success,
.btn-outline-info,
.btn-outline-warning,
.btn-outline-danger {
  --phoenix-btn-color: #315ac7;
  --phoenix-btn-border-color: #6f8fe7;
  --phoenix-btn-hover-color: #fff;
  --phoenix-btn-hover-bg: #315ac7;
  --phoenix-btn-hover-border-color: #315ac7;
  --phoenix-btn-active-bg: #1d3d9f;
  --phoenix-btn-active-border-color: #1d3d9f;
}

.bg-primary,
.bg-success,
.bg-info,
.bg-warning,
.bg-danger {
  background-color: #315ac7 !important;
  background-image: linear-gradient(135deg, #557ee8, #1d3d9f) !important;
}

.text-primary,
.text-success,
.text-info,
.text-warning,
.text-danger { color: #315ac7 !important; }

.border-primary,
.border-success,
.border-info,
.border-warning,
.border-danger { border-color: #8da5eb !important; }

.navbar-top {
  border-bottom-color: #c6d2f4;
  background-image: linear-gradient(90deg, rgba(237, 242, 255, .96), rgba(255, 255, 255, .98) 48%, rgba(229, 236, 255, .96));
}

.navbar-vertical {
  --phoenix-navbar-active-color: #315ac7;
  background-image: linear-gradient(180deg, #f8faff 0%, #eef3ff 100%);
}

.navbar-vertical .nav-link.active,
.navbar-vertical .nav-link:hover,
.konsulta-sidebar-link:hover .nav-link-icon,
.konsulta-sidebar-link.active .nav-link-icon { color: #315ac7; }

.konsulta-sidebar-link.active {
  background: linear-gradient(90deg, rgba(65, 105, 225, .14), rgba(65, 105, 225, .025));
  border-radius: .5rem;
}

.konsulta-sidebar-link.active::before {
  width: 3px;
  background: linear-gradient(180deg, #6f94f2, #1d3d9f);
}

.card-header,
.modal-header,
.offcanvas-header {
  background-image: linear-gradient(105deg, rgba(237, 242, 255, .92), rgba(255, 255, 255, .45));
  border-color: #d8e1f8;
}

.table thead th {
  background-color: #edf2ff;
  color: #213a7a;
  border-color: #d8e1f8;
}

.form-check-input:checked,
.progress-bar,
.page-link.active,
.active > .page-link {
  background-color: #315ac7;
  border-color: #315ac7;
}

.progress-bar { background-image: linear-gradient(90deg, #557ee8, #1d3d9f); }

.form-control:focus,
.form-select:focus {
  border-color: #6f8fe7;
  box-shadow: 0 0 0 .2rem rgba(65, 105, 225, .15);
}

[data-bs-theme="dark"] {
  --phoenix-primary: #82a2ff;
  --phoenix-primary-rgb: 130, 162, 255;
  --phoenix-link-color: #9ab5ff;
  --phoenix-link-hover-color: #c7d5ff;
}