/* ============================= */
/* ROOT VARIABLES (LIGHT MODE) */
/* ============================= */
:root {
    /* Basic Colors */
    --bs-black: #000000;
    --bs-white: #ffffff;

    /* Primary Colors */
    --bs-primary: #007bff;
    --bs-secondary: #6c757d;

    /* Status / Semantic Colors */
    --bs-warning: #F59E0B;
    --bs-success: #00d2c8;
    --bs-success-light: #00d2c81A;
    --bs-danger: #dc2626;
    --bs-info: #0bbcd6;

    /* Text Colors */
    --bs-text-primary: #374957;
    --bs-text-secondary: #5e6278;
    --bs-text-tooltip: #1a1a27;
    --bs-text-black-primary: #0B1220;
    --bs-text-black-secondary: #323639;

    /* Background Colors */
    --bs-bg-sidebar: #f6f8fb;
    --bs-bg-body: #fefefe;
    --bs-bg-light: #f6f8fb;
    --bs-bg-dark: #1e1e2f;
    --bs-bg-hover: #e6fbfa;
    --bs-bg-success-light: #e5fdf7;

    /* Border Colors */
    --bs-border-color: #dedede;
    --bs-border-light: #e0e0e0;
    --bs-border-medium: #cfd4da;
    --bs-border-dark: #3a3a4d;

    /* Shadow Colors */
    --bs-shadow-color: rgba(0, 0, 0, 0.08);
    /* --bs-shadow-light: rgba(0, 0, 0, 0.05); */
    --bs-shadow-light: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    --bs-shadow-medium: rgba(0, 0, 0, 0.1);
    --bs-shadow-dark: rgba(0, 0, 0, 0.15);

    /* Green Shades (سبز رنگ کے مختلف شیڈز) */
    --bs-green-color: #00d2c8;
    --bs-green-light-color: #c7f0ee;
    --bs-green-hover: #00c2b3;

    /* Blue Shades */
    --bs-blue-color: #007bff;
    --bs-blue-dark: #0e375f;
    --bs-blue-light: #f0f7ff;

    /* Gray Shades */
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;

    /* UI Specific Colors */
    --bs-tooltip-color: #1a1a27;
    --bs-placeholder-color: #6C757D;
    --bs-link-color: #2563eb;
    --bs-card-bg: #ffffff;
    --bs-modal-bg: #EBEDF3;
    --bs-sidebar-modal-bg: var(--bs-bg-sidebar);

    /* Rating Stars */
    --bs-star-default: #d1d5db;
    --bs-star-hover: #ff4d4d;
    --bs-star-active: #00c2b3;

    /* Notification/Toggle */
    --bs-notification-bg: #3b82f6;
    --bs-toggle-bg: #cbd5e1;
    --bs-discard-btn: #e3e8ef;
    --bs-invite-modal-bg-color: #ffffff;
    --bs-user-profile-card-bg-color: #1D4872;
    --bs-requirement-radio-btn-color: #D9D9D9;
}

/* ============================= */
/* DARK MODE VARIABLES */
/* ============================= */
html[data-theme="dark"] {
    --bs-black: #ffffff;
    --bs-white: #000000;
    /* --bs-bg-sidebar: #1e1e2f; */
    --bs-bg-sidebar: #072E55;
    --bs-bg-light: #2a2a3d;
    --bs-bg-body: #0E375F;
    --bs-text-primary: #f5f5f5;
    --bs-text-secondary: #c5c5c5;
    --bs-text-tooltip: #ffffff;
    --bs-text-black-primary: #f5f5f5;
    --bs-text-black-secondary: #c5c5c5;
    --bs-success: #00d2c8;
    --bs-success-light: #00d2c81A;
    /* --bs-border-color: #3a3a4d; */
    --bs-border-color: #3e5f7f;
    --bs-border-light: #3a3a4d;
    --bs-border-medium: #4a4a5d;
    --bs-card-bg: #2a2a3d;
    --bs-modal-bg: #2a2a3d;
    --bs-sidebar-modal-bg: #1e1e2f;
    --bs-bg-hover: #3a3a5d;
    --bs-blue-light: #1a2a3d;
    --bs-gray-100: #2a2a3d;
    --bs-gray-200: #3a3a4d;
    --bs-gray-300: #4a4a5d;
    --bs-discard-btn: #e3e8ef;
    --bs-invite-modal-bg-color: #0e3f6e;
    --bs-user-profile-card-bg-color: #1D4872;
}

/* ============================= */
/* GLOBAL STYLES */
/* ============================= */
html {
    background-color: var(--bs-bg-body);
}

body {
    /* font-family: 'Metropolis', sans-serif !important; */
    font-family: 'Metropolis' !important;
    line-height: 1.5;
    color: var(--bs-text-primary);
    background-color: var(--bs-bg-body);
}

/* RTL */
body[data-rtl="true"] {
    direction: rtl;
    text-align: right;
}

body[data-theme="dark"] body {
    background-color: var(--bs-blue-dark);
}

.text-success {
    color: var(--bs-success) !important;
}

.bg-success-primary {
    background-color: var(--bs-green-color) !important;
}

.fs-11 {
    font-size: 11px;
}

.back-to-home-text {
    color: var(--bs-black);
}

.header {
    border-bottom: none !important;
}

/* Header always avoids the fixed right sidebar — no !important so JS can override */
#kt_header {
    padding-right: 60px;
    /* transition: padding-right 0.3s cubic-bezier(0.4, 0, 0.2, 1); */
    transition: padding-right 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ============================= */
/* LAYOUT & SIDEBAR */
/* ============================= */
.layout-wrapper {
    flex: 1;
    display: flex;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    /* padding-right: 59px; */
    padding-left: 0;
    min-height: 0;
}

.layout-wrapper.sidebar-expanded {
    padding-right: 280px;
    padding-left: 0;
}

/* body[data-rtl="true"] .layout-wrapper.sidebar-expanded {
    padding-right: 380px;
} */

.main-content {
    flex: 1;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    /* min-height: calc(100vh - 70px); */
}

/* ============================= */
/* SIDEBAR */
/* ============================= */
#rightSidebar {
    background-color: var(--bs-white);
}

body[data-theme="dark"] #rightSidebar {
    background-color: var(--bs-blue-dark);
}


.right-sidebar {
    position: fixed;
    top: 0;
    right: 0;
    height: 100%;
    width: 60px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 20px;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-left: 1px solid var(--bs-border-color);
    cursor: pointer;
}

.right-sidebar.expanded {
    width: 350px;
    align-items: flex-start;
}

.sidebar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 7px;
    box-sizing: border-box;
}

.logo-container {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
    position: relative;
    top: -2px;
    margin-inline-start: -2px;
}

.logo-container:hover {
    transform: scale(1.05);
}

.logo-container svg {
    width: 28px;
    height: 28px;
}

body[data-theme="dark"] .logo-container svg {
    color: var(--bs-black);
}

.open-sidebar-logo {
    margin-top: -10px;
    padding-top: 10px;
}

.logo-text {
    font-weight: 600;
    font-size: 1.1rem;
    opacity: 0;
    white-space: nowrap;
    transition: opacity 0.3s ease;
    overflow: hidden;
    color: var(--bs-text-primary);
}

.cases-title {
    font-size: 17px;
    color: var(--bs-text-primary);
}

.right-sidebar.expanded .sidebarToggle {
    margin-top: 2px;
}

.right-sidebar.expanded .logo-text {
    opacity: 1;
}

.sidebar-content {
    width: 100%;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    overflow: hidden;
    height: 0;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.right-sidebar.expanded .sidebar-content {
    opacity: 1;
    visibility: visible;
    height: auto;
    overflow-y: auto;
    /* scrollbar-width: none; */

    background:
        linear-gradient(#dedede, #dedede) top center / calc(100% - 32px) 1px no-repeat,
        linear-gradient(#dedede, #dedede) bottom center / calc(100% - 32px) 1px no-repeat;
    scrollbar-color: #9ca3af transparent;
}

body[data-theme="dark"] .right-sidebar.expanded .sidebar-content {
    scrollbar-color: #fff transparent;
}

.sidebar-menu {
    width: 100%;
}

/* ============================= */
/* DROPDOWNS */
/* ============================= */
.dropdown-menu {
    border-radius: 12px !important;
    /* box-shadow: 0 4px 12px var(--bs-shadow-color) !important; */
    background-color: var(--bs-card-bg);
    border: 1px solid var(--bs-border-light);
}

body[data-theme="dark"] .dropdown-menu {
    background-color: var(--bs-bg-sidebar);
    /* box-shadow: rgba(0, 0, 0, 1.24) 0px 3px 8px; */
    border: 1px solid #E3E8EF33;
}

.dropdown-item {
    font-size: 0.875rem !important;
    padding: 0.5rem 1rem !important;
    transition: all 0.2s ease !important;
    color: var(--bs-text-primary);
}

.dropdown-item:hover {
    /* background-color: var(--bs-bg-light) !important; */
    background-color: var(--bs-success-light);
    transform: translateX(2px);
}

body[data-rtl="true"] .dropdown-item:hover {
    transform: translateX(-2px);
}

.dropdown-item i {
    font-size: 1rem !important;
    color: var(--bs-success) !important;
}

.dropdown-item .text-info {
    color: var(--bs-success) !important;
    font-weight: 600 !important;
}

.dropdown-toggle::after {
    display: none !important;
}

/* ============================= */
/* CUSTOM HOVER EFFECTS */
/* ============================= */
.dropdown-menu .dropdown-item,
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus,
.dropdown-menu .dropdown-item:active {
    transform: none !important;
    text-decoration: none !important;
}

.stable-items:hover {
    /* background-color: var(--bs-bg-hover) !important; */
    background-color: var(--bs-success-light) !important;
    color: var(--bs-blue-dark) !important;
}

.beta-items:hover {
    background-color: var(--bs-gray-600) !important;
    color: var(--bs-white) !important;
}

.beta-items:hover img {
    filter: brightness(0) invert(1);
}

body[data-theme="dark"] .beta-items img {
    filter: brightness(0) invert(1);
}

/* ============================= */
/* PATHWAY DROPDOWN */
/* ============================= */
.pathway-dropdown ul li a span {
    font-weight: 500;
    font-size: 16px;
    color: var(--bs-text-primary);
}

.pathway-dropdown ul li:hover {
    padding-left: 0px;
}

.pathway-dropdown-divider {
    height: 5px;
    border-top: 1px solid var(--bs-border-medium);
    margin-top: 5px;
}

.pathway-input {
    /* width: 190px; */
    width: 200px;
    height: 25px;
    flex: none;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 8px;
    background-color: var(--bs-gray-100);
    border: 1px solid var(--bs-border-light);
    outline: none;
    color: var(--bs-gray-700);
    transition: all 0.2s ease;
}

body[data-theme="dark"] .pathway-input {
    background-color: #F6F8FB40;
    color: var(--bs-black);
    border: 1px solid #FFFFFF33;
}

.pathway-input::placeholder {
    /* color: var(--bs-placeholder-color); */
    color: #0B122040;
    font-weight: 500;
    font-size: 14px;
}
body[data-theme="dark"] .pathway-input::placeholder {
    color: #71889f;
}

.pathway-input:focus {
    background-color: var(--bs-white);
    box-shadow: 0 0 0 2px var(--bs-success-light);
}

.pathway-dropdown button,
.pathway-dropdown button:hover {
    background-color: var(--bs-bg-sidebar);
    color: var(--bs-blue-dark);
    border: 1px solid var(--bs-bg-sidebar);
    font-size: 1rem;
}

body[data-theme="dark"] .pathway-dropdown button {
    background-color: transparent;
    color: var(--bs-black);
    border: 2px solid var(--bs-border-color) !important;
}

body[data-theme="dark"] .pathway-dropdown button:hover {
    background-color: transparent;
    color: var(--bs-black);
    border: 2px solid var(--bs-border-color) !important;
}

.always-consent-text {
    color: var(--bs-black);
    font-size: 14px;
    text-align: right;
    font-weight: 500;
}

.learn-more-text {
    color: var(--bs-black);
}

body[data-theme="dark"] .learn-more-text {
    color: var(--bs-black);
}

.menu-title {
    color: var(--bs-gray-600);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding-left: 10px;
    font-weight: 600;
}

body[data-rtl="true"] .menu-title {
    padding-left: 0;
    padding-right: 10px;
}

.menu-item {
    display: flex;
    align-items: center;
    padding: 8px 15px;
    color: var(--bs-black);
    text-decoration: none;
    /* border-radius: 8px; */
    transition: all 0.3s ease;
    /* position: relative;
    top: 5px; */
    white-space: nowrap;
}

.menu-sub-dropdown {
    background-color: var(--bs-white);
}

body[data-theme="dark"] .menu-sub-dropdown {
    background-color: var(--bs-bg-sidebar);
    color: var(--bs-black);
}

/* .menu-item:hover { */
/* .menu-item:not(:last-child):hover { */
.menu-item:hover {
    background-color: var(--bs-success-light) !important;
    color: var(--bs-black) !important;
}

.menu-item:first-child:hover {
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}
.menu-item:last-child:hover {
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

.menu-item.edit-account-modal-option:hover {
    background-color: transparent !important;
}

.menu-icon {
    font-size: 1.2rem;
    width: 30px;
    min-width: 30px;
    text-align: center;
}

.menu-text {
    font-size: 0.95rem;
    font-weight: 500;
    margin-left: 10px;
    opacity: 0;
    transition: opacity 0.3s ease;
    color: var(--bs-text-primary);
}

body[data-rtl="true"] .menu-text {
    margin-left: 0;
    margin-right: 10px;
}

.right-sidebar.expanded .menu-text {
    opacity: 1;
}

.sidebar-image-section {
    margin-top: auto;
    width: 100%;
    padding: 20px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.right-sidebar.expanded .sidebar-image-section {
    opacity: 1;
}

.sidebar-image {
    width: 100%;
    max-width: 200px;
    height: 150px;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 15px;
    background-color: var(--bs-gray-200);
}

.sidebar-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.image-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--bs-white);
    text-align: center;
    padding: 20px;
}

.image-placeholder i {
    font-size: 2.5rem;
    margin-bottom: 10px;
    opacity: 0.8;
}

.image-placeholder p {
    font-size: 0.9rem;
    opacity: 0.9;
}

.image-caption {
    color: var(--bs-gray-600);
    font-size: 0.85rem;
    text-align: center;
    line-height: 1.5;
}

.sidebar-footer {
    width: 100%;
    padding-top: 20px;
    border-top: 1px solid var(--bs-border-light);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.right-sidebar.expanded .sidebar-footer {
    opacity: 1;
}

.user-profile {
    display: flex;
    align-items: center;
    padding: 0 10px;
}

.user-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--bs-white);
    font-size: 1rem;
    font-weight: 600;
    flex-shrink: 0;
    background-color: var(--bs-success);
}

.user-info {
    margin-left: 10px;
    overflow: hidden;
    white-space: nowrap;
}

body[data-rtl="true"] .user-info {
    margin-left: 0;
    margin-right: 10px;
}

.user-name {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--bs-black);
}

.user-role {
    color: var(--bs-black);
    font-size: 0.8rem;
    font-weight: 500;
}

.sidebar-profile-picture {
    border: 1px solid var(--bs-white);
}

body[data-theme="dark"] .sidebar-profile-picture {
    border: none !important;
}

body[data-theme="dark"] .user-profile-picture {
    border: 1px solid #fff !important;
}

.user-profile-picture {
    box-shadow: 0px 0px 4px 0px #00000040;
}

.user-profile-card {
    background-color: var(--bs-gray-200);
}

.user-profile-card {
    cursor: pointer;
}

body[data-theme="dark"] .user-profile-card {
    background-color: var(--bs-user-profile-card-bg-color);
}

.icon-tooltip {
    position: absolute;
    left: -120px;
    background: var(--bs-tooltip-color);
    color: var(--bs-white);
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    pointer-events: none;
    z-index: 1001;
    box-shadow: 0 5px 15px var(--bs-shadow-light);
}

body[data-rtl="true"] .icon-tooltip {
    left: auto;
    right: -120px;
}

.icon-tooltip:after {
    content: '';
    position: absolute;
    top: 50%;
    right: -5px;
    transform: translateY(-50%);
    border-width: 5px 0 5px 5px;
    border-style: solid;
    border-color: transparent transparent transparent var(--bs-tooltip-color);
}

body[data-rtl="true"] .icon-tooltip:after {
    right: auto;
    left: -5px;
    border-width: 5px 5px 5px 0;
    border-color: transparent var(--bs-tooltip-color) transparent transparent;
}

.menu-item:hover .icon-tooltip {
    opacity: 1;
    visibility: visible;
}

.right-sidebar.expanded .menu-item:hover .icon-tooltip {
    visibility: hidden;
}

.menu-item img {
    width: 35px;
    height: 35px;
    border-radius: 100%;
    object-fit: cover;
    margin-right: 0;
}

.right-sidebar.expanded .menu-item img {
    margin-right: 10px;
}

body[data-rtl="true"] .right-sidebar.expanded .menu-item img {
    margin-right: 0;
    margin-left: 10px;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 20px;
    margin-top: 30px;
}

.stat-card {
    background-color: var(--bs-card-bg);
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 5px 15px var(--bs-shadow-light);
    border: 1px solid var(--bs-border-light);
}

.stat-value {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--bs-text-tooltip);
    margin-bottom: 10px;
}

.stat-change {
    font-size: 0.85rem;
    display: flex;
    align-items: center;
}

.stat-change.positive {
    color: #00c853;
}

.stat-change.negative {
    color: #f64e60;
}

@media (max-width: 768px) {
    .layout-wrapper {
        padding-right: 60px;
        padding-left: 0;
    }

    .layout-wrapper.sidebar-expanded {
        padding-right: 250px;
        padding-left: 0;
    }

    .right-sidebar {
        width: 60px;
    }

    .right-sidebar.expanded {
        width: 250px;
    }

    .stats-grid {
        grid-template-columns: 1fr;
    }

    .sidebar-image {
        max-width: 180px;
        height: 130px;
    }
}

.pathway-btn {
    background-color: var(--bs-warning);
    cursor: pointer;
    padding: 15px;
    padding-left: 22px;
    border-radius: 30px;
}

.clear-both {
    clear: both;
}

.main-content-heading {
    text-align: center;
    color: #0E375F !important;
    font-size: 36px;
    font-weight: 700;
    margin-bottom: -10px;
}

body[data-theme="dark"] .main-content-heading {
    /* color: white !important; */
    color: var(--bs-black) !important;
}

.recording-module {
    background-color: transparent;
    border: 1px solid #E3E8EF;
    width: 100%;
    min-width: 700px;
    gap: 8px;
    border-radius: 50px;
}

body[data-theme="dark"] .recording-module {
    color: var(--bs-black);
}

.console-module-option,
.console-module-option:hover, 
.upload-attachment,
.upload-attachment:hover {
    color: #000000 !important;
}

/* Dark theme */
body[data-theme="dark"] .console-module-option {
    filter: brightness(0) invert(1);
}
body[data-theme="dark"] .upload-attachment {
    filter: brightness(0) invert(1);
}

.console-module-option {
    margin-left: 6px;
}

/* Consoles List */
.consoles {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin: 20px 0;
    margin-top: 45px;
    border-radius: 8px;
}

.consoles>div {
    flex-basis: calc(14.2857% - 13px);
    padding: 15px 15px;
    background-color: var(--bs-card-bg);
    border-radius: 6px;
    border: 1px solid var(--bs-border-light);
    font-weight: 500;
    color: var(--bs-gray-800);
    box-shadow: 0 1px 2px var(--bs-shadow-light);
    transition: all 0.2s ease;
    text-align: center;
    box-sizing: border-box;
    font-size: 14px;
}

.consoles>div:hover {
    background-color: var(--bs-blue-light);
    border-color: var(--bs-blue-color);
    background-color: var(--bs-blue-color);
    color: var(--bs-white);
    cursor: pointer;
    transform: translateY(-2px);
    box-shadow: 0 4px 6px var(--bs-shadow-medium);
}

.start-session {
    gap: 25px;
    white-space: nowrap;
    cursor: pointer;
}

.start-session-text {
    font-size: 28px;
    font-weight: 500;
    color: #47546780;
    white-space: nowrap;
}

body[data-rtl="true"][data-theme="light"] .start-session-text {
    color: #47546780;
}

body[data-theme="dark"] .start-session-text {
    color: #F6F8FB;
}

body[data-rtl="true"] .start-session-text {
    margin: 0;
    color: #F6F8FB;
}

#start-session-logo {
    width: auto;
    height: 45px;
    display: block;
    margin-right: 20px;
}

.console-modules {
    /* margin-left: -215px !important; */
    margin-left: -200px !important;
}

.voices-section {
    margin-top: 20px;
}

.generate-script {
    background-color: var(--bs-green-color);
    border: 1px solid var(--bs-green-color);
    border-radius: 50px;
    color: var(--bs-white);
    width: 232px;
    height: 72px;
    font-weight: 500;
    font-size: 20px;
    margin-left: -20px;
}

body[data-theme="dark"] .generate-script {
    color: var(--bs-black);
}

.recording-heading {
    margin-right: -4px;
}

.recording-heading,
.timer {
    font-weight: 500;
    font-size: 20px;
    color: #475467;
}

body[data-theme="dark"] .recording-heading {
    color: var(--bs-black);
}
body[data-theme="dark"] .timer {
    color: var(--bs-black);
}

.recording-btn {
    width: 112px !important;
    height: 66px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.recording-btn,
.recording-btn:hover {
    background-color: var(--bs-green-hover);
    /* border: 5px solid #0b5572; */
    border: 5px solid #c8f1ef;
    color: var(--bs-white);
}

.discard-wrapper {
    position: relative;
    display: inline-block;
    margin-top: 12px;
    margin-right: 12px;
}

body[data-rtl="true"] .discard-wrapper {
    margin-right: 0;
    margin-left: 12px;
}

.discard-wrapper-btn {
    width: 200px;
    height: 56px;
    background-color: transparent !important;
    color: var(--bs-danger) !important;
    font-weight: 500;
    font-size: 20px;
    border: 1px solid var(--bs-danger) !important;
    padding: 8px 24px;
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 50px;
    margin-top: 3px;
}

body[data-theme="dark"] .discard-wrapper-btn {
    background-color: #B21E1E !important;
    color: var(--bs-black) !important;
    border: 1px solid #B21E1E !important;
}

.discard-hover-box {
    position: absolute;
    top: 120%;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    background: var(--bs-card-bg);
    border-radius: 20px;
    padding: 28px;
    box-shadow: 0 15px 40px var(--bs-shadow-dark);
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.25s ease;
    z-index: 999;
    /* border: 1px solid var(--bs-border-light); */
    border: none;
}

/* .discard-wrapper:hover .discard-hover-box {
    opacity: 1;
    visibility: visible;
    top: 100%;
} */

.discard-hover-box h3 {
    font-size: 28px;
    font-weight: 600;
    color: var(--bs-text-black-primary);
    margin-bottom: 10px;
}

.discard-hover-box p {
    font-size: 18px;
    color: var(--bs-text-black-primary);
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 25px;
}

.discard-hover-box .actions {
    display: flex;
    justify-content: center;
    gap: 25px;
}

.btn-no {
    background: transparent;
    border: none;
    font-size: 18px;
    font-weight: 500;
    color: var(--bs-link-color);
    cursor: pointer;
}

.btn-yes {
    background: var(--bs-danger);
    border: none;
    color: var(--bs-white);
    font-size: 18px;
    padding: 6px 16px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 500;
}

body[data-theme="dark"] .discard-hover-box {
    background-color: var(--bs-invite-modal-bg-color) !important;
    border-color: var(--bs-border-medium);
}

body[data-theme="dark"] .discard-hover-box h3 {
    color: var(--bs-black);
}

.discard-hover-box p {
    color: var(--bs-text-black-primary);
}

body[data-theme="dark"] .discard-hover-box p {
    color: var(--bs-black);
}

body[data-theme="dark"] .discard-session-stop,
body[data-theme="dark"] .discard-session-stop-no {
    color: var(--bs-black);
}

body[data-theme="dark"] ::-webkit-scrollbar {
    width: 8px;
}

body[data-theme="dark"] ::-webkit-scrollbar-track {
    background: var(--bs-bg-dark);
}

body[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: var(--bs-gray-600);
    border-radius: 4px;
}

body[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: var(--bs-gray-500);
}

.case-card {
    position: relative;
    width: 100%;
    border-radius: 12px;
    padding: 10px 20px 10px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: 0.2s;
}

body[data-rtl="true"] .case-card {
    padding: 10px 10px 10px 20px;
}

.case-card:hover {
    /* border-color: var(--bs-gray-400); */
    background-color: var(--bs-success-light) !important;
    /* color: var(--bs-blue-dark) !important; */
}

.case-card:hover .case-left {
    border-inline-start: 3px solid rgb(0, 210, 200) !important;
    padding-inline-start: 5px !important;
}

body[data-rtl="true"] .case-card:hover .case-left {
    padding-inline-start: 10px !important;
}
.case-left {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.case-checkbox .form-check-input {
    width: 16px !important;
    height: 16px !important;
    border-radius: 4px !important;
    position: relative;
    left: 4px;
}

body[data-rtl="true"] .case-checkbox .form-check-input {
    margin-right: 0;
    margin-left: -10px;
}

.form-check.form-check-solid .form-check-input:not(:checked) {
    background-color: transparent !important;
    border: 1px solid var(--bs-border-color) !important;
}

.case-checkbox .case-select-checkbox:not(:checked),
.case-checkbox .case-select-checkbox2:not(:checked) {
    background-color: var(--bs-white) !important;
    border: 1px solid var(--bs-border-color) !important;
    border-radius: 5.25px !important;
}

.case-checkbox .form-check-input:checked {
    background-color: var(--bs-green-color) !important;
    border-color: var(--bs-green-color) !important;
    border-radius: 5.25px !important;
}

body[data-theme="dark"]  .case-checkbox.form-check-input:not(:checked) { 
    /* background-color: var(--bs-black) !important; */
    background-color: transparent !important;
}

.console-modules-input-checkbox:checked {
    background-color: var(--bs-green-color) !important;
    border-color: var(--bs-green-color) !important;
}

#case-checkbox:not(:checked) {
    background-color: #ffffff !important;
    border: 1px solid #C2CADC !important;
}

#case-checkbox2:not(:checked) {
    background-color: #ffffff !important;
    border: 1px solid #C2CADC !important;
}

#case-checkbox:checked {
    background-color: var(--bs-green-color) !important;
    border-color: var(--bs-green-color) !important;
}



.selected-module-item {
    display: inline-flex;
    width: fit-content;
    border-radius: 6px;
}

body[data-theme="dark"] .selected-module-item {
    color: var(--bs-black);
}

body[data-theme="dark"] .selected-module-item img {
    filter: brightness(0) invert(1);
}

.selected-module-item:hover {
    background-color: var(--bs-success-light);
}

.selected-module-item .remove-icon {
    display: none;
    font-size: 16px;
    font-weight: bold;
    color: var(--bs-info);
    border-radius: 30px;
}

.selected-module-item:hover .module-icon {
    display: none;
}

.selected-module-item:hover .remove-icon {
    display: inline-block;
}

/* both icons same width */
.module-icon,
.remove-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

/* module icon default visible */
.module-icon {
    opacity: 1;
    transition: opacity 0.2s ease;
}

/* remove icon default hidden */
.remove-icon {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* hover states */
.selected-module-item:hover .module-icon {
    opacity: 0;
    visibility: hidden;
}

.selected-module-item:hover .remove-icon {
    opacity: 1;
    visibility: visible;
    position: relative;
    top: -1.5px;
}

/* Selected Files */
.selected-file-item {
    display: inline-flex;
    width: fit-content;
    border-radius: 6px;
}

.selected-file-item:hover {
    background-color: var(--bs-success-light);
}

body[data-theme="dark"] .selected-file-item {
    color: var(--bs-black);
}

body[data-theme="dark"] .selected-file-item img {
    filter: brightness(0) invert(1);
}

.selected-file-item .remove-file {
    display: none;
    font-size: 16px;
    font-weight: bold;
    color: var(--bs-info);
    border-radius: 30px;
}

.selected-file-item:hover .file-icon {
    display: none;
}

.selected-file-item:hover .remove-file {
    display: inline-block;
}

.module-title {
    position: relative;
    top: 2px;
    color: var(--bs-text-primary);
    font-weight: 500;
}

.case-info {
    display: flex;
    flex-direction: column;
}

.case-title {
    font-size: 13px;
    font-weight: 500;
    color: var(--bs-black);
    margin-top: 2px;
}

.case-date {
    margin-top: 5px;
    margin-left: -23px;
    display: flex;
    align-items: center;
    gap: 3px;
    font-size: 12px;
    color: var(--bs-black);
    font-weight: 500;
}

body[data-rtl="true"] .case-date {
    margin-left: 0;
    margin-right: -23px;
}

.case-date img {
    width: 14px;
    height: 14px;
    opacity: 0.7;
}

.case-actions {
    display: flex;
    align-items: center;
}

.case-icon {
    width: 18px;
    height: 18px;
    cursor: pointer;
    opacity: 0.85;
    transition: 0.2s;
}

.case-icon:hover {
    opacity: 1;
}

.download-case-btn {
    color: var(--bs-black);
}

.download-case-btn svg {
    filter: brightness(1) invert(0);
}

body[data-theme="dark"] .download-case-btn svg {
    filter: brightness(0) invert(1);
}

.copy-btn:hover,
.edit-case-btn:hover,
.download-case-btn:hover {
    cursor: pointer;
}

.btn-save-draft,
.btn-save-draft:hover,
.btn-save-draft:disabled {
    background-color: var(--bs-green-color);
}

/* Account Management */
#editAccountModal .modal-dialog .modal-content {
    /* background-color: var(--bs-invite-modal-bg-color); */
    background-color: var(--bs-bg-sidebar);
    color: var(--bs-black);
}

/* body[data-theme="dark"] #editAccountModal .modal-dialog .modal-content {
    background-color: var(--bs-bg-sidebar);
} */

.edit-account-modal-header a {
    color: var(--bs-black);
}

/* body[data-theme="dark"] .edit-account-modal-header a {
    color: var(--bs-white) !important;
} */

.my-account-heading {
    color: var(--bs-blue-dark);
}

body[data-theme="dark"] .my-account-heading {
    color: var(--bs-black);
}

.edit-account-modal-header a svg {
    fill: #374957;
}

body[data-theme="dark"] .edit-account-modal-header a svg {
    filter: brightness(0) invert(1);
}

#v-pills-tab .nav-link {
    text-align: left;
    color: var(--bs-black);
    font-size: 15px;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

body[data-rtl="true"] #v-pills-tab .nav-link {
    text-align: right;
}

#v-pills-tab .nav-link {
    background-color: transparent;
}

#v-pills-tab .nav-link svg {
    color: var(--bs-black);
}

.edit-account-modal-left-sidebar-heading {
    position: relative;
    top: 1px;
    font-weight: 500;
    font-size: 16px;
}

#v-pills-tab .nav-link.active {
    background-color: var(--bs-white);
    color: var(--bs-green-color);
    padding-left: 15px;
    box-shadow: var(--bs-shadow-light);
    font-weight: 500;
}

body[data-theme="dark"] #v-pills-tab .nav-link.active {
    background-color: var(--bs-bg-sidebar);
    border: 1px solid var(--bs-bg-sidebar);
}

body[data-theme="dark"] .subscription-card {
    background-color: var(--bs-bg-sidebar);
    border: 1px solid #E3E8EF33;
}

body[data-rtl="true"] #v-pills-tab .nav-link.active {
    padding-left: 0;
    padding-right: 15px;
}

#v-pills-tab .nav-link.active svg {
    color: var(--bs-green-color);
}

.manage-plan-card {
    background-color: var(--bs-green-light-color);
    border: 1px solid var(--bs-green-light-color);
    border-radius: 12px;
}

body[data-theme="dark"] .manage-plan-card {
    background-color: #0d4669 !important;
    border: 1px solid #0d4669;
}

.current-plan-title {
    background-color: var(--bs-green-color) !important;
    letter-spacing: 1px;
    font-size: 14px;
    font-weight: 600;
    padding: 5px 8px;
    border-radius: 4px;
    color: var(--bs-white);
}

.current-plan-name {
    font-size: 16px;
    font-weight: 500;
    margin-top: 10px;
    color: #0B1220;
}

body[data-theme="dark"] .current-plan-name {
    color: #ffffff;
}

.manage-plan-btn {
    background-color: var(--bs-white);
    border: 1.5px solid var(--bs-green-color);
    color: var(--bs-green-color);
    padding: 10px 20px;
    float: right;
    border-radius: 50px;
    font-size: 13px;
    font-weight: 500;
    line-height: 17px;
}

body[data-theme="dark"] .manage-plan-btn {
    background-color: var(--bs-blue-dark);
    border: 1.5px solid var(--bs-green-color);
}

body[data-rtl="true"] .manage-plan-btn {
    float: left;
}

.current-plan-prices {
    color: var(--bs-text-black-secondary);
    margin-top: -5px;
    font-size: 12px;
    font-weight: 500;
}

body[data-theme="dark"] .current-plan-prices {
    color: var(--bs-black);
}

.fullname-label,
.password-label {
    color: var(--bs-text-black-secondary);
    font-weight: 500;
    font-size: 14px;
}

body[data-theme="dark"] .fullname-label,
body[data-theme="dark"] .password-label {
    color: var(--bs-black);
}

#user_name,
#email,
#address {
    background-color: var(--bs-white);
    color: var(--bs-black);
    border-radius: 6px;
    height: 39px;
    padding: 0 8px !important;
}

body[data-theme="dark"] #user_name {
    background-color: var(--bs-invite-modal-bg-color) !important;
    border: 1px solid #E3E8EF33;
}

body[data-theme="dark"] #email {
    background-color: var(--bs-invite-modal-bg-color) !important;
    border: 1px solid #E3E8EF33;
}

body[data-theme="dark"] #address {
    background-color: var(--bs-invite-modal-bg-color) !important;
    border: 1px solid #E3E8EF33;
}

.linked-accounts {
    /* color: var(--bs-text-black-primary); */
    color: #0B1220;
    font-weight: 500;
    font-size: 16px;
}
.linked-accounts span,
.linked-accounts svg {
    color: #0B122080;
}

body[data-theme="dark"] .linked-accounts {
    color: var(--bs-black);
}

body[data-theme="dark"] .linked-accounts span {
    color: var(--bs-black) !important;
}

body[data-theme="dark"] .linked-accounts svg {
    color: var(--bs-black);
}


body[data-theme="dark"] .linked-accounts svg {
    filter: brightness(0) invert(1)  !important;
    fill: var(--bs-black) !important;
}

.float-right {
    float: right !important;
}

body[data-rtl="true"] .float-right {
    float: left !important;
}

.progress {
    background-color: var(--bs-gray-200);
}

body[data-theme="dark"] .progress {
    background-color: #415f7d;
}

.progress-bar {
    background-color: var(--bs-green-color);
}

.invite-link {
    font-size: 12px;
    font-weight: 500;
    text-decoration: underline;
    color: #00D2C8;
}

.credit-counter,
.credits,
.payment-method-title {
    color: #0B1220;
    font-weight: 500;
    font-size: 16px;
}

body[data-theme="dark"] .credit-counter,
.credits,
.payment-method-title {
    color: var(--bs-black);
}

.update-package-counter-icon {
    fill: var(--bs-bg-sidebar) !important;
}

.credit-counter-box {
    color: var(--bs-black);
}

.visa-card {
    color: var(--bs-black);
    font-size: 12px;
    font-weight: 700;
}

.expiry-card {
    color: #0B122080;    
    font-size: 12px;
    font-weight: 500;
}

body[data-theme="dark"] .expiry-card  {
    color: var(--bs-black);
}   

.update-package-btn {
    color: var(--bs-success) !important;
    font-weight: 700;
    font-size: 12px;
}

.credit-counter-icon {
    background-color: var(--bs-bg-light);
}

.social-link-title {
    font-size: 16px;
    font-weight: 500;
    color: var(--bs-text-black-primary);
}

.connect-disconnect {
    font-size: 16px;
    font-weight: 600;
    margin-right: 10px;    
}

.connect-disconnect-active {
    color: var(--bs-link-color);
}

.connect-disconnect-inactive {
    /* color: var(--bs-text-black-primary); */
    color: #0B122080;
}

body[data-theme="dark"] .connect-disconnect-active {
    color: var(--bs-green-color);
}

body[data-theme="dark"] .connect-disconnect-inactive {
    color: var(--bs-black);
}

body[data-rtl="true"] .connect-disconnect {
    margin-right: 0;
    margin-left: 10px;
}

.modal .modal-dialog .modal-header svg {
    fill: #374957;
}
body[data-theme="dark"] .modal .modal-dialog .modal-header svg {
    filter: brightness(0) invert(1)
}

.save-changes-btn {
    background-color: var(--bs-green-color);
    border: none;
    border-radius: 30px;
    width: 180px;
    height: 48px;
}

.subscription-card,
.subscription-packages-section {
    border: 1px solid var(--bs-border-medium);
    background-color: var(--bs-card-bg);
    margin-top: 40px;
}

.subscription-packages-section>.card-body {
    max-height: 550px;
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

body[data-theme="dark"] .subscription-packages-section {
    background-color: var(--bs-bg-sidebar) !important;
    /* border: 1px solid var(--bs-border-medium); */
    border: 1px solid #E3E8EF33;
}

.general-card {
    background-color: var(--bs-white);
    border: 1px solid var(--bs-border-medium);
    color: var(--bs-black);
    margin-top: 45px;
}

body[data-theme="dark"] .general-card {
    background-color: var(--bs-bg-sidebar);
    /* border: 1px solid var(--bs-border-medium); */
    border: 1px solid #E3E8EF33;
}


.notifications-card {
    background-color: var(--bs-white);
    border: 1px solid var(--bs-border-medium);
    color: var(--bs-black);
    margin-top: 45px;
}

body[data-theme="dark"] .notifications-card {
    background-color: var(--bs-bg-sidebar);
    /* border: 1px solid var(--bs-border-medium); */
    border: 1px solid #E3E8EF33;
}

.notifications-card .card-body {
    padding: 18px;
}

.password-card {
    background-color: var(--bs-white);
    border: 1px solid var(--bs-border-medium);
    color: var(--bs-black);
    margin-top: 45px;
}

body[data-theme="dark"] .password-card {
    background-color: var(--bs-bg-sidebar);
    /* border: 1px solid var(--bs-border-medium); */
    border: 1px solid #E3E8EF33;
}

body[data-theme="dark"] .password-card .card-body input[type="text"] {
    background-color: var(--bs-invite-modal-bg-color) !important;
    color: var(--bs-black);
    border: 1px solid #E3E8EF33;
}
body[data-theme="dark"] .password-card .card-body input[type="password"] {
    background-color: var(--bs-invite-modal-bg-color) !important;
    color: var(--bs-black);
    border: 1px solid #E3E8EF33;
}

.password-card .card-body {
    padding: 14px;
}

.delete-account-card {
    background-color: var(--bs-white);
    border: 1px solid var(--bs-border-medium);
    color: var(--bs-black);
    margin-top: 45px;
}

body[data-theme="dark"] .delete-account-card {
    background-color: var(--bs-bg-sidebar);
    color: var(--bs-black);
    /* border: 1px solid var(--bs-border-medium); */
    border: 1px solid #E3E8EF33;
}

.delete-account-card .card-body {
    padding: 18px;
}

.delete-action-card .card-body {
    padding: 26px 18px;
}

body[data-theme="dark"] .delete-action-card {
    background-color: var(--bs-invite-modal-bg-color);
    color: var(--bs-black);
}

.form-label {
    font-weight: 500;
    margin-bottom: 0px;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 0.5px;
    color: #323639;
}

body[data-theme="dark"] .form-label {
    color: #ffffff;
}

.form-control {
    height: 48px;
    border-radius: 12px;
    padding: 0 16px;
    font-size: 1rem;
}

.row.g-3 {
    margin-top: 20px;
}

.requirements-box {
    background: var(--bs-bg-sidebar);
    border-radius: 12px;
    padding: 14px 12px;
    margin-top: 20px;
    font-size: 0.92rem;
}

body[data-theme="dark"] .requirements-box {
    background-color: var(--bs-invite-modal-bg-color) !important;
}

.req-item {
    display: inline-flex;
    align-items: center;
    margin-right: 20px;
    color: var(--bs-text-primary);
}

body[data-rtl="true"] .req-item {
    margin-right: 0;
    margin-left: 20px;
}

.req-item .dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 8px;
}

body[data-rtl="true"] .req-item .dot {
    margin-right: 0;
    margin-left: 8px;
}

.req-item.active .dot {
    background: var(--bs-green-color);
}

.req-item.inactive .dot {
    background: var(--bs-gray-400);
}

.btn-update {
    background: var(--bs-green-color);
    border: none;
    border-radius: 50px;
    height: 56px;
    font-weight: 600;
    font-size: 1.1rem;
    margin-top: 32px;
    width: 100%;
    transition: all 0.2s;
    color: var(--bs-white);
}

.btn-update:hover {
    background: var(--bs-green-hover);
    transform: translateY(-1px);
}

.form-check-label {
    font-size: 0.92rem;
    color: var(--bs-text-primary);
}

#showPasswords {
    position: relative;
    top: 2px;
}

.requirements-title {
    color: var(--bs-text-black-secondary);
}

body[data-theme="dark"] .requirements-title {
    color: var(--bs-black);
}

.toggle-row {
    background-color: #F6F8FB;
    border-radius: 6px;
    padding: 12px 16px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all 0.2s;
}

body[data-theme="dark"] .toggle-row {
    background-color: #0E3F6E;
}

.toggle-label {
    font-weight: 500;
    color: #0B1220;
    font-size: 16px;
    margin: 0;
}

body[data-theme="dark"] .toggle-label {
    color: #ffffff;
}

.form-switch .form-check-input {
    width: 44px;
    height: 24px;
    background-color: var(--bs-toggle-bg);
    border: none;
    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='%23ffffff'/%3e%3c/svg%3e");
    margin-top: 3px;
}

.form-switch .form-check-input:checked {
    background-color: var(--bs-link-color);
    border: none;
    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='%23ffffff'/%3e%3c/svg%3e");
}

/* body[data-theme="dark"] .form-switch .form-check-input {
    background-image: url("data:image/svg+xml,%3Csvg width='9' height='8' viewBox='0 0 9 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.38059 0.622091C7.57625 0.369315 7.9356 0.326318 8.18321 0.526054C8.43083 0.72579 8.47295 1.09262 8.27729 1.3454L3.76204 7.1787C3.55141 7.45083 3.1561 7.47635 2.91356 7.2335L0.571682 4.88861C0.34638 4.66302 0.342883 4.29369 0.563871 4.06369C0.78486 3.8337 1.14665 3.83013 1.37195 4.05572L3.25971 5.94591L7.38059 0.622091Z' fill='%23062E55' stroke='%23062E55' stroke-width='0.8'/%3E%3C/svg%3E") !important;
}

body[data-theme="dark"] .form-check-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3Csvg width='9' height='8' viewBox='0 0 9 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.38059 0.622091C7.57625 0.369315 7.9356 0.326318 8.18321 0.526054C8.43083 0.72579 8.47295 1.09262 8.27729 1.3454L3.76204 7.1787C3.55141 7.45083 3.1561 7.47635 2.91356 7.2335L0.571682 4.88861C0.34638 4.66302 0.342883 4.29369 0.563871 4.06369C0.78486 3.8337 1.14665 3.83013 1.37195 4.05572L3.25971 5.94591L7.38059 0.622091Z' fill='%23062E55' stroke='%23062E55' stroke-width='0.8'/%3E%3C/svg%3E") !important;
}        */

.form-switch .form-check-input:focus {
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
}

.delete-action-alert {
    background: linear-gradient(135deg, #fff5f5 0%, #ffeaea 100%);
    border: 1px solid #DC262633;
}

body[data-theme="dark"] .delete-action-alert {
    background: var(--bs-invite-modal-bg-color) !important;
    /* border: 1px solid var(--bs-border-medium); */
    border: 1px solid #E3E8EF33;
}

.delete-account-btn {
    background-color: #fadfdf !important;
    border: 1px solid var(--bs-danger) !important;
    color: var(--bs-danger) !important;
    font-size: 13px;
}

body[data-theme="dark"] .delete-account-btn {
    background-color: #B21E1E !important;
    color: var(--bs-black) !important;
}

.delete-account-title {
    color: var(--bs-black);
}

.once-you-delete-text {
    font-size: 10px;
    color: var(--bs-text-black-primary);
}

.delete-action-heading {
    color: #0B1220;
    font-weight: 600;
    font-size: 24px;
}

body[data-theme="dark"] .delete-action-heading {
    color: #ffffff;
}

.delete-action-sub-heading {
    color: #0B1220;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    padding-inline: 30px;
}

body[data-theme="dark"] .delete-action-sub-heading {
    color: #ffffff;
}

.cancel-btn2 {
    background-color: transparent;
    color: #2563EB;
    border: none;
    font-weight: 500;
    font-size: 16px;
    margin-left: 40px;
}

body[data-theme="dark"] .cancel-btn2 {
    /* background-color: var(--bs-invite-modal-bg-color) !important; */
    color: var(--bs-black) !important;
}

body[data-rtl="true"] .cancel-btn2 {
    margin-left: 0;
    margin-right: 20px;
}


.delete-account-btn2 {
    background-color: var(--bs-danger);
    color: var(--bs-white);
    border: none;
    font-size: 16px;
    font-weight: 500;
    margin-left: 20px;
    padding: 6px 16px;
    border-radius: 6px;
}

body[data-rtl="true"] .delete-account-btn2 {
    margin-left: 0;
    margin-right: 20px;
}

body[data-theme="dark"] .delete-account-btn2 {
    color: var(--bs-black) !important;
}

.requirements-box .req-item {
    display: inline-flex;
    align-items: center;
    margin-right: 10px;
    color: var(--bs-text-black-primary);
}

body[data-rtl="true"] .requirements-box .req-item {
    margin-right: 0;
    margin-left: 10px;
}

.requirements-box .req-item.active span {
    color: var(--bs-green-color) !important;
}

/* .requirements-box .req-item svg {
    color: var(--bs-requirement-radio-btn-color) !important;
} */

.requirements-box .req-item svg path {
    transition: fill 0.3s;
}

.requirements-box .req-item.active svg path {
    fill: var(--bs-green-color);
}

.requirements-box .req-item.inactive svg path {
    /* fill: var(--bs-text-black-primary); */
    fill: var(--bs-requirement-radio-btn-color) !important;
}

.all-cases-auto-delete {
    color: var(--bs-danger);
    font-weight: 600;
    padding-top: 10px;
}

.sidebar-divider {
    width: 90% !important;
    height: 1px;
    /* background-color: var(--bs-border-light); */
    background-color: #E3E8EF;
    margin: 0px auto;
}

body[data-theme="dark"] .sidebar-divider {
    background-color: #ffffff;
}

#casesToggle1,
#casesToggle2 {
    transition: transform 0.3s ease;
    position: relative;
    top: -2px;
}

#casesToggle1.rotated,
#casesToggle2.rotated {
    transform: rotate(-90deg);
}

#editFeedbackModal .modal-dialog .modal-content {
    background-color: var(--bs-invite-modal-bg-color);
}

.feedback-modal-header a {
    color: var(--bs-black);
}

.feedback-modal-header a svg {
    filter: brightness(1) invert(0);
}

body[data-theme="dark"] .feedback-modal-header a svg {
    filter: brightness(0) invert(1);
}

.kaizen-heading {
    color: var(--bs-black);    
}

.kaizen-title {
    color: var(--bs-black);
    padding-top: 8px;
    font-weight: 700;
    font-size: 32px;
}

.kaizen-description {
    color: var(--bs-black);
    margin-top: 10px;
    font-weight: 500;
    font-size: 18px;
    line-height: 150%;
    padding: 0px 95px;
}

.your-message-label {
    color: var(--bs-black);
    font-weight: 500;
    font-size: 16px;
}

.feedback-textarea {
    background-color: var();
    height: 200px;
    padding-top: 8px;
}

.language-modal {
    border-radius: 20px !important;
    padding-bottom: 10px;
}

#editLanguageModal .modal-dialog .modal-content {
    background-color: var(--bs-invite-modal-bg-color);
}

.custom-lang-header {
    border-bottom: none !important;
    padding: 20px 25px !important;
}

.lang-icon-circle {
    width: 48px;
    height: 48px;
    background: var(--bs-green-light-color);
    border-radius: 100px;
    padding: 8px;
    /* display: flex;
    justify-content: center;
    align-items: center; */
}

.custom-lang-header a {
    color: var(--bs-black);
}

.custom-lang-header a svg {
    filter: brightness(1) invert(0);
}

body[data-theme="dark"] .custom-lang-header a svg {
    filter: brightness(0) invert(1);
}

.select-language-title,
.all-inputs-lang-detected-text,
.portal-lang-heading,
.output-lang-heading {
    color: var(--bs-black);
}

.select-language-title {
    font-weight: 600;
    font-size: 24px;
    color: #0B1220;
}

body[data-theme="dark"] .select-language-title {
    color: var(--bs-black);
}

.all-inputs-lang-detected-text {
    font-weight: 500;
    font-size: 24px;
    color: #0B122080;
}

body[data-theme="dark"] .all-inputs-lang-detected-text {
    color: #F6F8FB;
}

.portal-lang-heading {
    font-weight: 600;
    font-size: 18px;
    color: #0B1220;
}

body[data-theme="dark"] .portal-lang-heading {
    color: #F6F8FB;
}

.output-lang-heading {
    font-weight: 600;
    font-size: 18px;
    color: #0B1220;
}

body[data-theme="dark"] .output-lang-heading {
    color: #F6F8FB;
}

.interface-lang {
    font-weight: 500;
    font-size: 18px;
    color: var(--bs-black);
}

.lang-list-container {
    max-height: 230px;
    overflow-y: auto;
    padding-right: 5px;
    padding: 18px;
}

.lang-item {
    background-color: var(--bs-white);
    border: 1px solid var(--bs-discard-btn);
    color: var(--bs-black);
    border-radius: 12px;
    padding: 12px 16px;
    margin-bottom: 8px;
    font-size: 18px;
    font-weight: 500;
    cursor: pointer;
    transition: 0.2s;
}

.lang-item:hover {
    background: var(--bs-success-light);
}

.lang-item.active {
    background: var(--bs-success-light);
    border: 1px solid var(--bs-green-color);
}

.lang-item .tick {
    float: right;
    color: var(--bs-green-hover);
}

body[data-rtl="true"] .lang-item .tick {
    float: left;
}

body[data-theme="dark"] .lang-item {
    background-color: var(--bs-bg-sidebar);
    border: 1px solid #E3E8EF33;
}

body[data-theme="dark"] .lang-item.active {
    background-color: var(--bs-success-light) !important;
    border: 1px solid var(--bs-success) !important;
}

body[data-theme="dark"] .lang-item:hover {
    background-color: var(--bs-success-light) !important;
    border: 1px solid var(--bs-success) !important;
}

/* Footer Buttons */
.lang-close-btn,
.feedback-close-btn,
.lang-save-btn {
    /* background-color: var(--bs-white);
    border: 1px solid var(--bs-border-light); */
    width: 200px;
    height: 56px;
    border-radius: 50px;
    padding: 8px 24px;
    font-weight: 500;
    font-size: 16px;
}

.lang-save-btn {
    background-color: var(--bs-success) !important;
    color: var(--bs-white);
    border: 1px solid #00D2C8;
}

body[data-theme="dark"] .lang-save-btn {
    background-color: var(--bs-success) !important;
    color: var(--bs-black);
}

.lang-close-btn {
    background-color: var(--bs-white);
    border: 1px solid #E3E8EF;
    color: #0B1220BF;
}

body[data-theme="dark"] .lang-close-btn {
    background-color: var(--bs-black);
    border: 1px solid #E3E8EF;
    color: #0B1220BF;
}

.feedback-save-btn {
    border-radius: 30px;
    padding: 10px 30px;
    font-weight: 600;
    border: none;
}

.rating-stars {
    display: flex;
    gap: 10px;
}

.rating-stars .star {
    font-size: 30px;
    color: #0B122040;
    cursor: pointer;
    transition: color 0.2s ease;
    -webkit-text-stroke: 0.2px var(--bs-black);
}

body[data-theme="dark"] .rating-stars .star {
    color: #0B122040;
    -webkit-text-stroke: 0.2px var(--bs-black);
}

.rating-stars .star.hovered {
    color: var(--bs-star-active);
}

.rating-stars .star.active {
    color: var(--bs-star-active);
}

body[data-theme="dark"] .rating-stars .star.active {
    color: var(--bs-star-active);
}

body[data-theme="dark"] .rating-stars .star.hovered {
    color: var(--bs-star-active);
}

.feedback-textarea,
.feedback-textarea:focus {
    font-size: 20px;
    background-color: transparent;
    border: 1px solid var(--bs-discard-btn);
    padding: 10px 15px;
    color: var(--bs-black);
}

.feedback-textarea::placeholder {
    font-size: 20px;
    font-weight: 400;
    color: #0B122040;
}

body[data-theme="dark"] .feedback-textarea::placeholder {
    color: var(--bs-black);
}

#charCount {
    color: #0B122040;
}

body[data-theme="dark"] #charCount {
    color: var(--bs-black);
}

.metric-radio-group {
    display: inline-flex;
    align-items: center;
    gap: 40px;
    padding: 16px 30px;
    border-radius: 16px;
}

.metric-radio {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
}

.metric-radio input {
    display: none;
}

.radio-dot {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #e5e5e5;
    position: relative;
}

.metric-radio input:checked + .radio-dot {
    background-color: #14e6c8;
    border: 1px solid #00000080;
}

.metric-radio input:checked + .radio-dot::after {
    content: '';
    position: absolute;
    inset: 5px;
    background-color: #14e6c8;
    border-radius: 50%;
}

.radio-text {
    white-space: nowrap;
    font-weight: 500;
    font-size: 16px;
    color: var(--bs-black);
}



.feedback-modal-footer {
    margin-top: -30px;
}

.feedback-close-btn {
    background-color: var(--bs-white);
    border: 1px solid var(--bs-discard-btn);
    padding: 15px 70px !important;
    color: #0B1220BF !important;
    width: 200px;
    height: 56px;
    border-radius: 50px;
    padding: 8px 24px;
    font-weight: 500;
    font-size: 16px;
}

body[data-theme="dark"] .feedback-close-btn {
    background-color: var(--bs-white);
}

body[data-theme="dark"] .feedback-close-btn {
    background-color: var(--bs-discard-btn) !important;
    border: 1px solid var(--bs-discard-btn) !important;
    color: var(--bs-white) !important;
}

.feedback-save-btn {
    background-color: var(--bs-green-color) !important;
    color: var(--bs-white);
    padding: 15px 70px !important;
    width: 200px;
    height: 56px;
    border-radius: 50px;
    padding: 8px 24px;
    font-weight: 500;
    font-size: 16px;
}

body[data-theme="dark"] .feedback-save-btn {
    color: var(--bs-black);
}

.feedback-email-link {
    font-weight: 700;
    font-size: 16px;
    margin-top: 40px;
}

.feedback-email-link a {
    color: var(--bs-success);
    text-decoration: underline !important;
}

.feedback-email-link a:hover{
    text-decoration: underline !important;
}

.feedback-error {
    color: red;
    font-size: 14px;
    font-weight: 500;
}

body[data-theme="dark"] .feedback-error {
    /* color: var(--bs-black); */
    color: red;
}

/* Invite Friends */
.invite-frnd-btn-group {
    display: flex;
    border-radius: 30px;
    width: 100%;
    border: 1px solid var(--bs-border-light);
    overflow: hidden;
    background-color: var(--bs-white);
    padding: 2px;
}

body[data-theme="dark"] .invite-frnd-btn-group {
    background-color: var(--bs-sidebar);
}

.invite-frnd-btn-group>button {
    background-color: transparent;
    border: none;
    padding: 10px 20px;
    flex: 1;
    transition: all 0.2s ease;
    cursor: pointer;
    border-radius: 30px;
    font-size: 16px;
    font-weight: 500 !important;
}

.invite-frnd-btn-group>button.invite-active-btn {
    background-color: var(--bs-green-color) !important;
    color: var(--bs-white) !important;
}

body[data-theme="dark"] .invite-frnd-btn-group>button.invite-active-btn {
    color: var(--bs-black) !important;
}

body[data-theme="dark"] .invite-frnd-btn-group {
    border: 2px solid #E3E8EF33;
    color: var(--bs-black);
}

.invite-friends-heading {
    font-size: 36px;
    font-weight: 700;
    color: var(--bs-text-black-primary);
}

body[data-theme="dark"] .invite-friends-heading {
    color: var(--bs-black);
}   

.invite-friends-sub-heading {
    font-weight: 500;
    font-size: 20px;
    color: var(--bs-text-black-primary);
    line-height: 32px;
    padding: 0px 70px;
}

.invite-friend-input-group {
    width: 63% !important;
    border: 1px solid #E3E8EF;
    border-radius: 50px;
}

body[data-theme="dark"] .invite-friend-input-group {
    border: 1px solid var(--bs-black);
}   

.invite-friend-input-group .input-group-text {
    border-radius: 30px 0 0 30px !important;
    border: 1px solid #E3E8EF33 !important;
    border-right: 0px !important;
    padding: 10px 15px !important;
    background-color: transparent;
    color: var(--bs-text-primary);
}

body[data-rtl="true"] .invite-friend-input-group .input-group-text {
    border-radius: 0 30px 30px 0 !important;
}

body[data-theme="dark"] .invite-friend-input-group .form-control {
    border-right: 0px !important;
}

.invite-friend-input-group .form-control {
    border-radius: 0 30px 30px 0 !important;
    border: 1px solid #E3E8EF33 !important;
    border-left: 0 !important;
    color: var(--bs-black);
    background-color: var(--bs-card-bg);
    /* padding: 10px 15px 10px 0px !important; */
    padding: 10px 23px 10px 0px !important;
    font-weight: 500;
    font-size: 16px;
}

body[data-theme="dark"] .invite-friend-input-group .form-control {
    border-left: 0 !important;
}

body[data-rtl="true"] .invite-friend-input-group .form-control {
    border-radius: 30px 0 0 30px !important;
}

.invite-friend-input-group .form-control::placeholder {
    font-size: 16px;
}

body[data-theme="dark"] .invite-friend-input {
    background-color: transparent;
    border: 1px solid #E3E8EF33 !important;
}

.invite-friends-btn {
    background-color: var(--bs-green-color);
    border: 1px solid var(--bs-green-color);
    /* padding: 8px 100px; */
    width: 250px;
    height: 68px;
    border-radius: 50px;
    color: var(--bs-white);
    font-size: 20px;
    font-weight: 500;
}

body[data-theme="dark"] .invite-friends-btn {
    color: var(--bs-black);
}

body[data-theme="dark"] .invite-frnd-btn-group>button {
    background-color: transparent;
    color: var(--bs-black);
}

.invited-friends-section {
    height: 590px;
    max-height: 590px !important;
    overflow-y: auto;
    padding-right: 6px;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-behavior: smooth;
    margin-bottom: 10px;
}

.invited-friends-section::-webkit-scrollbar {
    display: none;
}

.invited-user-card {
    padding: 0px 100px;
    margin-top: 10px;
}

.invited-user-name {
    color: #475467;
    font-size: 18px;
    font-weight: 600;
}
body[data-theme="dark"] .invited-user-name {
    color: var(--bs-black);
}

.invited-user-email {
    color: #475467;
    font-size: 14px;
    font-weight: 500;
}
body[data-theme="dark"] .invited-user-email {
    color: var(--bs-black);
}

.invited-user-date {
    color: #475467;
    font-size: 14px;
    font-weight: 600;
}
body[data-theme="dark"] .invited-user-date {
    color: var(--bs-black);
}

.invited-user-img {
    border: 1px solid var(--bs-border-light);
}

.no-invited-friends-title,
.no-invited-friends-message {
    /* color: var(--bs-green-color); */
    color: #071437;
}

body[data-theme="dark"] .no-invited-friends-title {
    color: #ffffff;
}
body[data-theme="dark"] .no-invited-friends-message {
    color: #ffffff;
}

#editCaseModal .modal-dialog .modal-content {
    /* background-color: var(--bs-bg-body); */
    background-color: var(--bs-white);
}

body[data-theme="dark"] #editCaseModal .modal-dialog .modal-content {
    /* background-color: var(--bs-bg-body); */
    background-color: #0E3F6E;
}

.edit-case-form {
    background-color: var(--bs-bg-sidebar);
}

.add-to-cpd-btn {
    background-color: var(--bs-white);
    border: 1px solid var(--bs-warning);
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 15px;
    color: var(--bs-text-primary);
}

body[data-theme="dark"] .add-to-cpd-btn {
    background-color: var(--bs-border-color);
    border: 1px solid var(--bs-warning);
}

.add-to-cpd-title {
    position: relative;
    top: 1px;
    font-weight: 500;
    color: var(--bs-text-primary);
}

.add-to-cpd-icon {
    position: relative;
    top: -1px;
}

.review-and-edit-title {
    border-left: 4px solid var(--bs-green-color);
    padding: 8px;
    padding-left: 5px;
    color: var(--bs-text-primary);
}

body[data-rtl="true"] .review-and-edit-title {
    border-left: none;
    border-right: 4px solid var(--bs-green-color);
    padding-left: 8px;
    padding-right: 5px;
}

.case-details,
.case-details:focus {
    background-color: var(--bs-bg-sidebar) !important;
    color: var(--bs-black);
}

.discard-changes-btn {
    background-color: var(--bs-gray-200);
    border-radius: 10px !important;
    font-weight: 500;
    color: var(--bs-black) !important;
    font-size: 15px !important;
    border: none;
}

.discard-changes-btn:hover {
    background-color: var(--bs-gray-300);
}

body[data-theme="dark"] .discard-changes-btn {
    background-color: var(--bs-discard-btn);
    color: var(--bs-white) !important;
}

.save-btn-group .btn {
    background-color: var(--bs-green-color) !important;
    color: var(--bs-black);
}

.save-btn-group .btn:first-child {
    background-color: var(--bs-green-color) !important;
    color: var(--bs-white) !important;
    border-right: 1px solid var(--bs-white) !important;
}

body[data-rtl="true"] .save-btn-group .btn:first-child {
    border-right: none !important;
    border-left: 1px solid var(--bs-white) !important;
}

.save-arrow-btn {
    border-left: 1px solid white !important;
    padding: 7px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

body[data-rtl="true"] .save-arrow-btn {
    border-left: none !important;
    border-right: 1px solid white !important;
}

.save-btn-group:hover {
    background-color: var(--bs-green-color) !important;
}

.save-arrow-btn svg {
    color: white;
}

.edit-review-dropdown li a {
    width: 180px !important;
    color: var(--bs-black);
}

.edit-review-dropdown li:hover>a {
    /* background-color: var(--bs-bg-hover) !important; */
    background-color: var(--bs-success-light) !important;
    color: var(--bs-black);
}

.edit-review-dropdown li a svg {
    filter: brightness(1) invert(0);
}

body[data-theme="dark"] .edit-review-dropdown li a svg {
    filter: brightness(0) invert(1);
}

.save-btn-group .disabled {
    opacity: 0.6;
    pointer-events: none;
}

.subscription-package-card {
    background-color: var(--bs-white);
    border: 1px solid var(--bs-border-medium);
    color: var(--bs-black);
}

body[data-theme="dark"] .subscription-package-card {
    /* border: 1px solid var(--bs-border-medium); */
    background-color: var(--bs-invite-modal-bg-color) !important;
    border: 1px solid #E3E8EF33;
}

.subscription-plan-title {
    margin-left: 21px;
    margin-top: -15px;
    color: var(--bs-text-primary);
}

.subscription-card-price {
    color: var(--bs-green-color);
    position: relative;
    top: -15px;
}

.subscription-price-currency {
    font-size: 12px;
    position: relative;
    top: -1px;
    color: var(--bs-text-primary);
}

.subscription-per-month-text {
    margin-top: -23px;
    font-weight: 500;
    color: var(--bs-text-primary);
}

.subscription-description-text {
    font-weight: 500;
    margin-left: 22px;
    color: var(--bs-text-primary);
}

body[data-rtl="true"] .subscription-description-text {
    margin-left: 0;
    margin-right: 22px;
}

.subscription-description-icon {
    color: var(--bs-green-color);
}

.current-active-plan-bar {
    background-color: var(--bs-green-color);
    width: 20px;
    height: 10px;
    position: absolute;
    top: 17px;
    left: -1px;
}

body[data-rtl="true"] .current-active-plan-bar {
    left: auto;
    right: 0px;
}

body[data-theme="dark"] .current-active-plan-bar {
    background-color: var(--bs-black);
}

.subscription-package-card.active {
    background-color: var(--bs-blue-dark);
    border: 1px solid var(--bs-green-color);
}

body[data-theme="dark"] .subscription-package-card.active {
    background-color: var(--bs-green-color) !important;
    border: 1px solid var(--bs-green-color) !important;
    color: var(--bs-white);
}

.subscription-package-card:not(.active) .subscription-plan-title {
    color: var(--bs-text-black-primary);
}

.subscription-package-card:not(.active) .subscription-price-currency {
    color: var(--bs-green-color);
}

body[data-theme="dark"] .subscription-package-card.active .subscription-price-currency,
.subscription-package-card.active .subscription-card-price {
    color: var(--bs-white);
}

.subscription-package-card:not(.active) .subscription-description-text {
    color: var(--bs-text-black-primary);
}

.subscription-package-card:not(.active) .subscription-per-month-text {
    color: var(--bs-text-black-primary);
}

.select-package-btn {
    color: var(--bs-black);
    padding: 8px;
    letter-spacing: .8px;
    background-color: var(--bs-green-color);
    border: 1px solid var(--bs-green-color);
}

body[data-theme="dark"] .select-package-btn {
    /* color: var(--bs-white) !important; */
    /* border: 1px solid var(--bs-border-medium) !important; */
    border: 1px solid #E3E8EF33;
    font-weight: 500;
}

.subscription-package-card:not(.active) .select-package-btn {
    background-color: var(--bs-blue-dark);
    /* border: 1px solid var(--bs-blue-dark); */
    border: 1px solid #E3E8EF33;
    color: var(--bs-white);
}

.subscription-package-card.active .select-package-btn {
    background-color: var(--bs-green-color);
    border: 1px solid var(--bs-green-color);
    color: var(--bs-white);
}

body[data-theme="dark"] .subscription-package-card.active .select-package-btn {
    border: 1px solid #0E375F !important;
}


body[data-theme="dark"] .subscription-package-card:not(.active) .select-package-btn {
    color: var(--bs-black);
}

.subscription-package-card.active .subscription-plan-title {
    color: var(--bs-white);
}

.subscription-package-card.active .subscription-description-text,
.subscription-package-card.active .subscription-price-currency,
.subscription-package-card.active .subscription-per-month-text {
    color: var(--bs-white);
}

.subscription-package-card.active .subscription-price-currency {
    font-weight: 400;
}

.new-divider-icon {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    background-color: var(--bs-danger);
    width: 5px;
    height: 5px;
    border-radius: 30px;
}

body[data-theme="dark"] .new-divider-icon {
    background-color: var(--bs-danger);
}

/* Sidebar is always on the right — dot always anchors to right edge */
body[data-rtl="true"] .new-divider-icon {
    /* right: 5px;
    left: auto; */
    left: 5px;
    right: auto;
    transform: translateY(-50%);
}

.new-case-red-icon {
    position: relative;
    top: -14px;
    left: 6px;
}

/* body[data-theme="dark"] .lang-close-btn,
body[data-theme="dark"] .feedback-close-btn {
    background-color: var(--bs-card-bg);
    color: var(--bs-text-primary);
} */



/* ============================= */
/* THEME TOGGLE BUTTON */
/* ============================= */

.theme-toggle {
    width: 56px;
    height: 30px;
    background-color: var(--bs-bg-light);
    border-radius: 32px;
    border: none;
    padding: 4px;
    position: relative;
    left: -42px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.theme-toggle .toggle-thumb {
    width: 22px;
    height: 22px;
    padding: 10px;
    background-color: var(--bs-white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s ease;
}

.theme-toggle img {
    width: 15px;
    height: 15px;
}

/* Dark mode position */
body[data-theme="dark"] .theme-toggle {
    background-color: var(--bs-bg-sidebar);
    /* border: 2px solid var(--bs-border-color); */
    border: 1px solid #FFFFFF33;
}

body[data-theme="dark"] .theme-toggle .toggle-thumb {
    background-color: var(--bs-success);
    transform: translateX(21px);
    margin-left: 4px;
    margin-top: -1px;
}

#inviteFriendsModal .modal-dialog .modal-content {
    background-color: var(--bs-invite-modal-bg-color);
}

#inviteFriendsModal .modal-dialog .modal-content .modal-header h3 {
    color: var(--bs-black);
}

body[data-theme="dark"] .swal2-popup {
    background-color: var(--bs-invite-modal-bg-color) !important;
    color: var(--bs-black) !important;
}

.swal2-title,
.swal2-html-container {
    color: var(--bs-black) !important;
}

body[data-theme="dark"] .swal2-success-circular-line-right {
    background-color: transparent !important;
}

body[data-theme="dark"] .swal2-success-circular-line-left {
    background-color: transparent !important;
}

body[data-theme="dark"] .swal2-success-fix {
    background-color: transparent !important;
}





.delete-tooltip-wrapper {
    position: relative;
    display: inline-block;
}

body[data-theme="dark"] .delete-tooltip {
    background-color: var(--bs-invite-modal-bg-color) !important;
}

.delete-tooltip {
    display: none;
    position: absolute;
    /* top: -160px; */
    /* left: 50%; */
    left: 0%;
    transform: translateX(-50%);
    width: 280px;
    padding: 18px;
    border-radius: 10px;
    background: var(--bs-white);
    text-align: center;
    z-index: 9999;
}

.delete-tooltip h3 {
    font-size: 22px;
    margin-bottom: 10px;
    margin-top: 10px;
    color: var(--bs-black);
}

.delete-tooltip p {
    font-size: 14px;
    margin-bottom: 15px;
}

.delete-tooltip-buttons {
    display: flex;
    justify-content: center;
    gap: 30px;
    align-items: center;
}

.delete-tooltip .cancel-link1,
.delete-tooltip .cancel-link2,
#cancel-selection-btn,
#cancel-selection-btn2,
.cancel-plan-link {
    background-color: transparent !important;
    color: var(--bs-link-color);
    cursor: pointer;
    font-weight: 500;
    border: none;
}


body[data-theme="dark"] .delete-tooltip .cancel-link1,
body[data-theme="dark"] .delete-tooltip .cancel-link2,
body[data-theme="dark"] #cancel-selection-btn,
body[data-theme="dark"] #cancel-selection-btn2 {
    color: var(--bs-black);
}


.delete-tooltip-wrapper:hover .delete-tooltip {
    display: block;
}

.delete-case-btn,
.delete-case-btn2 {
    background-color: var(--bs-danger);
    color: var(--bs-white);
    border: none;
    padding: 4px;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 5px;
}

body[data-theme="dark"] .delete-case-btn {
    color: var(--bs-black);
}
body[data-theme="dark"] .delete-case-btn2 {
    color: var(--bs-black);
}

.cancel-plan-btn {
    background-color: var(--bs-danger);
    color: var(--bs-white);
    border: none;
    padding: 4px;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 5px;
}

body[data-theme="dark"] .cancel-plan-btn {
    color: var(--bs-black);
}

#delete-selected-btn,
#delete-selected-btn,
#delete-selected-btn2,
#delete-selected-btn2:hover {
    background-color: var(--bs-danger) !important;
}


.start-another-session-alert {
    width: 574px;
    height: 40px;
    padding: 8px 12px;
    border-radius: 8px;
    border: 1px solid #E3E8EF;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.08);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 16px;
    color: #2B3A4A;
    font-weight: 500;;
}

.start-another-session-alert .alert-text {
    flex: 1;
}

.start-another-session-alert .alert-close {
    border: none;
    background: transparent;
    padding: 0;
    cursor: pointer;
}

/* #editCaseModalCrossIcon svg {
    fill: #374957 !important;
}

body[data-theme="dark"] #editCaseModalCrossIcon svg {
    filter: brightness(0) invert(1) !important;
} */
.edit-case-modal-header a {
    color: var(--bs-black);
}
.edit-case-modal-header a svg {
    fill: #374957;
}

body[data-theme="dark"] .edit-case-modal-header a svg {
    filter: brightness(0) invert(1);
}



.custom-toast {
    margin-left: -40px;
    margin-top: 50px;
    max-width: 270px;
    /* max-height: 70px; */
    background-color: #ffffff;
    color: #0E375F;
    border-radius: 14px;
    padding: 10px;
    padding-bottom: 15px;
    min-width: 320px;
    box-shadow: #00000040;
}

body[data-theme="dark"] .custom-toast {
    background-color: #1D4872;
    border: 1px solid #1D4872;
    color: #ffffff;
}

.toast-wrapper {
    right: 70px !important;
}

.toast-wrapper.toast-shifted {
    right: 370px !important;
}


.toast-notification-text {
    font-size: 16px;
    font-weight: 500;
}

.toast-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #2dd4bf;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: #1d4872;
}

.notification-view-note-btn {
    border: 1px solid #E3E8EF;
    color: #0E375F;
    padding: 5px 10px;
    font-weight: 500;
    font-size: 12px;
    line-height: 10px;
    border-radius: 5px;
    margin-top: 5px;
}

body[data-theme="dark"] .notification-view-note-btn {
    background-color: #537494;
    border: 1px solid #537494;
    color: #ffffff;
}

.toast-notification-icon {
    filter: none;
    background-color: transparent;
    border: none;
    margin-top: -15px;
}

body[data-theme="dark"] .toast-notification-icon svg {
    filter: brightness(0) invert(1);
}



#notification-container {
    position: fixed;
    bottom: 24px;
    left: 24px;
    max-width: 600px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.notification {
    background-color: #ffffff;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.3), 0 10px 10px -5px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    padding: 15px 20px;
    width: 100%;
    transition: all 0.3s ease;
}

body[data-theme="dark"] .notification {
    background-color: #1D4872;
}

.notification-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.notification-title {
    display: flex;
    align-items: center;
    gap: 16px;
    font-weight: 500;
    font-size: 24px;
    color: #ffffff;
}

.notification-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #0E375F;
    flex-shrink: 0;
}

body[data-theme="dark"] .notification-icon { 
    background-color: #FFFFFF40;
}

.notification-icon svg {
    width: 28px;
    height: 28px;
    color: white;
    stroke-width: 2.5;
}

.notification-title-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.notification-text {
    font-weight: 500;
    color: #0E375F;
    font-size: 24px;
    position: relative;
    top: 2px;
}

body[data-theme="dark"] .notification-text { 
    color: white;
}

.notification-subtitle {
    font-size: 12px;
    font-weight: 500;
    color: #0E375F59;
    position: relative;
    top: -5px;
}

body[data-theme="dark"] .notification-subtitle { 
    color: white;
}

/* .notification-close-btn {
    background: none;
    border: none;
    color: #0E375F80;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s ease;
    flex-shrink: 0;
    margin-left: 20px;
    margin-top: -28px;
    position: relative;
    left: 10px;
}

body[data-theme="dark"] .notification-close-btn { 
    color: #FFFFFF40 !important;
} */
 .notification-close-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s ease;
    flex-shrink: 0;
    margin-left: 20px;
    margin-top: -28px;
    position: relative;
    left: 10px;
}

/* Light theme */
.notification-close-btn svg path {
    fill: #0E375F;
    fill-opacity: 0.5;
}

/* Dark theme */
body[data-theme="dark"] .notification-close-btn svg path {
    fill: #FFFFFF;
    fill-opacity: 0.5;
}

.notification-close-btn:hover {
    color: rgba(255, 255, 255, 0.9);
}

.notification-close-btn svg {
    width: 12.59px;
    height: 12.59px;
    stroke-width: 2.5;
}

.notification-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.progress-bar-container {
    width: 79%;
    background-color: #F6F8FB;
    border-radius: 9999px;
    height: 8px;
    overflow: hidden;
    margin-left: 56px;
    margin-top: -10px;
}

.progress-bar {
    height: 100%;
    border-radius: 9999px;
    transition: width 0.3s ease;
    background: #00D2C8;
    /* box-shadow: 0 0 10px rgba(34, 211, 238, 0.5); */
}

.progress-text {
    font-size: 12px;
    color: #0E375F;
    font-weight: 500;
    margin-top: -8px;
    margin-left: 56px;
}

body[data-theme="dark"] .progress-text { 
    color: #ffffff;
}


.notification.success .notification-icon {
    /* background-color: rgba(16, 185, 129); */
    background-color: #00D2C8;
}

.notification.success .progress-bar {
    /* background: linear-gradient(90deg, #10b981 0%, #059669 100%); */
    background: #00D2C8;
    /* box-shadow: 0 0 10px rgba(16, 185, 129, 0.5); */
    box-shadow: 0 0 10px #00D2C8;
}

.notification.warning .notification-icon {
    /* background-color: rgba(245, 158, 11); */
    background-color: #dc2626;
}

.notification.warning .progress-bar {
    /* background: linear-gradient(90deg, #f59e0b 0%, #d97706 100%); */
    background: #dc2626;
    /* box-shadow: 0 0 10px rgba(245, 158, 11, 0.5); */
    box-shadow: 0 0 10px #dc2626;
}

@media (max-width: 640px) {
    #notification-container {
        left: 16px;
        right: 16px;
        max-width: none;
    }

    .notification {
        padding: 20px;
    }

    .notification-icon {
        width: 48px;
        height: 48px;
    }

    .notification-icon svg {
        width: 24px;
        height: 24px;
    }

    .notification-text {
        font-size: 18px;
    }
}
.w-81 {
    width: 81%;
}

.password-validation-text {
    font-weight: 500;
    font-size: 16px;
    color: var(--bs-black);
}

.show-password-label {
    color: #0B1220;
    position: relative;
    top: 3px;
    font-size: 14px;
    font-weight: 500;
}

body[data-theme="dark"] .show-password-label {
    color: #ffffff;
}

.show-password-checkbox {
    width: 20px;
    height: 20px;
}

.show-password-checkbox:checked {
    background-color: var(--bs-green-color) !important;
    border-color: var(--bs-green-color) !important;
}

body[data-theme="dark"] .form-check.form-check-solid input.show-password-checkbox:not(:checked) {
    background-color: #ffffff !important;
}
.d-none-important{
    display:none !important;
}

.d-block-important{
    display:block !important;
}

.cancel-confirm-box,
.confirm-box {
    position: absolute;
    background: var(--bs-white);
    width: 180px;
    padding: 18px;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    z-index: 999;
    margin-top: 8px;
    margin-inline-start: -45px;
}

body[data-theme="dark"] .cancel-confirm-box {
    background-color: var(--bs-invite-modal-bg-color) !important;
}
body[data-theme="dark"] .confirm-box {
    background-color: var(--bs-invite-modal-bg-color) !important;
}

/* Optional arrow (tooltip style) */
/* .cancel-confirm-box::before {
    content: "";
    position: absolute;
    top: -6px;
    left: 20px;
    width: 12px;
    height: 12px;
    background: #fff;
    transform: rotate(45deg);
    box-shadow: -2px -2px 5px rgba(0,0,0,0.05);
} */

.cancel-confirm-box p,
.confirm-box p {
    font-size: 14px;
    color: var(--bs-black);
    margin-bottom: 12px;
}
body[data-theme="dark"] .cancel-confirm-box p {
    color: var(--bs-black);
}
body[data-theme="dark"] .confirm-box p {
    color: var(--bs-black);
}
.cancel-confirm-box .cancel-plan-link {
    color: var(--bs-black);
}
.confirm-box .cancel-plan-link {
    color: var(--bs-black);
}
body[data-theme="dark"] .cancel-plan-link {
    color: var(--bs-black);
}
.logo-invert {
    filter: invert(1);
}
body[data-theme="dark"] #openLogo {
    filter: brightness(0) invert(1);
}
body[data-theme="dark"] #start-session-logo {
    filter: brightness(0) invert(1);
}
body[data-theme="dark"] #closedLogo {
    filter: brightness(0) invert(1);
}

.record-btn {
    position: relative;
    border-radius: 50%;
    animation: pulse 1.8s infinite;
}
@keyframes pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(0, 210, 200, 0.6);
    }
    70% {
        transform: scale(1.05);
        box-shadow: 0 0 0 12px rgba(0, 210, 200, 0);
    }
    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(0, 210, 200, 0);
    }
}


.language-menu {
    position: relative;
}

/* Dropdown hidden by default */
.language-dropdown {
    position: absolute;
    top: 0;
    right: 100%; 
    margin-right: 10px;

    min-width: 150px;
    background: #fff;
    border-radius: 8px;
    padding: 8px 0;

    box-shadow: 0 10px 25px rgba(0,0,0,0.1);

    opacity: 0;
    visibility: hidden;
    transform: translateX(10px);
    transition: all 0.25s ease;
    z-index: 999;
}

.language-menu:hover .language-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

.language-dropdown .dropdown-item {
    padding: 8px 15px;
    cursor: pointer;
    transition: 0.2s;
}

.language-dropdown .dropdown-item:hover {
    background: #f5f5f5;
}




/* Default (Light Theme) */
.header-lang-menu {
    background-color: #ffffff;
}

.header-lang-menu .dropdown-item {
    color: #000000;
}

/* Dark Theme */
body[data-theme="dark"] .header-lang-menu {
    background-color: #072E55 !important;
}

body[data-theme="dark"] .header-lang-menu .dropdown-item {
    color: #ffffff !important;
}

/* Active item (optional better UX) */
body[data-theme="dark"] .header-lang-menu .dropdown-item.active {
    background-color: rgba(255, 255, 255, 0.1);
}

.header-lang-menu .dropdown-item.active {
    background-color: rgba(0, 0, 0, 0.05);
}

/* Light theme hover */
.header-lang-menu .dropdown-item:hover {
    color: #000000 !important;
}

/* Dark theme hover */
body[data-theme="dark"] .header-lang-menu .dropdown-item:hover {
    color: #ffffff !important;
}

/* Light theme (default) */
.header-lang-trigger {
    color: #000000;
}

/* Dark theme */
body[data-theme="light"] .header-lang-trigger {
    color: #000000 !important;
}
body[data-theme="dark"] .header-lang-trigger {
    color: #ffffff !important;
}

.header-lang-dropdown {
    align-items: center;
    display: flex;
    gap: 4px;
    background: transparent;
    border: 1px solid #E6E6E6;
    border-radius: 8px;
    padding: 3px 10px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    color: var(--text-primary);
    transition: all 0.2s;
} 

.header-lang-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    /* background: var(--bg-surface); */
    border: 1px solid var(--border-subtle);
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    min-width: 180px;
    padding: 6px;
    /* opacity: 0; */
    /* visibility: hidden; */
    transform: translateY(6px);
    transition: all 0.2s ease;
    z-index: 1001;
    margin-top: 10px !important;
    margin-inline-start: 15px !important;
}
.native-name {
    font-weight: 500;
    font-size: 13px;
    color: #09263a !important;
    font-family: 'arial';
}
.english-name {
    font-weight: 600;
    font-size: 12px;
    color: #526675 !important;
    font-family: 'arial';
}
.lang-change-btn {
    border-radius: 6px !important;
}
.lang-change-btn:hover {
    background-color: rgba(0, 0, 0, 0.04) !important;
}
.lang-change-btn.active {
    background-color: #3bc5d61a !important;
}

body[data-theme="dark"] .lang-change-btn:hover {
    background-color: #00d2c81A !important;
}

body[data-theme="dark"] .native-name {
    color: #fff !important;
}

body[data-theme="dark"] .english-name {
    color: #fff !important;
}


.sidebar-tooltip {
    position: absolute;
    right: calc(100% + 10px);
    top: 50%;
    transform: translateY(-50%);
    background: #173b71;
    color: #fff;
    font-size: 12px;
    padding: 6px 10px;
    border-radius: 6px;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    pointer-events: none;
}

.sidebar-tooltip::after {
    position: absolute;
    top: 50%;
    left: 100%;
    transform: translateY(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: transparent transparent transparent #173b71;
}

.logo-container:hover .sidebar-tooltip {
    opacity: 1;
    visibility: visible;
}

#sidebarToggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.sidebar-tooltip {
    position: absolute;
    right: calc(100% + 25px);
    top: 50%;
    transform: translateY(-50%);
    background: #0E375F;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    padding: 8px 12px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: 0.2s ease;
    pointer-events: none;
    z-index: 999;
}

.sidebar-tooltip span svg {
    position: absolute;
    right: -18px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    overflow: visible;
    fill: #0E375F;
}

body[data-theme="dark"] .sidebar-tooltip span svg {
    fill: #ffffff;
}

#sidebarToggle:hover .sidebar-tooltip {
    opacity: 1;
    visibility: visible;
}

.sidebar-hover-indicator {
    position: absolute;
    top: 50%;
    left: 30%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    z-index: 9999;
    cursor: pointer;
}
.sidebar-hover-indicator svg {
    fill: #0B3B70;
}

body[data-theme="dark"] .sidebar-hover-indicator svg {
    fill: #ffffff;
}

.sidebar-hover-indicator {
    display: none;
}

.right-sidebar:not(.expanded):hover .sidebar-hover-indicator {
    /* background-color: rgba(11, 59, 112, 0.1); */
    display: block;
    cursor: pointer;
}

body[data-rtl="true"] .right-sidebar:not(.expanded):hover .sidebar-hover-indicator {
    margin-left: -10px;
}
body[data-rtl="true"] #sidebarToggle {
    left: 3px;
}

.case-spinner {
    position: relative;
    right: -15px;
    margin-left: -5px;
    color: #dc2626;
    width: 10px;
    height: 10px;
    border-radius: 30px;
}
.copy-invite-link:hover {
    cursor: pointer;
}

#case-save-toast,
#invite-message-toast {
    position: absolute;
    top: 83%;
    left: 64%;
    background: #F6F8FB;
    color: #000000;

    padding: 2px 12px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    opacity: 1;
    visibility: visible;
    z-index: 100000;
}

body[data-rtl="true"] #case-save-toast {
    right: 64%;
}

body[data-rtl="true"] #invite-message-toast {
    right: 64%;
}

#invite-message-toast {
    top: 67% !important;
}

body[data-theme="dark"] #case-save-toast {
    background: #ffffff;
    color: #000000;
}
body[data-theme="dark"] #invite-message-toast {
    background: #ffffff;
    color: #000000;
}

#case-save-toast.show,
#invite-message-toast.show {
    opacity: 1;
    visibility: visible;
    top: -50px;
}

.pathway-dropdown .dropdown-toggle.show,
.pathway-dropdown .dropdown-toggle:focus,
.pathway-dropdown .dropdown-toggle:active{
    background-color: #f6f8fb !important;
    color: #28476B !important;
    border-color: #f6f8fb !important;
    box-shadow: none !important;
}

body[data-theme="dark"] .pathway-dropdown .dropdown-toggle.show,
body[data-theme="dark"] .pathway-dropdown .dropdown-toggle:focus,
body[data-theme="dark"] .pathway-dropdown .dropdown-toggle:active{
    background-color: transparent !important;
    color: #ffffff !important;
    border: 2px solid var(--bs-border-color) !important;
    box-shadow: none !important;
}

#uploadForm {
    margin-top: 150px !important;
}