:root {
  --tw-sm: 640px;
  --tw-md: 768px;
  --tw-lg: 1024px;
  --tw-xl: 1280px;
  --tw-2xl: 1536px;
  --tw-gray-100-light: #F9F9F9;
  --tw-gray-200-light: #F1F1F4;
  --tw-gray-300-light: #DBDFE9;
  --tw-gray-400-light: #C4CADA;
  --tw-gray-500-light: #99A1B7;
  --tw-gray-600-light: #78829D;
  --tw-gray-700-light: #4B5675;
  --tw-gray-800-light: #252F4A;
  --tw-gray-900-light: #071437;
  --tw-gray-100-dark: #1B1C22;
  --tw-gray-200-dark: #26272F;
  --tw-gray-300-dark: #363843;
  --tw-gray-400-dark: #464852;
  --tw-gray-500-dark: #636674;
  --tw-gray-600-dark: #808290;
  --tw-gray-700-dark: #9A9CAE;
  --tw-gray-800-dark: #B5B7C8;
  --tw-gray-900-dark: #F5F5F5;
  --tw-brand-light: #FF6F1E;
  --tw-brand-active-light: #F15700;
  --tw-brand-light-light: #FFF5EF;
  --tw-brand-clarity-light: rgba(255, 111, 30, 0.20);
  --tw-brand-inverse-light: #ffffff;
  --tw-primary-light: #185ABC;
  --tw-primary-active-light: #056EE9;
  --tw-primary-light-light: #EFF6FF;
  --tw-primary-clarity-light: rgba(27, 132, 255, 0.20);
  --tw-primary-inverse-light: #ffffff;
  --tw-success-light: #1B8755;
  --tw-success-active-light: #04B440;
  --tw-success-light-light: #DBECDF;
  --tw-success-clarity-light: rgba(23, 198, 83, 0.20);
  --tw-success-inverse-light: #ffffff;
  --tw-info-light: #7239EA;
  --tw-info-active-light: #5014D0;
  --tw-info-light-light: #F8F5FF;
  --tw-info-clarity-light: rgba(114, 57, 234, 0.20);
  --tw-info-inverse-light: #ffffff;
  --tw-danger-light: #DA291C;
  --tw-danger-active-light: #D81A48;
  --tw-danger-light-light: #FFEEF3;
  --tw-danger-clarity-light: rgba(248, 40, 90, 0.20);
  --tw-danger-inverse-light: #ffffff;
  --tw-warning-light: #FFBD00;
  --tw-warning-active-light: #DFA000;
  --tw-warning-light-light: #FFF8DD;
  --tw-warning-clarity-light: rgba(246, 177, 0, 0.20);
  --tw-warning-inverse-light: #ffffff;
  --tw-dark-light: #282828;
  --tw-dark-active-light: #111318;
  --tw-dark-light-light: #F9F9F9;
  --tw-dark-clarity-light: rgba(30, 33, 41, 0.20);
  --tw-dark-inverse-light: #ffffff;
  --tw-light-light: #ffffff;
  --tw-light-active-light: #FCFCFC;
  --tw-light-light-light: #ffffff;
  --tw-light-clarity-light: rgba(255, 255, 255, 0.20);
  --tw-light-inverse-light: #4B5675;
  --tw-secondary-light: #F9F9F9;
  --tw-secondary-active-light: #F9F9F9;
  --tw-secondary-light-light: #F9F9F9;
  --tw-secondary-clarity-light: rgba(249, 249, 249, 0.20);
  --tw-secondary-inverse-light: #4B5675;
  --tw-brand-dark: #D74E00;
  --tw-brand-active-dark: #F35700;
  --tw-brand-light-dark: #272320;
  --tw-brand-clarity-dark: rgba(215, 78, 0, 0.20);
  --tw-brand-inverse-dark: #ffffff;
  --tw-primary-dark: #006AE6;
  --tw-primary-active-dark: #107EFF;
  --tw-primary-light-dark: #172331;
  --tw-primary-clarity-dark: rgba(0, 106, 230, 0.20);
  --tw-primary-inverse-dark: #ffffff;
  --tw-success-dark: #00A261;
  --tw-success-active-dark: #01BF73;
  --tw-success-light-dark: #1F2623;
  --tw-success-clarity-dark: rgba(0, 162, 97, 0.20);;
  --tw-success-inverse-dark: #ffffff;
  --tw-info-dark: #883FFF;
  --tw-info-active-dark: #9E63FF;
  --tw-info-light-dark: #272134;
  --tw-info-clarity-dark: rgba(136, 63, 255, 0.20);
  --tw-info-inverse-dark: #ffffff;
  --tw-danger-dark: #E42855;
  --tw-danger-active-dark: #FF3767;
  --tw-danger-light-dark: #302024;
  --tw-danger-clarity-dark: rgba(228, 40, 85, 0.20);
  --tw-danger-inverse-dark: #ffffff;
  --tw-warning-dark: #C59A00;
  --tw-warning-active-dark: #D9AA00;
  --tw-warning-light-dark: #242320;
  --tw-warning-clarity-dark: rgba(197, 154, 0, 0.20);
  --tw-warning-inverse-dark: #ffffff;
  --tw-dark-dark: #272A34;
  --tw-dark-active-dark: #2D2F39;
  --tw-dark-light-dark: #1E2027;
  --tw-dark-clarity-dark: rgba(39, 42, 52, 0.20);
  --tw-dark-inverse-dark: #ffffff;
  --tw-light-dark: #1F212A;
  --tw-light-active-dark: #1F212A;
  --tw-light-light-dark: #1F212A;
  --tw-light-clarity-dark: rgba(31, 33, 42, 0.20);
  --tw-light-inverse-dark: #9A9CAE;
  --tw-secondary-dark: #363843;
  --tw-secondary-active-dark: #464852;
  --tw-secondary-light-dark: #363843;
  --tw-secondary-clarity-dark: rgba(54, 56, 67, 0.20);
  --tw-secondary-inverse-dark: #9A9CAE;
  --tw-coal-100: #15171C;
  --tw-coal-200: #13141A;
  --tw-coal-300: #111217;
  --tw-coal-400: #0F1014;
  --tw-coal-500: #0D0E12;
  --tw-coal-600: #0B0C10;
  --tw-coal-black: #000000;
  --tw-coal-clarity: rgba(24, 25, 31, 0.50);
}

:root, .light {
  --tw-gray-100: #F9F9F9;
  --tw-gray-150: #F8F8F8;
  --tw-gray-200: #F1F1F4;
  --tw-gray-300: #DBDFE9;
  --tw-gray-400: #C4CADA;
  --tw-gray-500: #99A1B7;
  --tw-gray-600: #78829D;
  --tw-gray-700: #4B5675;
  --tw-gray-800: #252F4A;
  --tw-gray-900: #071437;
  --tw-brand: #FF6F1E;
  --tw-brand-active: #F15700;
  --tw-brand-light: #FFF5EF;
  --tw-brand-clarity: rgba(255, 111, 30, 0.20);
  --tw-brand-inverse: #ffffff;
  --tw-primary: #0052CC;
  --tw-primary-active: #056EE9;
  --tw-primary-light: #D3E2FA;
  --tw-primary-clarity: rgba(27, 132, 255, 0.20);
  --tw-primary-inverse: #ffffff;
  --tw-success: #00875A;
  --tw-success-active: #04B440;
  --tw-success-light: #EAFFF1;
  --tw-success-clarity: rgba(23, 198, 83, 0.20);
  --tw-success-inverse: #ffffff;
  --tw-info: #7239EA;
  --tw-info-active: #5014D0;
  --tw-info-light: #F8F5FF;
  --tw-info-clarity: rgba(114, 57, 234, 0.20);
  --tw-info-inverse: #ffffff;
  --tw-danger: #DE3041;
  --tw-danger-active: #D81A48;
  --tw-danger-light: #FFEEF3;
  --tw-danger-clarity: rgba(248, 40, 90, 0.20);
  --tw-danger-inverse: #ffffff;
  --tw-warning: #FFBD00;
  --tw-warning-active: #DFA000;
  --tw-warning-light: #F5F5DC;
  --tw-warning-clarity: rgba(246, 177, 0, 0.20);
  --tw-warning-inverse: #ffffff;
  --tw-dark: #282828;
  --tw-dark-active: #111318;
  --tw-dark-light: #F9F9F9;
  --tw-dark-clarity: rgba(30, 33, 41, 0.20);
  --tw-dark-inverse: #ffffff;
  --tw-light: #ffffff;
  --tw-light-active: #FCFCFC;
  --tw-light-light: #ffffff;
  --tw-light-clarity: rgba(255, 255, 255, 0.20);
  --tw-light-inverse: #4B5675;
  --tw-secondary: #F9F9F9;
  --tw-secondary-active: #F9F9F9;
  --tw-secondary-light: #F9F9F9;
  --tw-secondary-clarity: rgba(249, 249, 249, 0.20);
  --tw-secondary-inverse: #4B5675;
  --tw-default-box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.09);
  --tw-light-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.03);
  --tw-primary-box-shadow: 0px 4px 12px 0px rgba(40, 132, 239, 0.35);
  --tw-success-box-shadow: 0px 4px 12px 0px rgba(53, 189, 100, 0.35);
  --tw-danger-box-shadow: 0px 4px 12px 0px rgba(241, 65, 108, 0.35);
  --tw-info-box-shadow: 0px 4px 12px 0px rgba(114, 57, 234, 0.35);
  --tw-warning-box-shadow: 0px 4px 12px 0px rgba(246, 192, 0, 0.35);
  --tw-dark-box-shadow: 0px 4px 12px 0px rgba(37, 47, 74, 0.35);
  --tw-card-background-color: white;
  --tw-tooltip-background-color: #0F1014;
  --tw-popover-background-color: white;
  --tw-modal-background-color: white;
  --tw-drawer-background-color: white;
  --tw-dropdown-background-color: white;
  --tw-backdrop-background-color: rgba(0, 0, 0, 0.80);
  --tw-table-head-background-color: var(--tw-light-active);
  --tw-card-border: 1px solid var(--tw-gray-200);
  --tw-table-border: 1px solid var(--tw-gray-200);
  --tw-dropdown-border: 1px solid var(--tw-gray-200);
  --tw-popover-border: 1px solid var(--tw-gray-200);
  --tw-tooltip-border: 0;
  --tw-card-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.03);
  --tw-tooltip-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.03);
  --tw-popover-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.03);
  --tw-modal-box-shadow: 0px 10px 14px 0px rgba(15, 42, 81, 0.03);
  --tw-drawer-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.03);
  --tw-dropdown-box-shadow: 0px 7px 18px 0px rgba(0, 0, 0, 0.09);
  --tw-input-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.10);
}


/* AVATAR */

  .avatar{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    color: rgb(243 244 246 / var(--tw-text-opacity));
  }
  
  :is(.dark .avatar){
    --tw-bg-opacity: 1;
    background-color: rgb(75 85 99 / var(--tw-bg-opacity));
  }
  
  .avatar-sm{
    height: 2rem;
    width: 2rem;
    line-height: 2rem;
  }
  
  .avatar-md{
    height: 2.5rem;
    width: 2.5rem;
    line-height: 2.5rem;
  }
  
  .avatar-lg{
    height: 3rem;
    width: 3rem;
    line-height: 2.5rem;
  }
  
  .avatar-rounded{
    border-radius: 0.375rem;
  }
  
  .avatar-square{
    border-radius: 0px;
  }
  
  .avatar-circle{
    border-radius: 9999px;
    height: 35px;
    width: 35px;
  }

  .avatar-circle-lg{
    border-radius: 9999px;
    height: 50px;
    width: 50px;
  }
  
  .avatar-img{
    display: block;
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  
  .avatar-inner-sm{
    height: 2rem;
  }
  
  .avatar-inner-md{
    height: 2.5rem;
  }
  
  .avatar-inner-lg{
    height: 3rem;
  }
  
  .avatar-icon{
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center;
  }
  
  .avatar-icon-sm{
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
  
  .avatar-icon-md{
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
  
  .avatar-icon-lg{
    font-size: 1.5rem;
    line-height: 2rem;
  }
  
  .avatar-group{
    display: inline-flex;
  }
  
  .avatar-group-chained > .avatar,
  .avatar-group-chained > .tooltip-wrapper{
    margin-left: -0.5rem;
  }
  
  :is([dir="rtl"] .avatar-group-chained > .avatar),:is([dir="rtl"] 
  .avatar-group-chained > .tooltip-wrapper){
    margin-right: -0.5rem;
  }
  .avatar-group-chained > .avatar:first-child,
  .avatar-group-chained > .tooltip-wrapper:first-child{
    margin-left: 0px;
  }
  :is([dir="rtl"] .avatar-group-chained > .avatar:first-child),:is([dir="rtl"] 
  .avatar-group-chained > .tooltip-wrapper:first-child){
    margin-right: 0px;
  }
  

  /* DATATABLE CUSTOM CLASSES  START*/


.dt-column-title{
  font-size: 0.875;
  line-height: 1.25rem;
}

.dt-length select {
     border: 1px solid #DBDFE9;
     border-radius: 0.375rem;
     padding: 2px;
}

#dt-search-0{
  border: 1px solid #DBDFE9;
  border-radius: 0.375rem;
  padding: 0.2rem;
  margin-right: 1rem;
  margin-top: 1rem;
}

.page-link {
   flex-shrink: 0;
   height: 2rem;
   padding-left: 0.75rem;
   padding-right: 0.75rem;
   font-weight: 500;
   font-size: 0.75rem;
   gap: 0.275rem;

  color: #4B5675;
  border-color: #F1F1F4;
  background-color: #F9F9F9;
  border: 1px solid #DBDFE9;
  border-radius: 0.375rem;
}

.page-link.first {
  border-bottom-right-radius: 0px;
  border-top-right-radius: 0px;
}

.page-link.last {
  border-bottom-left-radius: 0px;
  border-top-left-radius: 0px;
}

li.dt-paging-button.page-item.active > button {
  color: white;
  background-color: #0052CC;
}

span.select-info {
    display: none !important;
}

.dt-search-0 label {
  font-size: 0.875 !important;
  line-height: 1.25 !important;
  margin-right: 0.5rem;
}

td.dt-empty {
    text-align: center !important;
    vertical-align: middle !important;
    font-weight: 500; 
}



/* DATATABLE CUSTOM CLASSES  END*/



/* BUTTONS */


.btn {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  line-height: 1;
  border-radius: 0.375rem;
  height: 2.5rem;
  padding-left: 1rem;
  padding-right: 1rem;
  gap: 0.375rem;
  border: 1px solid transparent;
  font-weight: 500;
  font-size: 0.8125rem;
  outline: none;
}

.btn-icon {
  flex-shrink: 0;
  padding: 0;
  gap: 0;
  width: 2.5rem;
}

.btn-icon i {
  line-height: 0 !important;
}

.btn-xs {
  height: 1.75rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  font-weight: 500;
  font-size: 0.6875rem;
  gap: 0.25rem;
}

.btn-xs.btn-icon {
  width: 1.75rem;
}

.btn-sm {
  height: 2rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  font-weight: 500;
  font-size: 0.75rem;
  gap: 0.275rem;
}

.btn-sm.btn-icon {
  width: 2rem;
}

.btn-lg.btn-icon {
  width: 3rem;
}

.btn[disabled], .btn.disabled {
  opacity: 0.5;
  pointer-events: none;
}

.btn-icon {
  justify-content: center;
  flex-shrink: 0;
  padding: 0;
  gap: 0;
  width: 2.5rem;
}

.btn-icon.btn-xs {
  width: 1.75rem;
}

.btn-icon.btn-sm {
  width: 2rem;
}

.btn-icon.btn-lg {
  width: 3rem;
}

.btn i {
  font-size: 1.125rem;
  line-height: 0 !important;
}

.btn-icon i {
  font-size: 1.5rem;
}

.btn-xs i {
  font-size: 0.75rem;
}

.btn-xs.btn-icon i {
  font-size: 1rem;
}

.btn-sm i {
  font-size: 0.875rem;
}

.btn-sm.btn-icon i {
  font-size: 1.125rem;
}

.btn-lg.btn-icon i {
  font-size: 1.75rem;
}

.btn-icon-xs i {
  font-size: 0.75rem;
}

.btn-icon-md i {
  font-size: 0.9375rem;
}

.btn-icon-lg i {
  font-size: 1.125rem;
}

.btn-icon-xl i {
  font-size: 1.25rem;
}

.btn.btn-icon-sm i {
  font-size: 0.875rem;
}

.btn.btn-icon-md i {
  font-size: 0.9375rem;
}

.btn.btn-icon-lg i {
  font-size: 1.125rem;
}

.btn.btn-icon-xl i {
  font-size: 1.25rem;
}

.btn.btn-icon-2xl i {
  font-size: 1.5rem;
}

.btn-link {
  color: var(--tw-primary);
  font-size: 0.8125rem;
  height: auto;
  padding-bottom: 0.25em;
  padding-left: 0;
  padding-right: 0;
  border-radius: 0;
  background-color: transparent;
  border-bottom: 1px dashed var(--tw-primary);
}

.btn-link:hover, .btn-link:focus, .btn-link:active, .btn-link.active {
  background-color: transparent;
  border-bottom: 1px dashed var(--tw-primary-active);
  color: var(--tw-primary-active);
}

.btn-link.btn-sm {
  font-size: 0.75rem;
}

.btn-link.btn-lg {
  font-size: 0.875rem;
}

.btn-tabs {
  display: inline-flex;
  align-items: center;
  line-height: 1;
  background-color: var(--tw-gray-100);
  border: 1px solid var(--tw-gray-200);
}

.btn-tabs .btn {
  color: var(--tw-gray-700);
}

.btn-tabs .btn i {
  color: var(--tw-gray-400);
}

.btn-tabs .btn:hover, .btn-tabs .btn:focus, .btn-tabs .btn:active, .btn-tabs .btn.active {
  background-color: var(--tw-light);
  border: 1px solid var(--tw-gray-200);
  color: var(--tw-gray-900);
  box-shadow: var(--tw-light-box-shadow);
}

.btn-tabs .btn:hover i, .btn-tabs .btn:focus i, .btn-tabs .btn:active i, .btn-tabs .btn.active i {
  color: var(--tw-gray-500);
}

.btn-tabs {
  border-radius: 0.375rem;
  height: 2.5rem;
  padding: 0.25rem;
  gap: 0.25rem;
}

.btn-tabs .btn i {
  font-size: 1.125rem;
}

.btn-tabs .btn {
  height: calc(2.5rem - 2 * 0.25rem);
}

.btn-tabs .btn.btn-icon {
  width: calc(2.5rem - 2 * 0.25rem);
}

.btn-tabs.btn-tabs-sm {
  height: 2rem;
  padding: 0.188rem;
  gap: 0.188rem;
}

.btn-tabs.btn-tabs-sm .btn i {
  font-size: 0.875rem;
}

.btn-tabs.btn-tabs-sm .btn {
  height: calc(2rem - 2 * 0.188rem);
}

.btn-tabs.btn-tabs-sm .btn.btn-icon {
  width: calc(2rem - 2 * 0.188rem);
}

.btn-tabs.btn-tabs-lg {
  height: 3rem;
  padding: 0.313rem;
  gap: 0.313rem;
}

.btn-tabs.btn-tabs-lg .btn i {
  font-size: 1.25rem;
}

.btn-tabs.btn-tabs-lg .btn {
  height: calc(3rem - 2 * 0.313rem);
}

.btn-tabs.btn-tabs-lg .btn.btn-icon {
  width: calc(3rem - 2 * 0.313rem);
}

.btn-primary {
  color: #fff;
  background-color: var(--tw-primary);
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
  background-color: var(--tw-primary-active);
  box-shadow: var(--tw-primary-box-shadow);
}

.btn-outline.btn-primary {
  color: var(--tw-primary);
  background-color: var(--tw-primary-light);
  border-color: var(--tw-primary-clarity);
}

.btn-outline.btn-primary i {
  color: var(--tw-primary);
}

.btn-outline.btn-primary:hover, .btn-outline.btn-primary:focus, .btn-outline.btn-primary:active, .btn-outline.btn-primary.active {
  color: var(--tw-primary-inverse);
  background-color: var(--tw-primary);
  border-color: var(--tw-primary);
  box-shadow: none;
}

.btn-outline.btn-primary:hover i, .btn-outline.btn-primary:focus i, .btn-outline.btn-primary:active i, .btn-outline.btn-primary.active i {
  color: var(--tw-primary-inverse);
}

.btn-clear.btn-primary {
  border-color: transparent;
  background-color: transparent;
  color: var(--tw-primary);
}

.btn-clear.btn-primary:hover, .btn-clear.btn-primary:focus, .btn-clear.btn-primary:active, .btn-clear.btn-primary.active {
  color: var(--tw-primary-inverse);
  background-color: var(--tw-primary);
  border-color: var(--tw-primary);
  box-shadow: none;
}

.btn-clear.btn-primary:hover i, .btn-clear.btn-primary:focus i, .btn-clear.btn-primary:active i, .btn-clear.btn-primary.active i {
  color: var(--tw-primary-inverse);
}

.btn-subtle.btn-primary {
  border-color: transparent;
  background-color: transparent;
  color: var(--tw-primary);
}

.btn-subtle.btn-primary i {
  color: var(--tw-primary);
}

.btn-subtle.btn-primary:hover, .btn-subtle.btn-primary:focus, .btn-subtle.btn-primary:active, .btn-subtle.btn-primary.active {
  color: var(--tw-primary);
  background-color: var(--tw-primary-light);
  border-color: var(--tw-primary-light);
  box-shadow: none;
}

.btn-subtle.btn-primary:hover i, .btn-subtle.btn-primary:focus i, .btn-subtle.btn-primary:active i, .btn-subtle.btn-primary.active i {
  color: var(--tw-primary);
}

.btn-success {
  color: #fff;
  background-color: var(--tw-success);
}

.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active {
  background-color: var(--tw-success-active);
  box-shadow: var(--tw-success-box-shadow);
}

.btn-outline.btn-success {
  color: var(--tw-success);
  background-color: var(--tw-success-light);
  border-color: var(--tw-success-clarity);
}

.btn-outline.btn-success i {
  color: var(--tw-success);
}

.btn-outline.btn-success:hover, .btn-outline.btn-success:focus, .btn-outline.btn-success:active, .btn-outline.btn-success.active {
  color: var(--tw-success-inverse);
  background-color: var(--tw-success);
  border-color: var(--tw-success);
  box-shadow: none;
}

.btn-outline.btn-success:hover i, .btn-outline.btn-success:focus i, .btn-outline.btn-success:active i, .btn-outline.btn-success.active i {
  color: var(--tw-success-inverse);
}



.btn-danger {
  color: #fff;
  background-color: var(--tw-danger);
}

.btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active {
  background-color: var(--tw-danger-active);
  box-shadow: var(--tw-danger-box-shadow);
}

.btn-outline.btn-danger {
  color: var(--tw-danger);
  background-color: var(--tw-danger-light);
  border-color: var(--tw-danger-clarity);
}

.btn-outline.btn-danger i {
  color: var(--tw-danger);
}

.btn-outline.btn-danger:hover, .btn-outline.btn-danger:focus, .btn-outline.btn-danger:active, .btn-outline.btn-danger.active {
  color: var(--tw-danger-inverse);
  background-color: var(--tw-danger);
  border-color: var(--tw-danger);
  box-shadow: none;
}

.btn-outline.btn-danger:hover i, .btn-outline.btn-danger:focus i, .btn-outline.btn-danger:active i, .btn-outline.btn-danger.active i {
  color: var(--tw-danger-inverse);
}

.btn-clear.btn-danger {
  border-color: transparent;
  background-color: transparent;
  color: var(--tw-danger);
}

.btn-clear.btn-danger:hover, .btn-clear.btn-danger:focus, .btn-clear.btn-danger:active, .btn-clear.btn-danger.active {
  color: var(--tw-danger-inverse);
  background-color: var(--tw-danger);
  border-color: var(--tw-danger);
  box-shadow: none;
}

.btn-clear.btn-danger:hover i, .btn-clear.btn-danger:focus i, .btn-clear.btn-danger:active i, .btn-clear.btn-danger.active i {
  color: var(--tw-danger-inverse);
}

.btn-subtle.btn-danger {
  border-color: transparent;
  background-color: transparent;
  color: var(--tw-danger);
}

.btn-subtle.btn-danger i {
  color: var(--tw-danger);
}

.btn-subtle.btn-danger:hover, .btn-subtle.btn-danger:focus, .btn-subtle.btn-danger:active, .btn-subtle.btn-danger.active {
  color: var(--tw-danger);
  background-color: var(--tw-danger-light);
  border-color: var(--tw-danger-light);
  box-shadow: none;
}

.btn-subtle.btn-danger:hover i, .btn-subtle.btn-danger:focus i, .btn-subtle.btn-danger:active i, .btn-subtle.btn-danger.active i {
  color: var(--tw-danger);
}

.btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning.active {
  background-color: var(--tw-warning-active);
  box-shadow: var(--tw-warning-box-shadow);
}

.btn-outline.btn-warning {
  color: var(--tw-warning);
  background-color: var(--tw-warning-light);
  border-color: var(--tw-warning-clarity);
}

.btn-outline.btn-warning i {
  color: var(--tw-warning);
}

.btn-outline.btn-warning:hover, .btn-outline.btn-warning:focus, .btn-outline.btn-warning:active, .btn-outline.btn-warning.active {
  color: var(--tw-warning-inverse);
  background-color: var(--tw-warning);
  border-color: var(--tw-warning);
  box-shadow: none;
}

.btn-outline.btn-warning:hover i, .btn-outline.btn-warning:focus i, .btn-outline.btn-warning:active i, .btn-outline.btn-warning.active i {
  color: var(--tw-warning-inverse);
}

.btn-clear.btn-warning {
  border-color: transparent;
  background-color: transparent;
  color: var(--tw-warning);
}

.btn-clear.btn-warning:hover, .btn-clear.btn-warning:focus, .btn-clear.btn-warning:active, .btn-clear.btn-warning.active {
  color: var(--tw-warning-inverse);
  background-color: var(--tw-warning);
  border-color: var(--tw-warning);
  box-shadow: none;
}

.btn-clear.btn-warning:hover i, .btn-clear.btn-warning:focus i, .btn-clear.btn-warning:active i, .btn-clear.btn-warning.active i {
  color: var(--tw-warning-inverse);
}

.btn-subtle.btn-warning:hover, .btn-subtle.btn-warning:focus, .btn-subtle.btn-warning:active, .btn-subtle.btn-warning.active {
  color: var(--tw-warning);
  background-color: var(--tw-warning-light);
  border-color: var(--tw-warning-light);
  box-shadow: none;
}

.btn-subtle.btn-warning:hover i, .btn-subtle.btn-warning:focus i, .btn-subtle.btn-warning:active i, .btn-subtle.btn-warning.active i {
  color: var(--tw-warning);
}

.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active {
  background-color: var(--tw-info-active);
  box-shadow: var(--tw-info-box-shadow);
}

.btn-outline.btn-info {
  color: var(--tw-info);
  background-color: var(--tw-info-light);
  border-color: var(--tw-info-clarity);
}

.btn-outline.btn-info i {
  color: var(--tw-info);
}

.btn-outline.btn-info:hover, .btn-outline.btn-info:focus, .btn-outline.btn-info:active, .btn-outline.btn-info.active {
  color: var(--tw-info-inverse);
  background-color: var(--tw-info);
  border-color: var(--tw-info);
  box-shadow: none;
}

.btn-outline.btn-info:hover i, .btn-outline.btn-info:focus i, .btn-outline.btn-info:active i, .btn-outline.btn-info.active i {
  color: var(--tw-info-inverse);
}

.btn-clear.btn-info {
  border-color: transparent;
  background-color: transparent;
  color: var(--tw-info);
}

.btn-clear.btn-info:hover, .btn-clear.btn-info:focus, .btn-clear.btn-info:active, .btn-clear.btn-info.active {
  color: var(--tw-info-inverse);
  background-color: var(--tw-info);
  border-color: var(--tw-info);
  box-shadow: none;
}

.btn-clear.btn-info:hover i, .btn-clear.btn-info:focus i, .btn-clear.btn-info:active i, .btn-clear.btn-info.active i {
  color: var(--tw-info-inverse);
}

.btn-subtle.btn-info:hover, .btn-subtle.btn-info:focus, .btn-subtle.btn-info:active, .btn-subtle.btn-info.active {
  color: var(--tw-info);
  background-color: var(--tw-info-light);
  border-color: var(--tw-info-light);
  box-shadow: none;
}

.btn-subtle.btn-info:hover i, .btn-subtle.btn-info:focus i, .btn-subtle.btn-info:active i, .btn-subtle.btn-info.active i {
  color: var(--tw-info);
}

.btn-dark {
  color: #fff;
  background-color: var(--tw-dark);
}

.btn-dark:hover, .btn-dark:focus, .btn-dark:active, .btn-dark.active {
  background-color: var(--tw-dark-active);
  box-shadow: var(--tw-dark-box-shadow);
}

.btn-outline.btn-dark {
  color: var(--tw-dark);
  background-color: var(--tw-dark-light);
  border-color: var(--tw-dark-clarity);
}

.btn-outline.btn-dark i {
  color: var(--tw-dark);
}

.btn-outline.btn-dark:hover, .btn-outline.btn-dark:focus, .btn-outline.btn-dark:active, .btn-outline.btn-dark.active {
  color: var(--tw-dark-inverse);
  background-color: var(--tw-dark);
  border-color: var(--tw-dark);
  box-shadow: none;
}