/* ---------- Fillable form fields on the page ---------- */
.form-layer{position:absolute;inset:0;z-index:5;pointer-events:none}
.form-field{position:absolute;pointer-events:auto;box-sizing:border-box;margin:0;padding:0 .25em;border:1px solid transparent;border-radius:2px;background:rgba(36,91,227,.08);color:#0b1324;font-family:Helvetica,Arial,sans-serif;line-height:1.15;outline:none;transition:background .12s,border-color .12s,box-shadow .12s}
textarea.form-field{resize:none;padding:.2em .3em;overflow:auto}
select.form-field{padding:0 .1em;cursor:pointer}
.form-field:hover{border-color:rgba(36,91,227,.45)}
.form-field:focus{background:#fff;border-color:#245be3;box-shadow:0 0 0 3px rgba(36,91,227,.22)}
.form-field[type=checkbox],.form-field[type=radio]{padding:0;accent-color:#245be3;cursor:pointer;background:transparent}
.form-field:disabled{background:transparent;cursor:not-allowed}
.form-field:required:placeholder-shown{border-left:2px solid #e0a12e}
.form-field.comb{letter-spacing:.55em}
.form-next{display:none!important;align-items:center;gap:5px;color:#245be3;font-weight:600}
body.has-form-fields .form-next{display:inline-flex!important}

/* ---------- Header: document on the left, actions on the right ---------- */
header{height:64px!important;padding:0 18px!important;gap:16px!important}
.brand{font-size:19px!important}
.brand>i{font-size:20px!important;padding:8px!important;border-radius:9px!important}
.doc-group{display:flex;align-items:center;gap:6px;min-width:0}
.doc-name{background:#f2f5fa!important;border:1px solid transparent!important;border-radius:8px!important;padding:6px 10px!important;min-width:0}
.doc-name:focus-within{background:#fff!important;border-color:#245be3!important;box-shadow:0 0 0 3px rgba(36,91,227,.15)}
.doc-name input{width:clamp(110px,16vw,230px)!important;font-weight:600;color:#172238;text-overflow:ellipsis}
.doc-history{margin:0!important;color:#7a879c}
.doc-history button{padding:7px!important;border-radius:7px}
.doc-history button:hover{background:#eef2f8!important;color:#245be3}
.header-actions{display:flex;align-items:center;gap:8px!important;margin-left:auto}
.secondary-actions{display:flex;align-items:center;gap:2px;padding-right:8px;margin-right:2px;border-right:1px solid #e3e8f0}
.secondary-actions .cloud-btn{border-color:transparent;background:transparent;color:#3d4a61;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:500}
.secondary-actions .cloud-btn:hover{background:#eef2f8;color:#172238}
.secondary-actions .cloud-btn span{display:inline!important}
.secondary-actions .cloud-btn i{font-size:16px}
.more-toggle{display:none!important}
.save-split{display:flex;align-items:stretch}
.save-split>.cloud-btn{border-radius:8px 0 0 8px;border-right:0;font-weight:600;color:#172238;padding:8px 12px!important;background:#fff}
.save-split>.cloud-btn span{display:inline!important}
.save-split .save-menu>summary{border-radius:0 8px 8px 0;height:100%;padding:0 8px!important;background:#fff}
.save-split>.cloud-btn:hover,.save-split .save-menu>summary:hover{background:#f2f5fa}
.export-btn{border-radius:8px!important;padding:8px 16px!important;font-weight:600!important;box-shadow:0 1px 2px rgba(23,34,56,.12),0 4px 12px rgba(36,91,227,.22)!important}

/* ---------- Tool panel ---------- */
.fill-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.fill-tools h3{grid-column:1/-1;margin:0 0 2px}
.fill-tools .cloud-btn{justify-content:center;margin:0!important;padding:8px 6px!important;font-size:12.5px!important;border-radius:8px;background:#fff;color:#2b3a55;border-color:#e1e7f0;min-width:0;white-space:normal;line-height:1.25;text-align:center}
.fill-tools .cloud-btn:hover{border-color:#245be3;color:#245be3;background:#f5f8ff}
.fill-tools label{grid-column:1/-1;display:flex;align-items:center;gap:8px;margin-top:4px;font-size:12.5px!important;color:#56617a}
.intro-note b{font-size:15px}
.sheet-handle{display:none}

/* ---------- Page rail: page actions appear when you need them ---------- */
.thumb-controls{opacity:0;transition:opacity .12s}
.thumb:hover .thumb-controls,.thumb.active .thumb-controls,.thumb:focus-within .thumb-controls{opacity:1}
.thumb-label input:not(:checked){opacity:0}
.thumb:hover .thumb-label input,.thumb:focus-within .thumb-label input{opacity:1}
.thumb-main{transition:border-color .12s,box-shadow .12s}
.thumb-main:hover{box-shadow:0 4px 14px #162a4620}

/* ---------- Workspace ---------- */
.workspace-bar{height:44px!important}
.workspace-bar>div:first-child>i{display:none}
.workspace-bar .cloud-btn{border-color:transparent;padding:5px 9px}
.page-wrapper{outline:0!important;border-radius:2px;box-shadow:0 1px 3px rgba(23,34,56,.08),0 8px 28px rgba(23,34,56,.10)!important}
.canvas-container-wrapper.active-page{outline:2px solid rgba(36,91,227,.35)!important;outline-offset:2px}
#main-scroll{background:#e8ecf3!important}

/* ---------- Saved entries, watermark presets, logos ---------- */
.section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.section-head h3,.section-head h4{margin:0!important}
.section-head h4{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#56617a}
.link-btn{font-size:12.5px!important;font-weight:600;color:#245be3;padding:2px 4px;border-radius:5px}
.link-btn:hover{background:#eef3fb}
.panel-hint{font-size:12px!important;color:#7a879c;margin:0 0 8px}
.panel-hint[hidden]{display:none}
.entries-panel{padding:14px;border:1px solid #e1e7f0;border-radius:12px;background:#f8faff}
.entry-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.entry-chips:empty{display:none}
.entry-chip{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:5px 10px;border-radius:999px;border:1px solid #cdd9f5;background:#fff;color:#1f3f8f;font-size:12.5px!important;font-weight:500}
.entry-chip:hover{background:#245be3;border-color:#245be3;color:#fff}
.entries-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.entries-actions .cloud-btn{justify-content:center;gap:5px;padding:7px 4px!important;font-size:12.5px!important;background:#fff;min-width:0;white-space:nowrap}
.remember-check{display:flex!important;align-items:center;gap:8px;font-size:12.5px!important;color:#56617a;margin:8px 0;cursor:pointer}
.logo-panel{margin-top:10px}
.logo-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:6px}
.logo-strip:empty{display:none}
.logo-thumb{aspect-ratio:1;border:1px solid #e1e7f0;border-radius:8px;background:#fff repeating-conic-gradient(#f3f5f9 0 25%,#fff 0 50%) 0 0/12px 12px;padding:5px;display:flex;align-items:center;justify-content:center}
.logo-thumb:hover{border-color:#245be3;box-shadow:0 0 0 3px rgba(36,91,227,.15)}
.logo-thumb img{max-width:100%;max-height:100%;object-fit:contain}
.wm-presets-panel{padding-bottom:18px;margin-bottom:4px;border-bottom:1px solid #e3e8f0}
.wm-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.wm-presets:empty{display:none}
.wm-preset{position:relative}
.wm-preset-apply{width:100%;height:84px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px;border:1px solid #e1e7f0;border-radius:10px;background:#fff;overflow:hidden}
.wm-preset-apply:hover{border-color:#245be3;box-shadow:0 0 0 3px rgba(36,91,227,.15)}
.wm-preset-apply img{max-width:100%;max-height:44px;object-fit:contain}
.wm-preset-text{font-weight:700;font-size:15px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transform:rotate(-8deg)}
.wm-preset-apply small{font-size:11px;color:#7a879c;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wm-preset-remove{position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:50%;background:#fff;border:1px solid #e1e7f0;color:#7a879c;font-size:14px;line-height:1;opacity:0;transition:opacity .12s}
.wm-preset:hover .wm-preset-remove,.wm-preset-remove:focus{opacity:1}
.wm-preset-remove:hover{color:#c62828;border-color:#f2b8b5}
.wm-save{width:100%;justify-content:center;margin-top:6px;background:#fff}
.entries-list{display:flex;flex-direction:column;gap:6px;margin:10px 0}
.entry-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr) auto;gap:6px;align-items:start}
.entry-row input,.entry-row textarea{border:1px solid #dce2eb;border-radius:7px;padding:7px 9px;font-size:13px;width:100%;resize:vertical;min-height:34px}
.entry-row input:focus,.entry-row textarea:focus{outline:none;border-color:#245be3;box-shadow:0 0 0 3px rgba(36,91,227,.15)}
.entry-remove{padding:6px 10px!important;color:#7a879c}
.entries-backup{display:flex;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid #e3e8f0}
.entries-backup .cloud-btn{cursor:pointer;font-size:12.5px}
#workspace-dialog .entries-actions{margin-bottom:10px}
@media (max-width:760px){.entry-row{grid-template-columns:1fr auto}.entry-row textarea{grid-column:1}.entry-row .entry-remove{grid-row:1/3;grid-column:2}}

/* ---------- Narrower screens: one header row, secondary actions behind More ---------- */
@media (max-width:1180px){
 header{flex-wrap:nowrap!important;height:64px!important;min-height:0!important;position:relative}
 .header-actions{width:auto!important;flex-wrap:nowrap!important;justify-content:flex-end!important}
 .more-toggle{display:inline-flex!important;padding:8px!important}
 .secondary-actions{display:none!important;position:absolute;top:calc(100% + 6px);right:10px;z-index:70;flex-direction:column;align-items:stretch;min-width:200px;padding:6px;margin:0;border:1px solid #dce2eb;border-radius:12px;background:#fff;box-shadow:0 12px 32px rgba(15,23,42,.18)}
 body.actions-open .secondary-actions{display:flex!important}
 .secondary-actions .cloud-btn{justify-content:flex-start;padding:10px 12px;font-size:14px}
 .doc-group{flex:1;min-width:0}
 .doc-name{flex:1 1 auto;max-width:320px}
 .doc-name input{width:100%!important}
}

@media (max-width:850px){
 .workspace-bar>div:first-child{display:flex!important}
 .workspace-bar>div:first-child>span,.workspace-bar>div:first-child>.cloud-btn{display:none}
}

/* ---------- Phones ---------- */
@media (max-width:760px){
 body{height:100dvh!important}
 header{height:56px!important;min-height:0!important;flex-wrap:nowrap!important;padding:0 10px!important;gap:8px!important;position:relative}
 .brand strong{display:none}
 .brand>i{font-size:18px!important;padding:7px!important}
 .doc-group{flex:1;min-width:0}
 .doc-name{flex:1;padding:6px 9px!important}
 .doc-name input{width:100%!important;font-size:14px!important}
 .doc-history{display:none!important}
 .header-actions{width:auto!important;flex-wrap:nowrap!important;gap:6px!important;margin-left:0}
 .save-split>.cloud-btn span,.export-btn{font-size:0!important}
 .save-split>.cloud-btn{padding:8px 10px!important}
 .export-btn{padding:8px 11px!important;gap:0!important}
 .export-btn i{font-size:18px!important}
 /* Bottom tab bar */
 nav{position:fixed!important;left:0;right:0;bottom:0;width:100%!important;height:60px;flex-direction:row!important;justify-content:flex-start;padding:0 4px!important;gap:0!important;border-right:0!important;border-top:1px solid #dce2eb;overflow-x:auto!important;overflow-y:hidden!important;z-index:45!important;background:#fff}
 nav>div{display:none!important}
 .sidebar-btn{width:auto!important;min-width:64px;flex:1 0 auto;padding:8px 4px!important;border-radius:10px}
 .sidebar-btn i{font-size:21px!important;margin-bottom:0!important}
 .sidebar-btn span{font-size:10.5px!important}
 /* Tool panels slide up as a sheet */
 #panels-container{position:fixed!important;left:0;right:0;bottom:60px;width:100%!important;max-height:58dvh;border-right:0!important;border-radius:16px 16px 0 0;box-shadow:0 -10px 30px rgba(15,23,42,.18);transform:translateY(110%);transition:transform .22s ease;z-index:44!important}
 body.sheet-open #panels-container{transform:none}
 .sheet-handle{display:block;position:sticky;top:0;z-index:2;width:100%;height:22px;background:#fff;border:0}
 .sheet-handle::after{content:'';display:block;width:40px;height:4px;margin:8px auto;border-radius:4px;background:#cfd7e3}
 #panels-container .panel-content{padding:4px 16px 18px!important}
 #page-rail{display:none!important}
 .status-bar{display:none!important}
 .flex-1.flex.overflow-hidden{padding-bottom:60px}
 #main-scroll{padding:12px!important}
 .workspace-bar{padding:0 10px!important}
 .absolute.bottom-4.right-4{bottom:72px!important}
 #context-toolbar{overflow-x:auto}
 #toast{bottom:76px;width:max-content;max-width:calc(100vw - 32px);text-align:center}
}
