:root, [data-bs-theme=light] {
     
     
     --primary: #4246fd;
     --secondary: #881cf9;
     --tertiary: #f5f3fb;
     --quaternary: #222529;
     
     
     /* body */
     
          --bs-body-color: #444;
          --bs-body-font-size: .9rem;
     

          --bs-secondary: #4246fd;
          --bs-secondary-rgb: 66,70,253;

          --bs-primary: #881cf9;
          --bs-primary-rgb: 136,28,249;

          --bs-light: #f5f3fb; /* #f4f4f4 */
          --bs-light-rgb: 245,243,251; /* 244,244,244 */

          --bs-dark: #212529;
          --bs-dark-rgb: 33,37,41;

         
         --bs-indigo: #6610f2;


         --bs-light-primary: #f5f3fb;
         --bs-light-secondary: #E8F7FF;
         --bs-light-info: #EBF3FE;
         --bs-light-success: #E6FFFA;
         --bs-light-warning: #FEF5E5;
         --bs-light-danger: #FBF2EF;
         --bs-light-indigo: #EBF3FE;
         --bs-dark-light: #2A3547;
         --bs-light-gray: #F6F9FC;

          --bs-light-purple: #f4eefd;
          --bs-light-purple-rgb: 244,238,253;
     
          --bs-dark-purple: #1b0632;
          --bs-dark-purple-rgb: 27,6,50;
     
     --bs-muted: #5A6A85;
     --bs-muted-rgb: 90,106,133;
    
     --bs-font-sans-serif: "Poppins",sans-serif;
     
     --bs-text-color: #444;     
     --bs-navbar-color: var(--bs-dark);
     
     
     --bs-success: #198754;
     --bs-info: #0dcaf0;
     --bs-warning: #ffc107;
     --bs-danger: #dc3545;
     --bs-success-rgb: 25,135,84;
     --bs-info-rgb: 13,202,240;
     --bs-warning-rgb: 255,193,7;
     --bs-danger-rgb: 220,53,69;
     
     
     --bs-border-radius-lg: 1rem;
}


     .border-info {
         --bs-border-opacity: 1;
         border-color: rgba(var(--bs-primary-rgb),var(--bs-border-opacity))!important;
     }


/* badge */

     .badge {
          font-size: .875rem;
     }


/* page title */

     .page-title-container .btn {
          font-size: 1rem;
          padding: .3rem 1rem;
     }


/* select2 */

     .select2-container--classic .select2-selection--multiple .select2-selection__choice, .select2-container--default .select2-selection--multiple .select2-selection__choice, .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
         background-color: var(--bs-primary);
         border-color: var(--bs-primary);
     }

     .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
         background-color: var(--bs-primary);
         color: white;
     }
     
     .select2-dropdown {
          z-index: 10000;
          min-width: 300px;
     }
     
     .select2-container
     {
          min-width: 100% !important;
     }
     .select2-selection {
          border: none !important;
     }

/* text */

     .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
          color: var(--bs-dark);
     }

     .text-normal {
          color: var(--bs-text-color);
     }

     .text-muted {
          color: rgba( var(--bs-dark-rgb ), .3) !important;
     }
     
     .text-primary {
          color: #6b3ff8 !important;
     }

     .fw-bold {
          font-weight: 600 !important;
     }

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

     .gradient-text-color {
         padding-right: 5px;
     }
     
     .gradient-text-color {
         color: #4246fd;
         background: linear-gradient(to bottom right, #4246fd, #881cf9);
         background-image: linear-gradient(to right, #4246fd, #881cf9);
         -webkit-background-clip: text !important;
         -webkit-text-fill-color: transparent !important;
     }


/* menu header */

     .menu-header:hover {
          background-color: var(--bs-light) !important;
     }

/* navlink */

     .nav-link:focus, .nav-link:hover {
         color: var(--bs-primary);
     }

     a:not(.sidebar-link):not(.nav-link):not(.btn), a:not(.sidebar-link):not(.nav-link):not(.btn):visited, a:not(.sidebar-link):not(.nav-link):not(.btn):active,.dt-button {
          /*background: linear-gradient(to bottom right, #4246fd, #881cf9);
          background-image: linear-gradient(to right, #4246fd, #881cf9);
          -webkit-background-clip: text !important;
          -webkit-text-fill-color: transparent !important;*/
          color: #6b3ff8;
     }
     
     a:not(.sidebar-link):not(.nav-link):not(.btn):hover {
          color: var(--bs-dark) !important;
          text-decoration: none;
          background: unset;
          background-image: unset;
          -webkit-background-clip: unset !important;
          -webkit-text-fill-color: unset !important;
     }


/* nav-icon */

     .nav-icon-hover:hover::before {
          background-color: var(--bs-light);
     }
     

/* shadows */


     .box-shadow-none {

          box-shadow: unset;

     }


/* alert */

     .alert {
          border-radius: 1rem;
     }


/* card */

     .card {
          --bs-card-border-radius: 1rem;
          --bs-card-border-width: 1px;
          --bs-card-border-color: rgba(var(--bs-primary-rgb),0);
          --bs-card-box-shadow: rgba(var(--bs-primary-rgb), 0.12) 0px 0px 2px 0px, rgba(var(--bs-primary-rgb), 0.12) 0px 12px 24px -4px !important;
          
     }     

     .card-header {
          padding: 1rem .5rem;
          margin-bottom: 0;
          color: var(--bs-dark);
          border-bottom: var(--bs-card-border-width) solid var(--bs-light);
          border-radius: 1rem 1rem 0 0 !important;
     }

     .card-header, .card-footer {
         background-color: rgba(var(--bs-secondary-rgb),.07)!important;
     }

/* header */

     #main-wrapper[data-layout=vertical] .app-header.fixed-header .navbar {
         background: #fff;
         padding: 0 15px;
         border-radius: 15px;
         box-shadow: 1px 0 20px 0 rgba(var(--bs-primary-rgb), 0.2);
         margin-top: 15px;
     }

/* sidebar */
     

     .sidebar-nav .has-arrow::after {
         border-width: 1px 0 0 1px;
         border-color: var(--bs-dark);
         top: 20px;
     }

     .sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link.active.has-arrow::after, .sidebar-nav .has-arrow[aria-expanded=false]::after {
         border-color: var(--bs-dark);
     }

     .sidebar-nav .has-arrow[aria-expanded=true]::after, .sidebar-nav li.active>.has-arrow::after, .sidebar-nav li>.has-arrow.active::after {
         top: 18px;
         margin-top: 1px;
         border-color: #fff;
     }

     .sidebar-item.selected .has-arrow::after {
         border-color: #ffffff;
     }


     .left-sidebar {
          background: var(--bs-light-purple); 
          border-right: 1px solid rgba(var(--bs-primary-rgb),.01)!important;
     }

     .sidebar-nav ul .sidebar-item .sidebar-link .icon {
          flex-shrink: 0;
          font-size: 21px;
     }

     .sidebar-nav ul .sidebar-item .sidebar-link .icon-sm {
          flex-shrink:      0;
          font-size:        8px;
          margin-left:      10px;
     }
     
     .sidebar-nav ul .sidebar-item.selected>.sidebar-link, .sidebar-nav ul .sidebar-item.selected>.sidebar-link.active, .sidebar-nav ul .sidebar-item>.sidebar-link.active {
          background: linear-gradient(135deg, #4246fd 0%, #881cf9 80%) !important;
          color: #FFF;
     }
     
     .sidebar-nav ul .sidebar-item .sidebar-link:hover.has-arrow::after {
         border-color: #fff;
     }

     .sidebar-nav ul .sidebar-item .sidebar-link {
          color: var(--bs-dark);
     }

     .sidebar-nav ul .sidebar-item .sidebar-link:hover {
         background: linear-gradient(135deg, #686bfd 0%, #9c41fa 80%) !important;
         color: #FFF;
     }
     
     .sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link:hover {
         color: #FFF;
     }

     .sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link.active {
         background-color: transparent!important;
         background: linear-gradient(to bottom right, #4246fd, #881cf9);
         background-image: linear-gradient(to right, #4246fd, #881cf9);
         -webkit-background-clip: text !important;
         -webkit-text-fill-color: transparent !important;
     }


/* size */


     @media (min-width: 992px) {

          #main-wrapper[data-layout=vertical][data-sidebartype=mini-sidebar] .left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link {
              padding: 11px 6px;
          }

     }


/* background */
     
     .bg-gradient {
         color: #ffffff;
         background: linear-gradient(to bottom right, #4246fd, #881cf9) !important;
         background-image: linear-gradient(to right, #4246fd, #881cf9) !important;
     }

     .bg-body-color {
          
          /*background-color: rgba(246,249,252, 1);
          background: linear-gradient(0deg, rgba(246,249,252,1) 0%, rgba(255,255,255,1) 100%);*/
     }

     .bg-light-warning {
         background-color: rgba( var(--bs-warning-rgb), .1 ) !important;
     }

     .bg-light-info {
         background-color: rgba( var(--bs-info-rgb), .1 ) !important;
     }

     .bg-light-danger {
         background-color: rgba( var(--bs-danger-rgb), .1 ) !important;
     }

     .bg-light-success {
         background-color: rgba( var(--bs-success-rgb), .1 ) !important;
     }

     .bg-light-purple {
          background-color: rgba(var(--bs-primary-rgb),.07)!important;
     }

     .bg-login {
          background: linear-gradient(135deg, #4246fd 0%, #881cf9 80%) !important;
     }

     .bg-light {
         background-color: rgba(var(--bs-primary-rgb),.07)!important;
     }

     .bg-light-secondary {
          background-color: rgba(var(--bs-secondary-rgb),.07)!important;
     }

/* text */

     .page-title, .breadcrumb-item {
          text-transform: capitalize;
     }

     .text-purple {
          color: #6563ff;
     }

     .text-green {
          color: #31d9b3;
     }

     .text-blue {
          color: #539bff;
     }
     
     .text-yellow {
          color: #ffae1f;
     }
     
     .text-orange {
          color: #fa896b;
     }

     .text-light-success {
         color: rgba( var(--bs-success-rgb), .1 ) !important;
     }

/* preloader */

     .preloader {
         z-index: 2000;
         width: 100vw;
         height: 100vh;
         background-color: rgba( var(--bs-dark-purple-rgb), .75);
         backdrop-filter: blur(5px);
         overflow: hidden;
         position: fixed;
     }


/* dropzone */

     .dropzone {
         border-style: dashed;
         border-color: var(--bs-light);
         border-width: 2px;
          min-height: auto;
     }

     .dropzone .dz-preview .dz-image {
          border-radius: unset;
     }

     .dropzone .dz-preview.dz-image-preview {
         background: transparent;
     }

     .dz-remove {
          margin-top: 15px;
     }

     .dropzone .dz-message .dz-button
     {
          color: var(--bs-success);
     }

     .dropzone .dz-preview .dz-error-message {
          width: 100%;
          left: unset;
     }

     .dropzone .dz-preview .dz-error-message:after {
          left: 50%;
     }
     
     .dropzone .dz-message {
         margin: 7em 0;
          font-weight: 500;
     }

/* buttons */
     
     
     .btn {
          
          --bs-btn-padding-x: 1rem;
          --bs-btn-padding-y: .5rem;
          --bs-btn-font-size: 1rem;
          --bs-btn-font-weight: 500;
          --bs-btn-line-height: 1.75rem;
          
          font-weight: 400;
          text-transform: uppercase;
          
     }

     .btn-lg, .btn-group-lg > .btn {
         --bs-btn-padding-y: 0.9375rem;
         --bs-btn-padding-x: 1.375rem;
         --bs-btn-font-size: 1rem;
     }

     .btn-close {
         --bs-btn-close-bg: none;
     }

     .btn-transparent {
          background: transparent;
     }
     
     .btn-transparent:hover {
          background-color: rgba(var(--bs-primary-rgb),.07)!important;
     }

     .btn-transparent.show, .btn-transparent:active {
          border-color: transparent !important;
     }
     
     .bg-hover-primary:hover {
         color: var(--bs-primary) !important;
     }

     .btn-primary {
          
         --bs-btn-color: #fff;
         --bs-btn-bg: var(--bs-primary);
         --bs-btn-border-color: transparent;
         --bs-btn-hover-color: #fff;
         --bs-btn-hover-bg: rgba( var( --bs-primary-rgb ), .8 );
         --bs-btn-hover-border-color: transparent;
         --bs-btn-focus-shadow-rgb: 244,244,244;
         --bs-btn-active-color: #fff;
         --bs-btn-active-bg: rgba( var( --bs-primary-rgb ), .8 );
         --bs-btn-active-border-color: transparent;
         --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
         --bs-btn-disabled-color: #fff;
         --bs-btn-disabled-bg: rgba( var(--bs-dark-rgb), .4);
         --bs-btn-disabled-border-color: transparent;
          
          text-transform: uppercase;
          background: linear-gradient(135deg, #4246fd 0%, #881cf9 80%) !important;
          color: #FFF;

     }

     .btn-primary:not(.btn-outline):hover, .btn-primary:not(.btn-outline).hover, .btn-badge:hover {
          background: linear-gradient(135deg, #686bfd 0%, #9c41fa 80%) !important;
          color: #FFF !important;
     }

     .btn-outline-primary {
          
         --bs-btn-color: var(--bs-primary);
         --bs-btn-bg: #ffffff;
         --bs-btn-border-color: var(--bs-primary);
         --bs-btn-hover-color: #fff;
         --bs-btn-hover-bg: rgba( var( --bs-primary-rgb ), 1 );
         --bs-btn-hover-border-color: rgba( var( --bs-primary-rgb ), 1 );
         --bs-btn-focus-shadow-rgb: 244,244,244;
         --bs-btn-active-color: #fff;
         --bs-btn-active-bg: rgba( var( --bs-primary-rgb ), 1 );
         --bs-btn-active-border-color: rgba( var( --bs-primary-rgb ), 1 );
         --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
         --bs-btn-disabled-color: #fff;
         --bs-btn-disabled-bg: rgba( var(--bs-dark-rgb), .4);
         --bs-btn-disabled-border-color: rgba( var(--bs-dark-rgb), .4);
          
          text-transform: uppercase;
          
     }


     .btn-secondary {
          
         --bs-btn-color: #fff;
         --bs-btn-bg: var(--bs-secondary);
         --bs-btn-border-color: var(--bs-secondary);
         --bs-btn-hover-color: #fff;
         --bs-btn-hover-bg: rgba( var( --bs-secondary-rgb ), .8 );
         --bs-btn-hover-border-color: rgba( var( --bs-secondary-rgb ), .8 );
         --bs-btn-focus-shadow-rgb: 244,244,244;
         --bs-btn-active-color: #fff;
         --bs-btn-active-bg: rgba( var( --bs-secondary-rgb ), .8 );
         --bs-btn-active-border-color: rgba( var( --bs-secondary-rgb ), .8 );
         --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
         --bs-btn-disabled-color: #fff;
         --bs-btn-disabled-bg: rgba( var(--bs-dark-rgb), .4);
         --bs-btn-disabled-border-color: rgba( var(--bs-dark-rgb), .4);
          
          text-transform: uppercase;
          
     }

     
     .btn-dark {
         --bs-btn-color: #fff;
         --bs-btn-bg: var(--bs-dark);
         --bs-btn-border-color: var(--bs-dark);
         --bs-btn-hover-color: #fff;
         --bs-btn-hover-bg: #32383e;
         --bs-btn-hover-border-color: #32383e;
         --bs-btn-focus-shadow-rgb: 74,83,99;
         --bs-btn-active-color: #fff;
         --bs-btn-active-bg: #32383e;
         --bs-btn-active-border-color: #32383e;
         --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
         --bs-btn-disabled-color: #fff;
         --bs-btn-disabled-bg: rgba( var(--bs-dark-rgb), .4);
         --bs-btn-disabled-border-color: rgba( var(--bs-dark-rgb), .4);
     }


     .btn-danger {
          
         --bs-btn-color: #fff;
         --bs-btn-bg: var(--bs-danger);
         --bs-btn-border-color: var(--bs-danger);
         --bs-btn-hover-color: #fff;
         --bs-btn-hover-bg: rgba( var( --bs-danger-rgb ), .8 );
         --bs-btn-hover-border-color: rgba( var( --bs-danger-rgb ), .8 );
         --bs-btn-focus-shadow-rgb: 244,244,244;
         --bs-btn-active-color: #fff;
         --bs-btn-active-bg: rgba( var( --bs-danger-rgb ), .8 );
         --bs-btn-active-border-color: rgba( var( --bs-danger-rgb ), .8 );
         --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
         --bs-btn-disabled-color: #fff;
         --bs-btn-disabled-bg: rgba( var(--bs-danger-rgb), .4);
         --bs-btn-disabled-border-color: rgba( var(--bs-danger-rgb), .4);
          
          text-transform: uppercase;
          
     }

     .btn-success {
          
         --bs-btn-color: #fff;
         --bs-btn-bg: var(--bs-success);
         --bs-btn-border-color: var(--bs-success);
         --bs-btn-hover-color: #fff;
         --bs-btn-hover-bg: rgba( var( --bs-success-rgb ), .8 );
         --bs-btn-hover-border-color: rgba( var( --bs-success-rgb ), .8 );
         --bs-btn-focus-shadow-rgb: 244,244,244;
         --bs-btn-active-color: #fff;
         --bs-btn-active-bg: rgba( var( --bs-success-rgb ), .8 );
         --bs-btn-active-border-color: rgba( var( --bs-success-rgb ), .8 );
         --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
         --bs-btn-disabled-color: #fff;
         --bs-btn-disabled-bg: rgba( var(--bs-success-rgb), .4);
         --bs-btn-disabled-border-color: rgba( var(--bs-success-rgb), .4);
          
          text-transform: uppercase;
          
     }

     
     .btn-circle {
          font-size: 1.25rem;
          padding-top: .5rem;
     }

/* toast */

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

/* row */

     .g-gs, .gy-gs {
         --bs-gutter-y: 1.75rem;
     }


/* form */
     
     .form-control, .form-select {
          background-color: #fff;
          color: var(--bs-dark) !important;
          border: var(--bs-border-width) solid #dfe5ef;
          border-radius: 7px !important;
     }

     .form-control:focus, .form-select:focus {
         color: var(--bs-dark);
         background-color: #fff;
         border-color: rgba(var(--bs-primary-rgb), .5);
         outline: 0;
         box-shadow: unset,0 0 0 .25rem rgba(var(--bs-primary-rgb),.25);
     }

     .form-control-lg {
         padding: 0.7rem 1rem !important;
     }

     .form-control-transparent {
          border: none;
          background: transparent;
     }
     
     .form-control-transparent.form-title {
          font-size: 2rem;
          font-weight: bold;
     }

     .form-floating>.form-control-plaintext~label, .form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label {
         color:      rgba(var(--bs-dark-rgb),.65);
         transform: scale(.85) translateY(-0.5rem) translateX(0.15rem);
     }

     .form-floating>textarea.form-control {
          height: auto;  
     }

     .form-select:disabled,.form-control:disabled {
         background-color: rgba(var(--bs-secondary-rgb), .05);
         opacity: .6;
     }

     .form-floating>:disabled~label::after {
         background-color: transparent;
     }


/* form validation */

     .form-control.is-invalid, .was-validated .form-control:invalid, .form-check-input.is-invalid, .was-validated .form-check-input:invalid, .form-select.is-invalid, .was-validated .form-select:invalid {
         border-color: var(--bs-danger);
          background: unset;
     }

     .form-control.is-valid, .was-validated .form-control:valid.form-check-input.is-valid, .was-validated .form-check-input:valid, .form-select.is-valid, .was-validated .form-select:valid {
          border-color: var(--bs-success);
          background: unset;
     }


/* table */
     
     .table-responsive {
          overflow-x: auto;
          min-height: 400px;
     }

     div.table-container {
          min-height: 300px;
     }

     .table>:not(caption)>*>* {
          color: var(bs-text-color) !important;
     }

     table.dataTable.table-striped>tbody>tr.odd>* {
         box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.02);
     }

     th {
          color: var(--bs-dark) !important;
          font-weight: 600;
          vertical-align: middle;
     }

     td {
          color: rgba(var(--bs-dark-rgb), .8)!important;
          font-weight: normal;
          font-size: 0.875rem;
          vertical-align: middle;
     }
     
     .dataTables_filter input, .dataTables_length select {
         display: block;
         width: 100%;
         padding: 8px 16px;
         font-size: .875rem;
         font-weight: 400;
         line-height: 1.5;
         color: #5a6a85;
         background-color: transparent;
         background-clip: padding-box;
         border: var(--bs-border-width) solid #dfe5ef;
         appearance: none;
         border-radius: 7px;
         box-shadow: unset;
         transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
     }


     .dataTable-pagination {
       padding: 0.375rem 0.25rem;
       position: relative;
       text-decoration: none;
       min-width: 2.375rem;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       line-height: 1.5rem;
       border-radius: 0.375rem;
       font-size: 0.875rem;
       color: var(--bs-dark);
       font-weight: 500;
       border: 1px solid transparent;
     }

     .active.dataTable-pagination {
          color: var(--bs-dark) !important;
          background-color: #e7e1fe !important;
          border-color: #e7e1fe !important;
     }

     .dataTable-pagination:hover {
       color: #5f38f9 !important;
       background-color: #e7e1fe !important;
       border-color: #e7e1fe !important;
     }
     
     .dataTable-current,
     .dataTable-pagination .active,
     .dataTable-pagination .active:focus,
     .dataTable-pagination .active:hover {
       background-color: #dfd7fe;
       cursor: default;
       color: var(--bs-dark) !important;
       border-color: #dfd7fe;
     }

     .dataTable-pagination .ellipsis,
     .dataTable-pagination .disabled,
     .dataTable-pagination:focus .disabled,
     .dataTable-pagination:hover .disabled {
       cursor: not-allowed;
     }

     a.dataTable-pagination .disabled a,
     a.dataTable-pagination .disabled a:focus,
     a.dataTable-pagination .disabled a:hover {
       cursor: not-allowed;
       opacity: 0.4;
     }
     a.dataTable-pagination .pager {
       font-size: 0.875rem;
     }

     a.dataTable-pagination .pager .icon {
       font-size: 1.09375rem;
       line-height: 1.5rem;
     }
     
     .dataTable-selector {
          margin-left: 0px;
     }

     table.dataTable.table-hover>tbody>tr:hover>* {
         box-shadow: inset 0 0 0 9999px var(--bs-light);
     }


/* google maps */

     .pac-container {
          z-index: 10000;
     }

/* offcanvas */

     .offcanvas, .offcanvas-lg, .offcanvas-md, .offcanvas-sm, .offcanvas-xl, .offcanvas-xxl {
         --bs-offcanvas-zindex: 1045;
         --bs-offcanvas-width: 100%;
         --bs-offcanvas-height: 30vh;
         --bs-offcanvas-padding-x: 2rem;
         --bs-offcanvas-padding-y: 2rem;
         --bs-offcanvas-color: var(--bs-body-color);
         --bs-offcanvas-bg: var(--bs-body-bg);
         --bs-offcanvas-border-width: 0;
         --bs-offcanvas-border-color: var(--bs-border-color-translucent);
         --bs-offcanvas-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
         --bs-offcanvas-transition: transform 0.3s ease-in-out;
         --bs-offcanvas-title-line-height: 1.5;
          max-width: 500px;
     }

     .offcanvas-header {
          padding: 1.5rem;
          background: var(--bs-light-purple); 
          border-bottom: 1px solid rgba(var(--bs-primary-rgb),.03)!important;
     }

     .offcanvas {
          z-index: 10000;
     }

     .offcanvas-backdrop {
          z-index: 9998;
          /*background: linear-gradient(135deg, #4246fd 0%, #881cf9 80%) !important;*/
          background: var(--bs-dark-purple);
     }

     .offcanvas-backdrop.show {
          opacity: .75;
          backdrop-filter: blur(5px);
     }

     .offcanvas-backdrop.fade.show {
          pointer-events:none !important;
          content: "/assets/images/blank.png";
          backdrop-filter: blur(5px);
     }

     .offcanvas-overlay-block
     {
          position: fixed;
          top: 0; 
          left: 0; 
          z-index: 9999;
          backdrop-filter: blur(5px); 
     }


/* modal */

     .modal {
          backdrop-filter: blur(5px);
     }


     .modal-backdrop {
          /*background: linear-gradient(135deg, #4246fd 0%, #881cf9 80%) !important;*/
          background: var(--bs-dark-purple);
     }
     
     .modal-backdrop.show {
          opacity: .75;
          backdrop-filter: blur(5px);
     }

     .modal-xl .modal-content
     {
          border-radius: 1rem;
     }

     .modal-xl .modal-header
     {
          border-top-left-radius: 1rem;
          border-top-right-radius: 1rem;
     }

     .modal-xl .modal-footer     
     {
          border-bottom-left-radius: 1rem;
          border-bottom-right-radius: 1rem;
     }

     .modal-header {
          border-radius: 1rem 1rem 0 0;
     }
 
     .modal-footer {
          border-radius: 0 0 1rem 1rem;
          border-bottom-right-radius: var(--bs-modal-inner-border-radius);
          border-bottom-left-radius: var(--bs-modal-inner-border-radius);
     }

     
     .modal-fullscreen {
          /*padding: .5rem;*/
     }
     
     .modal-fullscreen .modal-content{
          border-radius: 0;    
     }
     
     .modal-fullscreen .modal-header {
          /*border-radius: 1rem 1rem 0 0;*/
          border-radius: 0 0 0 0 !important;
     }

     .modal-fullscreen .modal-footer {
         border-radius: 0 0 0 0 !important;
     }


/* container */

     .body-wrapper>.container-fluid, .body-wrapper>.container-lg, .body-wrapper>.container-md, .body-wrapper>.container-sm, .body-wrapper>.container-xl, .body-wrapper>.container-xxl {
         max-width: 98%; /* 1300px */
     }


/* menu */
     
     .dropdown-menu {
          --bs-dropdown-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 2px 0px,rgba(0, 0, 0, 0.12) 0px 12px 24px -4px
     }

     .dropdown-divider {
         border-top: 1px solid rgba( var(--bs-dark-rgb), .1 );
     }

     .navbar-nav .hover-dd .dropdown-menu-nav {
         max-width: 600px;
         width: auto;
     }

     .navbar-nav .dropdown-menu {
         position: absolute;
         min-width: 250px;
     }
     .navbar-nav {
         --bs-nav-link-color: var(--bs-dark) !important;
     }
     
     .dropdown-item:focus, .dropdown-item:hover, .bg-hover-light-primary:hover {
         color: var(--bs-dropdown-link-hover-color) !important;
         background-color: rgba( var(--bs-primary-rgb), .05) !important;
     }


/* checkbox / switch */
     
     .form-check-lg {
         min-height: 2rem;
     }

     .form-check-lg.form-switch .form-check-input {
         width: 3rem;
     }
     .form-check-lg .form-check-input {
         margin-top: 0.25rem;
         height: 1.5rem;
         width: 1.5rem;
     }

     .input-group-text {
          background: var(--bs-light);
          color: var(--bs-text-color);
     }

     .form-check-input:checked {
          background-color: var(--bs-primary);
          border-color: var(--bs-primary);
     }

/* colors */

     .minicolors-theme-bootstrap .minicolors-swatch {
         top: 5px;
         left: 5px;
     }


/* form row */

     .form-row {
          padding-top: 0.875rem;
          padding-bottom: 0.875rem;
     }

     .form-row:nth-child(even) {
         --bs-bg-opacity: 1;
         background-color: rgba(var(--bs-light-rgb),var(--bs-bg-opacity))!important;
     }


/* lists */

     .note-editable ol {
          list-style: decimal;
          padding-left: 1.5rem;
     }

     .note-editable ul {
          list-style: disc;
          padding-left: 1.5rem;
     }


/* summernote */
     
     .note-frame {
          border: 1px solid #dfe5ef !important;
          border-radius: 7px;
     }

     .note-modal-footer {
         height: 70px;
     }


/* tabs */

     .nav .nav-item .nav-link.active, .nav-tabs .nav-item .nav-link.active {
          color: #fff;
          background: linear-gradient(135deg, #686bfd 0%, #9c41fa 80%) !important;
          border-bottom: transparent;
          font-weight: 500;
          border-radius: 7px;
          font-weight: normal;
     }
     
     .nav .nav-item .nav-link {
          color: var(--bs-dark);
          font-size: .9rem;
          border-radius: 7px;
          font-weight: 500;
          /*background-color: rgba(var(--bs-primary-rgb),.07)!important;*/
     }

     .nav .nav-item .nav-link:hover {
          color: #fff;
          background: linear-gradient(135deg, #686bfd 0%, #9c41fa 80%) !important;
     }
         

/* hr */

     hr {
          color: #dfe5ef;
          opacity: 1;
     }