:root {
  --blue-accent: #176BEA;
  --blue-dark: #214CA6;
  --gray-3: #D6D6D8;
}

.action-link {
  font-weight: 500;
  transition: color 150ms;
  color: var(--blue-accent);
}

.action-link path {
  transition: fill 150ms;
  fill: var(--blue-accent);
}

.action-link svg {
  display: inline-block;
  width: 1em;
  height: 1em;
}

.action-link:hover {
  color: var(--blue-dark);
}

.action-link:hover path {
  fill: var(--blue-dark);

}

.action-link[aria-disabled="true"] {
  pointer-events: none;
  color: var(--gray-3);
}

.action-link[aria-disabled="true"] path {
  fill: var(--gray-3);
}
:root {
  /* TODO: Centralize variables in a single document */

  --gray-250: #98979E;
  --ai-login-linear-gradient: linear-gradient(90deg, #32303E 0%, #847FA4 230.7%);
  --background-color-progress-bar-gradient-bg: #43428C;
  --background-color-progress-bar-gradient-highlight: #D5D5FF;
}

.theme-lawinsider {
  --background-color-progress-bar-gradient-bg: #98979E;
  --background-color-progress-bar-gradient-highlight: #EBEAEC;
}

.bg-ai-gradient {
  background: var(--ai-linear-gradient);
  transition: color 300ms, background 300ms;
  cursor: pointer;
}

.simple-ai-primary-btn:disabled {
  background: var(--gray-3);
  color: var(--gray-250);
  cursor: auto;
}

.ai-login-bg {
  background: url(/assets/waves-pattern-3331c0ed6a1cff6a25154c71716247276c9bc42b9efd46d3637d35aceefb070a.svg), var(--ai-login-linear-gradient), no-repeat, center;
  background-size: cover;
}

.ai-loader:first-child {
  background: linear-gradient(
    90deg,
    var(--loader-highlight-color) 25%,
    var(--loader-background-color) 50%,
    var(--loader-highlight-color) 75%
  );
}

.ai-loader:last-child {
  background: linear-gradient(
    90deg,
    var(--loader-background-color) 25%,
    var(--loader-highlight-color) 50%,
    var(--loader-background-color) 75%
  );
}

.ai-loader:first-child,
.ai-loader:last-child {
  background-size: 200% 100%;
  animation: loading 2000ms infinite ease-in-out;
}

.loading-icon:first-child {
  background: linear-gradient(
    90deg,
    var(--background-color-progress-bar-gradient-bg) 0%,
    var(--background-color-progress-bar-gradient-highlight) 100%
  );
}

.loading-icon:first-child {
  background-size: 200% 100%;
  animation: loading 2000ms infinite ease-in-out;
}

.loading-icon-chat-first {
  background: linear-gradient(
    90deg,
    var(--background-color-progress-bar-gradient-bg) 0%,
    var(--background-color-progress-bar-gradient-highlight) 100%
  );
  background-size: 200% 100%;
  animation: loading-chat 3000ms infinite ease-in-out;
}

.loading-icon-chat-second {
  background: linear-gradient(
    90deg,
    var(--background-color-progress-bar-gradient-highlight) 0%,
    var(--background-color-progress-bar-gradient-bg) 100%
  );
  background-size: 200% 100%;
  animation: loading-chat 3000ms infinite ease-in-out;
  animation-delay: 300ms;
}

.ai-card {
  animation: slide-in 500ms ease-in-out;
}

@keyframes loading-chat {
  0% { background-position: 0% 0; }
  100% { background-position: -200% 0; }
}

@keyframes loading {
  0% {
      background-position: 200% 0;
  }

  100% {
      background-position: -200% 0;
  }
}

@keyframes slide-in {
  0% {
      opacity: 0;
      transform: translateX(-200%);
  }

  80% {
    opacity: 0.1;
  }

  100% {
      opacity: 1;
      transform: translateX(0);
  }
}
@tailwind base;
@tailwind components;
@tailwind utilities;

/* Import SimpleAI styles */
@import './simpleai/index.css';

/* Utilities */
@layer utilities {
  .centered-flex {
    @apply flex justify-center items-center;
  }

  .centered-flex-col {
    @apply flex flex-col justify-center items-center;
  }

  .centered-absolute {
    @apply absolute inset-0 m-auto;
  }

  .flex-between {
    @apply flex justify-between items-center;
  }

  .main-container-padding {
    @apply px-5 py-7 lg:px-14 md:pt-12;
  }

  .main-container-padding-offset {
    @apply -mx-5 -my-7 lg:-mx-14 md:-mt-12;
  }

  .focusable {
    @apply focus:ring-1 focus:ring-blue-accent focus:shadow-[0_0_6px_0_rgb(23,107,234)];
  }

  .ai-focusable {
    @apply focus:ring-1 focus:border-purple-ai focus:shadow-[0_0_6px_0_#7978FF]
  }

  .positioned-centered {
    @apply top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2;
  }

  .removed {
    display: none; /* Same as `hidden`, but this class shouldn't be toggled */
  }

  .unavailable { /* Use this as a second `hidden` in cases where two stimulus hide the same element  */
    display: none;
  }

  .relative-focus { /* For elements that contain focusable-positioned children  */
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  .horizontal-bleed::after { /* For new markup */
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background-color: currentcolor;
    box-shadow: 0 0 0 100vmax currentcolor;
    clip-path: inset(0 -100vmax 0);
  }

  .full-bleed-white { /* For legacy markup */
    background-color: white;
    box-shadow: 0 0 0 100vmax white;
    clip-path: inset(0 -100vmax -100vmax);
  }

  /* See: https://css-tricks.com/the-cleanest-trick-for-autogrowing-textareas */
  .autogrow {
    display: grid;
    overflow: auto;

    & > *,
    &::after {
      grid-area: 1 / 1 / 2 / 2;
      word-break: break-word;
    }

    &::after {
      content: attr(data-replicated-value) " ";
      white-space: pre-wrap;
      visibility: hidden;
    }
  }

  .animate-sweep {
    background: linear-gradient(
      270deg,
      rgba(226, 232, 240, 0) 0%,
      rgba(226, 232, 240, 0.8) 50%,
      rgba(226, 232, 240, 0) 100%
    );
    background-size: 200% 100%;
    animation: sweep 1.5s infinite;
  }

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

/* Components */
@layer components {
  .primary-btn {
    @apply py-2 px-6 rounded-full text-center font-semibold transition-colors bg-yellow-1
    cursor-pointer sm:px-10 hover:bg-yellow-2 disabled:bg-gray-3 disabled:text-gray-250 disabled:cursor-auto;
  }

  .secondary-btn {
    @apply py-2 px-6 border-2 border-gray-1 rounded-full text-center font-semibold bg-inherit sm:px-10;
  }

  .simple-ai-primary-btn {
    @apply text-center font-semibold text-white cursor-pointer transition
    py-skin-button-primary-height px-skin-button-primary-width text-skin-button-primary rounded-skin-button-primary
    bg-gradient-to-r from-skin-button-primary-from to-skin-button-primary-to hover:from-skin-button-primary-hover-from hover:via-skin-button-primary-hover-via hover:to-skin-button-primary-hover-to;
  }

  .simple-ai-secondary-btn {
    @apply text-center font-semibold text-white cursor-pointer transition
    py-skin-button-secondary-height px-skin-button-secondary-width text-skin-button-secondary rounded-skin-button-secondary
    border-skin-color-button-secondary border-skin-button-secondary bg-skin-button-secondary hover:bg-skin-button-secondary-hover;
  }

  .simple-ai-tertiary-btn {
    @apply flex items-center px-1 text-center font-semibold text-white cursor-pointer
    text-skin-button-tertiary rounded-skin-button-tertiary transition
    bg-skin-button-tertiary hover:bg-skin-button-tertiary-hover;
  }

  .simple-ai-small-primary-btn {
    @apply py-1.5 px-3 text-xs font-semibold text-center h-full cursor-pointer transition
    rounded-skin-button-small text-skin-button-small-primary bg-skin-button-small-primary
    hover:text-skin-button-small-primary-hover hover:bg-skin-button-small-primary-hover
    disabled:text-skin-button-small-primary-disabled disabled:bg-skin-button-small-primary-disabled disabled:cursor-not-allowed
  }

  .simple-ai-small-secondary-btn {
    @apply py-[5px] px-3 text-xs font-semibold text-center h-full cursor-pointer transition
    rounded-skin-button-small border-skin-button-small-secondary border-skin-color-button-small-secondary text-skin-button-small-secondary bg-skin-button-small-secondary
    hover:text-skin-button-small-secondary-hover hover:bg-skin-button-small-secondary-hover hover:border-skin-color-button-small-secondary-hover
    disabled:text-skin-button-small-secondary-disabled disabled:bg-skin-button-small-secondary-disabled disabled:border-skin-color-button-small-secondary-disabled disabled:cursor-not-allowed
  }

  .simple-ai-highlight-btn {
    @apply text-center font-semibold text-white cursor-pointer
    bg-skin-button-highlight hover:bg-skin-button-highlight-hover;
  }

  .primary-btn-black {
    @apply py-2 px-5 rounded-full text-center font-semibold bg-gray-1 text-white cursor-pointer sm:px-10
    transition-colors duration-300 disabled:bg-gray-250 disabled:text-gray-3;
  }

  .primary-btn-outline {
    @apply px-2 py-1 border-2 border-yellow-1 rounded-full font-semibold text-center hover:bg-yellow-4;
  }

  .sidebar-menu {
    @apply flex flex-col w-sidebar-width pt-5 px-4 whitespace-nowrap transition-[width] duration-300 lg:pt-9;
  }

  .default-avatar {
    @apply rounded-full text-xs font-bold uppercase tracking-widest bg-gray-250 text-white cursor-default;
  }

  .primary-tag {
    @apply py-2.5 px-4 rounded-full text-sm font-medium text-gray-2 bg-gray-4;
  }

  .secondary-tag {
    @apply py-1 px-2 rounded-lg font-light text-gray-250 bg-gray-4;
  }

  .primary-input {
    @apply w-full py-2 px-4 rounded-skin-input border-skin-input border-skin-color-input font-normal disabled:bg-gray-5;
  }

  .ai-primary-input {
    @apply w-full py-2.5 px-4 text-sm rounded-skin-input border-skin-input border-skin-color-input transition-all
    hover:border-skin-color-input-hover focus:border-skin-color-input-focus focus:shadow-skin-input-focus disabled:bg-skin-input-disabled disabled:border-skin-color-input-disabled
    placeholder:text-skin-input-placeholder disabled:text-skin-input-disabled disabled:placeholder:text-skin-input-placeholder-disabled;
  }

  .selection-input {
    @apply border-gray-3 text-gray-dark focus:ring-0 focus:ring-offset-0 disabled:text-gray-3;
  }

  .modal {
    @apply py-7 px-6 rounded-skin-modal bg-white overscroll-contain overflow-scroll max-h-[80vh];
  }

  .repository-columns-modal {
    @apply overflow-visible;
  }

  .scrollable-modal {
    @apply h-[90vh] max-h-[40rem] overflow-y-auto;
  }

  .login-form-outer-wrapper {
    @apply flex flex-col items-center w-[min(90%,28.125rem)] pt-7 px-7 rounded-xl bg-white xs:pt-10 xs:px-11;
  }

  .user-auth-form-title {
    @apply flex flex-col items-center gap-y-2 mb-6 text-4xl font-semibold text-center;
  }

  .tooltip, .tooltip-bottom {
    @apply w-0 h-0 px-2.5 py-1 rounded-lg text-sm text-center leading-6 whitespace-nowrap font-light bg-gray-1 text-white opacity-0
    overflow-hidden shadow-[0,4px,20px,0,rgba(255,255,255,0.20)] peer-hover:w-fit peer-hover:h-auto peer-hover:opacity-100 peer-hover:overflow-visible;
  }

  .toggle {
    @apply relative w-9 h-[18px] rounded-full bg-gray-250 transition-colors hover:bg-gray-600 peer-checked:bg-blue-600 peer-disabled:hover:bg-gray-400 peer-disabled:cursor-not-allowed;
  }

  .toggle::after {
    content: '';
    @apply absolute top-[3px] left-[3px] w-3 h-3 bg-white rounded-full transition-all peer-checked:translate-x-[18px];
  }

  .filter-pill {
    @apply block px-3 py-1 text-sm text-center text-gray-250 rounded-full;
  }

  .interactive-link {
    @apply flex items-center gap-x-2 p-1 rounded-md text-blue-accent transition-colors [&_path]:fill-blue-accent hover:bg-blue-alice;
  }

  .interactive-link-ai {
    @apply flex items-center gap-x-2 p-1 rounded-skin-button-tertiary text-skin-button-tertiary transition-colors [&_path]:fill-skin-accent hover:bg-skin-button-tertiary-hover hover:text-skin-button-tertiary-hover;
  }

  .interactive-control {
    @apply p-1.5 rounded-md transition-colors [&_path]:fill-gray-2 hover:bg-gray-4;
  }

  .down-arrow-opened {
    @apply -rotate-180 [&>path]:fill-yellow-1;
  }

  .selectable-card_card {
    @apply flex flex-col items-start gap-y-2 py-6 px-4 border border-gray-3 rounded-xl transition-colors bg-white;
  }

  .default-options-open {
    @apply grid-cols-[1fr_auto];
  }

  .link-underlined {
    @apply whitespace-nowrap text-blue-accent underline transition-colors hover:text-blue-500;
  }

  .link {
    @apply whitespace-nowrap text-blue-accent transition-colors hover:text-blue-500;
  }

  .simple-ai-redlining {
    @apply [&>del]:text-red-error [&>del]:line-through [&>ins]:text-blue-accent [&>ins]:underline;
  }
}

.breaker::before,
.breaker::after {
  content: '';
  flex-grow: 1;
  border-top: 1px solid #D6D6D8;
}

.tooltip::after {
  content: '';
  position: absolute;
  inset: auto 0 0;
  display: inline-block;
  width: 0.625rem;
  height: 0.625rem;
  margin: 0 auto;
  transform: rotate(45deg) translateY(50%);
  background-color: #32303E;
}

.tooltip-bottom::after {
  content: '';
  position: absolute;
  inset: 0;
  display: inline-block;
  width: 0.625rem;
  height: 0.625rem;
  margin: 0 auto;
  transform: rotate(45deg) translateY(-50%);
  background-color: #32303E;
}

.no-scrollbar {
  scrollbar-width: none;
}

.no-scrollbar::-webkit-scrollbar {
  width: 0;
}

.sortable-heading:first-child > div {
  width: 18.75rem;
}

.repository .sortable-heading:first-child > div {
  width: auto;
  min-width: max-content;
  max-width: 18.75rem;
}

.playbook-items-table .sortable-heading:first-child > div {
  width: 2rem;
}

.ai_chat_message {
  /* Headings */
  h1 {
    @apply text-2xl font-semibold mb-6 mt-8 first:mt-0;
  }
  h2 {
    @apply text-xl font-semibold mb-4 mt-8 first:mt-0;
  }
  h3 {
    @apply text-lg font-semibold mb-4 mt-6 first:mt-0;
  }
  h4 {
    @apply text-base font-semibold mb-4 mt-6 first:mt-0;
  }

  /* Paragraphs */
  p {
    @apply mb-4 leading-relaxed first:mt-0 last:mb-0;
  }

  /* Lists */
  ul {
    @apply list-disc pl-8 mb-4 last:mb-0;
  }

  ol {
    @apply list-decimal pl-8 mb-4 last:mb-0;
  }

  li {
    @apply mb-2 last:mb-0;
  }

  /* Code blocks */
  pre {
    @apply bg-gray-100 rounded-lg p-4 mb-4 overflow-x-auto whitespace-pre-wrap break-words;
  }

  code {
    @apply bg-gray-100 rounded px-1 py-0.5 text-sm font-mono whitespace-normal break-words;
  }

  /* Ensure code inside pre blocks wraps properly */
  pre > code {
    @apply whitespace-pre-wrap break-words w-full block;
  }

  /* Blockquotes */
  blockquote {
    @apply border-l-4 border-gray-300 pl-4 italic my-4;
  }

  /* Links */
  a {
    @apply text-blue-600 hover:text-blue-800 underline;
  }

  /* Tables */
  table {
    @apply block overflow-scroll whitespace-nowrap max-w-[min(95dvw,1200px)] border-collapse mb-4;
  }

  th {
    @apply bg-gray-100 border px-4 py-2 text-left;
  }

  td {
    @apply border px-4 py-2;
  }

  /* Strong and emphasis */
  strong {
    @apply font-bold;
  }

  em {
    @apply italic;
  }

  /* Thematic break */
  hr {
    @apply border-t border-gray-300 my-6;
  }
}

.repository-chat-message {
  /* Headings */
  h1 {
    @apply text-2xl font-semibold mb-6 mt-8 first:mt-0;
  }
  h2 {
    @apply text-xl font-semibold mb-4 mt-8 first:mt-0;
  }
  h3 {
    @apply text-lg font-semibold mb-4 mt-6 first:mt-0;
  }
  h4 {
    @apply text-base font-semibold mb-4 mt-6 first:mt-0;
  }

  /* Paragraphs */
  p {
    @apply mb-4 leading-relaxed first:mt-0 last:mb-0;
  }

  /* Lists */
  ul {
    @apply list-disc pl-8 mb-4 last:mb-0;
  }

  ol {
    @apply list-decimal pl-8 mb-4 last:mb-0;
  }

  li {
    @apply mb-2 last:mb-0;
  }

  /* Code blocks */
  pre {
    @apply bg-gray-100 rounded-lg p-4 mb-4 overflow-x-auto whitespace-pre-wrap break-words;
  }

  code {
    @apply bg-gray-100 rounded px-1 py-0.5 text-sm font-mono whitespace-normal break-words;
  }

  /* Ensure code inside pre blocks wraps properly */
  pre > code {
    @apply whitespace-pre-wrap break-words w-full block;
  }

  /* Blockquotes */
  blockquote {
    @apply border-l-4 border-gray-300 pl-4 italic my-4;
  }

  /* Links */
  a {
    @apply text-blue-600 hover:text-blue-800 underline;
  }

  /* Tables */
  table {
    @apply block overflow-auto whitespace-nowrap max-w-[min(95dvw,1400px)] border-collapse mb-4;
  }

  th {
    @apply bg-gray-100 border px-4 py-2 text-left;
  }

  td {
    @apply border bg-gray-5 px-4 py-2;
  }

  /* Strong and emphasis */
  strong {
    @apply font-bold;
  }

  em {
    @apply italic;
  }

  /* Thematic break */
  hr {
    @apply border-t border-gray-300 my-6;
  }
}

/* Animations */
.animate__animated.animate__slideInLeft,
.animate__animated.animate__slideOutLeft {
  --animate-duration: 200ms;
}

/* Buttons and Icons */
input[type='checkbox'][data-button='toggle']:disabled ~ span.toggle-bg{
  background-color: #EDECEE;
}

input[type='checkbox'][data-button='toggle']:checked ~ span.toggle-bg > span.toggle-slider{
  right: 4px;
}

a.active svg:first-child path {
  fill: #FFDB1D;
}

/* Custom responsive */
@media (max-width: 1023px) {
  .only-desktop {
    display: none;
  }
}

@media (min-width: 1024px) {
  aside.steps {
    position: fixed;
    inset: 0 0 0 auto;
    width: min(20%, 260px);
    padding: 8.18em 0 0 2.5em;
    background-color: white;
  }
}

@media (max-height: 400px) {
  .modal {
    height: 90vh;
  }
}

/* Pagy */
.pagy-nav.pagination {
  @apply inline-flex -space-x-px rounded-md shadow-sm;
}

/* All page elements */
.page {
  @apply inline-flex items-center justify-center;
}

/* Links in all pages */
.page a {
  @apply relative inline-flex items-center justify-center px-4 py-2 text-base font-normal text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0;
}

/* Gap styling */
.page.gap {
  @apply relative inline-flex items-center px-4 py-2 text-base font-normal text-gray-700 ring-1 ring-inset ring-gray-300;
}

/* Active page - target both the span and the content directly */
span.page.active {
  @apply relative z-10 inline-flex items-center justify-center bg-blue-accent px-4 py-2 text-base font-normal text-white ring-1 ring-inset ring-blue-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-accent;
}

/* If the active page has a link inside, style it too */
.page.active a {
  @apply bg-transparent ring-0 text-white hover:bg-transparent;
}

/* Prev/Next buttons */
.page.prev a, .page.next a {
  @apply px-2 py-2 text-gray-400;
}

.page.prev.disabled, .page.next.disabled {
  @apply relative inline-flex items-center px-2 py-2 text-gray-300 ring-1 ring-inset ring-gray-300 cursor-not-allowed;
}

/* Round the corners */
.page.prev a, .page.prev.disabled {
  @apply rounded-l-md;
}

.page.next a, .page.next.disabled {
  @apply rounded-r-md;
}

.page.prev a, .page.prev.disabled,
.page.next a, .page.next.disabled {
  font-size: 0;
}

.page.prev a::before, .page.prev.disabled::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background-color: #5B5965;
  mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.99279 14.0026L5.0769 8.50387C4.94259 8.33113 4.88886 8.1584 4.88886 8.01445C4.88886 7.84171 4.94259 7.66898 5.05004 7.52503L9.99279 1.99749C10.2346 1.7096 10.6644 1.7096 10.9061 1.9687C11.1748 2.22781 11.1748 2.68843 10.933 2.94754L6.42004 8.01445L10.933 13.0526C11.1747 13.3117 11.1747 13.7723 10.9061 14.0314C10.6644 14.2905 10.2346 14.2905 9.99279 14.0026Z' fill='%235B5965'/%3E%3C/svg%3E") no-repeat center;
}

.page.next a::before, .page.next.disabled::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background-color: #5B5965;
  mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.00721 1.9974L10.9231 7.49613C11.0574 7.66887 11.1111 7.8416 11.1111 7.98555C11.1111 8.15829 11.0574 8.33102 10.95 8.47497L6.00721 14.0025C5.76539 14.2904 5.33561 14.2904 5.09386 14.0313C4.82524 13.7722 4.82524 13.3116 5.06699 13.0525L9.57996 7.98555L5.06699 2.9474C4.82526 2.6883 4.82526 2.2277 5.09386 1.9686C5.33561 1.7095 5.76539 1.7095 6.00721 1.9974Z' fill='%235B5965'/%3E%3C/svg%3E") no-repeat center;
}

.highcharts-x-axis, .highcharts-y-axis {
  font-size: 20px;
}

@media (max-width: 480px) {
  .highcharts-x-axis, .highcharts-y-axis {
    font-size: 12px;
  }
}

.item-hover:has(> section > .results-section > article:only-child) {
  @apply hover:bg-skin-card-hover cursor-pointer;
}

.nested-item-hover:has(+ *),
.nested-item-hover:not(:first-child) {
  @apply hover:bg-skin-card-hover cursor-pointer;
}

/* Repository table alternating row colors */
.sortable-table tbody tr:nth-child(even) {
  background-color: #F9F9F9;
}

.sortable-table tbody tr:nth-child(odd) {
  background-color: white;
}

/* Add explicit borders to all table cells */
.repository .sortable-table {
  border-collapse: separate;
  border-spacing: 0;
}

/* Add bottom borders to all cells */
.repository .sortable-table td {
  border-bottom: 1px solid theme('colors.gray.3');
}

/* Add top border only to first row */
.repository .sortable-table tbody tr:first-child td {
  border-top: 1px solid theme('colors.gray.3');
}

/* Fix for sticky columns */
.repository .sortable-table tbody tr td:first-child,
.repository .sortable-table tbody tr td.action-cell {
  position: sticky !important;
  /* No need to repeat border styles as they inherit from the td selector above */
}

/* Ensure first column sticks to left */
.repository .sortable-table tbody tr td:first-child {
  left: 0;
}

/* Ensure action column sticks to right */
.repository .sortable-table tbody tr td.action-cell {
  right: 0;
  z-index: 10;
}

/* Background colors for sticky cells matching row colors */
.repository .sortable-table tbody tr:nth-child(even) td:first-child,
.repository .sortable-table tbody tr:nth-child(even) td.action-cell {
  background-color: #F9F9F9;
}

.repository .sortable-table tbody tr:nth-child(odd) td:first-child,
.repository .sortable-table tbody tr:nth-child(odd) td.action-cell {
  background-color: white;
}

/* Ensure hover works on all cells including sticky ones */
.repository .sortable-table tbody tr:hover td {
  background-color: theme('colors.gray.5');
}

/* Explicitly set hover for sticky columns to override their background */
.repository .sortable-table tbody tr:hover td:first-child,
.repository .sortable-table tbody tr:hover td.action-cell {
  background-color: theme('colors.gray.5') !important;
}

/* Dropdown container background in sticky cells */
.sortable-table tbody tr:nth-child(even) td.sticky .dropdown-container {
  background-color: #F9F9F9 !important;
}

.sortable-table tbody tr:nth-child(odd) td.sticky .dropdown-container {
  background-color: white !important;
}

.sortable-table tbody tr:hover td.sticky .dropdown-container {
  background-color: theme('colors.gray.5') !important;
}

.sortable-table tbody tr:nth-child(even) .action-cell {
  background-color: #F9F9F9;
}

.sortable-table tbody tr:nth-child(odd) .action-cell {
  background-color: white;
}

/* Z-index management for proper layering */
.sortable-table,
.requests-table {
  /* Set a base z-index for tables so dropdowns can appear above them */
  z-index: 1;
}

/* Ensure sticky elements in tables have controlled z-index values */
.sortable-table thead,
.requests-table thead {
  z-index: 10;
}

/* Ensure dropdowns and modals appear above tables */
.dropdown-menu {
  z-index: 100 !important;
}

/* Preserve hover behavior */
.sortable-table tbody tr:hover .action-cell {
  background-color: theme('colors.gray.5');
}

/* Headway Widget Badge - Prevent jumping animation */
/* Following official Headway documentation: https://docs.headwayapp.co/widget */
#HW_badge.HW_animated {
  animation: none !important;
  transform: none !important;
}

/* Ensure the parent link has relative positioning for proper badge placement */
.headway-widget-link {
  position: relative !important;
  display: inline-block !important;
}
button[data-control="destroy"],
a[data-control="destroy"] {
  display: none;
}

div[data-model-name="User"] button[data-control="destroy"],
div[data-model-name="LegalRequest"] button[data-control="destroy"],
div[data-model-name="RepositoryDocument"] button[data-control="destroy"],
div[data-model-name="IdpConfig"] a[data-control="destroy"],
div[data-model-name="Webhook"] a[data-control="destroy"],
div[data-model-name="WebhookEvent"] a[data-control="destroy"],
div[data-model-name="WebhookEvent"] button[data-control="destroy"] {
  display: block;
}

div[data-model-name="User"] a[data-control="destroy"],
div[data-model-name="Playbook"] a[data-control="destroy"],
div[data-model-name="LegalRequest"] a[data-control="destroy"],
div[data-model-name="AiPrompt"] a[data-control="destroy"],
div[data-model-name="AuthorizedEmailDomain"] a[data-control="destroy"],
div[data-model-name="RepositoryDocument"] a[data-control="destroy"] {
  display: block;

  svg {
    display: none;
  }
}

.CodeMirror-sizer {
  width: 100%;
  white-space: pre-wrap;
  word-wrap: break-word;
}
/* Variables */
:root {
  --mobile-header-height: 3.125rem; /* 50px */
  --container-max-width: 1536px;
}

/* Custom fonts */
@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-Thin-cd9fba7e3f1a33175fabf903f9a59d31ae7d20340f94082624cfe242d892ddfa.otf) format('opentype');
  font-style: normal;
  font-weight: 100;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-ThinItalic-0877ff579827d5d24588ad36169d5ea8b53eda0295471654f6adbdd7963e0d54.otf) format('opentype');
  font-style: italic;
  font-weight: 100;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-ExtraLight-f2785ffef379c791117436f853aa2d591c054c30f55db789e7aad0428c2457a5.otf) format('opentype');
  font-style: normal;
  font-weight: 200;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-ExtraLightItalic-e40b3cebd8747b46e78c04c4f8494976effc23fcca40760d4f3e2c3d00f4675e.otf) format('opentype');
  font-style: italic;
  font-weight: 200;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-Light-2bbc6d79c8253c1a1e7197dc384568082dcb7015dd33a7955de78df3196845c2.otf) format('opentype');
  font-style: normal;
  font-weight: 300;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-LightItalic-206d984c2c1ef12b5296c713785e97525144640beb0a0e256acda705422ce986.otf) format('opentype');
  font-style: italic;
  font-weight: 300;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-Regular-499e4f4b0b46578297555be306415bd569d292117d44353a2f835421fca48d43.otf) format('opentype');
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-RegularItalic-a35de32d744b87bf94a52eab7baf94ce81ac6dba7866af818f3a4bc74561bfd2.otf) format('opentype');
  font-style: italic;
  font-weight: 400;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-Medium-608b20327a932c2da32ba71fc1957962d482f36a2043d0aab17805db1aaca1d8.otf) format('opentype');
  font-style: normal;
  font-weight: 500;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-MediumItalic-fc9d7969c3fd98de184e42762fd18fb3ef0372ed3711fa375d6406745ae56b4a.otf) format('opentype');
  font-style: italic;
  font-weight: 500;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-SemiBold-ef3debc4225a8188bb3c083f33cd0b8b3992ee1de75d8d5411fb596350c6e561.otf) format('opentype');
  font-style: normal;
  font-weight: 600;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-SemiBoldItalic-2be5d6fb6fa5ea3f1bc605761f51875919f4d9006ad1c619eb7e98c9be005372.otf) format('opentype');
  font-style: italic;
  font-weight: 600;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-Bold-663b24269879a35c18433978eff1e3deae80eb5764673a7644605a4bcd640143.otf) format('opentype');
  font-style: normal;
  font-weight: 700;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-BoldItalic-3f7c7fc926a537aef135a5eac401d573f649617df0ad74c8bc2232bca62eb635.otf) format('opentype');
  font-style: italic;
  font-weight: 700;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-ExtraBold-d2f46f6a10be3ebfdb6cb4c8d0e54d83508c4f42545303227f70b327a4df01bc.otf) format('opentype');
  font-style: normal;
  font-weight: 800;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-ExtraBoldItalic-e3f4f9f9b2469e854a8eb792929a0c9a3b520b403666da612d1cb8f481c1d82b.otf) format('opentype');
  font-style: italic;
  font-weight: 800;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-Black-a67ca27a4681ed7bbf94c543bc29195cd41a8d2ab9d69a0dd6cbcb1abd46b134.otf) format('opentype');
  font-style: normal;
  font-weight: 900;
}

@font-face {
  font-family: 'Metropolis';
  src: url(/assets/Metropolis-BlackItalic-8d2cfed2c319bc60a3c76cf8a261530a89a3930a30861353496fa5c8364d8c5b.otf) format('opentype');
  font-style: italic;
  font-weight: 900;
}

/* Flexbox */
.flex svg {
  flex-shrink: 0;
}
.choices{
  border-radius: .5rem;
}

.choices.is-disabled .primary-input {
  background-color: #f9f9f9;
}

.choices__inner{
  background-color: white;
  border: 1px solid #D6D6D8;
  border-radius: .5rem;
}

.choices__list{
  border-bottom-left-radius: .5rem;
  border-bottom-right-radius: .5rem;
}

.tags-container {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.tags-container > div.choices__item {
  padding: 8px 16px !important;
  border: 0 !important;
  border-radius: 100px !important;
  margin: 0 !important;
  font-weight: 500 !important;
  background-color: #EBEAEC !important;
  color: #5B5965 !important;
}

.tags-container > div.choices__item > button {
  border-left: 1px solid #5B5965 !important;
  background-image: url(/assets/x-mark-black-5f261429973d0544c26f896bb365b81d1f24ec55196e07e22862cfea7fd47ece.svg) !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
}

div.primary-input.single-select .choices__item--selectable {
  padding-top: 0.25em;
  padding-bottom: 0.25em;
}

div.primary-input.single-select .choices__item--selectable:not(.choices__placeholder) {
  width: fit-content;
  padding-left: 0.75em;
  padding-right: 0.75em;
  border-radius: 100px;
  color: #5B5965;
  background-color: #EDECEE;
}

/* Workflow Multiple Signers */
#workflow-multiple-signers-select .choices,
#workflow-multiple-signers-select .choices__inner,
#signed-agreement-recipients-select .choices,
#signed-agreement-recipients-select .choices__inner {
  padding: 0;
  border: none;
  border-radius: 0;
  background-color: #F9F9F9;
  overflow: visible;
}

#workflow-multiple-signers-select .choices__list.choices__list--multiple,
#signed-agreement-recipients-select .choices__list.choices__list--multiple {
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  gap: 0.625em 0.5em;
  padding: 1em 0;
  margin-bottom: 1rem;
  border-bottom: 1px solid #D6D6D8;
  border-radius: 0;
}

#workflow-multiple-signers-select .choices__list.choices__list--multiple .choices__item,
#signed-agreement-recipients-select .choices__list.choices__list--multiple .choices__item,
.multiple-choice .choices__list--multiple .choices__item {
  padding: 0.25em 0.75em;
  border: 1px solid #D6D6D8;
  border-radius: 0.5rem;
  margin: 0;
  font-size: 1rem;
  font-weight: 400;
  background-color: white;
  color: #5B5965;
}

#workflow-multiple-signers-select .choices__button,
#signed-agreement-recipients-select .choices__button {
  width: 1.25rem;
  height: 1.25rem;
  padding: 0;
  border: none;
  background-image: url(/assets/x-mark-black-5f261429973d0544c26f896bb365b81d1f24ec55196e07e22862cfea7fd47ece.svg);
  background-size: cover;
}

#workflow-multiple-signers-select .choices__input.choices__input--cloned,
#signed-agreement-recipients-select .choices__input.choices__input--cloned {
  width: 100% !important;
  border: 1px solid #D6D6D8;
  border-radius: 0.625rem;
  margin: 0;
}

#workflow-multiple-signers-select .choices__input.choices__input--cloned:focus,
#signed-agreement-recipients-select .choices__input.choices__input--cloned:focus {
  border: 1px solid #176BEA;
  box-shadow: 0 0 6px 0 rgb(23,107,234);
}

#workflow-multiple-signers-select .choices__list.choices__list--dropdown,
#signed-agreement-recipients-select .choices__list.choices__list--dropdown {
  margin-top: 1rem;
}

#signed-agreement-recipients-select .choices__list.choices__list--dropdown,
#workflow-multiple-signers-select .choices__list.choices__list--dropdown {
  margin-bottom: 1rem;
}

#signed-agreement-recipients-select .choices__inner{
  display: flex;
  flex-direction: column-reverse;
}

#signed-agreement-recipients-select .choices__list--multiple {
  margin-top: 16px;
  border-top: 1px solid #D6D6D8;
  border-bottom: 1px solid #D6D6D8;
}

.multiple-choice .choices__input {
  display: block;
  width: 100% !important;
  border: 1px solid #D6D6D8;
  border-radius: 0.625rem;
}

.multiple-choice .choices__list--multiple {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  padding: .5rem 0;
}

.multiple-choice .choices__button {
  border-left: none !important;
  background-image: url(/assets/x-mark-black-5f261429973d0544c26f896bb365b81d1f24ec55196e07e22862cfea7fd47ece.svg) !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
}

.multiple-choice .choices.is-disabled .choices__inner,
.multiple-choice .choices.is-disabled .choices__input,
.multiple-choice .choices.is-disabled .choices__item--selectable,
.multiple-choice .choices.is-disabled .choices__button {
  cursor: not-allowed;
  background-color: #f9f9f9;
}

/* TODO: Standardize the use of choices.js */
#blue-clock,
#loading-circle {
  transform-origin: 50% 50%;
}

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

#loading-circle {
  animation: rotate 2s linear infinite;
}
@media (max-width: 767px) {
  div.BeaconFabButtonFrame {
    display: none;
  }
}
.connected-integration {
  background: rgba(27, 189, 82, 0.15);
}

.disconnected-integration {
  background: rgba(225, 47, 0, 0.2);
}

.e-signature-header {
  font-family: Metropolis;
  font-size: 12px;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 1px;
  text-align: left;
}

.spinner {
  border: 4px solid rgba(0, 0, 0, 0.3);
  border-top: 4px solid #3498db;
  border-radius: 50%;
  width: 15px;
  height: 15px;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.mention-popup {
  position: fixed;
  background: white;
  padding: 12px;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  border: 1px solid #e0e0e0;
  z-index: 1000;
  min-width: 200px;
}

.mention-popup:after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid white;
}

.mention-popup h4 {
  margin: 0 0 8px 0;
  font-size: 16px;
  color: #333;
}

.mention-popup p {
  margin: 0;
  font-size: 14px;
  color: #666;
}
/* Default answer UI */
.multiple-choices-list:not(.default-options-open) .default-answer-ui {
  display: none;
}

input[type="checkbox"].hidden-check + span.fake-radio {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 1.125rem; /* 18px */
  height: 1.125rem; /* 18px */
  border-radius: 100%;
  border: 2px solid #D6D6D8;
  transition: border 150ms;
  background-color: white;
}

input[type="checkbox"].hidden-check + span.fake-radio::before {
  content: "";
  width: 0.5rem; /* 8px */
  height: 0.5rem; /* 8px */
  border-radius: 100%;
  transform: scale(0);
  transition: transform 150ms;
  background-color: #32303E;
}

input[type="checkbox"].hidden-check:checked + span.fake-radio {
  border-color: #5B5965;
}

input[type="checkbox"].hidden-check:checked + span.fake-radio::before {
  transform: scale(1);
}
.multiple-choices-list:not(.default-options-open) .default-answer-ui {
  display: none;
}
.repository > em {
  font-style: normal;
  font-weight: bold;
  background-color: #FFFF00;
}
.repository-chat-panel {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 24rem;
  height: 100%;
  max-height: 100%;
  flex-direction: column;
  background-color: white;
  box-shadow: 0 -4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  z-index: 50;
}

.resize-handle {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  cursor: ew-resize;
  background: transparent;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.resize-handle:hover {
  background-color: rgba(0, 0, 0, 0.1);
}

.resize-handle:active {
  background-color: rgba(0, 0, 0, 0.2);
}

/* Prevent text selection during resize */
body.resizing {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  cursor: ew-resize;
}

.repository-chat-panel.collapsed {
  height: 3rem;
}

.repository-chat-header {
  display: flex;
  height: 40px;
  padding: 4px 14px;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;
  align-self: stretch;
  background: linear-gradient(87deg, #32303E 4.7%, #A198D3 95.3%);
}

.repository-chat-messages {
  flex-grow: 1;
  padding: 1rem;
  overflow-y: auto;
}

.repository-chat-form {
  padding: 0.75rem 1rem;
  flex-shrink: 0;
}

.repository-chat-trigger {
  position: fixed;
  bottom: 1.5rem;
  right: 2rem;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 9999px;
  background-color: var(--blue-accent);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  z-index: 40;
  cursor: pointer;
}

.repository-ai-chat-btn {
  display: flex;
  padding: 8px 12px;
  justify-content: center;
  align-items: center;
  border-radius: 360px;
  border: 1px solid #C1C1FF;
  background: var(--Gradient-2, linear-gradient(270deg, rgba(255, 255, 255, 0.00) 0%, rgba(161, 152, 211, 0.16) 100%));
  white-space: nowrap;
  min-width: fit-content;
}
@media (max-width: 46em) {
  table.with-actions-menu > thead,
  table.regular > thead {
    display: none;
  }

  table.with-actions-menu tr,
  table.regular tr {
    display: grid;
    gap: 1em;
    padding: 1em;
  }

  table.with-actions-menu tr {
    grid-template-columns: 1fr auto;
  }

  table.with-actions-menu td,
  table.regular td {
    padding: 0;
  }

  table.regular td:not(:first-child)::before {
    content: attr(data-cell);
    display: block;
    text-transform: uppercase;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06ch;
    color: #5B5965;
  }

  table.with-actions-menu td:not([data-cell="subject"], [data-cell="menu"]) {
    grid-column: 1 / span 2;
  }

  table.with-actions-menu td:last-child {
    grid-column-start: 2;
    grid-row-start: 1;
  }
}

@media (max-width: 767px) {
  /* Legal requests table */

  table.requests-table > thead {
    display: none;
  }

  table.requests-table tr {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.5em 1em;
    padding: 0.75em 0;
    border-top: none;
  }

  table.requests-table td {
    border: none;
    padding: 0;
  }

  table.requests-table td::before {
    content: attr(data-additional-info);
  }

  table.requests-table td:not(:first-child, :last-child) {
    grid-column: span 2;
  }

  table.requests-table td:first-child {
    font-size: 1rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  table.requests-table td:last-child {
    grid-column-start: 2;
    grid-row-start: 1;
  }

  table.requests-table .desktop-only {
    display: none;
  }

  /* Notification center table */

  table.notifications-table > thead {
    display: none;
  }

  table.notifications-table tr {
    display: flex;
    flex-direction: column;
    padding: 0.75em 1.5em;
    align-items: flex-start;
  }

  table.notifications-table td {
    padding: 0.5em 1em;
  }
}

.selectable-card_input:not(:disabled) + .selectable-card_card:hover,
.selectable-card_input:disabled + .selectable-card_card {
  border-color: #98979E;
  background-color: #F9F9F9;
}

.selectable-card_input:not(:disabled):checked + .selectable-card_card {
  border-color: #176BEA;
}
:root {
  --sidebar-width: 15rem; /* 240px */
  --collapsed-sidebar-width: 4.5rem; /* 72px */
}

@media (min-width: 64em) {
  #main-sidebar.collapsed {
    width: var(--collapsed-sidebar-width);
    padding-left: 1em;
    padding-right: 1em;
  }

  /* TODO: Add appropiate collapsing animations */
  #main-sidebar.collapsed .collapse-hide {
    display: none;
  }
}
@layer base {
  :root {
    --background-color-action-box-ai-review: #F1F0FE;
    --background-color-action-box-ai-review-accent: #7978FF;

    --background-color-action-box-playbook-review: #FCEAE6;
    --background-color-action-box-playbook-review-accent: #E95962;

    --background-color-action-box-manage-playbooks: #EBEAEC;
    --background-color-action-box-manage-playbooks-accent: #989899;

    --background-color-action-box-drafting: #EAF0FD;
    --background-color-action-box-drafting-accent: #176BEA;

    --background-color-action-box-redlining: #FCEAE6;
    --background-color-action-box-redlining-accent: #A02100;

    --background-color-action-box-compare: #ECF5EE;
    --background-color-action-box-compare-accent: #378F49;

    --background-color-action-box-request: #EBEAEC;
    --background-color-action-box-request-accent: #5B5965;

    --background-color-action-box-benchmark: #FFF9E6;
    --background-color-action-box-benchmark-accent: #E8B100;
  }

  .theme-lawinsider {
    --background-color-action-box-ai-review: #F1F0FE;
    --background-color-action-box-ai-review-accent: #7978FF;

    --background-color-action-box-playbook-review: #FCEAE6;
    --background-color-action-box-playbook-review-accent: #E95962;

    --background-color-action-box-manage-playbooks: #EBEAEC;
    --background-color-action-box-manage-playbooks-accent: #989899;

    --background-color-action-box-drafting: #E6F1F7;
    --background-color-action-box-drafting-accent: #0675AC;

    --background-color-action-box-redlining: #EAEEF3;
    --background-color-action-box-redlining-accent: #28538B;

    --background-color-action-box-compare: #ECF5EE;
    --background-color-action-box-compare-accent: #378F49;

    --background-color-action-box-request: #F1F0FE;
    --background-color-action-box-request-accent: #7978FF;

    --background-color-action-box-benchmark: #FFFBE8;
    --background-color-action-box-benchmark-accent: #B29B15;
  }
}
@layer base {
  :root {
    --text-color-button-small-primary: #FFFFFF;
    --text-color-button-small-secondary: #7978FF;

    --background-color-button-small-primary: #7978FF;
    --background-color-button-small-secondary: #FFFFFF;

    --border-color-button-small-secondary: #7978FF;

    --text-color-button-small-primary-hover: #FFFFFF;
    --text-color-button-small-secondary-hover: #7978FF;

    --background-color-button-small-primary-hover: #A5A5FF;
    --background-color-button-small-secondary-hover: #7978FF14;

    --border-color-button-small-secondary-hover: #7978FF;

    --text-color-button-small-primary-disabled: #FFFFFF;
    --text-color-button-small-secondary-disabled: #D6D6D8;

    --background-color-button-small-primary-disabled: #D6D6D8;
    --border-color-button-small-secondary-disabled: #D6D6D8;

    --border-width-button-small-secondary: 1px;
    --border-radius-button-small: 6px;
  }

  .theme-lawinsider {
    --text-color-button-small-primary: #FFFFFF;
    --text-color-button-small-secondary: #28538B;

    --background-color-button-small-primary: #28538B;
    --background-color-button-small-secondary: #FFFFFF;

    --border-color-button-small-secondary: #28538B;

    --text-color-button-small-primary-hover: #FFFFFF;
    --text-color-button-small-secondary-hover: #5375A2;

    --background-color-button-small-primary-hover: #5375A2;
    --background-color-button-small-secondary-hover: #FFFFFF;

    --border-color-button-small-secondary-hover: #5375A2;

    --text-color-button-small-primary-disabled: #989899;
    --text-color-button-small-secondary-disabled: #C3C3C5;

    --background-color-button-small-primary-disabled: #D6D6D8;
    --border-color-button-small-secondary-disabled: #C3C3C5;

    --border-width-button-small-secondary: 1px;
    --border-radius-button-small: 4px;
  }
}
@layer base {
  :root {
    --text-color-button-primary: #FFFFFF;
    --text-color-button-secondary: #8679D0;
    --text-color-button-tertiary: #7978FF;
    --text-color-button-tertiary-muted: #5B5965;

    --background-color-button-primary-from: #32303E;
    --background-color-button-primary-to: #A198D3;
    --background-color-button-secondary: #FFFFFF;
    --background-color-button-tertiary: transparent;
    --background-color-button-tertiary-muted: transparent;

    --border-color-button-secondary: #8679D0;

    --border-width-button-secondary: 2px;
    --border-radius-button-primary: 40px;
    --border-radius-button-secondary: 40px;
    --border-radius-button-tertiary: 6px;

    --text-color-button-tertiary-hover: #6E6DE8;
    --text-color-button-tertiary-muted-hover: #23222C;

    --background-color-button-primary-hover-from: #32303E;
    --background-color-button-primary-hover-via: #625D7E;
    --background-color-button-primary-hover-to: #A198D3;
    --background-color-button-secondary-hover: #EDEAFF;
    --background-color-button-tertiary-hover: #7978FF14;
    --background-color-button-tertiary-muted-hover: #5B596514;
    --background-color-button-highlight: #7978FF;
    --background-color-button-highlight-hover: #5555f4;

    --text-color-button-tertiary-disabled: #D6D6D8;

    --padding-x-button-primary: 24px;
    --padding-y-button-primary: 10px;
    --padding-x-button-secondary: 24px;
    --padding-y-button-secondary: 10px;
  }

  .theme-lawinsider {
    --text-color-button-primary: #FFFFFF;
    --text-color-button-secondary: #28538B;
    --text-color-button-tertiary: #28538B;
    --text-color-button-tertiary-muted: #5A5A5B;

    --background-color-button-primary-from: #28538B;
    --background-color-button-primary-to: #28538B;
    --background-color-button-secondary: #FFFFFF;
    --background-color-button-tertiary: transparent;
    --background-color-button-tertiary-muted: transparent;

    --border-color-button-secondary: #28538B;

    --border-width-button-secondary: 1px;
    --border-radius-button-primary: 4px;
    --border-radius-button-secondary: 4px;
    --border-radius-button-tertiary: 4px;

    --text-color-button-tertiary-hover: #28538B;
    --text-color-button-tertiary-muted-hover: #5A5A5B;

    --background-color-button-primary-hover-from: #5375A2;
    --background-color-button-primary-hover-via: #5375A2;
    --background-color-button-primary-hover-to: #5375A2;
    --background-color-button-secondary-hover: #FFFFFF;
    --background-color-button-tertiary-hover: #28538B0D;
    --background-color-button-tertiary-muted-hover: #F2F2F3;
    --background-color-button-highlight: #28538B;
    --background-color-button-highlight-hover: #16417b;

    --text-color-button-tertiary-disabled: #C3C3C5;

    --padding-x-button-primary: 24px;
    --padding-y-button-primary: 10px;
    --padding-x-button-secondary: 24px;
    --padding-y-button-secondary: 10px;
  }
}
@layer base {
  :root {
    --text-color-card-title: #23222C;
    --text-color-card-subtitle: #5B5965;
    --text-color-card-subtitle-2: #98979E;
    --text-color-card: #33326B;

    --font-weight-card-subtitle: 600;
    --font-weight-card-subheading: 600;

    --background-color-card: #FFFFFF;
    --background-color-card-info: #7978FF14;
    --background-color-card-highlight: #7978FF14;
    --background-color-card-highlight-info: #F9F9F9;
    --background-color-card-hover: #FAFAFF;
    --background-color-card-secondary: #7978FF14;

    --border-color-card: #D6D6D8;
    --border-radius-card: 16px;
    --border-width-card: 1px;
    --border-color-card-hover: #7978FF;
  }

  .theme-lawinsider {
    --text-color-card-title: #000000;
    --text-color-card-subtitle: #5A5A5B;
    --text-color-card-subtitle-2: #5A5A5B;
    --text-color-card: #000000;

    --font-weight-card-subtitle: 400;
    --font-weight-card-subheading: 700;

    --background-color-card: #FFFFFF;
    --background-color-card-info: #0675ac0c;
    --background-color-card-highlight: #0675ac0c;
    --background-color-card-highlight-info: #F2F2F3;
    --background-color-card-hover: #0675AC0D;
    --background-color-card-secondary: #0675AC0D;

    --border-color-card: #D6D6D8;
    --border-radius-card: 4px;
    --border-width-card: 1px;
    --border-color-card-hover: #28538B;
  }
}
@layer base {
  :root {
    --background-color-chat-tag-ai-review: #F1F0FE;
    --background-color-chat-tag-ai-review-accent: #7978FF;
    --background-color-chat-tag-playbook-review: #FCEAE6;
    --background-color-chat-tag-playbook-review-accent: #E95962;
    --background-color-chat-tag-drafting: #E6F1F7;
    --background-color-chat-tag-drafting-accent: #0675AC;
    --background-color-chat-tag-comparing: #ECF5EE;
    --background-color-chat-tag-comparing-accent: #378F49;
    --background-color-chat-tag-redlining: #EAEEF3;
    --background-color-chat-tag-redlining-accent: #28538B;
  }

  .theme-lawinsider {
    --background-color-chat-tag-ai-review: #F1F0FE;
    --background-color-chat-tag-ai-review-accent: #7978FF;
    --background-color-chat-tag-playbook-review: #FCEAE6;
    --background-color-chat-tag-playbook-review-accent: #E95962;
    --background-color-chat-tag-drafting: #E6F1F7;
    --background-color-chat-tag-drafting-accent: #0675AC;
    --background-color-chat-tag-comparing: #ECF5EE;
    --background-color-chat-tag-comparing-accent: #378F49;
    --background-color-chat-tag-redlining: #EAEEF3;
    --background-color-chat-tag-redlining-accent: #28538B;
  }
}
@layer base {
  :root {
    --border-radius-filter-container: 8px;
    --border-color-filter-container: #EBEAEC;
    --text-color-filter: #5B5965;
    --border-radius-filter-selected: 5px;
    --text-color-filter-selected: #33326B;
    --background-color-filter-selected: #F1F0FE;
  }

  .theme-lawinsider {
    --border-radius-filter-container: 6px;
    --border-color-filter-container: #E4E4E5;
    --text-color-filter: #989899;
    --border-radius-filter-selected: 4px;
    --text-color-filter-selected: #11233A;
    --background-color-filter-selected: #EAEEF3;
  }
}
@layer base {
  :root {
    --simpleai-heading-font-size: 2rem;
    --simpleai-heading-font-weight: 600;
  }

  .theme-lawinsider {
    --simpleai-heading-font-size: 2rem;
    --simpleai-heading-font-weight: 700;
  }
}
/* Theme Variables */
@import './action-boxes.css';
@import './button-small.css';
@import './button.css';
@import './cards.css';
@import './filters.css';
@import './input.css';
@import './list.css';
@import './other.css';
@import './progress-bar.css';
@import './radio-buttons.css';
@import './tabs.css';
@import './toggle.css';
@layer base {
  :root {
    --border-radius-input: 8px;
    --border-width-input: 1px;
    --border-color-input: #EBEAEC;
    --placeholder-color-input: #98979E;
    --text-color-input: #32303E;
    --border-color-input-hover: #7978FF;

    --border-color-input-focus: #7978FF;
    --box-shadow-input-focus: 0 0 6px 0 #7978FF;
    --text-color-input-focus: #32303E;

    --border-color-input-disabled: #D6D6D8;
    --placeholder-color-input-disabled: #D6D6D8;
    --text-color-input-disabled: #D6D6D8;
    --background-color-input-disabled: #F9F9F9;

    --border-color-checkbox: #7978FF;
    --background-color-checkbox-checked: #7978FF;
  }

  .theme-lawinsider {
    --border-radius-input: 4px;
    --border-width-input: 1px;
    --border-color-input: #D6D6D8;
    --placeholder-color-input: #C3C3C5;
    --text-color-input: #000000;
    --border-color-input-hover: #28538B;

    --border-color-input-focus: #28538B;
    --box-shadow-input-focus: 0 0 4px 0 #28538B;
    --text-color-input-focus: #000000;

    --border-color-input-disabled: #D6D6D8;
    --placeholder-color-input-disabled: #C3C3C5;
    --text-color-input-disabled: #C3C3C5;
    --background-color-input-disabled: #F2F2F3;

    --border-color-checkbox: #28538B;
    --background-color-checkbox-checked: #28538B;
  }
}
@layer base {
  :root {
    --list-text-color: #33326B;
  }

  .theme-lawinsider {
    --list-text-color: #000000;
  }
}
@layer base {
  :root {
    --fill-color-accent: #7978FF;
    --fill-color-disabled: #D6D6D8;
    --border-radius-modal: 16px;
    --ai-linear-gradient: linear-gradient(87deg, #32303E 4.7%, #A198D3 95.3%);
    --loader-background-color: #7574D1;
    --loader-highlight-color: #E2E3FF;
    --chat-submit-button-background-color: #7978FF;
    --chat-submit-button-background-color-hover: #A5A5FF;
    --chat-submit-button-border-radius: 6px;
    --apply-all-gradient: linear-gradient(90deg, #f1f0fe 30.49%, #ffffff 78%);
    --apply-all-accent: #5655B5;
  }

  .theme-lawinsider {
    --fill-color-accent: #28538B;
    --fill-color-disabled: #D6D6D8;
    --border-radius-modal: 4px;
    --ai-linear-gradient: linear-gradient(87deg, #28538B 4.7%, #0675AC 95.3%);
    --loader-background-color: #28538B;
    --loader-highlight-color: #0675AC1A;
    --chat-submit-button-background-color: #28538B;
    --chat-submit-button-background-color-hover: #16417b;
    --chat-submit-button-border-radius: 99px;
    --apply-all-gradient: linear-gradient(90deg, #f3f8fb 0%, #ffffff 100%);
    --apply-all-accent: #28538B;
  }
}
@layer base {
  :root {
    --background-color-progress-bar-loading: #98979E;
    --background-color-progress-bar-issues: #D5D5FF;
    --background-color-progress-bar-compliant: #6E6DE8;
    --background-color-progress-bar-not-found: #D6D6D8;
    --background-color-progress-bar-gradient-bg: #43428C;
    --background-color-progress-bar-gradient-highlight: #D5D5FF;
  }

  .theme-lawinsider {
    --background-color-progress-bar-loading: #98979E;
    --background-color-progress-bar-issues: #FFC300;
    --background-color-progress-bar-compliant: #13863A;
    --background-color-progress-bar-not-found: #D6D6D8;
    --background-color-progress-bar-gradient-bg: #98979E;
    --background-color-progress-bar-gradient-highlight: #EBEAEC;
  }
}
@layer base {
  :root {
    --background-color-radio-button: #EDECEE;
    --background-color-radio-button-checked: #32303E;
    --background-color-radio-button-wrapper: #EDECEE;

    --text-color-radio-button: #32303E;
    --text-color-radio-button-checked: #FFFFFF;

    --padding-x-radio-button: 8px;
    --padding-y-radio-button: 5px;

    --border-radius-radio-button: 8px;
    --border-radius-radio-button-wrapper: 8px;
  }

  .theme-lawinsider {
    --background-color-radio-button: #EDECEE;
    --background-color-radio-button-checked: #28538B;
    --background-color-radio-button-wrapper: #EDECEE;

    --text-color-radio-button: #000000;
    --text-color-radio-button-checked: #FFFFFF;

    --padding-x-radio-button: 8px;
    --padding-y-radio-button: 8px;

    --border-radius-radio-button: 4px;
    --border-radius-radio-button-wrapper: 4px;
  }
}
@layer base {
  :root {
    --text-color-tab-selected: #33326B;
    --text-color-tab-disabled: #98979E;

    --border-color-tab-selected: #32303E;
    --border-color-tab-disabled: #D6D6D8;
  }

  .theme-lawinsider {
    --text-color-tab-selected: #28538B;
    --text-color-tab-disabled: #D6D6D8;

    --border-color-tab-selected: #28538B;
    --border-color-tab-disabled: #D6D6D8;
  }
}
@layer base {
  :root {
    --background-color-toggle-on: #7978FF;
    --background-color-toggle-off: #98979E;
    --background-color-toggle-hover: #A5A5FF;
    --background-color-toggle-checked-hover: #A5A5FF;
    --background-color-toggle-disabled: #D6D6D8;
  }

  .theme-lawinsider {
    --background-color-toggle-on: #417505;
    --background-color-toggle-off: #5A5A5B;
    --background-color-toggle-hover: #679137;
    --background-color-toggle-checked-hover: #679137;
    --background-color-toggle-disabled: #D6D6D8;
  }
}
/* Components */
@import './components/index.css';
/* The container that holds the suggestions menu */
.tribute-container {
  position: absolute;
  top: 0;
  left: 0;
  height: auto;
  max-height: 300px;
  overflow: auto;
  display: block;
  z-index: 999999;
  background: white;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

/* The list of suggestions */
.tribute-container ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Individual suggestion items */
.tribute-container li {
  padding: 8px 12px;
  cursor: pointer;
}

/* Highlighted/selected suggestion */
.tribute-container li.highlight {
  background: #2196F3;
  color: white;
}

/* If you're using menu item with images */
.tribute-container .tribute-item img {
  margin-right: 8px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
/*
 * 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.
 *


 */