@import "tailwindcss" important;

@theme {
    --color-base-orange-400: #ffc656;
    --color-base-white-400: #fafafa;
    --color-base-black: #0a0a0a;
    --color-base-gray-400: #7a7a7a;
    --color-base-green-400: #256918;
    --color-base-green-800: #12330c;
    --font-title: "Playfair Display", sans-serif;
    --font-text: "Nunito", sans-serif;
    --font-common: "Raleway", sans-serif;
}

@layer components {
    .arrow-left::before {
    @apply content-[''] w-4 h-4 bg-current mr-2;
    clip-path: polygon(9.8px 12.8px, 8.7px 12.8px, 4.5px 8.5px, 4.5px 7.5px, 8.7px 3.2px, 9.8px 4.3px, 6.1px 8px, 9.8px 11.7px, 9.8px 12.8px);
    }

    .arrow-right::after {
    @apply content-[''] w-4 h-4 bg-current ml-2;
    clip-path: polygon(6.2px 3.2px, 7.3px 3.2px, 11.5px 7.5px, 11.5px 8.5px, 7.3px 12.8px, 6.2px 11.7px, 9.9px 8px, 6.2px 4.3px, 6.2px 3.2px);
    }
}

/**
  * A catch-all path to Django template files, JavaScript, and Python files
  * that contain Tailwind CSS classes and will be scanned by Tailwind to generate the final CSS file.
  *
  * If your final CSS file is not being updated after code changes, you may want to broaden or narrow
  * the scope of this path.
  */
@source "../../../**/*.{html,py,js}";
