@import url("https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800;900&display=swap"); @import "tailwindcss"; @theme { --font-sans: "Be Vietnam Pro", ui-sans-serif, system-ui, sans-serif; --color-cinek-50: #fefce8; --color-cinek-100: #fef9c3; --color-cinek-300: #fde047; --color-cinek-400: #facc15; --color-cinek-500: #eab308; --color-cinek-950: #422006; } html { scroll-behavior: smooth; } body { min-width: 320px; background-color: #0E111A; color: #f8fbff; } body, button, input { font-family: "Be Vietnam Pro", ui-sans-serif, system-ui, sans-serif; } button:not(:disabled), a[href], [role="button"], input[type="button"]:not(:disabled), input[type="submit"]:not(:disabled), input[type="reset"]:not(:disabled), label[for], select:not(:disabled) { cursor: pointer; } button:disabled, input:disabled, select:disabled { cursor: not-allowed; } ::-webkit-scrollbar { height: 0.7rem; width: 0.7rem; } ::-webkit-scrollbar-thumb { background: rgba(234, 179, 8, 0.68); border-radius: 999px; } ::-webkit-scrollbar-track { background: rgba(2, 6, 23, 0.72); } .hero-fade-enter-active, .hero-fade-leave-active { transition: opacity 700ms ease, transform 900ms ease; } .hero-fade-enter-from, .hero-fade-leave-to { opacity: 0; transform: scale(1.03); } .no-scrollbar { scrollbar-width: none; } .no-scrollbar::-webkit-scrollbar { display: none; } /* Admin design system — Modern Minimal Enterprise */ @layer utilities { .admin-page { @apply min-h-screen bg-[#0A0B0E] text-zinc-100 antialiased; } /* Flat, neutral enterprise card */ .admin-card { @apply rounded-2xl border border-white/[0.07] bg-[#131418] transition-colors duration-200 hover:border-white/[0.14]; } /* Card with subtle top highlight for hierarchy */ .admin-card-gradient { @apply rounded-2xl border border-white/[0.07] bg-[#131418] transition-colors duration-200 hover:border-white/[0.14]; background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent 40%); } .admin-input { @apply h-11 w-full rounded-xl border border-white/8 bg-white/3 px-4 text-sm text-white placeholder:text-zinc-500 outline-none transition focus:border-yellow-400/40 focus:bg-white/5 focus:ring-2 focus:ring-yellow-400/15; } .admin-btn { @apply inline-flex h-10 items-center justify-center gap-2 rounded-xl px-5 text-sm font-semibold transition-all duration-150 active:scale-[0.98]; } .admin-btn-primary { @apply inline-flex h-10 items-center justify-center gap-2 rounded-xl px-5 text-sm font-semibold transition-all duration-150 active:scale-[0.98] bg-yellow-400 text-zinc-950 hover:bg-yellow-300 hover:shadow-lg hover:shadow-yellow-400/20; } .admin-btn-secondary { @apply inline-flex h-10 items-center justify-center gap-2 rounded-xl px-5 text-sm font-semibold transition-all duration-150 active:scale-[0.98] border border-white/8 bg-white/4 text-zinc-100 hover:bg-white/8; } .admin-btn-danger { @apply inline-flex h-10 items-center justify-center gap-2 rounded-xl px-5 text-sm font-semibold transition-all duration-150 active:scale-[0.98] bg-red-500/10 text-red-400 hover:bg-red-500/20; } .admin-badge { @apply inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-semibold; } .admin-label { @apply text-[11px] font-semibold uppercase tracking-[0.14em] text-zinc-500; } .admin-section-title { @apply text-[1.6rem] font-bold tracking-tight text-white; } .admin-section-subtitle { @apply text-sm text-zinc-500; } .admin-num { @apply font-bold tracking-tight text-white tabular-nums; } /* Compact controls for dense edit rows */ .admin-input-sm { @apply h-8 rounded-lg border border-white/8 bg-white/3 px-2.5 text-xs text-white placeholder:text-zinc-500 outline-none transition focus:border-yellow-400/40 focus:bg-white/5; } .admin-btn-sm { @apply inline-flex h-7 items-center justify-center gap-1 rounded-lg px-2.5 text-xs font-semibold transition active:scale-[0.97]; } .admin-icon-square { @apply grid size-9 place-items-center rounded-xl border border-white/8 bg-white/3 text-zinc-300; } } /* Custom scrollbar for admin tables */ .admin-scrollbar::-webkit-scrollbar { height: 6px; width: 6px; } .admin-scrollbar::-webkit-scrollbar-thumb { background: rgba(250, 204, 21, 0.5); border-radius: 999px; } .admin-scrollbar::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.03); } /* Smooth modal fade */ .modal-fade-enter-active, .modal-fade-leave-active { transition: opacity 0.2s ease, transform 0.2s ease; } .modal-fade-enter-from, .modal-fade-leave-to { opacity: 0; transform: scale(0.98); }