/* ════════════════════════════════════════════════════════════
   SIMVLN SPDF — shared styles for the PDF tool pages.
   Mirrors the SFinance look (glass panels, accent gradient, Syne
   headings) and reuses theme.css variables. Loaded alongside
   theme.css + calc.css on every PDF tool page.
   ════════════════════════════════════════════════════════════ */

/* App wrapper injected by pdf-engine.js into #pdf-app */
.pdf-app{margin-top:0.4rem;}

/* Privacy badge — driven by config (client = green, server = amber) */
.pdf-privacy{display:inline-flex;align-items:center;gap:8px;font-size:0.76rem;font-weight:600;padding:6px 13px;border-radius:50px;margin-bottom:1rem;}
.pdf-privacy.client{background:rgba(0,255,157,0.10);border:1px solid rgba(0,255,157,0.28);color:var(--accent3);}
.pdf-privacy.server{background:rgba(255,180,0,0.10);border:1px solid rgba(255,180,0,0.30);color:#ffce5a;}
.pdf-privacy i{font-size:0.8rem;}

/* ── Dropzone ── */
.pdf-drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:0.5rem;min-height:210px;padding:2rem 1.4rem;border:2px dashed rgba(0,212,255,0.35);border-radius:18px;background:linear-gradient(160deg,rgba(0,212,255,0.06),rgba(255,255,255,0.02));cursor:pointer;transition:border-color 0.2s,background 0.2s,transform 0.2s;}
.pdf-drop:hover{border-color:var(--accent);background:linear-gradient(160deg,rgba(0,212,255,0.10),rgba(255,255,255,0.03));}
.pdf-drop.dragover{border-color:var(--accent3);background:rgba(0,255,157,0.08);transform:scale(1.005);}
.pdf-drop-ic{width:58px;height:58px;border-radius:16px;background:rgba(0,212,255,0.12);border:1px solid rgba(0,212,255,0.22);display:flex;align-items:center;justify-content:center;}
.pdf-drop-ic i{font-size:1.5rem;color:var(--accent);}
.pdf-drop h3{font-family:'Syne',sans-serif;font-size:1.05rem;font-weight:700;color:var(--text);margin:0;}
.pdf-drop p{font-size:0.82rem;color:var(--muted);margin:0;}
.pdf-drop .pdf-browse{color:var(--accent);text-decoration:underline;font-weight:600;}
.pdf-drop small{font-size:0.7rem;color:var(--muted);opacity:0.8;margin-top:0.2rem;}
.pdf-drop input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;}

/* ── File list (draggable thumbnails / rows) ── */
.pdf-files{display:flex;flex-direction:column;gap:0.6rem;margin-top:1.1rem;}
.pdf-file{display:flex;align-items:center;gap:0.8rem;background:linear-gradient(160deg,rgba(255,255,255,0.06),rgba(255,255,255,0.02));border:1px solid rgba(255,255,255,0.12);border-radius:12px;padding:0.6rem 0.8rem;transition:border-color 0.15s,box-shadow 0.15s;}
.pdf-file.dragging{opacity:0.5;}
.pdf-file.drag-over-target{border-color:var(--accent);}
.pdf-file-handle{color:var(--muted);cursor:grab;font-size:0.9rem;flex-shrink:0;padding:2px;}
.pdf-file-handle:active{cursor:grabbing;}
.pdf-file-thumb{width:38px;height:48px;border-radius:5px;object-fit:cover;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:1rem;}
.pdf-file-info{min-width:0;flex:1;}
.pdf-file-name{font-size:0.82rem;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pdf-file-meta{font-size:0.72rem;color:var(--muted);margin-top:2px;}
.pdf-file-x{flex-shrink:0;background:none;border:none;color:var(--muted);cursor:pointer;font-size:0.95rem;padding:4px 6px;border-radius:6px;transition:color 0.15s,background 0.15s;}
.pdf-file-x:hover{color:#ff6b6b;background:rgba(255,107,107,0.1);}
.pdf-add-more{align-self:flex-start;background:none;border:1px dashed rgba(0,212,255,0.35);color:var(--accent);font-family:'DM Sans',sans-serif;font-size:0.78rem;font-weight:600;padding:7px 14px;border-radius:50px;cursor:pointer;transition:border-color 0.15s,background 0.15s;display:inline-flex;align-items:center;gap:6px;}
.pdf-add-more:hover{border-color:var(--accent);background:rgba(0,212,255,0.06);}

/* ── Grid preview (opt-in file boxes: merge-pdf) ── */
.pdf-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:0.7rem;row-gap:1.4rem;margin-top:1.1rem;}
.pdf-box{position:relative;aspect-ratio:1.6;border-radius:12px;overflow:hidden;background:linear-gradient(160deg,rgba(255,255,255,0.06),rgba(255,255,255,0.02));border:1px solid rgba(255,255,255,0.12);cursor:pointer;user-select:none;touch-action:none;transition:border-color 0.15s,box-shadow 0.15s;}
.pdf-box:hover{border-color:rgba(0,212,255,0.4);}
.pdf-box.dragging{opacity:0.6;box-shadow:0 10px 28px rgba(0,0,0,0.45);border-color:var(--accent);}
.pdf-box.drag-over-target{border-color:var(--accent3);box-shadow:0 0 0 2px rgba(0,255,157,0.35) inset;}
.pdf-box-thumb{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.03);}
.pdf-box-thumb img{width:100%;height:100%;object-fit:contain;display:block;}
.pdf-box-ph{color:var(--accent);font-size:1.6rem;opacity:0.6;}
.pdf-box-num{position:absolute;top:5px;left:5px;width:20px;height:20px;border-radius:50%;background:var(--accent);color:#050A14;font-size:0.66rem;font-weight:800;display:flex;align-items:center;justify-content:center;font-family:'DM Sans',sans-serif;}
.pdf-box-x{position:absolute;top:5px;right:5px;width:20px;height:20px;border-radius:50%;background:rgba(0,0,0,0.55);color:#fff;display:flex;align-items:center;justify-content:center;font-size:0.68rem;border:none;cursor:pointer;padding:0;}
.pdf-box-x:hover{background:rgba(255,60,60,0.75);}
.pdf-box-wrap{flex:0 0 calc(20% - 1.1rem);min-width:140px;display:flex;flex-direction:column;gap:0.35rem;}
.pdf-box-label{font-size:0.63rem;color:var(--muted);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pdf-box-spacer{visibility:hidden;pointer-events:none;}
.pdf-box-controls{position:absolute;bottom:5px;right:5px;display:flex;gap:3px;z-index:2;}
.pdf-box-ctrl{width:22px;height:22px;border-radius:5px;background:rgba(0,0,0,0.6);color:#fff;display:flex;align-items:center;justify-content:center;font-size:0.6rem;border:none;cursor:pointer;padding:0;transition:background 0.15s;}
.pdf-box-ctrl:hover{background:rgba(0,212,255,0.65);}
.pdf-box-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:2px dashed rgba(0,212,255,0.35);background:rgba(0,212,255,0.04);color:var(--accent);cursor:pointer;touch-action:auto;}
.pdf-box-add:hover{border-color:var(--accent);background:rgba(0,212,255,0.08);}
.pdf-box-add i{font-size:1.3rem;}
.pdf-box-add span{font-size:0.66rem;font-weight:700;}

/* ── Lightbox (click a grid box to enlarge) ── */
.pdf-lightbox{position:fixed;inset:0;background:rgba(2,6,14,0.86);display:flex;align-items:center;justify-content:center;z-index:999;padding:2.2rem;}
.pdf-lightbox img{max-width:96vw;max-height:92vh;border-radius:10px;box-shadow:0 14px 48px rgba(0,0,0,0.55);}
.pdf-lightbox-close{position:absolute;top:22px;right:24px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);color:#fff;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.pdf-lightbox-close:hover{background:rgba(255,255,255,0.18);}
.pdf-lightbox-err{color:var(--muted);font-size:0.85rem;}

/* Merge-PDF SEO "how to" list */
.pdf-howto{list-style:none;margin:0 0 0.9rem;padding:0;display:flex;flex-direction:column;gap:0.5rem;}
.pdf-howto li{display:flex;align-items:baseline;gap:0.5rem;}
.pdf-limit-note{margin:0;color:var(--muted);font-size:0.82rem;}

/* ── Options panel ── */
.pdf-opts{margin-top:1.2rem;background:linear-gradient(160deg,rgba(255,255,255,0.05),rgba(255,255,255,0.02));border:1px solid rgba(255,255,255,0.11);border-radius:14px;padding:1.1rem 1.2rem;}
.pdf-opts-title{font-family:'Syne',sans-serif;font-size:0.9rem;font-weight:700;color:var(--text);margin:0 0 0.9rem;display:flex;align-items:center;gap:8px;}
.pdf-opts-title i{color:var(--accent);}
.pdf-opt{margin-bottom:0.9rem;}
.pdf-opt:last-child{margin-bottom:0;}
.pdf-opt label{display:block;font-size:0.78rem;font-weight:600;color:var(--text);margin-bottom:0.4rem;}
.pdf-opt input[type=text],.pdf-opt input[type=number],.pdf-opt select{width:100%;background:rgba(255,255,255,0.05);border:1px solid var(--border);border-radius:9px;padding:9px 12px;color:var(--text);font-family:'DM Sans',sans-serif;font-size:0.86rem;outline:none;}
.pdf-opt input:focus,.pdf-opt select:focus{border-color:var(--accent);}
.pdf-opt-row{display:flex;gap:0.7rem;flex-wrap:wrap;}
.pdf-opt-row>*{flex:1;min-width:0;}
/* segmented preset cards (e.g. quality / page-size) */
.pdf-seg{display:flex;gap:0.5rem;flex-wrap:wrap;}
.pdf-seg-btn{flex:1;min-width:80px;background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:10px;padding:9px 10px;color:var(--muted);font-family:'DM Sans',sans-serif;font-size:0.8rem;font-weight:600;cursor:pointer;text-align:center;transition:all 0.15s;}
.pdf-seg-btn.active{background:var(--grad);color:#050A14;border-color:transparent;}
/* 3x3 position picker */
.pdf-pos{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;max-width:150px;}
.pdf-pos-cell{aspect-ratio:1.4;background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:6px;cursor:pointer;transition:all 0.15s;}
.pdf-pos-cell.active{background:var(--grad);border-color:transparent;}

/* ── Primary action ── */
.pdf-cta{margin-top:1.3rem;width:100%;background:var(--accent);color:#050A14;padding:13px 24px;border-radius:50px;font-family:'DM Sans',sans-serif;font-weight:700;font-size:0.95rem;cursor:pointer;border:none;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:background-color 0.15s;}
.pdf-cta:hover{background:#3ce0ff;}
.pdf-cta:disabled{background:#1b6b7d;color:rgba(5,10,20,0.55);cursor:not-allowed;}
.pdf-limit{text-align:center;font-size:0.72rem;color:var(--muted);margin-top:0.6rem;}
.pdf-limit b{color:var(--accent3);}
.pdf-limit.reached{color:#ffce5a;}

/* ── Job / progress state ── */
.pdf-job{margin-top:1.3rem;text-align:center;padding:1.5rem;background:linear-gradient(160deg,rgba(255,255,255,0.05),rgba(255,255,255,0.02));border:1px solid rgba(255,255,255,0.11);border-radius:14px;}
.pdf-spinner{width:38px;height:38px;border:3px solid rgba(0,212,255,0.2);border-top-color:var(--accent);border-radius:50%;margin:0 auto 0.9rem;animation:pdf-spin 0.8s linear infinite;}
@keyframes pdf-spin{to{transform:rotate(360deg);}}
.pdf-job-status{font-size:0.86rem;color:var(--text);font-weight:600;}
.pdf-progress{margin-top:0.9rem;height:7px;background:rgba(255,255,255,0.08);border-radius:5px;overflow:hidden;}
.pdf-progress-bar{height:100%;width:0;background:var(--grad);border-radius:5px;transition:width 0.25s;}

/* ── Result panel ── */
.pdf-result{margin-top:1.3rem;text-align:center;padding:1.6rem 1.4rem;background:linear-gradient(160deg,rgba(0,255,157,0.07),rgba(255,255,255,0.02));border:1px solid rgba(0,255,157,0.25);border-radius:16px;}
.pdf-result-ic{width:52px;height:52px;border-radius:50%;background:rgba(0,255,157,0.14);border:1px solid rgba(0,255,157,0.3);display:flex;align-items:center;justify-content:center;margin:0 auto 0.8rem;}
.pdf-result-ic i{font-size:1.4rem;color:var(--accent3);}
.pdf-result h3{font-family:'Syne',sans-serif;font-size:1.1rem;font-weight:700;color:var(--text);margin:0 0 0.3rem;}
.pdf-result p{font-size:0.82rem;color:var(--muted);margin:0 0 1.1rem;}
.pdf-result-stats{display:inline-flex;gap:1.4rem;margin-bottom:1.1rem;flex-wrap:wrap;justify-content:center;}
.pdf-stat{text-align:center;}
.pdf-stat b{display:block;font-family:'Syne',sans-serif;font-size:1.1rem;color:var(--accent);}
.pdf-stat span{font-size:0.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.04em;}
.pdf-dl{background:var(--accent);color:#050A14;padding:12px 26px;border-radius:50px;font-weight:700;font-size:0.9rem;text-decoration:none;border:none;cursor:pointer;display:inline-flex;align-items:center;gap:9px;transition:background-color 0.15s;font-family:'DM Sans',sans-serif;}
.pdf-dl:hover{background:#3ce0ff;}
.pdf-again{display:block;margin:0.9rem auto 0;background:none;border:none;color:var(--muted);font-size:0.8rem;cursor:pointer;text-decoration:underline;font-family:'DM Sans',sans-serif;}
.pdf-again:hover{color:var(--accent);}

/* ── Error message ── */
.pdf-error{margin-top:1rem;background:rgba(255,107,107,0.08);border:1px solid rgba(255,107,107,0.3);color:#ff9b9b;border-radius:12px;padding:0.8rem 1rem;font-size:0.82rem;display:flex;align-items:flex-start;gap:9px;}
.pdf-error i{margin-top:2px;flex-shrink:0;}

/* ── Related tools cross-links (SEO cluster) ── */
.pdf-related{margin-top:1.3rem;}
.pdf-related h4{font-size:0.8rem;color:var(--muted);font-weight:600;margin:0 0 0.6rem;text-transform:uppercase;letter-spacing:0.04em;}
.pdf-related-links{display:flex;flex-wrap:wrap;gap:0.5rem;}
.pdf-related-links a{font-size:0.78rem;color:var(--accent);text-decoration:none;background:var(--card);border:1px solid var(--border);padding:5px 13px;border-radius:50px;transition:border-color 0.15s,color 0.15s;}
.pdf-related-links a:hover{border-color:var(--accent);color:var(--accent3);}

/* ── Mobile (mirror the finance 760px breakpoint) ── */
@media(max-width:760px){
  .pdf-drop{min-height:180px;padding:1.6rem 1rem;}
  .pdf-drop-ic{width:50px;height:50px;}
  .pdf-drop h3{font-size:0.98rem;}
  .pdf-opts{padding:1rem;}
  .pdf-opt-row{flex-direction:column;}
  .pdf-result-stats{gap:1rem;}
  .pdf-seg-btn{min-width:calc(50% - 0.25rem);}
  .pdf-grid{gap:0.5rem;row-gap:1.1rem;}
  .pdf-box-wrap{flex:0 0 calc(33.33% - 0.34rem);min-width:110px;}
  .pdf-box-spacer{display:none;}
}
@media(max-width:420px){
  .pdf-box-wrap{flex:0 0 calc(50% - 0.25rem);min-width:0;}
}
