/* 보드팩토리 외부 로그인 스킨 — 공통 UI 는 theme/boardfactory/css/skin.css */
.bfk-outlogin { padding: 18px; border: 1px solid var(--bfk-border); border-radius: calc(var(--bfk-radius) * 1.5); background: var(--bfk-bg); }
.bfk .bfk-outlogin__title { margin-bottom: 14px; font-size: 1.05rem; font-weight: 800; }

/* 로그인 전 */
.bfk-outlogin__form { display: grid; gap: 8px; }
.bfk-outlogin__field { position: relative; }
.bfk-outlogin__field .bfk-input { padding-left: 40px; }
.bfk-outlogin__ico { position: absolute; left: 0; top: 0; display: flex; align-items: center; justify-content: center; width: 40px; height: 44px; color: var(--bfk-muted); }
.bfk-outlogin__opts { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; margin: 2px 0 4px; font-size: .85rem; }
.bfk-outlogin__opts .bfk-check { font-size: .85rem; }
.bfk-outlogin__opts .bfk-check input { width: 16px; height: 16px; }
.bfk-outlogin__lost { color: var(--bfk-muted); }
.bfk .bfk-outlogin__join { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--bfk-border); color: var(--bfk-muted); font-size: .85rem; text-align: center; }
.bfk-outlogin__join a { display: inline-flex; align-items: center; gap: 3px; margin-left: 4px; color: var(--bfk-primary); font-weight: 700; }
.bfk-outlogin__social { margin-top: 12px; }

/* 로그인 후 */
.bfk-outlogin__profile { display: flex; align-items: center; gap: 10px; }
.bfk-outlogin__profile .bfk-avatar { width: 44px; height: 44px; }
.bfk-outlogin__who { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--bfk-muted); font-size: .9rem; }
.bfk-outlogin__who strong { color: var(--bfk-text); font-size: 1rem; font-weight: 800; }

.bfk .bfk-outlogin__stats { display: grid; gap: 2px; margin: 14px 0; padding: 6px 10px; border-radius: var(--bfk-radius); background: var(--bfk-soft); }
.bfk-outlogin__stats a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 0; font-size: .88rem; }
.bfk-outlogin__label { display: inline-flex; align-items: center; gap: 6px; color: var(--bfk-muted); }
.bfk-outlogin__stats strong { font-weight: 800; }
.bfk-outlogin__stats a.is-new strong { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--bfk-primary); color: #fff; font-size: .78rem; }

.bfk-outlogin__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.bfk-outlogin__links .bfk-btn { padding: 0 8px; }

@media (max-width: 768px) {
    .bfk-outlogin { padding: 16px; }
}

/* ---------- 커뮤니티 테마: 사이드 로그인 상자 ---------- */
.bfk-outlogin { padding: 18px; border-radius: var(--bfk-radius); }
.bfk-outlogin__ico { display: none; }
.bfk-outlogin__field .bfk-input { padding-left: 12px; min-height: 40px; background: var(--bfk-soft); }
.bfk-outlogin__field .bfk-input:focus { background: var(--bfk-bg); }
.bfk-outlogin__form .bfk-btn--primary { min-height: 42px; font-size: 14px; }
.bfk-outlogin__opts, .bfk-outlogin__opts .bfk-check { font-size: 12px; }
.bfk-outlogin__lost { font-size: 12px; }
.bfk .bfc-ol-join { margin-top: 10px; min-height: 40px; border-color: var(--bfk-primary-line); background: var(--bfk-primary-soft); color: var(--bfk-primary); font-size: 12.5px; }
.bfk .bfc-ol-join:hover { background: var(--bfk-primary); color: #fff; }
.bfk .bfk-outlogin__stats { padding: 4px 12px; }
.bfk-outlogin__stats a { font-size: 13px; }