/* --- Layout Utama Halaman Form --- */
.container {
    background: var(--bg-card); padding: 1.5rem; border-radius: var(--border-radius);
    box-shadow: var(--shadow); border: 1px solid var(--border);
    width: 100%; max-width: 500px; margin: auto; flex-shrink: 0;
}

/* --- Header Form --- */
.header { text-align: center; margin-bottom: 2rem; }
.header h1 { font-size: 1.8rem; font-weight: 600; margin-bottom: 0.5rem; color: var(--text-subtle); }
.header .logo { font-weight: 700; color: var(--accent-primary); }
.header p { color: var(--text-muted); }

/* --- Grup Form & Input --- */
.form-group { margin-bottom: 1.25rem; text-align: left; }
.form-group label { display: block; margin-bottom: 0.5rem; font-weight: 500; font-size: 0.9rem; color: var(--text-muted); }
.form-group input {
    width: 100%; padding: 12px 15px; border: 1px solid var(--border); border-radius: 8px;
    font-family: 'Poppins', sans-serif; font-size: 1rem; background-color: var(--bg-input);
    color: var(--text-main); transition: all 0.2s;
}
.form-group input:focus {
    outline: none; border-color: var(--accent-primary);
    box-shadow: 0 0 0 4px rgba(136, 192, 208, 0.2);
}

/* --- Tombol Universal --- */
button {
    width: 100%; padding: 14px; background: var(--accent-primary); color: var(--bg-main);
    border: none; border-radius: 8px; cursor: pointer; font-size: 1rem; font-weight: 600;
    font-family: 'Poppins', sans-serif; transition: all 0.2s ease-in-out;
}
button:hover { background: var(--accent-primary-hover); transform: translateY(-2px); box-shadow: 0 4px 15px rgba(0,0,0,0.2); }
button:disabled { background-color: #555; color: var(--text-muted); cursor: not-allowed; transform: none; }

/* --- Tautan Helper --- */
.helper-text { margin-top: 1.5rem; font-size: 0.9rem; text-align: center; }
.helper-text a { color: var(--accent-primary); text-decoration: none; font-weight: 500; }

/* --- Penyesuaian untuk Layar Besar --- */
@media (min-width: 768px) {
    .container { padding: 2.5rem 3rem; }
    .header h1 { font-size: 2.2rem; }
}