/* PDF 工具頁面容器 */
.pt-container {
    flex: 1;
    min-width: 0;
}

/* 英雄區塊：頁面標題與描述 */
.pt-hero {
    margin-bottom: 2em;
}

/* 頁面主標題 */
.pt-hero-title {
    font-size: 1.75em;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 0.25em 0;
}

/* 頁面副標題 */
.pt-hero-subtitle {
    font-size: 1em;
    color: #64748b;
    margin: 0 0 0.5em 0;
}

/* 頁面描述文字 */
.pt-hero-desc {
    font-size: 0.9em;
    color: #64748b;
    margin: 0;
    line-height: 1.6;
}

/* 分頁切換列 */
.pt-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid #e2e8f0;
    margin-bottom: 1.5em;
    overflow-x: auto;
}

/* 單一分頁按鈕 */
.pt-tab {
    padding: 0.75em 1.25em;
    font-size: 0.95em;
    font-weight: 500;
    color: #64748b;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.2s, border-color 0.2s;
}

/* 分頁按鈕滑鼠移入效果 */
.pt-tab:hover {
    color: #3b82f6;
}

/* 分頁按鈕啟用狀態 */
.pt-tab.is-active {
    color: #3b82f6;
    border-bottom-color: #3b82f6;
    font-weight: 600;
}

/* 鍵盤焦點可見樣式（無障礙） */
.pt-tab:focus-visible {
    outline: 2px solid #3b82f6;
    outline-offset: -2px;
}

/* 分頁面板容器 */
.pt-panel {
    display: none;
}

/* 分頁面板啟用狀態 */
.pt-panel.is-active {
    display: block;
}

/* 工具卡片 */
.pt-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75em;
    overflow: hidden;
    margin-bottom: 1.5em;
}

/* 工具卡片內容區 */
.pt-card-body {
    padding: 1.5em;
}

/* 區塊標題 */
.pt-section-title {
    font-size: 1.1em;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 0.25em 0;
    display: flex;
    align-items: center;
    gap: 0.5em;
}

/* 區塊標題圖示顏色 */
.pt-section-title i {
    color: #3b82f6;
}

/* 區塊描述文字 */
.pt-section-desc {
    font-size: 0.9em;
    color: #64748b;
    margin: 0 0 1.25em 0;
    line-height: 1.6;
}

/* 拖放上傳區域 */
.pt-upload-zone {
    border: 2px dashed #cbd5e1;
    border-radius: 0.75em;
    padding: 2.5em 1.5em;
    text-align: center;
    cursor: pointer;
    transition: border-color 0.2s, background-color 0.2s;
    margin-bottom: 1em;
}

/* 上傳區域拖曳中效果 */
.pt-upload-zone.is-dragover {
    border-color: #3b82f6;
    background-color: #eff6ff;
}

/* 上傳區域滑鼠移入效果 */
.pt-upload-zone:hover {
    border-color: #94b8ed;
}

/* 上傳圖示 */
.pt-upload-icon {
    font-size: 2.5em;
    color: #94a3b8;
    margin-bottom: 0.5em;
    display: block;
}

/* 上傳提示文字 */
.pt-upload-text {
    font-size: 0.95em;
    color: #64748b;
    margin: 0 0 1em 0;
}

/* 隱藏原生檔案輸入框 */
.pt-file-input {
    display: none;
}

/* 選擇檔案按鈕 */
.pt-upload-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.6em 1.25em;
    font-size: 0.9em;
    font-weight: 500;
    color: #ffffff;
    background-color: #3b82f6;
    border: none;
    border-radius: 0.5em;
    cursor: pointer;
    transition: background-color 0.2s;
}

/* 選擇檔案按鈕滑鼠移入 */
.pt-upload-btn:hover {
    background-color: #2563eb;
}

/* 上傳格式提示 */
.pt-upload-hint {
    display: block;
    font-size: 0.8em;
    color: #94a3b8;
    margin-top: 0.75em;
}

/* 檔案列表容器 */
.pt-file-list {
    margin-bottom: 1.25em;
}

/* 檔案列表標頭 */
.pt-file-list-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5em 0;
    margin-bottom: 0.5em;
    font-size: 0.9em;
    font-weight: 600;
    color: #1e293b;
}

/* 清除全部按鈕 */
.pt-remove-all-btn {
    font-size: 0.85em;
    color: #ef4444;
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.35em;
    padding: 0.25em 0.5em;
    border-radius: 0.25em;
    transition: background-color 0.2s;
}

/* 清除全部按鈕滑鼠移入 */
.pt-remove-all-btn:hover {
    background-color: #fef2f2;
}

/* 單一檔案列 */
.pt-file-row {
    display: flex;
    align-items: center;
    gap: 0.75em;
    padding: 0.6em 0.75em;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.5em;
    margin-bottom: 0.5em;
    transition: background-color 0.15s;
}

/* 檔案列拖曳中效果 */
.pt-file-row.is-dragging {
    opacity: 0.5;
    background: #eff6ff;
}

/* 檔案列拖曳放置目標效果 */
.pt-file-row.is-dragover-item {
    border-color: #3b82f6;
    background: #eff6ff;
}

/* 拖曳手把圖示 */
.pt-drag-handle {
    cursor: grab;
    color: #94a3b8;
    font-size: 1em;
    padding: 0.25em;
}

/* 拖曳手把抓取中 */
.pt-drag-handle:active {
    cursor: grabbing;
}

/* 檔案 PDF 圖示 */
.pt-file-icon {
    font-size: 1.5em;
    color: #ef4444;
    flex-shrink: 0;
}

/* 檔案資訊容器 */
.pt-file-info {
    flex: 1;
    min-width: 0;
}

/* 檔案名稱 */
.pt-file-name {
    font-size: 0.9em;
    font-weight: 500;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 檔案詳細資訊（大小、頁數） */
.pt-file-detail {
    font-size: 0.8em;
    color: #94a3b8;
}

/* 移除單一檔案按鈕 */
.pt-file-remove {
    color: #94a3b8;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1em;
    padding: 0.25em;
    border-radius: 0.25em;
    transition: color 0.2s, background-color 0.2s;
    flex-shrink: 0;
}

/* 移除按鈕滑鼠移入 */
.pt-file-remove:hover {
    color: #ef4444;
    background-color: #fef2f2;
}

/* 排序提示文字 */
.pt-order-hint {
    font-size: 0.8em;
    color: #94a3b8;
    margin-bottom: 1em;
    display: flex;
    align-items: center;
    gap: 0.35em;
}

/* 輸入欄位標籤 */
.pt-label {
    display: block;
    font-size: 0.9em;
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.35em;
}

/* 輸入框 */
.pt-input {
    width: 100%;
    padding: 0.6em 0.75em;
    font-size: 0.9em;
    color: #1e293b;
    border: 1px solid #d1d5db;
    border-radius: 0.5em;
    background: #ffffff;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}

/* 輸入框取得焦點 */
.pt-input:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

/* 輸入框提示文字 */
.pt-hint {
    font-size: 0.8em;
    color: #94a3b8;
    margin-top: 0.35em;
}

/* 頁數資訊標籤 */
.pt-page-info {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    padding: 0.35em 0.75em;
    font-size: 0.85em;
    font-weight: 500;
    color: #3b82f6;
    background: #eff6ff;
    border-radius: 0.375em;
    margin-bottom: 1em;
}

/* 旋轉控制區域 */
.pt-rotate-controls {
    margin-bottom: 1.25em;
}

/* 旋轉全部選項區 */
.pt-rotate-all {
    display: flex;
    align-items: center;
    gap: 1em;
    padding: 1em;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.5em;
    margin-bottom: 1em;
}

/* 旋轉全部標籤 */
.pt-rotate-all-label {
    font-size: 0.9em;
    font-weight: 500;
    color: #374151;
    white-space: nowrap;
}

/* 旋轉角度選擇器 */
.pt-rotate-select {
    padding: 0.5em 0.75em;
    font-size: 0.9em;
    border: 1px solid #d1d5db;
    border-radius: 0.5em;
    background: #ffffff;
    color: #1e293b;
    cursor: pointer;
}

/* 單頁旋轉列表 */
.pt-rotate-pages {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 0.75em;
}

/* 單頁旋轉卡片 */
.pt-rotate-page-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.6em 0.75em;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.5em;
    font-size: 0.9em;
}

/* 頁碼文字 */
.pt-rotate-page-label {
    font-weight: 500;
    color: #374151;
}

/* 旋轉角度顯示 */
.pt-rotate-page-angle {
    font-size: 0.8em;
    color: #64748b;
    margin-left: 0.5em;
}

/* 旋轉按鈕群組 */
.pt-rotate-btns {
    display: flex;
    gap: 0.35em;
}

/* 旋轉按鈕 */
.pt-rotate-btn {
    width: 2em;
    height: 2em;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85em;
    color: #64748b;
    background: #ffffff;
    border: 1px solid #d1d5db;
    border-radius: 0.375em;
    cursor: pointer;
    transition: color 0.2s, border-color 0.2s, background-color 0.2s;
}

/* 旋轉按鈕滑鼠移入 */
.pt-rotate-btn:hover {
    color: #3b82f6;
    border-color: #3b82f6;
    background: #eff6ff;
}

/* 操作按鈕群組 */
.pt-btn-group {
    display: flex;
    gap: 0.75em;
    flex-wrap: wrap;
    margin-top: 1.25em;
}

/* 通用按鈕基礎樣式 */
.pt-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.65em 1.5em;
    font-size: 0.9em;
    font-weight: 500;
    border: none;
    border-radius: 0.5em;
    cursor: pointer;
    transition: background-color 0.2s, opacity 0.2s;
}

/* 按鈕停用狀態 */
.pt-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* 藍色按鈕（主要操作） */
.pt-btn--blue {
    color: #ffffff;
    background-color: #3b82f6;
}

/* 藍色按鈕滑鼠移入 */
.pt-btn--blue:hover:not(:disabled) {
    background-color: #2563eb;
}

/* 綠色按鈕（下載） */
.pt-btn--green {
    color: #ffffff;
    background-color: #16a34a;
}

/* 綠色按鈕滑鼠移入 */
.pt-btn--green:hover:not(:disabled) {
    background-color: #15803d;
}

/* 灰色按鈕（清除） */
.pt-btn--gray {
    color: #374151;
    background-color: #f3f4f6;
}

/* 灰色按鈕滑鼠移入 */
.pt-btn--gray:hover:not(:disabled) {
    background-color: #e5e7eb;
}

/* 鍵盤焦點可見樣式（無障礙） */
.pt-btn:focus-visible {
    outline: 2px solid #3b82f6;
    outline-offset: 2px;
}

/* 壓縮結果摘要 */
.pt-compress-result {
    padding: 1em;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 0.5em;
    margin-top: 1em;
}

/* 壓縮結果標題 */
.pt-compress-result-title {
    font-size: 0.95em;
    font-weight: 600;
    color: #166534;
    margin-bottom: 0.75em;
}

/* 壓縮結果列 */
.pt-compress-result-row {
    display: flex;
    justify-content: space-between;
    font-size: 0.9em;
    color: #374151;
    padding: 0.25em 0;
}

/* 壓縮結果數值 */
.pt-compress-result-value {
    font-weight: 500;
}

/* 壓縮節省百分比（綠色強調） */
.pt-compress-result-saved {
    font-weight: 600;
    color: #16a34a;
}

/* 處理中覆蓋層 */
.pt-loading {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
    padding: 1em;
    font-size: 0.9em;
    color: #3b82f6;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 0.5em;
    margin-top: 1em;
}

/* 處理中可見狀態 */
.pt-loading.is-visible {
    display: flex;
}

/* 旋轉動畫（載入圖示） */
.pt-loading .fa-spinner {
    animation: pt-spin 1s linear infinite;
}

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

/* 768px 以下的響應式調整 */
@media (max-width: 768px) {
    /* 主標題縮小 */
    .pt-hero-title {
        font-size: 1.4em;
    }

    /* 分頁按鈕內距縮小 */
    .pt-tab {
        padding: 0.6em 0.85em;
        font-size: 0.85em;
    }

    /* 卡片內距縮小 */
    .pt-card-body {
        padding: 1em;
    }

    /* 按鈕群組改為直排 */
    .pt-btn-group {
        flex-direction: column;
    }

    /* 按鈕全寬 */
    .pt-btn {
        justify-content: center;
        width: 100%;
    }

    /* 旋轉頁面卡片單欄排列 */
    .pt-rotate-pages {
        grid-template-columns: 1fr;
    }

    /* 旋轉全部控制區改為直排 */
    .pt-rotate-all {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5em;
    }
}

/* 高對比度模式支援（無障礙） */
@media (forced-colors: active) {
    .pt-tab.is-active {
        border-bottom: 2px solid LinkText;
    }

    .pt-upload-zone {
        border-color: ButtonText;
    }

    .pt-btn {
        border: 1px solid ButtonText;
    }

    .pt-file-row {
        border-color: ButtonText;
    }
}

/* 減少動態效果（無障礙） */
@media (prefers-reduced-motion: reduce) {
    .pt-tab,
    .pt-btn,
    .pt-upload-zone,
    .pt-file-remove,
    .pt-rotate-btn {
        transition: none;
    }

    .pt-loading .fa-spinner {
        animation: none;
    }
}
