/* start MDB 5 theming for BS5 lib */

/* .btn {
    line-height: 1.5 !important;
    padding-top: 0.625rem !important;
    padding-bottom: 0.5rem !important;
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
    font-size: 0.75rem !important;
    font-weight: 500 !important;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 10px 0 rgba(0, 0, 0, 0.1) !important;
    border-width: 0.125rem;
}

.btn:hover, .btn:focus, .btn:active {
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.1) !important;
}

$btn-outline-padding-top: 0.5rem !default;
$btn-outline-padding-bottom: 0.375rem !default;
$btn-outline-padding-left: 1.375rem !default;
$btn-outline-padding-right: 1.375rem !default;

$btn-outline-padding-top-sm: 0.25rem !default;
$btn-outline-padding-bottom-sm: 0.1875rem !default;
$btn-outline-padding-right-sm: 0.875rem !default;
$btn-outline-padding-left-sm: 0.875rem !default;

$btn-outline-padding-top-lg: 0.625rem !default;
$btn-outline-padding-bottom-lg: 0.5625rem !default;
$btn-outline-padding-right-lg: 1.5625rem !default;
$btn-outline-padding-left-lg: 1.5625rem !default;

$btn-line-height-lg: 1.6 !default;
$btn-font-size-lg: 0.875rem !default;
$btn-padding-top-lg: 0.75rem !default;
$btn-padding-bottom-lg: 0.6875rem !default;
$btn-padding-right-lg: 1.6875rem !default;
$btn-padding-left-lg: 1.6875rem !default;

$btn-line-height-sm: $btn-line-height !default;
$btn-font-size-sm: 0.75rem !default;
$btn-padding-top-sm: 0.375rem !default;
$btn-padding-bottom-sm: 0.3125rem !default;
$btn-padding-right-sm: 1rem !default;
$btn-padding-left-sm: 1rem !default;

$btn-link-bgc: #f5f5f5 !default;
$btn-rounded-border-radius: 10rem !default; */

/* End MDB 5 theming for BS5 lib */

html {
    --scrollbarBG: #eee;
    --thumbBG: #777;
}

body {
    position: relative;
    height: 100%;
}

.tm-text-primary {
    color: #5838a3;
}

.text-lprimary-bold {
    color: #45255c;
    font-weight: 600;
}

.tm-text-secondary {
    color: #ff9933;
}

.tm-bg-primary {
    background-color: #8C11EA;
}

.tm-bg-light {
    background-color: #f7f7f7;
}

.tm-bg-secondary {
    background-color: #ff9933;
}

.bg-xlprimary {
    background-color: #f1ebf7;
}

.bg-xlight {
    background-color: #f1ebf7;
}



/* .text-l-dark {
    color: #686868;
}

.text-lprimary {
   color: #45255c; 
}

.bg-white {
    background-color: #fff;
}

.bg-dlight {
    background-color: #e5e5e5;
} */

.ss-show {
    display: block;
}

.hideOnDesk {
    display: none;
}

.hideOnMobile {
    display: block;
}

.loading-div {
    display: none;
    justify-content: center;
    align-items: center;
    position: sticky;
    z-index: 12000;
    top: 0px;
    background-color: rgba(50, 35, 101, 0.8);
    text-align: center;
    padding: 5px;
    height: 50px;
}

.loading-div img {
    width: 60px;
    margin-top: -10px;
}

.preloading-div, .before-unload-div, .list-loading-div {
    display: none;
    position: relative !important;
    top: 0px;
    left: 0;
    right: 0;
    z-index: 11900;
}

.preloading-progress-bar, .before-unload-progress-bar, .list-loading-progress-bar {
    height: 3px;
    width: 0%;
    border-radius: 1px;
    transition: 0.3s width;
    background-color: var(--bs-primary);
}

#sidebar {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 55px;
    padding: 30px 0px;
    padding-top: 110px;
    z-index: 2000;
    /* background: #5526FE; */
    transition: all 0.5s ease;
}

/* #sidebar:hover {
    background-color: #572988 !important;
} */

.logo-details img {
    position: absolute;
    bottom: 20px;
    left: 0;
    width: 70%;
    margin-left: 6px;
}

#sidebar .nav-list {
    padding-left: 0;
    margin-top: 0px;
}

#sidebar .sidebar-item {
    list-style: none;
    padding: 5px 0px;
    margin: 10px auto;
}

#sidebar .sidebar-item a {
    color: #eee3f3;
    text-align: center;
    margin: 0 auto;
}

#sidebar .sidebar-item i {
    font-size: 1.2em;
}

#sidebar .sidebar-item i:hover {
    color: #fff;
}

#sidebar .nav-list .active {
    border-left: 3px solid #fff;
}

#sidebar .nav-list .active a {
    color: #fff;
}

#main {
    height: 100vh;
    padding-top: 60px;
    overflow-x: hidden;
    scrollbar-width: thin;
}

.main-header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1035;
    height: 60px;
    width: 100%;
    padding: 0px 30px 0px 85px;
    /* background-color: #f5f5f5 !important; */
    border-bottom: 0px solid #ddd;
}

.page-main-title {
    font-weight: 400;
    margin-top: 15px;
}

#topMenu {
    display: flex;
    align-items: center;
}

#topMenu i {
    font-size: 1.1em;
}

#topMenu i:hover {
    color: #FFA900;
}

.top-nav-icon-item {
    width: 30px;
}

.top-nav-icon-item ul a :not(first-child):hover {
    color: #424949;
}

.unread-bubble {
    font-size: 0.6rem;
}

.ss-fs-09 {
    font-size: 0.9em;
}

#profileDropdownBtn {
    display: flex;
    align-items: center;
}

#profileDropdownBtn p {
    margin-bottom: 0;
}

#navProfileImg {
    width: 35px;
}

.pipe-divider {
    width: 2px;
    height: 25px;
    margin-left: 10px;
    background: #eee;
}

#contentWrapper {
    position: relative;
    margin: 0px 20px 0px 75px;
    padding: 0;
    /* padding: 10px 15px; */
    /* border-radius: 10px; */
    /* border: 1px solid #f3f3f3; */
}

/* response */

#responseMessage {
    position: fixed;
    top: 20px;
    right: 0px;
    z-index: 2500;
    opacity: 0.97;
    transition: 10 top;
    width: 100%;
}

#downloadModal {
    display: none;
    position: fixed;
    top: 20px;
    left: 0;
    right: 0;
    z-index: 2400;
    opacity: 1;
    transition: 10 top;
    width: 500px;
    background-color: #fff;
    box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.25);
}

#downloadModalDownloadBtn, #downloadModalDismissBtn {
    display: none;
}

#processingStateIcon {
    width: 24px;
    height: 24px;
}

#addTodoModal {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 50px;
    z-index: 2300;
    opacity: 1;
    transition: 1 bottom;
    width: 400px;
    box-shadow: 2px 5px 8px rgba(0, 0, 0, 0.25);
}

#addTodoModalTitle {
    border-radius: 0.5rem 0.5rem 0 0;
    color: #eee !important;
}

#addTodoModalBody {
    max-height: 400px;
    overflow-y: scroll;
    scrollbar-width: none !important;
}

#todoModalErrorInfoDiv, #todoModalGenericInfoDiv {
    display: none;
}

#formAutoCompletePopup {
    position: absolute;
    top: 60px;
    left: 0px;
    z-index: 1600;
    min-width: 355px;
    padding: 0.1rem 0.1rem;
    background-color: #fff;
    border: 2px solid #555;
    box-shadow: 2px 5px 8px rgba(0, 0, 0, 0.25);
    border-radius: 0.5rem;
}

#formAutoCompletePopup > p {
    background-color: #fff;
    padding: 0.3rem 1rem;
    margin: 5px 0px;
    cursor: pointer;
}

#formAutoCompletePopup > p:hover {
    background-color: #777;
    color: #fff;
}

#todoModalClose {
    cursor: pointer;
}

#addTodoModalBody::-webkit-scrollbar {
    width: 11px;
}
#addTodoModalBody {
    scrollbar-width: thin;
    scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}
#addTodoModalBody::-webkit-scrollbar-track {
    background: var(--scrollbarBG);
}
#addTodoModalBody::-webkit-scrollbar-thumb {
    background-color: var(--thumbBG) ;
    border-radius: 6px;
    border: 3px solid var(--scrollbarBG);
}

#addTodoFloatingBtn {
    display: block;
    position: fixed;
    bottom: 12px;
    right: 25px;
    z-index: 1700;
    opacity: 1;
    border-radius: 30px;
    font-size: 1.1rem;
}

.toast-container {
    z-index: 1800 !important;
    bottom: 60px !important;
}

/* #notificationsDropdown {
    max-height: 200px;
    overflow-y: scroll;
    scrollbar-width: none !important;
    background-color: #1266F1;
} */

/* #responseMessage > div {
    background-color: #be0f0f;
} */

#alertDismiss {
    cursor: pointer;
}

.alert-body {
    margin-bottom: 0;
    border-radius: 0 5px 5px 0;
}

/* response */

.text-lgray {
    color: rgb(87, 82, 82);
}

.text-lgray-2 {
    color: #e7e7e7;
}

.text-lgray-3 {
    color: rgb(160, 157, 157);
}

.text-off {
    color: rgb(165, 164, 164);
    font-weight: 500;
    /* font-style: italic; */
    text-transform: uppercase;
    font-size: 0.75em;
}

#columnDiv {
    min-height: 100vh;
    background-color: #e9e9e9;
}

.abadge {
    width: 12px;
    height: 12px;
    border-radius: 8px;
}

#loadNewNotificationsWrapper {
    display: none;
}

#loadNewNotificationsWrapper > div {
    max-width: 300px;
}

#loadNewNotificationsWrapper > div > a {
    width: 300px !important;
}

/* #notificationsDropdown {
    z-index: 9999999999999999999999999 !important;
    background-color: #be0f0f;
} */

/* #detailNavbar {
    z-index: 100 !important;
    background-color: #be0f0f !important;

} */


/* **************** */

.action-bar {
    width: 100%;
}

.action-bar button {
    margin-left: 10px;
}

.action-bar i {
    margin: 0 4px;
}

#content {
    display: flex;
    margin-top: 15px;
}

#contentSidebar {
    position: relative;
    flex-grow: 0; 
    flex-shrink: 0; 
    flex-basis: 230px;
    height: 93%;
    padding: 15px 5px;
    padding-bottom: 0;
    font-size: 0.9em;
    font-weight: 400;
    margin-right: 10px;
    overflow: auto;
    scrollbar-width: thin;
    background: #fff;
    }

.page-sorter {
    /* min-height: 70%; */
    font-size: 0.9em;
    font-weight: 400;
    margin-right: 0px;
    overflow: auto;
    scrollbar-width: thin;
}

.page-sorter i {
    width: 10px;
    height: 10px;
}

.sorter-menu {
    overflow: auto;
    scrollbar-width: thin;
}

.sorter-menu p, .sorter-menu a, .sorter-menu label {
    color: #5a5a5a;
}

.sorter-item-title-wrapper {
    display: flex;
}

.sorter-item-helper-btn {
    font-size: 0.9em;
    margin-left: auto;
    margin-top: 3px;
    font-weight: 600;
    cursor: pointer;
}

.sorted-div {
    position: relative;
    width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
    font-size: 0.9em;
}

.sorter-item-container {
    background-color: #f6f6f6;
}

#applyFiltersBtnDiv {
    position: sticky;
    bottom: 0;
    left: 0;
}

#contentContent {
    background: #fff;
    height: 93%;
}

.table-link {
    text-transform: 1s text-decoration;
    white-space: nowrap;
}

.table-link:hover {
    text-decoration: underline #1266F1;
}

.tlb {
    font-weight: 400;
    padding: 0.1em 0.6em;
    border-radius: 10px;
}

.tlb-px0 {
    font-weight: 400;
    padding: 0.05em 0;
    border-radius: 10px;
}

.tlb-default {
    color: #1266F1;
    /* text-decoration: none; */
}

.tlb-default:hover {
    color: #1266F1;
    text-decoration: underline #1266F1 !important;
}

.tlb-default i {
    color: #ff9933;
}

.tlb-primary {
    color: #5838a3;
}

.tlb-primary:hover {
    color: #5838a3;
    text-decoration: underline #5838a3 !important;
}

.tlb-primary i {
    color: #5838a3;
}


.tlb-btn-default {
    color: #1266F1 !important;
    /* background-color: #e5fafd; */
    /* border: 1px solid #e5fafd; */
    background-color: #ebf1f3;
    border: 1px solid #cbdbf5;
}

.tlb-btn-default:hover {
    text-decoration: underline #1266F1 !important;
}

.tlb-btn-default i {
    color: #ff9933;
}

.tlb-success {
    color: #208a23 !important;
    /* text-decoration: none; */
}

.tlb-success:hover {
    color: #208a23 !important;
    text-decoration: underline #208a23 !important;
}

.tlb-btn-success:hover {
    text-decoration: underline #208a23 !important;
}

.tlb-btn-success {
    color: #208a23 !important;
    background-color: #E5FDEB;
    border: 1px solid #def7df;
}

.tlb-danger {
    color: #be0f0f !important;
}

.tlb-danger:hover {
    color: #be0f0f !important;
    text-decoration: underline #be0f0f !important;
}

.tlb-btn-danger {
    color: #be0f0f !important;
    background-color: #fde5e5;
    border: 1px solid #f7dede;
}

.tlb-btn-danger:hover {
    text-decoration: underline #be0f0f !important;
}

.bg-tblight {
    background-color: #f3f0f7 !important;
}

.tb-detail-row {
    display: none;
}

.tb-detail-row:hover {
    background-color: #fff !important;
}

.ss-tb-show {
    display: table-row;
}

.tb-detail-expand {
    cursor: pointer;
    color: #555;
}

.fs-7 {
    font-size: 0.7em;
}

.hlit {
    font-weight: 400;
    padding: 0.05em 0.6em;
    border-radius: 5px;
}

.hlit-default {
    color: #212529;
    background-color: #ebf1f3;
    border: 1px solid #cbdbf5;
}

.hlit-default i {
    color: #ff9933;
}

.hlit-success {
    color: #208a23;
    background-color: #E5FDEB;
    border: 1px solid #def7df;
}

.hlit-danger {
    color: #be0f0f;
    background-color: #fde5e5;
    border: 1px solid #f7dede;
}

.link-hover-underline:hover {
    text-decoration: underline #1266F1 !important;
}

.tlb-btn-danger i {
    font-size: 0.8em;
}

.tlb-btn-success i {
    font-size: 0.9em;
}

.list-action-link{
    color: rgb(87, 82, 82);
    transition: .5s color;
}

.list-action-link:hover{
    color: #5838a3;
}

.ss-badge-square {
    width: 8px;
    height: 8px;
}

.ss-badge-circle {
    width: 8px;
    height: 8px;
    border-radius: 4px;
}

.ss-badge-vertical {
    width: 6px;
    height: 16px;
    border-radius: 3px;
}

.ss-badge-horizontal {
    width: 18px;
    height: 6px;
    border-radius: 3px;
}

.page-main-pagination {
    position: fixed;
    right: 70px;
    bottom: 0;
}

.detail-lead-avatar-img {
    width: 120px;
}

.detail-lead-actions {
    z-index: 1030 !important;
}

.detail-summary-avatar-img {
    width: 80px;
}

/* #detailNavbar {
    position: sticky;
    top: 0px;
} */

/* .action-center-dropdown {
    z-index: 1035 !important;
    background-color: #be0f0f;
} */

.fs-as {
    font-size: 0.85em;
}

.fw-nml {
    font-weight: 500 !important;
}

/* #detailNavbar {
    z-index: 99;
} */

.detailSectionWrapper {
    height: 213px;
    padding: 20px;
    margin-top: 20px;
    /* background-color: #fafafa; */
}

.detailSectionWrapper-noHeight {
    padding: 20px;
    margin-top: 20px;
    /* background-color: #fafafa; */
}

.detailSectionText p {
    margin-bottom: 0;
    font-weight: 400;
}

.detailSectionText td {
    padding-left: 0;
}

.my-modal-parent {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 990;
    width: 100%;
    min-height: 100vh;
    background-color: rgba(0, 0, 0, 0.75);
    display: none;
    /* opacity: .5; */
}

.my-modal {
    z-index: 2600;
    position: absolute;
    float: left;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

/* Make sure nothing inside buttons can send click events so we can catch button clicks with delegated events. */
button * {
    pointer-events: none;
  }
  
  .loading {
    opacity: .5;
  }
  .loading span {
    display: none;
  }

  /* #spinnerBg {
      position: fixed;
      top: 0;
      left: 0;
      z-index: 2000;
      width: 100%;
      min-height: 100vh;
      background-color: #000000b0;  
  }

  #spinnerImg {
    position: fixed;
    z-index: 2001;
    top: 50%;
    left: 50%;
    margin-top: -52px;
    margin-left: -52px;
} */

#spinnerBg {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2000;
    width: 100%;
    min-height: 50px;
    background-color: #ffffffd5; 
    box-shadow: 0px 2px 5px rgba(54, 2, 70, 0.3); 
}

#spinnerImg {
  position: fixed;
  z-index: 2001;
  top: 0px;
  left: 50%;
  margin-top: -12px;
  margin-left: -52px;
}

.hub-home-logo {
    width: 30px;
    margin-top: 12px;
}

.hub-home-title-link {
    text-decoration: none !important;
}

.hub-home-title-link:hover h5 {
    color: #212529 !important;
}

.hub-home-icon:hover {
    color: #ff9933 !important;
}

.bg-hub {
    background-color: #e1dafb;
}

.bg-dwhite {
    background-color: #f4f4f4;
}

.bg-csuccess {
    background-color: #edfcf1;
}

.bg-cdanger {
    background-color: #fdf1f1;
}

.bg-cprimary {
    background-color: #f7effa;
}

.bg-casecondary {
    background-color: #fcf3e9;
}

.btn-grid {
    display: grid;
    gap: 8px;
}

.btn-grid-col-3 {
    grid-template-columns: repeat(3, 1fr);
}

.btn-grid-col-4 {
    grid-template-columns: repeat(4, 1fr);
}

.btn-grid a {
    color: #212529 !important;
}

/* .btn-grid i {
    color: #572988 !important;
} */

.btn-grid div:hover {
    background-color: #f7f7f7 !important;
}

.btn-grid a:hover {
    text-decoration: none;
}

.btn-grid a:hover i {
    color: #5838a3 !important;
}

.dash-lead {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.dash-lead-content {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.registrations-content {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 20px;
}

.registrations-support-charts {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    /* grid-template-columns: repeat(2, 1fr); */
    gap: 20px;
}

/* #regPricePackages {
    min-height: 1000px;
} */

.stock-content {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.div-content-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.show-on-smd {
    display: none;
}

.show-on-slg {
    display: block;
}

#table_table_wrapper {
    background-color: #208a23;
    min-height: 200px;
}

.my-custom-scrollbar {
    position: relative;
    /* height: 200px; */
    overflow: auto;
}

.table-wrapper-scroll-y {
    display: block;
}

#pageCount {
    font-size: 0.9em;
}

.fhdiv {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* .center-on-page {
    width: 100px;
    height: 100px;
    background-color: red;
    
    position: absolute;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;
    
    margin: auto;
} */

.push-up {
    min-height: 100px;
}

.cdiv {
    text-align: center;
}

.cdiv img {
    width: 300px;

}

#mainHumburgerMenu {
    display: none ;
}



/* #ss_tbody {
    display: none;
} */

/* #tbodyPlaceholder {
    display: inline-block;
} */


/* xxxxxxxxxxxxxxxxxxxxx */

@media screen and (max-width: 1300px){
    /* .dash-lead-content {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    } */

    .registrations-content {
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .stock-content {
        grid-template-columns: repeat(2, 1fr);
    }

    .show-on-smd {
        display: block;
    }

    .show-on-slg {
        display: none;
    }


    /* .detail-secton-actions > a, .detail-secton-actions > div, .detail-lead-actions > a, .detail-lead-actions > div {
        margin-top: 5px !important;
        margin-bottom: 5px !important;
    } */
}

@media screen and (max-width: 900px){
    
    #sidebar {
        display: none;
    }

    .main-nav-dropdown-menu {
        width: 100vw;
        height: 100vh;
        border: 0px solid #fff !important;
        margin-top: 10px !important;
        border-radius: 0px !important;
    }

    .main-nav-humburger-menu {
        display: none;
        position: fixed;
        top: 54px;
        z-index: 1050;
        width: 100vw;
        height: calc(100vh - 54px);
        overflow-y: scroll;
        border-radius: 8px 8px 0 0;
        list-style: none;
        padding-left: 0;
    }

    .hamburger-menu-title {
        border-radius: 8px 8px 0 0 !important;
    }

    .main-nav-humburger-menu > li {
        padding: 8px 16px;
        margin-left: 0 !important;
        border-bottom: 1px solid #eee;
    }

    .main-nav-humburger-menu > li:hover {
        background-color: #eee;
    }

    #main {
        padding-left: 0px;
        margin-left: 0px;
    }

    #mainHeader {
        padding-left: 20px;
        margin-left: 0px;
        background-color: #fbfbfb !important;
    }

    #contentWrapper {
        margin-left: 0;
        margin-right: 0;
        padding: 0 10px;
        padding-top: 10px;
    }

    /* #contentSidebar {
        display: none;
    } */

    .spied-wrapper > div .collapse > div > div:nth-child(1) {
        padding: 8px 0 15px !important;
        margin: 0 !important;
    }

    .accSummary {
        padding: 0;
    }
}

@media screen and (max-width: 767px){
    .hideOnDesk {
        display: block;
    }

    .hideOnMobile {
        display: none;
    }

    #navProfileImg {
        margin: 0 !important;
    }

    .detail-lead-actions {
        padding-top: 0px !important;
    }

    .action-bar, .action-bar .actions-wrapper {
        display: flex;
        flex-direction: column;
        align-items: flex-start !important;
    }

    .action-bar .actions-wrapper {
        margin: 0 !important;
    }

    .action-bar .actions-wrapper button, .action-bar .actions-wrapper div, .action-bar .actions-wrapper a {
        margin: 4px 0 !important;

    }

    .detailSectionHeader, .detail-lead > div:first-child, .detail-lead > div > div > div:first-child {
        display: flex;
        flex-direction: column;
    }

    .detail-secton-actions, .detail-lead-actions {
        display: flex;
        flex-direction: column;
        margin: 0 !important;
        margin-left: 2rem !important;
        margin-top: 15px !important;
    }

    .detail-lead-actions {
        margin: 0 !important;
    }

    .detail-secton-actions > a, .detail-secton-actions > div, .detail-lead-actions > a, .detail-lead-actions > div {
        margin: 8px 0 !important;
    }

    .detail-lead > div > div > div:first-child h4, .detail-lead > div > div > div:first-child a, .detail-lead > div > div > div:first-child a > p {
        margin-right: 0 !important;
    }

    .detail-lead > div > div > div:first-child {
        padding-bottom: 1.5rem;
    }

    .detailSectionText {
        padding: 8px 0 15px !important;
    }

    .ss-table-footer {
        padding: 10px;
        background-color: #5838a3;
        color: #fefefe !important;
        border-radius: 8px;
    }

    #downloadModal {
        width: 95vw;
        top: 10px;
    }

    #addTodoModal {
        bottom: 5px;
        right: 10px;
        left: 10px;
        width: calc(100vw - 20px);
    }

    #addTodoModalBody {
        max-height: 55vh;
    }

    #addTodoFloatingBtn {
        bottom: 70px;
        right: 20px;
        opacity: 1;
        font-size: 1rem;
    }

    .dash-lead {
        grid-template-columns: 1fr;
    }

    .dash-lead-content {
        grid-template-columns: repeat(1, 1fr);
        gap: 15px;
    }

    .registrations-support-charts {
        grid-template-columns: 1fr;
        
    }

    .chart-height-fixed {
        min-height: 200px;
    }

    .btn-grid-col-3 {
        grid-template-columns: repeat(1, 1fr);
    }
    
    .btn-grid-col-4 {
        grid-template-columns: repeat(1, 1fr);
    }
}