/**
 * MiraiSidebarLogin - 边栏登录框 / 已登录用户卡片
 *
 * 登录框外观：白底描边输入框 + 蓝/绿并排双按钮。
 * 颜色与圆角都收在 .gt-aside-login-form 的 CSS 变量里，想改配色直接覆盖即可：
 *
 *   .gt-aside-login-form{--mirai-sl-login-bg:#3b7ddd;--mirai-sl-register-bg:#16a34a}
 *
 * 依赖 Mirai 主题 mirai.css 的变量：--gt-main-color、--gt-font-color、--gt-card-bg 等。
 */

/* ===== 卡片容器（沿用主题卡片外观） ===== */
.gt-aside-item.user.gt-aside-login-box,
.gt-aside-item.user.gt-aside-user-card{padding-left:1rem;padding-right:1rem}

.gt-aside-item.user.gt-aside-login-box.has-bg-image,
.gt-aside-item.user.gt-aside-user-card.has-bg-image{padding-top:120px}

.gt-aside-item.user.gt-aside-login-box .gt-aside-user-bg,
.gt-aside-item.user.gt-aside-user-card .gt-aside-user-bg{height:150px}

.gt-aside-item.user.gt-aside-login-box .gt-aside-avatar,
.gt-aside-item.user.gt-aside-user-card .gt-aside-avatar{width:5rem;height:5rem}

.gt-aside-item.user.gt-aside-login-box.has-bg-image .gt-aside-avatar,
.gt-aside-item.user.gt-aside-user-card.has-bg-image .gt-aside-avatar{margin-top:-40px}

/* ===== 登录表单 ===== */
.gt-aside-login-form{
    --mirai-sl-login-bg:#6d89bb;
    --mirai-sl-login-bg-hover:#5f7cae;
    --mirai-sl-register-bg:#5fb878;
    --mirai-sl-register-bg-hover:#52a76a;
    --mirai-sl-field-bg:#ffffff;
    --mirai-sl-field-border:#eeeeee;
    --mirai-sl-field-radius:2px;
    --mirai-sl-icon:#5c5c5c;
    --mirai-sl-placeholder:#9e9e9e;
    --mirai-sl-foot:#9e9e9e;
    --mirai-sl-help-bg:#ffffff;
    --mirai-sl-help-color:#8a8a8a;
    --mirai-sl-tip-bg:#ffffff;
    --mirai-sl-tip-border:#e5e5e5;
    --mirai-sl-tip-color:#4a4a4a;
    display:flex;flex-direction:column;width:100%;margin-top:0.15rem
}

/* --- 输入框：白底 + 1px 描边 --- */
.gt-aside-login-field{position:relative;display:flex;align-items:center;margin:0 0 0.75rem;cursor:text}
.gt-aside-login-field>i{position:absolute;left:0.75rem;z-index:1;font-size:1rem;line-height:1;color:var(--mirai-sl-icon);pointer-events:none;transition:color 0.2s}
.gt-aside-login-field:focus-within>i{color:var(--gt-main-color,#1e80ff)}
.gt-aside-login-field input{display:block;width:100%;height:2.375rem;padding:0 0.75rem 0 2.4rem;font-size:0.875rem;color:var(--gt-font-color,#333);background-color:var(--mirai-sl-field-bg);border:1px solid var(--mirai-sl-field-border);border-radius:var(--mirai-sl-field-radius);outline:none;box-sizing:border-box;transition:border-color 0.2s,box-shadow 0.2s}
.gt-aside-login-field input::placeholder{color:var(--mirai-sl-placeholder);opacity:1}
.gt-aside-login-field input:focus{border-color:var(--gt-main-color,#1e80ff);box-shadow:0 0 0 2px var(--gt-main-color-10,rgba(30,128,255,0.1))}
.gt-aside-login-field input:-webkit-autofill{box-shadow:0 0 0 1000px var(--mirai-sl-field-bg) inset;-webkit-text-fill-color:var(--gt-font-color,#333)}

/* --- 并排双按钮：登录（蓝）/ 注册（绿） --- */
.gt-aside-login-buttons{position:relative;display:flex;gap:0.625rem;width:100%}
.gt-aside-login-submit,.gt-aside-login-register-btn{flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;height:2.375rem;padding:0;border:none;border-radius:var(--mirai-sl-field-radius);font-size:0.9375rem;font-weight:600;line-height:1;color:#fff;text-decoration:none;cursor:pointer;transition:background-color 0.2s,opacity 0.2s}
.gt-aside-login-submit{background-color:var(--mirai-sl-login-bg)}
.gt-aside-login-submit:hover:not(:disabled){background-color:var(--mirai-sl-login-bg-hover)}
.gt-aside-login-submit:disabled{opacity:0.7;cursor:not-allowed}
.gt-aside-login-register-btn{background-color:var(--mirai-sl-register-bg)}
.gt-aside-login-register-btn:hover{background-color:var(--mirai-sl-register-bg-hover)}
/* 悬停时按钮文字保持白色（挑高优先级以压过主题的 a:hover{color:var(--gt-main-color)}） */
.gt-aside-login-submit:hover,.gt-aside-login-register-btn:hover{color:#fff}

/* --- 两按钮交界处的白色「?」帮助按钮（无描边） --- */
.gt-aside-login-help{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;display:flex;align-items:center;justify-content:center;width:1.625rem;height:1.625rem;padding:0;border:none;border-radius:50%;background:var(--mirai-sl-help-bg);color:var(--mirai-sl-help-color);font-size:0.875rem;font-weight:600;line-height:1;text-decoration:none;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,0.12)}
/* 悬停 / 展开都不改字色（挑高优先级以压过主题的 a:hover{color:var(--gt-main-color)}） */
.gt-aside-login-help:hover,.gt-aside-login-help:focus,.gt-aside-login-help[aria-expanded="true"]{color:var(--mirai-sl-help-color)}

/* --- 帮助提示气泡 --- */
.gt-aside-login-help-tip{position:absolute;left:50%;bottom:calc(100% + 0.5rem);transform:translateX(-50%);z-index:3;box-sizing:border-box;width:100%;max-width:15rem;padding:0.5rem 0.625rem;border:1px solid var(--mirai-sl-tip-border);border-radius:var(--mirai-sl-field-radius);background:var(--mirai-sl-tip-bg);color:var(--mirai-sl-tip-color);font-size:0.75rem;line-height:1.6;text-align:left;white-space:pre-line;box-shadow:0 4px 14px rgba(0,0,0,0.14);opacity:0;visibility:hidden;transition:opacity 0.18s,visibility 0.18s;pointer-events:none}
.gt-aside-login-buttons.is-help-open .gt-aside-login-help-tip{opacity:1;visibility:visible;pointer-events:auto}

/* --- 记住登录 / 忘记密码（参考图没有，按选择放在按钮下方做浅灰小字） --- */
.gt-aside-login-foot{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;margin-top:0.75rem}
.gt-aside-login-remember{display:inline-flex;align-items:center;gap:0.375rem;margin:0;font-size:0.75rem;color:var(--mirai-sl-foot);cursor:pointer;user-select:none}
.gt-aside-login-remember input[type="checkbox"]{flex-shrink:0;width:0.8125rem;height:0.8125rem;margin:0;accent-color:var(--mirai-sl-login-bg);cursor:pointer}
.gt-aside-login-link{font-size:0.75rem;color:var(--mirai-sl-foot);text-decoration:none;transition:color 0.2s}
.gt-aside-login-link:hover{color:var(--gt-main-color,#1e80ff);text-decoration:underline}

/* ===== 已登录用户卡片 ===== */
/* 紧凑一点：这个卡片元素比登录框多（头像/昵称/统计/简介/按钮） */
.gt-aside-item.user.gt-aside-user-card{gap:0.625rem}

/* 昵称 + 等级徽章 */
.gt-aside-user-name{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:0.35rem;flex-wrap:wrap}
/* 选择器要压过主题的 .gt-aside-item.user .gt-aside-bio */
.gt-aside-item.user.gt-aside-user-card .gt-aside-bio{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;padding:0 0.25rem;margin-top:0;text-align:center;font-size:.8em}

/* 等级徽章（主题只在文章页/评论区给了样式，这里补一套通用外观） */
.mirai-level-badge.gt-aside-user-level{display:inline-flex;align-items:center;padding:0 0.375rem;border-radius:4px;font-size:0.7rem;font-weight:600;line-height:1.6;color:#fff;background:linear-gradient(135deg,#6c5ce7,#a29bfe)}
.mirai-level-badge.gt-aside-user-level img{display:block;height:1.1em;width:auto}

/* 文章 / 评论 / 点赞 / 收藏 */
.gt-aside-user-stats{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0.375rem;width:100%;margin-top:0.05rem}
.gt-aside-user-stat{display:inline-flex;align-items:center;gap:0.25rem;height:1.5rem;padding:0 0.5rem;border-radius:6px;background:rgba(var(--c),0.12);color:rgb(var(--c));font-size:0.75rem;font-weight:600;line-height:1;text-decoration:none;transition:background-color 0.2s}
a.gt-aside-user-stat:hover{background:rgba(var(--c),0.22)}
.gt-aside-user-stat i{font-size:0.85rem;line-height:1}

/* 主按钮：发布文章（粉）/ 用户中心（蓝），配色取自参考图的双色渐变 */
.gt-aside-user-actions{display:flex;gap:0.5rem;width:100%;margin-top:0.5rem}
.gt-aside-user-action{flex:1 1 0;min-width:0;display:inline-flex;align-items:center;justify-content:center;height:2.25rem;padding:0;border-radius:6px;color:#fff;font-size:0.875rem;font-weight:600;text-decoration:none;transition:filter 0.2s}
/* 悬停不改字色（压过主题的 a:hover{color:var(--gt-main-color)}） */
.gt-aside-user-action:hover{color:#fff;filter:brightness(1.07)}
.gt-aside-user-action-write{background:linear-gradient(90deg,#ff5e7f,#ff8c7e)}
.gt-aside-user-action-center{background:linear-gradient(90deg,#53bdfb,#2e95f8)}

/* 次级入口：管理后台 / 退出登录 */
.gt-aside-user-extra{display:flex;align-items:center;justify-content:center;gap:0.4rem;font-size:0.75rem;line-height:1.4}
.gt-aside-user-extra a{color:var(--gt-text-muted,#9e9e9e);text-decoration:none;transition:color 0.2s}
.gt-aside-user-extra a:hover{color:var(--gt-main-color,#1e80ff)}
.gt-aside-user-extra-sep{color:var(--gt-text-muted,#9e9e9e);opacity:0.6}

/* ===== 深色模式：保留同样的形状，输入框换成深色底 ===== */
[data-theme="dark"] .gt-aside-login-form{
    --mirai-sl-field-bg:#2a2a2a;
    --mirai-sl-field-border:#3a3d40;
    --mirai-sl-icon:#b4b4b4;
    --mirai-sl-placeholder:#8a8a8a;
    --mirai-sl-foot:#8a8a8a;
    --mirai-sl-help-bg:#3a3d40;
    --mirai-sl-help-color:#c9c9c9;
    --mirai-sl-tip-bg:#3a3d40;
    --mirai-sl-tip-border:#54585c;
    --mirai-sl-tip-color:#e8e6e3
}