.shadow-md {
   --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.space-x-8> :not([hidden])~ :not([hidden]) {
   --tw-space-x-reverse: 0;
   margin-right: calc(2rem * var(--tw-space-x-reverse));
   margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
}

.text-blue-600 {
   color: #595de5;
}

.hover\:text-blue-600:hover {
   color: #696de8;
}

/* Badge */
.badge {
   display: inline-block;
   padding: 2px 14px;
   border-radius: 9999px;
   font-weight: 500;
   font-size: 13px;
   letter-spacing: .2px;
}

.badge-submitted {
   background-color: rgba(253, 224, 71, 0.2);
   color: #b54708;
}

.badge-submitted-v2 {
   background-color: rgba(253, 224, 71, 0.2);
   color: #b54708;
   border-radius: 4px;
   padding: 6px 14px;
}

.badge-danger {
   /* background-color: rgba(248, 113, 113, 0.1);
   color: #d92d20; */
   background-color: rgba(233, 163, 0, 0.1);
   color: #FFA500;
}

.badge-success {
   background-color: rgba(167, 243, 208, 0.5);
   color: #039855;
}

.badge-primary {
    background-color: #ae46ff26;
    color: #8530ff;
}

.badge-warning {
   /* background-color: rgba(253, 224, 71, 0.2);
   color: #b54708; */
   background-color: #72727226;
   color: #3d3d3d;
}

.badge-submitted {
    background: var(--indigo);
    color: #fff;
}

.badge-inprogress {
  background: var(--sky);
    color: #fff;
}

.badge-approved,
.badge-paid {
  background: var(--amber);
    color: #fff;
}

.badge-closed,
.badge-denied {
  background: var(--rose);
    color: #fff;
}

/* Data Table Styles Override */
.dt-layout-row:not(.dt-layout-table) {
   padding: 10px 15px;
}

body div.dt-container .dt-info {
   color: #667085;
   font-weight: 400;
   font-size: 14px;
}

.dt-paging {}

.dt-paging .dt-paging-button {}

body div.dt-container .dt-paging .dt-paging-button {
   border-color: transparent;
}

body div.dt-container .dt-paging .dt-paging-button.current,
body div.dt-container .dt-paging .dt-paging-button.current:hover,
body div.dt-container .dt-paging .dt-paging-button:hover {
   color: #465fff !important;
   font-weight: 500;
   background: oklab(0.623 -0.0378409 -0.210628 / 0.08);
   border-radius: 8px;
   border-color: transparent;
}

.dt-paging {}

.dt-paging {}

.dt-paging {}

body table.dataTable thead>tr>th.dt-orderable-asc:hover,
body table.dataTable thead>tr>th.dt-orderable-desc:hover,
body table.dataTable thead>tr>td.dt-orderable-asc:hover,
body table.dataTable thead>tr>td.dt-orderable-desc:hover {
   outline: none;
}

body table.dataTable.display>tbody>tr:nth-child(odd)>.sorting_1,
body table.dataTable.order-column.stripe>tbody>tr:nth-child(odd)>.sorting_1,
body table.dataTable.stripe>tbody>tr:nth-child(odd)>*,
body table.dataTable.display>tbody>tr:nth-child(odd)>*,
body table.dataTable.order-column>tbody tr>.sorting_1,
body table.dataTable.order-column>tbody tr>.sorting_2,
body table.dataTable.order-column>tbody tr>.sorting_3,
body table.dataTable.display>tbody tr>.sorting_1,
body table.dataTable.display>tbody tr>.sorting_2,
body table.dataTable.display>tbody tr>.sorting_3,
body table.dataTable.display tbody tr:hover>.sorting_1,
body table.dataTable.order-column.hover tbody tr:hover>.sorting_1,
body table.dataTable.hover>tbody>tr:hover>*,
body table.dataTable.display>tbody>tr:hover>* {
   box-shadow: none;
}

body div.dt-container .dt-length select {
   padding: 8px 32px 8px 12px;
   border-radius: 8px;
}

body div.dt-container .dt-search input {
   border-radius: 8px;
}

body table.dataTable thead th,
body table.dataTable tfoot th {
   font-weight: 500;
   font-size: 14px;
}

body table.dataTable th.dt-type-numeric,
body table.dataTable th.dt-type-date,
body table.dataTable td.dt-type-numeric,
body table.dataTable td.dt-type-date {
   text-align: left;
}

body table.dataTable>thead>tr>th,
body table.dataTable>tbody>tr>th,
body table.dataTable>tbody>tr>td {
   padding: 12px 16px;
}

/* Filter */

.filter-card {
   border: 1px solid #e5e7eb;
   border-radius: 0.75rem;
   background: #fff;
   padding: .75rem .75rem .5rem;
}

.form-label,
.filter-label {
   margin-bottom: 6px;
   display: block;
   font-size: 14px;
   line-height: 1.5;
   font-weight: 500;
   color: #344054;
}

.form-input,
.form-select,
.filter-input,
.filter-select {
   height: 2.75rem;
   /* h-11 */
   width: 100%;
   /* w-full */
   border-radius: 0.5rem;
   /* rounded-lg */
   border: 1px solid #d1d5db;
   /* border + border-gray-300 */
   background-color: #ffffff;
   /* bg-white */
   padding-left: 1rem;
   /* px-4 (left) */
   padding-right: 1rem;
   /* px-4 (right) */
   font-size: 0.875rem;
   /* text-sm */
   line-height: 1.25rem;
   color: #1f2937;
   /* text-gray-800 */
   box-sizing: border-box;
}

.filter-input:focus,
.filter-select:focus {
   border-color: #93c5fd;
   /* focus:border-blue-300 */
   outline: none;
   box-shadow: 0 0 0 3px rgb(59 130 246 / 0.1);
   /* focus:ring-3 focus:ring-blue-500/10 */
}

.filter-checkbox {
   height: 1rem;
   width: 1rem;
   border-radius: 0.25rem;
   border: 1px solid #D1D5DB;
   color: #2563EB;
}

.filter-checkbox:focus {
   outline: none;
   box-shadow: 0 0 0 3px #3B82F6;
}

.sensitive-info {
   filter: blur(6px);
   user-select: none;
   /* transition: filter 0.3s ease; */
}

.sensitive-info.show {
   filter: none;
}

/* Tailwind  */
.bg-yellow-100 {
   --tw-bg-opacity: 1;
   background-color: rgb(254 249 195 / var(--tw-bg-opacity, 1));
}

.text-yellow-600 {
   --tw-text-opacity: 1;
   color: rgb(202 138 4 / var(--tw-text-opacity, 1));
}

.bg-purple-100 {
   --tw-bg-opacity: 1;
   background-color: rgb(243 232 255 / var(--tw-bg-opacity, 1));
}

.text-purple-600 {
   --tw-text-opacity: 1;
   color: rgb(147 51 234 / var(--tw-text-opacity, 1));
}

.bg-blue-50 {
   --tw-bg-opacity: 1;
   background-color: rgb(239 246 255 / var(--tw-bg-opacity, 1));
}

.-left-4 {
   left: -1rem;
}

.ml-6 {
   margin-left: 1.5rem;
}

.transition-shadow {
   transition-property: box-shadow;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
}

.gap-x-3 {
   column-gap: 0.75rem;
}

.gap-y-1 {
   row-gap: 0.25rem;
}



/* Accordion */
/* CSS (pure) */
:root {
   --bg-white: #ffffff;
   --text: #111827;
   --text-muted: #4b5563;
   /* Tailwind gray-600 */
   --border: #e5e7eb;
   /* Tailwind gray-200 */
   --hover: #f9fafb;
   /* Tailwind gray-50  */
   --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}

/* Divide-y */
.accordion-item+.accordion-item {
   border-top: 1px solid var(--border);
}

/* Trigger */
.accordion-trigger {
   display: flex;
   /* flex */
   align-items: center;
   /* items-center */
   justify-content: space-between;
   /* justify-between */
   width: 100%;
   /* w-full */
   padding: 1rem;
   /* p-4 */
   text-align: left;
   /* text-left */
   font-weight: 500;
   /* font-medium */
   background: transparent;
   border: 0;
   cursor: pointer;
}

.accordion-trigger:hover {
   /* hover:bg-gray-50 */
   background: var(--hover);
}

.accordion-trigger:focus {
   outline: none;
   /* focus:outline-none */
}

.accordion-wrapper {
   display: flex;
   gap: 10px;
}

.accordion-wrapper i {
   background-color: green;
   width: 40px;
   height: 40px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 4px;
   color: #fff;
}

.accordion-title-meta-info {
   font-size: 14px;
   font-weight: normal;
   color: #667085;
}

/* Icon */
.accordion-icon {
   width: 1.25rem;
   /* w-5 */
   height: 1.25rem;
   /* h-5 */
   text-align: center;
   transition: transform .2s ease;
   /* transition-transform duration-200 */
}

/* Rotate icon when expanded (replaces group-[aria-expanded='true']:rotate-180) */
.accordion-trigger[aria-expanded="true"] .accordion-icon {
   transform: rotate(180deg);
}

/* Panel */
.accordion-panel {
   max-height: 0;
   /* collapsed */
   overflow: hidden;
   transition: max-height .3s ease;
   padding-inline: 1rem;
   /* px-4 */
}

.accordion-panel[data-open="true"] {
   max-height: 500px;
   /* enough for content */
}

/* Body */
.accordion-body {
   padding-block: .75rem;
   /* py-3 */
   color: var(--text-muted);
   /* text-gray-600 */
}

/* Optional: reduced motion */
@media (prefers-reduced-motion: reduce) {
   .accordion-icon {
      transition: none;
   }

   .accordion-panel {
      transition: none;
   }
}


/* Claim Timeline accordion */
:root {
   --bg: #f8fafc;
   --card: #fff;
   --muted: #6b7280;
   --line: #e5e7eb;
   --ink: #111827;
   --blue: #2563eb;
   --indigo: #4f46e5;
   --sky: #0284c7;
   --amber: #d97706;
   --green: #16a34a;
   --rose: #e11d48;
   --green-50: #ecfdf5;
   --green-100: #dcfce7;
   --rose-50: #fff1f2;
   --rose-100: #ffe4e6;
}

/* Onboarding */
.onboarding {
   background: var(--card);
   border: 1px solid var(--line);
   border-radius: 14px;
   padding: 16px;
   margin-bottom: 20px;
}

/* Accordion layout */
.accordion {
   display: grid;
   gap: 14px;
   margin-top: 16px;
}

.acc-item {
   border: 1px solid var(--line);
   border-radius: 14px;
   background: var(--card);
   overflow: hidden;
   box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

.acc-trigger {
   width: 100%;
   text-align: left;
   background: #fff;
   border: 0;
   display: flex;
   align-items: start;
   justify-content: space-between;
   gap: 12px;
   padding: 14px 16px;
   cursor: pointer;
}

.acc-trigger:focus-visible {
   outline: 2px solid var(--blue);
   outline-offset: 2px;
   border-radius: 14px;
}

.acc-title {
   margin: 0;
   font-size: 16px;
   font-weight: 700;
}

.acc-sub {
   margin: 2px 0 0;
   font-size: 12px;
   color: var(--muted);
}

/* Chevron */
.chev {
   flex: none;
   width: 18px;
   height: 18px;
   margin-left: 8px;
   transition: transform .2s ease;
}

.acc-trigger[aria-expanded="true"] .chev {
   transform: rotate(180deg);
}

/* Panel (animated) */
.acc-panel {
   grid-template-rows: 0fr;
   display: grid;
   transition: grid-template-rows .25s ease;
   border-top: 1px solid var(--line);
}

.acc-panel-inner {
   overflow: hidden;
}

.acc-panel[data-open="true"] {
   grid-template-rows: 1fr;
}

/* Timeline */
.timeline {
   position: relative;
   padding: 16px 0;
}

.timeline::before {
   content: "";
   position: absolute;
   left: 24px;
   top: 16px;
   bottom: 16px;
   width: 1px;
   background: var(--line);
}

.t-step {
   position: relative;
   padding-left: 40px;
   margin-top: 14px;
}

.t-step:first-child {
   margin-top: 0;
}

.dot {
   position: absolute;
   left: 18px;
   top: 2px;
   width: 12px;
   height: 12px;
   border-radius: 999px;
   box-shadow: 0 0 0 4px #fff;
}

.dot.submitted {
   background: var(--indigo);
}

.dot.pending {
   background: var(--sky);
}

.dot.review {
   background: var(--amber);
}

.dot.approved {
   background: var(--green);
}

.dot.rejected {
   background: var(--rose);
}


.t-title {
   margin: 0;
   font-size: 14px;
   font-weight: 600;
}

.t-title.approved {
   color: var(--green);
}

.t-title.rejected {
   color: var(--rose);
}

.t-desc {
   margin: 2px 0 0;
   font-size: 12px;
   color: var(--muted);
}

/* Sub-panels */
.panel {
   margin-top: 10px;
   border-radius: 12px;
   padding: 10px;
   border: 1px solid var(--line);
   background: #fff;
}

.panel.payment {
   border-color: #86efac;
   background: var(--green-50);
}

.panel.payment .label {
   background: var(--green-100);
   color: var(--green);
}

.panel.reject {
   border-color: #fecdd3;
   background: var(--rose-50);
}

.panel.reject .label {
   background: var(--rose-100);
   color: var(--rose);
}

.panel .head {
   display: flex;
   justify-content: space-between;
   align-items: center;
   font-size: 14px;
   font-weight: 600;
   color: #111;
}

.label {
   border-radius: 999px;
   padding: 2px 8px;
   font-size: 11px;
   font-weight: 700;
}

.panel ul {
   margin: 6px 0 0 16px;
   padding: 0;
   font-size: 12px;
   color: #374151;
   list-style: disc;
}

.panel ul li {
   margin: 3px 0;
}

/* Legend */
.legend {
   display: flex;
   flex-wrap: wrap;
   gap: 12px;
   font-size: 12px;
   color: var(--muted);
}

  .custom-legend {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
  }
  .custom-legend span {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
  }
  .custom-legend i {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
  }

.swatch {
   display: inline-block;
   width: 10px;
   height: 10px;
   border-radius: 999px;
   margin-right: 6px;
   vertical-align: middle;
}

.status-dot {
  width: 14px;
  height: 14px;
  border-radius: 9999px;
  display: inline-block;
  flex: none;
  animation: pulseBlink 1.4s ease-in-out infinite;
}

.status-dot-stable {
  width: 14px;
  height: 14px;
  border-radius: 9999px;
  display: inline-block;
  flex: none;
  /* animation: pulseBlink 1.4s ease-in-out infinite; */
}

@keyframes pulseBlink {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.25); opacity: .6; }
}

/* Variants */
/* .status-submitted { background: var(--indigo); }
.status-pending   { background: var(--sky); }
.status-paid      { background: var(--green); }
.status-rejected  { background: var(--rose); } */

.status-submitted { background: #2563eb; }
.status-inprocess { background: #b54708; }
.status-awaiting  { background: #b54708; }
.status-approved  { background: #039855; }
.status-closed    { background: #d92d20; }
.status-denied    { background: #d92d20; }

.status-submitted {
   background: #8530ff;
}
.status-inprogress {
   /* background: #b54708; */
   background: #FFA500;
}
.status-awaiting {
   /* background: #b54708; */
   background: #3d3d3d;
}
.status-approved {
   background: #039855;
}
.status-closed {
   /* background: #d92d20; */
   background: #FFA500
}
.status-denied {
   /* background: #d92d20; */
   background: #FFA500
}
.status-paid {
   background: #039855;
}
.gap-x-4 {
   column-gap: calc(var(--spacing) * 4);
}

.blur-xl {
   --tw-blur: blur(var(--blur-xl));
   filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
}

.bg-green-500\/20 {
   background-color: color-mix(in srgb, oklch(72.3% 0.219 149.579) 20%, transparent);
   @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-green-500) 20%, transparent);
   }
}

.bg-gradient-to-br {
   --tw-gradient-position: to bottom right in oklab;
   background-image: linear-gradient(var(--tw-gradient-stops));
}

.from-green-500 {
   --tw-gradient-from: var(--color-green-500);
   --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-emerald-600 {
   --tw-gradient-to: var(--color-green-600);
   --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}

.place-items-center {
   place-items: center;
}

.bg-indigo-100 {
   background-color: #e0e7ff;
}

.text-indigo-600 {
   color: #4f39f6;
}

.debit-card-bg {
   background: url('/assets/img/card-bg.svg') no-repeat;
   background-size: cover;
   border-radius: 16px;
}

.transactions-body .blinking {
animation: blinking 1.2s infinite;
}

.transactions-body .highlighted {
background-color: #ffdb002b;
}

@keyframes blinking {
	0% {
		background-color: #ffdb00;
	}

	100% {
		background-color: inherit;
	}
}

.loader-overlay {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(255, 255, 255, 0.8);
   z-index: 9999;
   display: flex;
   justify-content: center;
   align-items: center;
}

.spinner {
   width: 50px;
   height: 50px;
   border: 6px solid #ddd;
   border-top-color: #3498db;
   border-radius: 50%;
   animation: spin 1s linear infinite;
}

@keyframes spin {
   to {
      transform: rotate(360deg);
   }
}

button:disabled {
   /* color: #ffffff;
   cursor: not-allowed;
   opacity: 0.7;
   box-shadow: none; */

   cursor: not-allowed;
}

.register-remove-address{
   color: #ffffff;
   opacity: 0.7;
   box-shadow: none;
   background: #e30707;
   padding: 7px;
   border-radius: 7px;
}

a.disabled {
   background-color: #656878cc;
   color: #ffffff !important;
   cursor: not-allowed;
   opacity: 0.7;
   box-shadow: none;
   pointer-events: none;
   text-decoration: none;
}

.pagination-span {
   display: flex;
   align-items: center;
}

.dt-paging-button {
   box-sizing: border-box;
   display: inline-block;
   min-width: 1.5em;
   padding: 0.5em 1em;
   margin-left: 2px;
   text-align: center;
   text-decoration: none;
   cursor: pointer;
   color: inherit;
   border: 1px solid transparent;
   border-radius: 2px;
   background: transparent;
   font-weight: 500;
}

.dt-paging-button:hover,
.dt-paging-button.current,
.dt-paging-button.current:hover {
   color: #465fff;
   background: oklab(0.623 -0.0378409 -0.210628 / 0.08);
   border-radius: 8px;
   border-color: transparent;
}

.dt-paging-button.disabled {
    cursor: default;
    color: rgba(0, 0, 0, 0.5) !important;
    border: 1px solid transparent;
    background: transparent;
    box-shadow: none;
}

.pagination-info {
   color: #667085;
   font-weight: 400;
   font-size: 14px;
}

.customMultiSelectDropdown { 
   position: relative;
}

.customMultiSelectDropdown .dropdown-btn {
   width: 100%;
   min-height: 42px;
   border: 1px solid #ccc;
   border-radius: 9px;
   padding: 5px 10px;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: 5px;
   cursor: pointer;
   background: #fff;
     font-size: 14px;
}

.customMultiSelectDropdown .pill {
   background: #3b82f6;
   color: white;
   padding: 2px 8px;
   border-radius: 999px;
   font-size: 13px;
   display: flex;
   align-items: center;
   gap: 5px;
}

.customMultiSelectDropdown .pill span {
   cursor: pointer;
   font-weight: bold;
}

.customMultiSelectDropdown .dropdown-content {
   position: absolute;
   top: 100%;
   left: 0;
   width: 100%;
   background: #fff;
   border: 1px solid #ccc;
   border-radius: 6px;
   max-height: 200px;
   overflow-y: auto;
   display: none;
   z-index: 10;
}

.customMultiSelectDropdown .dropdown-content label {
   display: block;
   padding: 5px 10px;
   cursor: pointer;
}

.customMultiSelectDropdown .dropdown-content label:hover {
   background: #f0f0f0;
}


.customMultiSelectDropdownWithoutComponent { 
   position: relative;
}

.customMultiSelectDropdownWithoutComponent .dropdown-btn {
   width: 100%;
   min-height: 42px;
   border: 1px solid #ccc;
   border-radius: 9px;
   padding: 5px 10px;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: 5px;
   cursor: pointer;
   background: #fff;
     font-size: 14px;
}

.customMultiSelectDropdownWithoutComponent .pill {
   background: #3b82f6;
   color: white;
   padding: 2px 8px;
   border-radius: 999px;
   font-size: 13px;
   display: flex;
   align-items: center;
   gap: 5px;
}

.customMultiSelectDropdownWithoutComponent .pill span {
   cursor: pointer;
   font-weight: bold;
}

.customMultiSelectDropdownWithoutComponent .dropdown-content {
   position: absolute;
   top: 100%;
   left: 0;
   width: 100%;
   background: #fff;
   border: 1px solid #ccc;
   border-radius: 6px;
   max-height: 200px;
   overflow-y: auto;
   display: none;
   z-index: 10;
}

.customMultiSelectDropdownWithoutComponent .dropdown-content label {
   display: block;
   padding: 5px 10px;
   cursor: pointer;
}

.customMultiSelectDropdownWithoutComponent .dropdown-content label:hover {
   background: #f0f0f0;
}

#ActionLogsDataModal .pre-scroll {
    max-height: 70vh;  
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
    background-color: #f3f4f6;
    padding: 0.75rem;
    border-radius: 0.5rem;
    font-size: 0.875rem;
}



.logo {
   width: 280px;
}

body .daterangepicker td.active,
body .daterangepicker td.active:hover {
   background-color: #595de5;
}

body .daterangepicker td.in-range {
   background-color: #eeeefc;
}

body .daterangepicker td.available:hover,
body .daterangepicker th.available:hover {
   background-color: #595de5;
   color: #fff;}
   
/* Variants */
.status-submitted { background: var(--indigo); }
.status-pending   { background: var(--sky); }
.status-paid      { background: var(--green); }
.status-rejected  { background: var(--rose); }


.dot.progress {
   background: var(--sky);
}

.dot.approved {
   background: var(--amber);
}

.dot.paid {
   background: var(--green);
}

.bg-slate-50 {
   --tw-bg-opacity: 1;
   background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));
}
.border-slate-200 {
   --tw-border-opacity: 1;
   border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));
}
.text-amber-900 {
   --tw-text-opacity: 1;
   color: rgb(120 53 15 / var(--tw-text-opacity, 1));
}
.bg-amber-50 {
   --tw-bg-opacity: 1;
   background-color: rgb(255 251 235 / var(--tw-bg-opacity, 1));
}
.border-amber-200 {
   --tw-border-opacity: 1;
   border-color: rgb(253 230 138 / var(--tw-border-opacity, 1));
}

/* Make Tom Select look Tailwind-y */
.ts-wrapper.multi .ts-control {
   flex-wrap: wrap;
}

.ts-wrapper .ts-control,
.ts-dropdown,
.ts-dropdown .optgroup-header,
.ts-dropdown .option,
.ts-dropdown .create {
   border-radius: 0.5rem; /* rounded-xl */
}

.ts-wrapper .ts-control { 
   border: 1px solid rgb(209 213 219); /* gray-300 */
   padding: 0.5rem 0.75rem; /* px-3 py-2 */
   min-height: 42px;
   box-shadow: none;
   background-color: white;
}

.ts-wrapper.focus .ts-control { 
   border-color: #93c5fd;
   outline: none;
   box-shadow: 0 0 0 3px rgb(59 130 246 / 0.1);
}

.ts-wrapper .ts-control .item { 
   background: rgb(239 246 255); /* blue-50 */
   border: 1px solid rgb(191 219 254); /* blue-200 */
   color: rgb(37 99 235); /* blue-600 */
   border-radius: 9999px; /* pill */
   padding: 0.15rem 0.5rem;
   margin: 2px;
   font-size: 0.875rem; /* text-sm */
}

.ts-dropdown { 
   border: 1px solid rgb(209 213 219); /* gray-300 */
   box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); /* shadow-xl */
   background: white;
}

.ts-dropdown .active {
   background: rgb(243 244 246);
} /* gray-100 */

.ts-dropdown .option {
   padding: 0.5rem 0.75rem;
}

.ts-dropdown .no-results, .ts-dropdown .create {
   padding: 0.5rem 0.75rem;
   color: rgb(107 114 128);
} /* gray-500 */

.ts-wrapper.plugin-remove_button .item .remove {
   border-left: 0;
}

body .ts-dropdown,
body .ts-control,
body .ts-control input {
   font-size: inherit;
}

body .ts-wrapper.plugin-clear_button .ts-control  .clear-button {
   margin: 0;
   right: 5px;
}

body .ts-wrapper.multi .ts-control > div {
   background-color: #f3f4f7;
}

body .ts-dropdown .option {
   color: #1f2937;
}

body .ts-dropdown .option.active {
   background-color: #f3f4f7;
   color: #1f2937;
}

body .ts-dropdown [data-selectable].option{
   padding: 10px 15px;
}

body .ts-dropdown-content {
   max-height: 500px;
   padding: 8px 12px;
}

body .ts-dropdown {
   border: 1px solid #e0e0e0;
   border-radius: .5rem;
   margin: 0;
}

/* Odometer */

.counter {
   --speed: 160ms; /* time for each single-step roll */
   --easing: cubic-bezier(.2,.7,.2,1);
}

.counter{
   display:flex;
}

.counter * {
   box-sizing: content-box;
}

.currency{
   font-weight:600;
   font-size: var(--text-2xl);
   line-height: var(--text-2xl);
}

/* The odometer block */
.odometer{
   display:flex;
   align-items:flex-end;
}

.digit, .comma, .ododot {
   height: var(--text-2xl);
   line-height: var(--text-2xl);
   font-weight:600;
   font-variant-numeric: tabular-nums;
   font-feature-settings: 'tnum' 1, 'lnum' 1;
   font-size: var(--text-2xl);
   position:relative;
   overflow:hidden;
   min-width: .62em;
   text-align:center;
}

.comma, .ododot {
   min-width: 0;
}

.wheel{
   position:absolute;
   inset:0;
   display:flex;
   flex-direction:column;
   transition: transform var(--speed) var(--easing);
   will-change: transform;
}

.wheel > span{
   height: var(--text-2xl);
   display:block;
}

/* Controls */
.controls{
   display:flex;
   margin-top:18px;
}

.controls button{
   appearance:none;
   border:1px solid #30323a;
   background:#151823;
   color:#e8eaed;
   padding:10px 14px;
   border-radius:12px;
   font-weight:600;
   cursor:pointer;
   transition: transform .06s ease;
}

.controls button:hover{
   filter: brightness(1.15);
}

.controls button:active{
   transform: translateY(1px);
}

@media (prefers-reduced-motion: reduce){
   .wheel{ transition: none; }
}

.claim-preview-grid {
   display: grid;
   grid-template-columns: 190px 1fr;
   row-gap: 10px;
   column-gap: 12px;
}

.claim-preview-grid-value {
   margin: 0;
   font-weight: 600;
   background: #fafafa;
   border: 1px dashed #e5e7eb;
   padding: 10px 12px;
   border-radius: 10px;
}

.-mx-2 {
   margin-left: calc(var(--spacing) * -2);
   margin-right: calc(var(--spacing) * -2);
}