/* ===== Tài khoản / đăng nhập (quay.com.vn) ===== */
.qm-auth{max-width:560px;margin:30px auto 60px;padding:0 4px}
.qm-auth--narrow{max-width:460px}
.qm-auth__h1{font-size:28px;font-weight:700;color:#1f2328;margin:0 0 6px;text-align:center}
.qm-auth__intro{text-align:center;color:#6b7280;margin-bottom:18px}
.qm-auth__intro p{margin:6px 0 0;line-height:1.6}
.qm-card{background:#fff;border:1px solid #e7e7ea;border-radius:18px;padding:22px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 12px 32px -8px rgba(16,24,40,.10)}
.qm-tabs{display:flex;gap:6px;padding:4px;background:#f3f4f6;border-radius:12px;margin-bottom:18px}
.qm-tab{flex:1;text-align:center;padding:10px;border-radius:9px;font-weight:700;color:#6b7280;text-decoration:none}
.qm-tab.is-active{background:#fff;color:#D7382E;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.qm-form{display:flex;flex-direction:column;gap:14px}
.qm-form[hidden]{display:none}
.qm-field{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:#4b5563}
.qm-field small{font-weight:400;color:#9ca3af}
.qm-field input,.qm-resend input{height:46px;padding:0 14px;border:1px solid #e3e3e8;border-radius:10px;background:#f7f7f9;font-size:15px;color:#1f2328;transition:border-color .15s,box-shadow .15s,background .15s;width:100%}
.qm-field input:focus,.qm-resend input:focus{outline:0;border-color:#D7382E;background:#fff;box-shadow:0 0 0 4px rgba(215,56,46,.14)}
.qm-pass{position:relative;display:block}
.qm-pass input{padding-right:46px}
.qm-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:0;background:none;color:#9ca3af;cursor:pointer;border-radius:8px;display:flex;align-items:center;justify-content:center}
.qm-eye:hover,.qm-eye.is-on{color:#D7382E;background:#fdecea}
.qm-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.qm-grid2{grid-template-columns:1fr}}
.qm-row{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px}
.qm-row a,.qm-muted a,.qm-check a,.qm-link{color:#D7382E;font-weight:600;text-decoration:none}
.qm-check{display:flex;align-items:flex-start;gap:8px;font-size:14px;color:#374151;cursor:pointer;line-height:1.5}
.qm-check input{width:18px;height:18px;accent-color:#D7382E;margin-top:2px;flex:0 0 18px}
.qm-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border:1px solid #e3e3e8;border-radius:12px;background:#fff;color:#1f2328;font-size:15px;font-weight:700;cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s,color .15s}
.qm-btn:hover{border-color:#D7382E;color:#D7382E}
.qm-btn--primary{background:#D7382E;border-color:#D7382E;color:#fff;box-shadow:0 6px 16px -6px rgba(215,56,46,.6)}
.qm-btn--primary:hover{background:#bf2f26;color:#fff}
.qm-btn--block{width:100%}
.qm-muted{color:#6b7280;font-size:14px;margin:0;line-height:1.6}
.qm-center{text-align:center}
.qm-mt{margin-top:10px}
.qm-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.qm-steps{margin:4px 0 0;padding:12px 14px 12px 34px;background:#f7f7f9;border-radius:12px;color:#4b5563;font-size:13.5px;line-height:1.7}
.qm-steps li{list-style:decimal !important}
.qm-alert{padding:12px 14px;border-radius:12px;margin:0 0 14px;font-size:14.5px;line-height:1.5;border:1px solid}
.qm-alert--success{background:#ecfdf3;border-color:#abefc6;color:#067647}
.qm-alert--error{background:#fef3f2;border-color:#fecdca;color:#b42318}
.qm-alert--warning{background:#fffaeb;border-color:#fedf89;color:#b54708}
.qm-resend{margin-top:14px;display:flex;flex-direction:column;gap:10px;font-size:14px}
.qm-resend__row{display:flex;gap:8px}
.qm-resend__row .qm-btn{flex:0 0 auto;height:46px}
@media (max-width:520px){.qm-resend__row{flex-direction:column}}

/* trang tài khoản */
.qm-account{max-width:1000px;margin:30px auto 60px}
.qm-account__head{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.qm-account__name{font-size:24px;font-weight:700;margin:0;color:#1f2328}
.qm-account__logout{margin-left:auto}
.qm-avatar{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#D7382E,#f59e0b);color:#fff;font-size:24px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 56px}
.qm-account__grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:760px){.qm-account__grid{grid-template-columns:1fr}.qm-account__head{flex-wrap:wrap}}
.qm-h2{font-size:18px;font-weight:700;margin:0 0 2px;color:#1f2328}
.qm-plan{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.qm-plan__label{font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:#9ca3af}
.qm-plan__name{font-size:26px;font-weight:700;color:#1f2328}
.qm-plan--vip .qm-plan__name{color:#b45309}
.qm-plan--super .qm-plan__name{background:linear-gradient(90deg,#D7382E,#7d15ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.qm-plan--vip{background:linear-gradient(135deg,#fffbeb,#fff)}
.qm-plan--super{background:linear-gradient(135deg,#fdf2f8,#f5f3ff)}
.qm-plan__meta{font-size:14px;color:#4b5563}
.qm-plan__pending{padding:8px 12px;border-radius:10px;background:#fffaeb;color:#b54708;font-size:14px;border:1px solid #fedf89}
.qm-plans{display:grid;gap:10px}
.qm-plancard{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid #e3e3e8;border-radius:12px;cursor:pointer}
.qm-plancard input{accent-color:#D7382E;margin-top:4px}
.qm-plancard b{display:block;color:#1f2328}
.qm-plancard small{display:block;color:#6b7280;font-size:13px;line-height:1.5}
.qm-plancard:has(input:checked){border-color:#D7382E;background:#fff7f6}
.qm-plancard:has(input:disabled){opacity:.5;cursor:not-allowed}


/* Hộp liên hệ nâng cấp VIP */
.qm-contact{border:1.5px solid #fcd34d;background:linear-gradient(180deg,#fffbeb,#fff 55%)}
.qm-contact__plans{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0 14px}
.qm-contact__plans div{background:#fff;border:1px solid #f3e8c4;border-radius:12px;padding:10px 12px;font-size:14px}
.qm-contact__plans small{display:block;color:#6b7280;font-size:12.5px;line-height:1.5;margin-top:3px}
.qm-contact__act{display:flex;gap:8px;flex-wrap:wrap}
.qm-contact__act svg{margin-right:4px;vertical-align:-3px}
.qsm .qm-contact{margin:0 0 16px}
@media (max-width:600px){.qm-contact__plans{grid-template-columns:1fr}.qm-contact__act .qm-btn{flex:1 1 100%}}