@charset "UTF-8";
div,form,input,img{
    margin: 0;
}
@import url('/photo/css/design-tokens.css');
/* Minimal, clean form styles */
.form{
    max-width: 760px;
    margin: 2rem auto;
    padding: 1rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    align-items: start;
}
.form-login{
    background: var(--surface);
    padding: 1rem;
    border-radius: var(--radius);
    box-shadow: 0 6px 18px var(--shadow);
}
.form-login-title{
    font-weight: 600;
    padding-bottom: 0.5rem;
}
.form-inner{ display: block; }
.form-lavel{ display: block; margin: 0.4rem 0 0.2rem; font-size: 0.95rem; }
.form-text{ width: 100%; padding: 0.75rem; border: 1px solid var(--border); border-radius: 8px; box-sizing: border-box; background:var(--card); color:var(--text); }
.submit{ margin-top: 0.8rem; padding: 12px 14px; background:var(--accent); color:#fff; border:none; border-radius:8px; cursor:pointer; font-weight:700}
.login-padding{ height: 0.75rem; }
.login-button{ margin: 0.5rem 0; }

/* unified social buttons */
.social-btn{
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 0.9rem;
    border-radius: 8px;
    color: #fff;
    text-decoration: none;
    font-weight: 700;
}
.social-btn img.img-login{ width: 20px; height: 20px; }
.social-btn.google{ background: #fff; color:#222; border:1px solid #ddd; }
.social-btn.line{ background: #06c755; }
.social-btn.yahoo{ background: #ff0033; }

@media (max-width: 700px){
    .form{ grid-template-columns: 1fr; padding: 0.5rem; }
    .submit{width:100%;display:block}
    .social-btn{width:100%;justify-content:center}
}