/* ============================================
   工具页面移动端通用样式
   适用于所有 tool-*.php 模板
   ============================================ */

/* ========== 粘性Footer（全局，不限屏幕宽度）========== */
/* 确保Footer始终在页面底部，即使内容很少 */

html {
    height: 100%;
}

body {
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

/* ========== 工具页面顶部间隙修复（全局）========== */
/* 移除顶部蓝色间隙 */
body[class*="page-template-tool-"] .site-header,
body[class*="page-template-tool-"] header {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

body[class*="page-template-tool-"] {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

body[class*="page-template-tool-"] .site,
body[class*="page-template-tool-"] #site {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

body[class*="page-template-tool-"] .site-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* B2主题的主容器 */
.site,
#site {
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.site-content,
#site-content,
.main-content {
    flex: 1 0 auto;
}

/* Footer固定在底部 */
.footer,
footer,
.site-footer,
#footer {
    flex-shrink: 0;
    margin-top: auto;
}

/* ========== 颜色修复（全局，不限屏幕宽度）========== */

/* 蓝色/深色背景 → 强制白色文字 */
[style*="background"][style*="#0d47a1"],
[style*="background"][style*="linear-gradient"],
.stat-card,
.stat-item[style*="background"],
.result-card[style*="background"],
.info-card[style*="background"],
thead tr,
.table-header,
.rate-table thead tr,
.tool-table thead tr {
    color: #fff !important;
}

.stat-card *,
.stat-card .stat-value,
.stat-card .stat-label,
thead tr th,
.rate-table thead tr th,
.tool-table thead tr th {
    color: #fff !important;
}

/* 白色/浅色背景 → 强制深色文字 */
.tool-container,
.tool-section,
.tool-tips,
.result-display,
.tool-result,
.filter-section,
.search-section,
.form-section,
.input-section,
.output-section,
.card,
.item-card,
.tool-card-item,
.list-item,
.grid-item {
    color: #333 !important;
}

/* 输入框/文本框文字颜色 */
input,
textarea,
select,
.tool-input,
.tool-textarea,
.tool-select {
    color: #333 !important;
    background: #fff !important;
}

input::placeholder,
textarea::placeholder,
.tool-input::placeholder,
.tool-textarea::placeholder {
    color: #999 !important;
}

/* 标签/标题文字 */
.tool-label,
label,
.section-title,
.group-title {
    color: #333 !important;
}

/* 描述/提示文字 */
.tool-desc,
.tool-tips p,
.tool-tips li,
.helper-text,
.hint-text,
.note-text {
    color: #666 !important;
}

/* 表格内容 */
.rate-table td,
.tool-table td,
table td {
    color: #333 !important;
}

/* 标签页/筛选按钮 - 激活状态（使用高优先级选择器覆盖内联样式） */
body .tab-btn.active,
body .filter-btn.active,
body .mode-btn.active,
body .category-btn.active,
body .lang-btn.active,
body .size-btn.active,
body .sep-btn.active,
body .symbol-btn.active,
body .type-btn.active,
body .option-btn.active,
body .carrier-tab.active,
body .currency-tab.active,
body .exchange-tab.active,
body .converter-tab.active,
body .nav-tab.active,
body button.active[class*="-tab"],
body button.active[class*="-btn"],
body [class*="-tab"].active,
body [class*="-btn"].active:not(.tool-btn-secondary):not(.btn-secondary):not(.clear-btn):not(.reset-btn):not(.cancel-btn) {
    color: #fff !important;
    background: #0d47a1 !important;
    background-color: #0d47a1 !important;
    border-color: #0d47a1 !important;
    border-radius: 6px !important;
}

/* 标签页/筛选按钮 - 非激活状态 */
body .tab-btn:not(.active),
body .filter-btn:not(.active),
body .mode-btn:not(.active),
body .category-btn:not(.active),
body .lang-btn:not(.active),
body .size-btn:not(.active),
body .sep-btn:not(.active),
body .symbol-btn:not(.active),
body .type-btn:not(.active),
body .option-btn:not(.active),
body .carrier-tab:not(.active),
body .currency-tab:not(.active),
body .exchange-tab:not(.active),
body .converter-tab:not(.active),
body .nav-tab:not(.active),
body [class*="-tab"]:not(.active) {
    color: #666 !important;
    background: #f5f5f5 !important;
    background-color: #f5f5f5 !important;
    border-radius: 6px !important;
}

/* 主要操作按钮 */
.tool-btn-primary,
.btn-primary,
.generate-btn,
.translate-btn,
.search-btn,
.query-btn,
.send-btn,
.calc-btn,
.extract-btn,
.convert-btn,
.submit-btn,
.confirm-btn,
button[type="submit"],
.form-col-btn {
    color: #fff !important;
    background: linear-gradient(135deg, #0d47a1 0%, #093290 100%) !important;
}

/* 次要操作按钮 */
.tool-btn-secondary,
.btn-secondary,
.clear-btn,
.reset-btn,
.cancel-btn {
    color: #666 !important;
    background: #f5f5f5 !important;
}

/* 功能按钮 */
.copy-btn,
.copy-all-btn,
.download-btn {
    color: #0d47a1 !important;
    background: #fff !important;
    border: 1px solid #0d47a1 !important;
}

/* 链接颜色 */
a:not([class]) {
    color: #0d47a1 !important;
}

/* 结果/输出区域文字 */
.result-text,
.output-text,
.result-content,
.output-content,
pre,
code {
    color: #333 !important;
}

@media (max-width: 768px) {
    /* ========== 顶部/左侧间隙修复 ========== */
    
    /* 移除顶部蓝色间隙 - body的padding-top是罪魁祸首 */
    html {
        margin: 0 !important;
        padding: 0 !important;
    }
    
    body {
        margin: 0 !important;
        padding: 0 !important;
        padding-top: 0 !important;
    }
    
    body[class*="page-template-tool-"] {
        padding-top: 0 !important;
    }
    
    .site,
    #site,
    .site-content,
    #site-content {
        margin: 0 !important;
        padding: 0 !important;
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
    
    /* 内容区域顶部对齐 */
    .b2-single-content.wrapper,
    .tool-page-wrapper,
    .calendar-page-wrapper,
    [class*="-page-wrapper"] {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    
    /* ========== 核心布局修复 ========== */
    
    /* 1. 完全隐藏侧边栏 */
    .tools-sidebar,
    .tool-sidebar {
        display: none !important;
        visibility: hidden !important;
        width: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
        position: absolute !important;
        left: -9999px !important;
    }
    
    /* 2. 所有工具页面容器全宽 - 覆盖所有可能的类名 */
    .tool-page,
    .ip-detector,
    .shopee-pricing-tool,
    .currency-converter-tool,
    .unit-converter-tool,
    .keyword-tool,
    .text-tool,
    .info-tool,
    .pricing-tool,
    .exchange-tool,
    .calculator-tool,
    .generator-tool,
    [class*="-tool"]:not(.tool-btn):not(.tool-icon):not(.tool-item):not(.tool-card):not(.tool-input):not(.tool-textarea):not(.tool-select):not(.tool-label):not(.tool-desc):not(.tool-result):not(.tool-tips):not(.tool-stats):not(.tool-modal):not(.tool-header):not(.tool-container):not(.tool-section):not(.tool-buttons):not(.tool-grid):not(.tool-table):not(.tool-search),
    [class*="-detector"],
    [class*="-converter"]:not(.converter-item):not(.converter-row):not(.converter-grid):not(.converter-input),
    [class*="-calculator"]:not(.calculator-display):not(.calculator-btn),
    [class*="-generator"]:not(.generator-btn):not(.generator-input) {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 16px !important;
        box-sizing: border-box !important;
    }
    
    /* 3. 覆盖内联样式的固定边距和宽度 */
    body [style*="margin-left: 260px"],
    body [style*="margin-left:260px"],
    body [style*="margin-left: 260"] {
        margin-left: 0 !important;
    }
    
    body [style*="calc(100% - 260px)"],
    body [style*="calc(100% - 260"] {
        width: 100% !important;
    }
    
    /* 4. B2主题容器重置 */
    .b2-single-content.wrapper {
        padding: 0 !important;
        margin: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* 5. 工具页面body padding重置 */
    body.page-template-tool-currency-converter,
    body.page-template-tool-ip-query,
    body.page-template-tool-shopee-pricing,
    body[class*="page-template-tool-"] {
        padding: 0 !important;
        margin: 0 !important;
    }
    
    /* 6. 通用body重置（工具页面） */
    body {
        overflow-x: hidden !important;
    }
    
    /* ========== 原有页面容器规则 ========== */
    
    /* 页面容器 */
    .tool-page {
        margin: 0 !important;
        padding: 16px !important;
    }
    
    /* 标题区域 */
    .tool-header {
        margin-bottom: 20px !important;
        text-align: center !important;
    }
    
    .tool-header h1 {
        font-size: 20px !important;
        margin-bottom: 8px !important;
    }
    
    .tool-header p,
    .tool-header .tool-desc {
        font-size: 13px !important;
        line-height: 1.5 !important;
    }
    
    /* 内容容器 */
    .tool-container {
        padding: 16px !important;
        border-radius: 8px !important;
        margin: 0 !important;
    }
    
    /* 区块 */
    .tool-section {
        margin-bottom: 20px !important;
    }
    
    .tool-label {
        font-size: 14px !important;
        margin-bottom: 8px !important;
    }
    
    /* 文本框 */
    .tool-textarea {
        min-height: 150px !important;
        padding: 12px !important;
        font-size: 14px !important;
        line-height: 1.6 !important;
        border-radius: 8px !important;
    }
    
    /* 输入框 */
    .tool-input,
    input[type="text"],
    input[type="number"],
    input[type="email"] {
        padding: 10px 12px !important;
        font-size: 14px !important;
        border-radius: 6px !important;
    }
    
    /* 选择框 */
    .tool-select,
    select {
        padding: 10px 12px !important;
        font-size: 14px !important;
        border-radius: 6px !important;
    }
    
    /* 按钮区域 */
    .tool-buttons {
        flex-wrap: wrap !important;
        gap: 10px !important;
        margin: 20px 0 !important;
    }
    
    .tool-btn {
        padding: 12px 20px !important;
        font-size: 14px !important;
        flex: 1 1 45% !important;
        min-width: 120px !important;
    }
    
    /* ========== 按钮通用样式 ========== */
    
    /* 主要按钮 - 蓝色背景白色文字 */
    .tool-btn-primary,
    .btn-primary,
    .generate-btn,
    .translate-btn,
    .search-btn,
    .query-btn,
    .send-btn,
    .calc-btn,
    .extract-btn,
    .tool-btn:first-child:not(.tool-btn-secondary) {
        color: #fff !important;
        background: linear-gradient(135deg, #0d47a1 0%, #093290 100%) !important;
    }
    
    /* 次要按钮 - 浅灰背景深色文字 */
    .tool-btn-secondary,
    .btn-secondary,
    .clear-btn,
    .clear-chat-btn,
    .btn-stop {
        color: #666 !important;
        background: #f5f5f5 !important;
    }
    
    /* 功能按钮 - 边框样式 */
    .copy-btn,
    .copy-all-btn,
    .copy-color-btn,
    .download-btn,
    .regenerate-btn,
    .refresh-btn {
        color: #0d47a1 !important;
        background: #fff !important;
        border: 1px solid #0d47a1 !important;
    }
    
    /* 标签/筛选按钮 */
    .tab-btn,
    .filter-btn,
    .mode-btn,
    .category-btn,
    .lang-btn,
    .size-btn,
    .sep-btn,
    .symbol-btn,
    .quick-btn {
        color: #666 !important;
        background: #f5f5f5 !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
    }
    
    .tab-btn.active,
    .filter-btn.active,
    .mode-btn.active,
    .category-btn.active,
    .lang-btn.active,
    .size-btn.active,
    .sep-btn.active,
    .symbol-btn.active {
        color: #fff !important;
        background: #0d47a1 !important;
    }
    
    /* 导航按钮 */
    .nav-btn,
    .today-btn,
    .swap-btn {
        color: #0d47a1 !important;
        background: transparent !important;
        border: 1px solid #0d47a1 !important;
        padding: 8px 12px !important;
        font-size: 13px !important;
    }
    
    /* 服务/操作按钮 */
    .service-btn,
    .action-btn {
        color: #333 !important;
        background: #f8f9fa !important;
        padding: 10px 16px !important;
        font-size: 13px !important;
    }
    
    /* 通用按钮尺寸 */
    button,
    .btn,
    [class*="-btn"] {
        min-height: 40px !important;
        border-radius: 6px !important;
    }
    
    /* 统计卡片 */
    .tool-stats {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
        margin-top: 20px !important;
    }
    
    .stat-card {
        padding: 16px !important;
        border-radius: 8px !important;
    }
    
    .stat-value {
        font-size: 24px !important;
    }
    
    .stat-label {
        font-size: 12px !important;
    }
    
    /* 3列统计改2列 */
    .tool-stats[style*="grid-template-columns: repeat(3"] {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    
    /* 提示区域 */
    .tool-tips {
        padding: 16px !important;
        margin-top: 20px !important;
        border-radius: 8px !important;
    }
    
    .tool-tips h3 {
        font-size: 15px !important;
        margin-bottom: 10px !important;
    }
    
    .tool-tips li {
        font-size: 13px !important;
        line-height: 1.6 !important;
        margin-bottom: 6px !important;
    }
    
    /* 表格响应式 */
    .rate-table-container,
    .tool-table-container {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .rate-table,
    .tool-table {
        min-width: 600px !important;
    }
    
    .rate-table th,
    .rate-table td,
    .tool-table th,
    .tool-table td {
        padding: 10px 8px !important;
        font-size: 12px !important;
    }
    
    .currency-flag {
        width: 28px !important;
        height: 20px !important;
        margin-bottom: 4px !important;
    }
    
    .currency-name {
        font-size: 12px !important;
    }
    
    .currency-code {
        font-size: 10px !important;
    }
    
    /* 标签页导航 */
    .currency-tabs,
    .tool-tabs {
        overflow-x: auto !important;
        white-space: nowrap !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
        margin-bottom: 16px !important;
    }
    
    .currency-tabs::-webkit-scrollbar,
    .tool-tabs::-webkit-scrollbar {
        display: none !important;
    }
    
    .currency-tab,
    .tool-tab {
        padding: 10px 16px !important;
        font-size: 13px !important;
        flex-shrink: 0 !important;
    }
    
    /* 快速金额按钮 */
    .quick-amounts,
    .quick-amounts-rmb,
    .quick-amounts-latin {
        justify-content: center !important;
        gap: 6px !important;
    }
    
    .quick-amounts button,
    .quick-amounts-rmb button,
    .quick-amounts-latin button {
        padding: 6px 10px !important;
        font-size: 12px !important;
    }
    
    /* 结果显示区 */
    .result-display,
    .tool-result {
        padding: 12px !important;
        border-radius: 8px !important;
        font-size: 14px !important;
    }
    
    /* 两列网格改单列 */
    .tool-grid-2,
    .grid-2 {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    
    /* 换算器布局 */
    .converter-row,
    .exchange-row {
        flex-direction: column !important;
        gap: 12px !important;
    }
    
    .converter-input,
    .exchange-input {
        width: 100% !important;
    }
    
    /* 日历/表格滚动 */
    .calendar-container,
    .table-container {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    /* 搜索框 */
    .tool-search,
    .search-box {
        width: 100% !important;
        margin-bottom: 16px !important;
    }
    
    .tool-search input,
    .search-box input {
        width: 100% !important;
        padding: 10px 12px !important;
        font-size: 14px !important;
    }
    
    /* 卡片网格 */
    .tool-card-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
    
    .tool-card-item {
        padding: 12px !important;
    }
    
    /* 图表容器 */
    .chart-container {
        height: 250px !important;
    }
    
    /* ========== 汇率换算页面专用 ========== */
    
    /* 货币转换网格 */
    .converter-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        align-items: center !important;
    }
    
    .currency-box {
        width: 100% !important;
        padding: 16px !important;
        border-radius: 12px !important;
    }
    
    .currency-box .flag {
        font-size: 28px !important;
    }
    
    .currency-box .label {
        font-size: 14px !important;
    }
    
    .currency-box input {
        font-size: 18px !important;
        padding: 10px !important;
    }
    
    .currency-box select {
        font-size: 14px !important;
        padding: 8px 10px !important;
    }
    
    /* 交换按钮 */
    .swap-btn {
        width: 40px !important;
        height: 40px !important;
        font-size: 20px !important;
        transform: rotate(90deg) !important;
    }
    
    /* 汇率信息 */
    .rate-info {
        text-align: center !important;
        padding: 12px !important;
        font-size: 13px !important;
    }
    
    /* 国家/货币网格 */
    .countries-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
    
    .country-card {
        padding: 12px 8px !important;
        border-radius: 10px !important;
    }
    
    .country-card .flag {
        font-size: 28px !important;
        margin-bottom: 6px !important;
    }
    
    .country-card .name {
        font-size: 13px !important;
    }
    
    .country-card .currency {
        font-size: 11px !important;
    }
    
    /* 汇率表格 */
    .rates-table {
        font-size: 12px !important;
    }
    
    .rates-table th,
    .rates-table td {
        padding: 8px 6px !important;
    }
    
    /* 标签页切换 */
    .exchange-tabs,
    .converter-tabs {
        display: flex !important;
        overflow-x: auto !important;
        gap: 8px !important;
        padding-bottom: 10px !important;
        margin-bottom: 16px !important;
    }
    
    .exchange-tab,
    .converter-tab {
        padding: 10px 16px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
        flex-shrink: 0 !important;
    }
    
    /* 输入区域 */
    .input-group {
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .input-group input,
    .input-group select {
        width: 100% !important;
    }
    
    /* 工具提示 */
    .tool-tips {
        font-size: 13px !important;
        padding: 14px !important;
    }
    
    .tool-tips h3 {
        font-size: 14px !important;
    }
    
    .tool-tips li {
        font-size: 12px !important;
        margin-bottom: 4px !important;
    }
    
    /* ========== 其他通用修复 ========== */
    
    /* 防止内容溢出 */
    .tool-page,
    .tool-container {
        overflow-x: hidden !important;
    }
    
    /* 两列布局改单列 */
    [class*="grid-2"],
    [class*="col-2"] {
        grid-template-columns: 1fr !important;
    }
    
    /* 三列布局改两列 */
    [class*="grid-3"],
    [class*="col-3"] {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    
    /* 四列布局改两列 */
    [class*="grid-4"],
    [class*="col-4"] {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    
    /* 强制换行 */
    .flex-row {
        flex-wrap: wrap !important;
    }
    
    /* 隐藏PC端元素 */
    .pc-only,
    .desktop-only {
        display: none !important;
    }
    
    /* ========== 人民币汇率换算页面（currency-converter）========== */
    
    /* 标签页 */
    .currency-tabs {
        display: flex !important;
        overflow-x: auto !important;
        white-space: nowrap !important;
        gap: 8px !important;
        padding-bottom: 10px !important;
        margin-bottom: 16px !important;
        scrollbar-width: none !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .currency-tabs::-webkit-scrollbar {
        display: none !important;
    }
    
    .currency-tab {
        flex-shrink: 0 !important;
        padding: 10px 14px !important;
        font-size: 13px !important;
        border-radius: 20px !important;
    }
    
    /* 内容区域 */
    .tab-content {
        padding: 0 !important;
    }
    
    /* 汇率表格 */
    .rate-table-container {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        margin: 0 -16px !important;
        padding: 0 16px !important;
    }
    
    .rate-table {
        min-width: 100% !important;
        font-size: 13px !important;
    }
    
    .rate-table th,
    .rate-table td {
        padding: 12px 8px !important;
        white-space: nowrap !important;
    }
    
    .rate-table th:first-child,
    .rate-table td:first-child {
        position: sticky !important;
        left: 0 !important;
        background: #fff !important;
        z-index: 1 !important;
    }
    
    .currency-flag {
        width: 24px !important;
        height: auto !important;
    }
    
    .currency-name {
        font-size: 12px !important;
        display: block !important;
    }
    
    .currency-code {
        font-size: 10px !important;
        color: #999 !important;
    }
    
    .rate-value {
        font-size: 12px !important;
    }
    
    .result-display {
        padding: 8px !important;
        font-size: 14px !important;
    }
    
    .converted-amount {
        font-size: 16px !important;
    }
    
    /* 快捷金额按钮 */
    .quick-amounts {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 4px !important;
        justify-content: flex-start !important;
    }
    
    .quick-amount {
        padding: 4px 8px !important;
        font-size: 10px !important;
        border-radius: 4px !important;
    }
    
    /* 汇率换算器标签页 */
    .converter-section {
        padding: 16px !important;
    }
    
    .converter-section h3 {
        font-size: 16px !important;
        margin-bottom: 16px !important;
    }
    
    .converter-row {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }
    
    .converter-item {
        width: 100% !important;
    }
    
    .converter-item label {
        font-size: 13px !important;
        margin-bottom: 6px !important;
    }
    
    .converter-item input,
    .converter-item select {
        width: 100% !important;
        padding: 12px !important;
        font-size: 14px !important;
    }
    
    /* 银行汇率牌价 */
    .bank-rate-table {
        font-size: 12px !important;
    }
    
    .bank-rate-table th,
    .bank-rate-table td {
        padding: 8px 6px !important;
    }
    
    /* 图表区域 */
    .chart-section {
        margin-top: 20px !important;
    }
    
    .chart-container {
        height: 200px !important;
    }
    
    /* 货币选择区域 */
    .from-currency,
    .to-currency {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
    }
    
    .from-currency select,
    .to-currency select {
        width: 100% !important;
    }
    
    .from-currency input,
    .to-currency input {
        width: 100% !important;
        font-size: 16px !important;
    }
    
    /* 模态框 */
    .tool-modal-content {
        width: 95% !important;
        max-height: 85vh !important;
        border-radius: 12px !important;
    }
    
    .tool-modal-header {
        padding: 14px 16px !important;
    }
    
    .tool-modal-title {
        font-size: 16px !important;
    }
    
    .tool-modal-body {
        padding: 16px !important;
    }
    
    /* 底部留出导航栏空间 */
    .tool-page {
        padding-bottom: 80px !important;
    }
    
    /* 隐藏PC端侧边栏 */
    .tools-sidebar,
    .tool-sidebar {
        display: none !important;
    }
    
    /* 主内容区全宽 */
    .tool-main-content,
    .tool-content-wrapper {
        width: 100% !important;
        margin: 0 !important;
    }
    
    /* flex布局调整 */
    .flex-row {
        flex-direction: column !important;
    }
    
    /* 复制按钮 */
    .copy-btn,
    .btn-copy {
        padding: 8px 16px !important;
        font-size: 13px !important;
    }
    
    /* 下载按钮 */
    .download-btn,
    .btn-download {
        padding: 10px 20px !important;
        font-size: 14px !important;
    }

    /* ========== 定价/计算器类页面专用 ========== */
    
    /* 三列布局改单列 */
    .pricing-layout {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
    }
    
    .pricing-layout > * {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* 隐藏左侧说明栏 */
    .pricing-instructions {
        display: none !important;
    }
    
    /* 表单区域 */
    .pricing-left,
    .pricing-right,
    .pricing-form {
        width: 100% !important;
        padding: 16px !important;
        position: static !important;
    }
    
    /* 表单组：标签在上，输入框在下 */
    .form-group {
        display: flex !important;
        flex-direction: column !important;
        gap: 6px !important;
        margin-bottom: 12px !important;
    }
    
    .form-group label {
        text-align: left !important;
        font-size: 13px !important;
    }
    
    .form-group input,
    .form-group select {
        width: 100% !important;
        padding: 10px 12px !important;
        font-size: 14px !important;
    }
    
    /* 站点和汇率行 */
    .site-rate-row {
        flex-direction: column !important;
        gap: 12px !important;
        align-items: stretch !important;
    }
    
    .site-rate-row .form-group {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 10px !important;
    }
    
    .site-rate-row .form-group select {
        flex: 1 !important;
        min-width: 0 !important;
    }
    
    .exchange-rate-display {
        justify-content: center !important;
        padding: 10px !important;
        background: #f8f9fa !important;
        border-radius: 8px !important;
    }
    
    /* 勾选框行 */
    .checkbox-row {
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .form-group.inline-checkbox {
        flex-direction: row !important;
    }
    
    /* 结果区域 */
    .result-section {
        min-height: auto !important;
    }
    
    .result-main {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .result-main-item {
        padding: 14px !important;
    }
    
    .result-main-value {
        font-size: 20px !important;
    }
    
    .result-detail {
        padding: 0 !important;
    }
    
    .result-row {
        flex-wrap: wrap !important;
        gap: 4px !important;
    }
    
    .result-row-dual {
        width: 100% !important;
        justify-content: space-between !important;
    }
    
    /* ========== 标签页切换 ========== */
    
    .pricing-tabs {
        display: flex !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        gap: 8px !important;
        padding-bottom: 10px !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .pricing-tabs::-webkit-scrollbar {
        display: none !important;
    }
    
    .pricing-tab {
        flex-shrink: 0 !important;
        padding: 10px 16px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
    }
    
    /* ========== ChatGPT指令大全页面 ========== */
    
    .prompts-container {
        padding: 0 12px !important;
        margin: 20px auto !important;
    }
    
    .prompts-header {
        padding: 20px 15px !important;
        border-radius: 10px !important;
        margin-bottom: 16px !important;
    }
    
    .prompts-header h1 {
        font-size: 20px !important;
    }
    
    .prompts-header p {
        font-size: 13px !important;
    }
    
    .prompts-tabs {
        display: flex !important;
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        gap: 6px !important;
        padding-bottom: 10px !important;
        margin-bottom: 16px !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .prompts-tabs::-webkit-scrollbar {
        display: none !important;
    }
    
    .prompts-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    
    .prompt-card {
        padding: 14px !important;
    }
    
    .prompt-card h3 {
        font-size: 14px !important;
    }
    
    .prompt-card p {
        font-size: 12px !important;
        line-height: 1.5 !important;
        /* 限制3行 */
        display: -webkit-box !important;
        -webkit-line-clamp: 3 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }
    
    .prompt-actions {
        flex-direction: row !important;
        gap: 8px !important;
    }
    
    .use-btn,
    .copy-btn {
        flex: 1 !important;
        padding: 10px 8px !important;
        font-size: 12px !important;
    }
    
    /* ========== ROI计算器页面 ========== */
    
    .rate-display {
        flex-direction: column !important;
        gap: 12px !important;
        padding: 16px !important;
    }
    
    .rate-country select {
        width: 100% !important;
    }
    
    .rate-info {
        text-align: center !important;
    }
    
    .section-title {
        font-size: 14px !important;
        padding: 10px 12px !important;
    }
    
    .form-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    
    .input-group {
        flex-direction: row !important;
    }
    
    .input-prefix,
    .input-suffix {
        padding: 10px 12px !important;
        font-size: 13px !important;
    }
    
    .tool-input {
        padding: 10px 12px !important;
        font-size: 14px !important;
    }
    
    .result-container {
        padding: 16px !important;
    }
    
    .result-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
    
    .result-card {
        padding: 14px 10px !important;
    }
    
    .result-label {
        font-size: 11px !important;
    }
    
    .result-value {
        font-size: 18px !important;
    }
    
    .result-cny {
        font-size: 11px !important;
    }
    
    .tool-tips {
        padding: 16px !important;
    }
    
    .tool-tips h3 {
        font-size: 14px !important;
    }
    
    .tool-tips li {
        font-size: 12px !important;
    }
    
    /* ========== 带后缀的输入框 ========== */
    
    .input-with-suffix {
        width: 100% !important;
    }
    
    .input-with-suffix input {
        padding-right: 50px !important;
    }
    
    .input-suffix {
        font-size: 12px !important;
    }
    
    /* ========== PayPal/费用计算器页面 ========== */
    
    .mode-selector {
        flex-direction: column !important;
        gap: 8px !important;
    }
    
    .mode-btn {
        width: 100% !important;
        padding: 12px !important;
    }
    
    .result-box {
        padding: 16px !important;
    }
    
    .result-box .result-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
    
    .result-item {
        padding: 14px !important;
    }
    
    .fee-table {
        display: block !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .fee-table th,
    .fee-table td {
        padding: 10px 8px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
    }
    
    .fee-info {
        padding: 14px !important;
    }
    
    /* ========== 计算器页面 ========== */
    
    .calculator {
        max-width: 100% !important;
        padding: 20px !important;
        border-radius: 16px !important;
    }
    
    .display {
        padding: 16px !important;
    }
    
    .display-result {
        font-size: 32px !important;
    }
    
    .buttons {
        gap: 8px !important;
    }
    
    .btn {
        padding: 16px 12px !important;
        font-size: 18px !important;
        border-radius: 10px !important;
    }
    
    .scientific-row {
        gap: 6px !important;
    }
    
    .scientific-row .btn {
        padding: 12px 6px !important;
        font-size: 12px !important;
    }
    
    .history-panel {
        padding: 16px !important;
    }
    
    /* ========== 世界时间页面 ========== */
    
    .local-time-box {
        padding: 20px !important;
    }
    
    .local-time-value {
        font-size: 36px !important;
    }
    
    .timezone-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }
    
    .timezone-card {
        padding: 14px !important;
    }
    
    .timezone-city {
        font-size: 16px !important;
    }
    
    .timezone-time {
        font-size: 24px !important;
    }
    
    .timezone-diff {
        font-size: 11px !important;
        padding: 3px 8px !important;
    }
    
    /* ========== 表格类页面通用 ========== */
    
    table {
        display: block !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    table th,
    table td {
        padding: 10px 8px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
    }
    
    /* ========== 搜索框 ========== */
    
    .search-box,
    .search-input {
        width: 100% !important;
    }
    
    .search-input {
        padding: 12px 15px !important;
        font-size: 14px !important;
    }
    
    /* ========== 工具箱首页卡片 ========== */
    
    .tools-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
    
    .tool-card {
        padding: 14px !important;
    }
    
    .tool-card-icon {
        font-size: 28px !important;
    }
    
    .tool-card-title {
        font-size: 13px !important;
    }
    
    .tool-card-desc {
        font-size: 11px !important;
        display: none !important;
    }
    
    /* ========== 底部留白 ========== */
    
    .b2-single-content.wrapper {
        padding-bottom: 80px !important;
    }
    
    /* ========== Footer全宽修复 ========== */
    
    footer,
    .footer,
    .site-footer,
    #footer,
    .b2-footer,
    .footer-wrapper,
    .footer-container {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: calc(-50vw + 50%) !important;
        margin-right: calc(-50vw + 50%) !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }
    
    footer .wrapper,
    .footer .wrapper,
    .site-footer .wrapper,
    .b2-footer .wrapper {
        width: 100% !important;
        max-width: 100% !important;
        padding: 20px 16px !important;
        margin: 0 auto !important;
    }
    
    /* ========== 标签页内容隐藏修复 ========== */
    
    /* 确保未激活的标签页内容完全隐藏 */
    .tool-content:not(.active),
    .tab-content:not(.active),
    .tab-pane:not(.active),
    [data-tab-content]:not(.active) {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        overflow: hidden !important;
        position: absolute !important;
        left: -9999px !important;
    }
    
    .tool-content.active,
    .tab-content.active,
    .tab-pane.active,
    [data-tab-content].active {
        display: block !important;
        visibility: visible !important;
        height: auto !important;
        overflow: visible !important;
        position: static !important;
        left: auto !important;
    }
    
    /* ========== 汇率换算页面专用 ========== */
    
    /* 工具标签页横向滚动 */
    .tool-tabs {
        display: flex !important;
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        gap: 6px !important;
        padding-bottom: 10px !important;
        margin-bottom: 16px !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .tool-tabs::-webkit-scrollbar {
        display: none !important;
    }
    
    .tool-tab {
        flex-shrink: 0 !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
    }
    
    /* 工具网格 */
    .tools-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }
    
    .tool-link {
        padding: 10px 8px !important;
        font-size: 12px !important;
    }
    
    .tool-code {
        font-size: 10px !important;
    }
}

    /* ========== 转换器类页面（单位转换、角度、面积等）========== */
    
    .converter-container,
    .unit-converter,
    .angle-converter,
    .area-converter,
    .speed-converter,
    .time-converter,
    .pressure-converter,
    .capacitance-converter {
        padding: 16px !important;
    }
    
    .converter-row,
    .unit-row,
    .conversion-row {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }
    
    .converter-input,
    .unit-input,
    .conversion-input {
        width: 100% !important;
    }
    
    .converter-input input,
    .unit-input input,
    .conversion-input input {
        width: 100% !important;
        padding: 12px !important;
        font-size: 16px !important;
    }
    
    .converter-input select,
    .unit-input select,
    .conversion-input select {
        width: 100% !important;
        padding: 10px !important;
        font-size: 14px !important;
    }
    
    .converter-result,
    .unit-result,
    .conversion-result {
        padding: 16px !important;
        font-size: 18px !important;
        text-align: center !important;
    }
    
    /* 单位选择网格 */
    .unit-grid,
    .units-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }
    
    .unit-item,
    .unit-btn {
        padding: 10px 8px !important;
        font-size: 12px !important;
    }
    
    /* ========== 表格类页面（机场代码、尺码表、符号等）========== */
    
    .data-table-container,
    .info-table-container,
    .codes-table-container {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        margin: 0 -16px !important;
        padding: 0 16px !important;
    }
    
    .data-table,
    .info-table,
    .codes-table {
        min-width: 500px !important;
        font-size: 12px !important;
    }
    
    .data-table th,
    .data-table td,
    .info-table th,
    .info-table td,
    .codes-table th,
    .codes-table td {
        padding: 10px 8px !important;
        white-space: nowrap !important;
    }
    
    /* 搜索过滤区域 */
    .filter-section,
    .search-filter {
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .filter-section input,
    .filter-section select,
    .search-filter input,
    .search-filter select {
        width: 100% !important;
    }
    
    /* ========== Emoji/符号选择器 ========== */
    
    .emoji-grid,
    .symbols-grid,
    .icons-grid {
        grid-template-columns: repeat(6, 1fr) !important;
        gap: 6px !important;
    }
    
    .emoji-item,
    .symbol-item,
    .icon-item {
        padding: 8px !important;
        font-size: 20px !important;
    }
    
    .emoji-categories,
    .symbol-categories {
        display: flex !important;
        overflow-x: auto !important;
        gap: 8px !important;
        padding-bottom: 10px !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .emoji-categories::-webkit-scrollbar,
    .symbol-categories::-webkit-scrollbar {
        display: none !important;
    }
    
    .emoji-category,
    .symbol-category {
        flex-shrink: 0 !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
    }
    
    /* ========== 颜色选择器 ========== */
    
    .color-picker-container {
        flex-direction: column !important;
        gap: 16px !important;
    }
    
    .color-picker-main,
    .color-picker-panel {
        width: 100% !important;
    }
    
    .color-preview {
        height: 100px !important;
        border-radius: 12px !important;
    }
    
    .color-values {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }
    
    .color-value-item {
        display: flex !important;
        justify-content: space-between !important;
        padding: 10px !important;
    }
    
    .color-palette {
        grid-template-columns: repeat(5, 1fr) !important;
        gap: 8px !important;
    }
    
    .palette-color {
        width: 100% !important;
        aspect-ratio: 1 !important;
        border-radius: 8px !important;
    }
    
    /* ========== 视频下载器 ========== */
    
    .video-downloader-container {
        padding: 16px !important;
    }
    
    .video-input-section {
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .video-input {
        width: 100% !important;
        padding: 12px !important;
        font-size: 14px !important;
    }
    
    .video-result {
        padding: 16px !important;
    }
    
    .video-thumbnail {
        width: 100% !important;
        border-radius: 8px !important;
    }
    
    .video-info {
        margin-top: 12px !important;
    }
    
    .download-options {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
    }
    
    .download-btn {
        width: 100% !important;
        padding: 12px !important;
    }
    
    /* ========== 邮件模板 ========== */
    
    .email-template-container {
        flex-direction: column !important;
        gap: 16px !important;
    }
    
    .template-list {
        width: 100% !important;
        max-height: 200px !important;
        overflow-y: auto !important;
    }
    
    .template-item {
        padding: 12px !important;
    }
    
    .template-preview {
        width: 100% !important;
    }
    
    .template-content {
        min-height: 200px !important;
        padding: 12px !important;
        font-size: 13px !important;
    }
    
    /* ========== 世界地图 ========== */
    
    .world-map-container {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .world-map {
        min-width: 600px !important;
    }
    
    .map-controls {
        flex-wrap: wrap !important;
        gap: 8px !important;
    }
    
    .map-control-btn {
        padding: 8px 12px !important;
        font-size: 12px !important;
    }
    
    /* ========== 数字转英文 ========== */
    
    .number-converter {
        padding: 16px !important;
    }
    
    .number-input {
        width: 100% !important;
        padding: 14px !important;
        font-size: 18px !important;
        text-align: center !important;
    }
    
    .number-result {
        padding: 16px !important;
        font-size: 16px !important;
        line-height: 1.6 !important;
        word-break: break-word !important;
    }
    
    /* ========== 工作时间计算器 ========== */
    
    .work-hours-form {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }
    
    .time-input-group {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
    }
    
    .time-input-group label {
        font-size: 13px !important;
    }
    
    .time-input-group input[type="time"],
    .time-input-group input[type="number"] {
        width: 100% !important;
        padding: 10px !important;
        font-size: 14px !important;
    }
    
    .work-hours-result {
        padding: 16px !important;
        text-align: center !important;
    }
    
    .work-hours-value {
        font-size: 28px !important;
        font-weight: bold !important;
    }
    
    /* ========== UPC/条码生成器 ========== */
    
    .upc-generator {
        padding: 16px !important;
    }
    
    .upc-input-section {
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .upc-input {
        width: 100% !important;
    }
    
    .upc-result {
        text-align: center !important;
        padding: 20px !important;
    }
    
    .upc-barcode {
        max-width: 100% !important;
    }
    
    .upc-list {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .upc-item {
        padding: 12px !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }
    
    /* ========== 标题生成器 ========== */
    
    .title-generator {
        padding: 16px !important;
    }
    
    .title-input-section {
        flex-direction: column !important;
        gap: 12px !important;
    }
    
    .title-keywords {
        width: 100% !important;
    }
    
    .title-options {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
    }
    
    .title-option {
        padding: 8px 12px !important;
        font-size: 12px !important;
    }
    
    .generated-titles {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .title-item {
        padding: 12px !important;
        font-size: 14px !important;
    }
    
    /* ========== 文本提取器 ========== */
    
    .text-extractor {
        padding: 16px !important;
    }
    
    .extract-options {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        margin-bottom: 12px !important;
    }
    
    .extract-option {
        padding: 8px 12px !important;
        font-size: 12px !important;
    }
    
    .extract-input,
    .extract-output {
        width: 100% !important;
        min-height: 120px !important;
        padding: 12px !important;
        font-size: 14px !important;
    }
    
    /* ========== 节假日/日历类 ========== */
    
    .holidays-container,
    .calendar-container {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .holidays-list {
        min-width: 100% !important;
    }
    
    .holiday-item {
        display: flex !important;
        flex-direction: column !important;
        gap: 4px !important;
        padding: 12px !important;
        border-bottom: 1px solid #eee !important;
    }
    
    .holiday-date {
        font-size: 12px !important;
        color: #666 !important;
    }
    
    .holiday-name {
        font-size: 14px !important;
        font-weight: 600 !important;
    }
    
    .country-select {
        width: 100% !important;
        margin-bottom: 16px !important;
    }
    
    /* ========== PayPal费用计算器 ========== */
    
    .paypal-calculator {
        padding: 16px !important;
    }
    
    .paypal-form {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }
    
    .paypal-input-group {
        display: flex !important;
        flex-direction: column !important;
        gap: 6px !important;
    }
    
    .paypal-input-group label {
        font-size: 13px !important;
    }
    
    .paypal-input-group input,
    .paypal-input-group select {
        width: 100% !important;
        padding: 10px 12px !important;
        font-size: 14px !important;
    }
    
    .paypal-result {
        padding: 16px !important;
        margin-top: 16px !important;
    }
    
    .paypal-result-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 12px !important;
    }
    
    .paypal-result-item {
        padding: 12px !important;
        text-align: center !important;
    }
    
    .paypal-result-value {
        font-size: 18px !important;
        font-weight: bold !important;
    }
    
    .paypal-result-label {
        font-size: 11px !important;
        color: #666 !important;
}

/* 超小屏幕 */
@media (max-width: 360px) {
    .tool-header h1 {
        font-size: 18px !important;
    }
    
    .tool-btn {
        flex: 1 1 100% !important;
    }
    
    .tool-stats {
        grid-template-columns: 1fr !important;
    }
    
    .tool-card-grid {
        grid-template-columns: 1fr !important;
    }
    
    .prompts-tabs .tab-btn {
        padding: 6px 10px !important;
        font-size: 11px !important;
    }
    
    .result-grid {
        grid-template-columns: 1fr !important;
    }
}

