/* BraveDAO — BuddyNext hub 页面专属布局（仅 hub 路由 enqueue）
 *
 * 与 brave-side-frame.css 的分工：本文件只含「hub 页内容布局」，
 * 不含任何站点坐标让位（三态 220/64/0 在 brave-side-frame.css）。
 *
 * 来源：原 themes/bravedao/buddynext/shell/hub-shell.php 内联
 * <style id="brave-hub-shell-offset">（2026-08-06 方案 C 抽取）。
 */

/* 品牌色不再在此硬编码——改由 BuddyNext 后台 Appearance → Community
   Identity → Brand color（option buddynext_brand_color）统一驱动
   （Appearance::attach_accent prio 22 在 bn-base 上追加 :root 覆盖，
   --bn-hue/--bn-accent-hue/--bn-chroma 全量重绑）。本文件不碰色相。 */

/* BuddyNext 自身 :has(.bn-app__right) 会把 shell 变成三列 grid（rail + main +
   right 320px），把 main 挤出对齐带。右栏现在住在 <main> 内，强制 shell
   单列通轨——侧栏列由下方约束两列 grid 处理。 */
.bn-app__shell--no-rail:has(.bn-app__right) {
  grid-template-columns: minmax(0, 1fr);
}

/* 主列本身是两列 grid：内容栈 | 右栏 320px——整条带 1212px，右栏保留在
   约束带内（曾在 shell 的 320px 轨道时被隐藏并错位）。 */
.bn-app__shell--no-rail .bn-app__main {
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  max-width: var(--max-w);
  width: 100%;
}

/* 两列布局只在真正有右栏（feed/探索等页 .bn-app__right 存在）时启用；
   无右栏页（如 profile edit）单列铺满约束带，不被 300px 轨道挤成 868px。 */
.bn-app__shell--no-rail .bn-app__main:has(.bn-app__right) {
  grid-template-columns: minmax(0, 1fr) var(--bn-shell-sidebar-w);
}

/* 顶部间距统一：BN 自带 padding-block: var(--bn-s5) 被清零后，为内容列
   补回同等顶部 padding。两列页（feed/leaderboard）左列与右栏对齐、单列页
   内容不再贴顶；.bn-app__right 自身已带 padding 不重复。 */
.bn-app__shell--no-rail .bn-app__main > :not(.bn-app__right) {
  padding-top: var(--bn-s5);
}

.bn-app__shell--no-rail .bn-app__main > [class*="-stack"] {
  max-width: none;
  width: 100%;
  margin: 0;
  min-width: 0;
}

/* 设置页内容通栏贴左：BN 自带 .bn-settings 1080px 居中，在通栏主带内左右
   各留 ~66px 空档，与 feed 等页内容从主带左缘开始的做法对齐。 */
.bn-app__shell--no-rail .bn-app__main > .bn-settings {
  max-width: none;
  margin-inline: 0;
}

@media (max-width: 1024px) {
  .bn-app__shell--no-rail .bn-app__main,
  .bn-app__shell--no-rail .bn-app__main:has(.bn-app__right) {
    grid-template-columns: minmax(0, 1fr);
  }
  .bn-app__shell--no-rail .bn-app__main > [class*="-stack"] {
    max-width: 100%;
  }
}

@media (max-width: 782px) {
  .bn-app__shell--no-rail .bn-app__main {
    padding-inline: 16px;
  }
}

/* ── Auth / Login Page Full-Width Shell & Brand Purple Refinement ────────── */

.bn-app--auth .bn-auth-page {
  padding: 0;
  width: 100%;
}

.bn-app--auth .bn-auth-shell {
  width: 100% !important;
  max-width: 100% !important;
  min-height: calc(100vh - 110px);
  border-radius: 0;
  border: none;
  box-shadow: none;
  display: flex;
}

.bn-app--auth .bn-auth-aside {
  flex: 0 0 52%;
  background-color: #ffffff;
  padding: 60px 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bn-app--auth .bn-auth-aside[data-has-image] {
  background-image:
    radial-gradient(560px 420px at 18% 12%, rgba(255, 255, 255, 0.35), transparent 70%),
    linear-gradient(155deg, rgba(245, 231, 248, 0.92) 0%, rgba(238, 220, 243, 0.9) 55%, rgba(225, 206, 238, 0.92) 100%),
    var(--bn-auth-aside-image);
  background-size: auto, cover, cover;
  background-position: center, center, center;
  border-right: 1px solid #d9c5e8;
}

.bn-app--auth .bn-auth-aside__inner {
  max-width: 480px;
  width: 100%;
}

.bn-app--auth .bn-auth-aside blockquote.bn-auth-aside__quote {
  font-size: 28px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: -0.015em;
  color: #181519;
  padding: 0;
  margin-bottom: 32px;
}

.bn-app--auth .bn-auth-aside blockquote.bn-auth-aside__quote::before {
  content: "\201C";
  position: absolute;
  top: -0.95em;
  inset-inline-start: 0;
  font-size: 1.5em;
  line-height: 1;
  color: #894b99;
}

.bn-app--auth .bn-auth-aside__heading {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #181519;
}

.bn-app--auth .bn-auth-aside__tagline {
  font-size: 14px;
  color: #894b99;
  margin-top: 4px;
}

.bn-app--auth .bn-auth-card {
  flex: 1;
  max-width: none;
  border: none;
  border-radius: 0;
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bn-surface, #ffffff);
}

.bn-app--auth .bn-auth-body {
  padding: 60px 80px;
  max-width: 440px;
  width: 100%;
  box-sizing: border-box;
}

.bn-app--auth .bn-auth-title {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--bn-ink, #171b22);
  margin-bottom: 10px;
}

.bn-app--auth .bn-auth-sub {
  font-size: 14px;
  line-height: 1.6;
  color: var(--bn-ink-3, #64748b);
  margin-bottom: 28px;
}

.bn-app--auth .cwl-wrapper {
  width: 100% !important;
  margin: 0 !important;
}

/* Primary Cardano Button: Brand Hue 319 Gradient (#6A3079 → #894B99 → #AB6EBB) */
.bn-app--auth .cwl-login-button {
  width: 100% !important;
  max-width: 100% !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 0 20px !important;
  background: linear-gradient(135deg, #6a3079 0%, #894b99 50%, #ab6ebb 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(171, 110, 187, 0.4) !important;
  border-radius: 12px !important;
  font-size: 15px !important;
  font-weight: 650 !important;
  cursor: pointer !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.bn-app--auth .cwl-login-button:hover {
  background: linear-gradient(135deg, #7a3c8c 0%, #9a5aa8 50%, #bb7cc6 100%) !important;
  transform: translateY(-1px);
}

.bn-app--auth .cwl-login-button:hover {
  background: linear-gradient(135deg, #8b5cf6 0%, #b464f9 55%, #c084fc 100%) !important;
  transform: translateY(-1px);
}

.bn-app--auth .cwl-login-button .cwl-cardano-icon {
  width: 20px !important;
  height: 20px !important;
  color: #ffffff !important;
  flex-shrink: 0;
}

.bn-app--auth .cwl-login-button .cwl-button-text {
  font-size: 0 !important;
  visibility: hidden !important;
}

.bn-app--auth .cwl-login-button .cwl-button-text::after {
  content: "使用 Cardano 钱包连接" !important;
  font-size: 15px !important;
  visibility: visible !important;
  color: #ffffff !important;
  font-weight: 650 !important;
}

.bn-app--auth .bn-auth-or {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 24px 0 !important;
  color: var(--bn-ink-4, #94a3b8) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-transform: uppercase;
}

.bn-app--auth .bn-auth-or::before,
.bn-app--auth .bn-auth-or::after {
  content: "" !important;
  flex: 1 !important;
  height: 1px !important;
  background: var(--bn-line, #e2e8f0) !important;
}

.bn-app--auth .bn-auth-panel a.bn-btn[data-variant="ghost"] {
  width: 100% !important;
  height: 48px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border-radius: 12px !important;
  font-size: 15px !important;
  font-weight: 550 !important;
  background: transparent !important;
  border: 1px solid var(--bn-line, #e2e8f0) !important;
  color: var(--bn-ink, #171b22) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.bn-app--auth .bn-auth-panel a.bn-btn[data-variant="ghost"]:hover {
  background: rgba(171, 110, 187, 0.08) !important;
  border-color: #ab6ebb !important;
  color: #6a3079 !important;
  transform: translateY(-1px);
}

.bn-app--auth .bn-auth-hint {
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: var(--bn-ink-3, #64748b) !important;
  margin-top: 14px !important;
  text-align: center !important;
}

@media (max-width: 782px) {
  .bn-app--auth .bn-auth-body {
    padding: 36px 20px !important;
    max-width: 100%;
  }
  .bn-app--auth .bn-auth-shell {
    box-shadow: none !important;
    border-radius: 12px !important;
  }
}

/* ── Guest banner 渐变强化（探索页）────────────────────────────────────── */
/* fork 的 bn-guest-banner 用 --brand → --brand-hover 两档，色相相同观感如纯色；
   覆盖为品牌 319 三档切割，与登录按钮渐变同族。 */
.bn-guest-banner {
  background: linear-gradient(100deg, #f6effa 0%, #efdef4 24%, #e3c6ec 48%, #cdabda 72%, #b48cc7 100%) !important;
}
.bn-guest-banner p {
  color: #4a3565;
}
.bn-guest-banner .bn-btn[data-variant="ghost"] {
  color: #6a3079;
  border-color: rgba(106, 48, 121, 0.55);
  box-shadow: none;
}
.bn-guest-banner .bn-btn[data-variant="ghost"]:hover {
  background: rgba(106, 48, 121, 0.12);
}
/* HOMELAB-ENGINE-OWNED: primary 按钮不复盖 —— fork Appearance.php 内联注入
   .bn-app .bn-btn[data-variant="primary"]{...!important} 锁品牌色 #B373C4，
   已是单一事实源且为品牌色，引擎再定义即双源冲突。 */
.bn-guest-banner h3 {
  color: #181519;
}