/*
 * 平台规则主题桥接：只覆盖视觉颜色和底部安全间距。
 * 所有颜色均继承全局主题变量，不改动 DOM、接口及按钮事件。
 */
html[data-merchant-theme] #platform-rules-tabbed-content-v8 {
    background: var(--mgt-bg, #eef3fb) !important;
    color: var(--mgt-text, #182235) !important;
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-header {
    background: var(--mgt-nav-bg, #050505) !important;
    color: var(--mgt-nav-text, #ffffff) !important;
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-tabs,
html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-panel {
    background: var(--mgt-surface, #ffffff) !important;
    color: var(--mgt-text, #182235) !important;
    border-color: var(--mgt-border, rgba(102,112,133,.14)) !important;
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-tab {
    color: var(--mgt-muted, #627086) !important;
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-tab.is-active {
    color: var(--mgt-primary, #2f5cff) !important;
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-tab.is-active::after,
html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-number,
html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-inline-service,
html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-summary-card,
html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-section-mark {
    background: linear-gradient(
        135deg,
        var(--mgt-primary, #2f5cff),
        var(--mgt-secondary, #00a8ff)
    ) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-item,
html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-card,
html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-time,
html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-penalty {
    background: var(--mgt-surface-2, #f8faff) !important;
    color: var(--mgt-text, #182235) !important;
    border-color: var(--mgt-border, rgba(84,110,159,.12)) !important;
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 :is(
    .pr8-hero h2,
    .pr8-item h3,
    .pr8-section-title,
    .pr8-card h3,
    .pr8-time h3,
    .pr8-penalty h3,
    .pr8-time-head strong,
    strong
) {
    color: var(--mgt-text, #182235) !important;
    -webkit-text-fill-color: var(--mgt-text, #182235) !important;
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 :is(
    .pr8-hero p,
    .pr8-item p,
    .pr8-card p,
    .pr8-time p,
    .pr8-penalty p,
    .pr8-text
) {
    color: var(--mgt-muted, #627086) !important;
    -webkit-text-fill-color: var(--mgt-muted, #627086) !important;
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-icon {
    color: var(--mgt-primary, #2f5cff) !important;
    -webkit-text-fill-color: initial !important;
    background: var(--mgt-surface-2, #f8faff) !important;
    box-shadow: inset 0 0 0 1px var(--mgt-border, rgba(84,110,159,.12));
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-badge {
    color: var(--mgt-primary, #2f5cff) !important;
    background: var(--mgt-surface, #ffffff) !important;
    border: 1px solid var(--mgt-border, rgba(84,110,159,.12));
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-note {
    color: var(--mgt-text, #182235) !important;
    -webkit-text-fill-color: var(--mgt-text, #182235) !important;
    background: var(--mgt-surface-2, #f8faff) !important;
    border: 1px solid var(--mgt-border, rgba(84,110,159,.12));
}

html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-main {
    padding-bottom: calc(104px + env(safe-area-inset-bottom, 0px)) !important;
}

/* 规则页自带的标题右侧客服按钮必须保持可见。 */
html[data-merchant-theme] #platform-rules-tabbed-content-v8 .pr8-inline-service {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}
