:root {
    --bg-pattern-img: url('../images/bg/light_pattern.png');
    --ct-bg-opacity: 1;
    --bg-btn-account-tab-trigger: rgba(var(--ct-dark-rgb), var(--ct-bg-opacity));
    --ct-color-heading: #2b2b2b;
    --ct-color-heading-active: #ffffff;
    --ct-bg-active: #0d6efd; /* Optional: highlight active tab background */
}

html[data-bs-theme="dark"] {
    --bg-pattern-img: url('../images/bg/dark_pattern.png');
    --bg-btn-account-tab-trigger: var(--ct-primary-bg-subtle);
}

.footer {
    background: var(--ct-topbar-bg);
    border-top: none;
}

html[data-layout=topnav] .topnav .nav-item .nav-link.active {
    color: var(--ct-menu-item-active-color);
}

.dt-bootstrap5 > div.row.mt-2.justify-content-between:first-of-type {
    display: none !important;
}

.pagination .page-link {
    border-radius: 30px !important;
    margin: 0 3px !important;
    border: none;
}

.dtr-details {
    width: 100% !important;
}

    .dtr-details li {
        text-align: start !important;
    }

[data-bs-toggle="collapse"]:not(.collapsed) {
    --ct-text-opacity: 1;
    color: rgba(var(--ct-primary-rgb), var(--ct-text-opacity)) !important;
}
/* Default state: arrow pointing down */
.dropdown-toggle::after {
    transition: transform 0.3s ease; /* Animate rotation */
    transform: rotate(0deg);
}

/* When dropdown is shown: rotate arrow to point up */
.dropdown-toggle.show::after {
    transform: rotate(-180deg);
}

label.error {
    display: none !important;
}

.sticky-header {
    top: calc(var(--ct-topbar-height) + 59.8047px);
    position: sticky;
    z-index: 1000;
}

@media (max-width: 991.98px) {
    .sticky-header {
        top: calc(var(--ct-topbar-height));
    }
}

.navbar-custom .lines {
    display: none;
}

body:has(.topnav) .navbar-custom .lines {
    display: block;
}

.bg-pattern {
    background: var(--bg-pattern-img) no-repeat;
    background-position: center;
    background-size: cover
}
/* Light theme: text colors */
html[data-bs-theme="light"] .account-tab-trigger h5 {
    color: #2b2b2b;
}

html[data-bs-theme="light"] .account-tab-trigger p {
    color: #6c757d;
}

html[data-bs-theme="light"] .account-tab-trigger.active {
    background-color: #0d6efd;
}

    html[data-bs-theme="light"] .account-tab-trigger.active h5,
    html[data-bs-theme="light"] .account-tab-trigger.active p,
    html[data-bs-theme="light"] .account-tab-trigger.active i {
        color: #ffffff;
    }
/* Hover background for non-active cards */
.account-tab-trigger:not(.active):hover {
    background-color: rgba(255, 255, 255, 0.05); /* Slight lightness in dark, barely visible in light */
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.2s ease;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* Light theme hover text/icon color override */
html[data-bs-theme="light"] .account-tab-trigger:not(.active):hover h5,
html[data-bs-theme="light"] .account-tab-trigger:not(.active):hover p,
html[data-bs-theme="light"] .account-tab-trigger:not(.active):hover i {
    color: #ffffff;
}

/* Dark theme hover text/icon color override */
html[data-bs-theme="dark"] .account-tab-trigger:not(.active):hover h5,
html[data-bs-theme="dark"] .account-tab-trigger:not(.active):hover p,
html[data-bs-theme="dark"] .account-tab-trigger:not(.active):hover i {
    color: #ffffff;
}

.account-tab-trigger:hover {
    background-color: var(--bg-btn-account-tab-trigger) !important;
    cursor: pointer;
}

.account-tab-trigger.active {
    background-color: var(--bg-btn-account-tab-trigger) !important;
}

.cs-min-vh {
    min-height: calc(100vh - var(--ct-topbar-height)) !important;
}


.divider:after,
.divider:before {
    content: "";
    flex: 1;
    height: 1px;
    background-color: var(--ct-border-color) !important;
}

/* Hide bullets from password rules list */
#password-rules {
    list-style-type: none;
    padding: 0;

}

    #password-rules li {
        font-size: 11px;
        padding-left: 0;
    }

/* Style for the progress bar */
.progress{
    border-radius: 0.25rem;
    margin-top: 0.5rem;
}
.cs-min-vh-100 {
    min-height: calc(100vh - var(--ct-topbar-height) - 59.8047px) !important;
}