/* @import "tailwindcss"; */



@theme {
    --color-brand-orange: #FF5E00;
    --color-navy: #151A2B;
    --color-navy-2: #1E2438;
    --color-brand-yellow: #FFD103;
    --color-brand-yellow-hover: #FFDD3F;
    --color-brand-yellow-dk: #E5BC00;
    --color-ink: #1B1F2A;
    --color-ink-muted: #5C6377;
    --color-line: #E2E5EB;
    --color-surface: #F6F7F9;
    --color-ok: #12805A;
    --font-sans: 'Archivo', sans-serif;
}

@utility btn-brand-orange {
    @apply bg-brand-orange text-white ;
    &:hover {
        @apply bg-brand-orange/80;
    }
}

@utility btn-y {
    @apply inline-block cursor-pointer rounded-lg border-2 border-brand-yellow bg-brand-yellow px-[26px] py-[13px] text-center text-[0.95rem] font-bold text-navy no-underline hover:border-brand-yellow-hover hover:bg-brand-yellow-hover focus-visible:outline-3 focus-visible:outline-offset-3 focus-visible:outline-brand-yellow;
}

@utility btn-o {
    @apply inline-block cursor-pointer rounded-lg border-2 border-current bg-transparent px-[26px] py-[13px] text-center text-[0.95rem] font-bold no-underline hover:border-brand-yellow hover:bg-brand-yellow hover:text-navy focus-visible:outline-3 focus-visible:outline-offset-3 focus-visible:outline-brand-yellow;
}

@utility btn-sm {
    @apply px-5 py-2.5 text-[0.87rem];
}
  @layer components {
	.btn-purple {
		@apply !bg-gradient-to-r from-fuchsia-600 via-purple-600 to-indigo-600 hover:opacity-95 !text-white font-bold py-3.5 px-6 rounded-xl shadow-md flex items-center justify-center gap-2 text-base transition;
	}
	.btn-yellow {
		@apply !bg-gradient-to-r from-amber-500 via-orange-500 to-red-500 hover:opacity-95 !text-white font-bold py-3.5 px-4 rounded-xl shadow-md flex items-center justify-center gap-2 text-base transition;
	}
	.typography h2,
	.typography h3,
	.typography h4,
	.typography h5,
	.typography h6 {
		@apply font-extrabold font-['Open_Sans'] !leading-[1.2];
	}
	.typography h2 {
		@apply text-3xl;
	}
	.typography h3 {
		@apply text-2xl;
	}
	.typography h4 {
		@apply text-xl;
	}
}

  body {
    font-family: var(--font-sans);
  }



@keyframes progress-shimmer {
    0% {
        transform: translateX(-100%);
    }

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

.rating-progress-tt::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    animation: progress-shimmer 2s infinite;
}
.sub-menu {
    display: none!important;
}