/* =========================================================================
   站点零散组件统一（子主题）
   1) 「加载更多」按钮        2) 评论区「快捷登录」按钮
   3) 注册页协议复选框        4) 右下浮动按钮组
   5) 正文底部圆形操作按钮
   ========================================================================= */

/* ---------- 1) 加载更多：白底描边胶囊 ---------- */
button.btn.btn-sm.btn-outline-primary {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    height: 40px !important;
    padding: 0 26px !important;
    line-height: 1 !important;
    border-radius: 999px !important;
    border: 1px solid #e5e8ed !important;
    background: #fff !important;
    color: #46515f !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    letter-spacing: .01em;
    box-shadow: 0 8px 18px -14px rgba(16, 24, 40, .35);
    transition: transform .28s cubic-bezier(.2, .8, .2, 1), background .18s ease, color .18s ease, border-color .18s ease, box-shadow .28s ease;
}

button.btn.btn-sm.btn-outline-primary:hover {
    background: #eefaf2 !important;
    border-color: #bfe8d0 !important;
    color: #1f8a4c !important;
    transform: translateY(-2px);
    box-shadow: 0 14px 24px -16px rgba(35, 165, 88, .55);
}

button.btn.btn-sm.btn-outline-primary:active {
    transform: translateY(0) scale(.97);
}

/* ---------- 2) 评论区「快捷登录」：与发布评论同款胶囊 ---------- */
button.btn.btn-primary.btn-ssm.pk-modal-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    padding: 0 24px !important;
    line-height: 1 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #34c96f, #23a558) !important;
    color: #fff !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    box-shadow: 0 12px 24px -14px rgba(35, 165, 88, .8), inset 0 1px 0 rgba(255, 255, 255, .22) !important;
    transition: transform .28s cubic-bezier(.2, .8, .2, 1), filter .2s ease, box-shadow .28s ease;
}

button.btn.btn-primary.btn-ssm.pk-modal-toggle:hover {
    transform: translateY(-2px);
    filter: brightness(1.06);
    box-shadow: 0 18px 30px -14px rgba(35, 165, 88, .9), inset 0 1px 0 rgba(255, 255, 255, .26) !important;
}

button.btn.btn-primary.btn-ssm.pk-modal-toggle:active {
    transform: translateY(0) scale(.98);
}

/* ---------- 3) 注册页协议复选框：自定义方框 + 绿底白勾 ---------- */
.pkr-agree input[type="checkbox"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    position: relative;
    flex: none;
    width: 18px !important;
    height: 18px !important;
    margin: 1px 0 0 !important;
    border: 1.5px solid #cfd6dd !important;
    border-radius: 6px !important;
    background: #fff !important;
    cursor: pointer;
    transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.pkr-agree input[type="checkbox"]:hover {
    border-color: #34c96f !important;
}

.pkr-agree input[type="checkbox"]:checked {
    background: linear-gradient(180deg, #34c96f, #23a558) !important;
    border-color: #23a558 !important;
}

.pkr-agree input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    left: 5px;
    top: 1.5px;
    width: 4.5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.pkr-agree input[type="checkbox"]:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(52, 201, 111, .22);
}

/* ---------- 4) 右下浮动按钮组 ---------- */
#rb-float-actions > div {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 999px !important;
    border: 1px solid #e9ecef !important;
    background: #fff !important;
    color: #6b7684 !important;
    box-shadow: 0 10px 22px -16px rgba(16, 24, 40, .5);
    cursor: pointer;
    transition: transform .26s cubic-bezier(.2, .8, .2, 1), background .18s ease, color .18s ease, border-color .18s ease;
}

#rb-float-actions > div + div {
    margin-top: 8px !important;
}

#rb-float-actions > div i {
    font-size: 14px !important;
    color: inherit !important;
}

#rb-float-actions > div:hover {
    background: #eefaf2 !important;
    border-color: #bfe8d0 !important;
    color: #1f8a4c !important;
    transform: translateY(-2px);
}

#rb-float-actions > div:active {
    transform: translateY(0) scale(.94);
}

/* ---------- 5) 正文底部圆形操作按钮（分享/点赞/收藏） ---------- */
.post-action-content .circle-button {
    width: 44px !important;
    height: 44px !important;
    border-radius: 999px !important;
    background: #fff !important;
    border: 1px solid #e9ecef !important;
    color: #6b7684 !important;
    box-shadow: 0 10px 22px -16px rgba(16, 24, 40, .45);
    transition: transform .26s cubic-bezier(.2, .8, .2, 1), background .18s ease, color .18s ease, border-color .18s ease;
}

.post-action-content .circle-button i {
    font-size: 15px !important;
    color: inherit !important;
}

.post-action-content .circle-button:hover {
    background: #eefaf2 !important;
    border-color: #bfe8d0 !important;
    color: #1f8a4c !important;
    transform: translateY(-2px);
}

.post-action-content .circle-button:active {
    transform: translateY(0) scale(.94);
}

/* ---------- 暗色模式 ---------- */
html[data-bs-theme="dark"] button.btn.btn-sm.btn-outline-primary,
body.dark button.btn.btn-sm.btn-outline-primary {
    background: #262c33 !important;
    border-color: #333b44 !important;
    color: #c3ccd6 !important;
}

html[data-bs-theme="dark"] button.btn.btn-sm.btn-outline-primary:hover,
body.dark button.btn.btn-sm.btn-outline-primary:hover {
    background: #1f3a2a !important;
    border-color: #2f6b47 !important;
    color: #6fdd9b !important;
}

html[data-bs-theme="dark"] #rb-float-actions > div,
html[data-bs-theme="dark"] .post-action-content .circle-button,
body.dark #rb-float-actions > div,
body.dark .post-action-content .circle-button {
    background: #262c33 !important;
    border-color: #333b44 !important;
    color: #b6c0cb !important;
}

html[data-bs-theme="dark"] #rb-float-actions > div:hover,
html[data-bs-theme="dark"] .post-action-content .circle-button:hover,
body.dark #rb-float-actions > div:hover,
body.dark .post-action-content .circle-button:hover {
    background: #1f3a2a !important;
    border-color: #2f6b47 !important;
    color: #6fdd9b !important;
}

html[data-bs-theme="dark"] .pkr-agree input[type="checkbox"],
body.dark .pkr-agree input[type="checkbox"] {
    background: #23282e !important;
    border-color: #3d4650 !important;
}

/* ---------- 移动端 ---------- */
@media (max-width: 575.98px) {
    button.btn.btn-sm.btn-outline-primary {
        height: 38px !important;
        padding: 0 22px !important;
    }

    #rb-float-actions > div {
        width: 36px !important;
        height: 36px !important;
    }

    .post-action-content .circle-button {
        width: 40px !important;
        height: 40px !important;
    }
}