/* ===== SARVIN PDF & Image tools ===== */
.twrap{max-width:1000px;margin:14px auto;padding:0 14px}
.thead h1{font-size:24px;margin:0;color:#0a2a66;line-height:1.3}.thead h1 .en{display:block;font-size:14.5px;color:#5b6785;font-weight:600}
.thead p{margin:6px 0 0;font-size:14px;color:#4a5878}
.tbox{background:#fff;border:1px solid #dde3ee;border-radius:16px;padding:16px;margin-top:12px}
.tdrop{border:2.5px dashed #9fb3e6;background:#f5f8ff;border-radius:16px;padding:26px 14px;text-align:center;cursor:pointer;transition:.15s}
.tdrop.on{background:#e7efff;border-color:#1747c9}
.tdrop b{display:inline-block;background:#1747c9;color:#fff;border-radius:999px;padding:12px 22px;font-size:17px}
.tdrop p{margin:10px 0 0;color:#4a5878;font-size:13.5px}
.tdrop small{display:block;color:#667085;margin-top:4px}
.tfiles{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.tf{display:flex;align-items:center;gap:10px;border:1.5px solid #e3e9f6;border-radius:12px;padding:6px 8px;background:#fafcff}
.tf[draggable=true]{cursor:grab}.tf.drag{opacity:.4}
.tf .th{width:46px;height:46px;border-radius:8px;background:#eef1f6 center/cover no-repeat;flex:none;display:grid;place-items:center;font-size:20px}
.tf .nm{flex:1;min-width:0}.tf .nm b{display:block;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tf .nm small{color:#667085;font-size:12px}
.tf button{border:0;background:#eef1f6;border-radius:8px;width:32px;height:30px;cursor:pointer;font-weight:800;color:#0a2a66;flex:none}
.tf button.x{color:#b42318}
.topts{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-top:14px}
.topts>*{min-width:0}
.to label{display:block;font-weight:700;font-size:13px;color:#14213d;margin-bottom:4px}.to label small{font-weight:600;color:#667085}
.to input,.to select,.to textarea{width:100%;box-sizing:border-box;padding:9px 10px;border:1.5px solid #c9d6f5;border-radius:10px;font-size:15px;font-family:inherit;background:#fff;color:#14213d}
.to input[type=range]{padding:0}.to input[type=color]{height:40px;padding:2px}
.to.wide{grid-column:1/-1}
.to .seg,.tbox .seg{display:flex;flex-wrap:wrap;gap:6px}.to .seg button,.tbox .seg button{border:1.5px solid #c9d6f5;background:#fff;border-radius:999px;padding:7px 12px;font:inherit;font-size:13.5px;font-weight:700;color:#0a2a66;cursor:pointer}
.to .seg button.on,.tbox .seg button.on{background:#0a2a66;border-color:#0a2a66;color:#fff}
.tgo{display:block;width:100%;margin-top:14px;border:0;border-radius:999px;background:#16a34a;color:#fff;font:inherit;font-weight:800;font-size:17px;padding:14px;cursor:pointer}
.tgo:disabled{opacity:.55;cursor:default}
.tprog{margin-top:10px;font-weight:700;color:#0a2a66;font-size:14px;min-height:20px}
.tbar{height:8px;border-radius:99px;background:#e5e9f2;overflow:hidden;margin-top:6px}.tbar i{display:block;height:100%;width:0;background:#16a34a;transition:width .2s}
.tout{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.tres{display:flex;align-items:center;gap:10px;border:1.5px solid #9ee0b8;background:#effcf3;border-radius:12px;padding:8px 10px}
.tres .th{width:52px;height:52px;border-radius:8px;background:#fff center/contain no-repeat;flex:none;display:grid;place-items:center;font-size:22px;border:1px solid #d1fadf}
.tres .nm{flex:1;min-width:0}.tres .nm b{display:block;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tres .nm small{color:#05603a;font-size:12.5px}
.tres a{background:#16a34a;color:#fff;border-radius:999px;padding:9px 14px;font-weight:800;text-decoration:none;white-space:nowrap;font-size:14px}
.tall{background:#0a2a66!important;color:#fff;border:0;border-radius:999px;padding:11px 18px;font:inherit;font-weight:800;cursor:pointer;align-self:flex-start}
.tnote{font-size:12.5px;color:#667085;margin-top:10px}
.terr{color:#b42318;font-weight:700}
.ttext{width:100%;box-sizing:border-box;min-height:220px;border:1.5px solid #c9d6f5;border-radius:12px;padding:10px;font:14px/1.5 inherit;font-family:inherit}
/* page thumbnails (organise / rotate / remove / extract) */
.tpages{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin-top:12px}
.tpg{position:relative;border:2px solid #e3e9f6;border-radius:10px;background:#fff;padding:6px;text-align:center;cursor:pointer;user-select:none}
.tpg canvas{max-width:100%;height:auto;display:block;margin:0 auto;box-shadow:0 1px 4px #0002;transition:transform .2s}
.tpg .n{font-size:12px;font-weight:800;color:#0a2a66;margin-top:4px}
.tpg .ctl{display:flex;justify-content:center;gap:4px;margin-top:4px}
.tpg .ctl button{border:0;background:#eef1f6;border-radius:6px;width:28px;height:26px;cursor:pointer;font-weight:800;color:#0a2a66}
.tpg.sel{border-color:#16a34a;background:#effcf3}
.tpg.del{border-color:#f04438;background:#fef3f2}.tpg.del canvas{opacity:.3}
.tpg.del:after{content:'✕';position:absolute;top:30%;left:50%;transform:translateX(-50%);font-size:34px;color:#f04438;font-weight:900}
.tpg.drag{opacity:.4}
/* cropper */
.tcrop{position:relative;margin:12px auto 0;max-width:100%;user-select:none;touch-action:none;background:#e9edf5;border-radius:8px;overflow:hidden;display:inline-block}
.tcropw{text-align:center}
.tcrop img,.tcrop canvas{display:block;max-width:100%;max-height:62vh}
.tcrop .cbox{position:absolute;border:2px solid #fff;background:transparent;box-shadow:0 0 0 9999px rgba(10,42,102,.45);cursor:move;padding:0;margin:0;border-radius:0}
.tcrop .cbox.round{border-radius:50%}
.tcrop .h{position:absolute;width:18px;height:18px;background:#fff;border:2px solid #1747c9;border-radius:50%}
.tcrop .h.nw{left:-10px;top:-10px;cursor:nwse-resize}.tcrop .h.ne{right:-10px;top:-10px;cursor:nesw-resize}.tcrop .h.sw{left:-10px;bottom:-10px;cursor:nesw-resize}.tcrop .h.se{right:-10px;bottom:-10px;cursor:nwse-resize}
/* hub */
.hub h2{font-size:18px;color:#0a2a66;margin:22px 0 8px}
.hubg{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.hubg a{display:flex;gap:10px;align-items:center;background:#fff;border:1.5px solid #e3e9f6;border-radius:14px;padding:11px 12px;text-decoration:none;color:#14213d;transition:.15s}
.hubg a:hover{border-color:#1747c9;box-shadow:0 4px 14px #1747c91a}
.hubg a i{font-style:normal;font-size:22px;width:38px;height:38px;border-radius:10px;background:#f2f6ff;display:grid;place-items:center;flex:none}
.hubg a b{display:block;font-size:14.5px}.hubg a small{color:#667085;font-size:12.5px}
.trel{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.trel a{background:#f2f6ff;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700;color:#1747c9;text-decoration:none}
