/* Allauth Tailwind CSS Styling - Using standard CSS classes */

/* Form containers */
.allauth-form,
form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Headings */
.allauth-form h1,
.allauth-content h1,
h1 {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    color: rgb(15 23 42);
    margin-bottom: 1.5rem;
}

.allauth-form h2,
.allauth-content h2,
h2 {
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-weight: 600;
    color: rgb(15 23 42);
    margin-bottom: 1rem;
    margin-top: 1.5rem;
}

/* Paragraphs */
.allauth-form p,
.allauth-content p,
p {
    color: rgb(71 85 105);
    margin-bottom: 1rem;
}

/* Form fields */
.allauth-form input[type="text"],
.allauth-form input[type="email"],
.allauth-form input[type="password"],
.allauth-form input[type="tel"],
.allauth-form input[type="number"],
.allauth-form textarea,
.allauth-form select,
.allauth-content input[type="text"],
.allauth-content input[type="email"],
.allauth-content input[type="password"],
.allauth-content input[type="tel"],
.allauth-content input[type="number"],
.allauth-content textarea,
.allauth-content select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
textarea,
select {
    width: 100%;
    padding: 0.5rem 1rem;
    border: 1px solid rgb(203 213 225);
    border-radius: 0.5rem;
    outline: none;
    transition: all 0.2s;
    color: rgb(15 23 42);
}

.allauth-form input:focus,
.allauth-content input:focus,
input:focus {
    border-color: rgb(59 130 246);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.allauth-form input:disabled,
.allauth-content input:disabled,
input:disabled {
    background-color: rgb(241 245 249);
    cursor: not-allowed;
    color: rgb(100 116 139);
}

/* Labels */
.allauth-form label,
.allauth-content label,
label {
    display: block;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 500;
    color: rgb(51 65 85);
    margin-bottom: 0.5rem;
}

/* Error messages */
.allauth-form .errorlist,
.allauth-content .errorlist,
.errorlist {
    color: rgb(220 38 38);
    font-size: 0.875rem;
    line-height: 1.25rem;
    margin-top: 0.25rem;
    list-style: none;
    padding: 0;
}

.allauth-form .errorlist li,
.allauth-content .errorlist li,
.errorlist li {
    margin-bottom: 0.25rem;
}

.allauth-form .field-errors,
.allauth-content .field-errors,
.field-errors {
    color: rgb(220 38 38);
    font-size: 0.875rem;
    line-height: 1.25rem;
    margin-top: 0.25rem;
}

/* Help text */
.allauth-form .helptext,
.allauth-content .helptext,
.helptext {
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: rgb(100 116 139);
    margin-top: 0.25rem;
}

/* Buttons */
.allauth-form button[type="submit"],
.allauth-form .button,
.allauth-content button[type="submit"],
.allauth-content .button,
button[type="submit"],
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    font-weight: 600;
    transition: all 0.2s;
    outline: none;
    border: none;
    cursor: pointer;
}

.allauth-form button[type="submit"]:not(.outline):not(.secondary):not(.danger),
.allauth-form .button:not(.outline):not(.secondary):not(.danger),
.allauth-content button[type="submit"]:not(.outline):not(.secondary):not(.danger),
.allauth-content .button:not(.outline):not(.secondary):not(.danger),
button[type="submit"]:not(.outline):not(.secondary):not(.danger),
.button:not(.outline):not(.secondary):not(.danger) {
    background-color: rgb(37 99 235);
    color: white;
}

.allauth-form button[type="submit"]:not(.outline):not(.secondary):not(.danger):hover,
.allauth-form .button:not(.outline):not(.secondary):not(.danger):hover,
.allauth-content button[type="submit"]:not(.outline):not(.secondary):not(.danger):hover,
.allauth-content .button:not(.outline):not(.secondary):not(.danger):hover,
button[type="submit"]:not(.outline):not(.secondary):not(.danger):hover,
.button:not(.outline):not(.secondary):not(.danger):hover {
    background-color: rgb(29 78 216);
}

.allauth-form .button.outline,
.allauth-content .button.outline,
.button.outline {
    background-color: transparent;
    border: 2px solid rgb(203 213 225);
    color: rgb(51 65 85);
}

.allauth-form .button.outline:hover,
.allauth-content .button.outline:hover,
.button.outline:hover {
    background-color: rgb(248 250 252);
}

.allauth-form .button.secondary,
.allauth-content .button.secondary,
.button.secondary {
    background-color: rgb(71 85 105);
    color: white;
}

.allauth-form .button.secondary:hover,
.allauth-content .button.secondary:hover,
.button.secondary:hover {
    background-color: rgb(51 65 85);
}

.allauth-form .button.danger,
.allauth-content .button.danger,
.button.danger {
    background-color: rgb(220 38 38);
    color: white;
}

.allauth-form .button.danger:hover,
.allauth-content .button.danger:hover,
.button.danger:hover {
    background-color: rgb(185 28 28);
}

.allauth-form .button.minor,
.allauth-content .button.minor,
.button.minor {
    font-size: 0.875rem;
    line-height: 1.25rem;
    padding: 0.25rem 0.75rem;
}

.allauth-form .button.prominent,
.allauth-content .button.prominent,
.button.prominent {
    width: 100%;
}

/* Button groups */
.allauth-form .button-group,
.allauth-content .button-group,
.button-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.allauth-form .button-group .button,
.allauth-content .button-group .button,
.button-group .button {
    width: 100%;
}

/* Links */
.allauth-form a,
.allauth-content a,
a {
    color: rgb(37 99 235);
    text-decoration: underline;
}

.allauth-form a:hover,
.allauth-content a:hover,
a:hover {
    color: rgb(29 78 216);
}

.allauth-form a.button,
.allauth-content a.button,
a.button {
    text-decoration: none;
}

/* Messages/Alerts */
.allauth-form .messages,
.allauth-content .messages,
.messages {
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.allauth-form .alert,
.allauth-content .alert,
.alert {
    padding: 1rem;
    border-radius: 0.5rem;
    margin-bottom: 1rem;
}

.allauth-form .alert-success,
.allauth-content .alert-success,
.alert-success {
    background-color: rgb(240 253 244);
    color: rgb(22 101 52);
    border: 1px solid rgb(187 247 208);
}

.allauth-form .alert-error,
.allauth-content .alert-error,
.alert-error {
    background-color: rgb(254 242 242);
    color: rgb(153 27 27);
    border: 1px solid rgb(254 202 202);
}

.allauth-form .alert-info,
.allauth-content .alert-info,
.alert-info {
    background-color: rgb(239 246 255);
    color: rgb(30 64 175);
    border: 1px solid rgb(191 219 254);
}

.allauth-form .alert-warning,
.allauth-content .alert-warning,
.alert-warning {
    background-color: rgb(254 252 232);
    color: rgb(113 63 18);
    border: 1px solid rgb(254 240 138);
}

/* Details/Summary */
.allauth-form details,
.allauth-content details,
details {
    margin-bottom: 1rem;
}

.allauth-form details summary,
.allauth-content details summary,
details summary {
    cursor: pointer;
    color: rgb(37 99 235);
    font-weight: 500;
    padding: 0.5rem 0;
}

.allauth-form details summary:hover,
.allauth-content details summary:hover,
details summary:hover {
    color: rgb(29 78 216);
}

.allauth-form details[open] summary,
.allauth-content details[open] summary,
details[open] summary {
    margin-bottom: 0.5rem;
}

/* Horizontal rule */
.allauth-form hr,
.allauth-content hr,
hr {
    margin: 1.5rem 0;
    border: none;
    border-top: 1px solid rgb(226 232 240);
}

/* Field groups */
.allauth-form .field-group,
.allauth-content .field-group,
.field-group {
    margin-bottom: 1rem;
}

/* Form actions */
.allauth-form .form-actions,
.allauth-content .form-actions,
.form-actions {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid rgb(226 232 240);
}

/* Checkboxes and radio buttons */
.allauth-form input[type="checkbox"],
.allauth-form input[type="radio"],
.allauth-content input[type="checkbox"],
.allauth-content input[type="radio"],
input[type="checkbox"],
input[type="radio"] {
    width: 1rem;
    height: 1rem;
    color: rgb(37 99 235);
    border-color: rgb(203 213 225);
    border-radius: 0.25rem;
}

.allauth-form input[type="checkbox"]:focus,
.allauth-form input[type="radio"]:focus,
.allauth-content input[type="checkbox"]:focus,
.allauth-content input[type="radio"]:focus,
input[type="checkbox"]:focus,
input[type="radio"]:focus {
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

/* Strong text */
.allauth-form strong,
.allauth-content strong,
strong {
    font-weight: 600;
    color: rgb(15 23 42);
}

/* Additional spacing for allauth content */
.allauth-content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}