/* ============================================================
 * MuroJa'ah — assets/css/auth.css
 * Style spesifik halaman login & register
 * ============================================================ */

.auth-container {
    max-width: 460px;
    margin: 2rem auto;
    padding-top: 1rem;
}

.auth-card {
    background: var(--surface);
    border-radius: var(--radius-lg);
    padding: 2rem;
    box-shadow: var(--shadow);
    border: 1px solid var(--border);
}

.auth-header {
    text-align: center;
    margin-bottom: 1.5rem;
}
.auth-title {
    margin: 0 0 .25rem;
    font-size: 1.625rem;
    letter-spacing: -.02em;
}
.auth-subtitle {
    color: var(--text-soft);
    font-size: .9375rem;
    margin: 0;
}

.auth-form .form-group:last-of-type {
    margin-bottom: 1.5rem;
}
.auth-form .alert {
    margin-bottom: 1rem;
}

.auth-footer {
    text-align: center;
    color: var(--text-soft);
    margin: 1.25rem 0 0;
    font-size: .9375rem;
}
.auth-footer a {
    font-weight: 600;
}

/* Loading state pada submit button */
.auth-form .btn[disabled] {
    position: relative;
    color: transparent !important;
}
.auth-form .btn[disabled]::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    width: 18px; height: 18px;
    margin: -9px 0 0 -9px;
    border: 2px solid rgba(255,255,255,.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin .7s linear infinite;
}

@media (max-width: 480px) {
    .auth-container { margin: 1rem auto; }
    .auth-card { padding: 1.5rem; box-shadow: none; border: 0; background: transparent; }
    .auth-title { font-size: 1.375rem; }
}