html,
body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f5f5f5;
    min-height: 100vh;
    overflow-x: hidden;
    height: 100vh;
}

.page {
    background-color: #f5f5f5;
    min-height: 100vh;
}

p {
    margin: 0;
}

h3 {
    margin: 0;
}

a,
.btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    /* padding-top: 1.1rem; */
}

h1:focus {
    outline: none;
}

.valid.modified:not([type="checkbox"]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary::after {
    content: "An error has occurred.";
}

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

/* Login Page Styles */
.login-logo {
    width: 164px !important;
    height: auto !important;
}

.login-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    row-gap: 20px;
    column-gap: 20px;
    max-width: 450px;
    height: 420px;
    width: 100%;
    margin: auto;
    padding-left: 40px;
    padding-right: 40px;
    border-radius: 15px;
    background: white;
}

.login-title {
    font-size: 20px;
    font-weight: 300;
    color: #0aa9d0;
    cursor: pointer;
}

.login-container {
    background-image: url("/css/assets/login-bg.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-content {
    box-shadow: 0px 0px #00000070;
    padding-top: 80px;
    padding-bottom: 80px;
    margin-top: 20px;
    margin-bottom: 20px;
    overflow: visible;
    display: flex;
    align-items: center;
    justify-content: center;
    order: initial;
    border-color: inherit;
    background-color: var(--ast-global-color-5);
}

.coreflex-logo {
    width: 300px;
}

/* Navigation Styles - Comprehensive Fix */
.sidebar {
    /*background-color: #edf7fa;*/
    width: 320px;
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1000;
    overflow-y: auto;
    box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
}

.top-row {
    background-color: #0aa9d0;
    padding: 15px 0;
    border-bottom: 1px solid #0891b2;
}

    .top-row .container-fluid {
        display: flex;
        justify-content: center;
        align-items: center;
    }

.nav-menu-container {
    display: flex !important;
    justify-content: space-between;
}

.top-navbar-right {
    display: flex;
    align-content: center;
    gap: 12px;
}

.sidenav-btn {
    background-color: #0aa9d0 !important;
    transition: all 0.3s ease !important;
    padding: 20px;
    color: white;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.add-new-matter-icon {
    width: 15px;
    height: 15px;
}

.nav-scrollable {
    padding: 20px 0;
    height: calc(100vh - 80px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

    .nav-scrollable nav {
        flex: 1;
    }

.nav-item {
    margin-bottom: 5px;
}

.nav-icon {
    width: 22px;
    height: 22px;
}

.nav-link {
    display: flex !important;
    align-items: center !important;
    color: #424242 !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    /* padding: 15px 25px !important; */
    text-decoration: none !important;
    border-radius: 8px !important;
    transition: all 0.3s ease !important;
    background: transparent !important;
    border: none !important;
}

    .nav-link:hover {
        background-color: #e3f2fd !important;
        color: #0aa9d0 !important;
        transform: translateX(5px) !important;
    }

    .nav-link span {
        /* margin-right: 12px !important; */
        font-size: 18px !important;
        width: 20px !important;
        text-align: center !important;
        display: inline-block !important;
    }

/* Impersonate User Section */

.impersonate-user-text {
  font-size: 14px;
  color: #666;
  font-weight: 500;
}

.custom-dropdown-toggle {
    background-color: white !important;
    width: 100% !important;
    text-align: start !important;
    color: #333 !important;
    border: 1px solid #ddd !important;
    padding: 8px 12px !important;
    border-radius: 4px !important;
    font-size: 14px !important;
}

    .custom-dropdown-toggle:hover {
        background-color: #f8f9fa !important;
    }

/* Privacy Policy Section */
.privacy-policy-container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 30px;
}

.privacy-policy {
    padding: 15px 25px;
}

.privacy-policy-logo {
    width: 149px;
    height: auto;
}

.privacy-policy-btn {
    color: #0aa9d0;
    font-size: 14px;
    font-weight: 500;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.privacy-policy-text {
    width: 20ch;
    text-align: center;
    font-size: 16px;
    color: #232323;
    font-weight: 500;
}

.privacy-policy-btn:hover {
    color: #0891b2;
}

/* Main Content Area */
main {
    /* margin-left: 320px; */
    /* padding: 20px; */
    min-height: 100vh;
    background-color: #edf7fa !important;
}

/* Responsive Design */
@media (max-width: 768px) {
    .sidebar {
        width: 100%;
        height: auto;
        position: relative;
    }

    main {
        margin-left: 0;
    }

    .nav-link {
        margin: 0 10px !important;
        padding: 12px 20px !important;
    }
}

/* Dashboard Styles */
.dashboard-container {
    padding: 20px;
    max-width: 100% !important;
    margin: 0 auto;
}

.dashboard-title {
    color: #333;
    margin-bottom: 30px;
    font-size: 28px;
    font-weight: 600;
}

.dashboard-upper-section {
    display: flex;
    gap: 20px;
    margin-bottom: 40px;
}

.snapshot-container {
    width: 66%;
    background: white;
    border-radius: 8px;
    padding: 40px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.snapshot-text {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 15px;
}

.snapshot-inner-container {
    display: flex;
    gap: 20px;
}

.snapshot-inner-container-left,
.snapshot-inner-container-right {
    flex: 1;
    text-align: center;
}

.snapshot-inner-container-left {
    border-right: 1px solid #e0e0e0;
}

.snapshot-inner-container-left-text {
    font-size: 14px;
    color: #666;
    margin-bottom: 5px;
}

.snapshot-inner-container-left-number {
    font-size: 86px !important;
    font-weight: bold;
    color: #0aa9d0;
    margin-bottom: 10px;
}

.dashboard-bg {
    background: white !important;
}

.snapshot-inner-container-left-link {
    color: #070617;
    text-decoration: underline;
    font-size: 14px;
    font-weight: 300;
}

.portfolio-reporting-container {
    /* flex: 1; */
    background: white;
    background-color: rgb(0, 159, 191);
    border-radius: 8px;
    padding: 40px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    width: 34%;
    background-image: url("/css/assets/portfolio-bg.png");
    background-size: cover;
    background-repeat: no-repeat;
}

.portfolio-reporting-text {
    font-size: 18px;
    font-weight: 600;
    color: white;
    margin-bottom: 15px;
}

.portfolio-reporting-inner-container-left-text {
    color: white;
    text-decoration: none;
    font-size: 14px;
    cursor: pointer;
}

.header {
    padding: 40px !important;
}

.sortable-header {
    font-size: 12px !important;
}

.terms-header {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
}

.matter-table {
    background-color: white;
}

.matter-table-wrapper {
    background-color: white;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.portfolio-reporting-inner-container-left-text:hover {
    text-decoration: underline;
}

.matter-table-wrapper-inner {
    border: 0.5px solid #80808021;
    border-radius: 30px
}
/* Recent Matters Table */
.container {
    background: #edf7fa;
    border-radius: 8px;
    padding: 40px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin: 0 !important;
    max-width: 100% !important;
}

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

.recent-matters-title {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.generic-header-input {
    background-color: white;
    border: 1px solid #80808021;
    border-radius: 30px;
    padding: 10px;
    width: 205px;
    /* margin-bottom: 20px; */
}

.matter-table-bg {
    background: #edf7fa !important;
    padding: 10px !important;
    border-radius: 30px !important;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.header-buttons {
    display: flex;
    gap: 15px;
    align-items: center;
}

.link {
    color: #0aa9d0;
    text-decoration: none;
    font-size: 14px;
}

    .link:hover {
        text-decoration: underline;
    }

.new-matter {
    background: #0aa9d0;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
}

    .new-matter:hover {
        background: #0891b2;
    }

/* Table Styles */
.table-overflow {
    display: block;
    overflow-x: auto;
}
/* Table Styles */
.table-overflow {
    display: block;
    overflow-x: auto;
}
table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

thead {
    background: #f8f9fa;
}

th {
    padding: 12px;
    text-align: left;
    font-weight: 500;
    color: #424242;
    border-bottom: 0.5px solid #dee2e6;
    font-size: 14px !important;
    background: white;
}

td {
    padding: 18px;
    /* border-bottom: 1px solid #dee2e6; */
}

.matter-name-th {
    display: flex;
    align-items: center;
    gap: 10px;
}

.matter-row:hover {
    background: #0aa9d0;
    color: white;
}

.matter-link {
    color: #424242;
    text-decoration: none;
    font-weight: 500;
}

    .matter-link:hover {
        text-decoration: underline;
        color: white;
    }

.matter-name-th {
    display: flex;
    align-items: center;
    gap: 10px;
}

.status {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

    .status.active {
        background: #d4edda;
        color: #155724;
    }

.top-navbar {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
}

.top-navbar-left {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.top-navbar-left {
    display: flex;
    align-items: center;
    gap: 10px !important;
}
/* Responsive Design */
@media (max-width: 768px) {
    .dashboard-upper-section {
        flex-direction: column;
    }

    .snapshot-inner-container {
        flex-direction: column;
        gap: 15px;
    }

    .header {
        flex-direction: column;
        gap: 15px;
        align-items: flex-start;
    }

    .header-buttons {
        width: 100%;
        justify-content: space-between;
    }
}

/* Client Admin Styles */

.client-admin-container {
    background-color: white;
    border-radius: 12px;
    padding: 30px 40px;
    max-width: 600px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin: 20px;
}

.client-admin-header {
    background-color: #daf1f7;
    padding: 20px 30px;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    font-weight: bold;
    font-size: 16px;
    color: #424242;
    font-weight: 800;
    margin: -30px -40px 20px -40px;
    letter-spacing: 1px;
}

label {
    font-weight: bold;
    display: block;
    margin-bottom: 8px;
    color: #222;
}

select {
    width: 100%;
    padding: 10px;
    margin-bottom: 30px;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-size: 14px;
}

.form-group {
    margin-bottom: 25px;
}

.form-label {
    font-size: 13px;
    font-weight: 800;
    color: #112337;
}

.radio-group {
    display: flex;
    gap: 20px;
    margin-top: 5px;
}

.section-group {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
}

.section {
    flex: 1 1 150px;
}

input[type="radio"] {
    accent-color: #0ca9e8;
}

.save-button {
    background-color: #0aa9d0;
    color: white;
    padding: 12px 30px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    cursor: pointer;
    margin-top: 20px;
    font-weight: 500;
}

    .save-button:hover {
        background-color: #0794ca;
    }

.radio-input {
    width: 20px;
    height: 20px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    border: 0.5px solid #424242;
    border-radius: 50%;
    cursor: pointer;
}

    .radio-input:checked::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 7px;
        height: 7px;
        padding: 4px;
        background-color: #0794ca;
        border-radius: 50%;
        transform: translate(-50%, -50%);
    }

.radio-label {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* User Management */

.user-management-title {
    font-size: 24px !important;
    font-weight: 600;
    color: #424242;
    margin: 0;
}

.mud-container-maxwidth-lg {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
}

.mud-tab.mud-tab-active {
    color: #0aa9d0 !important;
}

.mud-tab-slider-horizontal {
    height: 4px !important;
    background-color: #0aa9d0 !important;
}

.mud-tabs-panels {
    background-color: #edf7fa !important;
    margin: 40px !important;
}

@media (min-width: 641px) {
    .page {
        article .content

{
    padding-left: 0 !important;
    padding-right: 0 !important;
}

}
}

.page {
    .mud-paper.mud-elevation-1

{
    padding: 0 !important;
    padding-top: 20px !important;
}

}

.user-management-title {
    padding: 40px;
}
/*.mud-table-container {
  padding-left: 50px;
  padding-right: 50px;
  padding-bottom: 50px;
}*/
.mud-table {
    /* border-radius: 24px !important; */
}

.mud-table-row {
    th

{
    border-bottom: 0.5px solid #80808021 !important;
    background: white !important;
    border-style: dotted;
}

td {
    border: none !important;
}

}

.mud-table-row:hover {
    background: #0aa9d0 !important;
    color: white !important;
}

.mud-table-striped
.mud-table-container
.mud-table-root
.mud-table-body
.mud-table-row:nth-of-type(odd) {
    background: transparent !important;
}

.mud-icon-root.mud-svg-icon {
    fill: black !important;
}

.mud-input {
    width: 200px !important;
    background: white;
    padding: 5px;
    border-radius: 24px;
}

.mud-input-control-input-container {
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    margin: 12px;
}

.mud-input.mud-input-underline:before {
    border-bottom: none !important;
}

.mud-input.mud-input-underline:after {
    border-bottom: none !important;
}

.mud-tabs {
    background-color: #edf7fa;
}

.mud-tabs-panels {
    border: 0.5px solid lightgrey;
    border-radius: 24px;
}

.mud-table-row:hover {
    background: #0aa9d0 !important;
}

.mud-table-root {
    margin-top: 0;
    /* border: 0.5px solid lightgrey; */
    color: #424242 !important;
}

.mud-tab {
    text-transform: capitalize !important;
    letter-spacing: 0.5px !important;
}

.add-terms-button {
    background-color: #0aa9d0 !important;
    color: white !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    padding: 10px 20px !important;
    border-radius: 12px !important;
    text-transform: capitalize !important;
    margin-bottom: 12px !important;
}

.terms-container {
    margin: 20px !important;
    padding-top: 20px !important;
}

.user-list-title {
    padding-left: 40px !important;
    padding-top: 20px !important;
    padding-bottom: 20px !important;
    padding-right: 40px !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    color: #424242 !important;
}

.terms-title {
    padding: 0 !important;
}

.mud-input-control-input-container {
    display: block !important;
    padding: 5px !important;
    border-radius: 24px !important;
    /* border: 1px solid #e0e0e0 !important; */
    width: 220px !important;
    height: 30px;
}

.mud-input-control {
    flex: 0 1 auto !important;
}

.mud-table-toolbar {
    padding-inline-end: 20px !important;
    margin-left: 35px !important;
    margin-right: 50px !important;
    background-color: #edf7fa;
    border-radius: 24px !important;
}

.mud-drop-container {
    margin-top: 12px;
}

.terms-card {
    margin: 20px !important;
    border-radius: 24px !important;
}

.mud-table-pagination-select .mud-input .mud-input-root {
    max-width: 100% !important;
}

.mud-table-root .mud-table-body .mud-table-cell {
    color: #424242 !important;
}

td {
    border: none !important;
    &:first-child

{
    border-top-left-radius: 24px !important;
    border-bottom-left-radius: 24px !important;
    color: white;
}

&:last-child {
    border-top-right-radius: 24px !important;
    border-bottom-right-radius: 24px !important;
}

}

.terms-btn-wrapper {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
}

.version-container {
    border-bottom: 0.5px solid #666;
    margin-bottom: 12px;
}

.view-terms-container {
    margin: 40px;
}

.custom-pagination {
    display: flex;
    align-items: center;
    padding: 10px;
    justify-content: flex-end;
    gap: 12px;
    color: #232323;
}

.pagination-field {
    width: 200px;
}

/*Edit Role*/
.user-label select.role-select {
    display: block;
    width: 100%;
    margin-top: 8px;
    padding: 10px 12px;
    border: 1px solid #2196c9;
    border-radius: 4px;
    font-size: 1.1rem;
    color: #444;
    background: #fff;
    outline: none;
    text-align: start;
    font-size: 14px;
}

.update-role-btn {
    margin-top: 32px;
    background: #00b3df;
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 14px 40px;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}

    .update-role-btn:hover {
        background: #009ac1;
    }

.edit-user-role-container {
    padding: 40px;
}

.edit-user-role-card {
    margin: 50px;
    background: white;
    border-radius: 24px;
    padding: 40px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.user-label {
    width: 100%;
}

.edit-user-role-title {
    font-size: 24px;
    font-weight: 500 !important;
    color: #424242;
    margin: 0;
    text-align: start;
    margin-bottom: 12px;
    width: 100%;
}

.update-role-btn-container {
    display: flex;
    justify-content: flex-start;
    width: 100%;
}

.btn-active {
    background: #b4f3b4 !important;
    padding: 6px 12px !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #424242 !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.matter-overview-header {
    display: flex;
    align-items: center;
    gap: 12px;
}

.relativity-icon {
    width: 210px;
    height: 31px;
}

.matter-overview-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.workspaces-title {
    font-size: 16px;
    color: #070614;
    font-weight: 500;
    margin-bottom: 20px;
}

.workspaces-container {
    /*    background-color:white !important;*/
    /*    padding: 40px;*/
    border-radius: 24px;
    border-color: inherit;
    background-color: var(--ast-global-color-5);
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    row-gap: 10px;
    column-gap: 20px;
    /*    max-width: 50% !important;*/
    /*    box-shadow: 0px 2px 5px -1px #00000070;*/
}

.mud-tabs-panels {
    border: none !important;
}

.matter-details-icon {
    width: 30px;
    height: 30px;
}

.matter-details-icon-container {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #424242;
}

.matter-details-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    color: #424242;
}

.workspaces-list {
    color: white;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 10px;
}

.workspace-list-item {
    display: flex;
    gap: 20px;
    background-color: #0aa9d0;
    padding: 16px 36px;
    border-radius: 12px;
    width: 100%;
}

.workspaces-list-item-link {
    color: white;
    text-decoration: underline;
    &:hover

{
    color: white;
}

}

.workspaces-list-icon {
    width: 20px;
    height: 20px;
}

.manage-users-text-title {
    font-size: 36px;
    font-weight: 600;
    color: #424242;
}

.manage-users-text-subtitle {
    font-size: 16px;
    font-weight: 400;
    color: #1f962d;
    & span

{
    color: #424242;
}

}

.manage-users-button {
    font-size: 18px;
    font-weight: 700;
    text-decoration: underline;
    color: #0aa9d0;
}

.manage-users-container {
    display: flex;
    align-items: center;
    width: 49%;
    background: #0aa9d0;
    /* padding: 20px; */
    border-radius: 24px;
    box-shadow: 0px 2px 5px -1px #00000070;
    margin-bottom: 20px;
}

.manage-users-icon-container {
    width: 25%;
    background: #0aa9d0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.manage-users-text {
    padding: 40px;
    width: 75%;
    background-color: white;
    border-radius: 0 24px 24px 0;
}

.manage-users-icon {
    width: 50px;
    height: 50px;
}

.reports-container {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
    position: relative;
}

.reports-container-wrapper {
    width: 49%;
    background: #0aa9d0;
    border-radius: 24px;
    box-shadow: 0px 2px 5px -1px #00000070;
    height: 180.8px;
    padding: 40px;
    /* background-image: url("/css/assets/matter-overview-reports-bg.png");
    background-size: cover;
    background-repeat: no-repeat; */
    position: relative;
}
/* .reports-container-wrapper::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("/css/assets/matter-overview-reports-bg.png");
    background-size: cover;
    background-repeat: no-repeat;
} */
.manage-users-container-wrapper {
    display: flex;
    justify-content: space-between;
}

.reports-text {
    font-size: 24px;
    font-weight: 600;
    color: white;
}

.reports-button {
    font-size: 18px;
    font-weight: 500;
    text-decoration: underline;
    color: white;
}

.reports-bg {
    position: absolute;
    width: fit-content;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    object-fit: cover;
}

.mud-tabs {
    color: #0aa9d0 !important;
}

.dataset-btn {
    background: #00b3df !important;
    color: white !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    padding: 10px 20px !important;
    border-radius: 12px !important;
    text-transform: capitalize !important;
    margin-bottom: 12px !important;
}

.data-table-header {
    background-color: #0aa9d0 !important;
    color: white !important;
}

/* Setting Css */

.settings-title {
    font-size: 24px !important;
    font-weight: 600 !important;
    color: #424242 !important;
    margin-bottom: 24px !important;
}

.custom-settings-input {
    width: 640px !important;
}

.custom-settings-dropdown-small {
    width: 312px !important;
}

.custom-setting-width {
    width: 22% !important;
}

.save-setting-button {
    background: #0aa9d0 !important;
    color: white !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    padding: 10px 20px !important;
    border-radius: 12px !important;
    text-transform: capitalize !important;
    margin-bottom: 12px !important;
}
.cancel-button {
    font-weight: 500 !important;
    font-size: 14px !important;
    padding: 10px 20px !important;
    border-radius: 12px !important;
    text-transform: capitalize !important;
    margin-bottom: 12px !important;
    background: #6c757d;
    color: white;
}
/* New Dataset Css */

.new-dataset-form {
    width: 600px;
    background: white;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0px 2px 5px -1px #00000070;
}

.geolocation-input {
    width: 118px !important;
    background: #f7fbfd !important;
}

.geolocation-container {
    width: 50% !important;
}

.geolocation-container-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
}

.radio-button-container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

.data-source-notes-input {
    background: #f7fbfd;
    height: 130px;
    border-radius: 12px;
    padding: 10px;
}

.text-area-container {
    display: flex;
    flex-direction: column;
}

.input-bg {
    background: #f7fbfd !important;
    padding: 10px !important;
    border: 1px solid #ced4da;
}

.file-upload-container {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.file-upload-input-container {
    border: 0.5px solid lightgray;
    background: #f7fbfd;
}

.dataset-mt-2 {
    margin-top: 16px !important;
}

.setting-row {
    display: flex;
    align-items: center;
    gap: 60px;
}

.custom-ml-2 {
    margin-left: 65px !important;
}
.custom-ml-3 {
    margin-left: 88px !important;
}
.file-upload-input-container {
    display: flex;
    align-items: center;
    border: 0.5px solid lightgray;
    background: #f7fbfd;
    border-radius: 8px;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.file-upload-input-container-left {
    border-right: 0.5px solid lightgray;
    /* margin: 10px; */
    color: #424242;
}

.file-upload-input-container-right {
    margin-left: 10px;
    color: #424242;
}

.file-upload-input-container-left-text {
    padding: 10px;
    cursor: pointer;
}

table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
}

th, td {
    padding: 10px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}

th {
    background-color: white;
    color: #424242;
    cursor: pointer;
}

.data-table-header {
    background-color: #0aa9d0 !important;
    color: white !important;
    font-size: 12px !important;
}

.data-table-row {
    font-size: 12px !important;
}

th span {
    font-size: 14px;
}

.data-table {
    border: 1px solid lightgray;
}
/* tr:nth-child(even) {
    background-color: #f9f9f9;
} */

tr:hover {
    background-color: #f1f1f1;
}

tr {
    color: #424242;
}

.info {
    float: left;
    padding: 10px;
}

td {
    &:first-child

{
    color: #424242;
}

}

.data-table-container {
    padding: 50px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}

.data-table-btn {
    border: none !important;
}

.data-table-btn-container {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 20px;
}

.table-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 100%;
}

    .table-controls label {
        font-weight: 600;
        color: #0F172A; /* dark navy like in screenshot */
    }

select {
    border: none;
    border-bottom: 1px solid #ccc;
    padding: 2px 5px;
    font-size: 14px;
    background: transparent;
    outline: none;
    margin: 0 5px;
    color: #64748b; /* light gray text */
}

.search-box input {
    border: none;
    border-bottom: 1px solid #ccc;
    font-size: 14px;
    padding: 3px 6px;
    background: transparent;
    outline: none;
    color: #0F172A;
}

.entries-select {
    display: flex;
    align-items: center;
    gap: 10px;
}

.info {
    float: left;
    padding: 10px;
    color: #424242;
}

.pagination {
    float: right;
    padding: 10px;
}

    .pagination button {
        padding: 5px 10px;
        margin: 0 2px;
        /* border: 1px solid #ccc; */
        background: none;
        cursor: pointer;
        color: #424242;
    }

    .pagination span {
        padding: 5px 10px;
    }

.matter-default-settings-container {
    background: white;
    border-radius: 12px;
    margin: 40px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.matter-default-settings-title {
    background: #def2f7 !important;
    font-size: 16px;
    font-weight: 600;
    color: #424242;
    padding: 10px 20px;
    margin-bottom: 0;
}

.matter-default-settings-form {
    padding-top: 20px;
    padding-left: 40px;
    padding-right: 40px;
    padding-bottom: 40px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.form-label {
    font-size: 12px !important;
}

.user-input {
    height: 38px !important;
}


/** Hide scrollbars in all projects */
::-webkit-scrollbar {
    width: 0px;
    height: 0px;
    background: transparent;
}

body, * {
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE and Edge */
}

    body::-webkit-scrollbar, *::-webkit-scrollbar {
        display: none;
    }


.td-ist-letter {
    width: 35px;
    height: 35px;
    background-color: #fec930;
    color: white;
    font-size: 16px;
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    border-radius: 50%;
    text-transform: uppercase;
    flex-direction: row;
    justify-content: center;
    margin-right: 6px;
}

.mud-chip-filled.mud-chip-color-success {
    padding: 6px 15px !important;
    white-space: nowrap !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    text-transform: capitalize;
    color: #356835 !important;
    background: #b4f3b4 !important;
}

.coreflex-user-wrapper {
    /*    background:white;*/
    border: 0.5px solid #80808021;
    border-radius: 25px;
}

.coreflex-input-container {
    display: flex !important;
    /*align-items: center;*/
    justify-content: flex-end;
    flex-direction: row !important;
    background: #edf7fa;
    border-radius: 25px;
}

.coreflex-user-container {
    padding: 40px;
    background: white;
    box-shadow: 0px 0px #00000070;
    border-radius: 25px;
    border-style: solid;
    border-color: rgba(128, 128, 128, 0.22);
}

.mud-elevation-1 {
    box-shadow: none !important;
}

.upload-cancel-button {
    background: #0aa9d0 !important;
    border: none !important;
}

.mud-tab:hover {
    cursor: pointer;
    background-color: transparent !important;
}

.section {
    flex: none !important;
}

.matter-detail workspaces-container {
    min-width: 100% !important;
    margin-top: 20px;
}

.custom-wrapper-width {
    min-width: 50% !important;
}

.wokspace-wapper {
    background: white;
    padding: 24px;
    border-radius: 12px;
}

.workflow-wrapper {
    margin-top: 20px;
}

.power-bi-wrapper {
    border-radius: 12px !important;
}

.powerBi-container-wrapper {
    background: white !important;
    padding: 12px;
    border-radius: 12px !important;
}

/* Global Pagination and Container Styles */
.terms-container {
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    padding: 20px;
}

.user-list-title {
    color: #1976d2;
    font-weight: 600;
    margin-bottom: 20px;
}

.custom-pagination {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
    padding: 10px 0;
}

.pagination-field {
    padding: 5px 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: white;
}

.custom-pagination button {
    padding: 5px 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: white;
    cursor: pointer;
}

    .custom-pagination button:hover:not(:disabled) {
        background-color: #f5f5f5;
    }

    .custom-pagination button:disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }

/* Zendesk Chat Widget Visibility Control */
body.chat-hidden #launcher,
body.chat-hidden .zEWidget-launcher,
body.chat-hidden [data-testid="launcher"],
body.chat-hidden .zEWidget-launcherButton,
body.chat-hidden .zEWidget-launcherButtonWrapper {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

body.chat-hidden .zEWidget-launcherButtonWrapper {
    display: none !important;
}

body.chat-hidden .zEWidget-launcherButton {
    display: none !important;
}

/* Ensure chat widget is visible when body doesn't have chat-hidden class */
body:not(.chat-hidden) #launcher,
body:not(.chat-hidden) .zEWidget-launcher,
body:not(.chat-hidden) [data-testid="launcher"],
body:not(.chat-hidden) .zEWidget-launcherButton,
body:not(.chat-hidden) .zEWidget-launcherButtonWrapper {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

.platform-logo{
    max-height: 40px;
    height: auto;
    width: auto;
}

.radio-input:disabled {
    opacity: 0.5;
}

.radio-label.text-muted {
    opacity: 0.6;
}

.radio-label.text-muted .radio-input {
        opacity: 0.5;
}

.input-error {
    border: 2px solid #e74c3c !important;
    background-color: #fff5f5 !important;
}

.validation-error {
    color: #e74c3c; 
    font-size: 0.875rem;
    margin-top: 0.25rem;
}
.input-error:focus {
    outline: none !important;
    border: 2px solid #e74c3c !important;
    box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.25) !important;
}
.confirm-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}
.confirm-title {
    color: #333 !important;
}
.confirm-message {
    color: #555 !important;
   
}
.confirm-box {
    background: white;
    padding: 20px 25px;
    border-radius: 8px;
    width: 350px;
    text-align: center;
    box-shadow: 0 3px 10px rgba(0,0,0,0.3);
}

.confirm-actions {
    margin-top: 20px;
    display: flex;
    justify-content: space-around;
}

.yes-btn {
    background-color: #1976d2;
    color: white;
    padding: 8px 20px;
    border: none;
    border-radius: 4px;
}

.no-btn {
    background-color: #d32f2f;
    color: white;
    padding: 8px 20px;
    border: none;
    border-radius: 4px;
}

.no-data-available-box {
    border: 2px solid #cfcfcf;
    border-radius: 12px;
    padding: 10px;
    text-align: center;
    font-size: 22px;
    color: #2f8db3;
    max-width: 700px;
    margin-top: 30px;
}

.clickable {
    cursor: pointer;
    transition: background-color 0.2s ease, opacity 0.2s ease;
}

    .clickable:hover {
        background-color: #eef2f7;
        opacity: 0.95;
    }