.removeElement {

    margin-top: 0.25rem;
    font-size: 0.8125rem;
}

.ml2 {
    margin-right: 10px;
}

.mb-14 {
    margin-bottom: 5rem !important;
}

.img-responsive {
    width: 100%;
}


.dividerMenu {
    padding: 5px;
    color: #ddd;
    border-radius: 4px;

    text-align: center;
    font-size: 0.7rem;
    ;
}

h4 {
    font-size: 1.1rem;

}

h3 {
    font-size: 1.4rem;

}

h5,
.h5 {
    font-size: 1.1rem;
}

.counter {
    font-size: 2rem;

}

.zoom-in {
    animation: zoomIn 0.7s ease forwards;
}

@keyframes zoomIn {
    from {
        transform: scale(0);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

.form-error {
    margin-top: 5px;
    min-height: 30px;
}

.ul-list {
    line-height: 2.2rem;
}

p {
    line-height: 2.2rem;
}

.ul-list li {
    margin-bottom: 1.1rem;
    ;
}

.icon-hover {
    position: relative;
}

.icon-hover i {
    display: inline-block;
    /* Necessary for animations */
    transition: transform 0.3s ease;
    /* Smooth transition for other transform changes */
}

/* Keyframes for moving animation */
@keyframes move {

    0%,
    100% {
        transform: rotateY(0deg);
        /* Start and end position */
    }

    50% {
        transform: rotateY(180deg);
        /* Rotate halfway */
    }
}

.icon-hover:hover i {
    animation: move 1.6s infinite;
    /* Apply animation on hover */
}

.ql-editor {
    font-size: 0.95rem;
    /* Set your desired default font size */

    /* Set a fixed height */

}

.ql-editor2 {
    font-size: 0.95rem;
    /* Set your desired default font size */
    height: 200px;
    /* Set a fixed height */

}

.mh-200 {
    min-height: 200px;
}

.w-40 {
    width: 40%;
    ;
    text-align: left;
}

.blockDiv {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 0.9rem;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    /* Semi-transparent black background */
    border-radius: 4px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.relative {
    position: relative;
}

.star-required {
    color: #FF0000;
    /* Color for the required asterisk */

    /* Space between label and asterisk */
    font-size: 1.5rem;
    /* Font size for the asterisk */
    vertical-align: middle;
    /* Align the asterisk vertically */
    margin-top: 5px;
}

.bg-light2 {

    background-color: rgb(247, 247, 247,0.2);
}

.table th.th-size {
    font-size: 0.8rem;
    padding: 0.3rem;
    text-transform: capitalize;

}

.form-select {
    width: auto;
    display: inline;
    margin-right: 10px;
    margin-left: 10px;
    line-height: 2;

}

[dir=rtl] .switch-lg .switch-label {

    padding-right: 0.3rem;
    font-weight: normal;
    padding-left: 1rem;
    color: #6c6c6c;
}

.border-secondary {
    border-color: #e3e3e3 !important;
}

.card .tab-content {
    padding: 0 1.5rem;
}

.bb-radius {
    border-radius: 4px;
}

.nav-align-left .nav-tabs {
    border: none;
}

.lodingHeight15 {
    height: 15rem;
}

.slim-cu {
    max-width: 700px;
    margin: auto;
    border-radius: 4px;
    border: solid 1px #E9E7FD;
}

.slim-cu2 {
    max-width: 300px;
    margin: auto;
    border-radius: 4px;
    border: solid 1px #E9E7FD;
}

.img-data-table {

    max-width: 100px;
    border-radius: 4px;
    border: solid 1px #E9E7FD;
    padding: 4px;
}

.select2 {
    /* Add your custom class selector here */
    width: 100%;
    margin: 0;
}


th {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#frm {
    position: relative;
}

.cur-pointer {
    cursor: pointer;
}

#table-container {
    position: relative;
}

#table-container.loading .loading-overlay {
    display: flex;
    /* Show the overlay when loading class is applied */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    background: rgba(238, 238, 238, 0.8);
    z-index: 10;
    font-size: 1.3rem;
    text-align: center;
    color: #7367F0;
    padding-top: 10%;
    border-radius: 4px;
    border: solid 2px #E9E7FD;
    display: block;
}
.data-table-empty{
   padding: 4rem 0px;
   text-align:center;
   color:#b4adfc;
}
.alert{
  line-height: 1.57rem;
  font-size: 0.9623rem;
}
.alert-primary{
  /*  color:#5d54c2*/
}
.olGuide li div{
    margin-left:10px;
    margin-bottom: 20px;;
    font-size: 1rem;
}
.bootstrap-select .dropdown-menu {
    z-index: 1051 !important; /* Ensure it's above the modal (z-index: 1050) */
}
.text-capitalize{
    text-transform: uppercase;;
}

.font-size-12 .switch-label{
    font-size: 0.86rem;

    }
    .nav-tabs.widget-nav-tabs .nav-link {
        height: 100% !important;
        width: 100% !important;
        min-height: 100px !important;
        min-width: 100px !important;
        border-radius: 0.375rem;

      }

    /* Style the container with horizontal scrolling */
    .horizontal-scrollbar {
        width: 100%;
        overflow-x: auto;
        white-space: nowrap;
        /* Optional: Add some content for demonstration */

      }

      /* Customizing the scrollbar */
      .horizontal-scrollbar::-webkit-scrollbar {
        height: 10px; /* Set the height of the scrollbar */
        width: 10px;
      }

      .horizontal-scrollbar::-webkit-scrollbar-track {
        background: #E9E7FD; /* Track background color */
        border-radius: 10px;
      }

      .horizontal-scrollbar::-webkit-scrollbar-thumb {
        background-color: #897FF2; /* Thumb (handle) color */
        border-radius: 10px;
        border: 2px solid #E9E7FD; /* Optional border for thumb */
        cursor: pointer;
      }

      .horizontal-scrollbar::-webkit-scrollbar-thumb:hover {
        background-color: #897FF2; /* Darker color on hover */
      }


      .layout-navbar .navbar-dropdown.dropdown-shortcuts .dropdown-shortcuts-item a, .layout-navbar .navbar-dropdown.dropdown-shortcuts .dropdown-shortcuts-item a:hover
    {
        display: block;
        margin-bottom: 0;
        color: #897FF2 !important;
    font-size: 0.8rem;

    }
    .layout-navbar .navbar-dropdown.dropdown-shortcuts .dropdown-shortcuts-item .dropdown-shortcuts-icon {
        color: #897FF2 !important;
    }
    .slow-spinner {
        animation-duration: 2s !important; /* Slows down the animation */
    }
    .search-results {
        position: absolute;
        width: 96%;
        top: 50px;
        max-height: 300px;
        overflow-y: auto;
        z-index: 1000;
        /* Example shadow */
        display: block !important; /* Ensure it's not hidden */
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); border-radius: 4px;
        background: #dfdcff;
    }
    #search-wrap{
        background: #ffffff;
    margin: 2px 2px 2px 2px;
       padding: 5px; border-radius: 4px;

    }
    .search-item {
        padding: 10px;

    }


    .icon-box {
        font-size: 24px;
        margin-top: 15px;
        margin-bottom: 15px;
    }
    .data-box{
        margin-bottom: 15px;
    }
    .data-box a {
        font-size: 13px;

        text-decoration: none;

    }

    .data-box a:hover {

        text-decoration: underline;
    }

    .search-item-content {
        padding: 10px;

        margin: 10px 5px; /* Add margin around each box */
        background-color: #fefcff;
        border: 1px dashed #E9E7FD;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        border-radius: 4px;
    }
    .search-item-content:hover{
        background-color: #f5f4ff;
    }

    .search-item-box {
        margin: 10px; /* Space between boxes */
    }
    .nav-item:hover{
        background-color: #f5f4ff;
    }
    .search-error{
        margin-top:10px;
        color:#ff5900;
        font-size: 0.86rem;
        background-color: #fff;
        padding: 2px;
    }
    .search-error::before{
        content: "\ea06";
        font-family: "tabler-icons";
        margin-right: 5px;
        font-size: 1.3rem;vertical-align: middle;

    }
    .ti{
        vertical-align: middle;
    }
    @media (max-width: 768px) {
        .table-responsive {
            overflow-x: auto; /* Enables horizontal scrolling */
        }

        .table td, .table th {
            white-space: nowrap; /* Prevents text from wrapping */
        }

        .input-large {
            min-width: 150px !important; /* Prevents inputs from being too small */
        }
    }




    /* added for dena enrgty */
    .repeater-container {

        margin-top: 20px;
    }
    .repeater-row {
        display: flex;
        align-items: center;

    }
    .repeater-row .form-group {
        flex-grow: 1;
        margin-bottom: 0;
    }
    .repeater-delete-btn {
        margin-left: 10px;
    }

    .bg-danger-used{
        background-color: #ffe2e3 ;
    }

    .bg-danger-attentions{
        background-color: #ffe2e3 ;
    }.bg-danger-out{
        background-color: #ffe2e3 ;
    }
    .bg-green-out{
        background-color: #ddf6e8 ;
    }


    @keyframes pulse {
        0% { transform: scale(1); }
        50% { transform: scale(1.2); }
        100% { transform: scale(1); }
    }
    .timeline-dot {
        animation: pulse 2s infinite ease-in-out;
    }


    .menu-vertical, .menu-vertical .menu-block, .menu-vertical .menu-inner > .menu-item, .menu-vertical .menu-inner > .menu-header {
        width: 18.25rem;
    }
    @media (min-width: 1200px) {
    .layout-menu-fixed:not(.layout-menu-collapsed) .layout-page, .layout-menu-fixed-offcanvas:not(.layout-menu-collapsed) .layout-page {
        padding-left: 18rem;
    }}

    @media (min-width: 1200px) {
        .layout-navbar-fixed:not(.layout-menu-collapsed) .layout-content-navbar:not(.layout-without-menu) .layout-navbar, .layout-menu-fixed.layout-navbar-fixed:not(.layout-menu-collapsed) .layout-content-navbar:not(.layout-without-menu) .layout-navbar, .layout-menu-fixed-offcanvas.layout-navbar-fixed:not(.layout-menu-collapsed) .layout-content-navbar:not(.layout-without-menu) .layout-navbar {
            left: 18.25rem;
        }
    }

    .layout-navbar-fixed .layout-navbar.navbar-detached {
        width: calc(100% - 1.5rem * 2 - 18.25rem);
    }


    .level-radio {
        display: flex;
        gap: 0px;
      }

      /* Hide default radio buttons */
      .level-radio input[type="radio"] {
        display: none;
      }

      /* Custom square label */
      .level-radio label {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        border: 1px solid #555;
        border-left: none;
        cursor: pointer;
        font-weight: bold;
        font-size: 13px;
        user-select: none;

        transition: background-color 0.2s, border-color 0.2s;
      }

      .level-radio-lb {
        border-left: 1px solid #555 !important;
      }




      /* When radio checked, highlight the box */
      .level-radio input[type="radio"]:checked + label {
        background-color: #7367F0;
        color: white;
        border-color: #7367F0;
      }





      .level-radio {
        display: flex;
        gap: 0px;

        background: #f8f9fa;
        border-radius: 4px;
    }
    .form-check {
        display: flex;
        align-items: center;
        margin: 0;
    }
    .form-check-input {
        margin-right: 8px;
    }
    .form-check-label {
        display: flex;
        align-items: center;
        cursor: pointer;
    }
    .form-check-label i {
        margin-right: 6px;
        font-size: 1.2em;
        color: #696969;
    }
    .form-check-input:checked + .form-check-label {
        font-weight: bold;
        color: #696969;
    }
    .status-select {
        width: 200px;
    }
    .status-select option {
        display: flex;
        align-items: center;
    }
    .status-select option i {
        margin-right: 8px;
    }
    .list-inline-item {
        vertical-align: middle;
    }

    .form-error {
        min-height: 20px;
    }



    .hr-fade {
        border: none;
        height: 1px;
        background: linear-gradient(to right,
            transparent,
            rgba(136, 136, 136, 0.3)40%,
            rgba(136, 136, 136, 0.3) 60%,
            transparent
        );
        margin: 1.5rem 0;
    }


    .switchbox-itemM {
        flex: 1 1 23%;
display: inline-block;
        max-width: 23%;
      }


    .switchbox-itemM {
        transition: all 0.2s ease;
        cursor: pointer;
        background: #fff !important;
        border-style: solid !important;
        border-width: 2px !important;
        border-color: #d1cdf7 !important;
    }

    .switchbox-itemM:hover {
        background: #f9f8fe !important;
        border-color: #938AF3 !important;
        border-style: solid !important;
        transform: translateY(-2px);
        box-shadow: 0 2px 8px rgba(147, 138, 243, 0.25);
    }

    .switchbox-itemM.active {
        background: linear-gradient(to right, #f3f1fe, #ffffff) !important;
        border-color: #938AF3 !important;
        border-style: solid !important;
    }

    .form-check-input.switch-input:checked {
        background-color: #938AF3;
        border-color: #938AF3;
    }

    .form-check-input.switch-input:focus {
        border-color: #938AF3;
        box-shadow: 0 0 0 0.25rem rgba(147, 138, 243, 0.25);
    }

    .module-section {
        background: #ffffff;
        padding: 5px;
        border-radius: 8px;

    }

    .module-section:hover {
        box-shadow: 0 2px 4px rgba(147, 138, 243, 0.1);
    }

    .bg-primary-subtle {
        background-color: rgba(147, 138, 243, 0.1);
    }

    .alert-primary {
        background: linear-gradient(to right, #f3f1fe, #ffffff);
        border-left: 4px solid #938AF3;
    }

    .alert-info {
        background: #f8f9fa;
        border: 1px solid #dee2e6;
        border-left: 4px solid #938AF3;
    }

    .form-check-label {
        cursor: pointer;
        user-select: none;
        width: 100%;
    }

    /* Animation for switch changes */
    @keyframes switchPulse {
        0% { transform: scale(1); }
        50% { transform: scale(1.1); }
        100% { transform: scale(1); }
    }

    .switch-input:checked {
        animation: switchPulse 0.3s ease;
    }

    /* Module toggle styles */
    .module-toggle {
        min-width: 3rem;
        height: 1.5rem;
        cursor: pointer;
    }

    .module-toggle:checked {
        background-color: #938AF3;
        border-color: #938AF3;
    }

    .module-toggle:focus {
        box-shadow: 0 0 0 0.25rem rgba(147, 138, 243, 0.25);
    }

    /* Update button colors to match */
    .btn-outline-primary {
        color: #938AF3;
        border-color: #938AF3;
    }

    .btn-outline-primary:hover {
        color: #fff;
        background-color: #938AF3;
        border-color: #938AF3;
    }

    .btn-primary {
        background-color: #938AF3;
        border-color: #938AF3;
    }

    .btn-primary:hover {
        background-color: #7c71e0;
        border-color: #7c71e0;
    }

    .btn-primary:focus {
        background-color: #938AF3;
        border-color: #938AF3;
        box-shadow: 0 0 0 0.25rem rgba(147, 138, 243, 0.5);
    }

    /* Module icon with purple theme */
    .module-icon {
        color: #938AF3;
    }

    /* Badge with purple theme */
    .badge.bg-primary-subtle {
        background-color: rgba(147, 138, 243, 0.15) !important;
        color: #938AF3 !important;
    }

    /* Text primary color */

   .switchbox-itemM.active .form-check-label {
        font-weight: 600;
    }

    /* Make icon more prominent when selected */
    .switchbox-itemM.active .form-check-label i {
        color: #938AF3 !important;
    }

    /* Smooth transition for font-weight change */
    .switchbox-itemM .form-check-label {
        transition: font-weight 0.2s ease;
    }
/* Permission Box Container */
.switchbox-itemM {
    min-width: 220px;
    max-width: 100%;
    transition: 0.25s ease;
}

/* Hover Effect Desktop */
@media (hover:hover) {
    .switchbox-itemM:hover {
        transform: translateY(-3px);
        box-shadow: 0 4px 10px rgba(0,0,0,.07);
    }
}

.switchbox-itemM.active {

    background: rgba(13,110,253,.06);
}

/* ===== Responsive Layout ===== */

/* Default large screens (desktop) */
.module-section .d-flex.flex-wrap > .switchbox-itemM {
    width: calc(25% - 12px);
}

/* Laptops <1200px */
@media (max-width:1200px) {
    .module-section .d-flex.flex-wrap > .switchbox-itemM {
        width: calc(33.33% - 12px);
    }
}

/* Tablets <992px */
@media (max-width:992px) {
    .module-section .d-flex.flex-wrap > .switchbox-itemM {
        width: calc(50% - 12px);
    }
}

/* Mobile <576px — Perfect Mobile View */
@media (max-width:576px) {
    .module-section .d-flex.flex-wrap > .switchbox-itemM {
        width:100%;
        margin-right:0 !important;
    }
    .sticky-alert-container {position:relative!important;}
}