@keyframes bounce {
  0% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(5px);
  }

  100% {
    transform: translateX(0);
  }
}

.animate-side-to-side {
  animation: bounce 1s infinite;
}
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    --font-size-heading-xl: 1.75rem;
    --line-height-heading-xl: 2.375rem;

    --font-size-heading-lg: 1.5rem;
    --line-height-heading-lg: 2rem;

    --font-size-heading-md: 1.25rem;
    --line-height-heading-md: 1.75rem;

    --font-size-heading-sm: 1.125rem;
    --line-height-heading-sm: 1.5rem;

    --font-size-body: 0.875rem;
    --line-height-body: 1.25rem;

    --font-size-body-sm: 0.75rem;
    --line-height-body-sm: 1.125rem;

    --font-size-caption: 0.625rem;
    --line-height-caption: 0.9375rem;
  }

  body {
    @apply text-gray-800 body;
  }

  a {
    @apply font-medium text-thatch-600 hover:text-thatch-purple-hover;
  }

  /* Hide the number input arrows */
  /* Chrome, Safari, Edge, Opera */
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  /* Firefox */
  input[type="number"] {
    -moz-appearance: textfield;
  }
}

@layer components {
  .responsive-text-styles {
    --font-size-heading-xl: 2rem;
    --line-height-heading-xl: 2.75rem;

    --font-size-heading-lg: 1.75rem;
    --line-height-heading-lg: 2.375rem;

    --font-size-heading-md: 1.5rem;
    --line-height-heading-md: 2rem;

    --font-size-heading-sm: 1.25rem;
    --line-height-heading-sm: 1.75rem;

    --font-size-body: 1rem;
    --line-height-body: 1.4375rem;

    --font-size-body-sm: 0.875rem;
    --line-height-body-sm: 1.25rem;

    --font-size-caption: 0.75rem;
    --line-height-caption: 1.125rem;
  }

  @media (min-width: theme('screens.xs')) {
    .responsive-text-styles {
      --font-size-heading-xl: 1.75rem;
      --line-height-heading-xl: 2.375rem;

      --font-size-heading-lg: 1.5rem;
      --line-height-heading-lg: 2rem;

      --font-size-heading-md: 1.25rem;
      --line-height-heading-md: 1.75rem;

      --font-size-heading-sm: 1.125rem;
      --line-height-heading-sm: 1.5rem;

      --font-size-body: 0.875rem;
      --line-height-body: 1.25rem;

      --font-size-body-sm: 0.75rem;
      --line-height-body-sm: 1.125rem;

      --font-size-caption: 0.625rem;
      --line-height-caption: 0.9375rem;
    }
  }

  .card {
    @apply bg-white py-8 px-4 shadow sm:rounded-lg sm:px-10;
  }

  .table {
    @apply min-w-full divide-y divide-gray-200;
  }

  .thead {
    @apply bg-white;
  }

  .th {
    @apply py-2 text-left body-sm text-gray-500 px-3;
  }

  .th:first-child {
    @apply pl-6;
  }

  .th:last-child {
    @apply pr-6;
  }

  .tbody {
    @apply divide-y divide-gray-200 bg-white;
  }

  .tr {
    @apply h-10;
  }

  .tr-with-hover {
    @apply tr hover:bg-gray-50;
  }

  .td {
    @apply whitespace-nowrap body text-gray-800 px-3;
  }

  .td:first-child {
    @apply pl-6;
  }

  .td:last-child {
    @apply pr-6;
  }

  .h1 {
    @apply heading-lg text-gray-800 text-pretty;
  }

  .h2 {
    @apply heading-md text-gray-800;
  }

  .h3 {
    @apply heading-sm text-gray-800 mb-4;
  }

  .btn {
    @apply h-10 px-4 py-2 inline-flex items-center justify-center whitespace-nowrap rounded-lg body-bold ring-offset-white transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-thatch-500 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 dark:ring-offset-gray-950 dark:focus-visible:ring-gray-300;
  }

  .btn-primary {
    @apply h-10 py-2 px-4 appearance-none inline-flex justify-center gap-2 items-center rounded-lg body-bold outline outline-offset-2 outline-2 outline-transparent focus-visible:outline-thatch-500 transition aria-disabled:pointer-events-none text-nowrap border-thatch-700 border border-b-2 hover:border-thatch-800 focus-visible:border-thatch-800 disabled:border-thatch-300 aria-disabled:border-thatch-300 bg-thatch-500 hover:bg-thatch-600 focus-visible:bg-thatch-600 disabled:bg-thatch-300 aria-disabled:bg-thatch-300 text-white hover:text-white bg-gradient-to-b from-black/20 disabled:bg-none aria-disabled:bg-none;
    box-shadow: 0 1px 0 1px rgba(255, 255, 255, .25) inset;
  }

  .btn-primary:active {
    box-shadow: 0 1px 0 0 rgba(255, 255, 255, .25) inset;
  }

  .btn-secondary {
    @apply btn bg-thatch-gray text-thatch-gray-text hover:bg-thatch-gray-hover active:bg-thatch-gray-active px-4 py-2;
  }

  .btn-outline {
    @apply btn bg-white text-thatch-purple border border-thatch-gray-border hover:bg-thatch-gray-hover hover:text-thatch-purple-hover active:bg-thatch-gray-active active:text-thatch-purple-active;
  }

  .btn-ghost {
    @apply btn bg-white text-thatch-gray-text hover:bg-thatch-gray-hover active:bg-thatch-gray-active;
  }

  .btn-link {
    @apply inline-flex underline gap-x-1 py-1 px-0 focus:px-1 focus:rounded-lg body-sm leading-4 text-ds-text-secondary hover:text-thatch-purple-hover active:text-thatch-purple-active disabled:text-ds-text-inactive focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-ds-brand-disabled;
  }

  .btn-destructive {
    @apply btn bg-white text-thatch-red border border-thatch-red-border hover:bg-thatch-red-hover active:bg-thatch-red-active;
  }

  .button {
    @apply w-full h-10 py-2 px-4 appearance-none inline-flex justify-center gap-2 items-center rounded-lg body-bold outline outline-offset-2 outline-2 outline-transparent focus-visible:outline-thatch-500 transition aria-disabled:pointer-events-none text-nowrap border-thatch-700 border border-b-2 hover:border-thatch-800 focus-visible:border-thatch-800 disabled:border-thatch-300 aria-disabled:border-thatch-300 bg-thatch-500 hover:bg-thatch-600 focus-visible:bg-thatch-600 disabled:bg-thatch-300 aria-disabled:bg-thatch-300 text-white hover:text-white bg-gradient-to-b from-black/20 disabled:bg-none aria-disabled:bg-none;

    box-shadow: 0 1px 0 1px rgba(255, 255, 255, .25) inset;
  }

  .button-icon-secondary {
    @apply h-8 w-8 appearance-none flex shrink-0 items-center justify-center rounded-lg transition outline outline-offset-2 outline-2 outline-transparent focus-visible:outline-thatch-500 aria-disabled:pointer-events-none text-gray-800 hover:text-gray-800 disabled:text-gray-800/40 aria-disabled:text-gray-800/40 border-2 border-transparent disabled:border-gray-200 aria-disabled:border-gray-200 bg-white bg-clip-padding disabled:bg-clip-border aria-disabled:bg-clip-border hover:bg-gray-100 data-[selected="true"]:bg-gray-100 data-[state*="open"]:bg-gray-100 focus-visible:bg-gray-100 active:bg-gray-50 disabled:bg-gray-200 aria-disabled:bg-gray-200 disabled:border-gradient-none aria-disabled:border-gradient-none border-gradient-to-b from-gray-200 to-gray-400 before:-inset-[2px];
  }

  .button:active {
    box-shadow: 0 1px 0 0 rgba(255, 255, 255, .25) inset;
  }

  .button-outline {
    @apply w-full flex items-center justify-center h-10 py-2 px-4 border border-transparent rounded-lg shadow-md body-bold text-thatch-purple border-thatch-purple hover:border-thatch-purple-hover hover:text-thatch-purple transition duration-100 ease-in-out focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-thatch-purple cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed;
  }

  .button-light {
    @apply w-full bg-gray-100 flex items-center justify-center h-10 py-2 px-4 rounded-lg body-bold text-thatch-purple border-thatch-purple hover:text-thatch-purple-hover transition duration-100 ease-in-out focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-thatch-purple cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed;
  }

  .button-full {
    @apply w-full h-10 py-2 px-4 appearance-none inline-flex justify-center gap-2 items-center rounded-lg body-bold outline outline-offset-2 outline-2 outline-transparent focus-visible:outline-thatch-500 transition aria-disabled:pointer-events-none text-nowrap border-thatch-700 border border-b-2 hover:border-thatch-800 focus-visible:border-thatch-800 disabled:border-thatch-300 aria-disabled:border-thatch-300 bg-thatch-500 hover:bg-thatch-600 focus-visible:bg-thatch-600 disabled:bg-thatch-300 aria-disabled:bg-thatch-300 text-white hover:text-white bg-gradient-to-b from-black/20 disabled:bg-none aria-disabled:bg-none;

    box-shadow: 0 1px 0 1px rgba(255, 255, 255, .25) inset;
  }

  .button-xl {
    @apply w-full flex justify-center py-6 px-4 border border-transparent rounded-md shadow-sm body-bold text-white bg-thatch-purple enabled:hover:bg-thatch-purple hover:text-white focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-thatch-purple cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed;
  }

  .button-disabled {
    @apply w-full flex items-center justify-center h-10 py-2 px-4 border rounded-lg shadow-md body-bold text-gray-400 cursor-not-allowed;
  }

  .pagination-button {
    @apply body text-thatch-gray-secondary disabled:text-gray-300 border rounded-md shadow px-2 py-1;
  }

  .submit {
    @apply w-full h-10 py-2 px-4 appearance-none inline-flex justify-center gap-2 items-center rounded-lg body-bold outline outline-offset-2 outline-2 outline-transparent focus-visible:outline-thatch-500 transition aria-disabled:pointer-events-none text-nowrap border-thatch-700 border border-b-2 hover:border-thatch-800 focus-visible:border-thatch-800 disabled:border-thatch-300 aria-disabled:border-thatch-300 bg-thatch-500 hover:bg-thatch-600 focus-visible:bg-thatch-600 disabled:bg-thatch-300 aria-disabled:bg-thatch-300 text-white hover:text-white bg-gradient-to-b from-black/20 disabled:bg-none aria-disabled:bg-none;
    @apply disabled:before:content-[''] disabled:before:h-4 disabled:before:w-4 disabled:before:mr-2 disabled:before:border-2 disabled:before:border-white disabled:before:border-t-white/20 disabled:before:rounded-full disabled:before:animate-spin;

    box-shadow: 0 1px 0 1px rgba(255, 255, 255, .25) inset;
  }

  .submit:active {
    box-shadow: 0 1px 0 0 rgba(255, 255, 255, .25) inset;
  }

  .input-default {
    @apply appearance-none block w-full px-3 py-2 border border-gray-400 rounded-md text-gray-800 placeholder-gray-500 focus:outline-none focus:border-thatch-purple focus:ring-0 sm:text-sm disabled:bg-slate-50;
  }

  select.input-default {
    @apply pr-8;
  }

  .input-default-shadow-lg {
    @apply appearance-none block w-full px-3 py-2 border border-gray-400 rounded-md shadow-lg text-gray-800 placeholder-gray-500 focus:outline-none focus:border-thatch-purple-primary focus:ring-0 sm:text-sm disabled:bg-slate-50;
  }

  .label-default {
    @apply block body-sm-bold text-gray-800;
  }

  .checkbox-default {
    @apply appearance-none h-4 w-4 text-thatch-purple focus:ring-thatch-purple border-gray-400 rounded mr-2;
  }

  .checkbox-disabled {
    @apply appearance-none h-4 w-4 cursor-not-allowed bg-gray-200 focus:ring-thatch-purple border-gray-300 rounded;
  }

  .radio-default {
    @apply appearance-none h-4 w-4 text-thatch-purple focus:ring-thatch-purple border-gray-400 rounded-full;
  }

  div.field-with-errors>.label-default {
    @apply text-red-900;
  }

  div.field-with-errors>.input-default,
  div.field-with-errors>.input-overwrite,
  div.field-with-errors>.input-default-shadow-lg {
    @apply border-red-300 text-red-900 placeholder-red-300 focus:border-red-500 focus:outline-none focus:ring-0;
  }

  div.field-with-errors>.field-error {
    @apply text-xs text-red-800 mt-2;
  }

  /* PAGY */
  /* Copied from https://ddnexus.github.io/pagy/docs/api/stylesheets/ */
  .pagy {
    @apply flex space-x-1 font-semibold text-sm text-gray-500;

    a:not(.gap) {
      @apply block rounded-lg px-3 py-1 bg-gray-200;

      &:hover {
        @apply bg-gray-300;
      }

      &:not([href]) {
        /* disabled links */
        @apply text-gray-300 bg-gray-100 cursor-default;
      }

      &.current {
        @apply text-white bg-gray-400;
      }
    }

    label {
      @apply inline-block whitespace-nowrap bg-gray-200 rounded-lg px-3 py-0.5;

      input {
        @apply bg-gray-100 border-none rounded-md;
      }
    }
  }

  /* ALLOWANCE SLIDER */
  .advanced-slider-thumb {
    @apply w-3 h-3 box-content border-solid border-8 bg-transparent appearance-none rounded-full cursor-pointer shadow-md border-thatch-purple-secondary hover:border-thatch-purple-primary transition-colors;
  }

  .advanced-slider {
    @apply w-full h-3.5 rounded-full appearance-none;
  }

  .slider-gradient {
    background: linear-gradient(to right,
        rgb(148 163 184),
        rgb(148 163 184) 18%,
        rgb(250 204 21) 28%,
        rgb(250 204 21) 70%,
        rgb(226 232 240) 85%,
        rgb(226 232 240));
  }

  .advanced-slider::-webkit-slider-thumb {
    @apply advanced-slider-thumb;
  }

  .advanced-slider::-moz-range-thumb {
    @apply advanced-slider-thumb;
  }

  .small-slider-thumb {
    @apply w-2 h-2 box-content border-solid border-4 bg-transparent appearance-none rounded-full cursor-pointer shadow-md border-indigo-600 hover:border-thatch-purple-primary transition-colors;
  }

  .small-slider {
    @apply w-full h-2 rounded-full appearance-none;
  }

  .small-slider::-webkit-slider-thumb {
    @apply small-slider-thumb;
  }

  .small-slider::-moz-range-thumb {
    @apply small-slider-thumb;
  }

  .helper-text {
    @apply text-xs text-gray-500 mt-2;
  }

  .map-legend-gradient {
    background: linear-gradient(to right,
        rgb(236, 72, 153),
        rgb(192, 0, 192) 40%,
        rgb(79, 70, 229) 90%,
        rgb(49, 46, 129));
  }

  .banner {
    @apply p-2 text-sm text-center items-center justify-center ml-0 md:ml-64;
  }
}

@layer utilities {
  .shadow-b {
    clip-path: inset(0px 0px -15px 0px);
  }

  .dotted-line {
    background-image: radial-gradient(circle,
        #e7e7e7 1px,
        rgba(255, 255, 255, 0) 1px);
    background-size: 10px 10px;
    background-position: 0 50%;
    height: 2px;
  }

  .image-blur {
    filter: blur(8px);
    opacity: 0.5;
  }
}
span[id*="cc-"] {
  display: block;
  height: 40px;
}

span[id*="cc-"] iframe {
  height: 100%;
  width: 100%;
}

.cc-container .form-group {
  position: relative;
}

.cc-container .error-message {
  position: absolute;
  left: 0;
  margin-top: 4px;
  color: #dc3545;
  font-size: 12px;
  line-height: 1.5rem;
}

.cc-container .invalid-field {
  border: 2px solid #ff0000;
  box-shadow: 0px 0px 6px rgba(255, 0, 0, 0.4);
}
/*!
  Theme: GitHub
  Description: Light theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-light
  Current colors taken from GitHub's CSS
*/

.hljs {
  color: #24292e;
}

.hljs-doctag,
.hljs-keyword,
.hljs-meta .hljs-keyword,
.hljs-template-tag,
.hljs-template-variable,
.hljs-type,
.hljs-variable.language_ {
  /* prettylights-syntax-keyword */
  color: #d73a49;
}

.hljs-title,
.hljs-title.class_,
.hljs-title.class_.inherited__,
.hljs-title.function_ {
  /* prettylights-syntax-entity */
  color: #6f42c1;
}

.hljs-attr,
.hljs-attribute,
.hljs-literal,
.hljs-meta,
.hljs-number,
.hljs-operator,
.hljs-variable,
.hljs-selector-attr,
.hljs-selector-class,
.hljs-selector-id {
  /* prettylights-syntax-constant */
  color: #005cc5;
}

.hljs-regexp,
.hljs-string,
.hljs-meta .hljs-string {
  /* prettylights-syntax-string */
  color: #032f62;
}

.hljs-built_in,
.hljs-symbol {
  /* prettylights-syntax-variable */
  color: #e36209;
}

.hljs-comment,
.hljs-code,
.hljs-formula {
  /* prettylights-syntax-comment */
  color: #6a737d;
}

.hljs-name,
.hljs-quote,
.hljs-selector-tag,
.hljs-selector-pseudo {
  /* prettylights-syntax-entity-tag */
  color: #22863a;
}

.hljs-subst {
  /* prettylights-syntax-storage-modifier-import */
  color: #24292e;
}

.hljs-section {
  /* prettylights-syntax-markup-heading */
  color: #005cc5;
  font-weight: bold;
}

.hljs-bullet {
  /* prettylights-syntax-markup-list */
  color: #735c0f;
}

.hljs-emphasis {
  /* prettylights-syntax-markup-italic */
  color: #24292e;
  font-style: italic;
}

.hljs-strong {
  /* prettylights-syntax-markup-bold */
  color: #24292e;
  font-weight: bold;
}

.hljs-addition {
  /* prettylights-syntax-markup-inserted */
  color: #22863a;
  background-color: #f0fff4;
}

.hljs-deletion {
  /* prettylights-syntax-markup-deleted */
  color: #b31d28;
  background-color: #ffeef0;
}

.hljs-char.escape_,
.hljs-link,
.hljs-params,
.hljs-property,
.hljs-punctuation,
.hljs-tag {
  /* purposely ignored */
}
/*

 */

@font-face {
    font-family: 'Inter var';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-italic.extra.var-cc59cf4b324781109d703309fc7d8814b6ba74dd2822a3c029715da8cb98ea57.woff2) format('woff2');
    unicode-range: U+E000, U+E002-E081, U+E093-E097, U+E0A5-E0E7, U+E0F3-E11D, U+E11E-E165, U+EE01, U+F6C3;
    font-named-instance: 'Italic';
}

/* alternates */
@font-face {
    font-family: 'Inter var';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-italic.alternates.var-cc59cf4b324781109d703309fc7d8814b6ba74dd2822a3c029715da8cb98ea57.woff2) format('woff2');
    unicode-range: U+E000, U+E002-E081, U+E093-E097, U+E0A5-E0E7, U+E0F3-E11D, U+E11E-E165, U+EE01, U+F6C3;
    font-named-instance: 'Italic';
}

/* symbols */
@font-face {
    font-family: 'Inter var';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-italic.symbols.var-59f27012284f5e97bbff303eb599ca98f29629a1c0fe7352bcc15b27d1dcd937.woff2) format('woff2');
    unicode-range: U+20DD-20DF, U+2190-219A, U+21A9-21AB, U+21B0-21B2, U+21B3-21B6, U+21BA-21BC, U+21D0, U+21D2, U+21D4, U+21DE-21E0, U+21E4-21E6, U+21E7, U+21EA, U+2303, U+2305, U+2318, U+2325-2328, U+232B, U+2380, U+2387, U+238B, U+23CE-23D0, U+2460-2469, U+24B6-24D0, U+24EA, U+25A0-25A3, U+25B2-25B4, U+25B6-25B8, U+25BA-25BE, U+25C0-25C2, U+25C4-25C8, U+25CB, U+25CF, U+25EF, U+2600, U+2605-2607, U+263C, U+2661, U+2665, U+26A0, U+2713, U+2717, U+2756, U+2764, U+2780-2789, U+27F5-27FB, U+2B06, U+2B12-2B14, U+2B1C, U+E000, U+E12B-E164, U+1F130-1F14A, U+1F850, U+1F852;
    font-named-instance: 'Italic';
}

/* extra */
@font-face {
    font-family: 'Inter var';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-italic.extra.var-cc59cf4b324781109d703309fc7d8814b6ba74dd2822a3c029715da8cb98ea57.woff2) format('woff2');
    unicode-range: U+E000, U+E002-E081, U+E093-E097, U+E0A5-E0E7, U+E0F3-E11D, U+E11E-E165, U+EE01, U+F6C3;
    font-named-instance: 'Italic';
}

/* alternates */
@font-face {
    font-family: 'Inter var';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-italic.alternates.var-cc59cf4b324781109d703309fc7d8814b6ba74dd2822a3c029715da8cb98ea57.woff2) format('woff2');
    unicode-range: U+E000, U+E002-E081, U+E093-E097, U+E0A5-E0E7, U+E0F3-E11D, U+E11E-E165, U+EE01, U+F6C3;
    font-named-instance: 'Italic';
}

/* symbols */
@font-face {
    font-family: 'Inter var';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-italic.symbols.var-59f27012284f5e97bbff303eb599ca98f29629a1c0fe7352bcc15b27d1dcd937.woff2) format('woff2');
    unicode-range: U+20DD-20DF, U+2190-219A, U+21A9-21AB, U+21B0-21B2, U+21B3-21B6, U+21BA-21BC, U+21D0, U+21D2, U+21D4, U+21DE-21E0, U+21E4-21E6, U+21E7, U+21EA, U+2303, U+2305, U+2318, U+2325-2328, U+232B, U+2380, U+2387, U+238B, U+23CE-23D0, U+2460-2469, U+24B6-24D0, U+24EA, U+25A0-25A3, U+25B2-25B4, U+25B6-25B8, U+25BA-25BE, U+25C0-25C2, U+25C4-25C8, U+25CB, U+25CF, U+25EF, U+2600, U+2605-2607, U+263C, U+2661, U+2665, U+26A0, U+2713, U+2717, U+2756, U+2764, U+2780-2789, U+27F5-27FB, U+2B06, U+2B12-2B14, U+2B1C, U+E000, U+E12B-E164, U+1F130-1F14A, U+1F850, U+1F852;
    font-named-instance: 'Italic';
}

/* cyrillic */
@font-face {
    font-family: 'Inter var';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-italic.cyrillic.var-a31159d5ce68b317b19edc7ee7f1f3ffdd5316ee899945b502406abda313afa2.woff2) format('woff2');
    unicode-range: U+0400-049E, U+04A0-0500, U+052F, U+20B4, U+2116, U+2DFF, U+A69F;
    font-named-instance: 'Italic';
}

/* greek */
@font-face {
    font-family: 'Inter var';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-italic.greek.var-77ec12f9397b88a29c16c05f2db87d9c0d0c2b157f1980271fed020f00b35321.woff2) format('woff2');
    unicode-range: U+0370-0378, U+037A-0380, U+0384-038B, U+038C, U+038E-03A2, U+03A3-03E2, U+03F0-0400, U+1F00-1F16, U+1F18-1F1E, U+1F20-1F46, U+1F48-1F4E, U+1F50-1F58, U+1F59, U+1F5B, U+1F5D, U+1F5F-1F7E, U+1F80-1FB5, U+1FB6-1FC5, U+1FC6-1FD4, U+1FD6-1FDC, U+1FDD-1FF0, U+1FF2-1FF5, U+1FF6-1FFF;
    font-named-instance: 'Italic';
}

/* vietnamese */
@font-face {
    font-family: 'Inter var';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-italic.vietnamese.var-b5dc5b6490ba49e8193315ff62c8e90551102055440f084a6e982e5eab8e589a.woff2) format('woff2');
    unicode-range: U+0102-0104, U+0110-0112, U+0128-012A, U+0168-016A, U+01A0-01A2, U+01AF-01B1, U+1EA0-1EFA, U+20AB;
    font-named-instance: 'Italic';
}

/* latin-ext */
@font-face {
    font-family: 'Inter var';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-italic.latin-ext.var-802705fb8496b82eda3f410c7e70a35c9407ba98b97cc5d9754db82750466fad.woff2) format('woff2');
    unicode-range: U+0100-0149, U+014A-01C4, U+01C5-0250, U+0259, U+1E00-1F00, U+2020, U+20A0-20AC, U+20AD-20C0, U+2113, U+2C7C, U+2C7F, U+A7FF;
    font-named-instance: 'Italic';
}

/* latin */
@font-face {
    font-family: 'Inter var';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-italic.latin.var-cbfc0334f8cfad4727431982cd32c32f7daf6e73f0ab6f759ec3dc757c1c6bf7.woff2) format('woff2');
    unicode-range: U+0000-007F, U+00A0-0100, U+0131, U+0152-0154, U+02BB-02BD, U+02C6, U+02DA, U+02DC, U+2000-200C, U+2010-2028, U+202F-2060, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+FEFF;
    font-named-instance: 'Italic';
}

/* extra */
@font-face {
    font-family: 'Inter var';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-roman.extra.var-29781a209d7978155bf343eb1653779269965fa4a43d504b1fb361ab20e8487b.woff2) format('woff2');
    unicode-range: U+E000, U+E002-E081, U+E093-E097, U+E0A5-E0E7, U+E0F3-E11D, U+E11E-E165, U+EE01, U+F6C3;
    font-named-instance: 'Regular';
}

/* alternates */
@font-face {
    font-family: 'Inter var';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-roman.alternates.var-29781a209d7978155bf343eb1653779269965fa4a43d504b1fb361ab20e8487b.woff2) format('woff2');
    unicode-range: U+E000, U+E002-E081, U+E093-E097, U+E0A5-E0E7, U+E0F3-E11D, U+E11E-E165, U+EE01, U+F6C3;
    font-named-instance: 'Regular';
}

/* symbols */
@font-face {
    font-family: 'Inter var';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-roman.symbols.var-847d2a436a03ba1fbd4b750915db031a12a713befe0dcd79e8f39bf6a6e1a647.woff2) format('woff2');
    unicode-range: U+20DD-20DF, U+2190-219A, U+21A9-21AB, U+21B0-21B2, U+21B3-21B6, U+21BA-21BC, U+21D0, U+21D2, U+21D4, U+21DE-21E0, U+21E4-21E6, U+21E7, U+21EA, U+2303, U+2305, U+2318, U+2325-2328, U+232B, U+2380, U+2387, U+238B, U+23CE-23D0, U+2460-2469, U+24B6-24D0, U+24EA, U+25A0-25A3, U+25B2-25B4, U+25B6-25B8, U+25BA-25BE, U+25C0-25C2, U+25C4-25C8, U+25CB, U+25CF, U+25EF, U+2600, U+2605-2607, U+263C, U+2661, U+2665, U+26A0, U+2713, U+2717, U+2756, U+2764, U+2780-2789, U+27F5-27FB, U+2B06, U+2B12-2B14, U+2B1C, U+E000, U+E12B-E164, U+1F130-1F14A, U+1F850, U+1F852;
    font-named-instance: 'Regular';
}

/* cyrillic */
@font-face {
    font-family: 'Inter var';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-roman.cyrillic.var-8aa524d3da3b8fd4a03ff2d0d41ea50520113fb2e8ae57c15079dabea44b3529.woff2) format('woff2');
    unicode-range: U+0400-049E, U+04A0-0500, U+052F, U+20B4, U+2116, U+2DFF, U+A69F;
    font-named-instance: 'Regular';
}

/* greek */
@font-face {
    font-family: 'Inter var';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-roman.greek.var-1134a39060691474b0f57b2de5e09977a31a8c06df90960b982314f58a5b4c63.woff2) format('woff2');
    unicode-range: U+0370-0378, U+037A-0380, U+0384-038B, U+038C, U+038E-03A2, U+03A3-03E2, U+03F0-0400, U+1F00-1F16, U+1F18-1F1E, U+1F20-1F46, U+1F48-1F4E, U+1F50-1F58, U+1F59, U+1F5B, U+1F5D, U+1F5F-1F7E, U+1F80-1FB5, U+1FB6-1FC5, U+1FC6-1FD4, U+1FD6-1FDC, U+1FDD-1FF0, U+1FF2-1FF5, U+1FF6-1FFF;
    font-named-instance: 'Regular';
}

/* vietnamese */
@font-face {
    font-family: 'Inter var';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-roman.vietnamese.var-a10e650090dc30250de0db440654c9bf29a843b233ee95a699b008bab0a6d498.woff2) format('woff2');
    unicode-range: U+0102-0104, U+0110-0112, U+0128-012A, U+0168-016A, U+01A0-01A2, U+01AF-01B1, U+1EA0-1EFA, U+20AB;
    font-named-instance: 'Regular';
}

/* latin-ext */
@font-face {
    font-family: 'Inter var';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-roman.latin-ext.var-46bc23ba7e33ea447579cd95b95f34665d7560377065b72f3a77df8bca4b0e5c.woff2) format('woff2');
    unicode-range: U+0100-0149, U+014A-01C4, U+01C5-0250, U+0259, U+1E00-1F00, U+2020, U+20A0-20AC, U+20AD-20C0, U+2113, U+2C7C, U+2C7F, U+A7FF;
    font-named-instance: 'Regular';
}

/* latin */
@font-face {
    font-family: 'Inter var';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(/assets/Inter-roman.latin.var-4b87a3d384ea557b10afa9570b753eda868b12b5e51eea0977ffa6e641998f6a.woff2) format('woff2');
    unicode-range: U+0000-007F, U+00A0-0100, U+0131, U+0152-0154, U+02BB-02BD, U+02C6, U+02DA, U+02DC, U+2000-200C, U+2010-2028, U+202F-2060, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+FEFF;
    font-named-instance: 'Regular';
}
.mapboxgl-ctrl-geocoder {
  max-width: 100% !important;
}

.mapboxgl-popup-tip {
  visibility: hidden !important;
}

.mapboxgl-popup-content {
  padding: 5px 10px 5px !important;
  border-radius: 0.375rem !important;
  border-width: 2px !important;
  border-color: #7e8997 !important;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
  background-color: rgb(253, 253, 253) !important;
  color: #7e8997 !important;
  pointer-events: none !important;
}


/* Thatch for brokers overrides */
.address-fields .mapboxgl-ctrl-geocoder {
  box-shadow: none;
  width: 100%;
}

.address-fields .mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--input {
  appearance: none;
  display: block;
  width: 100%;
  height: 42px;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  border: 1px solid rgb(229 231 235 / 1);
  border-radius: 0.375rem;
  font-size: 1rem;
}

.address-fields .mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--input:focus {
  outline: 0;
  border-color: #9f7aea;
  box-shadow: none;
}

.address-fields.field-with-errors .mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--input {
  border-color: #fc8181;
  color: #742a2a;
  outline: none;
}

.address-fields.field-with-errors .mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--input:focus {
  border-color: #f56565;
  outline: none;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
}

.address-fields.field-with-errors .mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--input::placeholder {
  color: #fc8181;
}

@media (min-width: 640px) {
  .address-fields .mapboxgl-ctrl-geocoder .mapboxgl-ctrl-geocoder--input {
    font-size: 0.875rem;
    line-height: 1.25rem;
    height: 38px;
  }
}
.DropdownMenuContent,
.DropdownMenuSubContent {
  min-width: 150px;
  background-color: white;
  border-radius: 6px;
  padding: 5px;
  box-shadow: 0px 10px 38px -10px rgba(22, 23, 24, 0.35), 0px 10px 20px -15px rgba(22, 23, 24, 0.2);
  animation-duration: 400ms;
  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, opacity;
}

.DropdownMenuContent[data-side='top'],
.DropdownMenuSubContent[data-side='top'] {
  animation-name: slideDownAndFade;
}

.DropdownMenuContent[data-side='right'],
.DropdownMenuSubContent[data-side='right'] {
  animation-name: slideLeftAndFade;
}

.DropdownMenuContent[data-side='bottom'],
.DropdownMenuSubContent[data-side='bottom'] {
  animation-name: slideUpAndFade;
}

.DropdownMenuContent[data-side='left'],
.DropdownMenuSubContent[data-side='left'] {
  animation-name: slideRightAndFade;
}

.DropdownMenuItem,
.DropdownMenuCheckboxItem,
.DropdownMenuRadioItem,
.DropdownMenuSubTrigger {
  font-size: 13px;
  line-height: 1;
  color: var(--violet-11);
  border-radius: 3px;
  display: flex;
  align-items: center;
  height: 25px;
  padding: 0 5px;
  position: relative;
  padding-left: 25px;
  user-select: none;
  outline: none;
  cursor: pointer;
}

.DropdownMenuSubTrigger[data-state='open'] {
  background-color: var(--violet-4);
  color: var(--violet-11);
}

.DropdownMenuItem[data-disabled],
.DropdownMenuCheckboxItem[data-disabled],
.DropdownMenuRadioItem[data-disabled],
.DropdownMenuSubTrigger[data-disabled] {
  color: var(--mauve-8);
  pointer-events: none;
}

.DropdownMenuItem[data-highlighted],
.DropdownMenuCheckboxItem[data-highlighted],
.DropdownMenuRadioItem[data-highlighted],
.DropdownMenuSubTrigger[data-highlighted] {
  background-color: #f1f5f9;
  color: #101828;
}

.DropdownMenuLabel {
  padding-left: 25px;
  font-size: 12px;
  line-height: 25px;
  color: var(--mauve-11);
}

.DropdownMenuSeparator {
  height: 1px;
  background-color: #667085;
  margin: 5px;
}

.DropdownMenuItemIndicator {
  position: absolute;
  left: 0;
  width: 25px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.DropdownMenuArrow {
  fill: white;
}

.IconButton {
  font-family: inherit;
  border-radius: 100%;
  height: 35px;
  width: 35px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--violet-11);
  background-color: white;
  box-shadow: 0 2px 10px #101828;
}

.IconButton:hover {
  background-color: var(--violet-3);
}

.IconButton:focus {
  box-shadow: 0 0 0 2px black;
}

.RightSlot {
  margin-left: auto;
  padding-left: 20px;
  color: var(--mauve-11);
}

[data-highlighted]>.RightSlot {
  color: white;
}

[data-disabled] .RightSlot {
  color: var(--mauve-8);
}

@keyframes slideUpAndFade {
  from {
    opacity: 0;
    transform: translateY(2px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideRightAndFade {
  from {
    opacity: 0;
    transform: translateX(-2px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideDownAndFade {
  from {
    opacity: 0;
    transform: translateY(-2px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideLeftAndFade {
  from {
    opacity: 0;
    transform: translateX(2px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}
.thatchbot-response-animation-container {
  --uib-size: 20px;
  --uib-color: black;
  --uib-speed: .8s;
  --uib-dot-size: calc(var(--uib-size) * 0.24);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--uib-dot-size);
  width: var(--uib-size);
}

.thatchbot-response-animation-dot,
.thatchbot-response-animation-container::before,
.thatchbot-response-animation-container::after {
  content: '';
  display: block;
  height: var(--uib-dot-size);
  width: var(--uib-dot-size);
  border-radius: 50%;
  background-color: var(--uib-color);
  transform: scale(0);
  transition: background-color 0.3s ease;
}

.thatchbot-response-animation-container::before {
  animation: thatchbot-response-animation-pulse var(--uib-speed) ease-in-out calc(var(--uib-speed) * -0.375) infinite;
}

.thatchbot-response-animation-dot {
  animation: thatchbot-response-animation-pulse var(--uib-speed) ease-in-out calc(var(--uib-speed) * -0.25) infinite both;
}

.thatchbot-response-animation-container::after {
  animation: thatchbot-response-animation-pulse var(--uib-speed) ease-in-out calc(var(--uib-speed) * -0.125) infinite;
}

@keyframes thatchbot-response-animation-pulse {

  0%,
  100% {
    transform: scale(0);
  }

  50% {
    transform: scale(1);
  }
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */

body.modal-open {
  overflow: hidden;
}

dialog::backdrop {
  backdrop-filter: blur(2px);
}

.translation_missing {
  color: #f00;
  font-weight: bold;
}

.virtual-card-component iframe {
  height: 1.25rem;
  width: 100%;
}

#copy-number-button iframe {
  width: 1.25rem;
}

.flip-card {
  background-color: transparent;
  perspective: 1000px;
}

.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.3s;
  transform-style: preserve-3d;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

.flip-card-front,
.flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.ease-in-out-expo {
  transition-timing-function: cubic-bezier(0.87, 0, 0.13, 1);
}

.animation-ease-in-out-expo {
  animation-timing-function: cubic-bezier(0.87, 0, 0.13, 1);
}

/* #AirDatepicker color scheme */
.air-datepicker-cell.-selected-,
.air-datepicker-cell.-selected-.-current- {
  background: #6941C6 !important;
  color: #FFFFFF !important;
}

.air-datepicker-cell.-selected-.-focus- {
  background: #6941C6 !important;
}

.air-datepicker-button,
.air-datepicker-cell.-current-,
.air-datepicker-cell.-current-.-in-range-,
.air-datepicker-body--day-name {
  color: #6941C6 !important;
}

.air-datepicker-button,
.air-datepicker-cell.-current-,
.air-datepicker-cell.-current-.-in-range-,
.air-datepicker-body--day-name {
  color: #6941C6 !important;
}

.air-datepicker-body--day-name.-clickable-:hover {
  color: #6941C6 !important;
}

/* Google Sign-In button theme */
.gsi-material-button {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -webkit-appearance: none;
  background-color: WHITE;
  background-image: none;
  border: 1px solid #747775;
  -webkit-border-radius: 0.5rem;
  border-radius: 0.5rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #1f1f1f;
  cursor: pointer;
  font-family: 'Roboto', arial, sans-serif;
  font-size: 14px;
  height: 40px;
  letter-spacing: 0.25px;
  outline: none;
  overflow: hidden;
  padding: 0 12px;
  position: relative;
  text-align: center;
  -webkit-transition: background-color .218s, border-color .218s, box-shadow .218s;
  transition: background-color .218s, border-color .218s, box-shadow .218s;
  vertical-align: middle;
  white-space: nowrap;
  width: auto;
  max-width: 400px;
  min-width: min-content;
}

.gsi-material-button .gsi-material-button-icon {
  height: 20px;
  margin-right: 12px;
  min-width: 20px;
  width: 20px;
}

.gsi-material-button .gsi-material-button-content-wrapper {
  -webkit-align-items: center;
  align-items: center;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  height: 100%;
  justify-content: center;
  position: relative;
  width: 100%;
}

.gsi-material-button .gsi-material-button-contents {
  -webkit-flex-grow: 0;
  flex-grow: 0;
  font-family: 'Roboto', arial, sans-serif;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}

.gsi-material-button .gsi-material-button-state {
  -webkit-transition: opacity .218s;
  transition: opacity .218s;
  bottom: 0;
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.gsi-material-button:disabled {
  cursor: default;
  background-color: #ffffff61;
  border-color: #1f1f1f1f;
}

.gsi-material-button:disabled .gsi-material-button-contents {
  opacity: 38%;
}

.gsi-material-button:disabled .gsi-material-button-icon {
  opacity: 38%;
}

.gsi-material-button:not(:disabled):active .gsi-material-button-state,
.gsi-material-button:not(:disabled):focus .gsi-material-button-state {
  background-color: #303030;
  opacity: 12%;
}

.gsi-material-button:not(:disabled):hover {
  -webkit-box-shadow: 0 1px 1px 0 rgba(60, 64, 67, 0.2), 0 1px 2px 1px rgba(60, 64, 67, 0.1);
  box-shadow: 0 1px 1px 0 rgba(60, 64, 67, 0.2), 0 1px 2px 1px rgba(60, 64, 67, 0.1);
}

.gsi-material-button:not(:disabled):hover .gsi-material-button-state {
  background-color: #303030;
  opacity: 5%;
  /* slightly toned down */
}

@layer base {
  :root {
    --chart-1: 12 76% 61%;
    --chart-2: 173 58% 39%;
    --chart-3: 197 37% 24%;
    --chart-4: 43 74% 66%;
    --chart-5: 27 87% 67%;
  }

  .dark {
    --chart-1: 220 70% 50%;
    --chart-2: 160 60% 45%;
    --chart-3: 30 80% 55%;
    --chart-4: 280 65% 60%;
    --chart-5: 340 75% 55%;
  }
}