/* Auth / Login page styles
   Purpose: separate, extendable styles for the login page.
   Keep styles minimal and compatible with Tailwind utility classes already used.
*/

:root{
    --primary:#2563eb; /* blue-600 */
    --primary-600: #1d4ed8;
    --muted:#6b7280;
}

/* Button primary style reused on login page */
.btn-primary{
    background:var(--primary);
    color:#fff;
    padding:0.6rem 0.9rem;
    border-radius:0.65rem;
    font-weight:600;
    box-shadow:0 6px 18px rgba(37,99,235,0.15);
    transition:all .18s ease-in-out;
}
.btn-primary:hover{background:var(--primary-600); transform:translateY(-1px)}
.btn-primary:active{transform:translateY(0)}

/* Input base to provide consistent appearance */
.input-base{
    display:block;
    width:100%;
    padding:0.62rem 0.75rem;
    border-radius:0.5rem;
    border:1px solid #eef2f6;
    background:#ffffff;
    color:#111827;
    font-size:0.92rem;
    box-shadow:inset 0 1px 0 rgba(16,24,40,0.03);
    transition:border-color .12s ease, box-shadow .12s ease;
}
.input-base:focus{outline:none; border-color:var(--primary); box-shadow:0 6px 18px rgba(37,99,235,0.06)}

/* Responsive wrapper smaller on large screens */
@media(min-width:768px){
    .max-w-md{max-width:520px}
}

/* Helpers */
.text-muted{color:var(--muted)}

/* Keep footer legal small */
.auth-legal{font-size:0.72rem; color:#9ca3af}