/*
 * UI修復 - 針對特定問題的最小化修復
 * 解決頁碼97顯示問題和搜索按鈕視覺問題
 */

/* 修復1: 分頁當前頁面的可讀性問題 */
.pagination .page-item.active .page-link {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: #ffffff !important; /* 確保白色文字 */
    font-weight: 600 !important;
}

.pagination .page-item.active .page-link:hover {
    background-color: var(--primary-color-dark, #000000) !important;
    border-color: var(--primary-color-dark, #000000) !important;
    color: #ffffff !important; /* 確保hover時也是白色文字 */
}

/* 修復2: 搜索按鈕視覺改善 */
.search-button,
.search-btn {
    background-color: var(--primary-color) !important;
    color: #ffffff !important;
    border: 1px solid var(--primary-color) !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
}

.search-button:hover,
.search-btn:hover {
    background-color: var(--primary-color-dark, #000000) !important;
    color: #ffffff !important;
    border-color: var(--primary-color-dark, #000000) !important;
}

/* 修復3: 右上角搜索容器的視覺分離 */
.search-container {
    border: 1px solid var(--border-color) !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    background-color: var(--card-background) !important;
}

.search-container:focus-within {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 2px rgba(26, 26, 26, 0.1) !important;
}

/* 修復4: 搜索輸入框樣式 */
.search-input {
    border: none !important;
    background: transparent !important;
    color: var(--text-color) !important;
    outline: none !important;
}

.search-input::placeholder {
    color: var(--text-muted) !important;
}

/* 修復5: 搜索建議下拉的點擊效果 */
.suggestion-item {
    color: var(--text-color) !important;
    transition: all 0.2s ease !important;
}

.suggestion-item:hover,
.suggestion-item.suggestion-focused {
    background-color: rgba(26, 26, 26, 0.05) !important;
    color: var(--text-primary) !important;
}

/* 修復6: 確保分頁鏈接的基本樣式 */
.pagination .page-link {
    color: var(--text-color) !important;
    background-color: var(--card-background) !important;
    border: 1px solid var(--border-color) !important;
    transition: all 0.2s ease !important;
}

.pagination .page-link:hover {
    color: var(--text-primary) !important;
    background-color: var(--background-secondary) !important;
    border-color: var(--border-color) !important;
    text-decoration: none !important;
}

/* 修復7: 禁用狀態的分頁鏈接 */
.pagination .page-item.disabled .page-link {
    color: var(--text-muted) !important;
    background-color: var(--background-secondary) !important;
    border-color: var(--border-color) !important;
    cursor: not-allowed !important;
}

/* 修復8: 官方保留字字體一致性 - 強制統一字體和大小 */
.reserved-char,
.domain-char.reserved-char,
.char-container.reserved-char,
.domain-char-container .domain-char.reserved-char {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans TC', 'Source Han Sans TC', 'Microsoft JhengHei', 'PingFang TC', sans-serif !important;
    font-weight: normal !important;
    letter-spacing: normal !important;
    color: var(--text-primary) !important;
    background: transparent !important;
    font-size: inherit !important;
}

/* 確保表格中的官方保留字字體大小與普通字符一致 */
.char-container.reserved-char {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans TC', 'Source Han Sans TC', 'Microsoft JhengHei', 'PingFang TC', sans-serif !important;
    font-size: 1.5rem !important; /* 與 card-enhancements.css 中的 .char-container 一致 */
    font-weight: normal !important;
}

/* 確保卡片中的官方保留字字體大小與普通字符一致 */
.domain-char.reserved-char {
    font-size: 2.5rem !important; /* 與 style.css 中的 .domain-char 一致 */
}

/* 確保所有域名字符使用統一字體 */
.domain-char,
.char-container {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans TC', 'Source Han Sans TC', 'Microsoft JhengHei', 'PingFang TC', sans-serif !important;
    font-weight: normal !important;
}

/* 移動端字體大小一致性 */
@media (max-width: 576px) {
    .domain-char.reserved-char {
        font-size: 2rem !important; /* 與移動端 .domain-char 一致 */
    }

    .char-container.reserved-char {
        font-size: 1.75rem !important; /* 與移動端優化一致 */
    }
}

/* 確保官方保留字標籤不影響字符本身 */
.reserved-tag,
.reserved-tag-lg,
.reserved-badge-sm {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans TC', 'Source Han Sans TC', 'Microsoft JhengHei', sans-serif !important;
    /* 標籤與字符使用相同字體系統 */
}

/* 修復9: 移動端搜索按鈕優化 */
@media (max-width: 768px) {
    .search-button,
    .search-btn {
        min-width: 40px !important;
        min-height: 40px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .pagination .page-link {
        min-width: 40px !important;
        min-height: 40px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}