/* Custom CSS for minor adjustments or overrides */

/* Ensure the container centers content */
.container {
    max-width: 1200px; /* Adjust max-width as needed */
}

/* Style for image previews to ensure they fit */
.image-upload img {
    max-width: 100%;
    height: auto; /* Maintain aspect ratio */
    display: block; /* Remove extra space below image */
    margin-left: auto; /* Center image in flex container */
    margin-right: auto; /* Center image in flex container */
}

/* Hide default file input appearance */
input[type="file"] {
    cursor: pointer;
}

/* Style the custom file input appearance */
input[type="file"]::file-selector-button {
    /* Tailwind classes are used in HTML for this */
}

/* Responsive adjustments */
@media (max-width: 768px) {
    header .container {
        flex-direction: column;
        text-align: center;
    }
    header nav {
        margin-top: 10px;
    }
    header nav ul {
        justify-center;
    }
    .flex-col.md\:flex-row {
        flex-direction: column;
    }
    .w-full.md\:w-1\/3 {
        width: 100%;
    }
}