/* shop-auth.css — màn hình đăng nhập / đăng ký / tài khoản khách hàng. */
.shop-auth-page { padding: 40px 0 64px; }
.shop-auth-head { max-width: 460px; margin: 0 auto 24px; text-align: center; }
.shop-auth-head h1 { font-size: clamp(26px, 3.4vw, 34px); margin: 0 0 8px; }
.shop-auth-head p { color: #666; margin: 0; font-size: 15px; }

.shop-auth {
    max-width: 460px; margin: 0 auto; background: #fff; border: 1px solid #ffe0ec;
    border-radius: 18px; padding: 28px 28px 30px; box-shadow: 0 20px 55px rgba(255,77,141,.09);
}
.shop-auth-tabs { display: flex; gap: 0; margin-bottom: 22px; border: 1px solid #ffe0ec; border-radius: 999px; overflow: hidden; }
.shop-auth-tab { flex: 1; padding: 12px; background: #fff; border: none; cursor: pointer; font-size: 15px; font-weight: 700; color: #666; transition: background .2s, color .2s; }
.shop-auth-tab:hover { color: #ff4d8d; }

/* Chuyển tab bằng thuộc tính data-tab trên .shop-auth */
.shop-auth-form { display: none; flex-direction: column; gap: 14px; }
.shop-auth[data-tab="login"]    .shop-auth-login    { display: flex; }
.shop-auth[data-tab="register"] .shop-auth-register { display: flex; }
.shop-auth[data-tab="login"]    .shop-auth-tab[data-go="login"],
.shop-auth[data-tab="register"] .shop-auth-tab[data-go="register"] { background: #ff4d8d; color: #fff; }

.shop-auth-form label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 600; color: #333; }
.shop-auth-form label small { font-weight: 400; color: #999; }
.shop-auth-form input[type="text"],
.shop-auth-form input[type="email"],
.shop-auth-form input[type="password"] {
    padding: 11px 14px; border: 1px solid #ddd; border-radius: 10px; font-size: 15px; font-weight: 400; box-sizing: border-box;
}
.shop-auth-form input:focus { outline: none; border-color: #ff4d8d; box-shadow: 0 0 0 3px rgba(255,77,141,.15); }
.shop-auth-remember { flex-direction: row !important; align-items: center; gap: 8px !important; font-weight: 400 !important; }

.shop-auth-submit {
    display: inline-block; text-align: center; padding: 13px; border: none; border-radius: 999px;
    background: #ff4d8d; color: #fff; font-weight: 700; font-size: 16px; cursor: pointer; transition: background .2s;
}
.shop-auth-submit:hover { background: #e63c78; color: #fff; }

/* Honeypot chống bot: ẩn khỏi mắt người + trợ năng, vẫn hiện với bot điền tự động. */
.shop-auth-hp { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }

.shop-auth-alert { padding: 11px 14px; border-radius: 10px; font-size: 14px; margin-bottom: 16px; }
.shop-auth-alert.err { background: #fdecec; color: #b32d2e; border: 1px solid #f5c2c0; }
.shop-auth-alert.ok  { background: #e8f7ee; color: #1a7f37; border: 1px solid #b7e4c7; }

.shop-auth-or { display: flex; align-items: center; text-align: center; margin: 20px 0; color: #aaa; font-size: 13px; }
.shop-auth-or::before, .shop-auth-or::after { content: ""; flex: 1; height: 1px; background: #eee; }
.shop-auth-or span { padding: 0 12px; }

.shop-auth-oauth { display: flex; flex-direction: column; gap: 10px; }
.shop-oauth-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    padding: 11px; border: 1px solid #ddd; border-radius: 10px; background: #fff; color: #333;
    font-size: 15px; font-weight: 600; text-decoration: none; transition: background .2s, border-color .2s;
}
.shop-oauth-btn:hover { background: #faf7f9; border-color: #ff4d8d; color: #333; }
.shop-oauth-btn svg { flex: 0 0 auto; }

/* Bảng tài khoản */
.shop-account {
    max-width: 480px; margin: 0 auto; background: #fff; border: 1px solid #ffe0ec;
    border-radius: 18px; padding: 30px 28px; box-shadow: 0 20px 55px rgba(255,77,141,.09);
}
.shop-account h2 { font-size: 24px; margin: 0 0 18px; }
.shop-account-info { list-style: none; padding: 0; margin: 0 0 24px; display: flex; flex-direction: column; gap: 10px; }
.shop-account-info li { background: #fff7fb; border: 1px solid #ffe0ec; border-radius: 10px; padding: 11px 14px; font-size: 15px; }

/* Link tài khoản trên header (dùng chung style .shop-hd-act của theme) */
.shop-hd-account svg { display: block; }
