/* Additional custom styles if needed */
body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

.logo-text-script {
    font-family: 'Brush Script MT', cursive;
}

/* Ensure proper spacing and responsive behavior */
@media (max-width: 640px) {
    .container {
        padding: 1rem;
    }
    
    svg {
        width: 250px;
        height: 167px;
    }
}

/* Focus states for better accessibility */
input:focus,
select:focus,
button:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.3);
}

/* Smooth transitions */
button {
    transition: all 0.2s ease-in-out;
}

button:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Form validation styles */
input:invalid {
    border-color: #ef4444;
}

input:valid {
    border-color: #10b981;
}

/* Flip Card Styles */
.flip-card {
    background-color: transparent;
    width: 100%;
    height: 320px; /* h-80 in Tailwind */
    perspective: 1000px;
}

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.8s;
    transform-style: preserve-3d;
    cursor: pointer;
}

.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.flip-card-back {
    transform: rotateY(180deg);
}