/* custom_theme.css */

.uk-theme-mcmakler {
    --yellow: 51, 100%, 62%;
    --green: 186 100% 16.5%;
    --background: transparent;
    --foreground: var(--green);
    --muted: 78 12% 85%;
    --muted-foreground: 220 8.9% 46.1%;
    --popover: 0 0% 100%;
    --popover-foreground: var(--green);
    --card: 0 0% 97%;
    --card-foreground: var(--green);
    --border: 78 2% 93%;
    --input: var(--green);
    --primary: var(--green);
    --primary-foreground: 0 0% 0%;
    --secondary: 78 8% 81%;
    --secondary-foreground: 78 8% 21%;
    --accent: var(--yellow);
    --accent-foreground: var(--green);
    --destructive: 17 86% 32%;
    --destructive-foreground: 17 86% 92%;
    --ring: var(--green);
    --chart-1: 78 28% 60%;
    --chart-2: 78 8% 81%;
    --chart-3: 78 8% 81%;
    --chart-4: 78 8% 84%;
    --chart-5: 78 31% 60%;
    --radius: 0.5rem;
    --placeholder-color: 186 100% 16.5%;
    --uk-global-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.3), 0 1px 2px -1px rgb(0 0 0 / 0.3);
    font-family: 'Inter', sans-serif;
  }

.uk-theme-mcmakler input::placeholder {
  color: hsl(var(--placeholder-color));
}

.uk-input {
  background-color: hsl(var(--background));
}

.uk-modal-dialog {
  background-color: white;
}

.no-bottom-padding {
  padding-bottom: 0 !important;
}

#modal-content {
  overflow-x: auto;
}

#modal-2-content {
  overflow-x: auto;
}

  /* CSS for the spinner that is shown when a request is made */
.loader-wrapper {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 9999;
  opacity: 1.0;
}

.loader {
  border: 16px solid #f3f3f3;
  border-top: 16px solid #004c54;
  border-bottom: 16px solid #ffe23d;
  border-left: 16px solid #ffe23d;
  border-right: 16px solid #ffe23d;
  border-radius: 50%;
  width: 120px;
  height: 120px;
  animation: spin 2s linear infinite;
}

.skeleton {
  background-color: hsl(0 0% 95%);
  background-image: linear-gradient(
    105deg,
    transparent 0%,
    transparent 40%,
    oklch(98% 0 0) 50%,
    transparent 60%,
    transparent 100%
  );
}

.skeleton-line {
  height: 13px;
  border-radius: 10px;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* This make sure there is no flicker on page load */
.htmx-indicator {
  display: none;
}

.htmx-request {
  display: block;
}

.colored_opportunity_box {
  background-color: rgb(241, 245, 249);
}
                   
.complete_disable {
  pointer-events: none;   /* Prevents clicks */
  opacity: 0.5;           /* Visual feedback */
}

.uk-tooltip.uk-active {
  background-color: #fff;
  color: var(--green);
  /* font-style: italic; */
}

.uk-btn-default {
  background-color: #fff;
}