:root,
:root[data-theme-colors],
[data-bs-theme=light],
[data-bs-theme=light][data-theme-colors] {
    --pe-primary: #0f8bbd;
    --pe-primary-rgb: 15, 139, 189;
    --pe-primary-text-emphasis: #0c6a90;
    --pe-primary-bg-subtle: rgba(15, 139, 189, 0.12);
    --pe-primary-border-subtle: #b3d7e8;
    --pe-secondary: #0f4c81;
    --pe-secondary-rgb: 15, 76, 129;
    --pe-secondary-text-emphasis: #0c3d67;
    --pe-secondary-bg-subtle: rgba(15, 76, 129, 0.12);
    --pe-secondary-border-subtle: #b8c9dc;
    --pe-success: #16a34a;
    --pe-success-rgb: 22, 163, 74;
    --pe-success-text-emphasis: #15803d;
    --pe-success-bg-subtle: rgba(22, 163, 74, 0.14);
    --pe-success-border-subtle: #bbf7d0;
    --pe-info: #0f4c81;
    --pe-info-rgb: 15, 76, 129;
    --pe-info-text-emphasis: #0c3d67;
    --pe-info-bg-subtle: rgba(15, 76, 129, 0.12);
    --pe-info-border-subtle: #b8c9dc;
    --pe-warning: #f59e0b;
    --pe-warning-rgb: 245, 158, 11;
    --pe-warning-text-emphasis: #d97706;
    --pe-warning-bg-subtle: rgba(245, 158, 11, 0.16);
    --pe-warning-border-subtle: #fde68a;
    --pe-danger: #dc2626;
    --pe-danger-rgb: 220, 38, 38;
    --pe-danger-text-emphasis: #b91c1c;
    --pe-danger-bg-subtle: rgba(220, 38, 38, 0.14);
    --pe-danger-border-subtle: #fecaca;
    --pe-body-color: #172b4d;
    --pe-body-color-rgb: 23, 43, 77;
    --pe-body-bg: #f5f9fc;
    --pe-body-bg-rgb: 245, 249, 252;
    --pe-heading-color: #172b4d;
    --pe-secondary-color: #64748b;
    --pe-secondary-color-rgb: 100, 116, 139;
    --pe-link-color: #0f8bbd;
    --pe-link-color-rgb: 15, 139, 189;
    --pe-link-hover-color: #0c6a90;
    --pe-link-hover-color-rgb: 12, 106, 144;
    --pe-form-valid-color: #16a34a;
    --pe-form-valid-border-color: #16a34a;
    --pe-form-invalid-color: #dc2626;
    --pe-form-invalid-border-color: #dc2626;
}

:root[data-bs-theme=dark],
:root[data-bs-theme=dark][data-theme-colors],
[data-bs-theme=dark],
[data-bs-theme=dark][data-theme-colors] {
    --pe-primary: #3db4e0;
    --pe-primary-rgb: 61, 180, 224;
    --pe-primary-text-emphasis: #7ec8e6;
    --pe-primary-bg-subtle: rgba(61, 180, 224, 0.16);
    --pe-primary-border-subtle: #1f5f7d;
    --pe-secondary: #7eb0d8;
    --pe-secondary-rgb: 126, 176, 216;
    --pe-secondary-text-emphasis: #8fb0d0;
    --pe-secondary-bg-subtle: rgba(15, 76, 129, 0.35);
    --pe-secondary-border-subtle: #1d4f78;
    --pe-success: #4ade80;
    --pe-success-rgb: 74, 222, 128;
    --pe-success-text-emphasis: #86efac;
    --pe-success-bg-subtle: #14532d;
    --pe-success-border-subtle: #166534;
    --pe-info: #7eb0d8;
    --pe-info-rgb: 126, 176, 216;
    --pe-info-text-emphasis: #8fb0d0;
    --pe-info-bg-subtle: #16344f;
    --pe-info-border-subtle: #1d4f78;
    --pe-warning: #fbbf24;
    --pe-warning-rgb: 251, 191, 36;
    --pe-warning-text-emphasis: #fcd34d;
    --pe-warning-bg-subtle: #4a3510;
    --pe-warning-border-subtle: #92400e;
    --pe-danger: #f87171;
    --pe-danger-rgb: 248, 113, 113;
    --pe-danger-text-emphasis: #fca5a5;
    --pe-danger-bg-subtle: #4a1616;
    --pe-danger-border-subtle: #7f1d1d;
    --pe-body-color: #e8eef4;
    --pe-body-color-rgb: 232, 238, 244;
    --pe-body-bg: #0a1628;
    --pe-body-bg-rgb: 10, 22, 40;
    --pe-heading-color: #f5f9fc;
    --pe-secondary-color: #94a3b8;
    --pe-secondary-color-rgb: 148, 163, 184;
    --pe-secondary-bg: #12263a;
    --pe-secondary-bg-rgb: 18, 38, 58;
    --pe-tertiary-bg: #16344f;
    --pe-tertiary-bg-rgb: 22, 52, 79;
    --pe-border-color: #1e3a54;
    --pe-link-color: #7ec8e6;
    --pe-link-hover-color: #b3d7e8;
    --pe-link-color-rgb: 126, 200, 230;
    --pe-link-hover-color-rgb: 179, 215, 232;
    --pe-form-valid-color: #86efac;
    --pe-form-valid-border-color: #4ade80;
    --pe-form-invalid-color: #fca5a5;
    --pe-form-invalid-border-color: #f87171;
    --pe-light: #16344f;
    --pe-light-rgb: 22, 52, 79;
    --pe-box-shadow: rgba(10, 22, 40, 0.55) 0 5px 8px;
    --pe-app-header-bg: #12263a;
}

[data-bs-theme=dark] {
    --pe-light: #16344f !important;
    --pe-light-rgb: 22, 52, 79 !important;
}

.btn-primary:first-child:active,
.btn-primary:active {
    box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--pe-primary-rgb), 0.3);
}

[data-layout=horizontal] .header-wrapper {
    background-color: #0f4c81;
}

[data-layout=horizontal] .app-header {
    background-color: #0f4c81;
    border-color: rgba(var(--pe-white-rgb), 0.12);
}

[data-layout=horizontal] .app-header .header-menu-btn,
[data-layout=horizontal] .app-header .horizontal-toggle,
[data-layout=horizontal] .app-header .theme-toggle {
    color: rgba(255, 255, 255, 0.86) !important;
}

[data-layout=horizontal] .app-header .header-menu-btn:hover,
[data-layout=horizontal] .app-header .header-menu-btn:active,
[data-layout=horizontal] .app-header .header-menu-btn:focus-visible,
[data-layout=horizontal] .app-header .horizontal-toggle:hover,
[data-layout=horizontal] .app-header .theme-toggle:hover {
    color: #fff !important;
    background-color: rgba(255, 255, 255, 0.12);
}

[data-layout=horizontal] .app-header .theme-toggle svg .sun,
[data-layout=horizontal] .app-header .theme-toggle svg .moon {
    fill: rgba(255, 255, 255, 0.86);
}

[data-layout=horizontal] .app-header .theme-toggle svg .sun-beams {
    stroke: rgba(255, 255, 255, 0.86);
}

[data-layout=horizontal] .app-header .user-name {
    color: #fff;
}

[data-layout=horizontal] .app-header .text-end > .text-muted {
    color: rgba(255, 255, 255, 0.72) !important;
}

[data-layout=horizontal] .app-header .story-ring {
    background: var(--pe-primary);
}

[data-layout=vertical] .app-header,
[data-bs-theme=dark][data-layout=vertical] .app-header {
    /* background-color: transparent; */
    /* border: 0; */
    /* box-shadow: none; */
}

[data-bs-theme=dark][data-layout=vertical] .app-header .header-menu-btn,
[data-bs-theme=dark][data-layout=vertical] .app-header .vertical-toggle,
[data-bs-theme=dark][data-layout=vertical] .app-header .theme-toggle {
    color: rgba(255, 255, 255, 0.86) !important;
}

[data-bs-theme=dark][data-layout=vertical] .app-header .header-menu-btn:hover,
[data-bs-theme=dark][data-layout=vertical] .app-header .theme-toggle:hover,
[data-bs-theme=dark][data-layout=vertical] .app-header .vertical-toggle:hover {
    color: #fff !important;
    background-color: rgba(255, 255, 255, 0.12);
}

[data-bs-theme=dark][data-layout=vertical] .app-header .theme-toggle svg .sun,
[data-bs-theme=dark][data-layout=vertical] .app-header .theme-toggle svg .moon {
    fill: rgba(255, 255, 255, 0.86);
}

[data-bs-theme=dark][data-layout=vertical] .app-header .theme-toggle svg .sun-beams {
    stroke: rgba(255, 255, 255, 0.86);
}

[data-bs-theme=dark][data-layout=vertical] .app-header .user-name {
    color: #fff;
}

[data-bs-theme=dark][data-layout=vertical] .app-header .text-end > .text-muted {
    color: rgba(255, 255, 255, 0.72) !important;
}

[data-bs-theme=dark][data-layout=vertical] .app-header .story-ring {
    background: var(--pe-primary);
}

:root[data-layout=vertical],
:root[data-layout=vertical][data-sidebar-color],
[data-layout=vertical][data-bs-theme=light][data-sidebar-color] {
    --pe-app-sidebar-bg: #0f4c81;
    --pe-app-sidebar-menu-item-color: rgba(255, 255, 255, 0.86);
    --pe-app-sidebar-menu-item-color-hover: #fff;
    --pe-app-sidebar-menu-item-color-active: #fff;
    --pe-app-sidebar-caption-color: rgba(255, 255, 255, 0.5);
    --pe-sidebar-text: #fff;
}

[data-layout=vertical] .pe-app-sidebar .pe-app-sidebar-logo h3,
[data-layout=vertical][data-sidebar-color=light] .pe-app-sidebar .pe-app-sidebar-logo h3 {
    color: #fff !important;
}

.portal-sidebar-brand__name {
    display: block;
    max-width: 10.5rem;
    color: rgba(255, 255, 255, 0.62);
    font-size: 0.7rem;
    line-height: 1.25;
    white-space: normal;
}

.portal-nav-badge {
    font-size: 0.7rem;
    font-weight: 600;
}

.portal-sidebar-promo {
    position: relative;
    margin: 1rem 0.85rem 1.25rem;
    overflow: hidden;
    border-radius: 0.75rem;
}

.portal-sidebar-promo img {
    display: block;
    width: 100%;
    height: 8.5rem;
    object-fit: cover;
}

.portal-sidebar-promo p {
    position: absolute;
    inset: auto 0 0;
    margin: 0;
    padding: 0.75rem 0.85rem;
    color: #fff;
    font-size: 0.75rem;
    line-height: 1.35;
    background-color: rgba(15, 76, 129, 0.86);
}

.portal-header-search {
    align-items: center;
    max-width: 36rem;
    min-height: 2.5rem;
    padding: 0.35rem 0.85rem;
    border: 1px solid var(--pe-border-color);
    border-radius: 2rem;
    background-color: var(--pe-secondary-bg);
    color: var(--pe-secondary-color);
    text-align: left;
}

.portal-header-search i {
    margin-right: 0.5rem;
}

.portal-header-search span {
    flex-grow: 1;
}

.portal-header-search kbd {
    margin-left: 0.5rem;
    padding: 0.1rem 0.4rem;
    border: 1px solid var(--pe-border-color);
    background-color: var(--pe-body-bg);
    color: var(--pe-secondary-color);
    font-size: 0.7rem;
}

[data-layout=vertical] .pe-app-sidebar .pe-app-sidebar-menu .pe-menu-title,
[data-layout=vertical][data-sidebar-color=light] .pe-app-sidebar .pe-app-sidebar-menu .pe-menu-title {
    color: rgba(255, 255, 255, 0.5);
}

[data-layout=vertical] .pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link,
[data-layout=vertical][data-sidebar-color=light] .pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link {
    color: rgba(255, 255, 255, 0.86);
}

[data-layout=vertical] .pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link:hover,
[data-layout=vertical] .pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link.active,
[data-layout=vertical][data-sidebar-color=light] .pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link:hover,
[data-layout=vertical][data-sidebar-color=light] .pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link.active {
    color: #fff !important;
    background-color: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.1);
}

[data-layout=vertical] .pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link::after,
[data-layout=vertical][data-sidebar-color=light] .pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link::after {
    background: radial-gradient(circle, rgba(255, 255, 255, 0.28) 0%, rgba(255, 255, 255, 0.08) 70%);
}

[data-layout=vertical] .pe-app-sidebar .pe-app-sidebar-menu .pe-slide-menu .pe-nav-link:hover,
[data-layout=vertical][data-sidebar-color=light] .pe-app-sidebar .pe-app-sidebar-menu .pe-slide-menu .pe-nav-link:hover {
    color: #fff !important;
    background-color: transparent;
}

[data-layout=vertical] .pe-app-sidebar .pe-app-sidebar-menu .pe-slide-menu .pe-nav-link.active,
[data-layout=vertical][data-sidebar-color=light] .pe-app-sidebar .pe-app-sidebar-menu .pe-slide-menu .pe-nav-link.active {
    color: var(--pe-primary) !important;
    background-color: transparent;
}

[data-layout=vertical][data-sidebar-color=light] .pe-app-sidebar .pe-app-sidebar-menu .pe-slide-menu::after {
    background-color: rgba(255, 255, 255, 0.28) !important;
}

[data-layout=vertical] .pe-app-sidebar .pe-app-sidebar-menu .pe-slide-menu .pe-nav-link::before,
[data-layout=vertical][data-sidebar-color=light] .pe-app-sidebar .pe-app-sidebar-menu .pe-slide-menu .pe-nav-link::before {
    background-color: var(--pe-primary) !important;
}

.auth-bg {
    background: radial-gradient(circle at 30% 30%, #f5f9fc, #d6eaf5, #e8f4fc);
}

[data-bs-theme=dark] .auth-bg {
    background: radial-gradient(circle at 30% 30%, #16344f, #0a1628, #0c3d67);
}

[data-bs-theme=dark] .main-wrapper.bg-white,
[data-bs-theme=dark] .login-section {
    background-color: var(--pe-secondary-bg) !important;
    color: var(--pe-body-color);
}

[data-bs-theme=dark] .btn-light {
    --pe-btn-bg: #16344f;
    --pe-btn-hover-bg: #1e3a54;
    --pe-btn-active-bg: #1e3a54;
    --pe-btn-hover-border-color: #1e3a54;
}

[data-bs-theme=dark] .select2-container .select2-selection--single,
[data-bs-theme=dark] .select2-container .select2-selection--multiple,
[data-bs-theme=dark] .select2-dropdown {
    background-color: var(--pe-secondary-bg);
    border-color: var(--pe-border-color);
    color: var(--pe-body-color);
}

.container,
.container-fluid {
    --pe-gutter-x: 0;
    padding-left: 0;
    padding-right: 0;
}

.select2-container {
    width: 100% !important;
}

.select2-container .select2-selection--single,
.select2-container .select2-selection--multiple {
    min-height: calc(1.5em + 0.75rem + 2px);
}

select.is-invalid + .select2 .select2-selection {
    border-color: var(--pe-form-invalid-border-color, #dc3545);
}

.modal .select2-container,
.select2-container--open {
    z-index: 1060;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before,
table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before,
table.dataTable.dtr-column.collapsed > tbody > tr > td.control:before,
table.dataTable.dtr-column.collapsed > tbody > tr > th.control:before,
table.dataTable.dtr-column.collapsed > tbody > tr > td.dtr-control:before,
table.dataTable.dtr-column.collapsed > tbody > tr > th.dtr-control:before {
    background-color: var(--pe-primary);
    border-color: var(--pe-primary);
    box-shadow: none;
    line-height: .9em;
}

table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td.dtr-control:before,
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th.dtr-control:before,
table.dataTable.dtr-column.collapsed > tbody > tr.parent > td.control:before,
table.dataTable.dtr-column.collapsed > tbody > tr.parent > th.control:before,
table.dataTable.dtr-column.collapsed > tbody > tr.parent > td.dtr-control:before,
table.dataTable.dtr-column.collapsed > tbody > tr.parent > th.dtr-control:before {
    content: "-";
}

.dataTables_wrapper {
    overflow: visible;
}

.dataTables_wrapper .dt-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.dataTables_wrapper .dt-buttons .btn,
.dataTables_wrapper .dt-buttons .dt-button {
    --pe-btn-padding-y: 0.25rem;
    --pe-btn-padding-x: 0.5rem;
    --pe-btn-font-size: 0.8203125rem;
    padding: var(--pe-btn-padding-y) var(--pe-btn-padding-x);
    font-size: var(--pe-btn-font-size);
    line-height: 1.5;
}

.dataTables_wrapper .dataTables_filter input {
    min-width: 18rem;
}

table.dataTable th.control,
table.dataTable td.control,
table.dataTable th.dtr-control,
table.dataTable td.dtr-control {
    width: 2.5rem !important;
    min-width: 2.5rem !important;
    max-width: 2.5rem !important;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

table.dataTable > tbody > tr.child span.dtr-title {
    min-width: 7rem;
    font-weight: 600;
    color: var(--pe-secondary-color);
}

.portal-dashboard__welcome {
    position: relative;
    overflow: hidden;
    background-color: var(--pe-secondary-bg);
    border-color: var(--pe-border-color);
}

/* .portal-dashboard__welcome::before {
    content: "";
    display: block;
    height: 4px;
    background-color: var(--pe-primary);
} */

.portal-dashboard__welcome[data-tone="success"]::before {
    background-color: var(--pe-success);
}

.portal-dashboard__welcome[data-tone="warning"]::before {
    background-color: var(--pe-warning);
}

.portal-dashboard__welcome[data-tone="info"]::before {
    background-color: var(--pe-info);
}

.portal-dashboard__welcome[data-tone="danger"]::before {
    background-color: var(--pe-danger);
}

.portal-dashboard__welcome[data-tone="secondary"]::before {
    background-color: var(--pe-secondary);
}

.portal-dashboard__welcome .btn-primary,
.portal-dashboard__welcome .btn-success {
    --pe-btn-padding-y: 0.6rem;
    --pe-btn-padding-x: 1.15rem;
}

.portal-dashboard__welcome .progress {
    background-color: rgba(var(--pe-primary-rgb), 0.16);
}

.portal-dashboard__welcome .progress-bar {
    background-color: var(--pe-primary);
}

.portal-dashboard__welcome[data-tone="success"] .progress {
    background-color: rgba(var(--pe-success-rgb), 0.16);
}

.portal-dashboard__welcome[data-tone="success"] .progress-bar {
    background-color: var(--pe-success);
}

.portal-dashboard__stat {
    position: relative;
    overflow: hidden;
}

.portal-dashboard__stat::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background-color: var(--pe-primary);
}

.portal-dashboard__stat[data-tone="success"]::before {
    background-color: var(--pe-success);
}

.portal-dashboard__stat[data-tone="warning"]::before {
    background-color: var(--pe-warning);
}

.portal-dashboard__stat[data-tone="info"]::before {
    background-color: var(--pe-info);
}

.portal-dashboard__stat[data-tone="danger"]::before {
    background-color: var(--pe-danger);
}

.portal-dashboard__stat[data-tone="secondary"]::before {
    background-color: var(--pe-secondary);
}

.portal-dashboard__stat .card-body {
    padding: 1.1rem 1.15rem;
}

.portal-dashboard__stat .portal-stat-card__value {
    font-size: 1.25inrem;
    line-height: 1.15;
    letter-spacing: -0.03em;
    overflow-wrap: anywhere;
}

[data-layout=vertical] .portal-dashboard__stat {
    --portal-stat-tint: var(--pe-primary);
    border: 0;
    box-shadow: none;
    border-radius: 1.25rem;
    background-color: color-mix(in srgb, var(--portal-stat-tint) 14%, var(--pe-secondary-bg));
    background-image: linear-gradient(
        145deg,
        color-mix(in srgb, var(--portal-stat-tint) 6%, var(--pe-secondary-bg)) 0%,
        color-mix(in srgb, var(--portal-stat-tint) 20%, var(--pe-secondary-bg)) 100%
    );
}

[data-layout=vertical] .portal-dashboard__stat::before {
    display: none;
}

[data-layout=vertical] .portal-dashboard__stat[data-tone="success"] {
    --portal-stat-tint: var(--pe-success);
}

[data-layout=vertical] .portal-dashboard__stat[data-tone="warning"] {
    --portal-stat-tint: var(--pe-warning);
}

[data-layout=vertical] .portal-dashboard__stat[data-tone="info"] {
    --portal-stat-tint: var(--pe-info);
}

[data-layout=vertical] .portal-dashboard__stat[data-tone="danger"] {
    --portal-stat-tint: var(--pe-danger);
}

[data-layout=vertical] .portal-dashboard__stat[data-tone="secondary"] {
    --portal-stat-tint: var(--pe-secondary);
}

[data-layout=vertical] .portal-dashboard__stat .card-body {
    padding: 1rem 1.15rem;
    background-color: transparent;
}

[data-layout=vertical] .portal-dashboard__stat .portal-stat-card__value {
    color: var(--pe-heading-color);
    font-size: 1.75rem;
}

[data-layout=vertical] .portal-dashboard__stat .avatar-item {
    width: 2.5rem;
    height: 2.5rem;
    background-color: color-mix(in srgb, var(--portal-stat-tint) 24%, var(--pe-secondary-bg));
    box-shadow: none;
}

.portal-dashboard__panel > .card-header {
    background-color: transparent;
    border-bottom: 0;
}

[data-layout=vertical] .portal-dashboard__panel {
    border: 0;
    border-radius: 1.25rem;
    box-shadow: 0 0.15rem 0.65rem rgba(var(--pe-body-color-rgb), 0.05);
}

.portal-dashboard__recent > .card-body {
    padding-top: 0.15rem;
    padding-bottom: 0.5rem;
}

.portal-dashboard__recent .table {
    table-layout: fixed;
}

.portal-dashboard__recent .table th:nth-child(1),
.portal-dashboard__recent .table td:nth-child(1) {
    width: 28%;
}

.portal-dashboard__recent .table th:nth-child(2),
.portal-dashboard__recent .table td:nth-child(2),
.portal-dashboard__recent .table th:nth-child(3),
.portal-dashboard__recent .table td:nth-child(3) {
    width: 18%;
}

.portal-dashboard__recent .table th:nth-child(4),
.portal-dashboard__recent .table td:nth-child(4) {
    width: 20%;
}

.portal-dashboard__recent .table th:nth-child(5),
.portal-dashboard__recent .table td:nth-child(5) {
    width: 16%;
}

.portal-dashboard__recent .table td,
.portal-dashboard__recent .table th {
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
    vertical-align: middle;
}

.portal-dashboard__fact {
    padding: 0.75rem 0.9rem;
    border: 1px solid var(--pe-border-color);
    border-radius: 0.65rem;
    background-color: var(--pe-secondary-bg);
}

.portal-dashboard__fact i {
    width: 2rem;
    height: 2rem;
    border-radius: 0.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--pe-primary);
    background-color: var(--pe-primary-bg-subtle);
}

.portal-dashboard .timeline2.icon-timeline ul::before {
    border-color: var(--pe-primary-border-subtle);
}

.portal-dashboard .timeline2.icon-timeline ul .box[data-state="current"] {
    border-radius: 0.75rem;
    padding-top: 0.65rem;
    padding-bottom: 0.35rem;
    padding-right: 0.75rem;
    box-shadow: inset 3px 0 0 var(--pe-primary);
}

.portal-dashboard .timeline2.icon-timeline ul .box[data-state="current"] > span {
    background-color: var(--pe-primary);
    color: var(--pe-white);
    border-color: var(--pe-primary-border-subtle);
}

.portal-dashboard .timeline2.icon-timeline ul .box[data-state="done"] > span {
    background-color: var(--pe-success);
    color: var(--pe-white);
    border-color: var(--pe-success-bg-subtle);
}

.portal-dashboard .timeline2.icon-timeline ul .box[data-state="pending"] > span {
    background-color: var(--pe-light);
    color: var(--pe-gray-500);
    border-color: var(--pe-border-color);
}

.portal-dashboard .timeline2.icon-timeline ul .box[data-state="pending"] .title,
.portal-dashboard .timeline2.icon-timeline ul .box[data-state="pending"] .info {
    color: var(--pe-secondary-color);
}

.portal-dashboard .timeline2.icon-timeline ul .box[data-state="current"] .title {
    color: var(--pe-heading-color);
    font-weight: 600;
}

.portal-dashboard__swatch {
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 50%;
    flex-shrink: 0;
}

.portal-dashboard__action {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.55rem;
    padding: 0.7rem 0.85rem;
    border-radius: 0.75rem;
    color: inherit;
    text-decoration: none;
    background-color: rgba(var(--pe-primary-rgb), 0.14);
}

.portal-dashboard__action:last-child {
    margin-bottom: 0;
}

.portal-dashboard__action[data-tone="success"] {
    background-color: rgba(var(--pe-success-rgb), 0.16);
}

.portal-dashboard__action[data-tone="warning"] {
    background-color: rgba(var(--pe-warning-rgb), 0.18);
}

.portal-dashboard__action[data-tone="info"] {
    background-color: rgba(var(--pe-info-rgb), 0.14);
}

.portal-dashboard__action[data-tone="secondary"] {
    background-color: rgba(var(--pe-secondary-rgb), 0.14);
}

.portal-dashboard__action:hover {
    color: inherit;
}

.portal-dashboard__action:hover .fw-medium {
    color: var(--pe-primary);
}

.portal-dashboard__panel .table > :not(caption) > * > * {
    background-color: transparent;
}

.portal-dashboard__panel .table thead th {
    padding-top: 0.35rem;
    padding-bottom: 0.65rem;
    color: var(--pe-secondary-color);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-bottom-color: var(--pe-border-color);
}

.portal-dashboard__legend {
    max-width: 16rem;
}

.portal-site {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background-color: var(--pe-body-bg);
}

.portal-site main {
    flex: 1 0 auto;
}

.portal-site .container {
    --pe-gutter-x: 1.5rem;
    --bs-gutter-x: 1.5rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

.portal-site__header {
    position: sticky;
    top: 0;
    z-index: 1030;
    background-color: #0f4c81;
    box-shadow: 0 8px 24px rgba(15, 76, 129, 0.18);
}

.portal-site__header .navbar {
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
}

.portal-site__brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    background-color: #fff;
    border-radius: 0.65rem;
}

.portal-site__header .navbar-brand,
.portal-site__header .nav-link {
    color: #fff;
}

.portal-site__header .nav-link {
    padding-block: 0.35rem;
    border-bottom: 2px solid transparent;
    color: rgba(255, 255, 255, 0.78);
}

.portal-site__header .nav-link.active,
.portal-site__header .nav-link:hover,
.portal-site__header .nav-link:focus {
    color: #fff;
    border-bottom-color: var(--pe-primary);
}

.portal-site .btn-outline-light {
    --pe-btn-color: #fff;
    --pe-btn-bg: transparent;
    --pe-btn-border-color: rgba(255, 255, 255, 0.82);
    --pe-btn-hover-color: #0f4c81;
    --pe-btn-hover-bg: #fff;
    --pe-btn-hover-border-color: #fff;
    --pe-btn-active-color: #0f4c81;
    --pe-btn-active-bg: #fff;
    --pe-btn-active-border-color: #fff;
    --pe-btn-disabled-color: rgba(255, 255, 255, 0.65);
    --pe-btn-disabled-bg: transparent;
    --pe-btn-disabled-border-color: rgba(255, 255, 255, 0.4);
    color: #fff;
}

.portal-site__kicker {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--pe-primary);
}

.portal-site__kicker--light {
    color: rgba(255, 255, 255, 0.72);
}

.portal-site__heading {
    letter-spacing: -0.03em;
}

.portal-site__hero,
.portal-site__banner {
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    color: #fff;
}

.portal-site__hero {
    min-height: 32rem;
    padding: 5.5rem 0 5rem;
}

.portal-site__hero--with-figures {
    min-height: 36rem;
    padding-bottom: 8.5rem;
}

.portal-site__hero-image,
.portal-site__banner-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.portal-site__hero-wash {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        105deg,
        rgba(15, 76, 129, 0.96) 0%,
        rgba(15, 76, 129, 0.82) 46%,
        rgba(15, 139, 189, 0.28) 100%
    );
}

.portal-site__hero-title {
    font-size: clamp(2rem, 4.4vw, 3.35rem);
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1.12;
    color: #fff;
}

.portal-site__hero-lead {
    font-size: 1.125rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.82);
}

.portal-site__chip {
    background-color: rgba(255, 255, 255, 0.16);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.28);
    font-weight: 600;
}

.portal-site__banner {
    min-height: 16rem;
}

.portal-site__banner-wash {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        105deg,
        rgba(15, 76, 129, 0.94) 0%,
        rgba(15, 76, 129, 0.78) 55%,
        rgba(15, 139, 189, 0.4) 100%
    );
}

.portal-site__banner-title {
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    color: #fff;
}

.portal-site__banner-lead {
    margin-top: 0.85rem;
    color: rgba(255, 255, 255, 0.78);
}

.portal-site__figures {
    position: relative;
    z-index: 2;
    margin-top: -4.75rem;
    padding-bottom: 1rem;
}

.portal-site__section {
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
}

.portal-site__section--muted {
    background-color: #fff;
}

.portal-site__copy {
    white-space: pre-line;
    line-height: 1.7;
}

.portal-site__photo {
    overflow: hidden;
    border-radius: 1.5rem;
    min-height: 18rem;
    box-shadow: 0 18px 40px rgba(15, 76, 129, 0.12);
}

.portal-site__photo-image {
    width: 100%;
    height: 100%;
    min-height: 18rem;
    object-fit: cover;
}

.portal-site__panel,
.portal-site__programme,
.portal-site__stat,
.portal-site__step {
    border: 0;
    box-shadow: none;
    border-radius: 1.25rem;
}

.portal-site__stat {
    --portal-stat-tint: var(--pe-primary);
    background-color: color-mix(in srgb, var(--portal-stat-tint) 14%, var(--pe-secondary-bg));
    background-image: linear-gradient(
        145deg,
        color-mix(in srgb, var(--portal-stat-tint) 6%, #fff) 0%,
        color-mix(in srgb, var(--portal-stat-tint) 18%, #fff) 100%
    );
}

.portal-site__stat[data-tone="success"] {
    --portal-stat-tint: var(--pe-success);
}

.portal-site__stat[data-tone="warning"] {
    --portal-stat-tint: var(--pe-warning);
}

.portal-site__stat[data-tone="info"] {
    --portal-stat-tint: var(--pe-info);
}

.portal-site__stat .card-body {
    background-color: transparent;
}

.portal-site__stat .avatar-item {
    box-shadow: none;
    background-color: color-mix(in srgb, var(--portal-stat-tint) 22%, #fff);
}

.portal-site__programme,
.portal-site__step,
.portal-site__panel {
    background-color: #fff;
    box-shadow: 0 10px 28px rgba(15, 76, 129, 0.06);
}

.portal-site__programme {
    transition: transform 0.16s ease, box-shadow 0.16s ease;
}

.portal-site__programme:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 32px rgba(15, 76, 129, 0.12);
}

.portal-site__step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    background-color: color-mix(in srgb, var(--pe-primary) 14%, #fff);
    color: var(--pe-primary);
    font-weight: 700;
}

.portal-site__session {
    padding: 1.25rem 1.5rem;
    border-radius: 1.25rem;
    background-color: color-mix(in srgb, var(--pe-primary) 8%, #fff);
}

.portal-site__cta {
    padding: 2rem 2.15rem;
    border-radius: 1.5rem;
    background: linear-gradient(145deg, #0f4c81, #0f8bbd);
    color: #fff;
}

.portal-site__footer {
    background-color: #0c3d67;
    color: #fff;
}
