:root{
    --dd-ink:#1A0F5E;
    --dd-primary:#4C32DF;
    --dd-primary-dark:#3D21DD;
    --dd-primary-deep:#241478;
    --dd-tint:#EDEBFB;
    
    --dd-line:#DCD6F7;
    --dd-body:#fbfdff;
    --dd-muted:#5B5B8C;
    --dd-danger:#e5484d;
}

.dd-auth-page{
    background:
        radial-gradient(1100px 420px at 50% -140px, #F0EDFE 0%, rgba(234,243,255,0) 68%),
        var(--dd-body);
    min-height:60vh;
    padding:52px 24px 72px;
    display:flex;
    align-items:flex-start;
    justify-content:center;
}
.dd-auth-wrap{width:100%;max-width:666px}

/* ---------- 卡片 ---------- */
.dd-auth-card{
    background:#fff;
    border:1px solid #e9eef7;
    border-radius:12px;
    box-shadow:0 18px 48px rgba(3,18,66,.10);
    padding:34px 40px 38px;
}
.dd-auth-card--wide{max-width:100%}

/* ---------- 标题区 ---------- */
.dd-auth-head{text-align:center;margin-bottom:26px;position:relative}
.dd-auth-title{
    font-size:24px;font-weight:600;color:var(--dd-ink);
    letter-spacing:-.3px;line-height:1.3;
}
.dd-auth-head-sub{
    font-size:13.5px;color:var(--dd-muted);margin-top:9px;
}
.dd-auth-head-sub a{color:var(--dd-primary-dark);font-weight:600;text-decoration:none}
.dd-auth-head-sub a:hover{text-decoration:underline}

/* ---------- 选项卡 ---------- */
.dd-auth-tabs{
    display:flex;gap:4px;border-bottom:0.8px solid rgba(33,38,32,.12);
    margin:0 0 26px;
}
.dd-auth-tab{
    appearance:none;background:none;border:none;font-family:inherit;
    font-size:14px;font-weight:600;color:var(--dd-muted);
    padding:11px 20px;cursor:pointer;position:relative;
    transition:color .16s;
}
.dd-auth-tab:hover{color:var(--dd-ink)}
.dd-auth-tab.is-active{color:var(--dd-ink)}
.dd-auth-tab.is-active::after{
    content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;
    background:var(--dd-primary);border-radius:2px 2px 0 0;
}

/* ---------- 表单 ---------- */
.dd-form{margin:0}
.dd-row{display:flex;gap:16px}
.dd-row > *{flex:1;min-width:0}

.dd-input-group{margin-bottom:18px}
.dd-input-label{
    display:flex;align-items:baseline;justify-content:space-between;gap:12px;
    font-size:14.5px;font-weight:500;color:var(--dd-ink);margin-bottom:8px;
}
.dd-input-label a{
    font-size:13px;font-weight:500;color:var(--dd-primary-dark);text-decoration:none;
}
.dd-input-label a:hover{text-decoration:underline}
.dd-input-label .dd-opt{font-size:12.5px;font-weight:400;color:#8A84B5}

.dd-input{
    width:100%;height:46px;padding:0 15px;font-size:15px;font-family:inherit;
    color:var(--dd-ink);background:#fff;
    border:0.8px solid var(--dd-line);border-radius:6px;outline:none;
    transition:border-color .15s,box-shadow .15s;
}
.dd-input::placeholder{color:#A5A0C8}
.dd-input:focus{border-color:var(--dd-primary);box-shadow:0 0 0 3px rgba(0,150,247,.12)}
.dd-input:disabled{background:#f4f7fc;color:#8A84B5}
select.dd-input{cursor:pointer;appearance:none;
    background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b6b8c' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 14px center;background-size:14px;
    padding-right:38px;}

/* 密码框 + 眼睛按钮 */
.dd-input-pass{position:relative}
.dd-input-pass .dd-input{padding-right:46px}
.dd-eye{
    position:absolute;right:6px;top:50%;transform:translateY(-50%);
    width:34px;height:34px;border:none;background:none;cursor:pointer;
    color:#8A84B5;display:flex;align-items:center;justify-content:center;border-radius:8px;
    transition:color .15s,background .15s;
}
.dd-eye:hover{color:var(--dd-ink);background:#F4F1FE}

/* 浮动标签（注册页，复刻 Dynadot 表单行） */
.dd-float{position:relative;margin-bottom:20px}
.dd-float .dd-input{height:52px;padding:20px 15px 6px}
.dd-float > label{
    position:absolute;left:15px;top:16px;font-size:14.5px;color:rgba(3,18,66,.62);
    pointer-events:none;transition:top .15s,font-size .15s,color .15s;
    background:transparent;
}
.dd-float .dd-input:focus ~ label,
.dd-float .dd-input:not(:placeholder-shown) ~ label,
.dd-float .dd-input.has-value ~ label{
    top:8px;font-size:11.5px;color:var(--dd-primary);
}
.dd-float .dd-input:focus ~ label{color:var(--dd-primary)}
.dd-float select.dd-input ~ label{top:8px;font-size:11.5px}
.dd-help{font-size:12px;color:#8A84B5;margin-top:6px;line-height:1.55}

/* ---------- 按钮 ---------- */
.dd-btn{
    display:inline-flex;align-items:center;justify-content:center;gap:9px;
    width:100%;height:46px;padding:0 20px;font-size:15.5px;font-weight:600;
    font-family:inherit;border:none;border-radius:60px;cursor:pointer;
    text-decoration:none;transition:background .16s,box-shadow .16s,opacity .16s;
}
.dd-btn-primary{background:var(--dd-ink);color:#fff;box-shadow:0 10px 22px rgba(3,18,66,.18)}
.dd-btn-primary:hover{background:#241478;color:#fff}
.dd-btn-primary:disabled{opacity:.55;cursor:not-allowed}
.dd-btn-block{width:100%}
.dd-btn-blue{background:var(--dd-primary);color:#fff}
.dd-btn-blue:hover{background:var(--dd-primary-dark);color:#fff}

/* ---------- 分隔线 ---------- */
.dd-divider{
    display:flex;align-items:center;gap:12px;
    margin:22px 0 18px;font-size:13.5px;color:#A5A0C8;
}
.dd-divider::before,.dd-divider::after{content:"";flex:1;height:1px;background:#EEEBFB}

/* ---------- 第三方登录 ---------- */
.dd-sso{display:flex;gap:14px}
.dd-sso-btn{
    flex:1;display:inline-flex;align-items:center;justify-content:center;gap:10px;
    height:44px;padding:0 16px;font-size:14.5px;font-weight:500;font-family:inherit;
    color:#1A0F5E;background:#fff;border:0.8px solid var(--dd-line);border-radius:8px;
    text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s;
}
.dd-sso-btn:hover{background:#F8F6FE;border-color:#b9c6d9}
/* 未配置的第三方登录：保持版式但不可点，避免死链 */
.dd-sso-btn.is-off{color:#A5A0C8;cursor:not-allowed;background:#F8F6FE}
.dd-sso-btn.is-off:hover{background:#F8F6FE;border-color:var(--dd-line)}
.dd-sso-btn.is-off svg{opacity:.45}

/* ---------- 提示 / 错误 ---------- */
.dd-alert{
    display:flex;gap:10px;align-items:flex-start;
    padding:12px 15px;border-radius:8px;font-size:13.5px;line-height:1.6;
    background:#fef2f2;border:1px solid #fecaca;color:#B91C4C;margin-bottom:20px;
}
.dd-alert ul{margin:0;padding-left:17px}
.dd-alert--ok{background:#f0fdf4;border-color:#bbf7d0;color:#15803d}

/* ---------- 复选框 ---------- */
.dd-check{
    display:flex;align-items:flex-start;gap:9px;
    font-size:13.5px;line-height:1.6;color:#4A4A7A;
    margin-bottom:14px;cursor:pointer;
}
.dd-check input{
    width:16px;height:16px;margin:2px 0 0;flex-shrink:0;
    accent-color:var(--dd-primary);cursor:pointer;
}
.dd-check a{color:var(--dd-primary-dark);font-weight:600;text-decoration:none}
.dd-check a:hover{text-decoration:underline}

/* ---------- 分节标题（账单地址） ---------- */
.dd-section{
    margin:26px 0 18px;padding-top:22px;border-top:1px solid #F1EEFE;
}
.dd-section-title{font-size:15.5px;font-weight:600;color:var(--dd-ink)}
.dd-section-hint{font-size:12.5px;color:var(--dd-muted);margin-top:4px}

/* ---------- 注册页加宽 ---------- */
.dd-auth-wrap--wide{max-width:820px}

/* ---------- 兼容 client.partials.billing-address-fields 的类名 ----------
   该 partial 复用管理端/客户端的 .form-group / .form-label / .form-control，
   认证页没有加载那套样式，这里补上，使其与 Dynadot 输入框视觉一致。 */
.dd-auth-card .form-group{margin-bottom:20px;flex:1;min-width:0}
.dd-auth-card .form-label{
    display:block;font-size:14.5px;font-weight:500;color:var(--dd-ink);margin-bottom:8px;
}
.dd-auth-card .form-label .req,.dd-auth-card .req{color:var(--dd-danger);margin-left:2px}
.dd-auth-card .form-control{
    width:100%;height:46px;padding:0 15px;font-size:15px;font-family:inherit;
    color:var(--dd-ink);background:#fff;
    border:0.8px solid var(--dd-line);border-radius:6px;outline:none;
    transition:border-color .15s,box-shadow .15s;
}
.dd-auth-card .form-control:focus{border-color:var(--dd-primary);box-shadow:0 0 0 3px rgba(0,150,247,.12)}
.dd-auth-card select.form-control{
    cursor:pointer;appearance:none;padding-right:38px;
    background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b6b8c' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 14px center;background-size:14px;
}
.dd-auth-card .text-danger{color:var(--dd-danger);font-size:12.5px;margin-top:5px}
.dd-auth-card .text-muted{color:#8A84B5;font-size:12px;display:block;margin-top:5px}
.dd-auth-card small{font-size:12px}

/* ---------- 响应式 ---------- */
@media(max-width:640px){
    .dd-auth-page{padding:30px 16px 52px}
    .dd-auth-card{padding:26px 22px 30px;border-radius:10px}
    .dd-auth-title{font-size:21px}
    .dd-row{flex-direction:column;gap:10px}
    .dd-row>.dd-btn,.dd-row>button.dd-btn,.dd-row>.pn-btn{width:100%;flex:0 0 auto;height:44px;min-height:44px}
    .dd-sso{flex-direction:column;gap:10px}
    .dd-sso-btn{flex:0 0 auto;height:44px;min-height:44px;width:100%}
    /* 小号文字链接在触屏上补足可点区域 */
    .dd-auth-head-sub a,.dd-input-label a{display:inline-block;padding:6px 2px;min-height:28px;line-height:1.5}
}

/* ---------- 暗色 ---------- */
:root[data-theme="dark"] .dd-auth-page{background:#0F0A2E !important}
:root[data-theme="dark"] .dd-auth-card{background:#171040 !important;border-color:#2A2060 !important;box-shadow:0 18px 48px rgba(0,0,0,.5) !important}
:root[data-theme="dark"] .dd-auth-title,
:root[data-theme="dark"] .dd-input-label,
:root[data-theme="dark"] .dd-section-title{color:#F3F0FF !important}
:root[data-theme="dark"] .dd-auth-head-sub,
:root[data-theme="dark"] .dd-section-hint,
:root[data-theme="dark"] .dd-help,
:root[data-theme="dark"] .dd-check{color:#9A93C7 !important}
:root[data-theme="dark"] .dd-input{background:#1D1550 !important;border-color:#302568 !important;color:#DCD6F7 !important}
:root[data-theme="dark"] .dd-float > label{color:#9A93C7 !important}
:root[data-theme="dark"] .dd-sso-btn{background:#1D1550 !important;border-color:#302568 !important;color:#DCD6F7 !important}
:root[data-theme="dark"] .dd-divider::before,
:root[data-theme="dark"] .dd-divider::after{background:#2A2060 !important}
:root[data-theme="dark"] .dd-section{border-top-color:#2A2060 !important}
:root[data-theme="dark"] .dd-auth-tabs{border-bottom-color:#2A2060 !important}
:root[data-theme="dark"] .dd-auth-card .form-control{background:#1D1550 !important;border-color:#302568 !important;color:#DCD6F7 !important}
:root[data-theme="dark"] .dd-auth-card .form-label{color:#F3F0FF !important}
:root[data-theme="dark"] .dd-qr-box{background:#1D1550 !important;border-color:#302568 !important}
/* 暗色下选项卡与主按钮需重新取色，否则深蓝字压在深底上几乎看不见 */
:root[data-theme="dark"] .dd-auth-tab{color:#9A93C7 !important}
:root[data-theme="dark"] .dd-auth-tab:hover{color:#DCD6F7 !important}
:root[data-theme="dark"] .dd-auth-tab.is-active{color:#F3F0FF !important}
:root[data-theme="dark"] .dd-btn-primary{background:#4C32DF !important;color:#fff !important;box-shadow:0 10px 22px rgba(0,150,247,.22) !important}
:root[data-theme="dark"] .dd-btn-primary:hover{background:#3D21DD !important}
:root[data-theme="dark"] .dd-eye{color:#9A93C7 !important}
:root[data-theme="dark"] .dd-eye:hover{color:#F3F0FF !important;background:#241A5C !important}
:root[data-theme="dark"] .dd-sso-btn.is-off{background:#16103C !important;color:#5B5B8C !important;border-color:#201850 !important}
:root[data-theme="dark"] .dd-alert{background:#3b1218 !important;border-color:#7f1d1d !important;color:#fca5a5 !important}

/* dsh-mobile-adapt-4：本表只被登录/注册/找回密码页引用，故选择器可放宽。
   手机端输入控件字号 ≥16px，避免 iOS 聚焦时自动放大页面。 */
@media(max-width:640px){
    input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="file"]),
    select,textarea{font-size:16px !important}
}
