/* 主站壳层 / 弹窗 → 客栈主题变量桥接（不改布局，只改颜色） */
@import url('./hide-scrollbars.css?v=20260831-app-perf');

:root,
body {
    --hd-page: var(--page-bg);
    --hd-card: var(--bg-card);
    --hd-ink: var(--text-main);
    --hd-muted: var(--text-minor);
    --hd-line: color-mix(in srgb, var(--border) 70%, transparent);
    --hd-gold: var(--gold);
    --hd-gold-deep: var(--gold-deep);
    --hd-lifebook-border: var(--border);
    --hd-shadow: none;

    --ph-page: var(--page-bg);
    --ph-card: var(--bg-card);
    --ph-ink: var(--text-main);
    --ph-muted: var(--text-minor);
    --ph-line: var(--border);
    --ph-gold: var(--gold);

    --ma-page: var(--page-bg);
    --ma-card: var(--bg-card);
    --ma-ink: var(--text-main);
    --ma-muted: var(--text-minor);
    --ma-line: var(--border);
    --ma-gold: var(--gold);

    --ft-page: var(--page-bg);
    --ft-card: var(--bg-card);
    --ft-ink: var(--text-main);
    --ft-muted: var(--text-minor);
    --ft-line: var(--border);
    --ft-gold: var(--gold);

    --at-page: var(--page-bg);
    --at-card: var(--bg-card);
    --at-ink: var(--text-main);
    --at-muted: var(--text-minor);
    --at-line: var(--border);
    --at-gold: var(--gold);

    --bg-page: var(--page-bg);
    --bg-sidebar: var(--bg-card);
    --bg-card-border: var(--border);
    --text-primary: var(--text-main);
    --text-muted: var(--text-minor);
    --cream: var(--bg-card);
    --cream-text: var(--text-main);
    --gold-dim: var(--gold-deep);
    --panel-1: var(--bg-card);
    --panel-2: var(--page-bg);
    --panel-3: var(--page-bg);
    --line-soft: color-mix(in srgb, var(--border) 55%, transparent);
    --line-strong: var(--border);
    --focus-ring: rgba(var(--gold-rgb), 0.35);
    --archive-card: var(--bg-card);
}

/* ===== 页面壳 ===== */
html,
body,
.hd-body,
.ph-body,
.ma-body,
.ft-body,
.at-body,
.forum-body,
.forum-page {
    background: var(--page-bg) !important;
    background-color: var(--page-bg) !important;
    color: var(--text-main) !important;
}

.hd-bg {
    background: radial-gradient(120% 80% at 50% -10%, rgba(var(--gold-rgb), 0.18), transparent 55%) !important;
}

.hd-topbar,
.ph-topbar,
.ma-topbar,
.ft-topbar,
.at-topbar {
    background: var(--header-bg) !important;
    border-bottom-color: var(--border) !important;
    color: var(--text-main) !important;
}

.hd-brand-cn,
.hd-brand-sub,
.ph-title,
.ma-title,
.ft-title {
    color: var(--text-main) !important;
}

.hd-auth-label,
.hd-nav-btn,
.startup-page-check {
    color: var(--text-minor) !important;
}

.hd-btn-primary,
.hd-cta:not(.hd-cta--outline) {
    background: var(--btn-solid-bg) !important;
    border-color: var(--btn-solid-border) !important;
    color: var(--btn-solid-text) !important;
}

.hd-cta--outline {
    background: var(--btn-ghost-bg) !important;
    border-color: var(--btn-ghost-border) !important;
    color: var(--btn-ghost-text) !important;
}

/* 首页卡片 / 侧栏 / 底栏 */
.hd-card,
.hd-panel,
.hd-section,
.hd-lifebook-card,
.hd-side-drawer,
.hd-mobile-bottom-nav,
.ph-card,
.ph-tool-tile,
.ma-card,
.ft-card,
.at-card {
    background: var(--bg-card) !important;
    border-color: var(--border) !important;
    color: var(--text-main) !important;
    box-shadow: none !important;
}

.hd-side-drawer__item,
.hd-side-drawer__label,
.hd-muted,
.ph-history-hint,
.ph-sec-head__title {
    color: var(--text-minor) !important;
}

.hd-mobile-bottom-nav__btn {
    color: var(--text-minor) !important;
}

.hd-mobile-bottom-nav__btn--active,
.hd-mobile-bottom-nav__btn[aria-current="page"] {
    color: var(--gold) !important;
}

/* 排盘侧栏 / 主区 */
.app-rail,
.app-rail--desktop-v2 {
    background: var(--bg-card) !important;
    border-color: var(--border) !important;
    color: var(--text-main) !important;
}

.rail-brand-title,
.rail-section-label,
.rail-nav-item {
    color: var(--text-main) !important;
}

.rail-brand-sub,
.rail-auth-user-badge {
    color: var(--text-minor) !important;
}

.rail-nav-item--active,
.rail-nav-item:hover {
    background: rgba(var(--gold-rgb), 0.12) !important;
    color: var(--gold) !important;
}

.main,
.main-inner,
#calcLayout {
    background: var(--page-bg) !important;
    color: var(--text-main) !important;
}

/* ===== 弹窗（强制跟主题） ===== */
.hd-modal-backdrop,
.fortune-panel-overlay,
.bazi-modal-overlay,
.qizheng-modal-overlay,
.fortune-unlock-overlay,
.pro-reading-hint-overlay,
.app-notice-overlay,
.wechat-pay-overlay,
.ph-notice-backdrop,
.register-lifebook-overlay,
.archive-edit-overlay,
.fortune-archive-modal-overlay {
    background: rgba(var(--overlay-rgb), 0.55) !important;
}

.hd-modal,
.hd-modal--archive,
.hd-modal--lifebook,
.hd-modal--kefu,
.hd-pwa-modal,
.fortune-panel,
.bazi-modal,
.qizheng-modal,
.fortune-unlock-modal,
.pro-reading-hint-modal,
.app-notice-modal,
.ph-notice,
.auth-modal-panel,
.me-plus-panel,
.me-security-overlay .auth-modal-panel,
.fortune-archive-modal-overlay .case-archive-view--modal {
    background: var(--bg-card) !important;
    background-image: none !important;
    border-color: var(--border) !important;
    color: var(--text-main) !important;
    box-shadow: none !important;
}

.hd-modal h2,
.hd-modal h3,
.bazi-modal h2,
.fortune-panel h2,
.ph-notice__title,
.auth-modal-panel h2 {
    color: var(--text-main) !important;
}

.hd-modal p,
.bazi-modal p,
.fortune-panel p,
.ph-notice__body {
    color: var(--text-minor) !important;
}

.hd-modal input,
.hd-modal select,
.hd-modal textarea,
.bazi-modal input,
.bazi-modal select,
.bazi-modal textarea,
.fortune-panel input,
.fortune-panel select,
.fortune-panel textarea,
.auth-modal-panel input {
    background: var(--input-bg) !important;
    border-color: var(--border) !important;
    color: var(--text-main) !important;
}

.ph-notice__ok,
.hd-modal .hd-btn-primary,
.bazi-modal .primary-btn,
.fortune-unlock-modal button.primary,
.app-update-banner .app-update-cta {
    background: var(--btn-solid-bg) !important;
    border-color: var(--btn-solid-border) !important;
    color: var(--btn-solid-text) !important;
}

/* 登录/注册卡 */
.auth-card,
.auth-shell {
    background: var(--bg-card) !important;
    border-color: var(--border) !important;
    color: var(--text-main) !important;
}

.auth-card__title,
.auth-card__head {
    color: var(--text-main) !important;
}

/* ========== 仅红墨古卷：凡深红/强调实心钮 → 文字纯白 #ffffff ==========
 * 含首页 CTA、客栈、排盘「当下时间/填入/分段选中/primary」等；底色保留暗红
 */
html.red,
html.theme-red,
:root.red {
    --btn-solid-text: #ffffff;
    --btn-highlight-text: #ffffff;
    --btn-search-text: #ffffff;
    --btn-post-text: #ffffff;
    --tag-active-text: #ffffff;
    --tag-pay-text: #ffffff;
    --badge-partner-text: #ffffff;
    /* 排盘大量按钮用 cream-text 叠在 accent 上，红主题必须是白字 */
    --cream-text: #ffffff;
}

html.red .hd-btn-primary,
html.red .hd-cta:not(.hd-cta--outline),
html.red .hd-guide-login,
html.red a.hd-guide-login,
html.red .hd-topnav .hd-btn-primary,
html.red .hd-lifebook-actions .hd-cta--small,
html.red .hd-side-drawer__item--ask,
html.red .forum-search-btn,
html.red .forum-btn-primary,
html.red .forum-post-btn,
html.red .forum-apply-btn,
html.red .forum-float-post-btn,
html.red .forum-comment-submit,
html.red .forum-tag.active,
html.red .forum-page-btn.active,
html.red .forum-theme-switch button.active,
html.red .ph-notice__ok,
html.red .hd-modal .hd-btn-primary,
html.red .bazi-modal .primary-btn,
html.red .bazi-modal .hd-btn-primary,
html.red .fortune-unlock-modal button.primary,
html.red .auth-card .hd-btn-primary,
html.red .auth-modal-panel .hd-btn-primary,
html.red .auth-primary-btn,
html.red .app-update-banner .app-update-cta,
html.red .admin-btn--approve,
html.red .admin-btn--primary,
html.red .primary-btn,
html.red .secondary-btn,
html.red #applyQuickDateBtn.secondary-btn,
html.red .metaphysics-pillar-quick__btn,
html.red .paipan-result-datetime-btn,
html.red .paipan-result-datetime-btn--now,
html.red .qizheng-repaipan-btn,
html.red .paipan-datetime-picker__fill-btn,
html.red .cal-btn--active,
html.red .gender-btn--active,
html.red .qimen-segment-btn--active,
html.red .liuren-segment-btn--active,
html.red .qimen-sheet-btn,
html.red .qimen-action-btn,
html.red .qimen-live-bao__btn--primary,
html.red .qimen-live-bao__pick,
html.red .unified-paipan-save-btn,
html.red .save-bazi-fab,
html.theme-red .hd-btn-primary,
html.theme-red .hd-cta:not(.hd-cta--outline),
html.theme-red .hd-guide-login,
html.theme-red .forum-btn-primary,
html.theme-red .forum-search-btn,
html.theme-red .primary-btn,
html.theme-red .secondary-btn,
html.theme-red .paipan-result-datetime-btn,
html.theme-red .qizheng-repaipan-btn,
html.theme-red .qimen-segment-btn--active {
    background: var(--btn-solid-bg, #7b2222) !important;
    background-image: none !important;
    border-color: var(--btn-solid-border, #7b2222) !important;
    color: #ffffff !important;
}

html.red .hd-btn-primary:hover,
html.red .hd-cta:not(.hd-cta--outline):hover,
html.red .hd-guide-login:hover,
html.red .forum-btn-primary:hover,
html.red .forum-search-btn:hover,
html.red .primary-btn:hover,
html.red .secondary-btn:hover,
html.red .paipan-result-datetime-btn:hover:not(:disabled),
html.red .qizheng-repaipan-btn:hover,
html.theme-red .qizheng-repaipan-btn:hover,
html.red .qimen-segment-btn--active:hover,
html.red .cal-btn--active:hover,
html.theme-red .hd-guide-login:hover,
html.theme-red .secondary-btn:hover {
    background: var(--btn-solid-hover, #5a1a1a) !important;
    background-image: none !important;
    color: #ffffff !important;
}

/* 返回上一盘：浅红底也可读，仍用白字避免深棕字 */
html.red .paipan-result-datetime-btn--back,
html.theme-red .paipan-result-datetime-btn--back {
    background: #7b2222 !important;
    background-image: none !important;
    color: #ffffff !important;
    border-color: #5a1a1a !important;
}

/* ========== 暖主题：深棕实心钮 → 与「拆补法/正时起局」同款分段皮肤 ==========
 * 浅金底 + 深字 + 细描边（不改玄/红）
 */
html:not(.red):not(.theme-red) .paipan-result-datetime-btn,
html:not(.red):not(.theme-red) .paipan-result-datetime-btn--now,
html:not(.red):not(.theme-red) .secondary-btn,
html:not(.red):not(.theme-red) #applyQuickDateBtn.secondary-btn,
html:not(.red):not(.theme-red) .metaphysics-pillar-quick__btn,
html:not(.red):not(.theme-red) .paipan-datetime-picker__fill-btn,
html:not(.red):not(.theme-red) .cal-btn--active,
html:not(.red):not(.theme-red) .gender-btn--active,
html:not(.red):not(.theme-red) .qimen-live-bao__btn--primary,
html:not(.red):not(.theme-red) .qimen-live-bao__pick,
html:not(.red):not(.theme-red) .qizheng-repaipan-btn,
html:not(.red):not(.theme-red) .bazi-repaipan-btn,
html:not(.red):not(.theme-red) .liuren-repaipan-btn {
    background: linear-gradient(180deg, rgb(244, 214, 160) 0%, var(--tone-gold, #ecc783) 100%) !important;
    background-image: linear-gradient(180deg, rgb(244, 214, 160) 0%, var(--tone-gold, #ecc783) 100%) !important;
    color: #3a2b1a !important;
    border: 1px solid rgba(212, 168, 95, 0.45) !important;
    box-shadow: 0 4px 16px rgba(236, 199, 131, 0.28) !important;
    filter: none !important;
    text-shadow: none !important;
}

html:not(.red):not(.theme-red) .paipan-result-datetime-btn:hover:not(:disabled),
html:not(.red):not(.theme-red) .secondary-btn:hover,
html:not(.red):not(.theme-red) #applyQuickDateBtn.secondary-btn:hover,
html:not(.red):not(.theme-red) .cal-btn--active:hover,
html:not(.red):not(.theme-red) .metaphysics-pillar-quick__btn:hover,
html:not(.red):not(.theme-red) .qizheng-repaipan-btn:hover,
html:not(.red):not(.theme-red) .bazi-repaipan-btn:hover,
html:not(.red):not(.theme-red) .liuren-repaipan-btn:hover {
    background: linear-gradient(180deg, #f6dfb0 0%, #e0b86a 100%) !important;
    background-image: linear-gradient(180deg, #f6dfb0 0%, #e0b86a 100%) !important;
    color: #3a2b1a !important;
    border-color: rgba(212, 168, 95, 0.55) !important;
    filter: none !important;
}

/* 返回上一盘：保持浅底描边（与分段未选中接近，仍深字可读） */
html:not(.red):not(.theme-red) .paipan-result-datetime-btn--back {
    background: rgba(255, 252, 246, 0.96) !important;
    background-image: none !important;
    color: #4a3518 !important;
    border: 1px solid rgba(201, 160, 106, 0.45) !important;
    box-shadow: none !important;
}

/* 分段选中态：确保暖主题下也是浅金底深字（与上同款） */
html:not(.red):not(.theme-red) .qimen-segment-btn--active {
    background: linear-gradient(180deg, rgb(244, 214, 160) 0%, var(--tone-gold, #ecc783) 100%) !important;
    color: #3a2b1a !important;
    border-color: rgba(212, 168, 95, 0.45) !important;
}