@tailwind base;
@tailwind components;
@tailwind utilities;
:root {
    --color-navy-900: #0a1a2f;
    --color-navy-800: #122a4a;
    --color-red-800: #c41e3a;
    --color-star-blue: #0052a5;
    --color-star-red: #bf0a30;
}
.bg-navy-900 {
    background-color: var(--color-navy-900);
}
.bg-navy-800 {
    background-color: var(--color-navy-800);
}
.text-navy-900 {
    color: var(--color-navy-900);
}
.bg-red-800 {
    background-color: var(--color-red-800);
}
.text-red-800 {
    color: var(--color-red-800);
}

.font-oswald {
    font-family: 'Oswald', sans-serif;
}
.font-lato {
    font-family: 'Lato', sans-serif;
}

/* Campaign poster texture */
.campaign-texture {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiPjxkZWZzPjxwYXR0ZXJuIGlkPSJwYXR0ZXJuIiB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHBhdHRlcm5Vbml0cz0idXNlclNwYWNlT25Vc2UiIHBhdHRlcm5UcmFuc2Zvcm09InJvdGF0ZSg0NSkiPjxyZWN0IHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0icmdiYSgyNTUsMjU1LDI1NSwwLjAzKSIvPjwvcGF0dGVybj48L2RlZnM+PHJlY3QgZmlsbD0idXJsKCNwYXR0ZXJuKSIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIvPjwvc3ZnPg==');
}

/* Button hover effects */
.btn-patriot {
    @apply px-6 py-3 rounded-md font-bold transition-all duration-300;
}
.btn-patriot:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Star bullet points */
.star-list li {
    @apply relative pl-6 mb-2;
}
.star-list li:before {
    content: "★";
    @apply absolute left-0 text-red-600;
}
/* Enhanced FAQ accordion styles */
.faq-item {
    @apply transition-all duration-300;
}
.faq-item:hover {
    @apply shadow-lg;
}

/* Poll watcher training section */
.poll-watcher-card {
    @apply transition-transform duration-300;
}
.poll-watcher-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

/* Legal compliance badges */
.legal-badge {
    @apply inline-block px-3 py-1 rounded-full text-sm font-bold mr-2 mb-2;
}
.badge-red {
    @apply bg-red-100 text-red-800;
}
.badge-blue {
    @apply bg-blue-100 text-blue-800;
}
