/* ================================================================
 * ad-override.css — 第三方广告样式覆盖
 *
 * tubiao.php 的图标广告自带内联 <style>，硬编码白底深色字；
 * matching.js 生成的 div.from1 也是白底表单。
 * 此文件用 !important 强制覆盖，让两类广告都融入暗色页面。
 * ================================================================ */

/* === 顶部图标广告（tubiao.php）=== */

/* 图标链接容器：去掉白底 */
.ad-card-body .giconlink,
.giconlink {
    background-color: transparent !important;
    background: transparent !important;
}

/* 单个图标项：文字改暗色系 */
.ad-card-body .FieldEditicon,
.FieldEditicon {
    color: #b89a7a !important;
}

/* 图标项内的链接、文字 */
.ad-card-body .FieldEditicon a,
.ad-card-body .FieldEditicon span,
.ad-card-body .FieldEditicon div,
.FieldEditicon a,
.FieldEditicon span,
.FieldEditicon div {
    color: #b89a7a !important;
}

/* 表格清底 */
.ad-card-body table,
.ad-card-body td,
.ad-card-body tr,
.ad-card-body th {
    background: transparent !important;
    border: none !important;
}

/* === 底部表单广告（matching.js / div.from1）=== */

/* ---- 容器：暗色卡片风格 ---- */
.from1 {
    background: rgba(20, 16, 12, 0.6) !important;
    border: 1px solid rgba(160, 120, 80, 0.12) !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
    margin: 8px 0 !important;
    overflow: hidden !important;
    color: #f0e6d3 !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
}

/* ---- tab 切换栏 ---- */
.from1 .J_ggw_1674_tab {
    display: flex !important;
    gap: 6px !important;
    border-bottom: 1px solid rgba(160, 120, 80, 0.08) !important;
    padding-bottom: 8px !important;
    margin-bottom: 8px !important;
}

.from1 .tab {
    flex: 1 !important;
    text-align: center !important;
    padding: 6px 0 !important;
    border-radius: 8px !important;
    color: #a08060 !important;
    cursor: pointer !important;
    font-size: 0.86rem !important;
    background: transparent !important;
    border: none !important;
    transition: all 0.2s ease !important;
}

.from1 .tab.active {
    color: #f0d5b0 !important;
    background: rgba(200, 160, 100, 0.15) !important;
    font-weight: 600 !important;
}

/* ---- 表单文字 ---- */
.from1 label,
.from1 span:not(.tab) {
    color: #b89a7a !important;
}

.from1 .J_ggw_1674_content,
.from1 .J_ggw_1674_content > div,
.from1 form,
.from1 form > div {
    color: #b89a7a !important;
}

/* ---- 输入框 ---- */
.from1 input[type="text"],
.from1 input:not([type]):not([type="radio"]):not([type="checkbox"]) {
    background: rgba(30, 22, 18, 0.8) !important;
    border: 1px solid rgba(160, 120, 80, 0.12) !important;
    border-radius: 8px !important;
    color: #f0e6d3 !important;
    padding: 6px 10px !important;
    outline: none !important;
}

.from1 input[type="radio"] {
    accent-color: #c9a87c;
}

/* ---- 提交按钮：红金风格 ---- */
.from1 button,
.from1 input[type="button"],
.from1 input[type="submit"],
.from1 .J_ggw_1674_btn,
.from1 [class*="btn"] {
    background: linear-gradient(145deg, #c0392b, #a93226) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 24px !important;
    padding: 8px 0 !important;
    width: 100% !important;
    font-size: 0.93rem !important;
    letter-spacing: 2px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.from1 button:hover,
.from1 input[type="button"]:hover,
.from1 input[type="submit"]:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 16px rgba(192, 57, 43, 0.4) !important;
}

/* ---- 兜底：清除所有默认白底 ---- */
.from1 table,
.from1 td,
.from1 tr,
.from1 th {
    background: transparent !important;
    color: inherit !important;
    border: none !important;
}

/* ================================================================
 * 骨架屏占位（广告加载前显示，避免空白闪烁）
 * ================================================================ */
.ad-skeleton {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 8px 4px 4px;
}

.ad-skeleton-row {
    display: flex;
    justify-content: center;
    gap: 20px;
}

.ad-skeleton-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.ad-skeleton-item .sk-circle {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(160, 120, 80, 0.08);
    border: 1px solid rgba(160, 120, 80, 0.12);
    animation: sk-pulse 1.5s ease-in-out infinite;
}

.ad-skeleton-item .sk-label {
    width: 48px;
    height: 10px;
    border-radius: 5px;
    background: rgba(160, 120, 80, 0.06);
    animation: sk-pulse 1.5s ease-in-out infinite;
}

@keyframes sk-pulse {
    0%, 100% { opacity: 0.3; }
    50% { opacity: 0.6; }
}

/* 广告加载成功后骨架屏隐藏 */
.ad-card-body:not(:empty) .ad-skeleton {
    display: none;
}

/* 底部广告加载占位 */
.from1:empty {
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.from1:empty::after {
    content: '正在加载...';
    color: #6a5a44;
    font-size: 0.79rem;
    letter-spacing: 2px;
    animation: sk-pulse 1.5s ease-in-out infinite;
}