/* esign.css — e-signature studio (esign.js); the editor itself uses pdf-editor.css */
.es{display:grid;gap:14px;text-align:left}
.es-tabs{width:100%;max-width:640px;margin:0 auto}
/* empty state: the same dashed drop zone as the other PDF tools */
.es-dz{min-height:clamp(260px,42vh,400px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;max-width:720px;width:100%;margin:6px auto 0;box-sizing:border-box;padding:40px 24px;text-align:center;
  border:2px dashed var(--border-2,#cdd5e5);border-radius:18px;background:var(--panel,#fff);transition:border-color .15s,background .15s}
.es-dz.over,.es-dz.drag,.es-dz:hover{border-color:var(--accent,#4f6ef7);background:var(--accent-soft,#eef1fe)}
.es-dzic{width:54px;height:54px;color:var(--accent,#4f6ef7);margin-bottom:2px}
.es-dzt{font-size:18px;font-weight:800;color:var(--text,#1e2635);margin-bottom:6px}
.es-dz .dz-btn{display:inline-block;font-family:inherit;font-size:16px;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--accent,#4f6ef7),#7c5cf0);border:none;padding:15px 34px;border-radius:13px;cursor:pointer;box-shadow:0 10px 24px rgba(79,110,247,.34);transition:transform .15s;width:auto}
.es-dz .dz-btn:hover{transform:translateY(-1px)}
.es-dz p{color:var(--muted,#5a6377);font-size:13.5px;margin:6px 0 0}
.es-alt{margin-top:4px;padding:8px 16px;border-radius:999px;border:1px solid var(--border,#e4e9f2);background:var(--panel,#fff);color:var(--accent-dark,#3a52c4);font:600 13px inherit;font-family:inherit;cursor:pointer;width:auto}
.es-alt:hover{border-color:var(--accent,#4f6ef7)}
.es-dz .es-note{margin-top:10px}
.es-note{font-size:12.5px;color:var(--muted,#5a6377)}
.es-pad{width:100%;height:auto;aspect-ratio:3/1;background:#fff;border:2px dashed var(--border-2,#cfd6e4);border-radius:12px;touch-action:none;cursor:crosshair;display:block;background-image:linear-gradient(#cbd5e1,#cbd5e1);background-size:80% 1px;background-position:center 75%;background-repeat:no-repeat}
.es-fonts{display:grid;gap:8px}
.es-fonts label{display:flex;align-items:center;gap:10px;border:1px solid var(--border,#e4e9f2);border-radius:10px;padding:8px 12px;cursor:pointer;background:var(--panel,#fff)}
.es-fonts span{font-size:34px;line-height:1.2;color:#111827;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.es-up{padding:22px;text-align:center}
.es-out{background:#fff repeating-conic-gradient(#f1f5f9 0 25%,#fff 0 50%) 0 0/18px 18px;border:1px solid var(--border,#e4e9f2);border-radius:14px;min-height:180px;display:flex;align-items:center;justify-content:center;padding:16px}
.es-out img{max-width:100%;max-height:220px}
.es-out p{color:var(--muted,#5a6377);font-size:13px}
.es-make{grid-template-columns:minmax(0,1fr) minmax(0,.9fr)}
.es{grid-template-columns:minmax(0,1fr)}
/* phones: three tabs share the width, labels wrap instead of pushing the page wider */
@media (max-width:600px){.es-tabs{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))}.es-tabs button{white-space:normal!important;line-height:1.25;padding:8px 4px!important;font-size:12.5px;min-width:0}
.es-dz{padding:28px 16px}.es-dz .dz-btn{padding:13px 22px;font-size:15px}}
