/* ═══════════════════════════════════════════════════════════════
   🛠 استديو القلّابة — Flipbook Studio (المصنع المنفصل)
   صفحة مستقلة تماماً عن المتجر (index) وصفحات المنتجات (books/*).
   يعمل محلياً في المتصفح (FileReader + LocalStorage + pdf.js عن بُعد).
   ═══════════════════════════════════════════════════════════════ */
.st-main{max-width:1280px;margin:0 auto;padding:22px;}
.st-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px;}
.st-top h1{font-size:1.5rem;color:var(--bt-black);margin:0;display:flex;align-items:center;gap:10px;}
.st-top .hint{color:var(--bt-gray);font-size:.85rem;}
.st-layout{display:grid;grid-template-columns:360px 1fr;gap:20px;align-items:start;}
@media(max-width:900px){.st-layout{grid-template-columns:1fr;}}

/* ── العمود الأيسر: الصفحات والاستيراد ────────────── */
.st-panel{background:var(--bt-card);border:1px solid var(--bt-line);border-radius:14px;box-shadow:var(--bt-shadow);overflow:hidden;}
.st-panel-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:13px 16px;border-bottom:1px solid var(--bt-line);}
.st-panel-h b{color:var(--bt-black);font-size:.95rem;}
.st-panel-h .n{color:var(--bt-green);font-weight:800;font-family:'Trebuchet MS',sans-serif;font-size:.8rem;background:var(--bt-green-soft);padding:2px 10px;border-radius:30px;}
.st-import{padding:14px;display:grid;gap:10px;}
.st-import-title{font-size:.78rem;font-weight:700;color:var(--bt-gray);letter-spacing:.4px;}
.st-import .bt-dl{width:100%;padding:12px;font-size:.9rem;}
.st-slide-in{display:flex;gap:8px;}
.st-slide-in input{flex:1;padding:9px 12px;border:1px solid var(--bt-line);border-radius:8px;font-size:.82rem;outline:none;}
.st-slide-in input:focus{border-color:var(--bt-green);}
.st-list{list-style:none;margin:0;padding:8px;max-height:520px;overflow:auto;display:grid;gap:8px;}
.st-item{display:flex;align-items:center;gap:10px;padding:8px;border:1px solid var(--bt-line);border-radius:10px;background:#fff;cursor:grab;}
.st-item.dragging{opacity:.5;}
.st-item.drop-above{box-shadow:0 -3px 0 var(--bt-green);}
.st-item .thumb{width:44px;height:58px;flex:0 0 44px;border-radius:6px;overflow:hidden;background:linear-gradient(160deg,var(--bt-green),var(--bt-green-dark));color:#fff;display:grid;place-items:center;font-size:1.3rem;position:relative;}
.st-item .thumb img{width:100%;height:100%;object-fit:cover;}
.st-item .meta{flex:1;min-width:0;}
.st-item .meta .tt{font-size:.82rem;font-weight:700;color:var(--bt-black);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.st-item .meta small{color:var(--bt-gray);font-size:.68rem;}
.st-item .ops{display:flex;gap:4px;}
.st-op{width:26px;height:26px;border-radius:6px;border:1px solid var(--bt-line);background:#f6f7f4;cursor:pointer;font-size:.8rem;display:grid;place-items:center;color:var(--bt-gray);}
.st-op:hover{background:var(--bt-green-soft);color:var(--bt-green-dark);}
.st-op.del:hover{background:#fdeaea;color:#c0392b;}

/* ── المعاينة الحيّة ─────────────────────────────── */
.st-preview{position:sticky;top:70px;}
.st-stage{position:relative;background:#2a2e33;border-radius:16px;padding:26px;min-height:520px;display:grid;place-items:center;overflow:hidden;}
.st-page-prev{width:min(420px,86%);aspect-ratio:3/4;background:#fdf9ee;color:#2a2619;border-radius:4px;
  box-shadow:0 20px 60px rgba(0,0,0,.5);padding:30px 26px;overflow:hidden;position:relative;
  font-size:15px;line-height:1.9;text-align:right;}
.st-page-prev h3{margin:0 0 10px;color:#0d4f5a;border-bottom:2px double #b87e12;padding-bottom:6px;font-size:1.1rem;}
.st-page-prev p{margin:8px 0;text-align:justify;font-size:.95rem;}
.st-page-prev .pg-num{position:absolute;bottom:12px;inset-inline:0;text-align:center;font-size:.72rem;color:#9a8f74;font-family:'Trebuchet MS',sans-serif;}
.st-page-prev img{max-width:100%;}
.st-page-prev iframe{width:100%;height:100%;border:0;}
.st-prev-ctl{display:flex;align-items:center;justify-content:center;gap:14px;padding:14px;}
.st-nav{width:44px;height:44px;border-radius:50%;border:1px solid var(--bt-line);background:#fff;font-size:1.1rem;cursor:pointer;box-shadow:var(--bt-shadow);}
.st-nav:hover{background:var(--bt-green-soft);}
.st-counter{font-family:'Trebuchet MS',sans-serif;color:var(--bt-gray);font-size:.9rem;min-width:90px;text-align:center;}
.st-empty{color:#fff;opacity:.7;text-align:center;line-height:2;}

/* ── منطقة الطباعة المخفية ───────────────────────── */
.st-print{display:none;}
@media print{
  body *{visibility:hidden;}
  .st-print,.st-print *{visibility:visible;}
  .st-print{display:block;position:absolute;inset:0;}
  .st-sheet{page-break-after:always;width:100%;height:100%;padding:14mm;box-sizing:border-box;overflow:hidden;position:relative;}
  .st-sheet h3{color:#0d4f5a;border-bottom:2px double #b87e12;padding-bottom:6px;margin:0 0 12px;}
  .st-sheet p{margin:8px 0;line-height:1.9;text-align:justify;}
  .st-sheet img{max-width:100%;}
  .st-sheet .pg{position:absolute;bottom:8mm;inset-inline:0;text-align:center;font-size:9pt;color:#777;}
}