/**
 * Ziwei Report Viewer - 樣式文件
 * 整合 destiny24x7-dark 主題配色的紫微報告查看器
 */

/* ============================================
   主題配色變數（繼承 destiny24x7-dark）
   ============================================ */
:root {
    --ziwei-primary-red: #E74C3C;
    --ziwei-coral-pink: #EC7063;
    --ziwei-gold: #FAD7A0;
    --ziwei-dark-bg: #17202A;
    --ziwei-darker-bg: #0F141C;
    --ziwei-card-bg: #212F3D;
    --ziwei-text-light: #B0B8C1;
    --ziwei-text-muted: #7A8590;
    --ziwei-border-color: rgba(231, 76, 60, 0.2);
    --ziwei-border-light: rgba(231, 76, 60, 0.1);
}

/* ============================================
   旋转动画
   ============================================ */
@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.rotating {
    animation: rotate 0.6s linear infinite;
}

/* ============================================
   統計摘要區域
   ============================================ */
.ziwei-stats-summary {
    display: flex;
    gap: 1rem;
    margin-bottom: 2rem;
    flex-wrap: wrap;
}

.ziwei-stat-box {
    flex: 1;
    min-width: 150px;
    padding: 1.5rem;
    background: var(--ziwei-card-bg);
    border-radius: 8px;
    text-align: center;
    border: 1px solid var(--ziwei-border-color);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.ziwei-stat-label {
    display: block;
    font-size: 0.875rem;
    color: var(--ziwei-text-muted);
    margin-bottom: 0.5rem;
}

.ziwei-stat-value {
    display: block;
    font-size: 1.75rem;
    font-weight: bold;
    color: var(--ziwei-gold);
}

/* ============================================
   報告列表表格
   ============================================ */
.ziwei-reports-wrapper {
    /* 確保使用全寬度 */
    width: 100% !important;
    max-width: none !important;
    overflow-x: visible; /* 移除橫向滾動 */
}

/* 調整 WooCommerce 帳戶頁面內容區域寬度 */
.woocommerce-account .woocommerce-MyAccount-content.ziwei-reports-wrapper {
    flex: 1 1 auto !important;
    min-width: 0 !important; /* 允許內容收縮 */
    max-width: none !important;
}

.ziwei-reports-table {
    margin-top: 1.5rem;
    width: 100%;
    max-width: 100%;
    table-layout: auto; /* 自動佈局 */
}

/* 確保表格內容適度換行 */
.ziwei-reports-table td,
.ziwei-reports-table th {
    white-space: normal; /* 允許換行 */
    word-wrap: break-word;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 10px 8px;
}

/* ID 欄位不換行 */
.ziwei-reports-table .ziwei-report-id {
    white-space: nowrap !important;
}

/* 狀態、訂單、動作欄位不換行 */
.ziwei-reports-table .ziwei-report-status,
.ziwei-reports-table .ziwei-report-order,
.ziwei-reports-table .ziwei-report-actions {
    white-space: nowrap !important;
}

/* 針對按鈕列特殊處理 */
.ziwei-reports-table .ziwei-report-actions {
    overflow: visible !important; /* 允許按鈕完整顯示 */
    padding: 4px 8px !important; /* 動作列使用適當的padding */
}

/* 操作按鈕組 */
.ziwei-action-buttons {
    display: flex;
    gap: 2px;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
}

.ziwei-action-buttons .button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 28px !important;
    min-width: 28px !important;
    max-height: 28px !important;
    max-width: 28px !important;
    width: 28px !important;
    height: 28px !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
    background-color: transparent !important;
    background-image: none !important;
}

.ziwei-action-buttons .dashicons {
    font-size: 18px !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    line-height: 1 !important;
}

/* 刪除按鈕樣式 */
.ziwei-reports-table .ziwei-delete-report,
.ziwei-action-buttons .ziwei-delete-report {
    background-color: transparent !important;
    background-image: none !important;
    border-color: #dc3232 !important;
    color: #dc3232 !important;
}

.ziwei-reports-table .ziwei-delete-report .dashicons,
.ziwei-action-buttons .ziwei-delete-report .dashicons {
    color: #dc3232 !important;
}

.ziwei-reports-table .ziwei-delete-report:hover,
.ziwei-reports-table .ziwei-delete-report:focus,
.ziwei-reports-table .ziwei-delete-report:active,
.ziwei-action-buttons .ziwei-delete-report:hover,
.ziwei-action-buttons .ziwei-delete-report:focus,
.ziwei-action-buttons .ziwei-delete-report:active {
    background-color: #dc3232 !important;
    background-image: none !important;
    border-color: #dc3232 !important;
    color: #fff !important;
}

.ziwei-reports-table .ziwei-delete-report:hover .dashicons,
.ziwei-reports-table .ziwei-delete-report:focus .dashicons,
.ziwei-reports-table .ziwei-delete-report:active .dashicons,
.ziwei-action-buttons .ziwei-delete-report:hover .dashicons,
.ziwei-action-buttons .ziwei-delete-report:focus .dashicons,
.ziwei-action-buttons .ziwei-delete-report:active .dashicons {
    color: #fff !important;
}

.ziwei-reports-table .ziwei-delete-report .dashicons,
.ziwei-action-buttons .ziwei-delete-report .dashicons {
    transition: transform 0.2s ease;
}

.ziwei-reports-table .ziwei-delete-report:hover .dashicons,
.ziwei-action-buttons .ziwei-delete-report:hover .dashicons {
    transform: scale(1.1);
}

/* 查看和重新生成按鈕樣式 */
.ziwei-reports-table .ziwei-open-report,
.ziwei-reports-table .ziwei-regenerate-report,
.ziwei-action-buttons .ziwei-open-report,
.ziwei-action-buttons .ziwei-regenerate-report {
    background-color: transparent !important;
    background-image: none !important;
    border-color: #dc3232 !important;
    color: #dc3232 !important;
}

.ziwei-reports-table .ziwei-open-report .dashicons,
.ziwei-reports-table .ziwei-regenerate-report .dashicons,
.ziwei-action-buttons .ziwei-open-report .dashicons,
.ziwei-action-buttons .ziwei-regenerate-report .dashicons {
    color: #dc3232 !important;
}

.ziwei-reports-table .ziwei-open-report:hover,
.ziwei-reports-table .ziwei-regenerate-report:hover,
.ziwei-reports-table .ziwei-open-report:focus,
.ziwei-reports-table .ziwei-regenerate-report:focus,
.ziwei-reports-table .ziwei-open-report:active,
.ziwei-reports-table .ziwei-regenerate-report:active,
.ziwei-action-buttons .ziwei-open-report:hover,
.ziwei-action-buttons .ziwei-regenerate-report:hover,
.ziwei-action-buttons .ziwei-open-report:focus,
.ziwei-action-buttons .ziwei-regenerate-report:focus,
.ziwei-action-buttons .ziwei-open-report:active,
.ziwei-action-buttons .ziwei-regenerate-report:active {
    background-color: #dc3232 !important;
    background-image: none !important;
    border-color: #dc3232 !important;
    color: #fff !important;
}

.ziwei-reports-table .ziwei-open-report:hover .dashicons,
.ziwei-reports-table .ziwei-regenerate-report:hover .dashicons,
.ziwei-reports-table .ziwei-open-report:focus .dashicons,
.ziwei-reports-table .ziwei-regenerate-report:focus .dashicons,
.ziwei-reports-table .ziwei-open-report:active .dashicons,
.ziwei-reports-table .ziwei-regenerate-report:active .dashicons,
.ziwei-action-buttons .ziwei-open-report:hover .dashicons,
.ziwei-action-buttons .ziwei-regenerate-report:hover .dashicons,
.ziwei-action-buttons .ziwei-open-report:focus .dashicons,
.ziwei-action-buttons .ziwei-regenerate-report:focus .dashicons,
.ziwei-action-buttons .ziwei-open-report:active .dashicons,
.ziwei-action-buttons .ziwei-regenerate-report:active .dashicons {
    color: #fff !important;
}

/* 調整各列寬度 - 優化整體表格寬度 */
.ziwei-reports-table .ziwei-report-id {
    width: 50px;
    text-align: center;
    padding: 8px 4px;
}

.ziwei-reports-table .ziwei-report-type {
    width: 18%;
}

.ziwei-reports-table .ziwei-report-name {
    width: 15%;
}

.ziwei-reports-table .ziwei-report-date {
    width: 15%;
}

.ziwei-reports-table .ziwei-report-status {
    width: 12%;
}

.ziwei-reports-table .ziwei-report-views {
    width: 12%;
}

.ziwei-reports-table .ziwei-report-order {
    width: 10%;
}

.ziwei-reports-table .ziwei-report-actions {
    width: 100px;
    text-align: center;
}

/* 確保所有表格內容預設為左對齊 */
.ziwei-reports-table td {
    text-align: left;
}

/* 動作列內容居中 */
.ziwei-reports-table td.ziwei-report-actions {
    text-align: center;
}

.ziwei-reports-table th {
    font-weight: 600;
    background-color: var(--ziwei-card-bg);
    color: var(--ziwei-text-light);
    border-color: var(--ziwei-border-color);
    font-size: 1em; /* 確保所有表頭字體大小一致 */
    text-align: left; /* 確保所有表頭左對齊 */
}

/* 動作列表頭居中 */
.ziwei-reports-table th.ziwei-report-actions {
    text-align: center;
}

.ziwei-report-row {
    transition: background-color 0.2s ease;
    background: var(--ziwei-darker-bg);
    color: var(--ziwei-text-light);
}

.ziwei-report-row:hover {
    background-color: var(--ziwei-card-bg);
}

.ziwei-report-name {
    color: var(--ziwei-text-muted);
    text-align: left;
}

.ziwei-reports-table td.ziwei-report-name {
    text-align: left !important;
}

/* 報告列表標題區域 */
.ziwei-reports-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.ziwei-reports-header h2 {
    margin: 0;
    flex: 1;
}

/* 刷新按鈕 */
.ziwei-refresh-button {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
    transition: all 0.3s ease;
    background: linear-gradient(135deg, var(--ziwei-primary-red) 0%, var(--ziwei-coral-pink) 100%);
    border-color: var(--ziwei-primary-red);
    color: white;
    box-shadow: 0 0 15px rgba(231, 76, 60, 0.3);
}

.ziwei-refresh-button:hover {
    background: linear-gradient(135deg, var(--ziwei-coral-pink) 0%, var(--ziwei-primary-red) 100%);
    border-color: var(--ziwei-coral-pink);
    transform: translateY(-2px);
    box-shadow: 0 5px 20px rgba(231, 76, 60, 0.4);
}

.ziwei-refresh-button.loading {
    opacity: 0.7;
    cursor: wait;
}

.ziwei-refresh-icon {
    display: inline-block;
    transition: transform 0.3s ease;
}

.ziwei-refresh-button:hover .ziwei-refresh-icon,
.ziwei-refresh-icon.rotating {
    animation: rotate 0.6s linear;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* 處理中提示 */
.ziwei-processing-notice {
    margin-bottom: 1rem;
}

/* 查看按鈕樣式 */
.ziwei-open-report,
.ziwei-reports-table button.view {
    white-space: nowrap !important; /* 防止按鈕文字換行 */
    padding: 0.5rem 1rem !important;
    min-width: fit-content !important;
}

.ziwei-expiry-info {
    color: var(--ziwei-gold);
}

.ziwei-expired {
    color: var(--ziwei-primary-red);
    font-weight: bold;
}

.ziwei-no-order,
.ziwei-unavailable,
.ziwei-processing,
.ziwei-failed {
    color: var(--ziwei-text-muted);
    font-style: italic;
}

/* ============================================
   狀態徽章
   ============================================ */
.ziwei-badge {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-size: 0.875rem;
    font-weight: 600;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* 统一纯文字样式，无渐变背景 */
.ziwei-badge-success,
.ziwei-badge-warning,
.ziwei-badge-info,
.ziwei-badge-error,
.ziwei-badge-default {
    background: transparent;
    color: var(--ziwei-text-light);
    border: 1px solid var(--ziwei-border-color);
    box-shadow: none;
}

/* 純文字狀態（手機版使用） */
.ziwei-status-text {
    font-size: 0.9em;
    color: var(--ziwei-text-light);
    font-weight: 500;
}

/* ============================================
   图标按钮样式
   ============================================ */
.ziwei-action-buttons {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.ziwei-icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    background: var(--ziwei-card-bg);
    border: 1px solid var(--ziwei-border-color);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    color: var(--ziwei-text-light);
}

.ziwei-icon-button:hover {
    background: rgba(231, 76, 60, 0.1);
    border-color: var(--ziwei-primary-red);
    color: var(--ziwei-primary-red);
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

.ziwei-icon-button .dashicons {
    width: 20px;
    height: 20px;
    font-size: 20px;
}

.ziwei-icon-button:disabled,
.ziwei-icon-button.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

/* ============================================
   進度條
   ============================================ */
.ziwei-progress-bar {
    width: 100%;
    height: 20px;
    background-color: var(--ziwei-darker-bg);
    border-radius: 10px;
    overflow: hidden;
    margin: 0.5rem 0;
    border: 1px solid var(--ziwei-border-color);
}

.ziwei-progress-bar-inner {
    height: 100%;
    background: linear-gradient(90deg, var(--ziwei-primary-red), var(--ziwei-gold));
    transition: width 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 10px rgba(231, 76, 60, 0.5);
}

.ziwei-progress-text {
    color: white;
    font-size: 0.75rem;
    font-weight: bold;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.ziwei-progress-label {
    font-size: 0.875rem;
    color: var(--ziwei-text-light);
    margin-top: 0.25rem;
}

/* ============================================
   報告詳細頁面
   ============================================ */
.ziwei-report-detail-wrapper {
    max-width: 900px;
}

.ziwei-report-navigation {
    margin-bottom: 1.5rem;
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.ziwei-back-button,
.ziwei-print-button {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.ziwei-report-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--ziwei-border-color);
}

.ziwei-report-title {
    margin: 0;
    font-size: 1.75rem;
    color: var(--ziwei-gold);
    text-shadow: 0 0 10px rgba(250, 215, 160, 0.3);
}

/* ============================================
   報告元數據區域
   ============================================ */
.ziwei-report-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.ziwei-meta-section {
    background: var(--ziwei-card-bg);
    padding: 1.5rem;
    border-radius: 8px;
    border: 1px solid var(--ziwei-border-color);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.ziwei-meta-section h3 {
    margin-top: 0;
    margin-bottom: 1rem;
    font-size: 1.125rem;
    color: var(--ziwei-gold);
    border-bottom: 1px solid var(--ziwei-border-color);
    padding-bottom: 0.5rem;
}

.ziwei-input-params {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.5rem 1rem;
    margin: 0;
}

.ziwei-input-params dt {
    font-weight: 600;
    color: var(--ziwei-text-light);
}

.ziwei-input-params dd {
    margin: 0;
    color: var(--ziwei-text-light);
}

/* ============================================
   報告內容區域
   ============================================ */
.ziwei-report-content {
    margin: 2rem 0;
}

.ziwei-report-section {
    background: var(--ziwei-card-bg);
    padding: 2rem;
    margin-bottom: 2rem;
    border: 1px solid var(--ziwei-border-color);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

.ziwei-section-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0;
    margin-bottom: 1.5rem;
    font-size: 1.375rem;
    color: var(--ziwei-gold);
    border-bottom: 2px solid var(--ziwei-primary-red);
    padding-bottom: 0.75rem;
}

.ziwei-section-badge {
    font-size: 1rem;
}

.ziwei-section-content {
    line-height: 1.8;
    color: var(--ziwei-text-light);
    font-size: 1rem;
}

.ziwei-section-content p {
    margin-bottom: 1rem;
}

.ziwei-section-content h4 {
    color: var(--ziwei-gold);
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
}

.ziwei-section-meta {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--ziwei-border-color);
}

.ziwei-token-info {
    color: var(--ziwei-text-muted);
    font-size: 0.875rem;
}

/* ============================================
   命盤圖表
   ============================================ */
.ziwei-chart-section {
    background: var(--ziwei-darker-bg);
}

.ziwei-chart-container h3 {
    margin-top: 0;
    color: var(--ziwei-gold);
}

.ziwei-chart {
    padding: 1rem;
    background: var(--ziwei-card-bg);
    border-radius: 8px;
    overflow-x: auto;
    border: 1px solid var(--ziwei-border-color);
}

/* ============================================
   報告尾部
   ============================================ */
.ziwei-report-footer {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 2px solid var(--ziwei-border-color);
}

.ziwei-disclaimer {
    background: rgba(250, 215, 160, 0.1);
    padding: 1.5rem;
    border-left: 4px solid var(--ziwei-gold);
    margin-bottom: 2rem;
    border-radius: 4px;
}

.ziwei-disclaimer h4 {
    margin-top: 0;
    color: var(--ziwei-gold);
}

.ziwei-disclaimer p {
    margin-bottom: 0;
    color: var(--ziwei-text-light);
    font-size: 0.875rem;
}

.ziwei-admin-info {
    background: rgba(231, 76, 60, 0.1);
    padding: 1.5rem;
    border-left: 4px solid var(--ziwei-primary-red);
    margin-bottom: 2rem;
    border-radius: 4px;
}

.ziwei-admin-info h4 {
    margin-top: 0;
    color: var(--ziwei-primary-red);
}

.ziwei-admin-info dl {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.5rem 1rem;
}

.ziwei-admin-info dt {
    font-weight: 600;
    color: var(--ziwei-text-light);
}

.ziwei-admin-info dd {
    margin: 0;
    color: var(--ziwei-text-light);
}

.ziwei-admin-info code {
    background: var(--ziwei-darker-bg);
    padding: 0.25rem 0.5rem;
    border-radius: 3px;
    font-size: 0.875rem;
    color: var(--ziwei-gold);
    border: 1px solid var(--ziwei-border-light);
}

/* ============================================
   訪問被拒絕頁面
   ============================================ */
.ziwei-access-denied-content {
    padding: 2rem;
    background: var(--ziwei-card-bg);
    border-radius: 8px;
    margin-top: 1.5rem;
    border: 1px solid var(--ziwei-border-color);
}

.ziwei-access-denied-content h3 {
    color: var(--ziwei-primary-red);
    margin-top: 0;
}

.ziwei-access-denied-content ul {
    line-height: 1.8;
    color: var(--ziwei-text-light);
}

/* ============================================
   幫助提示
   ============================================ */
.ziwei-reports-help {
    width: 100%;
    max-width: 100%;
    margin-top: 2rem;
    padding: 1.5rem;
    background: rgba(52, 152, 219, 0.1);
    border-left: 4px solid #3498db;
    border-radius: 8px;
    box-sizing: border-box;
}

.ziwei-help-text {
    margin: 0;
    color: var(--ziwei-text-light);
    width: 100%;
}

/* ============================================
   響應式設計
   ============================================ */
@media (max-width: 768px) {
    .ziwei-stats-summary {
        flex-direction: column;
    }
    
    .ziwei-stat-box {
        min-width: 100%;
    }
    
    .ziwei-report-meta {
        grid-template-columns: 1fr;
    }
    
    .ziwei-report-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .ziwei-section-title {
        font-size: 1.125rem;
    }
    
    .ziwei-report-section {
        padding: 1.5rem;
    }
    
    /* 在小屏幕上讓表格可以水平滾動 */
    .ziwei-reports-table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
    
    /* 或者在手機上使用卡片式佈局 */
    .ziwei-reports-table thead {
        display: none; /* 隱藏表頭 */
    }
    
    .ziwei-reports-table tbody,
    .ziwei-reports-table tr,
    .ziwei-reports-table td {
        display: block;
        width: 100%;
    }
    
    .ziwei-reports-table tr {
        margin-bottom: 1rem;
        border: 1px solid var(--ziwei-border-color);
        padding: 1rem;
        background: var(--ziwei-card-bg);
        border-radius: 8px;
    }
    
    .ziwei-reports-table td {
        text-align: left !important;
        padding: 0.5rem 0 !important;
        border: none !important;
        direction: ltr !important;
    }
    
    /* 確保所有欄位內容都左對齊 */
    .ziwei-reports-table td *,
    .ziwei-reports-table td strong,
    .ziwei-reports-table td span {
        text-align: left !important;
        direction: ltr !important;
    }
    
    .ziwei-reports-table td.ziwei-report-name {
        text-align: left !important;
        width: auto !important;
    }
    
    .ziwei-reports-table td.ziwei-report-type {
        text-align: left !important;
    }
    
    .ziwei-reports-table td.ziwei-report-type strong {
        text-align: left !important;
        display: block !important;
    }
    
    .ziwei-reports-table td.ziwei-report-id {
        text-align: left !important;
    }
    
    .ziwei-reports-table td.ziwei-report-id span {
        text-align: left !important;
        display: block !important;
    }
    
    .ziwei-reports-table td.ziwei-report-name span {
        text-align: left !important;
        display: block !important;
    }
    
    /* 手機版不顯示欄位標題 */
    .ziwei-reports-table td::before {
        display: none !important;
        content: none !important;
    }
    
    /* 確保按鈕在卡片式佈局中樣式一致 */
    .ziwei-reports-table .ziwei-open-report,
    .ziwei-reports-table .ziwei-regenerate-report,
    .ziwei-reports-table .ziwei-delete-report,
    .ziwei-action-buttons .ziwei-open-report,
    .ziwei-action-buttons .ziwei-regenerate-report,
    .ziwei-action-buttons .ziwei-delete-report {
        background-color: transparent !important;
        background-image: none !important;
        border-color: #dc3232 !important;
        color: #dc3232 !important;
        /* 移動端優化：增加觸摸區域 */
        min-width: 44px !important;
        min-height: 44px !important;
        padding: 8px 12px !important;
        -webkit-tap-highlight-color: rgba(220, 50, 50, 0.2);
        touch-action: manipulation;
    }
    
    .ziwei-reports-table .ziwei-open-report .dashicons,
    .ziwei-reports-table .ziwei-regenerate-report .dashicons,
    .ziwei-reports-table .ziwei-delete-report .dashicons,
    .ziwei-action-buttons .ziwei-open-report .dashicons,
    .ziwei-action-buttons .ziwei-regenerate-report .dashicons,
    .ziwei-action-buttons .ziwei-delete-report .dashicons {
        color: #dc3232 !important;
        font-size: 20px !important;
    }
    
    /* 移動端：使用 active 替代 hover */
    .ziwei-reports-table .ziwei-open-report:active,
    .ziwei-reports-table .ziwei-regenerate-report:active,
    .ziwei-reports-table .ziwei-delete-report:active,
    .ziwei-action-buttons .ziwei-open-report:active,
    .ziwei-action-buttons .ziwei-regenerate-report:active,
    .ziwei-action-buttons .ziwei-delete-report:active {
        background-color: #dc3232 !important;
        background-image: none !important;
        border-color: #dc3232 !important;
        color: #fff !important;
        transform: scale(0.95);
        transition: all 0.1s ease;
    }
    
    .ziwei-reports-table .ziwei-open-report:active .dashicons,
    .ziwei-reports-table .ziwei-regenerate-report:active .dashicons,
    .ziwei-reports-table .ziwei-delete-report:active .dashicons,
    .ziwei-action-buttons .ziwei-open-report:active .dashicons,
    .ziwei-action-buttons .ziwei-regenerate-report:active .dashicons,
    .ziwei-action-buttons .ziwei-delete-report:active .dashicons {
        color: #fff !important;
    }
    
    /* 禁用和處理中狀態 */
    .ziwei-reports-table button:disabled,
    .ziwei-reports-table button.processing,
    .ziwei-action-buttons button:disabled,
    .ziwei-action-buttons button.processing {
        opacity: 0.6 !important;
        cursor: not-allowed !important;
        pointer-events: none !important;
    }
}

/* ============================================
   打印樣式
   ============================================ */
@media print {
    .ziwei-report-navigation,
    .ziwei-print-button,
    .woocommerce-MyAccount-navigation,
    .site-header,
    .site-footer {
        display: none !important;
    }
    
    .ziwei-report-section {
        page-break-inside: avoid;
        box-shadow: none;
        border: 1px solid #ddd;
    }
    
    .ziwei-report-detail-wrapper {
        max-width: 100%;
    }
}

/* ============================================
   WooCommerce 兼容性
   ============================================ */
.woocommerce-MyAccount-content.ziwei-reports-wrapper,
.woocommerce-MyAccount-content.ziwei-report-detail-wrapper {
    padding: 0;
    float: none !important;
    width: 100% !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 確保父容器也正常顯示 */
.woocommerce-account .woocommerce-MyAccount-content.ziwei-reports-wrapper,
.woocommerce-account .woocommerce-MyAccount-content.ziwei-report-detail-wrapper {
    margin: 0 !important;
}

/* 防止報告內容被隱藏 - 覆蓋任何可能的主題樣式 */
.ziwei-report-detail-wrapper,
.ziwei-report-detail-wrapper *,
.ziwei-reports-wrapper,
.ziwei-reports-wrapper * {
    opacity: 1 !important;
    visibility: visible !important;
    display: revert !important;
}

.ziwei-report-detail-wrapper,
.ziwei-reports-wrapper {
    transform: none !important;
    transition: none !important;
}

/* 確保報告內容區塊不會被隱藏 */
.ziwei-report-section,
.ziwei-report-content,
.ziwei-report-header,
.ziwei-report-meta,
.ziwei-report-footer {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    transform: none !important;
}

/* 確保按鈕樣式與 WooCommerce 一致 */
.ziwei-reports-wrapper .button,
.ziwei-report-detail-wrapper .button {
    padding: 0.6180469716em 1.41575em;
    font-weight: 700;
    border-radius: 3px;
    text-decoration: none;
}

/* ============================================
   響應式設計 - 優化小屏幕顯示
   ============================================ */

/* 平板及以下 (1024px) */
@media (max-width: 1024px) {
    /* 隱藏 ID 列 */
    .ziwei-reports-table .ziwei-report-id {
        display: none;
    }
    
    /* 縮小日期列 */
    .ziwei-reports-table .ziwei-report-date {
        font-size: 0.9em;
    }
    
    /* 調整動作按鈕大小 */
    .ziwei-action-buttons .button {
        padding: 0 !important;
        min-height: 26px !important;
        min-width: 26px !important;
        max-height: 26px !important;
        max-width: 26px !important;
        width: 26px !important;
        height: 26px !important;
    }
    
    .ziwei-action-buttons .dashicons {
        font-size: 16px !important;
        width: 16px !important;
        height: 16px !important;
    }
    
    /* 確保按鈕樣式在平板上保持一致 */
    .ziwei-reports-table .ziwei-open-report,
    .ziwei-reports-table .ziwei-regenerate-report,
    .ziwei-reports-table .ziwei-delete-report,
    .ziwei-action-buttons .ziwei-open-report,
    .ziwei-action-buttons .ziwei-regenerate-report,
    .ziwei-action-buttons .ziwei-delete-report {
        background-color: transparent !important;
        background-image: none !important;
        border-color: #dc3232 !important;
        color: #dc3232 !important;
    }
    
    .ziwei-reports-table .ziwei-open-report .dashicons,
    .ziwei-reports-table .ziwei-regenerate-report .dashicons,
    .ziwei-reports-table .ziwei-delete-report .dashicons,
    .ziwei-action-buttons .ziwei-open-report .dashicons,
    .ziwei-action-buttons .ziwei-regenerate-report .dashicons,
    .ziwei-action-buttons .ziwei-delete-report .dashicons {
        color: #dc3232 !important;
    }
    
    .ziwei-reports-table .ziwei-open-report:hover,
    .ziwei-reports-table .ziwei-regenerate-report:hover,
    .ziwei-reports-table .ziwei-delete-report:hover,
    .ziwei-reports-table .ziwei-open-report:active,
    .ziwei-reports-table .ziwei-regenerate-report:active,
    .ziwei-reports-table .ziwei-delete-report:active,
    .ziwei-action-buttons .ziwei-open-report:hover,
    .ziwei-action-buttons .ziwei-regenerate-report:hover,
    .ziwei-action-buttons .ziwei-delete-report:hover,
    .ziwei-action-buttons .ziwei-open-report:active,
    .ziwei-action-buttons .ziwei-regenerate-report:active,
    .ziwei-action-buttons .ziwei-delete-report:active {
        background-color: #dc3232 !important;
        background-image: none !important;
        border-color: #dc3232 !important;
        color: #fff !important;
    }
    
    .ziwei-reports-table .ziwei-open-report:hover .dashicons,
    .ziwei-reports-table .ziwei-regenerate-report:hover .dashicons,
    .ziwei-reports-table .ziwei-delete-report:hover .dashicons,
    .ziwei-reports-table .ziwei-open-report:active .dashicons,
    .ziwei-reports-table .ziwei-regenerate-report:active .dashicons,
    .ziwei-reports-table .ziwei-delete-report:active .dashicons,
    .ziwei-action-buttons .ziwei-open-report:hover .dashicons,
    .ziwei-action-buttons .ziwei-regenerate-report:hover .dashicons,
    .ziwei-action-buttons .ziwei-delete-report:hover .dashicons,
    .ziwei-action-buttons .ziwei-open-report:active .dashicons,
    .ziwei-action-buttons .ziwei-regenerate-report:active .dashicons,
    .ziwei-action-buttons .ziwei-delete-report:active .dashicons {
        color: #fff !important;
    }
}

/* 手機橫屏 (768px) */
@media (max-width: 768px) {
    /* 隱藏下載期限列 */
    .ziwei-reports-table .ziwei-report-views {
        display: none;
    }
    
    /* 訂單列只顯示訂單號 */
    .ziwei-reports-table td.ziwei-report-order {
        font-size: 0.85em;
    }
    
    /* 確保按鈕樣式在手機橫屏上保持一致 */
    .ziwei-reports-table .ziwei-open-report,
    .ziwei-reports-table .ziwei-regenerate-report,
    .ziwei-reports-table .ziwei-delete-report,
    .ziwei-action-buttons .ziwei-open-report,
    .ziwei-action-buttons .ziwei-regenerate-report,
    .ziwei-action-buttons .ziwei-delete-report {
        background-color: transparent !important;
        background-image: none !important;
        border-color: #dc3232 !important;
        color: #dc3232 !important;
    }
    
    .ziwei-reports-table .ziwei-open-report .dashicons,
    .ziwei-reports-table .ziwei-regenerate-report .dashicons,
    .ziwei-reports-table .ziwei-delete-report .dashicons,
    .ziwei-action-buttons .ziwei-open-report .dashicons,
    .ziwei-action-buttons .ziwei-regenerate-report .dashicons,
    .ziwei-action-buttons .ziwei-delete-report .dashicons {
        color: #dc3232 !important;
    }
    
    .ziwei-reports-table .ziwei-open-report:hover,
    .ziwei-reports-table .ziwei-regenerate-report:hover,
    .ziwei-reports-table .ziwei-delete-report:hover,
    .ziwei-reports-table .ziwei-open-report:active,
    .ziwei-reports-table .ziwei-regenerate-report:active,
    .ziwei-reports-table .ziwei-delete-report:active,
    .ziwei-action-buttons .ziwei-open-report:hover,
    .ziwei-action-buttons .ziwei-regenerate-report:hover,
    .ziwei-action-buttons .ziwei-delete-report:hover,
    .ziwei-action-buttons .ziwei-open-report:active,
    .ziwei-action-buttons .ziwei-regenerate-report:active,
    .ziwei-action-buttons .ziwei-delete-report:active {
        background-color: #dc3232 !important;
        background-image: none !important;
        border-color: #dc3232 !important;
        color: #fff !important;
    }
    
    .ziwei-reports-table .ziwei-open-report:hover .dashicons,
    .ziwei-reports-table .ziwei-regenerate-report:hover .dashicons,
    .ziwei-reports-table .ziwei-delete-report:hover .dashicons,
    .ziwei-reports-table .ziwei-open-report:active .dashicons,
    .ziwei-reports-table .ziwei-regenerate-report:active .dashicons,
    .ziwei-reports-table .ziwei-delete-report:active .dashicons,
    .ziwei-action-buttons .ziwei-open-report:hover .dashicons,
    .ziwei-action-buttons .ziwei-regenerate-report:hover .dashicons,
    .ziwei-action-buttons .ziwei-delete-report:hover .dashicons,
    .ziwei-action-buttons .ziwei-open-report:active .dashicons,
    .ziwei-action-buttons .ziwei-regenerate-report:active .dashicons,
    .ziwei-action-buttons .ziwei-delete-report:active .dashicons {
        color: #fff !important;
    }
}

/* 手機直屏 (480px) - 使用卡片式佈局 */
@media (max-width: 480px) {
    .ziwei-reports-table {
        font-size: 0.9em;
    }
    
    /* 進一步縮小按鈕 */
    .ziwei-action-buttons .button {
        padding: 0 !important;
        min-height: 24px !important;
        min-width: 24px !important;
        max-height: 24px !important;
        max-width: 24px !important;
        width: 24px !important;
        height: 24px !important;
    }
    
    .ziwei-action-buttons .dashicons {
        font-size: 14px !important;
        width: 14px !important;
        height: 14px !important;
    }
    
    /* 確保按鈕樣式在手機直屏上保持一致 */
    .ziwei-reports-table .ziwei-open-report,
    .ziwei-reports-table .ziwei-regenerate-report,
    .ziwei-reports-table .ziwei-delete-report,
    .ziwei-action-buttons .ziwei-open-report,
    .ziwei-action-buttons .ziwei-regenerate-report,
    .ziwei-action-buttons .ziwei-delete-report {
        background-color: transparent !important;
        background-image: none !important;
        border-color: #dc3232 !important;
        color: #dc3232 !important;
    }
    
    .ziwei-reports-table .ziwei-open-report .dashicons,
    .ziwei-reports-table .ziwei-regenerate-report .dashicons,
    .ziwei-reports-table .ziwei-delete-report .dashicons,
    .ziwei-action-buttons .ziwei-open-report .dashicons,
    .ziwei-action-buttons .ziwei-regenerate-report .dashicons,
    .ziwei-action-buttons .ziwei-delete-report .dashicons {
        color: #dc3232 !important;
    }
    
    .ziwei-reports-table .ziwei-open-report:hover,
    .ziwei-reports-table .ziwei-regenerate-report:hover,
    .ziwei-reports-table .ziwei-delete-report:hover,
    .ziwei-reports-table .ziwei-open-report:active,
    .ziwei-reports-table .ziwei-regenerate-report:active,
    .ziwei-reports-table .ziwei-delete-report:active,
    .ziwei-action-buttons .ziwei-open-report:hover,
    .ziwei-action-buttons .ziwei-regenerate-report:hover,
    .ziwei-action-buttons .ziwei-delete-report:hover,
    .ziwei-action-buttons .ziwei-open-report:active,
    .ziwei-action-buttons .ziwei-regenerate-report:active,
    .ziwei-action-buttons .ziwei-delete-report:active {
        background-color: #dc3232 !important;
        background-image: none !important;
        border-color: #dc3232 !important;
        color: #fff !important;
    }
    
    .ziwei-reports-table .ziwei-open-report:hover .dashicons,
    .ziwei-reports-table .ziwei-regenerate-report:hover .dashicons,
    .ziwei-reports-table .ziwei-delete-report:hover .dashicons,
    .ziwei-reports-table .ziwei-open-report:active .dashicons,
    .ziwei-reports-table .ziwei-regenerate-report:active .dashicons,
    .ziwei-reports-table .ziwei-delete-report:active .dashicons,
    .ziwei-action-buttons .ziwei-open-report:hover .dashicons,
    .ziwei-action-buttons .ziwei-regenerate-report:hover .dashicons,
    .ziwei-action-buttons .ziwei-delete-report:hover .dashicons,
    .ziwei-action-buttons .ziwei-open-report:active .dashicons,
    .ziwei-action-buttons .ziwei-regenerate-report:active .dashicons,
    .ziwei-action-buttons .ziwei-delete-report:active .dashicons {
        color: #fff !important;
    }
}