/* Landing Page Specific Styles */

/* Radio Card Styles */
.radio-card {
    @apply relative cursor-pointer;
}

.radio-card-content {
    @apply flex items-center p-4 border-2 border-gray-200 rounded-lg transition-all;
}

.radio-card input:checked ~ .radio-card-content {
    @apply border-primary bg-blue-50;
}

.radio-card:hover .radio-card-content {
    @apply border-gray-300;
}

.radio-custom {
    @apply w-5 h-5 rounded-full border-2 border-gray-300 mr-3 flex-shrink-0 relative;
}

.radio-card input:checked ~ .radio-card-content .radio-custom {
    @apply border-primary;
}

.radio-card input:checked ~ .radio-card-content .radio-custom::after {
    content: '';
    @apply absolute inset-0 m-auto w-3 h-3 bg-primary rounded-full;
}

/* Selected radio-card state */
.radio-card.selected .radio-card-content {
    @apply border-primary bg-blue-50;
}

.radio-card.selected .radio-custom {
    @apply border-primary;
}

.radio-card.selected .radio-custom::after {
    content: '';
    @apply absolute inset-0 m-auto w-3 h-3 bg-primary rounded-full;
}

/* Weight Selection - Consistent with existing design system */
.radio-card.selected .weight-icon {
    @apply bg-primary text-white;
}

/* Animations */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes bounce {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-20px);
    }
}

.animate-fadeIn {
    animation: fadeIn 0.6s ease-out;
}

.animate-slideDown {
    animation: slideDown 0.5s ease-out;
}

.animate-bounce {
    animation: bounce 2s infinite;
}

/* Pulse Animation for Map */
@keyframes pulse {
    0% {
        transform: scale(0);
        opacity: 1;
    }
    100% {
        transform: scale(2);
        opacity: 0;
    }
}

.pulse-animation {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* Gradient Backgrounds */
.gradient-primary {
    background: linear-gradient(135deg, #1A73E8 0%, #1557B0 100%);
}

.gradient-orange {
    background: linear-gradient(135deg, #FFA726 0%, #FF7043 100%);
}

/* Map Marker Styles */
.map-marker {
    @apply absolute w-3 h-3 bg-red-500 rounded-full transform -translate-x-1/2 -translate-y-1/2;
}

.map-marker::before {
    content: '';
    @apply absolute inset-0 bg-red-500 rounded-full animate-ping;
}

/* Loading Spinner */
.loading-spinner {
    @apply inline-block w-8 h-8 border-4 border-primary border-t-transparent rounded-full animate-spin;
}

/* Success Animation */
.success-checkmark {
    @apply w-16 h-16 mx-auto mb-4;
}

.success-checkmark svg {
    @apply w-full h-full;
}

.success-checkmark .checkmark-circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.success-checkmark .checkmark-check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke {
    100% {
        stroke-dashoffset: 0;
    }
}

/* Dropdown Styles */
.dropdown-menu {
    @apply absolute mt-2 w-full bg-white border border-gray-200 rounded-lg shadow-lg z-50 max-h-60 overflow-y-auto;
}

.dropdown-search {
    @apply sticky top-0 bg-white p-3 border-b border-gray-200;
}

.dropdown-list {
    @apply py-1;
}

.dropdown-item {
    @apply block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 transition-colors;
}

/* Form Section Card */
.form-card {
    @apply bg-white rounded-2xl shadow-xl p-8;
}

/* Feature Card Hover Effect */
.feature-card {
    @apply p-6 rounded-xl transition-all duration-300 hover:shadow-lg hover:-translate-y-1;
}

/* Testimonial Card */
.testimonial-card {
    @apply bg-background p-6 rounded-xl transition-all duration-300 hover:shadow-md;
}

/* Tab Styles */
.tab-button {
    @apply px-4 py-2 text-sm font-medium border-b-2 transition-all duration-200;
}

.tab-button.active {
    @apply text-primary border-primary;
}

.tab-button:not(.active) {
    @apply text-gray-500 border-transparent hover:text-gray-700 hover:border-gray-300;
}

/* Responsive Utilities */
@media (max-width: 768px) {
    .hero-section {
        @apply pt-20 !important;
    }
    
    body.has-promo-banner .hero-section {
        @apply pt-32 !important;
    }
}

/* Custom Scrollbar */
.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    @apply bg-gray-100 rounded;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    @apply bg-gray-400 rounded hover:bg-gray-500;
}

/* Print Styles */
@media print {
    .no-print {
        display: none !important;
    }
}