/* PDF Under — 共用樣式 */

/* Reset */
*,::after,::before{box-sizing:border-box;margin:0;padding:0}
:focus-visible{outline:2px solid #4a6cf7;outline-offset:2px}
input:focus-visible,select:focus-visible{outline:2px solid #4a6cf7;outline-offset:0;border-color:#4a6cf7}

/* Body & Layout */
body{font-family:"Microsoft JhengHei","Segoe UI",sans-serif;background:#f0f2f5;color:#1a1a2e;min-height:100vh;display:flex;justify-content:center;padding:40px 16px;line-height:1.6}
.container{width:100%;max-width:640px;position:relative}

/* Language Switch */
.lang-switch{position:absolute;top:0;right:0;font-size:.82rem;color:#4a6cf7;text-decoration:none;padding:4px 10px;border:1px solid #d0d5dd;border-radius:6px;background:#fff;transition:background .2s}
.lang-switch:hover{background:#f6f8ff;text-decoration:none}

/* Brand */
h1{font-size:1.6rem;font-weight:700;text-align:center;margin-bottom:6px;letter-spacing:-.5px}
.brand{color:#4a6cf7}
.brand-under{color:#059669}
.subtitle{text-align:center;color:#555;font-size:.9rem;margin-bottom:28px;text-wrap:balance}
.h1-sub{font-size:.65em;font-weight:400;color:#555;display:block;margin-top:2px}

/* Nav Bar */
.nav-bar{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:20px}
.nav-bar a{padding:6px 14px;border-radius:6px;font-size:.85rem;color:#4a6cf7;text-decoration:none;background:#f6f8ff;transition:background .2s,color .2s}
.nav-bar a:hover,.nav-bar a.active{background:#4a6cf7;color:#fff}

/* Card */
.card{background:#fff;border-radius:12px;padding:28px;box-shadow:0 2px 12px rgba(0,0,0,.08);margin-bottom:20px}

/* Upload Area */
.upload-area{border:2px dashed #c0c6d0;border-radius:10px;padding:40px 20px;text-align:center;cursor:pointer;transition:border-color .2s,background .2s}
.upload-area.dragover,.upload-area:hover{border-color:#4a6cf7;background:#f6f8ff}
.upload-area p{color:#555;font-size:.95rem}
.upload-area input{display:none}
.file-info{margin-top:16px;padding:12px 16px;background:#f6f8ff;border-radius:8px;display:none;font-size:.9rem}
.file-info .name{font-weight:600}
.file-info .meta{color:#555;margin-top:4px}

/* Settings */
.settings{display:none}
.setting-group{margin-bottom:20px}
.setting-group label{display:block;font-weight:600;font-size:.9rem;margin-bottom:8px}
.size-input-row{display:flex;align-items:center;gap:10px}
.size-input-row input[type=number]{width:100px;padding:8px 12px;border:1px solid #d0d5dd;border-radius:8px;font-size:1rem;text-align:center}
.size-input-row select{padding:8px 12px;border:1px solid #d0d5dd;border-radius:8px;font-size:1rem;background:#fff}
.size-input-row .orig-size{font-size:.82rem;color:#6b7280}

/* Buttons */
.btn-compress{width:100%;padding:14px;background:#4a6cf7;color:#fff;border:none;border-radius:10px;font-size:1.05rem;font-weight:600;cursor:pointer;transition:background .2s;margin-top:8px}
.btn-compress:hover{background:#3a5ce5}
.btn-compress:disabled{background:#b0bec5;cursor:not-allowed}
.btn-download{width:100%;padding:14px;background:#10b981;color:#fff;border:none;border-radius:10px;font-size:1.05rem;font-weight:600;cursor:pointer;transition:background .2s;text-decoration:none;display:block;text-align:center}
.btn-download:hover{background:#059669}
.btn-reset{width:100%;padding:10px;background:0 0;border:1px solid #d0d5dd;border-radius:10px;font-size:.9rem;cursor:pointer;margin-top:10px;color:#555}
.btn-reset:hover{background:#f6f8ff}

/* Progress */
.progress-section{display:none}
.progress-bar-bg{width:100%;height:8px;background:#e8ecf0;border-radius:4px;overflow:hidden;margin-bottom:10px}
.progress-bar{height:100%;width:0%;background:linear-gradient(90deg,#4a6cf7,#6c8cff);border-radius:4px;transition:width .3s}
.progress-text{font-size:.85rem;color:#555;text-align:center}

/* Result */
.result-section{display:none}
.result-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:20px}
.stat{text-align:center;padding:12px 8px;background:#f6f8ff;border-radius:8px}
.stat .value{font-size:1.2rem;font-weight:700;color:#4a6cf7}
.stat .label{font-size:.78rem;color:#6b7280;margin-top:2px}
.quality-detail{font-size:.85rem;color:#555;text-align:center;margin-bottom:16px}

/* Content Sections */
.content-section{background:#fff;border-radius:12px;padding:28px;box-shadow:0 2px 12px rgba(0,0,0,.08);margin-bottom:20px}
.content-section h2{font-size:1.15rem;font-weight:700;text-align:center;margin-bottom:20px;color:#1a1a2e}
.steps{display:flex;flex-direction:column;gap:16px}
.step{display:flex;align-items:flex-start;gap:14px}
.step-num{flex-shrink:0;width:32px;height:32px;background:#4a6cf7;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem}
.step-text h3{font-size:.95rem;font-weight:600;margin-bottom:2px}
.step-text p{font-size:.85rem;color:#555;line-height:1.6}

/* Features Grid */
.features-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.feature-item{padding:16px;background:#f6f8ff;border-radius:10px;text-align:center}
.feature-item h3{font-size:.9rem;font-weight:600;margin-bottom:4px}
.feature-item h3 a{color:#4a6cf7;text-decoration:none}
.feature-item h3 a:hover{text-decoration:underline}
.feature-item p{font-size:.82rem;color:#555;line-height:1.5}

/* Notes List (usage notes on tool pages) */
.notes-list{padding-left:20px;font-size:.9rem;color:#444;line-height:1.8}
.notes-list li{margin-bottom:6px}

/* Tech Content */
.tech-content{font-size:.88rem;color:#444;line-height:1.8}
.tech-content p{margin-bottom:12px}
.tech-content p:last-child{margin-bottom:0}

/* Simplified Feature & Trust */
.tool-feature{font-size:.9rem;color:#444;line-height:1.8;margin-bottom:12px}
.trust-line{font-size:.85rem;color:#6b7280;line-height:1.6}
.use-cases{font-size:.9rem;color:#444;line-height:1.8}

/* Log */
.log-toggle{text-align:center;margin-top:12px}
.log-toggle button{background:0 0;border:none;color:#4a6cf7;cursor:pointer;font-size:.82rem}
.log-area{display:none;margin-top:10px;padding:12px;background:#1a1a2e;color:#a0e8af;border-radius:8px;font-family:Consolas,"Source Code Pro",monospace;font-size:.78rem;max-height:260px;overflow-y:auto;line-height:1.6;white-space:pre-wrap;word-break:break-all}

/* File List (merge, images-to-pdf) */
.file-list{margin-top:16px}
.file-item{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#f6f8ff;border-radius:8px;margin-bottom:8px;font-size:.88rem}
.file-item .file-name{flex:1;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-item .file-size{color:#6b7280;font-size:.82rem;flex-shrink:0}
.file-item button{background:none;border:1px solid #d0d5dd;border-radius:6px;padding:4px 8px;cursor:pointer;font-size:.78rem;color:#555;transition:background .2s}
.file-item button:hover{background:#e8ecf0}

/* Radio Group */
.radio-group{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.radio-group label{display:flex;align-items:center;gap:6px;font-size:.9rem;cursor:pointer;padding:6px 12px;border:1px solid #d0d5dd;border-radius:8px;transition:border-color .2s,background .2s}
.radio-group label:has(input:checked){border-color:#4a6cf7;background:#f6f8ff}
.radio-group input[type=radio]{accent-color:#4a6cf7}

/* Text Input */
.text-input{width:100%;padding:10px 14px;border:1px solid #d0d5dd;border-radius:8px;font-size:.9rem;font-family:inherit}
.text-input:focus{border-color:#4a6cf7;outline:2px solid #4a6cf7;outline-offset:0}

/* Page Info */
.page-info{margin-top:12px;padding:10px 14px;background:#f0fdf4;border-radius:8px;font-size:.85rem;color:#15803d;display:none}

/* Image Previews */
.image-previews{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;margin-top:16px}
.image-preview{position:relative;border-radius:8px;overflow:hidden;background:#f6f8ff;text-align:center;padding:8px}
.image-preview img,.image-preview canvas{max-width:100%;height:auto;border-radius:4px}
.image-preview .preview-label{font-size:.78rem;color:#6b7280;margin-top:4px}
.image-preview .btn-download-single{display:inline-block;margin-top:6px;padding:4px 12px;background:#10b981;color:#fff;border:none;border-radius:6px;font-size:.78rem;cursor:pointer;text-decoration:none}
.image-preview .btn-download-single:hover{background:#059669}

/* Footer */
footer{text-align:center;font-size:.78rem;color:#737373;margin-top:16px;line-height:1.8}
footer a{color:#6b7280;text-decoration:none}
footer a:hover{color:#4a6cf7;text-decoration:underline}
footer .sep{margin:0 6px}

/* Responsive */
@media(max-width:480px){
  .features-grid{grid-template-columns:1fr}
}

/* Accessibility */
@media(prefers-reduced-motion:reduce){
  *,::after,::before{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important}
  .progress-bar{transition:none}
}
