/*
 Theme Name:   Twenty Twenty-Four
 Description:  Twenty Twenty-Four Child Theme
 Author:       Diego Bittencourt
 Author URI:   https://diegobittencourt.org
 Description: Twenty Twenty-Four is designed to be flexible,
 versatile and applicable to any website. Its collection of templates and patterns tailor to different needs,
 such as presenting a business,
 blogging and writing or showcasing work. A multitude of possibilities open up with just a few adjustments to color and typography. Twenty Twenty-Four comes with style variations and full page designs to help speed up the site building process,
 is fully compatible with the site editor,
 and takes advantage of new design tools introduced in WordPress 6.4.
 Template:     twentytwentyfour
Requires at least: 6.4
Tested up to: 6.4
Requires PHP: 7.0
Version: 1.0 License: GNU General Public License v2 or later
License URI: http: //www.gnu.org/licenses/gpl-2.0.html
Tags:         Tags: one-column,
custom-colors,
custom-menu,
custom-logo,
editor-style,
featured-images,
full-site-editing,
block-patterns,
rtl-language-support,
sticky-post,
threaded-comments,
translation-ready,
wide-blocks,
block-styles,
style-variations,
accessibility-ready,
blog,
portfolio,
news
 Text Domain:  twentytwentyfourchild
*/

 body {
            font-family: 'Inter', sans-serif;
            background-color: #f0f2f5; /* Light gray background */
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh; /* Full viewport height */
            margin: 0;
            padding: 20px; /* Padding around the form for small screens */
            box-sizing: border-box;
        }

        /* Specific styles for form elements, overriding default Tailwind if necessary */
        .form-group label {
            display: block; /* Labels on their own line */
            margin-bottom: 8px; /* Space below label */
            font-weight: 600; /* Slightly bolder labels */
            color: #333; /* Darker text for labels */
        }

        .form-group input,
        .form-group textarea {
            width: 100%; /* Full width within their container */
            padding: 12px 15px; /* Ample padding */
            border: 1px solid #d1d5db; /* Light gray border */
            border-radius: 8px; /* Rounded corners */
            font-size: 1rem; /* Readable font size */
            color: #374151; /* Dark text color */
            background-color: #ffffff; /* White background */
            transition: border-color 0.3s ease, box-shadow 0.3s ease; /* Smooth transitions */
            box-sizing: border-box; /* Include padding and border in element's total width and height */
        }

        .form-group input:focus,
        .form-group textarea:focus {
            border-color: #6366f1; /* Indigo border on focus */
            outline: none; /* Remove default outline */
            box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.25); /* Subtle shadow on focus */
        }

        .form-group textarea {
            min-height: 120px; /* Minimum height for textarea */
            resize: vertical; /* Allow vertical resizing only */
        }

        .submit-button {
            display: block; /* Make button a block element */
            width: 100%; /* Full width */
            padding: 14px 20px; /* Generous padding */
            background: linear-gradient(to right, #6366f1, #8b5cf6); /* Gradient background */
            color: white; /* White text */
            font-size: 1.125rem; /* Larger font size */
            font-weight: 700; /* Bold text */
            border: none; /* No border */
            border-radius: 8px; /* Rounded corners */
            cursor: pointer; /* Pointer cursor on hover */
            transition: background 0.3s ease, transform 0.2s ease; /* Smooth transitions */
            box-shadow: 0 4px 10px rgba(99, 102, 241, 0.3); /* Soft shadow */
        }

        .submit-button:hover {
            background: linear-gradient(to right, #4f46e5, #7c3aed); /* Slightly darker gradient on hover */
            transform: translateY(-2px); /* Slight lift effect */
        }

        .submit-button:active {
            transform: translateY(0); /* Return to original position on click */
            box-shadow: 0 2px 5px rgba(99, 102, 241, 0.2); /* Smaller shadow on active */
        }

        /* Message box for validation/success */
        .message-box {
            background-color: #fefcbf; /* Light yellow background */
            color: #8a6400; /* Dark yellow text */
            padding: 15px;
            border-radius: 8px;
            margin-bottom: 20px;
            display: none; /* Hidden by default */
            font-weight: 500;
            text-align: center;
            border: 1px solid #fde68a;
        }

        .message-box.error {
            background-color: #fee2e2; /* Light red background */
            color: #991b1b; /* Dark red text */
            border-color: #fca5a5;
        }

        .message-box.success {
            background-color: #d1fae5; /* Light green background */
            color: #065f46; /* Dark green text */
            border-color: #a7f3d0;
        }

        /* Responsive adjustments */
        @media (max-width: 640px) {
            .form-container {
                padding: 20px; /* Adjust padding for smaller screens */
                margin: 0 10px; /* Add horizontal margin */
            }
        }

lottie-player {
	margin: 0 auto;
}
input {
    padding: 10px;
}
.wp-core-ui .button-primary {
  background: #000 !important;
  border-color: #b12222 !important;
}