[data-bs-theme=dark][data-color-theme=Blue_Theme]:root,
[data-bs-theme=light][data-color-theme=Blue_Theme]:root
{
     


     --bs-padding-top: 70px;
     
    
     /* fonts */

          /* --bs-font-sans-serif: "Mona Sans", sans-serif; */
          --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
          --bs-font-weight: normal;
          --bs-font-weight-bold: 500;

          --bs-body-font-size: 1rem;
          --bs-body-font-weight: var(--bs-font-weight);
          --bs-body-line-height: 1.5;
     
         
     /* body */
     
          --bs-heading-color: var(--bs-dark);
          --bs-body-color: rgba(var(--bs-dark-rgb),.7) !important;
          --bs-body-color-rgb: var(--bs-dark-rgb);


     --bs-primary: #7536d8;
     --bs-primary-rgb: 117,54,216;
     --bs-primary-bg-subtle: rgba( var(--bs-primary-rgb), 0.075);
     
     
     --bs-light-primary: rgba( var(--bs-primary-rgb), 0.03);
     --bs-dark-primary: #10081e;
     
     --bs-secondary: #1d0e36;
     --bs-secondary-rgb: 29,14,54;
     --bs-light-secondary: rgba(var(--bs-secondary-rgb), 0.1);
     --bs-dark-secondary: #000000;
     --bs-secondary-bg-subtle: rgba(var(--bs-secondary-rgb), 0.3);
     
     /*
     --bs-dark: #10081e;
     --bs-dark-rgb: 16,8,30;
     */

     --bs-dark: #000000; /* #1d0e36; */
     --bs-dark-rgb: 0, 0, 0; /* 29,14,54; */
     --bs-dark-bg-subtle: rgba(var(--bs-dark-rgb), .03) !important;
          
     --bs-gradient: linear-gradient(145deg, var(--bs-primary) 0%, #fa0bcc 100%) !important;
     --bs-gradient-reverse: linear-gradient(145deg, #fa0bcc 0%, var(--bs-primary) 100%) !important;
     
     --bs-success: #22c55e;     
     --bs-success-rgb: 34,197,94;
     
     --bs-success-bg-subtle: rgba( 0,166,81, .1);
     
     --bs-info: #38bdf8;
     --bs-info-rgb: 56,189,248;

     --bs-warning: #f59e0b;
     --bs-warning-rgb: 245,158,11
     
     --bs-danger: #ef4444;
     --bs-danger-rgb: 239,68,68;
          
     --bs-light: var(--bs-dark-bg-subtle);; /* rgba( var(--bs-primary-rgb), 0.03); */
     --bs-light-rgb: 251, 251, 251;
     --bs-lighter: #fdfdff;


     --bs-shadow         : rgba(var(--bs-dark-rgb), 0.1) 0px 0px 2px 0px, rgba(var(--bs-dark-rgb), 0.05) 0px 12px 24px -4px;
     --bs-box-shadow     : rgba(var(--bs-dark-rgb), 0.1) 0px 0px 2px 0px, rgba(var(--bs-dark-rgb), 0.05) 0px 12px 24px -4px;
     --bs-box-shadow-sm  : rgba(var(--bs-dark-rgb), 0.1) 0px 0px 2px 0px, rgba(var(--bs-dark-rgb), 0.05) 0px 12px 24px -4px;
     


     /* blur */
     
          --bs-blur: 10rem;
     
     
     /* headings */
     
          --bs-heading-color: #111741;


     
     /* links */     
     
          --bs-link-color: var(--bs-dark);
          --bs-link-color-rgb: var(--bs-dark-rgb);
     
          --bs-link-hover-color: rgba( var(--bs-dark-rgb), .5);
          --bs-link-hover-color-rgb: rgba( var(--bs-dark-rgb), .5);


     /* borders */
     
          --bs-border-radius: .5rem;
          --bs-border-width: 1px;
          --bs-border-color: var(--bs-dark-bg-subtle) !important;
          --bs-btn-border-radius: 2rem;
     

     /* button */
          
          .btn 
          {
               --bs-btn-font-weight: normal;
               border-radius: 2rem;
               transition: all 0.3s ease-in-out !important;
               --bs-btn-disabled-color: var(--bs-dark);
               --bs-btn-disabled-bg: var(--bs-dark-bg-subtle) !important;
               --bs-btn-disabled-border-color: transparent;

          }

          .btn-dark
          {
               --bs-btn-bg: var(--bs-dark);
               --bs-btn-hover-bg: rgba(var(--bs-dark-rgb), .7) !important;
          }

          .btn-primary 
          {
              --bs-btn-color: #fff;
              --bs-btn-bg: var(--bs-primary);
              --bs-btn-border-color: var(--bs-primary);
              --bs-btn-hover-color: #fff;
              --bs-btn-hover-bg: rgba( var(--bs-dark-rgb ), 1);
              --bs-btn-hover-border-color: transparent;
              --bs-btn-focus-shadow-rgb: 251, 155, 129;
              --bs-btn-active-color: #fff;
              --bs-btn-active-bg: rgba( var(--bs-dark-rgb ), .25);
              --bs-btn-active-border-color: transparent;
              --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
              --bs-btn-disabled-color: var(--bs-dark);
              --bs-btn-disabled-bg: var(--bs-dark-bg-subtle) !important;
              --bs-btn-disabled-border-color: transparent;
          }
     
          .btn-secondary 
          {

               --bs-btn-bg: var(--bs-secondary);
               --bs-btn-border-color: var(--bs-secondary);

               --bs-btn-hover-bg: var(--bs-primary);
               --bs-btn-hover-border-color: var(--bs-primary);
               --bs-btn-hover-color: #fff;

               --bs-btn-focus-shadow-rgb: 117, 153, 255;
               --bs-btn-active-color: #fff;
               --bs-btn-active-bg: var(--bs-primary);
               --bs-btn-active-border-color: var(--bs-primary);
               --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

               --bs-btn-disabled-color: var(--bs-secondary-bg-subtle);
               --bs-btn-disabled-bg: var(--bs-secondary-bg-subtle);
               --bs-btn-disabled-border-color: var(--bs-secondary-bg-subtle);
          }
     
          .btn-outline-primary 
          {

               --bs-btn-bg: transparent;
               --bs-btn-border-color: var(--bs-primary);
               --bs-btn-color: var(--bs-primary);

               --bs-btn-hover-bg: var(--bs-dark-primary);
               --bs-btn-hover-border-color: var(--bs-dark-primary);
               --bs-btn-hover-color: #fff;

               --bs-btn-focus-shadow-rgb: 117, 153, 255;
               --bs-btn-active-color: #fff;
               --bs-btn-active-bg: var(--bs-dark-primary);
               --bs-btn-active-border-color: var(--bs-dark-primary);
               --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

               --bs-btn-disabled-color: #fff;
               --bs-btn-disabled-bg: var(--bs-primary-bg-subtle);
               --bs-btn-disabled-border-color: var(--bs-primary-bg-subtle);

          }

          .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 ), .5);
              --bs-btn-hover-border-color: transparent;
              --bs-btn-focus-shadow-rgb: 251, 155, 129;
              --bs-btn-active-color: #fff;
              --bs-btn-active-bg: rgba( var(--bs-danger-rgb ), .5);
              --bs-btn-active-border-color: transparent;
              --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
              --bs-btn-disabled-color: var(--bs-danger)
              --bs-btn-disabled-bg: rgba( var(--bs-danger-rgb ), .3);
              --bs-btn-disabled-border-color: transparent;
          }     
          
          .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 ), .5);
              --bs-btn-hover-border-color: transparent;
              --bs-btn-focus-shadow-rgb: 251, 155, 129;
              --bs-btn-active-color: #fff;
              --bs-btn-active-bg: rgba( var(--bs-success-rgb ), .5);
              --bs-btn-active-border-color: transparent;
              --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
              --bs-btn-disabled-color: var(--bs-success)
              --bs-btn-disabled-bg: rgba( var(--bs-success-rgb ), .3);
              --bs-btn-disabled-border-color: transparent;
          }

          .input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) 
          {
               margin-left: calc(var(--bs-border-width)* -1);
               border-radius: var(--bs-border-radius);
               border-top-left-radius: 0;
               border-bottom-left-radius: 0;
          }
    
          .accordion-button {
               font-weight: var(--bs-btn-font-weight); 
          }

          .accordion-button:not(.collapsed) {
               color: var(--bs-primary);
          }

     
     
}


/* html body */

     
     body {
          background: #ffffff;
     }
         
     .body-wrapper, .container-fluid, .container
     { 
          background: transparent;
     }
     
     .body-wrapper
     {
          max-height: calc(100vh - var(--bs-padding-top) );
          padding-top: var(--bs-padding-top);
     }

     @media (min-width: 1500px) {
          .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
               max-width: 1500px;
          }
     }
     @media (min-width: 2000px) {
          .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl, .container-fluid {
               max-width: 1600px !important;
          }
     }

/* images */
     
     .background-image {
          background-size: cover !important;
          background-position: top center !important;
          background-repeat: no-repeat !important;
          border-radius: var(--bs-border-radius);
     }


/* border radius */

     .border-radius, .form-control, .form-select
     {
          border-radius: var( --bs-border-radius );
     }


/* background */
     

     .bg-light
     {
         background-color: var(--bs-light) !important;
     }

     .bg-lighter
     {
         background-color: #fdfdff;
     }

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


     .bg-wrapper-gradient
     {
          background:  linear-gradient(180deg, #fff 0%, rgba( var(--bs-primary-rgb), 1) 80%, #fff 100%);
     }
     
     
     .bg-icons, .dropzone
     {
          /*background-size: 200px;
          background-image: url(https://cdn.tickets.fit/images/tickets-bg-tile.png);
          background-repeat: repeat;*/
     }

     .gradient-icon {
       background: linear-gradient(145deg, var(--bs-primary) 0%, #fa0bcc 100%);
       -webkit-background-clip: text;
       -webkit-text-fill-color: transparent;
       display: inline-block;
     }

     .bg-dotted
     {
          background-image:
          radial-gradient(var(--bs-dark-bg-subtle) 2px, transparent 2px),
          radial-gradient(var(--bs-dark-bg-subtle) 2px, transparent 2px);
          background-size: 20px 20px;
          background-position: 0 0, 10px 10px;
     }

     .bg-diagonal 
     {
       background-image: repeating-linear-gradient(
         45deg,            /* Angle of the lines */
         #fff,             /* Line color */
         #fff 1px,         /* Line thickness */
         transparent 1px,  /* Start of gap */
         transparent 5px  /* Gap width */
       );
      background-color:  rgba(var(--bs-dark-rgb),.1) !important;
     }

     .bg-grid
     {
          background-image:
          linear-gradient(to right, var(--bs-dark-bg-subtle) 1px, transparent 1px),
          linear-gradient(to bottom, var(--bs-dark-bg-subtle) 1px, transparent 1px);
          background-size: 20px 20px; /* grid cell size */
     }


/* HR */

     hr 
     {
         margin: 1rem 0;
         color: inherit;
         border: 0;
         border-top: 2px solid var(--bs-border-color);
         opacity: 1;
     }

     .hr 
     {
          margin: 1rem 0;
          height: 1px;
          background: linear-gradient(145deg, var(--bs-primary) 0%, #fa0bcc 100%) !important;
     }

/* calendar */


     .calendar {
          border-radius: var( --bs-border-radius );
          overflow: hidden;
          min-width: 80px;
     }

     .calendar .month, .calendar .year {
          background-color:  var(--bs-dark-bg-subtle) !important;
          margin: 0;
          padding: .1rem;
     }
     
     .calendar .day {
          border: 1px solid var(--bs-dark-bg-subtle) !important;
          margin: 0;
          font-size: 1.9rem;
          background: #fff;
          padding: .25rem;
     }


/* links */

     a:link:not(.dropdown-item), a:active:not(.dropdown-item), a:hover:not(.dropdown-item), a:visited:not(.dropdown-item)
     {
          font-weight: normal !important;
     }


/* header */

     .header {
          background: #fff;
          border-bottom: 2px solid var(--bs-border-color);
          backdrop-filter: blur(var(--bs-blur));
     }

     .header.scrolled, .blur-overlay {
          box-shadow: var(--bs-box-shadow);
          border-bottom: 2px solid transparent;
          background: var(--bs-light);
          backdrop-filter: blur(var(--bs-blur));
     }

     .image-blur-overlay {
          background-color: rgba(255,255,255, 1);
          backdrop-filter: blur(var(--bs-blur));
          height: 100%;
          width: 100%;
     }

     .box-shadow {
          box-shadow: var(--bs-box-shadow);
     }

     footer {
          background: var(--bs-light);
     }

/* list group */
     
     .list-group-item
     {
          background: transparent;
     }

     .list-group-item-action, .list-group-item-action:link {
          width: 100%;
          color: var(--bs-dark);
          text-align: inherit;
          border-radius: var(--bs-btn-border-radius);
          font-weight: normal;
     }
  
     .list-group-item-action:focus, .list-group-item-action:hover {
          z-index: 1;
          text-decoration: none;
          transition: all 0.2s ease;
          background: var(--bs-dark-bg-subtle);
     }
     
     .list-group-item-action:hover {
          color: var(--bs-dark);
          background: var(--bs-dark-bg-subtle);
     }

     .list-group-item-action.active {
          background: var(--bs-primary);
          color: #fff;
     }

     

/* dropzone */

     .dropzone
     {
          border: none !important;
          background-color: unset;
     }

/* card */
     

     .card {
          --bs-card-border-radius: var(--bs-border-radius);
          --bs-card-box-shadow: var(--bs-shadow);
          --bs-card-border-color: var(--bs-border-color);
          /*--bs-card-border-width: 2px;*/
          --bs-card-cap-bg: rgba(var(--bs-body-color-rgb), 0.0);
          --bs-card-cap-padding-y: 0;
          --bs-card-cap-padding-x: 0;
          box-shadow: none;
     }

     .card-header {
          border-bottom: none;
     }
     
     .card-hover {
         position: relative; /* establish positioning context for absolute children */
         transition: transform 0.2s ease, box-shadow 0.2s ease;
         transform-origin: center center;
     }

     .card-hover:hover {
         transform: translate3d(0, -5px, 0) scale(1.01);
         box-shadow: rgba(var(--bs-primary-rgb), 0.2) 0px 0px 2px 0px,  rgba( var(--bs-primary-rgb) , 0.2) 0px 0px 24px -4px;
         transition: transform 0.2s ease, box-shadow 0.2s ease;
     }
     
     .card-shadow {
          box-shadow: var( --bs-box-shadow )
     }

/* dropdown */

     .dropdown-menu {
          --bs-dropdown-item-border-radius: var(--bs-border-radius);
          --bs-dropdown-border-radius: var(--bs-border-radius);
          --bs-dropdown-box-shadow: none;
          --bs-dropdown-border-color: rgba(var(--bs-dark-rgb), .05);
          --bs-dropdown-link-color: var(--bs-dark);
          --bs-dropdown-link-hover-color: var(--bs-dark-primary);
          --bs-dropdown-link-hover-bg: var(--bs-dark-bg-subtle);
          --bs-dropdown-divider-bg: var(--bs-dark-bg-subtle);
          --bs-dropdown-padding-x: 2px;
          --bs-dropdown-padding-y: 2px;
          --bs-dropdown-divider-margin-y: 2px;
          --bs-dropdown-font-size: 1rem;
          --bs-dropdown-min-width: 10rem;

          box-shadow: var(--bs-box-shadow-sm) !important;
     }

     .dropdown-item {
          font-size: .85rem;
     }

     .dropdown-toggle.no-arrow::after 
     {
         margin-left: 0;
         vertical-align: 0;
         border-top: 0;
         border-right: 0;
         border-bottom: 0;
         border-left: 0;
     }

     .dropdown-divider {
     }


/* ticket */

     .ticket-cutout
     {

       position: absolute;
       top: 50%;
       left: -12px;
       transform: translateY(-50%);
       width: 24px;
       height: 24px;
       background: #fff;
       border-radius: 50%;
       z-index: 1;

     }
     
     .ticket-cutout.right
     {
          right: -12px;
     }
/* text gradient */
     
     .text-gradient {
           color: var(--bs-dark); 
           background-image: var(--bs-gradient);
           background-clip: text; 
           -webkit-background-clip: text; 
           -webkit-text-fill-color: transparent; 
     }

     .btn-gradient:not(.btn-outline) {
          border-color: transparent;
          background: var(--bs-gradient);
          color: #FFF;
          transition: opacity 0.4s ease-in-out !important;
     }

     .btn-gradient:not(.btn-outline):hover, .btn-gradient:not(.btn-outline).hover {
          background: var(--bs-gradient);
          color: #FFF;
     }
     
     .text-danger, .text-success {
          background-image: unset !important; 
          background-clip: unset !important; 
          -webkit-background-clip: unset !important; 
          -webkit-text-fill-color: unset !important; 
     }


/* page title */

     .page-title-wrapper {
          position: relative; /* Needed so ::before is positioned correctly */
          z-index: 1; /* So content is above the gradient layer */
          border-radius: var(--bs-border-radius); /* Inherit border-radius from card, if it's not set directly */
          overflow: hidden; /* Ensures ::before respects the rounded corners */
     }

     .page-title-wrapper::before {
          content: "";
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          background: var(--bs-gradient-reverse);
          opacity: 0.05;
          z-index: 0; /* Keep it behind everything */
          pointer-events: none; /* Optional: makes it ignore mouse events */
          border-radius: inherit; /* Match the border-radius */
     }

/* backgrounds */
     
     .translucent-white {
          background: rgba(255,255,255,.85);
     }

     .background--custom {
        background-color: #FFFFFF;
        width: 100vw;
        height: 100vh;
        position: absolute;
        overflow: hidden;
        z-index: -2;
        top: 0;
        left: 0;
      }
         
     canvas#canvas {
        z-index: -1;
        position: absolute;
        width: 100%;
        height: 60%;
        transform: rotate(-12deg) scale(2) translateY(-36%);
        --gradient-color-1: var(--bs-primary); /* #FA0BCC; */
        --gradient-color-2: var(--bs-secondary); /* #7536d8; */
        --gradient-color-3: var(--bs-dark);
        /*--gradient-color-4: #A6C42E;*/
        --gradient-speed: 0.000003;
      }


/* tooltip */
     
     .tooltip {
          --bs-tooltip-zindex: 20002;
          --bs-tooltip-bg:var(--bs-dark) !important;
          font-size: .9rem !important;
     }

     .tooltip-inner, .tooltip-arrow {
          opacity: 1 !important;
          font-size: 1rem;
     }
     

     .tooltip > .tooltip-inner { 
          background-color: var(--bs-dark) !important; 
          border-radius: 1rem; 
          font-size: .85rem !important;
          width: auto;
          max-width: 300px;
          padding: .5rem .75rem !important;
          text-align: left;
     }


     .tooltip.bs-tooltip-right .tooltip-arrow {
         border-right-color: var(--bs-dark) !important;
     }

     .tooltip.bs-tooltip-left .tooltip-arrow {
         border-left-color: var(--bs-dark) !important;
     }

     .tooltip.bs-tooltip-bottom .tooltip-arrow {
         border-bottom-color: var(--bs-dark) !important;
     }

     .tooltip.bs-tooltip-top .tooltip-arrow {
         border-top-color: var(--bs-dark) !important;
     }

     /*
     .tooltip-arrow::before {
         border-top-color: var(--bs-dark) !important;
     }

     .bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow::before, .bs-tooltip-start .tooltip-arrow::before {
          border-left-color: var(--bs-dark);
     }
     */

/* card */

     .auth-card 
     {
          max-width: 500px;
     }


/* form */

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

     .form-switch-lg .form-check-input:checked {
       background-position: right center;
     }

     .error {
         border-color: var(--bs-danger);
     }

     .form-floating>label {
          font-weight: var(--bs-font-weight);
          color: rgba(var(--bs-dark-rgb), .8) !important;
     }

     .form-control, .form-control:focus, .form-select, .iti__search-input {
          color: var(--bs-dark);
          font-size: 1rem;
     }
     
     .form-floating-style {
          height: calc(3.5rem + calc(var(--bs-border-width)* 2)); 
          min-height: calc(3.5rem + calc(var(--bs-border-width)* 2)); 
          line-height: 1.25;
     }
     
     .form-check-lg {
          padding-left: 2rem;
          min-height: 1.75rem;
          font-size: 1.25rem; /* Larger label text */
     }

     .form-check-lg .form-check-input {
          width: 1.25em;
          height: 1.25em;
          margin-top: 0.3em;
          margin-left: -2rem;
          background-color: #ffffff;
     }

     .form-check-lg .form-check-label {
          padding-left: 0.5rem;
          font-weight: var(--bs-font-weight);
     }

     .form-control:disabled, form-select:disabled, [disabled] {
          opacity: .25 !important;
          background: var(--bs-dark-bg-subtle) !important;
     }
     
     .form-floating>.form-control:disabled~label::after, .form-floating>:disabled~label::after {
          background-color: transparent;
     }


/* iti */

     .iti {
          position: relative;
          flex: 1 1 auto;
          width: 1%;
          min-width: 0;
     }

     .iti__search-input  {
         display: block;
         width: 100%;
         padding: 8px 16px;
         font-size: .875rem;
         font-weight: var(--bs-font-weight);
         line-height: 1.5;
         color: #5a6a85;
         -webkit-appearance: none;
         -moz-appearance: none;
         appearance: none;
         background-color: transparent;
         background-clip: padding-box;
         border: var(--bs-border-width) solid #dfe5ef;
         border-radius: 7px;
         box-shadow: var(--bs-box-shadow-inset);
         transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
     }

     .iti__tel-input {
          /* font-size: 1.5rem !important; */
     }


     
/* buttons */
     
     .nav-icon-hover-bg
     {
          color          : var(--bs-dark);
          transition     : all 0.3s ease;
     }

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

     .nav-icon-hover-bg:hover .nav-link, .topbar .navbar .navbar-nav .nav-item.dropdown:hover .nav-link
     {
          color : var(--bs-link-hover-color) !important;
     }

     .btn-icon
     {
          width: 2.5rem;
          height: 2.5rem;
          border-radius: 50% !important;
          padding: 0;
          margin: 0;
          align-items: center !important;
          justify-content: center !important;
          display: inline-flex;
          position: relative;
          color: var(--bs-dark);
          background-color: var(--bs-light);
          font-size: 1.1rem;
          line-height: 1.1rem;
     }
          
     .btn-icon.toolbar, .btn-icon.transparent
     {
          background-color: transparent;
     }

     .btn-icon.btn-primary
     {
          background: var(--bs-primary);
          color: #fff;
     }
     
     .btn-icon:active, .btn-icon.transparent:active, .btn-icon.toolbar:active
     {
          border-color: var(--bs-primary-bg-subtle) !important;
     }

     .btn-icon.show
     {
          background-color: var(--bs-primary-bg-subtle);
          border-color: transparent;
     }

     .btn-icon.btn-icon-bg
     {
          background-color:  var(--bs-light);
     }
     
     .btn-icon.btn-handle
     {
          width: 1.5rem;
          height: 1.5rem;
          font-size: 1rem;
          line-height: 1rem;
     }
     
     .btn-icon.btn-sm
     {}

     .btn-icon.btn-lg
     {
          width: 3rem;
          height: 3rem;
          font-size: 1.5rem;
          line-height: 1.5rem;
     }

     .btn-icon i
     {}

     .btn-icon:hover
     {
         background-color: var(--bs-dark);
         color: #fff !important;
     }

     .btn-icon.btn-primary:hover
     {
         background-color: var(--bs-dark);
         color: var(--bs-white) !important;
     }

     .btn-outline-white
     {
          background: transparent;
          border-color: #fff;
          color: #fff;
     }
     
     .btn-outline-white:hover
     {
          background: rgba(255,255,255,.5);
          border-color: transparent;
          color: var(--bs-dark);
     }

/* accordion */

     .accordion 
     {
          --bs-accordion-color: var(--bs-body-color);
          --bs-accordion-active-color: var(--bs-body-color);
     }

/* nav pills */

     .nav-pills {
         --bs-nav-pills-border-radius        : var(--bs-border-radius);
         --bs-nav-pills-link-active-color    : var(--bs-white);
         --bs-nav-pills-link-active-bg       : var(--bs-dark);
         --bs-nav-link-padding-x             : 1rem; 
         --bs-nav-link-padding-y             : 10px;
         --bs-nav-link-font-size             : 1rem;
         --bs-nav-link-font-weight           : 500;
          border-radius                      : var(--bs-border-radius);
          background-color                   : var(--bs-light);
     }

     .nav-pills .nav-link.active, .nav-pills .show>.nav-link {
         color      : var(--bs-nav-pills-link-active-color);
         background : var(--bs-nav-pills-link-active-bg);
     }

     
     .nav-link {
          transition: all 0.3s ease-in-out !important;
     }

     .nav-link:focus, .nav-link:hover {
         
     }
     
     .nav-fill .nav-item, .nav-fill>.nav-link {
         flex: 1;
         text-align: center;
     }
     
     .nav-pills .nav-link {
          color: var(--bs-dark);
          font-weight: normal;
     }

     .nav-pills .nav-link:hover:not(.active) {
         background: var(--bs-dark-bg-subtle);
         color: var(--bs-dark);
     }
     
     .nav-pills .nav-item.disabled {
         opacity: .5;
         pointer-events: none;
         cursor: default;
     }

/* topbar */

     .topbar {
          background: transparent;
     }

     /* Override for nav-links inside .topbar */
     .topbar .nav-link:focus,
     .topbar .nav-link:hover {
          background: transparent;
     }
     
     .topbar .navbar .navbar-nav .nav-item .nav-link
     {
          color: var(--bs-dark);
     }
     
     .topbar .navbar .navbar-nav .nav-item .nav-link:hover
     {
          color: var(--bs-link-hover-color);
     }

     .topbar.shadow-sm
     {
          background: #ffffff;
     }


/* sidebar */

     .left-sidebar 
     {
          background: #fff;
          border-right : 2px solid var(--bs-border-color);
          box-shadow: none !important;
          backdrop-filter: blur(var(--bs-blur));
     }
     
     .left-sidebar-inner
     {
          min-width: 260px !important;
          max-width: 260px !important;
          min-height: calc( 100vh - var(--bs-padding-top) );
          max-height: calc( 100vh - var(--bs-padding-top) );
          border: 2px solid var(--bs-border-color);
          border-radius: var(--bs-border-radius);
          border-left: none;
          border-top-left-radius: 0;
          border-bottom-left-radius: 0;
          border-bottom-right-radius: 0;
          box-shadow: none; /* var(--bs-box-shadow) !important; */
          background: #fff;
     }

     @media (min-width: 1300px) {

         [data-layout=vertical] body[data-sidebartype=mini-sidebar] .left-sidebar {
             width: 87px;
         }

          [data-layout=vertical] body[data-sidebartype=mini-sidebar] .left-sidebar:hover {
               width: 270px;
               z-index: 50;
               box-shadow : var(--bs-box-shadow) !important;
               border-right : 0px solid var(--bs-border-color) !important;
               background: #fff;
          }

          .right-content
          {
               min-height: calc( 100vh - var(--bs-padding-top) );
               max-height: calc( 100vh - var(--bs-padding-top) );
               overflow-y: scroll;
               padding: 1.5rem 1rem 3rem 1rem !important;
          }
          
     }

     
     @media (max-width: 1299.98px) { 

          /*
          .left-sidebar { 
               width: 90%; 
               position: fixed; 
               left: -90%; 
               height: 100%; 
          } 
          */
     }

     .sidebar-nav ul .sidebar-item .sidebar-link
     {
          border-radius: var(--bs-btn-border-radius);
     }

     .sidebar-nav ul .sidebar-item .sidebar-link
     {
          font-size: 1rem;
     }

     .sidebar-nav ul .sidebar-item .sidebar-link, .sidebar-nav ul .sidebar-item .first-level .sidebar-item>.sidebar-link, .nav-small-cap
     {
          transition: all 0.3s ease-in-out !important;
          color: var(--bs-dark);
     }

     .sidebar-link i {
          font-size: 17px;
     }

     .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: var(--bs-primary);
         color: #fff;
     }
     
     .sidebar-nav ul .sidebar-item .sidebar-link:not(.active):hover
     {
          color: var(--bs-dark);
          font-weight: normal;
     }

     .sidebar-nav ul .sidebar-item .sidebar-link:not(.active):hover {
         background: var(--bs-dark-bg-subtle);
         /*color: var(--bs-primary);*/
     }

     .nav-small-cap {
          color: rgba(var(--bs-dark-rgb),.7) !important;
     }

/* preloader */

     .preloader
     {
          width: 100%;
          height: 100%;
          top: 0;
          position: fixed;
          z-index: 99999;
          background-color: rgba(255, 2552, 255, .5);
          backdrop-filter: blur(var(--bs-blur));
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
          align-content: center;
          color: var(--bs-dark);
     }

     .lds-ripple {
         display: inline-block;
         width: 100px;
         position: absolute;
         top: calc(50% - 100px);
         left: 0;
         right: 0;
         margin: 0 auto;
     }


/* fonts */
     
     .fw-bold {
          font-weight: 600 !important;
     }
     
     .fw-semibold {
         font-weight: 500 !important;
     }

     h1, h2, .h1, .h2, h3, .h3, h4, .h4
     {
          font-weight: 600 !important;
          color: var(--bs-dark-primary);
     }

/* placeholder */

     .placeholder {
          color: #444;
          background: linear-gradient(90deg, rgba( var(--bs-dark-rgb), .1) 0%, #fff 50%, rgba( var(--bs-dark-rgb), .1) 100%);
          background-size: 200% 100%;
          padding: 20px;
          border-radius: 1rem;
          box-shadow: none;
          display: inline-block;
          animation: slideFade 2s infinite linear;
          width: 100%;
     }

     @keyframes slideFade {
         0% { background-position: -100% 0; }
         100% { background-position: 100% 0; }
     }

/* Reset custom offcanvas styles */

     .offcanvas {
          --bs-offcanvas-width: 330px; /* Default width */
          --bs-offcanvas-height: 30vh; /* Default height */
          --bs-offcanvas-padding: 1rem;
          --bs-offcanvas-padding-x: 1rem;
          --bs-offcanvas-padding-y: 1rem;
          --bs-offcanvas-color: var(--bs-body-color);
          --bs-offcanvas-bg: var(--bs-light);/* rgba(255,2552,255, .85); */
          --bs-offcanvas-border-width: 0;
          --bs-offcanvas-border-color: var(--bs-border-color-translucent);
          --bs-offcanvas-border-radius: var(--bs-border-radius);
          --bs-offcanvas-box-shadow: var(--bs-box-shadow);
          --bs-offcanvas-transition: transform 0.3s ease-in-out !important;
          --bs-offcanvas-title-line-height: 1.5;
          --bs-offcanvas-footer-gap: .5rem;
          backdrop-filter: blur(var(--bs-blur));
          border-radius: var(--bs-offcanvas-border-radius);
          z-index: 9990;
     }
     
     .offcanvas-overlay-block {
          position: fixed;
          top: 0; 
          left: 0; 
          z-index: 9989;
          backdrop-filter: blur(var(--bs-blur));
          transition: all 0.3s ease-in-out !important;
     }


     .offcanvas-fullscreen {
          --bs-offcanvas-width: 100% !important;
          --bs-offcanvas-height: 100% !important;
          --bs-offcanvas-border-radius: 0;
          margin: 0rem;
     }

     .offcanvas-header {
          border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0;
          border-bottom: 2px solid var(--color-light-gray);
     }

     .offcanvas-footer {
         display: block;
         align-items: center;
         justify-content: flex-end;
         padding: calc(var(--bs-offcanvas-padding) - var(--bs-offcanvas-footer-gap) * .5);
         background-color: var(--bs-offcanvas-footer-bg);
         border-top: 2px solid var(--color-light-gray);
         border-bottom-right-radius: var(--bs-border-radius);
         border-bottom-left-radius: var(--bs-border-radius);
     }

     /* last pass kill */

     [data-lastpass-icon-root] {
         display: none !important;
     }



/* Optionally adjust offcanvas for breakpoints */

     @media (max-width: 767px) {
         .offcanvas-sm {
             --bs-offcanvas-width: 100%;
             --bs-offcanvas-height: 100%;
         }
          
          .seatmap-outer-wrapper  {
               height: auto;
          }
     }

     @media (min-width: 768px) and (max-width: 991px) {
          
         .offcanvas-md {
             --bs-offcanvas-width: 350px; /* Optional: Custom width for medium screens */
             --bs-offcanvas-height: auto; /* Optional: Adjust height */
         }
          
          .h-md-100 {
             height: 100% !important;
          }
          
          .seatmap-outer-wrapper {
               height: auto;
          }
          
     }

     @media (min-width: 1200px) {
          
          .h-md-100 {
             height: 100% !important;
          }
          
          .seatmap-outer-wrapper {
               height: auto;
          }
          
         .offcanvas-lg {
             --bs-offcanvas-width: 400px; /* Custom width for large screens */
             --bs-offcanvas-height: auto;
         }
     }
     
/* google maps */

     gmp-place-autocomplete, .pac-container {
       z-index: 99999 !important;
       position: absolute !important;
     }


/* table */

     .table {
          --bs-table-border-color: rgba(var(--bs-primary-rgb),.04) !important;
          background: #fff;
     }

     td, th {
          vertical-align: middle;
     }

     
     table.table.dataTable.table-striped>tbody>tr:nth-of-type(2n+1)>* {
          box-shadow: inset 0 0 0 9999px #fff;
     }
     

     table.dataTable.table-hover>tbody>tr:hover>* {
          box-shadow: inset 0 0 0 9999px var(--bs-dark-bg-subtle) !important;
     }
     
     /*
     .table-hover>tbody>tr:hover>* {
         --bs-table-color-state: var(--bs-dark-bg-subtle);
         --bs-table-bg-state: var(--bs-table-hover-bg);
     }
     
     table.table.dataTable.table-hover>tbody>tr:hover>* {
         box-shadow: inset 0 0 0 9999px var(--bs-table-border-color);
     }
     */


     table.table.dataTable.table-striped>tbody>tr:nth-of-type(2n)>* {
         box-shadow: inset 0 0 0 9999px transparent !important;
     }

     .table-responsive
     {
          display: block;
          /*min-height: 350px;*/
          overflow: hidden;
          overflow-x: scroll;
     }

     .table-responsive table {
         margin: 0; /* prevent vertical centering due to margin auto */
     }
     
     table.dataTable thead th, 
     table.dataTable thead td
     {
          font-size: .85rem !important;
          text-transform: uppercase;
          padding: .75rem .75rem;
          font-weight: 600;
     }

     table.dataTable thead th:not(.no-bg), 
     table.dataTable thead td:not(.no-bg)
     {
          background-color: var(--bs-light) !important;
     }
     
     div.dt-container div.dt-paging ul.pagination
     {
         justify-content: flex-end;
     }

     .pagination {
         --bs-pagination-padding-x: 0.75rem;
         --bs-pagination-padding-y: 0.375rem;
         --bs-pagination-font-size: 1rem;
         --bs-pagination-color: var(--bs-dark);
         --bs-pagination-bg: transparent;
         --bs-pagination-border-width: 0;
         --bs-pagination-border-color: transparent;
         --bs-pagination-border-radius: var(--bs-border-radius);
         --bs-pagination-hover-color: var(--bs-primary);
         --bs-pagination-hover-bg: var(--bs-primary-bg-subtle);
         --bs-pagination-hover-border-color: var(--bs-border-color);
         --bs-pagination-focus-color: var(--bs-primary);
         --bs-pagination-focus-bg: var(--bs-primary-bg-subtle);
         --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(93, 135, 255, 0.25);
         --bs-pagination-active-color: var(--bs-dark);
         --bs-pagination-active-bg: var(--bs-primary-bg-subtle);
         --bs-pagination-active-border-color: #5d87ff;
         --bs-pagination-disabled-color: var(--bs-dark-bg-subtle);
         --bs-pagination-disabled-bg: transparent;
         --bs-pagination-disabled-border-color: transparent;
         display: flex;
         padding-left: 0px;
         list-style: none;
     }
     
     table.dataTable th.dt-type-numeric div.dt-column-header, table.dataTable th.dt-type-numeric div.dt-column-footer, table.dataTable th.dt-type-date div.dt-column-header, table.dataTable th.dt-type-date div.dt-column-footer, table.dataTable td.dt-type-numeric div.dt-column-header, table.dataTable td.dt-type-numeric div.dt-column-footer, table.dataTable td.dt-type-date div.dt-column-header, table.dataTable td.dt-type-date div.dt-column-footer
     {
          flex-direction: row;
     }


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


/* iti */

     .iti {
         width: 100% !important;
     }


/* modal */

     .modal {
          --bs-modal-border-radius: var(--bs-border-radius);
          backdrop-filter: blur(var(--bs-blur)); 
          z-index: 9996 !important;
          background: rgba(255, 2552, 255, .2);
     }

     .modal-header {
          border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0;
          border-bottom: 2px solid var(--color-light-gray);
     }

     .modal-footer {
          border-radius: 0 0 var(--bs-border-radius) var(--bs-border-radius);
     }

     .modal-fullscreen {
          padding: 0;
     }

     .modal-fullscreen .modal-content {
          border-radius: 0;  
     }

     .modal-fullscreen .modal-header {
          border-radius: 0;
     }

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

     /* Default modal behavior (NOT fullscreen) */

     .modal-dialog:not(.modal-fullscreen) .modal-content {
          max-height: 90vh;
          display: flex;
          flex-direction: column;
     }

     /* Scrollable body within constraint */

          .modal-body {
               overflow-y: auto;
               flex-grow: 1;
          }

     /* Backdrop styling */

          .modal-backdrop, .offcanvas-backdrop
          {
               background-color: rgba(255,2552,255,.2);
               z-index: 9989;
          }

          .modal-backdrop {
               z-index: 9995 !important;
          }



/* toastr */

     .toast-close-button, #toast-container > div
     {
          opacity: 1;
     }

     .toast, #toast-container {
          border-radius: var(-bs-border-radius) !important;
     }

     #toast-container > div {
          box-shadow: 0 0 12px rgba( var(--bs-dark-rgb), .5 ) !important;
          overflow: hidden !important;
     }

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

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

     #toast-container > .toast {
         background-image: none !important;
     }

     #toast-container > .toast:before {
         position: fixed;
         font-family: FontAwesome;
         font-size: 24px;
         line-height: 18px;
         float: left;
         color: #FFF;
         padding-right: 0.5em;
         margin: auto 0.5em auto -1.5em;
     }        

     #toast-container > .toast-warning:before {
         content: "\f06a";
     }

     #toast-container > .toast-error:before {
         content: "\f071";
     }

     #toast-container > .toast-info:before {
         content: "\f05a";
     }

     #toast-container > .toast-success:before {
         content: "\f058";
     }


/* spacing */

     .w-md-50 {
          width: 100%;
     }

     .w-md-25 {
          width: 100%;
     }
     

     @media (min-width: 768px) {
          .w-md-75 {
               width: 75% !important;
          }
          .w-md-50 {
               width: 50% !important;
          }
          .w-md-25 {
               width: 25% !important;
          }
     }


/* =========================================================
   XXXL BREAKPOINT (≥1600px)
   Desktop / Ultrawide only
   ========================================================= */

     @media (min-width: 2000px) {

     /* Optional container width */
     .container-xxxl,
     .container {
     max-width: 1560px;
     }

     /* Column base */
     .col-xxxl {
     flex: 1 0 0%;
     }

     .col-xxxl-auto {
     flex: 0 0 auto;
     width: auto;
     }

     /* 12-column grid */
     .col-xxxl-1  { flex: 0 0 auto; width: 8.333333%; }
     .col-xxxl-2  { flex: 0 0 auto; width: 16.666667%; }
     .col-xxxl-3  { flex: 0 0 auto; width: 25%; }
     .col-xxxl-4  { flex: 0 0 auto; width: 33.333333%; }
     .col-xxxl-5  { flex: 0 0 auto; width: 41.666667%; }
     .col-xxxl-6  { flex: 0 0 auto; width: 50%; }
     .col-xxxl-7  { flex: 0 0 auto; width: 58.333333%; }
     .col-xxxl-8  { flex: 0 0 auto; width: 66.666667%; }
     .col-xxxl-9  { flex: 0 0 auto; width: 75%; }
     .col-xxxl-10 { flex: 0 0 auto; width: 83.333333%; }
     .col-xxxl-11 { flex: 0 0 auto; width: 91.666667%; }
     .col-xxxl-12 { flex: 0 0 auto; width: 100%; }

     /* Offsets */
     .offset-xxxl-0  { margin-left: 0; }
     .offset-xxxl-1  { margin-left: 8.333333%; }
     .offset-xxxl-2  { margin-left: 16.666667%; }
     .offset-xxxl-3  { margin-left: 25%; }
     .offset-xxxl-4  { margin-left: 33.333333%; }
     .offset-xxxl-5  { margin-left: 41.666667%; }
     .offset-xxxl-6  { margin-left: 50%; }
     .offset-xxxl-7  { margin-left: 58.333333%; }
     .offset-xxxl-8  { margin-left: 66.666667%; }
     .offset-xxxl-9  { margin-left: 75%; }
     .offset-xxxl-10 { margin-left: 83.333333%; }
     .offset-xxxl-11 { margin-left: 91.666667%; }

     /* Order utilities */
     .order-xxxl-first { order: -1; }
     .order-xxxl-0     { order: 0; }
     .order-xxxl-1     { order: 1; }
     .order-xxxl-2     { order: 2; }
     .order-xxxl-3     { order: 3; }
     .order-xxxl-4     { order: 4; }
     .order-xxxl-5     { order: 5; }
     .order-xxxl-last  { order: 6; }
     }