/* apps.css — tool-specific styles, light theme */

/* QR */
.qr-preview-box{background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:18px;text-align:center;margin-top:0;min-height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
#qr-preview-area{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%}

/* BG Remover */
.bg-result-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.img-box{background:#fff;border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:hidden}
.img-box img{width:100%;height:auto;display:block;max-height:280px;object-fit:contain}
.img-box canvas{width:100%;display:block;background:repeating-conic-gradient(#e5e7eb 0% 25%,#fff 0% 50%) 0 0/16px 16px}
.img-box-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding:6px 10px;border-top:1px solid var(--border)}
@media(max-width:500px){.bg-result-grid{grid-template-columns:1fr}}

/* Timer */
.timer-display{font-size:68px;font-weight:800;text-align:center;letter-spacing:-.04em;padding:24px 0 12px;line-height:1;color:var(--text);user-select:none;font-variant-numeric:tabular-nums}
.timer-controls{display:flex;gap:7px;justify-content:center;flex-wrap:wrap;margin-bottom:16px}
.timer-settings{background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:14px}
.hotkeys-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:5px;margin-top:9px}
.hotkey-row{background:#fff;border:1px solid var(--border);border-radius:6px;padding:6px 10px;font-size:12px;color:var(--text2);display:flex;justify-content:space-between;align-items:center}
.hotkey-row kbd{background:var(--bg);border:1px solid var(--border2);border-radius:4px;padding:1px 6px;font-size:11px;color:var(--blue);font-family:monospace}

/* Timer fullscreen */
#fs-overlay{display:none;position:fixed;inset:0;z-index:9999;flex-direction:column;align-items:center;justify-content:center;background:#000}
#fs-overlay.active{display:flex}
#fs-logo{max-width:170px;max-height:100px;object-fit:contain;margin-bottom:14px;display:none}
#fs-time{font-size:18vw;font-weight:800;color:#fff;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
#fs-progress{position:absolute;bottom:0;left:0;right:0;height:4px;background:rgba(255,255,255,.1)}
#fs-progress-bar{height:100%;background:linear-gradient(90deg,var(--blue),var(--green));transition:width .5s linear}
#fs-exit{position:absolute;top:14px;right:14px;background:rgba(255,255,255,.1);border:none;border-radius:6px;color:rgba(255,255,255,.5);padding:7px 12px;cursor:pointer;font-size:12px;opacity:0;transition:opacity .3s}
#fs-overlay:hover #fs-exit{opacity:1}

/* PDF */
.pdf-tabs{display:flex;gap:3px;margin-bottom:16px;background:var(--bg);border-radius:var(--r-sm);padding:3px;width:fit-content;border:1.5px solid var(--border)}
.pdf-tab{padding:6px 15px;border-radius:6px;border:none;background:transparent;color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;transition:all var(--transition);font-family:'Inter',sans-serif}
.pdf-tab.active{background:var(--blue);color:#fff}
.pdf-tab:hover:not(.active){background:#fff;color:var(--text2)}
.pdf-section{display:none}
.pdf-section.active{display:block}
.page-thumbs{display:flex;flex-wrap:wrap;gap:8px;padding:10px;background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r-lg);min-height:48px;margin-top:10px}
.page-thumb{position:relative;cursor:pointer;border-radius:5px;overflow:hidden;border:2px solid var(--border);transition:all var(--transition)}
.page-thumb:hover{border-color:var(--blue)}
.page-thumb.selected{border-color:var(--blue);box-shadow:0 0 0 3px rgba(37,99,235,.15)}
.page-thumb canvas{display:block;width:68px;height:auto}
.page-thumb-num{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.55);color:#fff;font-size:10px;text-align:center;padding:2px}
.merge-file-item{background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r-sm);padding:8px 12px;display:flex;align-items:center;gap:8px;font-size:13px}
.merge-file-item .file-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text2)}