tailwind.css

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {

  /* Allow changing font family via CMS */
  html {
    font-family: var(--font-family);
    scroll-behavior: smooth;
  }

  body {
    background-color: #fff;
    scroll-behavior: smooth;
  }

  mark {
    @apply bg-accent text-accent-content;
  }

  /** Remove default styles from input[type=number] */
  input[type=number]::-webkit-inner-spin-button,
  input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  /* Disable scroll once drawer/modal is openned */
  body:has(.drawer-toggle:checked),
  body:has(.modal-toggle:checked) {
    overflow: hidden;
    height: 100vh;
  }
}

@layer components {
  .features {
    @apply flex items-center justify-center gap-6 flex-wrap;
    @apply relative max-w-[1280px] mx-auto;
  }

  .feature-card {
    @apply w-[380px] max-w-[380px] lg:h-[380px] bg-[#F4F4F4] rounded-3xl;
    @apply border-l border-transparent duration-200 whitespace-pre-line text-center;
    @apply flex flex-col items-center justify-start gap-8 py-10 px-8 lg:px-12;
  }
}

.group:disabled .group-disabled\:animate-progress {
  animation: progress-frame ease normal
}

@keyframes progress-frame {
  0% {
    --dot-progress: 0%
  }

  to {
    --dot-progress: 100%
  }
}

h2 strong span {
  font-weight: bolder;
}

.content-text-edit {
  /* outline: 1px solid #00A6CA; */
  -webkit-text-fill-color: #012E66; /* Will override color (regardless of order) */
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #00A6CA;
}

.text-apresentation {
  margin: 50px auto;
  max-width: 1280px;
}

.itens-fazer:hover::before {
  content: '';
  width: 5px;
  height: 100%;
  background-color: #00A6CA;
  position: absolute;
  display: block;
  margin-left: -15px;
}

@media (max-width: 1020px) {
  .respondi-input {
    width: 100% !important;
  }
}