/* V17: workspace UI diganti ke standar web. File ini sengaja tidak lagi memaksa layout desktop-like. */
body.auth-body{overflow:auto;background:#eef2f7}
.app-body.with-navbar{height:auto;min-height:calc(100vh - 76px);overflow:visible;padding:28px;background:#eef2f7}
.tools-card{max-height:calc(100vh - 150px);overflow:auto}
.photo-bg-php-form .panel-card{max-height:calc(100vh - 260px);overflow:auto}


/* v18 - Surat Lamaran Pure PHP Edition */
.letter-workspace{align-items:stretch;gap:18px}.letter-input-panel{max-height:calc(100vh - 112px);overflow:auto}.letter-preview-panel{max-height:calc(100vh - 112px);overflow:auto;background:#d1d5db}.letter-template-bar{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 16px;padding:10px;border:1px solid #e5e7eb;border-radius:16px;background:#f8fafc}.letter-form label{display:flex;flex-direction:column;gap:6px}.sticky-action-row{position:sticky;bottom:0;background:linear-gradient(180deg,rgba(255,255,255,.86),#fff);padding:12px 0;margin-top:10px;z-index:4}.letter-paper{width:794px;min-height:1123px;background:#fff;color:#111827;margin:0 auto;padding:54px 60px;border:1px solid #cbd5e1;box-shadow:0 8px 24px rgba(15,23,42,.16);font-family:"Times New Roman",Times,serif;font-size:14px;line-height:1.55}.letter-head{display:flex;align-items:center;gap:22px;border-bottom:3px solid #bb2f2d;padding-bottom:14px;margin-bottom:28px}.letter-head h1{font-size:26px;margin:0;color:#0d4480;letter-spacing:.03em}.letter-head p{margin:4px 0 0;font-size:12px}.letter-photo-placeholder{width:86px;height:104px;border:2px solid #0d4480;border-radius:999px;display:flex;align-items:center;justify-content:center;color:#0d4480;font-weight:800;font-size:11px}.letter-body-grid{display:grid;grid-template-columns:170px 1fr;gap:32px}.letter-sidebar{background:#0d4480;color:#fff;margin-left:-60px;padding:28px 22px 36px 30px;min-height:700px}.letter-sidebar h3{font-size:13px;margin:0 0 7px;text-transform:uppercase}.letter-sidebar p{font-size:12px;margin:0 0 26px;line-height:1.5}.letter-main p{margin:0 0 15px;text-align:justify}.letter-main .date{text-align:left;margin-bottom:26px}.letter-main hr{border:none;border-top:1px solid #111827;margin:18px 0}.letter-main .closing,.formal-letter-paper .closing{text-align:left;margin-top:30px}.formal-letter-paper h1{text-align:center;text-decoration:underline;font-size:18px;margin:34px 0}.formal-letter-paper .right{text-align:right}.formal-letter-paper p{text-align:justify;margin:0 0 14px}.identity-table{border-collapse:collapse;margin:10px 0 20px;width:100%}.identity-table td{padding:2px 8px 2px 0;vertical-align:top}.identity-table td:first-child{width:180px}.identity-table td:nth-child(2){width:16px;text-align:center}.error-box{background:#fee2e2;color:#991b1b;padding:14px;border-radius:12px}.app-nav>a.active,.app-nav__dropdown button.active{box-shadow:inset 0 -2px 0 currentColor}
@media (max-width:1100px){.letter-paper{transform-origin:top left;transform:scale(.78);margin-left:0}.letter-preview-panel{overflow:auto}.letter-body-grid{grid-template-columns:150px 1fr}}

/* v18.48 - Surat Builder identik gaya Python upload */
.letter-builder-python{height:calc(100vh - 92px);min-height:720px;background:#0f172a00;overflow:hidden}
.letter-builder-form{display:grid;grid-template-columns:470px minmax(680px,1fr);gap:12px;height:100%}
.letter-builder-left{background:#f3f4f6;border-right:1px solid #c7cbd1;overflow:hidden;min-width:0}
.letter-builder-left-scroll{height:100%;overflow:auto;padding:8px 8px 24px;box-sizing:border-box;scrollbar-gutter:stable}
.letter-builder-left h1{font-size:17px;line-height:1.2;margin:4px 0 10px;color:#111827;font-weight:800}
.letter-field-card{background:#fff;border:1px solid #dfe3e8;margin:0 0 12px;padding:12px 13px;box-sizing:border-box}
.letter-field-title{display:block;font-size:13px;font-weight:800;color:#111827;margin:0 0 8px}
.letter-field-card input,.letter-field-card textarea{width:100%;box-sizing:border-box;border:1px solid #d7dce3;background:#fff;padding:9px 10px;font-family:"Segoe UI",Arial,sans-serif;font-size:13px;color:#111827;outline:none;border-radius:0;resize:vertical}
.letter-field-card textarea{line-height:1.25;min-height:42px}
.letter-field-card input:focus,.letter-field-card textarea:focus,.letter-setting-select:focus{border-color:#2563eb;box-shadow:0 0 0 1px #2563eb33}
.letter-photo-name{font-size:12px;color:#64748b;margin:0 0 10px;word-break:break-all}
.letter-photo-actions,.letter-translate-actions{display:grid;grid-template-columns:1fr 160px;gap:12px;align-items:center}.letter-translate-actions{grid-template-columns:1fr 1fr}
.letter-file-button{position:relative;display:flex!important;justify-content:center;align-items:center;overflow:hidden;text-align:center;cursor:pointer}.letter-file-button input{position:absolute;inset:0;opacity:0;cursor:pointer}
.letter-inline-settings p.muted,.translate-letter-card p.muted{font-size:12px;line-height:1.35;color:#64748b;margin:0 0 12px}
.letter-setting-label{display:block;font-size:12px;color:#334155;margin:0 0 10px;font-weight:500}.letter-setting-select{display:block;width:100%;box-sizing:border-box;margin-top:5px;height:41px;border:1px solid #aaa8a0;background:#deddd8;color:#111;font-size:12px;padding:0 9px;border-radius:0}.letter-inline-settings .btn.full-width{width:100%;margin-top:4px;justify-content:center;text-align:center;border-radius:0;border:1px solid #111827;background:#fff;color:#334155;height:44px;display:flex;align-items:center}.letter-inline-settings--floating{background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);border:1px solid #cfe1ff;box-shadow:0 10px 28px rgba(37,99,235,.08)}.letter-layout-quick-meta{display:flex;flex-direction:column;gap:3px;margin:0 0 12px;padding:10px 12px;border:1px solid #dbeafe;border-radius:14px;background:#eff6ff}.letter-layout-quick-label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:#2563eb}.letter-layout-quick-meta strong{font-size:16px;line-height:1.15;color:#0f172a}.letter-layout-quick-meta small{font-size:12px;color:#64748b}.letter-inline-settings--floating .btn.full-width{border-radius:14px;border:1px solid #84aef7;background:#2563eb;color:#fff;height:48px;font-weight:800}.letter-inline-settings--floating .btn.full-width:hover{background:#1d4ed8;color:#fff}
.letter-sticky-actions{position:sticky;bottom:0;display:grid;grid-template-columns:1.4fr 1fr 1fr .7fr .7fr;gap:8px;background:linear-gradient(180deg,rgba(243,244,246,.45),#f3f4f6 28%);padding:12px 0 4px;z-index:6}
.letter-builder-right{min-width:0;background:#cfd5dd;overflow:auto;position:relative;padding:16px 24px 36px;box-sizing:border-box}.letter-preview-toolbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:16px;background:#e5e7eb;padding:8px 12px;margin:-16px -24px 16px;border-bottom:1px solid #d1d5db}.letter-preview-toolbar strong{font-size:18px}.letter-zoom-pill{margin-left:auto;background:#fff;padding:10px 24px;color:#64748b}.letter-preview-stage{min-width:720px;display:flex;justify-content:center;align-items:flex-start;padding:14px 0 40px;box-sizing:border-box}
.letter-paper-v48{position:relative;background:#fff;color:#111;width:var(--letter-page-w,612px);min-height:var(--letter-page-h,792px);margin:0 auto;font-family:var(--letter-font,"Times New Roman");box-sizing:border-box;box-shadow:0 1px 0 #fff,0 0 0 1px #a3a3a3}.letter-page-border-v48{display:none!important}.letter-head-v48{position:absolute;left:99px;top:24px;height:116px;display:flex;align-items:flex-start}.letter-photo-box-v48{width:80px;height:116px;background:#e5e7eb;overflow:hidden;display:flex;align-items:center;justify-content:center;font:700 9px Arial;color:#334155}.letter-photo-box-v48 img{width:100%;height:100%;object-fit:cover;display:block}.letter-title-v48{margin-left:2px;margin-top:62px;transform:translateY(var(--letter-name-y,0px));white-space:nowrap}.letter-title-v48 h1{margin:0;color:var(--letter-name-color,#1489d6);font-family:var(--letter-name-font,Arial);font-size:var(--letter-name-size,23px);font-weight:var(--letter-name-weight,400);line-height:.85;letter-spacing:.01em}.letter-title-v48 div{margin-top:var(--letter-headline-gap,2px);font-family:var(--letter-name-font,Arial);font-size:var(--letter-headline-size,7px);font-weight:var(--letter-headline-weight,700);line-height:1;color:#111}.letter-blue-sidebar-v48{position:absolute;left:31px;top:215px;width:195px;min-height:495px;background:#0d4480;color:#fff;box-sizing:border-box;padding:18px 18px 22px 30px;transform:translateY(var(--letter-sidebar-y,0px))}.letter-blue-sidebar-v48 h3{font:bold 12px Georgia,serif;margin:0 0 48px;color:#fff}.letter-sidebar-item-v48{position:relative;margin:0 0 31px 0;display:flex;gap:8px}.letter-sidebar-icon-v48{position:absolute;left:-18px;top:0;font-size:16px;color:#fff}.letter-sidebar-item-v48 h4{margin:0 0 3px;font:bold 9px Georgia,serif;color:#fff}.letter-sidebar-item-v48 p{margin:0;font:bold 7.5px Georgia,serif;line-height:1.18;color:#fff}.letter-body-v48{position:absolute;left:205px;top:215px;width:383px;font-family:var(--letter-font,"Times New Roman");font-size:var(--letter-body-size,10.8px);font-weight:var(--letter-body-weight,400);line-height:1.47;transform:translateY(var(--letter-body-y,0px))}.letter-body-v48 p{margin:0 0 2px}.city-date-v48{margin-bottom:21px!important}.recipient-v48{margin-bottom:10px}.redline-v48{height:0;border-top:var(--letter-line-width,2.4px) solid #bb2f2d;margin:12px 0 6px}.letter-paragraph-v48{text-align:justify;text-indent:15px;margin:0 0 14px!important}.closing-v48{margin-top:20px}.formal-letter-v48{padding:54px 62px;font-size:12px}.formal-letter-v48 h1{text-align:center;text-decoration:underline;font-size:18px}.formal-letter-v48 .right{text-align:right}
@media (max-width:1100px){.letter-builder-python{height:auto;overflow:visible}.letter-builder-form{display:block;height:auto}.letter-builder-left{border-right:0}.letter-builder-left-scroll{height:auto;max-height:none}.letter-builder-right{min-height:620px}.letter-preview-stage{justify-content:flex-start;transform:scale(.86);transform-origin:top left;min-width:820px}.letter-sticky-actions{grid-template-columns:1fr 1fr}.letter-photo-actions{grid-template-columns:1fr}.letter-translate-actions{grid-template-columns:1fr 1fr}}

/* v18.49 - Surat preview kanan disamakan dengan koordinat PDF final Python */
.letter-paper-v48{width:var(--letter-page-w,612px);min-height:var(--letter-page-h,792px);box-shadow:0 10px 26px rgba(0,0,0,.28)}
.letter-head-v48{left:141px!important;top:58px!important;height:94px!important}
.letter-photo-box-v48{width:66px!important;height:94px!important;border-radius:0!important}
.letter-title-v48{margin-left:2px!important;margin-top:42px!important}
.letter-title-v48 h1{font-size:min(var(--letter-name-size,23px),22px)!important;line-height:.9!important}
.letter-title-v48 div{font-size:min(var(--letter-headline-size,7px),6.8px)!important;color:#111!important;line-height:1.05!important}
.letter-blue-sidebar-v48{left:60px!important;top:183px!important;width:166px!important;min-height:459px!important;padding:9px 14px 20px 27px!important}
.letter-blue-sidebar-v48 h3{font:bold 11px Georgia,serif!important;margin:0 0 31px!important;text-align:left!important}
.letter-sidebar-item-v48{margin-bottom:28px!important}.letter-sidebar-icon-v48{left:-19px!important;font-size:15px!important}.letter-sidebar-item-v48 h4{font:bold 7.4px Georgia,serif!important}.letter-sidebar-item-v48 p{font:bold 6.4px Georgia,serif!important;line-height:1.12!important}
.letter-body-v48{left:228px!important;top:183px!important;width:307px!important;font-size:min(var(--letter-body-size,10.8px),7.4px)!important;line-height:1.40!important}
.city-date-v48{margin-bottom:23px!important}.recipient-v48{margin-bottom:10px!important}.redline-v48{margin:14px 0 8px!important;border-top-width:1.15px!important}.letter-paragraph-v48{font-size:inherit!important;text-indent:13px!important;margin-bottom:12px!important;line-height:1.42!important}.closing-v48{margin-top:14px!important}


/* v18.50 - tombol Layout Surat dipindahkan ke header preview kanan */
.letter-layout-preview-link{border-radius:0!important;border:2px solid #111827!important;background:#fff!important;color:#64748b!important;text-decoration:none!important;min-height:44px;display:inline-flex!important;align-items:center;justify-content:center;padding:0 18px;font-weight:600;}
.letter-layout-preview-link:hover{background:#f8fafc!important;color:#111827!important;}

/* v18.53 - 50 template surat: variasi preview + HTML */
.formal-letter-v48.letter-template-application{border-top:12px solid #2563eb!important} .formal-letter-v48.letter-template-application h1{color:#2563eb!important;text-decoration:none!important;border-bottom:2px solid #2563eb;padding-bottom:8px}
.formal-letter-v48.letter-template-internship-application{border-left:12px solid #7c3aed!important} .formal-letter-v48.letter-template-internship-application h1{color:#7c3aed!important;text-align:left!important;text-decoration:none!important}
.formal-letter-v48.letter-template-scholarship-application{box-shadow:inset 0 0 0 8px #b4530918,0 10px 26px rgba(0,0,0,.24)!important} .formal-letter-v48.letter-template-scholarship-application h1{color:#b45309!important}
.formal-letter-v48.letter-template-executive-cover-letter h1{background:#0f172a!important;color:#fff!important;text-decoration:none!important;padding:10px 12px}
.formal-letter-v48.letter-template-creative-cover-letter{background:linear-gradient(90deg,#e11d4810 0 26%,#fff 26%)!important} .formal-letter-v48.letter-template-creative-cover-letter h1{color:#e11d48!important;text-decoration:none!important}
.formal-letter-v48.letter-template-resignation{border-top:12px solid #dc2626!important} .formal-letter-v48.letter-template-resignation h1{color:#dc2626!important;text-decoration:none!important;border-bottom:2px solid #dc2626;padding-bottom:8px}
.formal-letter-v48.letter-template-resignation-notice{border-left:12px solid #b91c1c!important} .formal-letter-v48.letter-template-resignation-notice h1{color:#b91c1c!important;text-align:left!important;text-decoration:none!important}
.formal-letter-v48.letter-template-immediate-resignation{box-shadow:inset 0 0 0 8px #ef444418,0 10px 26px rgba(0,0,0,.24)!important} .formal-letter-v48.letter-template-immediate-resignation h1{color:#ef4444!important}
.formal-letter-v48.letter-template-curriculum-vitae h1{background:#2563eb!important;color:#fff!important;text-decoration:none!important;padding:10px 12px}
.formal-letter-v48.letter-template-sick-notice{background:linear-gradient(90deg,#0f766e10 0 26%,#fff 26%)!important} .formal-letter-v48.letter-template-sick-notice h1{color:#0f766e!important;text-decoration:none!important}
.formal-letter-v48.letter-template-absence-permission{border-top:12px solid #f97316!important} .formal-letter-v48.letter-template-absence-permission h1{color:#f97316!important;text-decoration:none!important;border-bottom:2px solid #f97316;padding-bottom:8px}
.formal-letter-v48.letter-template-annual-leave{border-left:12px solid #0284c7!important} .formal-letter-v48.letter-template-annual-leave h1{color:#0284c7!important;text-align:left!important;text-decoration:none!important}
.formal-letter-v48.letter-template-maternity-leave{box-shadow:inset 0 0 0 8px #db277718,0 10px 26px rgba(0,0,0,.24)!important} .formal-letter-v48.letter-template-maternity-leave h1{color:#db2777!important}
.formal-letter-v48.letter-template-marriage-leave h1{background:#be185d!important;color:#fff!important;text-decoration:none!important;padding:10px 12px}
.formal-letter-v48.letter-template-religious-leave{background:linear-gradient(90deg,#04785710 0 26%,#fff 26%)!important} .formal-letter-v48.letter-template-religious-leave h1{color:#047857!important;text-decoration:none!important}
.formal-letter-v48.letter-template-power-of-attorney{border-top:12px solid #111827!important} .formal-letter-v48.letter-template-power-of-attorney h1{color:#111827!important;text-decoration:none!important;border-bottom:2px solid #111827;padding-bottom:8px}
.formal-letter-v48.letter-template-power-of-attorney-en{border-left:12px solid #334155!important} .formal-letter-v48.letter-template-power-of-attorney-en h1{color:#334155!important;text-align:left!important;text-decoration:none!important}
.formal-letter-v48.letter-template-statement{box-shadow:inset 0 0 0 8px #16a34a18,0 10px 26px rgba(0,0,0,.24)!important} .formal-letter-v48.letter-template-statement h1{color:#16a34a!important}
.formal-letter-v48.letter-template-affidavit-declaration h1{background:#4f46e5!important;color:#fff!important;text-decoration:none!important;padding:10px 12px}
.formal-letter-v48.letter-template-commitment{background:linear-gradient(90deg,#0f4c8110 0 26%,#fff 26%)!important} .formal-letter-v48.letter-template-commitment h1{color:#0f4c81!important;text-decoration:none!important}
.formal-letter-v48.letter-template-simple-agreement{border-top:12px solid #7f1d1d!important} .formal-letter-v48.letter-template-simple-agreement h1{color:#7f1d1d!important;text-decoration:none!important;border-bottom:2px solid #7f1d1d;padding-bottom:8px}
.formal-letter-v48.letter-template-mou-letter{border-left:12px solid #1d4ed8!important} .formal-letter-v48.letter-template-mou-letter h1{color:#1d4ed8!important;text-align:left!important;text-decoration:none!important}
.formal-letter-v48.letter-template-service-offer{box-shadow:inset 0 0 0 8px #0e749018,0 10px 26px rgba(0,0,0,.24)!important} .formal-letter-v48.letter-template-service-offer h1{color:#0e7490!important}
.formal-letter-v48.letter-template-business-proposal h1{background:#9333ea!important;color:#fff!important;text-decoration:none!important;padding:10px 12px}
.formal-letter-v48.letter-template-invoice-followup{background:linear-gradient(90deg,#14532d10 0 26%,#fff 26%)!important} .formal-letter-v48.letter-template-invoice-followup h1{color:#14532d!important;text-decoration:none!important}
.formal-letter-v48.letter-template-payment-reminder{border-top:12px solid #166534!important} .formal-letter-v48.letter-template-payment-reminder h1{color:#166534!important;text-decoration:none!important;border-bottom:2px solid #166534;padding-bottom:8px}
.formal-letter-v48.letter-template-demand-letter{border-left:12px solid #991b1b!important} .formal-letter-v48.letter-template-demand-letter h1{color:#991b1b!important;text-align:left!important;text-decoration:none!important}
.formal-letter-v48.letter-template-warning-letter{box-shadow:inset 0 0 0 8px #dc262618,0 10px 26px rgba(0,0,0,.24)!important} .formal-letter-v48.letter-template-warning-letter h1{color:#dc2626!important}
.formal-letter-v48.letter-template-termination-notice h1{background:#7f1d1d!important;color:#fff!important;text-decoration:none!important;padding:10px 12px}
.formal-letter-v48.letter-template-recommendation-letter{background:linear-gradient(90deg,#b4530910 0 26%,#fff 26%)!important} .formal-letter-v48.letter-template-recommendation-letter h1{color:#b45309!important;text-decoration:none!important}
.formal-letter-v48.letter-template-reference-letter{border-top:12px solid #92400e!important} .formal-letter-v48.letter-template-reference-letter h1{color:#92400e!important;text-decoration:none!important;border-bottom:2px solid #92400e;padding-bottom:8px}
.formal-letter-v48.letter-template-internship-completion{border-left:12px solid #2563eb!important} .formal-letter-v48.letter-template-internship-completion h1{color:#2563eb!important;text-align:left!important;text-decoration:none!important}
.formal-letter-v48.letter-template-employment-certificate{box-shadow:inset 0 0 0 8px #0f766e18,0 10px 26px rgba(0,0,0,.24)!important} .formal-letter-v48.letter-template-employment-certificate h1{color:#0f766e!important}
.formal-letter-v48.letter-template-scholarship-motivation h1{background:#7c3aed!important;color:#fff!important;text-decoration:none!important;padding:10px 12px}
.formal-letter-v48.letter-template-statement-of-purpose{background:linear-gradient(90deg,#4c1d9510 0 26%,#fff 26%)!important} .formal-letter-v48.letter-template-statement-of-purpose h1{color:#4c1d95!important;text-decoration:none!important}
.formal-letter-v48.letter-template-letter-of-intent{border-top:12px solid #0f172a!important} .formal-letter-v48.letter-template-letter-of-intent h1{color:#0f172a!important;text-decoration:none!important;border-bottom:2px solid #0f172a;padding-bottom:8px}
.formal-letter-v48.letter-template-letter-of-interest{border-left:12px solid #0369a1!important} .formal-letter-v48.letter-template-letter-of-interest h1{color:#0369a1!important;text-align:left!important;text-decoration:none!important}
.formal-letter-v48.letter-template-formal-invitation{box-shadow:inset 0 0 0 8px #1d4ed818,0 10px 26px rgba(0,0,0,.24)!important} .formal-letter-v48.letter-template-formal-invitation h1{color:#1d4ed8!important}
.formal-letter-v48.letter-template-meeting-invitation h1{background:#2563eb!important;color:#fff!important;text-decoration:none!important;padding:10px 12px}
.formal-letter-v48.letter-template-thank-you-letter{background:linear-gradient(90deg,#16a34a10 0 26%,#fff 26%)!important} .formal-letter-v48.letter-template-thank-you-letter h1{color:#16a34a!important;text-decoration:none!important}
.formal-letter-v48.letter-template-apology-letter{border-top:12px solid #ea580c!important} .formal-letter-v48.letter-template-apology-letter h1{color:#ea580c!important;text-decoration:none!important;border-bottom:2px solid #ea580c;padding-bottom:8px}
.formal-letter-v48.letter-template-complaint-letter{border-left:12px solid #dc2626!important} .formal-letter-v48.letter-template-complaint-letter h1{color:#dc2626!important;text-align:left!important;text-decoration:none!important}
.formal-letter-v48.letter-template-complaint-response{box-shadow:inset 0 0 0 8px #0ea5e918,0 10px 26px rgba(0,0,0,.24)!important} .formal-letter-v48.letter-template-complaint-response h1{color:#0ea5e9!important}
.formal-letter-v48.letter-template-authorization-letter h1{background:#334155!important;color:#fff!important;text-decoration:none!important;padding:10px 12px}
.formal-letter-v48.letter-template-consent-letter{background:linear-gradient(90deg,#0f766e10 0 26%,#fff 26%)!important} .formal-letter-v48.letter-template-consent-letter h1{color:#0f766e!important;text-decoration:none!important}
.formal-letter-v48.letter-template-nda-commitment{border-top:12px solid #111827!important} .formal-letter-v48.letter-template-nda-commitment h1{color:#111827!important;text-decoration:none!important;border-bottom:2px solid #111827;padding-bottom:8px}
.formal-letter-v48.letter-template-bank-guarantee-willingness{border-left:12px solid #0f4c81!important} .formal-letter-v48.letter-template-bank-guarantee-willingness h1{color:#0f4c81!important;text-align:left!important;text-decoration:none!important}
.formal-letter-v48.letter-template-not-blacklisted-pailit{box-shadow:inset 0 0 0 8px #14532d18,0 10px 26px rgba(0,0,0,.24)!important} .formal-letter-v48.letter-template-not-blacklisted-pailit h1{color:#14532d!important}
.formal-letter-v48.letter-template-domicile-statement h1{background:#64748b!important;color:#fff!important;text-decoration:none!important;padding:10px 12px}
.formal-letter-v48.letter-template-employment-verification{background:linear-gradient(90deg,#1e293b10 0 26%,#fff 26%)!important} .formal-letter-v48.letter-template-employment-verification h1{color:#1e293b!important;text-decoration:none!important}

/* v18.71 - Action export Surat dipindahkan ke header preview */
.letter-sticky-actions{display:none!important;}
.letter-preview-action{min-height:38px;padding:0 14px;font-weight:800;white-space:nowrap;}
.letter-preview-template{border-color:#111827!important;color:#111827!important;background:#fff!important;}
.letter-preview-template:hover{background:#eff6ff!important;color:#1d4ed8!important;border-color:#1d4ed8!important;}
.letter-preview-toolbar{flex-wrap:wrap;}
.letter-preview-toolbar .letter-zoom-pill{margin-left:auto;}
@media (max-width:1100px){
  .letter-preview-toolbar{gap:8px;}
  .letter-preview-action{font-size:12px;padding:0 10px;}
}


/* v19.22 - Header preview Surat: zoom +/- dan tombol pilih template */
.letter-preview-toolbar .letter-template-preview-link{
    border-color:#2563eb!important;
    color:#1d4ed8!important;
    background:#eff6ff!important;
    font-weight:900!important;
}
.letter-preview-toolbar .letter-template-preview-link:hover{background:#2563eb!important;color:#fff!important;}
.letter-zoom-box{
    margin-left:auto;
    min-height:40px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:0 10px;
    background:#fff;
    border:1px solid #e2e8f0;
    color:#475569;
    font-weight:900;
    box-shadow:0 1px 0 rgba(15,23,42,.04);
}
.letter-zoom-box button{
    width:32px;
    height:30px;
    border:0;
    border-radius:8px;
    background:#f8fafc;
    color:#1d4ed8;
    font-size:15px;
    font-weight:900;
    cursor:pointer;
}
.letter-zoom-box button:hover{background:#2563eb;color:#fff;}
#letterPreviewStage{width:max-content;margin-left:auto;margin-right:auto;transition:transform .14s ease;}
.letter-photo-card{display:block;}
@media (max-width:1100px){#letterPreviewStage{transform-origin:top left!important;}.letter-zoom-box{margin-left:0;}}

/* v19.23 - tombol layout surat terkunci untuk KarirRapi Plus */
.letter-layout-preview-link.letter-layout-preview-link--locked,
.letter-layout-locked{
    background:linear-gradient(135deg,#fff7ed,#fffbeb)!important;
    border-color:#fed7aa!important;
    color:#9a3412!important;
    font-weight:900!important;
}
.letter-layout-preview-link.letter-layout-preview-link--locked:hover,
.letter-layout-locked:hover{
    background:linear-gradient(135deg,#ffedd5,#fef3c7)!important;
    border-color:#fb923c!important;
    color:#7c2d12!important;
}

/* v19.26 workspace repair setelah Bootstrap: jangan beri padding besar pada halaman preview/workspace. */
.app-body.with-navbar{
    min-height:calc(100vh - 86px) !important;
    height:auto !important;
    overflow:visible !important;
}
body.cv-preview-full .app-body.with-navbar{
    padding:0 !important;
    overflow:hidden !important;
}
body.auth-body .site-footer--auth{
    display:none !important;
}


/* v20.56 - Badge template surat disamakan dengan badge template di preview CV */
.letter-toolbar-template-active{
    margin-left:10px;
    margin-right:16px;
    flex:0 1 290px;
    min-width:240px;
    max-width:340px;
    display:grid;
    gap:2px;
    align-content:center;
    border:1px solid color-mix(in srgb, var(--letter-template-accent, #2563eb) 28%, #bfdbfe);
    background:linear-gradient(135deg,#ffffff 0%, color-mix(in srgb, var(--letter-template-accent, #2563eb) 10%, #eff6ff) 100%);
    box-shadow:0 8px 18px color-mix(in srgb, var(--letter-template-accent, #2563eb) 18%, transparent);
    border-radius:16px;
    padding:8px 14px;
    line-height:1.15;
    color:#0f172a;
    overflow:visible;
}
.letter-toolbar-template-active small{
    font-size:9px;
    font-weight:950;
    text-transform:uppercase;
    color:var(--letter-template-accent, #2563eb);
    letter-spacing:.08em;
    white-space:nowrap;
}
.letter-toolbar-template-active strong{
    display:block;
    font-size:13px;
    font-weight:950;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    line-height:1.15;
    word-break:break-word;
}
.letter-toolbar-template-active span{
    font-size:9.5px;
    font-weight:850;
    color:#64748b;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    line-height:1.15;
    word-break:break-word;
}
@media(max-width:1280px){
    .letter-toolbar-template-active{flex-basis:240px;min-width:210px;max-width:280px;margin-right:10px;}
    .letter-toolbar-template-active strong{font-size:12px;}
}
@media(max-width:980px){
    .letter-toolbar-template-active{width:100%;max-width:none;min-width:0;flex-basis:auto;margin-left:0;margin-right:0;}
}

/* v20.58 - Tombol Update Surat manual di setiap section input surat, disamakan konsepnya dengan Update CV. */
.letter-update-section .letter-update-surat-btn{
    width:100%;
    min-height:46px!important;
    margin-top:10px!important;
    border:1px solid #93c5fd!important;
    border-radius:14px!important;
    background:linear-gradient(135deg,#eff6ff 0%,#ffffff 100%)!important;
    color:#1d4ed8!important;
    font-size:14px!important;
    font-weight:900!important;
    letter-spacing:.01em!important;
    box-shadow:0 10px 22px rgba(37,99,235,.08)!important;
    cursor:pointer!important;
}
.letter-update-section .letter-update-surat-btn:hover{
    background:#2563eb!important;
    color:#ffffff!important;
    border-color:#2563eb!important;
}
.letter-update-section .letter-update-surat-btn:disabled{
    opacity:.78!important;
    cursor:wait!important;
}
.letter-update-loading-card .cv-update-loading-text:after{
    content:" surat";
}
@media (max-width:900px){
    .letter-update-section .letter-update-surat-btn{min-height:42px!important;font-size:13px!important;}
}


/* v20.59 - Section Surat disamakan visualnya dengan section Buat CV. */
.letter-accordion-section{margin:0 0 12px;}
.letter-accordion-section .cv-section-head{grid-template-columns:26px 40px minmax(0,1fr) auto 34px;}
.letter-accordion-section .cv-section-head strong{font-size:18px;}
.letter-accordion-section .cv-section-body{padding:18px 16px 20px;}
.letter-section-body input,
.letter-section-body textarea{
    width:100%;
    box-sizing:border-box;
    border:1px solid #cbd5e1;
    background:#ffffff;
    padding:12px 14px;
    font-family:"Segoe UI",Arial,sans-serif;
    font-size:14px;
    color:#111827;
    outline:none;
    border-radius:14px;
    resize:vertical;
    margin:0 0 12px;
}
.letter-section-body textarea{line-height:1.38;min-height:72px;}
.letter-section-body input:focus,
.letter-section-body textarea:focus{border-color:#2563eb;box-shadow:0 0 0 1px rgba(37,99,235,.2);}
.letter-section-muted{color:#64748b;font-size:14px;line-height:1.55;margin:0 0 12px;}
.letter-photo-stack,.letter-layout-stack{display:grid;gap:12px;}
.letter-photo-name{font-size:14px;color:#64748b;margin:0 0 12px;word-break:break-all;}
.letter-translate-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:stretch;}
.letter-translate-actions .cv-wide-btn,
.letter-photo-stack .cv-wide-btn,
.letter-section-body .letter-update-surat-btn,
.letter-section-body .letter-wide-link{
    width:100%;
    min-height:56px;
    margin:0 0 12px;
    border-radius:14px;
    align-items:center;
    justify-content:center;
    text-decoration:none;
}
.letter-translate-actions .cv-wide-btn:last-child,
.letter-photo-stack .cv-wide-btn:last-child,
.letter-section-body .letter-update-surat-btn:last-child,
.letter-section-body .letter-wide-link:last-child{margin-bottom:0;}
.letter-section-body .letter-wide-link{display:flex;}
.letter-section-body .letter-update-surat-btn{font-size:18px;font-weight:800;}
.letter-section-body .letter-file-button input{margin:0;padding:0;border:0;box-shadow:none;background:transparent;}
@media (max-width:1100px){
    .letter-translate-actions{grid-template-columns:1fr;}
}
@media (max-width:900px){
    .letter-accordion-section .cv-section-head strong{font-size:16px;}
    .letter-section-body .letter-update-surat-btn,
    .letter-translate-actions .cv-wide-btn,
    .letter-photo-stack .cv-wide-btn,
    .letter-section-body .letter-wide-link{min-height:50px;font-size:16px;}
}


/* v20.61 - Setting Layout Surat disederhanakan seperti CV: warna/ukuran full page aktif di preview surat. */
.letter-blue-sidebar-v48{
    background:var(--letter-template-color,#0d4480)!important;
    color:var(--letter-sidebar-text,#fff)!important;
}
.letter-blue-sidebar-v48 h3,
.letter-sidebar-icon-v48,
.letter-sidebar-item-v48 h4,
.letter-sidebar-item-v48 p{
    color:var(--letter-sidebar-text,#fff)!important;
}
.letter-body-v48,
.formal-letter-v48,
.formal-letter-v48 p,
.formal-letter-v48 td,
.formal-letter-v48 .right{
    color:var(--letter-body-color,#111)!important;
}
.letter-body-v48{
    color:var(--letter-body-color,#111)!important;
}
.letter-title-v48 div{
    color:var(--letter-body-color,#111)!important;
}
.redline-v48{
    border-top-color:var(--letter-template-color,#bb2f2d)!important;
}


/* v20.64 - Live preview Setting Layout Surat benar-benar aktif untuk semua input ringkas. */
.letter-paper-v48{
    width:var(--letter-page-w,612px)!important;
    min-height:var(--letter-page-h,792px)!important;
    font-family:var(--letter-font,"Times New Roman")!important;
    color:var(--letter-body-color,#111)!important;
}
.letter-sidebar-layout-v48 .letter-page-border-v48{display:none!important;}
.letter-head-v48{
    left:var(--letter-head-left,141px)!important;
    top:var(--letter-head-top,58px)!important;
}
.letter-title-v48 h1{
    color:var(--letter-name-color,#1489d6)!important;
    font-family:var(--letter-name-font,Arial)!important;
    font-size:var(--letter-name-size,23px)!important;
    font-weight:var(--letter-name-weight,400)!important;
    line-height:.95!important;
}
.letter-title-v48 div{
    color:var(--letter-body-color,#111)!important;
    font-family:var(--letter-name-font,Arial)!important;
    font-size:var(--letter-headline-size,7px)!important;
    font-weight:var(--letter-headline-weight,700)!important;
}
.letter-blue-sidebar-v48{
    left:var(--letter-sidebar-left,60px)!important;
    top:var(--letter-content-top,183px)!important;
    width:var(--letter-sidebar-width,166px)!important;
    background:var(--letter-template-color,#0d4480)!important;
    color:var(--letter-sidebar-text,#fff)!important;
}
.letter-blue-sidebar-v48 h3{
    font-size:calc(11px * var(--letter-full-scale,1))!important;
    color:var(--letter-sidebar-text,#fff)!important;
}
.letter-sidebar-icon-v48{
    font-size:calc(15px * var(--letter-full-scale,1))!important;
    color:var(--letter-sidebar-text,#fff)!important;
}
.letter-sidebar-item-v48 h4{
    font-size:calc(7.4px * var(--letter-full-scale,1))!important;
    color:var(--letter-sidebar-text,#fff)!important;
}
.letter-sidebar-item-v48 p{
    font-size:calc(6.4px * var(--letter-full-scale,1))!important;
    color:var(--letter-sidebar-text,#fff)!important;
}
.letter-body-v48{
    left:var(--letter-body-left,228px)!important;
    top:var(--letter-content-top,183px)!important;
    width:var(--letter-body-width,307px)!important;
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:var(--letter-body-size,10.8px)!important;
    font-weight:var(--letter-body-weight,400)!important;
    color:var(--letter-body-color,#111)!important;
}
.letter-body-v48 p,
.letter-body-v48 div{
    color:var(--letter-body-color,#111)!important;
}
.redline-v48{
    border-top-color:var(--letter-template-color,#bb2f2d)!important;
}
.formal-letter-v48{
    padding:var(--letter-formal-pad-y,54px) var(--letter-formal-pad-x,62px)!important;
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:var(--letter-body-size,12px)!important;
    color:var(--letter-body-color,#111)!important;
    border-color:var(--letter-template-color,#2563eb)!important;
    border-top-color:var(--letter-template-color,#2563eb)!important;
    border-left-color:var(--letter-template-color,#2563eb)!important;
}
.formal-letter-v48 h1{
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:calc(var(--letter-body-size,12px) * 1.45)!important;
    color:var(--letter-template-color,#2563eb)!important;
    border-color:var(--letter-template-color,#2563eb)!important;
}
.formal-letter-v48 h1[style],
.formal-letter-v48[class*="letter-template-"] h1{
    color:var(--letter-template-color,#2563eb)!important;
    border-color:var(--letter-template-color,#2563eb)!important;
}
.formal-letter-v48 h1:where(:not(:empty)){
    border-bottom-color:var(--letter-template-color,#2563eb)!important;
}
.formal-letter-v48 p,
.formal-letter-v48 td,
.formal-letter-v48 .right,
.formal-letter-v48 .recipient-v48,
.formal-letter-v48 .closing-v48{
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:var(--letter-body-size,12px)!important;
    color:var(--letter-body-color,#111)!important;
}
.formal-letter-v48.letter-template-executive-cover-letter h1,
.formal-letter-v48.letter-template-meeting-invitation h1,
.formal-letter-v48.letter-template-authorization-letter h1,
.formal-letter-v48.letter-template-employment-verification h1,
.formal-letter-v48.letter-template-curriculum-vitae h1{
    background:var(--letter-template-color,#2563eb)!important;
    color:var(--letter-sidebar-text,#fff)!important;
}


/* v20.67 - Hapus garis/kotak tepi halaman surat di preview & export */
.letter-page-border-v48{display:none!important;border:0!important;box-shadow:none!important;}
.letter-sidebar-layout-v48 .letter-page-border-v48{display:none!important;}

/* v20.69 - Preview Surat ikut algoritma preview CV: page fixed, tidak kepotong, dan ada garis batas antar halaman. */
.letter-preview-stage,
.letter-export-stage,
.letter-download-render-stage{
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
}
.letter-preview-stage .letter-paper-v48,
.letter-export-stage .letter-paper-v48,
.letter-download-render-stage .letter-paper-v48{
    width:var(--letter-page-w,612px)!important;
    min-width:var(--letter-page-w,612px)!important;
    max-width:var(--letter-page-w,612px)!important;
    height:var(--letter-page-h,792px)!important;
    min-height:var(--letter-page-h,792px)!important;
    max-height:var(--letter-page-h,792px)!important;
    overflow:hidden!important;
    flex:0 0 auto!important;
}
.letter-preview-stage[data-letter-multipage="1"] .letter-paper-v48{
    margin:0 auto!important;
}
.letter-preview-stage[data-letter-multipage="1"] .letter-preview-page-separator{
    width:var(--letter-page-w,612px)!important;
    margin:28px auto!important;
}
.letter-continuation-sidebar-placeholder{
    opacity:.92!important;
}
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-head-v48{
    display:none!important;
}
.letter-download-render-stage[data-letter-multipage="1"]{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
}
.letter-download-render-stage[data-letter-multipage="1"] .letter-paper-v48{
    margin:0!important;
    box-shadow:none!important;
    break-after:page!important;
    page-break-after:always!important;
}
.letter-download-render-stage[data-letter-multipage="1"] .letter-paper-v48:last-child{
    break-after:auto!important;
    page-break-after:auto!important;
}
.letter-download-render-stage .letter-preview-page-separator,
body.letter-download-render-body .letter-preview-page-separator{
    display:none!important;
}
@media print{
    .letter-preview-page-separator{display:none!important;}
}


/* v20.70 - Surat kembali WAJIB satu halaman saja.
   Preview surat tidak membuat page 2, tidak menampilkan garis PAGE 1 → PAGE 2,
   dan template sidebar lamaran dipadatkan supaya isi standar tidak kepotong. */
.letter-preview-stage,
.letter-export-stage,
.letter-download-render-stage{
    flex-direction:row!important;
    align-items:flex-start!important;
    justify-content:center!important;
}
.letter-preview-stage .letter-paper-v48,
.letter-export-stage .letter-paper-v48,
.letter-download-render-stage .letter-paper-v48{
    width:var(--letter-page-w,612px)!important;
    min-width:var(--letter-page-w,612px)!important;
    max-width:var(--letter-page-w,612px)!important;
    height:var(--letter-page-h,792px)!important;
    min-height:var(--letter-page-h,792px)!important;
    max-height:var(--letter-page-h,792px)!important;
    overflow:hidden!important;
    flex:0 0 auto!important;
}
.letter-preview-stage > .letter-paper-v48:not(:first-of-type),
.letter-export-stage > .letter-paper-v48:not(:first-of-type),
.letter-download-render-stage > .letter-paper-v48:not(:first-of-type),
.letter-preview-page-separator,
.cv-preview-page-separator.letter-preview-page-separator{
    display:none!important;
}
.letter-preview-stage[data-letter-multipage],
.letter-export-stage[data-letter-multipage],
.letter-download-render-stage[data-letter-multipage]{
    flex-direction:row!important;
}
.letter-sidebar-layout-v48[data-letter-one-page="1"] .letter-body-v48,
.letter-sidebar-layout-v48 .letter-body-v48{
    font-size:calc(var(--letter-body-size,10.8px) * var(--letter-onepage-fit-scale,1))!important;
    line-height:1.32!important;
    max-height:calc(var(--letter-page-h,792px) - var(--letter-content-top,183px) - 22px)!important;
    overflow:hidden!important;
}
.letter-sidebar-layout-v48 .city-date-v48{margin-bottom:17px!important;}
.letter-sidebar-layout-v48 .recipient-v48{margin-bottom:7px!important;line-height:1.28!important;}
.letter-sidebar-layout-v48 .redline-v48{margin:8px 0 6px!important;border-top-width:1.15px!important;}
.letter-sidebar-layout-v48 .letter-paragraph-v48{
    text-indent:13px!important;
    margin-bottom:8px!important;
    line-height:1.34!important;
}
.letter-sidebar-layout-v48 .closing-v48{margin-top:8px!important;line-height:1.30!important;}
.letter-sidebar-layout-v48 .letter-blue-sidebar-v48{min-height:459px!important;}
body.letter-download-render-body .letter-preview-page-separator,
body.letter-download-render-body .cv-preview-page-separator{display:none!important;}
@media print{
    .letter-preview-page-separator,
    .cv-preview-page-separator{display:none!important;}
}


/* v20.71 - Hybrid preview surat: template 1 halaman dipadatkan dulu,
   tapi PAGE 1 → PAGE 2 tetap muncul kalau isi benar-benar overflow. */
.letter-preview-stage,
.letter-export-stage,
.letter-download-render-stage{
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
}
.letter-preview-stage .letter-paper-v48,
.letter-export-stage .letter-paper-v48,
.letter-download-render-stage .letter-paper-v48{
    width:var(--letter-page-w,612px)!important;
    min-width:var(--letter-page-w,612px)!important;
    max-width:var(--letter-page-w,612px)!important;
    height:var(--letter-page-h,792px)!important;
    min-height:var(--letter-page-h,792px)!important;
    max-height:var(--letter-page-h,792px)!important;
    overflow:hidden!important;
    flex:0 0 auto!important;
}
.letter-preview-stage[data-letter-multipage="1"],
.letter-export-stage[data-letter-multipage="1"],
.letter-download-render-stage[data-letter-multipage="1"]{
    flex-direction:column!important;
}
.letter-preview-stage[data-letter-multipage="1"] > .letter-paper-v48:not(:first-of-type),
.letter-export-stage[data-letter-multipage="1"] > .letter-paper-v48:not(:first-of-type),
.letter-download-render-stage[data-letter-multipage="1"] > .letter-paper-v48:not(:first-of-type){
    display:block!important;
}
.letter-preview-stage[data-letter-multipage="1"] .letter-preview-page-separator,
.letter-export-stage[data-letter-multipage="1"] .letter-preview-page-separator{
    display:flex!important;
    width:var(--letter-page-w,612px)!important;
    margin:28px auto!important;
}
.letter-sidebar-layout-v48 .letter-body-v48{
    overflow:visible!important;
    max-height:none!important;
}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .letter-body-v48{
    font-size:calc(var(--letter-body-size,10.8px) * var(--letter-onepage-fit-scale,1))!important;
    line-height:1.32!important;
}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .city-date-v48{margin-bottom:17px!important;}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .recipient-v48{margin-bottom:7px!important;line-height:1.28!important;}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .redline-v48{margin:8px 0 6px!important;border-top-width:1.15px!important;}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .letter-paragraph-v48{
    text-indent:13px!important;
    margin-bottom:8px!important;
    line-height:1.34!important;
}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .closing-v48{margin-top:8px!important;line-height:1.30!important;}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .letter-blue-sidebar-v48{min-height:459px!important;}
.formal-letter-v48[data-letter-one-page-intent="1"]{
    padding:calc(var(--letter-formal-pad-y,54px) * var(--letter-formal-fit-scale,1)) calc(var(--letter-formal-pad-x,62px) * var(--letter-formal-fit-scale,1))!important;
    font-size:calc(var(--letter-body-size,12px) * var(--letter-formal-fit-scale,1))!important;
}
.formal-letter-v48[data-letter-one-page-intent="1"] h1{
    font-size:calc(var(--letter-body-size,12px) * 1.45 * var(--letter-formal-fit-scale,1))!important;
    margin-top:calc(34px * var(--letter-formal-fit-scale,1))!important;
    margin-bottom:calc(22px * var(--letter-formal-fit-scale,1))!important;
}
.formal-letter-v48[data-letter-one-page-intent="1"] p,
.formal-letter-v48[data-letter-one-page-intent="1"] .recipient-v48,
.formal-letter-v48[data-letter-one-page-intent="1"] .closing-v48{
    font-size:calc(var(--letter-body-size,12px) * var(--letter-formal-fit-scale,1))!important;
    line-height:1.35!important;
}
.letter-continuation-sidebar-placeholder{opacity:.92!important;}
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-head-v48{display:none!important;}
.letter-download-render-stage .letter-preview-page-separator,
body.letter-download-render-body .letter-preview-page-separator,
.letter-download-render-stage .cv-preview-page-separator,
body.letter-download-render-body .cv-preview-page-separator{display:none!important;}
@media print{
    .letter-preview-page-separator,
    .cv-preview-page-separator{display:none!important;}
}

/* v20.72 - Preview Surat full-page parity seperti CV.
   Ukuran desain surat memakai CSS pixel 96dpi, jadi preview layar dan hasil PDF memakai kertas penuh yang sama. */
.letter-preview-stage,
.letter-export-stage,
.letter-download-render-stage{
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
}
.letter-preview-stage .letter-paper-v48,
.letter-export-stage .letter-paper-v48,
.letter-download-render-stage .letter-paper-v48{
    width:var(--letter-page-w,816px)!important;
    min-width:var(--letter-page-w,816px)!important;
    max-width:var(--letter-page-w,816px)!important;
    height:var(--letter-page-h,1056px)!important;
    min-height:var(--letter-page-h,1056px)!important;
    max-height:var(--letter-page-h,1056px)!important;
    overflow:hidden!important;
    flex:0 0 auto!important;
}
.letter-photo-box-v48{
    width:calc(80px * var(--letter-pdf-parity-scale,1))!important;
    height:calc(116px * var(--letter-pdf-parity-scale,1))!important;
    font-size:calc(9px * var(--letter-pdf-parity-scale,1))!important;
}
.letter-title-v48{
    margin-left:calc(2px * var(--letter-pdf-parity-scale,1))!important;
    margin-top:calc(62px * var(--letter-pdf-parity-scale,1))!important;
}
.letter-blue-sidebar-v48{
    padding:calc(18px * var(--letter-pdf-parity-scale,1)) calc(18px * var(--letter-pdf-parity-scale,1)) calc(22px * var(--letter-pdf-parity-scale,1)) calc(30px * var(--letter-pdf-parity-scale,1))!important;
}
.letter-blue-sidebar-v48 h3{
    margin-bottom:calc(48px * var(--letter-pdf-parity-scale,1))!important;
}
.letter-sidebar-item-v48{
    gap:calc(8px * var(--letter-pdf-parity-scale,1))!important;
    margin-bottom:calc(31px * var(--letter-pdf-parity-scale,1))!important;
}
.letter-sidebar-icon-v48{
    left:calc(-18px * var(--letter-pdf-parity-scale,1))!important;
}
.letter-sidebar-item-v48 h4{
    margin-bottom:calc(3px * var(--letter-pdf-parity-scale,1))!important;
}
.letter-body-v48{
    font-size:var(--letter-body-size,14.4px)!important;
    line-height:1.47!important;
    overflow:visible!important;
    max-height:none!important;
}
.letter-body-v48 p{margin-bottom:calc(2px * var(--letter-pdf-parity-scale,1))!important;}
.city-date-v48{margin-bottom:calc(21px * var(--letter-pdf-parity-scale,1))!important;}
.recipient-v48{margin-bottom:calc(10px * var(--letter-pdf-parity-scale,1))!important;}
.redline-v48{margin:calc(12px * var(--letter-pdf-parity-scale,1)) 0 calc(6px * var(--letter-pdf-parity-scale,1))!important;}
.letter-paragraph-v48{
    text-indent:calc(15px * var(--letter-pdf-parity-scale,1))!important;
    margin-bottom:calc(14px * var(--letter-pdf-parity-scale,1))!important;
}
.closing-v48{margin-top:calc(20px * var(--letter-pdf-parity-scale,1))!important;}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .letter-body-v48{
    font-size:calc(var(--letter-body-size,14.4px) * var(--letter-onepage-fit-scale,1))!important;
    line-height:1.32!important;
}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .city-date-v48{margin-bottom:calc(17px * var(--letter-pdf-parity-scale,1))!important;}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .recipient-v48{margin-bottom:calc(7px * var(--letter-pdf-parity-scale,1))!important;line-height:1.28!important;}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .redline-v48{margin:calc(8px * var(--letter-pdf-parity-scale,1)) 0 calc(6px * var(--letter-pdf-parity-scale,1))!important;border-top-width:calc(1.15px * var(--letter-pdf-parity-scale,1))!important;}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .letter-paragraph-v48{
    text-indent:calc(13px * var(--letter-pdf-parity-scale,1))!important;
    margin-bottom:calc(8px * var(--letter-pdf-parity-scale,1))!important;
    line-height:1.34!important;
}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .closing-v48{margin-top:calc(8px * var(--letter-pdf-parity-scale,1))!important;line-height:1.30!important;}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .letter-blue-sidebar-v48{min-height:calc(459px * var(--letter-pdf-parity-scale,1))!important;}
.formal-letter-v48[data-letter-one-page-intent="1"] h1{
    margin-top:calc(34px * var(--letter-formal-fit-scale,1) * var(--letter-pdf-parity-scale,1))!important;
    margin-bottom:calc(22px * var(--letter-formal-fit-scale,1) * var(--letter-pdf-parity-scale,1))!important;
}


/* v20.74 - Setting Layout Surat: Ukuran Font Surat (Full Page) wajib mempengaruhi SEMUA font.
   Tidak boleh ada hard-cap 7.45px lagi: kalau user pilih 150%/175%/200%, nama, headline,
   isi surat, kontak/sidebar, icon text, FOTO, dan template formal ikut membesar.
   Jika terlalu panjang, algoritma multipage menampilkan PAGE 1 → PAGE 2, bukan mengecilkan diam-diam. */
.letter-preview-stage .letter-paper-v48,
.letter-export-stage .letter-paper-v48,
.letter-download-render-stage .letter-paper-v48{
    font-family:var(--letter-font,"Times New Roman")!important;
    color:var(--letter-body-color,#111111)!important;
}
.letter-photo-box-v48{
    font-size:calc(9px * var(--letter-full-scale,1))!important;
    line-height:1!important;
}
.letter-title-v48 h1{
    font-size:var(--letter-name-size,30.67px)!important;
    font-family:var(--letter-name-font,var(--letter-font,"Times New Roman"))!important;
    color:var(--letter-name-color,#1489d6)!important;
}
.letter-title-v48 div{
    font-size:var(--letter-headline-size,9.33px)!important;
    font-family:var(--letter-name-font,var(--letter-font,"Times New Roman"))!important;
    color:var(--letter-body-color,#111111)!important;
}
.letter-body-v48,
.letter-body-v48 p,
.letter-body-v48 div,
.letter-body-v48 span{
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:var(--letter-body-size,14.4px)!important;
    color:var(--letter-body-color,#111111)!important;
}
.letter-blue-sidebar-v48{
    background:var(--letter-template-color,#0d4480)!important;
    color:var(--letter-sidebar-text,#ffffff)!important;
}
.letter-blue-sidebar-v48,
.letter-blue-sidebar-v48 *{
    color:var(--letter-sidebar-text,#ffffff)!important;
}
.letter-blue-sidebar-v48 h3{
    font-family:Georgia,serif!important;
    font-size:calc(12px * var(--letter-full-scale,1))!important;
    line-height:1.08!important;
}
.letter-sidebar-icon-v48{
    font-size:calc(16px * var(--letter-full-scale,1))!important;
    line-height:1!important;
}
.letter-sidebar-item-v48 h4{
    font-family:Georgia,serif!important;
    font-size:calc(9px * var(--letter-full-scale,1))!important;
    line-height:1.05!important;
}
.letter-sidebar-item-v48 p,
.letter-sidebar-item-v48 div,
.letter-sidebar-item-v48 span:not(.letter-sidebar-icon-v48){
    font-family:Georgia,serif!important;
    font-size:calc(7.5px * var(--letter-full-scale,1))!important;
    line-height:1.18!important;
}
.formal-letter-v48{
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:var(--letter-body-size,14.4px)!important;
    color:var(--letter-body-color,#111111)!important;
}
.formal-letter-v48 h1{
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:calc(var(--letter-body-size,14.4px) * 1.45)!important;
    color:var(--letter-body-color,#111111)!important;
}
.formal-letter-v48 p,
.formal-letter-v48 div,
.formal-letter-v48 span,
.formal-letter-v48 td{
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:var(--letter-body-size,14.4px)!important;
    color:var(--letter-body-color,#111111)!important;
}
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .letter-body-v48,
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .letter-body-v48 p,
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .letter-body-v48 div,
.letter-sidebar-layout-v48[data-letter-one-page-intent="1"] .letter-body-v48 span{
    font-size:calc(var(--letter-body-size,14.4px) * var(--letter-onepage-fit-scale,1))!important;
}
.formal-letter-v48[data-letter-one-page-intent="1"],
.formal-letter-v48[data-letter-one-page-intent="1"] p,
.formal-letter-v48[data-letter-one-page-intent="1"] div,
.formal-letter-v48[data-letter-one-page-intent="1"] span,
.formal-letter-v48[data-letter-one-page-intent="1"] td{
    font-size:calc(var(--letter-body-size,14.4px) * var(--letter-formal-fit-scale,1))!important;
}
.formal-letter-v48[data-letter-one-page-intent="1"] h1{
    font-size:calc(var(--letter-body-size,14.4px) * 1.45 * var(--letter-formal-fit-scale,1))!important;
}

/* v20.75 - Ruang kop surat untuk cetak di kertas yang sudah punya letterhead.
   Area kosong muncul di atas judul/header surat dan ikut ke export PDF.
   v20.93: garis pemisah kop dibuat berada di layer paling atas agar tidak tertutup template sample. */
.letter-paper-v48[data-letter-kop-space="1"]::before{
    content:"";
    position:absolute!important;
    left:var(--letter-formal-pad-x,62px)!important;
    top:0!important;
    right:var(--letter-formal-pad-x,62px)!important;
    height:var(--letter-kop-space-height,113px)!important;
    background:#fff!important;
    border-bottom:2px solid var(--letter-template-color,var(--letter-accent-color,#0f766e))!important;
    box-shadow:0 1px 0 rgba(15,23,42,.05)!important;
    z-index:8!important;
    pointer-events:none!important;
}
.letter-paper-v48[data-letter-kop-space="1"] .letter-head-v48,
.letter-paper-v48[data-letter-kop-space="1"] .letter-blue-sidebar-v48,
.letter-paper-v48[data-letter-kop-space="1"] .letter-body-v48,
.letter-paper-v48[data-letter-kop-space="1"] > p,
.letter-paper-v48[data-letter-kop-space="1"] > h1,
.letter-paper-v48[data-letter-kop-space="1"] > div{
    position:relative;
    z-index:3;
}
.letter-paper-v48[data-letter-kop-space="1"] .letter-head-v48,
.letter-paper-v48[data-letter-kop-space="1"] .letter-blue-sidebar-v48,
.letter-paper-v48[data-letter-kop-space="1"] .letter-body-v48{
    position:absolute;
}
/* v20.92 - Header toolbar Space Kop live: pastikan ruang kop benar-benar terasa di preview semua template. */
.letter-paper-v48[data-letter-kop-space="1"].formal-letter-v48:not(.letter-holiday-pdf-v88){
    padding-top:var(--letter-formal-pad-y,54px)!important;
}
.letter-paper-v48[data-letter-kop-space="1"] .sample-doc-v78{
    margin-top:0!important;
}
.letter-kop-toolbar-toggle{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:38px;
    padding:0 12px;
    border:1px solid #94a3b8;
    border-radius:12px;
    background:#fff;
    color:#0f172a;
    font-size:12px;
    font-weight:800;
    cursor:pointer;
    user-select:none;
    white-space:nowrap;
}
.letter-kop-toolbar-toggle input{
    width:16px;
    height:16px;
    accent-color:#16a34a;
}
.letter-kop-toolbar-toggle.is-active{
    border-color:#16a34a;
    background:#f0fdf4;
    color:#166534;
}
.letter-kop-toolbar-toggle small{
    font-size:10px;
    font-weight:800;
    color:inherit;
    opacity:.82;
}
.letter-signature-toolbar-toggle input{
    accent-color:#2563eb;
}
.letter-signature-toolbar-toggle.is-active{
    border-color:#2563eb;
    background:#eff6ff;
    color:#1d4ed8;
}

/* v20.77 - Upload Kop Surat tampil hanya saat toggle Space Kop aktif.
   Jika gambar kop diupload, gambar ditempatkan di ruang kosong atas surat dan ikut export PDF. */
[data-letter-kop-upload-section][hidden]{display:none!important;}
.letter-kop-image-v77{
    position:absolute!important;
    left:var(--letter-formal-pad-x,62px)!important;
    right:var(--letter-formal-pad-x,62px)!important;
    top:0!important;
    height:var(--letter-kop-space-height,113px)!important;
    z-index:10!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    background:transparent!important;
    pointer-events:none!important;
}
.letter-kop-image-v77 img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center top!important;
}
.letter-paper-v48[data-letter-kop-space="1"] .letter-kop-image-v77{
    visibility:visible!important;
}

/* v20.85 - Placeholder transparan area kop surat + garis pemisah kop.
   Garis tidak full sampai tepi halaman: mengikuti lebar area isi surat/kop umum.
   Placeholder hanya di preview, sedangkan garis pemisah ikut preview dan PDF. */
.letter-paper-v48[data-letter-kop-space="1"]::after{
    content:"kop perusahaan • 1200 × 300 px";
    position:absolute!important;
    left:var(--letter-formal-pad-x,62px)!important;
    right:var(--letter-formal-pad-x,62px)!important;
    top:0!important;
    height:var(--letter-kop-space-height,113px)!important;
    z-index:11!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    pointer-events:none!important;
    color:rgba(15,23,42,.18)!important;
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:calc(var(--letter-body-size,14.4px) * 1.32)!important;
    font-weight:800!important;
    letter-spacing:.10em!important;
    text-align:center!important;
}
.letter-paper-v48[data-letter-kop-space="1"]::after{
    border-bottom:2px solid var(--letter-template-color,var(--letter-accent-color,#0f766e))!important;
    box-shadow:0 1px 0 rgba(15,23,42,.05)!important;
}
.letter-paper-v48[data-letter-kop-space="1"] .letter-kop-image-v77::after{
    content:"";
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    border-bottom:2px solid var(--letter-template-color,var(--letter-accent-color,#0f766e))!important;
    box-shadow:0 1px 0 rgba(15,23,42,.05)!important;
    z-index:12!important;
    pointer-events:none!important;
}
.letter-paper-v48[data-letter-kop-space="1"] .letter-kop-image-v77 + .sample-doc-v78,
.letter-paper-v48[data-letter-kop-space="1"] .sample-doc-v78{
    position:relative!important;
    z-index:3!important;
}
.letter-download-render-stage .letter-kop-image-v77,
.letter-export-stage .letter-kop-image-v77,
.letter-preview-stage .letter-kop-image-v77{
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
}

.letter-download-render-stage .sample-kop-placeholder-text-v81,
.letter-export-stage .sample-kop-placeholder-text-v81,
.letter-download-render-stage .letter-paper-v48[data-letter-kop-space="1"]::after,
.letter-export-stage .letter-paper-v48[data-letter-kop-space="1"]::after{
    display:none!important;
    content:""!important;
    opacity:0!important;
    visibility:hidden!important;
}

/* v20.78 - Template surat dari file upload: isi dan desain ditiru secara generik,
   semua logo, nama perusahaan asli, nama orang, nomor identitas, alamat, HP, dan tanda tangan sumber diganti placeholder. */
.letter-sample-v78{
    padding:var(--letter-formal-pad-y,54px) var(--letter-formal-pad-x,62px)!important;
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:var(--letter-body-size,14.4px)!important;
    line-height:1.38!important;
    color:var(--letter-body-color,#111)!important;
}
.letter-sample-v78 h1,
.letter-sample-v78 h2,
.letter-sample-v78 h3,
.letter-sample-v78 h4{
    font-family:var(--letter-font,"Times New Roman")!important;
    color:var(--letter-body-color,#111)!important;
    margin:0!important;
}
.letter-sample-v78 h1{
    text-align:center!important;
    text-decoration:none!important;
    font-size:calc(var(--letter-body-size,14.4px) * 1.45)!important;
    line-height:1.08!important;
    font-weight:700!important;
    margin-bottom:4px!important;
}
.letter-sample-v78 h2{
    text-align:center!important;
    font-size:calc(var(--letter-body-size,14.4px) * 1.1)!important;
    line-height:1.1!important;
}
.letter-sample-v78 h3{
    text-align:center!important;
    font-size:calc(var(--letter-body-size,14.4px) * 1.05)!important;
    line-height:1.1!important;
    margin-bottom:12px!important;
}
.letter-sample-v78 h4{
    font-size:calc(var(--letter-body-size,14.4px) * 1.04)!important;
    text-decoration:underline!important;
    border-bottom:1px solid #444!important;
    padding-bottom:4px!important;
    margin:16px 0 8px!important;
}
.letter-sample-v78 p,
.letter-sample-v78 li,
.letter-sample-v78 td,
.letter-sample-v78 th,
.letter-sample-v78 div,
.letter-sample-v78 span{
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:var(--letter-body-size,14.4px)!important;
    color:var(--letter-body-color,#111)!important;
}
.letter-sample-v78 p{margin:0 0 9px!important;line-height:1.38!important;text-align:justify!important;}
.letter-sample-v78 .right{text-align:right!important;}
.sample-doc-v78{position:relative!important;z-index:3!important;}
.sample-letterhead-v78{
    display:flex!important;
    align-items:center!important;
    gap:16px!important;
    min-height:78px!important;
    margin-bottom:18px!important;
    padding-bottom:10px!important;
    border-bottom:3px solid var(--letter-template-color,#174a86)!important;
}
.sample-letterhead-kop-placeholder-v81{
    justify-content:center!important;
    min-height:92px!important;
    border-bottom-color:var(--letter-template-color,#174a86)!important;
    background:transparent!important;
}
.sample-kop-placeholder-text-v81{
    display:block!important;
    color:rgba(15,23,42,.16)!important;
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:calc(var(--letter-body-size,14.4px) * 1.32)!important;
    font-weight:800!important;
    letter-spacing:.10em!important;
    text-align:center!important;
    user-select:none!important;
}
.sample-letterhead-logo-v78{
    width:96px!important;
    height:54px!important;
    border:2px solid var(--letter-template-color,#174a86)!important;
    border-radius:8px!important;
    background:linear-gradient(135deg,rgba(15,76,129,.10),rgba(15,118,110,.06))!important;
    position:relative!important;
}
.sample-letterhead-logo-v78::after{
    content:"";
    position:absolute!important;
    inset:12px!important;
    border:2px solid var(--letter-template-color,#174a86)!important;
    border-left-width:7px!important;
    border-radius:3px!important;
    opacity:.35!important;
}
.sample-letterhead-v78 strong{
    font-size:calc(var(--letter-body-size,14.4px) * 1.35)!important;
    letter-spacing:.02em!important;
    color:var(--letter-template-color,#174a86)!important;
}
.sample-letterhead-v78 p{margin:1px 0!important;text-align:left!important;font-size:calc(var(--letter-body-size,14.4px) * .92)!important;line-height:1.12!important;}
.sample-letter-no-v78{float:right!important;text-align:left!important;min-width:210px!important;margin:0 0 12px 18px!important;line-height:1.35!important;}
.sample-to-v78{clear:both!important;margin:8px 0 14px!important;}
.sample-to-v78 p{margin:0!important;text-align:left!important;}
.sample-numbered-v78,
.sample-bullets-v78{margin:6px 0 12px 22px!important;padding:0!important;}
.sample-numbered-v78 li,
.sample-bullets-v78 li{margin:0 0 7px!important;text-align:justify!important;line-height:1.34!important;}
.sample-center-v78{text-align:center!important;}
.sample-sign-row-v78{display:flex!important;justify-content:flex-start!important;margin-top:18px!important;gap:36px!important;}
.sample-sign-row-v78 > div{min-width:230px!important;}
.sample-sign-row-v78 p{margin:0 0 2px!important;text-align:left!important;}
.sample-tembusan-v78{margin-top:12px!important;text-align:left!important;}
.sample-meta-table-v78{width:100%!important;border-collapse:collapse!important;margin:6px 0 16px!important;}
.sample-meta-table-v78 th{width:180px!important;text-align:left!important;font-weight:700!important;padding:2px 8px 2px 0!important;vertical-align:top!important;}
.sample-meta-table-v78 td{padding:2px 0!important;vertical-align:top!important;}
.sample-meta-table-v78 th::after{content:":";float:right;padding-right:4px;}
.sample-ornament-green-v78{padding-top:38px!important;padding-bottom:46px!important;}
.sample-ornament-green-v78::before,
.sample-ornament-green-v78::after{
    content:"";
    position:absolute!important;
    left:0!important;
    right:0!important;
    height:22px!important;
    background:linear-gradient(90deg,#0f766e,#22c55e,#0f766e)!important;
    opacity:.88!important;
    z-index:1!important;
}
.sample-ornament-green-v78::before{top:0!important;border-bottom-left-radius:55% 18px!important;border-bottom-right-radius:55% 18px!important;}
.sample-ornament-green-v78::after{bottom:0!important;border-top-left-radius:55% 18px!important;border-top-right-radius:55% 18px!important;}
.sample-doc-commitment-v78 h1{margin-top:18px!important;}
.sample-doc-health-v78{padding:34px 20px!important;}
.sample-doc-health-v78 h1{text-decoration:underline!important;margin-bottom:4px!important;}
.sample-health-table-v78{border-collapse:collapse!important;width:78%!important;margin:18px 0 18px 20px!important;}
.sample-health-table-v78 th{width:210px!important;background:#f3f4f6!important;text-align:left!important;padding:7px 10px!important;font-weight:700!important;}
.sample-health-table-v78 td{padding:7px 9px!important;background:#fafafa!important;}
.sample-health-result-v78{
    width:86%!important;
    margin:18px auto!important;
    padding:16px!important;
    text-align:center!important;
    border:2px solid #1d4ed8!important;
    background:#eff6ff!important;
    color:#1e3a8a!important;
    font-weight:700!important;
    letter-spacing:.02em!important;
    font-size:calc(var(--letter-body-size,14.4px) * 1.2)!important;
}
.sample-health-sign-v78{width:260px!important;margin:30px 0 0 auto!important;text-align:center!important;}
.sample-health-sign-v78 p{text-align:center!important;margin:0 0 4px!important;}
.sample-doc-exit-v78 .sample-letterhead-v78{min-height:64px!important;margin-bottom:8px!important;}
.sample-doc-exit-v78 h1{text-decoration:none!important;margin-bottom:0!important;}
.sample-doc-exit-v78 h2{font-weight:700!important;margin-top:4px!important;}
.sample-exit-header-table-v78,
.sample-form-table-v78,
.sample-check-table-v78,
.sample-asset-table-v78,
.sample-finance-table-v78,
.sample-sign-table-v78{
    width:100%!important;
    border-collapse:collapse!important;
    margin:8px 0 12px!important;
}
.sample-exit-header-table-v78 th,
.sample-form-table-v78 th,
.sample-check-table-v78 th,
.sample-asset-table-v78 th,
.sample-finance-table-v78 th,
.sample-sign-table-v78 th{
    background:#e5e5e5!important;
    font-weight:700!important;
    text-align:left!important;
}
.sample-exit-header-table-v78 th,
.sample-exit-header-table-v78 td,
.sample-form-table-v78 th,
.sample-form-table-v78 td,
.sample-check-table-v78 th,
.sample-check-table-v78 td,
.sample-asset-table-v78 th,
.sample-asset-table-v78 td,
.sample-finance-table-v78 th,
.sample-finance-table-v78 td,
.sample-sign-table-v78 td{
    border:1px solid #777!important;
    padding:7px 8px!important;
    vertical-align:top!important;
    line-height:1.23!important;
    font-size:calc(var(--letter-body-size,14.4px) * .82)!important;
}
.sample-check-table-v78 th,
.sample-asset-table-v78 th,
.sample-finance-table-v78 th{text-align:center!important;}
.sample-check-table-v78 td:first-child,
.sample-asset-table-v78 td:first-child,
.sample-finance-table-v78 td:first-child{text-align:center!important;width:38px!important;}
.sample-note-box-v78{border:1px solid #777!important;background:#f4f4f4!important;padding:9px 12px!important;margin:10px 0 16px!important;}
.sample-note-box-v78 strong{display:block!important;margin-bottom:4px!important;}
.sample-note-box-v78 ul{margin:0 0 0 18px!important;padding:0!important;}
.sample-note-box-v78 li{margin-bottom:3px!important;font-size:calc(var(--letter-body-size,14.4px) * .82)!important;line-height:1.2!important;}
.sample-doc-exit-v78 p{font-size:calc(var(--letter-body-size,14.4px) * .90)!important;line-height:1.28!important;}
.sample-doc-company-v78 p,
.sample-doc-holiday-v78 p,
.sample-doc-commitment-v78 p{line-height:1.38!important;}
.formal-letter-v48.letter-template-company-staff-assistance-request,
.formal-letter-v48.letter-template-company-holiday-announcement,
.formal-letter-v48.letter-template-employee-exit-clearance,
.formal-letter-v48.letter-template-external-party-commitment,
.formal-letter-v48.letter-template-medical-health-certificate{
    border-top:0!important;
    border-left:0!important;
    box-shadow:0 1px 0 #fff,0 0 0 1px #a3a3a3!important;
    background:#fff!important;
}


/* v20.79 - Setting Layout Surat: ukuran spasi kop hanya muncul saat Space Kop aktif. */
[data-letter-kop-size-control][hidden]{
    display:none!important;
}

/* v20.80 - Page 2+ surat bersidebar hanya melanjutkan teks.
   Sidebar/contact panel, header nama/foto, dan blok biru tidak diteruskan ke halaman lanjutan. */
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-blue-sidebar-v48,
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-continuation-sidebar-placeholder,
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-head-v48{
    display:none!important;
}
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-body-v48{
    position:absolute!important;
    left:var(--letter-formal-pad-x,62px)!important;
    top:var(--letter-formal-pad-y,54px)!important;
    width:calc(var(--letter-page-w,816px) - (var(--letter-formal-pad-x,62px) * 2))!important;
    max-width:calc(var(--letter-page-w,816px) - (var(--letter-formal-pad-x,62px) * 2))!important;
    transform:none!important;
    overflow:visible!important;
    max-height:none!important;
}
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-body-v48,
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-body-v48 p,
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-body-v48 div,
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-body-v48 span{
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:calc(var(--letter-body-size,14.4px) * var(--letter-onepage-fit-scale,1))!important;
    color:var(--letter-body-color,#111111)!important;
    line-height:1.35!important;
}
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-paragraph-v48{
    text-indent:calc(13px * var(--letter-pdf-parity-scale,1))!important;
    margin-bottom:calc(8px * var(--letter-pdf-parity-scale,1))!important;
}
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .closing-v48{
    margin-top:calc(8px * var(--letter-pdf-parity-scale,1))!important;
}

/* v20.83 - Lanjutan Page 2 untuk surat bersidebar mengikuti kolom isi Page 1.
   Page 2 tetap tanpa sidebar/header, tetapi posisi teks tidak mulai dari baris atas kertas.
   Ini mengikuti konsep multipage CV: halaman lanjutan tetap memakai area konten, bukan top-edge page. */
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-body-v48{
    left:var(--letter-body-left,228px)!important;
    top:var(--letter-content-top,183px)!important;
    width:var(--letter-body-width,307px)!important;
    max-width:var(--letter-body-width,307px)!important;
    padding-top:0!important;
}
.letter-sidebar-layout-v48[data-letter-continuation-page="1"] .letter-continuation-body-text-only{
    left:var(--letter-body-left,228px)!important;
    top:var(--letter-content-top,183px)!important;
    width:var(--letter-body-width,307px)!important;
    max-width:var(--letter-body-width,307px)!important;
}


/* v20.82 - Audit jenis template surat + format upload.
   Template hasil upload dibuat lebih dekat ke file sumber: font formal hitam, spasi rapi,
   header/kop sumber menjadi placeholder transparan preview-only dan hilang saat PDF. */
.sample-upload-identic-v82{
    color:#111!important;
    font-family:var(--letter-font,"Times New Roman")!important;
    letter-spacing:0!important;
}
.sample-upload-identic-v82 p,
.sample-upload-identic-v82 li,
.sample-upload-identic-v82 td,
.sample-upload-identic-v82 th,
.sample-upload-identic-v82 div,
.sample-upload-identic-v82 span{
    color:#111!important;
    font-family:var(--letter-font,"Times New Roman")!important;
}
.sample-left-v82{
    text-align:left!important;
}
.sample-doc-holiday-v78{
    padding-top:0!important;
}
.sample-doc-holiday-v78 .sample-letterhead-v78{
    min-height:92px!important;
    margin-bottom:22px!important;
    border-bottom:0!important;
}
.sample-doc-holiday-v78 p{
    text-align:left!important;
    margin-bottom:12px!important;
    line-height:1.34!important;
}
.sample-doc-holiday-v78 .right{
    text-align:right!important;
}
.sample-doc-holiday-v78 .sample-bullets-v78{
    margin-left:22px!important;
    margin-bottom:14px!important;
}
.sample-doc-holiday-v78 .sample-bullets-v78 li{
    margin-bottom:5px!important;
    text-align:left!important;
}
.sample-doc-company-v78 .sample-letterhead-v78,
.sample-doc-exit-v78 .sample-letterhead-v78,
.sample-doc-commitment-v78 .sample-letterhead-v78{
    border-bottom:0!important;
}
.sample-doc-commitment-v78 .sample-letterhead-v78{
    min-height:74px!important;
    margin-bottom:12px!important;
}
.sample-doc-commitment-v78 h1{
    margin-top:4px!important;
}
.sample-doc-health-v78 h1{
    text-decoration:underline!important;
}
.letter-download-render-stage .sample-upload-identic-v82 .sample-letterhead-kop-placeholder-v81,
.letter-export-stage .sample-upload-identic-v82 .sample-letterhead-kop-placeholder-v81{
    min-height:0!important;
    height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
}


/* v20.87 - Template surat selain Surat Lamaran Pekerjaan dibuat text-only.
   Desain dekoratif, warna aksen, kop bawaan, ornamen, panel, box, dan background dihapus.
   Struktur tabel administratif tetap dipertahankan sebagai bagian dari isi/form. */
.letter-sample-text-only-v87{
    border:0!important;
    border-top:0!important;
    border-left:0!important;
    box-shadow:0 1px 0 #fff,0 0 0 1px rgba(0,0,0,.10)!important;
    background:#fff!important;
    color:#111!important;
    font-family:var(--letter-font,"Times New Roman")!important;
}
.letter-sample-text-only-v87.sample-ornament-green-v78::before,
.letter-sample-text-only-v87.sample-ornament-green-v78::after,
.letter-sample-text-only-v87 .sample-letterhead-v78,
.letter-sample-text-only-v87 .sample-letterhead-kop-placeholder-v81,
.letter-sample-text-only-v87 .sample-letterhead-logo-v78{
    display:none!important;
    content:""!important;
    min-height:0!important;
    height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    overflow:hidden!important;
}
.letter-sample-text-only-v87,
.letter-sample-text-only-v87 *{
    color:#111!important;
    text-shadow:none!important;
    box-shadow:none!important;
}
.letter-sample-text-only-v87 h1,
.letter-sample-text-only-v87 h2,
.letter-sample-text-only-v87 h3,
.letter-sample-text-only-v87 h4{
    color:#111!important;
    border:0!important;
    background:transparent!important;
    text-decoration:none!important;
    letter-spacing:0!important;
}
.letter-sample-text-only-v87 h1{
    margin-top:0!important;
    margin-bottom:8px!important;
}
.letter-sample-text-only-v87 h2,
.letter-sample-text-only-v87 h3{
    margin-top:0!important;
    margin-bottom:6px!important;
}
.letter-sample-text-only-v87 h4{
    margin:16px 0 8px!important;
    padding:0!important;
}
.letter-sample-text-only-v87 .sample-doc-v78,
.letter-sample-text-only-v87 .sample-doc-health-v78,
.letter-sample-text-only-v87 .sample-ornament-green-v78,
.letter-sample-text-only-v87 .sample-note-box-v78,
.letter-sample-text-only-v87 .sample-health-result-v78{
    background:transparent!important;
    border:0!important;
    padding-left:0!important;
    padding-right:0!important;
    box-shadow:none!important;
}
.letter-sample-text-only-v87 .sample-note-box-v78{
    padding-top:0!important;
    padding-bottom:0!important;
}
.letter-sample-text-only-v87 .sample-health-result-v78{
    width:auto!important;
    margin:14px 0!important;
    padding:0!important;
    text-align:center!important;
    font-weight:700!important;
    letter-spacing:0!important;
}
.letter-sample-text-only-v87 table,
.letter-sample-text-only-v87 th,
.letter-sample-text-only-v87 td{
    background:transparent!important;
}
.letter-sample-text-only-v87 .sample-exit-header-table-v78 th,
.letter-sample-text-only-v87 .sample-form-table-v78 th,
.letter-sample-text-only-v87 .sample-check-table-v78 th,
.letter-sample-text-only-v87 .sample-asset-table-v78 th,
.letter-sample-text-only-v87 .sample-finance-table-v78 th,
.letter-sample-text-only-v87 .sample-sign-table-v78 th{
    background:transparent!important;
}
.letter-sample-text-only-v87 .sample-health-table-v78 th,
.letter-sample-text-only-v87 .sample-health-table-v78 td{
    background:transparent!important;
}


/* v21.05 - Watermark global surat dari Setting Layout Surat.
   Dibuat benar-benar background/non-flow supaya mode Vertikal tidak dihitung pagination
   dan tidak mendorong isi surat ke PAGE 2. */
.letter-paper-v48 > .letter-global-watermark-v103{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    transform:none!important;
    transform-origin:center center!important;
    z-index:1!important;
    pointer-events:none!important;
    overflow:hidden!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    user-select:none!important;
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
    contain:paint!important;
}
.letter-paper-v48 > .letter-global-watermark-v103 span{
    display:block!important;
    min-width:145%!important;
    transform:rotate(var(--letter-watermark-rotate,-52deg))!important;
    transform-origin:center center!important;
    color:rgba(65,91,155,.16)!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:calc(var(--letter-body-size,14.4px) * 6.0)!important;
    font-weight:900!important;
    letter-spacing:.08em!important;
    line-height:1!important;
    text-align:center!important;
    white-space:nowrap!important;
}
.letter-paper-v48 > *:not(.letter-global-watermark-v103):not(.letter-kop-image-v77){
    z-index:3;
}
.letter-staff-assist-pdf-v94 .staff-assist-watermark-v94{
    display:none!important;
    content:""!important;
    opacity:0!important;
    visibility:hidden!important;
}

/* v20.94 - Khusus Surat Permintaan Tenaga Bantu Perusahaan:
   desain dibuat identik gaya PDF upload: kotak tebal, label kop kecil,
   format metadata/perihal/nomor/signature. Identitas asli diganti placeholder netral.
   v21.03: watermark bawaan dihapus dan diganti watermark global dari Setting Layout Surat. */
.letter-staff-assist-pdf-v94{
    position:relative!important;
    padding:0!important;
    overflow:hidden!important;
    border:0!important;
    background:#fff!important;
    box-shadow:0 1px 0 #fff,0 0 0 1px rgba(0,0,0,.08)!important;
    font-family:Arial, Helvetica, sans-serif!important;
    --staff-body-size-v94:calc(var(--letter-body-size,14.4px) * 1.02);
}
.letter-download-render-stage .letter-staff-assist-pdf-v94,
.letter-export-stage .letter-staff-assist-pdf-v94{
    box-shadow:none!important;
}
.letter-staff-assist-pdf-v94,
.letter-staff-assist-pdf-v94 *{
    color:#111!important;
    text-shadow:none!important;
    box-sizing:border-box!important;
    font-family:Arial, Helvetica, sans-serif!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-doc-v94{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    margin:0!important;
    padding:0!important;
    background:#fff!important;
    overflow:hidden!important;
    z-index:3!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-frame-v94{
    position:absolute!important;
    left:92px!important;
    right:92px!important;
    top:96px!important;
    bottom:76px!important;
    border:4px solid #111!important;
    background:#fff!important;
    z-index:3!important;
    overflow:visible!important;
}
.letter-staff-assist-pdf-v94[data-letter-kop-space="1"] .staff-assist-frame-v94{
    top:calc(var(--letter-kop-space-height,113px) + 42px)!important;
    bottom:42px!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-tab-v94{
    position:absolute!important;
    left:44px!important;
    top:-27px!important;
    min-width:254px!important;
    height:32px!important;
    padding:6px 13px 5px!important;
    border:1.8px solid #111!important;
    background:#fff!important;
    z-index:6!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    font-family:"Arial Narrow", Arial, Helvetica, sans-serif!important;
    font-size:calc(var(--staff-body-size-v94) * .68)!important;
    line-height:1!important;
    font-weight:900!important;
    letter-spacing:-.02em!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-content-v94{
    position:relative!important;
    z-index:4!important;
    padding:26px 14px 12px 14px!important;
    font-size:var(--staff-body-size-v94)!important;
    line-height:1.20!important;
    letter-spacing:-.01em!important;
}
.letter-staff-assist-pdf-v94[data-letter-kop-space="1"] .staff-assist-content-v94{
    font-size:calc(var(--staff-body-size-v94) * .90)!important;
    line-height:1.14!important;
    padding-top:18px!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-meta-v94{
    margin:0 0 16px!important;
    width:64%!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-meta-v94 div{
    display:grid!important;
    grid-template-columns:124px 24px 1fr!important;
    column-gap:0!important;
    align-items:baseline!important;
    margin:0 0 2px!important;
    font-size:calc(var(--staff-body-size-v94) * 1.03)!important;
    line-height:1.12!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-meta-v94 span,
.letter-staff-assist-pdf-v94 .staff-assist-meta-v94 b,
.letter-staff-assist-pdf-v94 .staff-assist-meta-v94 em{
    font-style:normal!important;
    font-size:inherit!important;
    line-height:inherit!important;
    font-weight:400!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-recipient-v94{
    margin:0 0 15px!important;
    width:62%!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-recipient-v94 p{
    margin:0!important;
    padding:0!important;
    font-size:calc(var(--staff-body-size-v94) * 1.03)!important;
    line-height:1.05!important;
    text-align:left!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-recipient-v94 strong{
    font-weight:800!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-subject-v94{
    display:grid!important;
    grid-template-columns:76px 24px 1fr!important;
    margin:0 0 42px!important;
    align-items:start!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-subject-v94 span,
.letter-staff-assist-pdf-v94 .staff-assist-subject-v94 b{
    font-size:calc(var(--staff-body-size-v94) * 1.03)!important;
    line-height:1.18!important;
    font-weight:400!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-subject-v94 p{
    margin:0!important;
    padding:0!important;
    text-align:justify!important;
    font-size:calc(var(--staff-body-size-v94) * 1.03)!important;
    line-height:1.18!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-numbered-v94{
    margin:0 0 12px 0!important;
    padding:0!important;
    list-style:none!important;
    counter-reset:staffnum!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-numbered-v94 li{
    counter-increment:staffnum!important;
    position:relative!important;
    margin:0 0 13px 50px!important;
    padding:0!important;
    text-align:justify!important;
    font-size:var(--staff-body-size-v94)!important;
    line-height:1.20!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-numbered-v94 li::before{
    content:counter(staffnum) ".";
    position:absolute!important;
    left:-43px!important;
    top:0!important;
    width:28px!important;
    font-size:inherit!important;
    font-weight:400!important;
    line-height:inherit!important;
    text-align:left!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-numbered-v94 strong,
.letter-staff-assist-pdf-v94 .staff-assist-closing-v94 strong{
    font-weight:900!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-closing-v94{
    margin:0 0 13px!important;
    padding:0!important;
    text-align:justify!important;
    font-size:var(--staff-body-size-v94)!important;
    line-height:1.20!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-sign-v94{
    margin:0 0 10px!important;
    padding:0!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-sign-v94 p{
    margin:0 0 2px!important;
    padding:0!important;
    text-align:left!important;
    font-size:var(--staff-body-size-v94)!important;
    line-height:1.10!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-sign-v94 strong{
    font-weight:900!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-name-v94{
    letter-spacing:.22em!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-copy-v94{
    margin:0!important;
    padding:0!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-copy-v94 p{
    margin:0 0 2px!important;
    padding:0!important;
    font-size:calc(var(--staff-body-size-v94) * .98)!important;
    line-height:1.08!important;
    text-align:left!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-copy-v94 ul{
    margin:0 0 0 18px!important;
    padding:0!important;
    list-style:disc!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-copy-v94 li{
    margin:0!important;
    padding:0!important;
    font-size:calc(var(--staff-body-size-v94) * .98)!important;
    line-height:1.08!important;
}
.letter-staff-assist-pdf-v94 .staff-assist-copy-v94 li::marker{
    font-size:calc(var(--staff-body-size-v94) * .68)!important;
}
.letter-staff-assist-pdf-v94::before,
.letter-staff-assist-pdf-v94::after{
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
}

/* v20.88 - Khusus Surat Pemberitahuan Libur Hari Raya: desain disamakan dengan PDF contoh.
   Scope sengaja dibatasi ke .letter-holiday-pdf-v88 agar template surat lain tetap mengikuti text-only v20.87.
   v20.89: identitas/logo bawaan dihapus khusus template Hari Raya, ucapan dibuat center per baris.
   v20.90: sisa area header kosong + garis biru internal template Hari Raya dihapus total.
   v20.91: ornamen hijau atas/bawah template Hari Raya dihapus total.
   v20.92: toggle Space Kop diaktifkan lagi untuk semua template surat, termasuk Hari Raya.
   v20.93: garis/line Space Kop dipaksa tampil di atas template Hari Raya dan sample lainnya. */
.letter-holiday-pdf-v88{
    position:relative!important;
    padding:0!important;
    overflow:hidden!important;
    border:0!important;
    border-top:0!important;
    border-left:0!important;
    background:#fff!important;
    color:#111!important;
    box-shadow:0 1px 0 #fff,0 0 0 1px rgba(0,0,0,.08)!important;
    font-family:"Times New Roman", Times, serif!important;
    --holiday-body-size-v88:calc(var(--letter-body-size,14.4px) * 1.12);
}
.letter-download-render-stage .letter-holiday-pdf-v88,
.letter-export-stage .letter-holiday-pdf-v88{
    box-shadow:none!important;
}
.letter-holiday-pdf-v88 .sample-letterhead-v78,
.letter-holiday-pdf-v88 .sample-letterhead-kop-placeholder-v81,
.letter-holiday-pdf-v88 .sample-kop-placeholder-text-v81{
    display:none!important;
    content:""!important;
    opacity:0!important;
    visibility:hidden!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-doc-v88{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    background:#fff!important;
    font-family:"Times New Roman", Times, serif!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-ornament-top-v88,
.letter-holiday-pdf-v88 .holiday-pdf-ornament-bottom-v88{
    position:absolute!important;
    left:0!important;
    width:100%!important;
    object-fit:cover!important;
    object-position:center!important;
    pointer-events:none!important;
    z-index:1!important;
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-ornament-top-v88{
    top:0!important;
    height:27px!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-ornament-bottom-v88{
    bottom:0!important;
    height:19px!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-letterhead-v88{
    position:absolute!important;
    left:93px!important;
    right:93px!important;
    top:48px!important;
    height:91px!important;
    display:flex!important;
    align-items:flex-start!important;
    gap:24px!important;
    padding:0 0 11px 12px!important;
    border-bottom:4px solid #18375f!important;
    z-index:3!important;
    box-sizing:border-box!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-letterhead-empty-v89{
    display:block!important;
    padding:0!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-logo-v88{
    flex:0 0 auto!important;
    width:82px!important;
    height:82px!important;
    object-fit:contain!important;
    object-position:center!important;
    margin-top:0!important;
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-company-v88{
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    padding-top:6px!important;
    line-height:1.16!important;
    font-family:"Times New Roman", Times, serif!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-company-v88 strong{
    display:block!important;
    margin:0 0 1px!important;
    color:#4c72c8!important;
    font-family:"Times New Roman", Times, serif!important;
    font-size:calc(var(--holiday-body-size-v88) * 1.22)!important;
    font-weight:700!important;
    line-height:1.08!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-company-v88 span{
    display:block!important;
    color:#111!important;
    font-family:"Times New Roman", Times, serif!important;
    font-size:calc(var(--holiday-body-size-v88) * 1.02)!important;
    font-weight:700!important;
    line-height:1.16!important;
    white-space:nowrap!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-body-v88{
    position:absolute!important;
    left:96px!important;
    right:92px!important;
    top:88px!important;
    z-index:3!important;
    font-family:"Times New Roman", Times, serif!important;
    font-size:var(--holiday-body-size-v88)!important;
    line-height:1.16!important;
    color:#111!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-body-headerless-v90{
    top:88px!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-no-ornament-v91 .holiday-pdf-ornament-top-v88,
.letter-holiday-pdf-v88 .holiday-pdf-no-ornament-v91 .holiday-pdf-ornament-bottom-v88{
    display:none!important;
    opacity:0!important;
    visibility:hidden!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-body-no-ornament-v91{
    top:62px!important;
}
.letter-holiday-pdf-v88[data-letter-kop-space="1"] .holiday-pdf-body-no-ornament-v91{
    top:calc(62px + var(--letter-kop-space-height,0px))!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-body-v88 p,
.letter-holiday-pdf-v88 .holiday-pdf-body-v88 li,
.letter-holiday-pdf-v88 .holiday-pdf-body-v88 span,
.letter-holiday-pdf-v88 .holiday-pdf-body-v88 b,
.letter-holiday-pdf-v88 .holiday-pdf-body-v88 em,
.letter-holiday-pdf-v88 .holiday-pdf-body-v88 strong{
    font-family:"Times New Roman", Times, serif!important;
    font-size:var(--holiday-body-size-v88)!important;
    color:#111!important;
    line-height:1.16!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-body-v88 p{
    margin:0 0 23px!important;
    text-align:left!important;
    font-weight:400!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-date-v88{
    margin-bottom:24px!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-subject-v88{
    margin-bottom:27px!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-body-v88 p:nth-of-type(3){
    margin-bottom:24px!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-schedule-v88{
    list-style:disc!important;
    margin:0 0 27px 55px!important;
    padding:0!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-schedule-v88 li{
    margin:0 0 7px!important;
    padding-left:0!important;
    display:list-item!important;
    font-style:normal!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-schedule-v88 li::marker{
    font-size:calc(var(--holiday-body-size-v88) * .78)!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-schedule-v88 span{
    display:inline-block!important;
    width:97px!important;
    font-weight:700!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-schedule-v88 b{
    display:inline-block!important;
    width:15px!important;
    font-weight:700!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-schedule-v88 em{
    font-style:normal!important;
    font-weight:400!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-greeting-v88{
    text-align:center!important;
    margin:4px 0 51px!important;
    line-height:1.16!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-greeting-v88 strong{
    font-weight:700!important;
    line-height:1.16!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-greeting-v88 strong span{
    display:block!important;
    width:100%!important;
    text-align:center!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-sign-v88{
    margin-top:0!important;
    width:310px!important;
    font-family:"Times New Roman", Times, serif!important;
    color:#111!important;
}
.letter-holiday-pdf-v88 .holiday-pdf-sign-v88 p{
    margin:0 0 2px!important;
    text-align:left!important;
    line-height:1.05!important;
}

/* v20.96 - Ruang TTD elektronik pada template Surat Permintaan Tenaga Bantu.
   Area ini tetap ada walaupun user belum upload gambar tanda tangan, sehingga posisi nama tidak menempel ke penutup. */
.letter-staff-assist-pdf-v94 .staff-assist-signature-space-v96{
    width:235px!important;
    height:70px!important;
    margin:7px 0 5px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    overflow:visible!important;
    background:transparent!important;
}
.letter-staff-assist-pdf-v94[data-letter-kop-space="1"] .staff-assist-signature-space-v96{
    height:58px!important;
    margin:5px 0 4px!important;
}
.letter-staff-assist-pdf-v94 .staff-electronic-signature-v96,
.letter-electronic-signature-v96{
    display:block!important;
    max-width:210px!important;
    max-height:66px!important;
    width:auto!important;
    height:auto!important;
    object-fit:contain!important;
    object-position:left center!important;
    mix-blend-mode:multiply;
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
}
.letter-download-render-stage .letter-staff-assist-pdf-v94 .staff-electronic-signature-v96,
.letter-export-stage .letter-staff-assist-pdf-v94 .staff-electronic-signature-v96{
    mix-blend-mode:normal!important;
}


/* v20.97 - Kotak buat/gambar TTD elektronik di panel kiri Input Surat. */
.letter-signature-draw-box-v97{
    margin-top:12px!important;
    padding:12px!important;
    border:1px solid #dbeafe!important;
    border-radius:16px!important;
    background:#f8fbff!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.8)!important;
}
.letter-signature-draw-head-v97{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    margin-bottom:8px!important;
    color:#0f172a!important;
}
.letter-signature-draw-head-v97 strong{
    font-size:13px!important;
    font-weight:950!important;
}
.letter-signature-draw-head-v97 span{
    font-size:11px!important;
    font-weight:800!important;
    color:#64748b!important;
}
.letter-signature-canvas-v97{
    display:block!important;
    width:100%!important;
    height:138px!important;
    border:2px dashed #94a3b8!important;
    border-radius:14px!important;
    background:linear-gradient(180deg,#fff,#fdfdfd)!important;
    cursor:crosshair!important;
    touch-action:none!important;
}
.letter-signature-draw-actions-v97{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    margin-top:10px!important;
}


/* v21.00 - Kotak/ruang TTD elektronik aktif untuk template lamaran, Hari Raya, Surat Sehat, Komitmen, dan sample surat lain. */
.letter-signature-space-v100,
.sample-signature-space-v100,
.holiday-signature-space-v100{
    width:235px!important;
    height:72px!important;
    margin:8px 0 7px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    overflow:visible!important;
    background:transparent!important;
}
.closing-with-ttd-v100 .letter-signature-space-v100{
    width:260px!important;
    height:82px!important;
    margin:10px 0 8px!important;
}
.holiday-pdf-sign-v88 .holiday-signature-space-v100{
    height:78px!important;
    margin:8px 0 6px!important;
}
.sample-sign-row-with-ttd-v100 .sample-signature-space-v100,
.sample-health-sign-with-ttd-v100 .sample-signature-space-v100{
    height:82px!important;
    margin:10px 0 8px!important;
}
.holiday-electronic-signature-v100,
.letter-signature-space-v100 .letter-electronic-signature-v96,
.sample-signature-space-v100 .letter-electronic-signature-v96{
    display:block!important;
    max-width:220px!important;
    max-height:76px!important;
    width:auto!important;
    height:auto!important;
    object-fit:contain!important;
    object-position:left center!important;
    mix-blend-mode:multiply;
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
}
.letter-download-render-stage .holiday-electronic-signature-v100,
.letter-export-stage .holiday-electronic-signature-v100,
.letter-download-render-stage .letter-signature-space-v100 .letter-electronic-signature-v96,
.letter-export-stage .letter-signature-space-v100 .letter-electronic-signature-v96,
.letter-download-render-stage .sample-signature-space-v100 .letter-electronic-signature-v96,
.letter-export-stage .sample-signature-space-v100 .letter-electronic-signature-v96{
    mix-blend-mode:normal!important;
}

/* v21.00 - Kotak indikator TTD hanya di preview/editor; disembunyikan saat export/PDF supaya surat tetap formal. */
.letter-preview-stage .letter-signature-space-v100:empty,
.letter-preview-stage .sample-signature-space-v100:empty,
.letter-preview-stage .holiday-signature-space-v100:empty{
    border:1.4px dashed rgba(37,99,235,.45)!important;
    border-radius:8px!important;
    background:rgba(37,99,235,.035)!important;
    position:relative!important;
}
.letter-preview-stage .letter-signature-space-v100:empty::after,
.letter-preview-stage .sample-signature-space-v100:empty::after,
.letter-preview-stage .holiday-signature-space-v100:empty::after{
    content:"AREA TTD ELEKTRONIK"!important;
    position:absolute!important;
    inset:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:rgba(37,99,235,.42)!important;
    font-family:Arial, sans-serif!important;
    font-size:9px!important;
    font-weight:800!important;
    letter-spacing:.08em!important;
}


/* v21.02 - Template Cepat surat tampilkan jenis surat dan arahkan buat baru jika jenis tidak sama. */
.quickdb-letter-type{
    display:block!important;
    margin-top:4px!important;
    color:#1e3a8a!important;
    font-weight:700!important;
}
.quickdb-letter-type b{
    font-weight:900!important;
}
.template-source-compatible-note{
    display:inline-flex!important;
    align-items:center!important;
    min-height:40px!important;
    padding:8px 12px!important;
    border:1px dashed #93c5fd!important;
    border-radius:12px!important;
    background:#eff6ff!important;
    color:#1e3a8a!important;
    font-size:12px!important;
    font-weight:800!important;
}

/* v21.04 - Fix khusus Surat Permintaan Tenaga Bantu Perusahaan.
   Saat Space Kop ON, area kop/garis tidak boleh melebar sampai hampir penuh halaman.
   Lebar area kop disamakan dengan frame surat, dan jarak frame dibuat lebih rapat. */
.letter-staff-assist-pdf-v94[data-letter-kop-space="1"]::before,
.letter-staff-assist-pdf-v94[data-letter-kop-space="1"]::after,
.letter-staff-assist-pdf-v94[data-letter-kop-space="1"] .letter-kop-image-v77{
    left:92px!important;
    right:92px!important;
}
.letter-staff-assist-pdf-v94[data-letter-kop-space="1"]::before,
.letter-staff-assist-pdf-v94[data-letter-kop-space="1"]::after,
.letter-staff-assist-pdf-v94[data-letter-kop-space="1"] .letter-kop-image-v77::after{
    border-bottom-color:#111!important;
}
.letter-staff-assist-pdf-v94[data-letter-kop-space="1"] .staff-assist-frame-v94{
    top:calc(var(--letter-kop-space-height,113px) + 30px)!important;
    bottom:48px!important;
}
.letter-staff-assist-pdf-v94[data-letter-kop-space="1"] .staff-assist-content-v94{
    padding-top:16px!important;
}

/* v21.07 - Area TTD Elektronik bisa ON/OFF dari Setting Layout Surat + toolbar Preview Surat.
   Saat OFF area tanda tangan disembunyikan total agar tidak menyisakan kotak/spasi di PDF. */
.letter-paper-v48[data-letter-signature-space="0"] .staff-assist-signature-space-v96,
.letter-paper-v48[data-letter-signature-space="0"] .letter-signature-space-v100,
.letter-paper-v48[data-letter-signature-space="0"] .sample-signature-space-v100,
.letter-paper-v48[data-letter-signature-space="0"] .holiday-signature-space-v100{
    display:none!important;
    width:0!important;
    height:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    overflow:hidden!important;
}
.letter-paper-v48[data-letter-signature-space="0"] .staff-electronic-signature-v96,
.letter-paper-v48[data-letter-signature-space="0"] .letter-electronic-signature-v96,
.letter-paper-v48[data-letter-signature-space="0"] .holiday-electronic-signature-v100{
    display:none!important;
}
.letter-preview-stage .letter-paper-v48[data-letter-signature-space="1"] .staff-assist-signature-space-v96:empty{
    border:1.4px dashed rgba(37,99,235,.45)!important;
    border-radius:8px!important;
    background:rgba(37,99,235,.035)!important;
    position:relative!important;
}
.letter-preview-stage .letter-paper-v48[data-letter-signature-space="1"] .staff-assist-signature-space-v96:empty::after{
    content:"AREA TTD ELEKTRONIK"!important;
    position:absolute!important;
    inset:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:rgba(37,99,235,.42)!important;
    font-family:Arial, sans-serif!important;
    font-size:9px!important;
    font-weight:800!important;
    letter-spacing:.08em!important;
}

/* v21.08 - Fix khusus Surat Permintaan Tenaga Bantu Perusahaan saat Space Kop ON.
   Padding global formal-letter sebelumnya ikut menurunkan template ini, sehingga kotak utama jauh dari garis kop.
   Scope dibatasi hanya ke template company_staff_assistance_request agar template surat lain tidak berubah. */
.letter-paper-v48.formal-letter-v48.letter-sample-v78.letter-staff-assist-pdf-v94[data-letter-kop-space="1"],
.letter-paper-v48.formal-letter-v48.letter-sample-v78.letter-staff-assist-pdf-v94[data-letter-kop-space="0"]{
    padding:0!important;
}
.letter-paper-v48.formal-letter-v48.letter-sample-v78.letter-staff-assist-pdf-v94[data-letter-kop-space="1"] .staff-assist-doc-v94{
    inset:0!important;
    top:0!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
}
.letter-paper-v48.formal-letter-v48.letter-sample-v78.letter-staff-assist-pdf-v94[data-letter-kop-space="1"] .staff-assist-frame-v94{
    top:calc(var(--letter-kop-space-height,113px) + 30px)!important;
    bottom:48px!important;
}
.letter-paper-v48.formal-letter-v48.letter-sample-v78.letter-staff-assist-pdf-v94[data-letter-kop-space="1"] .staff-assist-content-v94{
    padding-top:16px!important;
}

/* v21.09 - Formulir Penyelesaian Administrasi Karyawan Keluar.
   Mengikuti acuan Exit Clearance: tabel abu-abu, garis section, layout clearance, dan footer admin.
   Identitas asli, logo/kop/alamat perusahaan, tanda tangan asli, nama orang, nomor identitas, dan nomor HP tidak ditampilkan. */
.formal-letter-v48.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109{
    padding:42px 62px 56px!important;
    --letter-template-color:#0b2f6b!important;
    overflow:hidden!important;
}
.formal-letter-v48.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109::before{
    content:"";
    position:absolute!important;
    left:-8px!important;
    top:0!important;
    width:calc(100% + 16px)!important;
    height:14px!important;
    background:linear-gradient(90deg,#65f5ab 0%,#149a86 38%,#048878 70%,#5af2a7 100%)!important;
    border-bottom-left-radius:55% 12px!important;
    border-bottom-right-radius:55% 12px!important;
    z-index:1!important;
    pointer-events:none!important;
}
.formal-letter-v48.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109::after{
    content:"";
    position:absolute!important;
    left:-8px!important;
    bottom:0!important;
    width:calc(100% + 16px)!important;
    height:8px!important;
    background:linear-gradient(90deg,#74f5aa 0%,#199067 40%,#167a50 72%,#6bf2a8 100%)!important;
    border-top-left-radius:55% 10px!important;
    border-top-right-radius:55% 10px!important;
    z-index:1!important;
    pointer-events:none!important;
}
.letter-paper-v48[data-letter-kop-space="1"].letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109{
    padding-top:calc(var(--letter-kop-space-height,113px) + 12px)!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-doc-v109{
    position:relative!important;
    z-index:3!important;
    font-family:"Times New Roman",Times,serif!important;
    color:#111!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-blue-rule-v109{
    height:0!important;
    border-top:4px solid #0b2f6b!important;
    margin:22px -8px 12px!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-title-v109{
    text-align:center!important;
    margin:0 0 8px!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-title-v109 h2,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-title-v109 h1,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-title-v109 h3{
    margin:0!important;
    padding:0!important;
    border:0!important;
    text-align:center!important;
    text-decoration:none!important;
    color:#111!important;
    font-family:"Times New Roman",Times,serif!important;
    line-height:1.04!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-title-v109 h2{
    font-size:calc(var(--letter-body-size,14.4px) * 1.18)!important;
    font-weight:700!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-title-v109 h1{
    font-size:calc(var(--letter-body-size,14.4px) * 1.75)!important;
    font-weight:800!important;
    letter-spacing:.01em!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-title-v109 h3{
    font-size:calc(var(--letter-body-size,14.4px) * 1.05)!important;
    font-weight:700!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 p{
    margin:0 0 12px!important;
    text-align:justify!important;
    line-height:1.28!important;
    font-size:calc(var(--letter-body-size,14.4px) * .92)!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 h4{
    margin:18px 0 8px!important;
    padding:0 0 3px!important;
    border-bottom:1.5px solid #555!important;
    text-decoration:none!important;
    text-align:left!important;
    font-size:calc(var(--letter-body-size,14.4px) * 1.12)!important;
    font-weight:800!important;
    line-height:1.08!important;
    color:#222!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-exit-header-table-v78,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-form-table-v78,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-check-table-v78,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-asset-table-v78,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-finance-table-v78,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-sign-table-v78{
    width:100%!important;
    border-collapse:collapse!important;
    margin:8px 0 13px!important;
    table-layout:fixed!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 th,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 td{
    border:1px solid #777!important;
    padding:7px 9px!important;
    vertical-align:top!important;
    color:#111!important;
    font-family:"Times New Roman",Times,serif!important;
    font-size:calc(var(--letter-body-size,14.4px) * .82)!important;
    line-height:1.18!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 th,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 thead th{
    background:#e6e6e6!important;
    font-weight:800!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 thead th{
    text-align:center!important;
    vertical-align:middle!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-meta-v109 th:nth-child(1),
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-meta-v109 th:nth-child(3){
    width:18%!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-meta-v109 td:nth-child(2){
    width:31%!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-meta-v109 td:nth-child(4){
    width:33%!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-note-box-v78{
    border:1.4px solid #555!important;
    background:#f1f1f1!important;
    padding:8px 10px!important;
    margin:6px 0 28px!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-note-box-v78 strong{
    display:block!important;
    margin:0 0 3px!important;
    font-size:calc(var(--letter-body-size,14.4px) * .92)!important;
    text-align:left!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-note-box-v78 ul{
    margin:0 0 0 13px!important;
    padding:0!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-note-box-v78 li{
    margin:0 0 3px!important;
    text-align:left!important;
    line-height:1.18!important;
    font-size:calc(var(--letter-body-size,14.4px) * .78)!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-identity-v109 th,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-final-v109 th,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-admin-v109 th{
    text-align:left!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-identity-v109 th:nth-child(1),
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-identity-v109 th:nth-child(3){
    width:20%!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-identity-v109 td:nth-child(2),
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-identity-v109 td:nth-child(4){
    width:30%!important;
    min-height:26px!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-check-v109 th:nth-child(1),
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-asset-v109 th:nth-child(1),
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-finance-v109 th:nth-child(1){
    width:38px!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-check-v109 th:nth-child(2){width:42%!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-check-v109 th:nth-child(3){width:82px!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-check-v109 th:nth-child(4){width:126px!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-check-v109 td:first-child,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-check-v109 td:nth-child(3),
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-asset-v109 td:first-child,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-asset-v109 td:nth-child(6),
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-finance-v109 td:first-child{
    text-align:center!important;
    vertical-align:middle!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-check-v109 tbody td{height:46px!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-asset-v109 tbody td{height:54px!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-finance-v109 tbody td{height:44px!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-asset-v109 th:nth-child(2){width:25%!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-asset-v109 th:nth-child(3){width:18%!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-asset-v109 th:nth-child(4){width:62px!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-asset-v109 th:nth-child(5){width:74px!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-asset-v109 th:nth-child(6){width:86px!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-finance-v109 th:nth-child(2){width:40%!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-finance-v109 th:nth-child(3){width:118px!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-finance-v109 th:nth-child(4){width:118px!important;}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-financial-note-v109{
    text-align:center!important;
    margin-top:-13px!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-financial-note-v109 strong,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-financial-note-v109 li{
    text-align:center!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-numbered-v78{
    margin:5px 0 14px 24px!important;
    padding:0!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-numbered-v78 li{
    margin:0 0 8px!important;
    padding-left:4px!important;
    text-align:justify!important;
    line-height:1.28!important;
    font-size:calc(var(--letter-body-size,14.4px) * .92)!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-final-v109 th{
    width:28%!important;
    vertical-align:middle!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-final-v109 tr:nth-child(3) th,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-final-v109 tr:nth-child(3) td{
    height:82px!important;
    vertical-align:middle!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-date-v109{
    text-align:right!important;
    margin-top:-4px!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-sign-v109 td{
    width:50%!important;
    height:118px!important;
    text-align:left!important;
    vertical-align:top!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-sign-v109 td strong{
    display:block!important;
    text-align:center!important;
    margin-bottom:0!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-sign-space-v109{
    height:72px!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-admin-v109{
    margin-top:48px!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-admin-v109 th{
    width:18%!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-admin-v109 td{
    width:32%!important;
}


/* v21.10 - Formulir Penyelesaian Administrasi Karyawan Keluar: teks saja, tanpa ornamen/garis atas, dan aman multipage.
   Scope hanya template employee_exit_clearance agar template surat lain tidak ikut berubah. */
.formal-letter-v48.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109{
    padding:46px 62px 56px!important;
    --letter-template-color:#111!important;
    overflow:hidden!important;
}
.formal-letter-v48.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109::before,
.formal-letter-v48.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109::after{
    content:none!important;
    display:none!important;
    height:0!important;
    background:none!important;
    border:0!important;
    box-shadow:none!important;
}
.letter-paper-v48[data-letter-kop-space="1"].letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109{
    padding-top:calc(var(--letter-kop-space-height,113px) + 30px)!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-blue-rule-v109{
    display:none!important;
    border:0!important;
    height:0!important;
    margin:0!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-title-v109{
    margin-top:0!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-doc-v109{
    margin-top:0!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 h4{
    break-after:avoid!important;
    page-break-after:avoid!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 table,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .sample-note-box-v78,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-statement-v109 li,
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-date-v109{
    break-inside:avoid!important;
    page-break-inside:avoid!important;
}


/* v21.11 - Exit Clearance: Space Kop dan TTD Elektronik aktif lagi khusus template ini.
   Ornamen/desain bawaan tetap hilang, tetapi area Space Kop global + garis kop tidak ikut terhapus. */
.formal-letter-v48.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109[data-letter-kop-space="1"]::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:var(--letter-formal-pad-x,62px)!important;
    right:var(--letter-formal-pad-x,62px)!important;
    top:0!important;
    width:auto!important;
    height:var(--letter-kop-space-height,113px)!important;
    background:#fff!important;
    border:0!important;
    border-bottom:2px solid var(--letter-template-color,#111)!important;
    border-radius:0!important;
    box-shadow:0 1px 0 rgba(15,23,42,.05)!important;
    opacity:1!important;
    visibility:visible!important;
    z-index:8!important;
    pointer-events:none!important;
}
.formal-letter-v48.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109[data-letter-kop-space="1"]::after{
    content:"kop perusahaan • 1200 × 300 px"!important;
    display:flex!important;
    position:absolute!important;
    left:var(--letter-formal-pad-x,62px)!important;
    right:var(--letter-formal-pad-x,62px)!important;
    top:0!important;
    width:auto!important;
    height:var(--letter-kop-space-height,113px)!important;
    align-items:center!important;
    justify-content:center!important;
    background:transparent!important;
    border:0!important;
    border-bottom:2px solid var(--letter-template-color,#111)!important;
    border-radius:0!important;
    box-shadow:0 1px 0 rgba(15,23,42,.05)!important;
    color:rgba(15,23,42,.18)!important;
    font-family:var(--letter-font,"Times New Roman")!important;
    font-size:calc(var(--letter-body-size,14.4px) * 1.32)!important;
    font-weight:800!important;
    letter-spacing:.10em!important;
    text-align:center!important;
    opacity:1!important;
    visibility:visible!important;
    z-index:11!important;
    pointer-events:none!important;
}
.letter-download-render-stage .formal-letter-v48.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109[data-letter-kop-space="1"]::after,
.letter-export-stage .formal-letter-v48.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109[data-letter-kop-space="1"]::after,
body.letter-download-render-body .formal-letter-v48.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109[data-letter-kop-space="1"]::after{
    content:""!important;
    display:none!important;
    opacity:0!important;
    visibility:hidden!important;
}
.letter-paper-v48[data-letter-signature-space="0"] .exit-clearance-sign-space-v109{
    display:none!important;
    width:0!important;
    height:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    overflow:hidden!important;
}
.letter-paper-v48[data-letter-signature-space="1"] .exit-clearance-sign-space-v109{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    height:72px!important;
    margin:6px 0 5px!important;
    overflow:visible!important;
    background:transparent!important;
}
.letter-paper-v48[data-letter-signature-space="1"] .exit-clearance-sign-space-v109 .letter-electronic-signature-v96{
    display:block!important;
    max-width:210px!important;
    max-height:66px!important;
    width:auto!important;
    height:auto!important;
    object-fit:contain!important;
    object-position:left center!important;
    mix-blend-mode:multiply!important;
}
.letter-preview-stage .letter-paper-v48[data-letter-signature-space="1"] .exit-clearance-sign-space-v109:empty{
    border:1.4px dashed rgba(37,99,235,.45)!important;
    border-radius:8px!important;
    background:rgba(37,99,235,.035)!important;
    position:relative!important;
}
.letter-preview-stage .letter-paper-v48[data-letter-signature-space="1"] .exit-clearance-sign-space-v109:empty::after{
    content:"AREA TTD ELEKTRONIK"!important;
    position:absolute!important;
    inset:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:rgba(37,99,235,.42)!important;
    font-family:Arial, sans-serif!important;
    font-size:9px!important;
    font-weight:800!important;
    letter-spacing:.08em!important;
    text-align:center!important;
}
.letter-download-render-stage .letter-paper-v48[data-letter-signature-space="1"] .exit-clearance-sign-space-v109:empty,
.letter-export-stage .letter-paper-v48[data-letter-signature-space="1"] .exit-clearance-sign-space-v109:empty{
    border:0!important;
    background:transparent!important;
}

/* v21.12 - Global surat multipage: kop surat hanya muncul di PAGE 1.
   Semua halaman lanjutan yang dibuat otomatis tidak membawa area kop, garis kop,
   placeholder kop, atau gambar kop upload. */
.letter-paper-v48[data-letter-continuation-page="1"]::before,
.letter-paper-v48[data-letter-continuation-page="1"]::after,
.letter-paper-v48.letter-no-kop-continuation-v112::before,
.letter-paper-v48.letter-no-kop-continuation-v112::after{
    content:none!important;
    display:none!important;
    border:0!important;
    box-shadow:none!important;
}
.letter-paper-v48[data-letter-continuation-page="1"] .letter-kop-image-v77,
.letter-paper-v48.letter-no-kop-continuation-v112 .letter-kop-image-v77{
    display:none!important;
    visibility:hidden!important;
}
.letter-paper-v48[data-letter-continuation-page="1"]{
    --letter-kop-space-enabled:0!important;
    --letter-kop-space-height:0px!important;
}

/* v21.12 - Panel kiri TTD mengikuti jumlah area tanda tangan template. */
.letter-signature-slots-v112{
    display:flex;
    flex-direction:column;
    gap:10px;
}
.letter-signature-slot-card-v112{
    border:1px solid rgba(37,99,235,.22);
    border-radius:14px;
    background:#f8fbff;
    padding:10px;
}
.letter-signature-slot-card-v112 strong{
    display:block;
    margin-bottom:6px;
    color:#0f172a;
    font-size:12px;
}
.letter-signature-slot-card-v112 .letter-photo-name{
    margin-bottom:8px;
}

/* v21.14 - Floating professional input form untuk seluruh template surat. */
.letter-builder-form--floating{display:block!important;height:100%!important}
.letter-input-preview-link{border-radius:14px!important;border:1px solid #b7cdfa!important;background:linear-gradient(180deg,#ffffff 0%,#eff6ff 100%)!important;color:#1d4ed8!important;font-weight:800!important;box-shadow:0 8px 24px rgba(37,99,235,.10)!important}
.letter-input-preview-link:hover{background:#dbeafe!important;color:#1e3a8a!important}
.letter-input-floating-modal{position:fixed;inset:0;display:none;align-items:stretch;justify-content:flex-start;padding:16px;z-index:1250}
.letter-input-floating-modal.is-open{display:flex}
body.letter-input-floating-open{overflow:hidden!important}
.letter-input-floating-modal__backdrop{position:absolute;inset:0;border:0;background:rgba(15,23,42,.42);cursor:pointer}
.letter-input-floating-modal__card{position:relative;display:flex;flex-direction:column;width:min(760px,calc(100vw - 32px));height:calc(100vh - 32px);background:#ffffff;border:1px solid #dbe7fb;border-radius:26px;box-shadow:0 30px 90px rgba(15,23,42,.28);overflow:hidden}
.letter-input-floating-modal__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 20px 16px;border-bottom:1px solid #e5eefb;background:linear-gradient(180deg,#f8fbff 0%,#ffffff 88%)}
.letter-input-floating-modal__badge{display:inline-flex;align-items:center;justify-content:center;min-height:26px;padding:0 12px;border-radius:999px;background:#dbeafe;color:#1d4ed8;font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.letter-input-floating-modal__head h2{margin:8px 0 4px;font-size:22px;line-height:1.12;color:#0f172a}
.letter-input-floating-modal__head p{margin:0;font-size:13px;line-height:1.45;color:#64748b}
.letter-input-floating-modal__head p.is-ok{color:#166534}
.letter-input-floating-modal__head p.is-error{color:#b91c1c}
.letter-input-floating-modal__head p.is-pending{color:#92400e}
.letter-input-floating-modal__close{flex:0 0 auto;width:42px;height:42px;border:1px solid #dbe7fb;border-radius:14px;background:#fff;font-size:24px;line-height:1;color:#475569;cursor:pointer}
.letter-input-floating-modal__close:hover{background:#eff6ff;color:#1d4ed8}
.letter-input-floating-modal__body{flex:1 1 auto;overflow:auto;padding:18px 18px 22px;background:#f8fafc;scrollbar-gutter:stable}
.letter-input-floating-modal__foot{position:sticky;bottom:0;display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:14px 18px;border-top:1px solid #dbe7fb;background:linear-gradient(180deg,rgba(248,250,252,.94),#ffffff 50%)}
.letter-input-floating-modal__preview-note{display:block;padding:0 18px 14px;font-size:12px;color:#64748b;background:#fff}
.letter-professional-guide{margin-bottom:16px!important}
.letter-professional-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:12px;margin:0 0 16px}
.letter-professional-summary__meta{padding:14px 14px 13px;border:1px solid #dbe7fb;border-radius:18px;background:linear-gradient(180deg,#ffffff 0%,#eff6ff 100%);box-shadow:0 10px 24px rgba(37,99,235,.06)}
.letter-professional-summary__meta span{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:900;color:#2563eb}
.letter-professional-summary__meta strong{display:block;margin-top:7px;font-size:18px;line-height:1.12;color:#0f172a}
.letter-professional-summary__meta small{display:block;margin-top:5px;font-size:12px;color:#64748b}
.letter-professional-group{margin:0 0 16px;border:1px solid #dbe7fb;border-radius:22px;background:#fff;box-shadow:0 14px 34px rgba(15,23,42,.06);overflow:hidden}
.letter-professional-group__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:16px 18px;border-bottom:1px solid #eaf1fb;background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)}
.letter-professional-group__head--button{width:100%;border:0;text-align:left;cursor:pointer}
.letter-professional-group__head h3{margin:0;font-size:17px;line-height:1.16;color:#0f172a}
.letter-professional-group__head p{margin:6px 0 0;font-size:13px;line-height:1.45;color:#64748b}
.letter-professional-group__count{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 12px;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-size:12px;font-weight:800;white-space:nowrap}
.letter-professional-group__body{padding:16px 16px 18px;background:#fff}
.letter-professional-group__body--stacked{padding:16px;background:#f8fafc}
.letter-professional-group__body--asset{display:grid;grid-template-columns:1fr;gap:14px}
.letter-professional-group--master-form{background:#f8fafc}
.letter-prof-asset-card{padding:14px;border:1px solid #dbe7fb;border-radius:18px;background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)}
.letter-prof-asset-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin:0 0 10px}
.letter-prof-asset-card__head strong{font-size:15px;color:#0f172a}
.letter-prof-asset-card__head small{font-size:12px;color:#64748b;text-align:right}
.letter-professional-group .letter-photo-stack{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.letter-professional-group .letter-photo-stack .cv-wide-btn{margin:0!important}
.letter-professional-group .letter-translate-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.letter-professional-group .letter-signature-slots-v112{display:grid;grid-template-columns:1fr;gap:14px;margin-bottom:16px}
.letter-professional-group .letter-signature-slot-card-v112{padding:14px;border:1px solid #dbe7fb;border-radius:18px;background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)}
.letter-professional-group .letter-signature-slot-card-v112 strong{display:block;margin-bottom:8px;color:#0f172a}
.letter-professional-group .letter-signature-draw-box-v97{padding:16px;border:1px dashed #b7cdfa;border-radius:20px;background:#f8fbff}
.letter-professional-group .letter-signature-draw-head-v97{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.letter-professional-group .letter-signature-draw-head-v97 span{font-size:12px;color:#64748b}
.letter-professional-group .letter-signature-canvas-v97{width:100%;max-width:100%;height:200px;background:#fff;border:1px solid #dbe7fb;border-radius:16px;touch-action:none}
.letter-professional-group .letter-signature-draw-actions-v97{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.letter-professional-group .letter-section-muted{display:block;margin-top:8px;font-size:12px;color:#64748b}
.letter-prof-field-row{display:grid;grid-template-columns:1fr;gap:10px;align-items:start;padding:14px;border:1px solid #dbe7fb;border-radius:18px;background:linear-gradient(180deg,#ffffff 0%,#fcfdff 100%);margin:0 0 12px}
.letter-prof-field-row:last-child{margin-bottom:0}
.letter-prof-field-row__label{display:flex;align-items:center;gap:10px;width:100%;box-sizing:border-box;padding:0 2px 10px;border-bottom:1px dashed #dbe7fb}
.letter-prof-field-row__icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:12px;background:#eff6ff;color:#1d4ed8;font-weight:900;font-size:14px;flex:0 0 auto}
.letter-prof-field-row__label span:last-child{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;min-width:0}
.letter-prof-field-row__label strong{display:block;font-size:14px;line-height:1.25;color:#0f172a;white-space:normal;overflow:visible;text-overflow:clip}
.letter-prof-field-row__label small{display:inline-flex;align-items:center;justify-content:flex-end;margin-top:0;font-size:11px;line-height:1.25;color:#475569;background:#f8fafc;border:1px solid #e2e8f0;border-radius:999px;padding:5px 8px;white-space:nowrap}
.letter-prof-field-row__control{display:block;min-width:0}
.letter-prof-field-row__control input,.letter-prof-field-row__control textarea{width:100%;box-sizing:border-box;border:1px solid #cfd9ea;border-radius:14px;background:#fff;padding:12px 13px;font-size:14px;font-family:"Segoe UI",Arial,sans-serif;color:#0f172a;outline:none;resize:vertical;box-shadow:inset 0 1px 2px rgba(15,23,42,.03)}
.letter-prof-field-row__control textarea{min-height:88px;line-height:1.45}
.letter-prof-field-row__control input:focus,.letter-prof-field-row__control textarea:focus{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.14)}
/* v21.53: pilihan bantuan input surat memakai kolom aktif, bukan baris select terpisah. */
.letter-input-help-field-wrap,.letter-split-cell-wrap{display:block;width:100%;min-width:0}
.letter-input-help-menu{position:absolute;z-index:99999;display:grid;gap:4px;max-height:285px;overflow:auto;padding:7px;border:1px solid #cbd5e1;border-radius:14px;background:#ffffff;box-shadow:0 18px 45px rgba(15,23,42,.18)}
.letter-input-help-menu[hidden]{display:none!important}
.letter-input-help-menu__hint{padding:7px 9px;font-size:11px;font-weight:800;color:#64748b;background:#f8fafc;border-radius:10px;text-transform:none}
.letter-input-help-menu__item{width:100%;border:0;border-radius:10px;background:#ffffff;color:#0f172a;text-align:left;font-size:12px;line-height:1.35;padding:9px 10px;cursor:pointer}
.letter-input-help-menu__item:hover,.letter-input-help-menu__item:focus{background:#eff6ff;color:#1d4ed8;outline:none}
.letter-split-cell-wrap textarea{width:100%}
.letter-prof-hidden-source{display:none!important}
.letter-field-split-editor{display:grid;gap:10px;padding:10px;border:1px solid #dbe7fb;border-radius:18px;background:linear-gradient(180deg,#f8fbff 0%,#ffffff 100%)}
.letter-field-split-editor__hint{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border-radius:14px;background:#eff6ff;color:#1e3a8a}
.letter-field-split-editor__hint strong{font-size:11px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.letter-field-split-editor__hint span{font-size:11px;line-height:1.3;color:#475569;text-align:right}
.letter-split-rows{display:grid;gap:9px}
.letter-split-row{position:relative;display:block;padding:10px 42px 10px 10px;border:1px solid #e2e8f0;border-radius:16px;background:#ffffff;box-shadow:0 8px 20px rgba(15,23,42,.035)}
.letter-split-row--pipe{background:#fcfdff}
.letter-split-row__cells{display:grid;grid-template-columns:repeat(var(--letter-split-cols,1),minmax(92px,1fr));gap:8px;align-items:start;width:100%;min-width:0}
.letter-split-row__cells textarea{min-height:38px!important;line-height:1.35!important;padding:9px 10px!important;border-radius:12px!important;resize:vertical;overflow:hidden}
.letter-split-row__remove{position:absolute;right:8px;top:10px;width:30px;height:30px;border:1px solid #fecaca;border-radius:12px;background:#fff5f5;color:#b91c1c;font-size:16px;font-weight:900;line-height:1;cursor:pointer}
.letter-split-row__remove:hover{background:#fee2e2}
.letter-split-add{width:100%;border:1px dashed #93c5fd;border-radius:14px;background:#f8fbff;color:#1d4ed8;font-weight:800;padding:10px 12px;cursor:pointer}
.letter-split-add:hover{background:#eff6ff}
.letter-split-add--signature-area{border-color:#fbbf24;background:#fffbeb;color:#92400e;margin-top:-2px}
.letter-split-add--signature-area:hover{background:#fef3c7}
.letter-split-add--signature-area:disabled,.letter-split-add--signature-area.is-disabled{opacity:.62;cursor:not-allowed;background:#f8fafc;color:#64748b;border-color:#cbd5e1}
.letter-split-signature-note{display:block;margin:-4px 2px 0;font-size:11px;line-height:1.35;color:#64748b}
.letter-split-row--signature-marker{border:1px dashed #fbbf24;background:linear-gradient(180deg,#fffbeb 0%,#ffffff 100%);padding:12px 42px 12px 12px}
.letter-split-signature-marker__body{display:grid;gap:3px;min-height:52px;align-content:center;border:1px solid #fde68a;border-radius:14px;background:rgba(255,255,255,.78);padding:10px 12px;color:#92400e}
.letter-split-signature-marker__body strong{font-size:13px;line-height:1.25}
.letter-split-signature-marker__body span{font-size:11px;line-height:1.35;color:#78350f}
.letter-professional-group .cv-chevron{align-self:center;font-size:18px;color:#64748b}
@media (max-width: 960px){
    .letter-input-floating-modal{padding:10px}
    .letter-input-floating-modal__card{width:100%;height:calc(100vh - 20px);border-radius:18px}
    .letter-professional-summary{grid-template-columns:1fr}
    .letter-prof-field-row{grid-template-columns:1fr}
    .letter-prof-field-row__label span:last-child{grid-template-columns:1fr}
    .letter-prof-field-row__label small{justify-content:flex-start;width:max-content;max-width:100%;white-space:normal}
    .letter-split-row__cells{grid-template-columns:1fr!important}
    .letter-field-split-editor__hint{display:block}
    .letter-field-split-editor__hint span{display:block;margin-top:4px;text-align:left}
    .letter-professional-group .letter-photo-stack,
    .letter-professional-group .letter-signature-draw-actions-v97,
    .letter-professional-group .letter-translate-actions{grid-template-columns:1fr}
}
/* v21.17: Form bank surat dibuat full-width agar teks input tidak kepotong di panel kiri. */
.letter-field-split-editor{width:100%;max-width:100%;box-sizing:border-box;overflow:visible}
.letter-split-row{width:100%;box-sizing:border-box;padding:10px 42px 10px 10px}
.letter-split-row__cells{width:100%;min-width:0;grid-template-columns:1fr!important}
.letter-split-row__cells textarea{width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important;min-height:46px!important;overflow:auto!important;white-space:pre-wrap!important;word-break:break-word!important}
.letter-split-row--pipe .letter-split-row__cells{grid-template-columns:1fr!important}
.letter-field-split-editor__hint{align-items:flex-start;flex-wrap:wrap}
.letter-field-split-editor__hint span{text-align:left}

/* v21.18: Semua kotak text form-bank surat terbuka penuh secara default, tanpa perlu tarik/expand manual. */
.letter-split-row__cells textarea,
.letter-prof-field-row__control textarea:not(.letter-prof-hidden-source){
    height:auto;
    min-height:52px!important;
    overflow:hidden!important;
    resize:none!important;
    white-space:pre-wrap!important;
    word-break:break-word!important;
}
.letter-split-row__cells textarea{
    max-height:none!important;
}
.letter-split-row{
    align-items:stretch;
}

/* v21.19 - Fix multipage surat tampil semua.
   Penyebab: aturan lama v20.70 masih menyembunyikan .letter-paper-v48 setelah halaman pertama,
   sehingga Formulir Penyelesaian Administrasi Karyawan Keluar terlihat hanya PAGE 1 walaupun JS sudah membuat PAGE 2+.
   Scope: hanya stage preview/export/download surat dan hanya membuka page yang memang sudah dibuat generator. */
.letter-preview-stage,
.letter-export-stage,
.letter-download-render-stage{
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
}
.letter-preview-stage > .letter-paper-v48:not(:first-of-type),
.letter-export-stage > .letter-paper-v48:not(:first-of-type),
.letter-download-render-stage > .letter-paper-v48:not(:first-of-type){
    display:block!important;
}
.letter-preview-stage[data-letter-multipage="1"],
.letter-export-stage[data-letter-multipage="1"],
.letter-download-render-stage[data-letter-multipage="1"],
.letter-preview-stage[data-letter-pagination-building="1"],
.letter-export-stage[data-letter-pagination-building="1"],
.letter-download-render-stage[data-letter-pagination-building="1"]{
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
}
.letter-preview-stage[data-letter-multipage="1"] > .letter-paper-v48,
.letter-export-stage[data-letter-multipage="1"] > .letter-paper-v48,
.letter-download-render-stage[data-letter-multipage="1"] > .letter-paper-v48,
.letter-preview-stage[data-letter-pagination-building="1"] > .letter-paper-v48,
.letter-export-stage[data-letter-pagination-building="1"] > .letter-paper-v48,
.letter-download-render-stage[data-letter-pagination-building="1"] > .letter-paper-v48{
    display:block!important;
    margin-left:auto!important;
    margin-right:auto!important;
}
.letter-preview-stage[data-letter-multipage="1"] > .letter-preview-page-separator,
.letter-preview-stage[data-letter-pagination-building="1"] > .letter-preview-page-separator,
.letter-export-stage[data-letter-multipage="1"] > .letter-preview-page-separator,
.letter-export-stage[data-letter-pagination-building="1"] > .letter-preview-page-separator,
.cv-preview-page-separator.letter-preview-page-separator{
    display:flex!important;
}
.letter-download-render-stage > .letter-preview-page-separator,
body.letter-download-render-body .letter-preview-page-separator,
.letter-download-render-stage[data-letter-multipage="1"] > .letter-preview-page-separator,
.letter-download-render-stage[data-letter-pagination-building="1"] > .letter-preview-page-separator{
    display:none!important;
}
.letter-preview-stage[data-letter-multipage="1"] .letter-paper-v48[data-letter-continuation-page="1"],
.letter-export-stage[data-letter-multipage="1"] .letter-paper-v48[data-letter-continuation-page="1"],
.letter-download-render-stage[data-letter-multipage="1"] .letter-paper-v48[data-letter-continuation-page="1"]{
    margin-top:0!important;
}


/* v21.20 - Fix scroll Preview Surat multipage.
   Penyebab lanjutan: form surat versi floating memakai display:block, sehingga panel preview kanan ikut memanjang
   tetapi parent .letter-builder-python overflow:hidden. Akibatnya PAGE 2 sudah dibuat JS, separator PAGE 1 → PAGE 2
   muncul, namun user tidak bisa scroll ke halaman 2. Scope hanya halaman Buat Surat floating. */
.letter-builder-python{
    min-height:0!important;
}
.letter-builder-form--floating{
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
}
.letter-builder-form--floating .letter-builder-right,
.letter-builder-form--floating #letterPreviewViewport{
    height:100%!important;
    max-height:100%!important;
    min-height:0!important;
    overflow:auto!important;
    overflow-x:auto!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    scrollbar-gutter:stable both-edges;
}
.letter-builder-form--floating #letterPreviewStage,
.letter-builder-form--floating .letter-preview-stage{
    height:auto!important;
    max-height:none!important;
    min-height:max-content!important;
    overflow:visible!important;
}
.letter-builder-form--floating #letterPreviewStage[data-letter-multipage="1"],
.letter-builder-form--floating .letter-preview-stage[data-letter-multipage="1"]{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    height:auto!important;
    max-height:none!important;
    min-height:max-content!important;
    overflow:visible!important;
    padding-bottom:160px!important;
}
.letter-builder-form--floating #letterPreviewStage[data-letter-multipage="1"] > .letter-paper-v48,
.letter-builder-form--floating .letter-preview-stage[data-letter-multipage="1"] > .letter-paper-v48{
    display:block!important;
    position:relative!important;
    flex:0 0 auto!important;
    visibility:visible!important;
    opacity:1!important;
}
.letter-builder-form--floating #letterPreviewStage[data-letter-multipage="1"] > .letter-preview-page-separator,
.letter-builder-form--floating .letter-preview-stage[data-letter-multipage="1"] > .letter-preview-page-separator{
    display:flex!important;
    flex:0 0 auto!important;
    visibility:visible!important;
    opacity:1!important;
}
.letter-builder-right[data-letter-multipage-scroll-ready="1"]{
    overflow-y:auto!important;
}


/* v21.21 - Input Profesional Surat always-open.
   Panel input tetap terbuka, tidak memakai backdrop gelap, tidak mengunci scroll body,
   dan preview/header toolbar surat tetap bisa diklik karena area preview digeser dari dock kiri. */
.letter-builder-form--floating{
    --letter-input-dock-w:clamp(430px,38vw,640px);
}
.letter-input-floating-modal[data-letter-input-always-open]{
    position:fixed!important;
    left:16px!important;
    top:104px!important;
    right:auto!important;
    bottom:16px!important;
    width:var(--letter-input-dock-w)!important;
    height:auto!important;
    max-height:none!important;
    padding:0!important;
    display:flex!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    z-index:40!important;
    pointer-events:none!important;
    background:transparent!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__backdrop{
    display:none!important;
    pointer-events:none!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__card{
    width:100%!important;
    height:100%!important;
    max-height:100%!important;
    pointer-events:auto!important;
    border-radius:22px!important;
    box-shadow:0 18px 48px rgba(15,23,42,.18)!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__close{
    display:none!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__head{
    padding:14px 16px 12px!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__head h2{
    font-size:19px!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__body{
    padding:14px 14px 18px!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__foot{
    padding:12px 14px!important;
}
body.letter-input-floating-open{
    overflow:auto!important;
}
body.letter-input-floating-open .letter-builder-form--floating #letterPreviewViewport,
body.letter-input-floating-open .letter-builder-form--floating .letter-builder-right{
    padding-left:calc(var(--letter-input-dock-w) + 40px)!important;
}
body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar{
    position:sticky!important;
    top:0!important;
    z-index:80!important;
    margin-left:calc((var(--letter-input-dock-w) + 40px) * -1)!important;
    padding-left:calc(var(--letter-input-dock-w) + 52px)!important;
}
body.letter-input-floating-open .letter-input-preview-link{
    pointer-events:auto!important;
}
@media (max-width:1180px){
    .letter-builder-form--floating{
        --letter-input-dock-w:calc(100vw - 24px);
    }
    .letter-input-floating-modal[data-letter-input-always-open]{
        left:12px!important;
        right:12px!important;
        top:96px!important;
        bottom:auto!important;
        width:auto!important;
        height:46vh!important;
        z-index:40!important;
    }
    body.letter-input-floating-open .letter-builder-form--floating #letterPreviewViewport,
    body.letter-input-floating-open .letter-builder-form--floating .letter-builder-right{
        padding-left:24px!important;
        padding-top:calc(46vh + 18px)!important;
    }
    body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar{
        margin-left:-24px!important;
        padding-left:36px!important;
        z-index:80!important;
    }
}


/* v21.22 - Input Profesional Surat kembali floating.
   Panel tetap selalu terbuka, tetapi kembali menjadi kartu melayang seperti setting layout.
   Header/toolbar Preview Surat tidak tertutup karena posisi top panel dihitung dari bawah toolbar. */
.letter-builder-form--floating{
    --letter-input-dock-w:clamp(390px,29vw,520px);
}
.letter-input-floating-modal[data-letter-input-always-open]{
    position:fixed!important;
    left:18px!important;
    top:var(--letter-input-floating-top,150px)!important;
    right:auto!important;
    bottom:18px!important;
    width:var(--letter-input-dock-w)!important;
    height:auto!important;
    max-height:calc(100vh - var(--letter-input-floating-top,150px) - 18px)!important;
    padding:0!important;
    display:flex!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    z-index:110!important;
    pointer-events:none!important;
    background:transparent!important;
    transform:translate3d(0,0,0)!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__card{
    width:100%!important;
    height:100%!important;
    max-height:100%!important;
    pointer-events:auto!important;
    border-radius:24px!important;
    border:1px solid rgba(148,163,184,.42)!important;
    box-shadow:0 26px 80px rgba(15,23,42,.28)!important;
    overflow:hidden!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__head{
    padding:14px 16px 12px!important;
    background:linear-gradient(180deg,#f8fbff 0%,#ffffff 92%)!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__body{
    padding:14px 14px 18px!important;
    overflow:auto!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__foot{
    padding:12px 14px!important;
}
body.letter-input-floating-open .letter-builder-form--floating #letterPreviewViewport,
body.letter-input-floating-open .letter-builder-form--floating .letter-builder-right{
    padding-left:0!important;
    padding-top:0!important;
}
body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar{
    position:sticky!important;
    top:0!important;
    z-index:160!important;
    margin-left:0!important;
    padding-left:inherit!important;
}
body.letter-input-floating-open .letter-builder-form--floating #letterPreviewStage,
body.letter-input-floating-open .letter-builder-form--floating .letter-preview-stage{
    padding-bottom:180px!important;
}
body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar .letter-layout-preview-link,
body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar .letter-template-preview-link,
body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar .letter-preview-action,
body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar .letter-kop-toolbar-toggle,
body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar .letter-zoom-box,
body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar .letter-toolbar-template-active{
    position:relative!important;
    z-index:165!important;
}
@media (max-width:1180px){
    .letter-builder-form--floating{
        --letter-input-dock-w:calc(100vw - 24px);
    }
    .letter-input-floating-modal[data-letter-input-always-open]{
        left:12px!important;
        right:12px!important;
        top:var(--letter-input-floating-top,136px)!important;
        bottom:auto!important;
        width:auto!important;
        height:44vh!important;
        max-height:44vh!important;
        z-index:110!important;
    }
    body.letter-input-floating-open .letter-builder-form--floating #letterPreviewViewport,
    body.letter-input-floating-open .letter-builder-form--floating .letter-builder-right{
        padding-left:0!important;
        padding-top:calc(44vh + 18px)!important;
    }
    body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar{
        margin-left:0!important;
        padding-left:inherit!important;
        z-index:160!important;
    }
}

/* v21.23 - Input Profesional Surat fixed side panel seperti panel kiri.
   Tidak floating lagi: panel nempel dari atas sampai bawah, lebar dikunci seperti contoh,
   dan preview/header surat digeser ke kanan agar tidak ketutup. */
.letter-builder-form--floating{
    --letter-input-dock-w:clamp(420px,31vw,440px);
}
.letter-input-floating-modal[data-letter-input-always-open]{
    position:fixed!important;
    inset:auto auto auto auto!important;
    left:0!important;
    top:var(--letter-input-dock-top,76px)!important;
    right:auto!important;
    bottom:0!important;
    width:var(--letter-input-dock-w)!important;
    height:calc(100vh - var(--letter-input-dock-top,76px))!important;
    max-height:calc(100vh - var(--letter-input-dock-top,76px))!important;
    padding:0!important;
    margin:0!important;
    display:flex!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    z-index:145!important;
    pointer-events:none!important;
    background:#f3f4f6!important;
    border-right:1px solid #c7cbd1!important;
    box-shadow:none!important;
    transform:none!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__backdrop{
    display:none!important;
    pointer-events:none!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__card{
    width:100%!important;
    height:100%!important;
    max-height:100%!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:#f3f4f6!important;
    pointer-events:auto!important;
    overflow:hidden!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__head{
    padding:14px 16px 12px!important;
    border-bottom:1px solid #d8dee8!important;
    background:linear-gradient(180deg,#ffffff 0%,#f3f4f6 100%)!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__head h2{
    font-size:18px!important;
    line-height:1.15!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__body{
    flex:1 1 auto!important;
    overflow:auto!important;
    padding:12px 10px 18px!important;
    background:#f3f4f6!important;
    scrollbar-gutter:stable!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__foot{
    padding:10px!important;
    border-top:1px solid #d8dee8!important;
    background:#f3f4f6!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__preview-note{
    background:#f3f4f6!important;
    padding:0 10px 10px!important;
}
body.letter-input-floating-open{
    overflow:auto!important;
}
body.letter-input-floating-open .letter-builder-form--floating .letter-builder-right,
body.letter-input-floating-open .letter-builder-form--floating #letterPreviewViewport{
    margin-left:var(--letter-input-dock-w)!important;
    width:auto!important;
    height:100%!important;
    max-height:100%!important;
    padding-left:24px!important;
    padding-top:16px!important;
    padding-right:24px!important;
    padding-bottom:36px!important;
    overflow:auto!important;
    box-sizing:border-box!important;
}
body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar{
    position:sticky!important;
    top:0!important;
    z-index:90!important;
    margin:-16px -24px 16px!important;
    padding:8px 12px!important;
}
body.letter-input-floating-open .letter-builder-form--floating #letterPreviewStage,
body.letter-input-floating-open .letter-builder-form--floating .letter-preview-stage{
    padding-bottom:180px!important;
}
body.letter-input-floating-open .letter-input-preview-link{
    pointer-events:auto!important;
}
@media (max-width:900px){
    .letter-builder-form--floating{
        --letter-input-dock-w:420px;
    }
    .letter-input-floating-modal[data-letter-input-always-open]{
        width:min(420px,72vw)!important;
    }
    body.letter-input-floating-open .letter-builder-form--floating .letter-builder-right,
    body.letter-input-floating-open .letter-builder-form--floating #letterPreviewViewport{
        margin-left:min(420px,72vw)!important;
        padding-left:14px!important;
        padding-right:14px!important;
    }
    body.letter-input-floating-open .letter-builder-form--floating .letter-preview-toolbar{
        margin:-16px -14px 16px!important;
    }
}



/* v21.24 - Ringkasan Input Profesional Surat: tambah Total Page dan hapus baris Asset Surat. */
.letter-professional-summary{grid-template-columns:repeat(auto-fit,minmax(145px,1fr))!important}
.letter-professional-group--asset{display:none!important}
.letter-professional-summary__meta [data-letter-total-page-count]{font-size:20px!important}

/* v21.25 - Translate Surat Online dipindah ke bawah informasi ringkasan */
.letter-input-floating-modal[data-letter-input-always-open="1"] .letter-professional-group--translate{
    order:0!important;
}
.letter-input-floating-modal[data-letter-input-always-open="1"] .letter-professional-group--translate .letter-professional-group__head{
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)!important;
}

/* v21.26 - Exit Clearance: field TTD Elektronik aktif penuh untuk 3 slot.
   Panel Input Profesional sekarang punya upload dan simpan gambar manual untuk:
   Karyawan, Project Director, dan HRD/Personalia. Preview memakai placeholder per slot. */
.letter-signature-slot-card-v112__title{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    margin-bottom:8px!important;
}
.letter-signature-slot-card-v112__title strong{
    margin:0!important;
}
.letter-signature-slot-card-v112__title small{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:22px!important;
    padding:3px 9px!important;
    border-radius:999px!important;
    background:#eaf2ff!important;
    color:#1d4ed8!important;
    font-size:10px!important;
    font-weight:950!important;
    text-transform:uppercase!important;
    letter-spacing:.08em!important;
}
.letter-signature-draw-actions-v97--slots{
    grid-template-columns:1fr!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-sign-space-v109[data-signature-placeholder]:empty::after{
    content:attr(data-signature-placeholder)!important;
}
.letter-template-employee-exit-clearance.letter-exit-clearance-pdf-v109 .exit-clearance-sign-space-v109 .letter-electronic-signature-v96{
    margin:0 auto!important;
    object-position:center center!important;
}
@media (min-width:560px){
    .letter-signature-draw-actions-v97--slots{
        grid-template-columns:1fr 1fr!important;
    }
    .letter-signature-draw-actions-v97--slots #letterSignatureClearCanvas{
        grid-column:1 / -1!important;
    }
}


/* v21.27 - Panel Input Profesional Surat tidak menutup logo/navbar.
   Panel tetap fixed kiri dan always-open, tetapi top dihitung dari tinggi header aplikasi
   sehingga logo dan menu Beranda/Buat CV/Buat Surat tidak ketiban panel. */
.letter-builder-form--floating{
    --letter-input-dock-top:76px;
}
.letter-input-floating-modal[data-letter-input-always-open]{
    top:var(--letter-input-dock-top,76px)!important;
    bottom:0!important;
    height:calc(100vh - var(--letter-input-dock-top,76px))!important;
    max-height:calc(100vh - var(--letter-input-dock-top,76px))!important;
}
.letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__card{
    height:100%!important;
    max-height:100%!important;
}

/* v21.28 - Translate Surat Online aktif dengan loading animasi sampai halaman selesai ter-translate. */
.letter-translate-status{
    display:block!important;
    margin:0 0 12px!important;
    padding:12px 14px!important;
    border:1px solid #bfdbfe!important;
    border-radius:16px!important;
    background:linear-gradient(135deg,#eff6ff 0%,#ffffff 100%)!important;
    color:#1d4ed8!important;
    font-size:12px!important;
    line-height:1.45!important;
    font-weight:900!important;
}
.letter-translate-status[hidden]{display:none!important;}
.letter-builder-form.is-letter-translating-online .letter-translate-btn,
body.letter-translating-online-active .letter-translate-btn{
    cursor:wait!important;
}
.letter-translate-btn.is-loading{
    position:relative!important;
    opacity:.92!important;
    pointer-events:none!important;
}
.letter-translate-btn.is-loading:after{
    content:""!important;
    display:inline-block!important;
    width:14px!important;
    height:14px!important;
    margin-left:8px!important;
    vertical-align:-2px!important;
    border:3px solid rgba(255,255,255,.55)!important;
    border-top-color:#ffffff!important;
    border-radius:999px!important;
    animation:cvUpdateLoadingSpin .7s linear infinite!important;
}
.letter-translate-btn:not(.primary).is-loading:after{
    border-color:rgba(37,99,235,.24)!important;
    border-top-color:#2563eb!important;
}
.letter-update-loading-overlay[data-mode="translate"] .cv-update-loading-text:after{
    content:" surat online"!important;
}
.letter-update-loading-overlay[data-mode="translate"] .cv-update-loading-card p{
    color:#1d4ed8!important;
}


/* v21.30 - TTD Elektronik panel aktif global.
   Upload TTD dan Buat TTD Manual wajib terlihat di panel Input Profesional untuk semua template surat.
   Penyebab lama: body memakai .cv-section-body display:none dari app.css, sementara section belum punya selector pembuka yang cocok. */
.letter-professional-group.letter-accordion-section > .letter-professional-group__body.cv-section-body{
    display:none!important;
}
.letter-professional-group.letter-accordion-section.is-open > .letter-professional-group__body.cv-section-body,
.letter-professional-group.letter-accordion-section.cv-accordion-section.is-open > .letter-professional-group__body.cv-section-body,
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"].is-open > .letter-professional-group__body.cv-section-body{
    display:block!important;
}
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"] .letter-signature-slots-v112,
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"] .letter-signature-draw-box-v97{
    display:grid!important;
}
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"] .letter-signature-draw-box-v97{
    gap:12px!important;
}
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"] .letter-file-button input[type="file"]{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    overflow:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
}


/* v21.31 - Perbaiki warna teks header panel TTD Elektronik.
   Header TTD memakai style accordion biru dari app.css, jadi semua teks judul/deskripsi/chevron dipaksa putih agar terbaca jelas. */
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"].is-open > .letter-professional-group__head,
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"].is-open > .letter-professional-group__head.cv-section-head{
    background:#2563eb!important;
    color:#ffffff!important;
}
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"].is-open > .letter-professional-group__head h3,
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"].is-open > .letter-professional-group__head p,
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"].is-open > .letter-professional-group__head .cv-chevron{
    color:#ffffff!important;
}
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"].is-open > .letter-professional-group__head p{
    opacity:.92!important;
}
.letter-professional-group.letter-accordion-section[data-letter-panel="signature"].is-open > .letter-professional-group__head .letter-professional-group__count{
    background:#ffffff!important;
    color:#2563eb!important;
    box-shadow:0 8px 18px rgba(15,23,42,.12)!important;
}

/* v21.35 - Hapus tombol Panel Tetap Terbuka dan Simpan Draft Surat dari panel kiri Buat Surat. */
.letter-input-floating-modal__foot--update-only{
    justify-content:flex-end!important;
}
.letter-input-floating-modal__foot--update-only .letter-update-surat-btn{
    min-width:160px!important;
}

/* v21.36 - Panel upload/buat TTD template di kiri default OFF; hanya tampil jika dibuka dari Setting Layout. */
[data-letter-signature-template-panel][hidden]{display:none!important}

/* v21.45 - Surat Baru/Kosong manual: output dibuat seperti mengetik surat formal di Word.
   Semua field yang diisi user dari panel kiri dirender berurutan dan tidak lagi ikut pola template sample. */
.formal-letter-v48.manual-blank-letter-v145{
    padding:var(--letter-formal-pad-y,54px) var(--letter-formal-pad-x,62px)!important;
    border-top:0!important;
    border-left:0!important;
    background:#fff!important;
}
.manual-blank-letter-v145__body{
    width:100%!important;
    min-height:calc(var(--letter-page-h,792px) - (var(--letter-formal-pad-y,54px) * 2))!important;
    box-sizing:border-box!important;
}
.manual-blank-letter-v145__date{
    margin:0 0 22px!important;
    text-align:right!important;
}
.manual-blank-letter-v145__title{
    margin:0 0 24px!important;
    text-align:center!important;
    text-decoration:underline!important;
    font-weight:400!important;
    color:var(--letter-body-color,#111)!important;
    border:0!important;
    background:transparent!important;
    padding:0!important;
}
.manual-blank-letter-v145__identity,
.manual-blank-letter-v145__recipient,
.manual-blank-letter-v145__address,
.manual-blank-letter-v145__paragraphs,
.manual-blank-letter-v145__closing,
.manual-blank-letter-v145__footer{
    margin:0 0 14px!important;
}
.manual-blank-letter-v145__identity p,
.manual-blank-letter-v145__recipient p,
.manual-blank-letter-v145__address p,
.manual-blank-letter-v145__footer p{
    margin:0 0 3px!important;
    line-height:1.48!important;
}
.manual-blank-letter-v145__subject{
    display:grid!important;
    grid-template-columns:auto 12px minmax(0,1fr)!important;
    gap:6px!important;
    align-items:start!important;
    margin:0 0 16px!important;
    line-height:1.48!important;
}
.manual-blank-letter-v145__subject strong,
.manual-blank-letter-v145__subject span,
.manual-blank-letter-v145__subject p{
    margin:0!important;
    line-height:1.48!important;
}
.manual-blank-letter-v145__paragraph{
    text-align:justify!important;
    text-indent:0!important;
    margin:0 0 12px!important;
    line-height:1.5!important;
}
.manual-blank-letter-v145__closing{
    margin-top:24px!important;
}
.manual-blank-letter-v145__closing p{
    margin:0 0 4px!important;
    line-height:1.48!important;
}
.manual-blank-letter-v145__footer{
    margin-top:18px!important;
    padding-top:10px!important;
    border-top:1px solid rgba(15,23,42,.12)!important;
}

/* v21.59 - Mode HP Buat Surat: panel Input dan Preview dipisah agar tidak saling menutup. */
@media (max-width:900px){
    #letterBuilderPython{
        height:auto!important;
        min-height:0!important;
        overflow:visible!important;
        background:#f3f4f6!important;
    }
    #letterBuilderPython > .mobile-document-switch{
        top:0!important;
        z-index:260!important;
    }
    #letterBuilderPython .letter-builder-form--floating{
        display:block!important;
        height:auto!important;
        min-height:0!important;
        overflow:visible!important;
    }
    #letterBuilderPython[data-mobile-doc-view="input"] #letterPreviewViewport,
    #letterBuilderPython[data-mobile-doc-view="input"] .letter-builder-right{
        display:none!important;
    }
    #letterBuilderPython[data-mobile-doc-view="input"] .letter-input-floating-modal[data-letter-input-always-open]{
        position:relative!important;
        inset:auto!important;
        left:auto!important;
        top:auto!important;
        right:auto!important;
        bottom:auto!important;
        width:100%!important;
        max-width:none!important;
        height:auto!important;
        min-height:calc(100vh - 146px)!important;
        max-height:none!important;
        display:flex!important;
        z-index:10!important;
        padding:0!important;
        margin:0!important;
        border-right:0!important;
        background:#f3f4f6!important;
        box-shadow:none!important;
        pointer-events:auto!important;
    }
    #letterBuilderPython[data-mobile-doc-view="input"] .letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__card{
        width:100%!important;
        height:auto!important;
        min-height:calc(100vh - 146px)!important;
        max-height:none!important;
        border-radius:0!important;
        border:0!important;
        box-shadow:none!important;
        overflow:visible!important;
    }
    #letterBuilderPython[data-mobile-doc-view="input"] .letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__body{
        overflow:visible!important;
        padding:12px 10px 96px!important;
    }
    #letterBuilderPython[data-mobile-doc-view="input"] .letter-input-floating-modal[data-letter-input-always-open] .letter-input-floating-modal__foot{
        position:sticky!important;
        bottom:0!important;
        z-index:40!important;
    }
    #letterBuilderPython[data-mobile-doc-view="preview"] .letter-input-floating-modal[data-letter-input-always-open]{
        display:none!important;
    }
    #letterBuilderPython[data-mobile-doc-view="preview"] #letterPreviewViewport,
    #letterBuilderPython[data-mobile-doc-view="preview"] .letter-builder-right{
        display:block!important;
        margin-left:0!important;
        width:100%!important;
        height:auto!important;
        min-height:calc(100vh - 146px)!important;
        max-height:none!important;
        padding:12px 10px 88px!important;
        overflow:auto!important;
        box-sizing:border-box!important;
    }
    #letterBuilderPython[data-mobile-doc-view="preview"] .letter-preview-toolbar{
        position:sticky!important;
        top:0!important;
        z-index:180!important;
        margin:-12px -10px 12px!important;
        padding:8px 10px!important;
        overflow-x:auto!important;
        flex-wrap:nowrap!important;
        white-space:nowrap!important;
    }
    #letterBuilderPython[data-mobile-doc-view="preview"] .letter-preview-toolbar > *{
        flex:0 0 auto!important;
    }
    #letterBuilderPython[data-mobile-doc-view="preview"] #letterPreviewStage,
    #letterBuilderPython[data-mobile-doc-view="preview"] .letter-preview-stage{
        min-width:720px!important;
        justify-content:flex-start!important;
        transform:scale(.78)!important;
        transform-origin:top left!important;
        padding-bottom:120px!important;
    }
}
@media (max-width:560px){
    #letterBuilderPython[data-mobile-doc-view="preview"] #letterPreviewStage,
    #letterBuilderPython[data-mobile-doc-view="preview"] .letter-preview-stage{
        transform:scale(.68)!important;
    }
    #letterBuilderPython[data-mobile-doc-view="input"] .letter-input-floating-modal__head{
        padding:12px 12px 10px!important;
    }
}
