/* job-kit.css — Govt Job Application Kit (16-Sep-2026) */
.jk{--jk-c:#0891b2;--jk-line:hsl(var(--border));--jk-mut:hsl(var(--muted-foreground));--jk-card:hsl(var(--card))}
.jk [hidden]{display:none!important}
.jk .L-en{display:none}
.jk[data-lang="en"] .L-bn{display:none}
.jk[data-lang="en"] .L-en{display:inline}
.jk,.jk input,.jk select,.jk textarea,.jk button{font-family:"Noto Sans Bengali",var(--font-body)}

.jk-hero{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-end;justify-content:space-between;margin:8px 0 20px}
.jk-hero-txt{flex:1 1 520px;min-width:0}
.jk-eyebrow{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--jk-c);background:color-mix(in srgb,var(--jk-c) 10%,transparent);padding:5px 11px;border-radius:999px}
.jk-eyebrow svg{width:15px;height:15px}
.jk-hero h1{font:800 clamp(26px,4vw,38px)/1.2 "Noto Sans Bengali",var(--font-head);margin:10px 0 8px;letter-spacing:-.01em}
.jk-hero p{margin:0;color:var(--jk-mut);font-size:15px;line-height:1.7;max-width:760px}
.jk-hero-side{display:flex;flex-direction:column;gap:10px;align-items:flex-end}
.jk-lang{display:inline-flex;border:1px solid var(--jk-line);border-radius:999px;padding:3px;background:var(--jk-card)}
.jk-lang button{border:0;background:transparent;padding:6px 14px;border-radius:999px;font-size:13px;font-weight:600;color:var(--jk-mut);cursor:pointer}
.jk-lang button.on{background:hsl(var(--foreground));color:hsl(var(--background))}
.jk-lang-sm button{padding:4px 10px;font-size:12px}
.jk-status{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end;font-size:13px}
.jk-status small{color:var(--jk-mut)}
.jk-ok{color:#059669;font-weight:700}.jk-bad{color:#dc2626;font-weight:700}.jk-wait{color:#b45309;font-weight:700}
.jk-lock{color:var(--jk-mut);font-weight:600}

.jk-tabs{display:flex;gap:4px;border-bottom:1px solid var(--jk-line);margin-bottom:18px;overflow-x:auto;scrollbar-width:none}
.jk-tabs::-webkit-scrollbar{display:none}
.jk-tabs button{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;border:0;background:transparent;padding:11px 14px;font-size:14.5px;font-weight:600;color:var(--jk-mut);border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer;white-space:nowrap}
.jk-tabs button svg{width:17px;height:17px}
.jk-tabs button.on{color:hsl(var(--foreground));border-bottom-color:var(--jk-c)}

.jk-card{background:var(--jk-card);border:1px solid var(--jk-line);border-radius:16px;padding:18px}
.jk-card-h{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px;font-size:16px}
.jk-spec,.jk-free{font-size:12px;font-weight:700;color:var(--jk-c);background:color-mix(in srgb,var(--jk-c) 10%,transparent);padding:3px 9px;border-radius:999px;white-space:nowrap}
.jk-note{font-size:13px;color:var(--jk-mut);line-height:1.6;margin:0 0 12px}
.jk-hint{font-size:12px;color:var(--jk-mut);margin:6px 0 10px}
.jk-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.jk-presets{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;margin-bottom:14px}
.jk-presets label{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600}
.jk-presets .jk-note{margin:0;flex:1 1 300px}
.jk select,.jk input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),.jk textarea{
  height:40px;border:1px solid var(--jk-line);border-radius:10px;padding:0 11px;background:hsl(var(--background));color:hsl(var(--foreground));font-size:14px;min-width:0;width:100%}
.jk-presets select{width:auto;max-width:100%}
.jk textarea{height:auto;padding:9px 11px;line-height:1.55;resize:vertical}
.jk input:focus,.jk select:focus,.jk textarea:focus{outline:2px solid color-mix(in srgb,var(--jk-c) 45%,transparent);outline-offset:1px}

.jk-drop{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;min-height:88px;border:2px dashed var(--jk-line);border-radius:12px;color:var(--jk-mut);font-size:14px;font-weight:600;cursor:pointer;text-align:center;padding:12px;transition:border-color .15s,background .15s}
.jk-drop:hover,.jk-drop.over{border-color:var(--jk-c);background:color-mix(in srgb,var(--jk-c) 5%,transparent);color:hsl(var(--foreground))}
.jk-drop input{position:absolute;inset:0;opacity:0;cursor:pointer}
.jk-drop svg{width:20px;height:20px}
.jk-custom{display:flex;gap:8px;margin-top:10px}
.jk-custom label{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;flex:1}
.jk-crop{margin-top:14px}
.jk-stage{display:flex;justify-content:center;background:repeating-conic-gradient(hsl(var(--muted)) 0 25%,transparent 0 50%) 0 0/16px 16px;border-radius:10px;padding:12px}
.jk-stage canvas{display:block;max-width:100%;touch-action:none;cursor:grab;box-shadow:0 0 0 2px var(--jk-c),0 8px 24px -12px rgba(0,0,0,.35)}
.jk-stage canvas:active{cursor:grabbing}
.jk-ctl{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-top:10px;font-size:13px}
.jk-ctl label{display:inline-flex;align-items:center;gap:6px}
.jk-ctl svg{width:16px;height:16px}
.jk-ctl input[type=range]{width:120px;accent-color:var(--jk-c)}
.jk-chk{display:inline-flex!important;align-items:center;gap:6px;font-size:13px;font-weight:500}
.jk-out{display:flex;gap:14px;align-items:center;margin:4px 0 12px;padding:10px;border:1px solid var(--jk-line);border-radius:12px}
.jk-prev canvas{display:block;max-width:150px;height:auto;border:1px solid var(--jk-line);-webkit-user-select:none;user-select:none}
.jk-meta{display:flex;flex-direction:column;gap:3px;font-size:13px;min-width:0}
.jk-meta small{color:var(--jk-mut)}
.jk-wm-note{color:#b45309!important}

.jk-form{display:flex;flex-direction:column;gap:11px}
.jk-form label{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:600}
.jk-form h3{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:14.5px;margin:10px 0 0;padding-top:12px;border-top:1px solid var(--jk-line)}
.jk-form h3:first-child{border-top:0;padding-top:0;margin-top:0}
.jk-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.jk-cp .jk-cpw{display:flex;gap:6px}
.jk-copy{flex:0 0 40px;height:40px;border:1px solid var(--jk-line);border-radius:10px;background:transparent;color:var(--jk-mut);cursor:pointer;font-size:16px}
.jk-copy:hover{color:var(--jk-c);border-color:var(--jk-c)}
.jk-copy.done{color:#fff;background:#059669;border-color:#059669}
.jk-edu{border:1px solid var(--jk-line);border-radius:12px;padding:10px 12px 12px;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 10px}
.jk-edu legend{font-weight:700;font-size:13px;padding:0 6px}
.jk-edu .jk-cp:nth-child(4){grid-column:1/-1}

.jk-age-out{min-height:260px}
.jk-empty{padding:40px 10px;text-align:center;color:var(--jk-mut);font-size:14px}
.jk-empty svg{width:28px;height:28px}
.jk-age-big{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.jk-age-big div{background:color-mix(in srgb,var(--jk-c) 8%,transparent);border-radius:14px;padding:14px 8px;text-align:center}
.jk-age-big b{display:block;font:800 34px/1.1 "Noto Sans Bengali",var(--font-head);color:var(--jk-c)}
.jk-age-big span{font-size:13px;color:var(--jk-mut);font-weight:600}
.jk-age-verdict{font-size:16px;margin:14px 0 10px}
.jk-dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0 0 12px;font-size:14px}
.jk-dl dt{color:var(--jk-mut)}.jk-dl dd{margin:0;font-weight:700}

.jk-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-bottom:14px}
.jk-bar .jk-note{margin:0;flex:1 1 320px}
.jk-bar-btns{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.jk-info{display:grid;grid-template-columns:minmax(300px,420px) minmax(0,1fr);gap:16px;align-items:start}
.jk-info > .jk-form{max-height:calc(100vh - 140px);overflow:auto;position:sticky;top:80px}
.jk-paper-wrap{overflow:auto;background:hsl(var(--muted)/.5);border-radius:16px;padding:18px}

/* the A4 sheet — the same markup is printed / exported */
.jk-paper{position:relative;background:#fff;color:#111;width:100%;max-width:794px;min-height:1000px;margin:0 auto;padding:56px 60px;box-shadow:0 10px 40px -18px rgba(0,0,0,.35);
  font:15px/1.65 "Noto Serif Bengali","Noto Sans Bengali","Times New Roman",serif;overflow:hidden}
.jk-paper h2{font-size:21px;margin:0 0 2px}.jk-paper h3{font-size:16px;margin:18px 0 8px}
.jk-sheet-h{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;border-bottom:2px solid #111;padding-bottom:10px;margin-bottom:12px}
.jk-sheet-h p{margin:0;color:#555;font-size:13px}
.jk-ph{width:112px;height:112px;object-fit:cover;border:1px solid #999;flex:0 0 auto}
.jk-ph-empty{display:flex;align-items:center;justify-content:center;color:#aaa;font-size:12px;border-style:dashed}
.jk-t{width:100%;border-collapse:collapse}
.jk-t th,.jk-t td{border:1px solid #bbb;padding:5px 8px;text-align:left;vertical-align:top;font-size:13.5px}
.jk-t th{width:34%;background:#f3f4f6;font-weight:600}
.jk-te th{width:auto}
.jk-foot{margin-top:24px;color:#999;font-size:11px;text-align:right}
.jk-blank{color:#b0b0b0;border-bottom:1px dashed #ccc;min-width:60px;display:inline-block}
.jk-letter p{margin:0 0 10px}
.jk-date{text-align:right}
.jk-subj{margin:16px 0!important}
.jk-body{text-align:justify}
.jk-items{padding-left:22px;margin:6px 0 12px}
.jk-items li{display:grid;grid-template-columns:150px 10px minmax(0,1fr);gap:4px;margin:3px 0}
.jk-items li b{font-weight:400}
.jk-items .jk-t th,.jk-items .jk-t td{font-size:12.5px;padding:3px 6px}
.jk-sig{margin:26px 0 0 auto;width:240px;text-align:center}
.jk-sig p{margin:0!important}
.jk-sgimg{height:54px;margin:6px 0}
.jk-sgline{height:60px}
.jk-encl{margin-top:18px;font-size:14px}
.jk-encl ol{margin:4px 0 0;padding-left:22px}
.jk-paper.wm::after{content:"";position:absolute;inset:-50%;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='170'%3E%3Ctext x='10' y='100' transform='rotate(-24 180 85)' font-family='Arial' font-size='22' font-weight='700' fill='%23dc2626' fill-opacity='.2'%3EPREVIEW · aljubaer.com%3C/text%3E%3C/svg%3E");}

/* pay */
.jk-modal{position:fixed;inset:0;z-index:1000;background:rgba(15,23,42,.55);display:flex;align-items:center;justify-content:center;padding:16px}
.jk-modal-box{position:relative;background:var(--jk-card);color:hsl(var(--foreground));border-radius:18px;padding:24px;width:100%;max-width:460px;max-height:calc(100vh - 32px);overflow:auto;box-shadow:0 30px 80px -30px rgba(0,0,0,.6)}
.jk-modal-box h2{display:flex;align-items:center;gap:8px;font-size:19px;margin:0 0 8px}
.jk-modal-box h2 svg{width:20px;height:20px;color:var(--jk-c)}
.jk-x{position:absolute;top:10px;right:12px;border:0;background:transparent;font-size:24px;line-height:1;color:var(--jk-mut);cursor:pointer}
.jk-price{margin:0 0 8px}.jk-price b{font:800 30px/1 var(--font-head);color:var(--jk-c)}.jk-price span{color:var(--jk-mut);font-size:14px}
.jk-perks{margin:0 0 14px;padding-left:20px;font-size:14px;line-height:1.7}
.jk-steps{margin:0 0 12px;padding-left:20px;font-size:14px;line-height:1.7}
.jk-methods{display:flex;gap:8px}
.jk-radio{flex:1;flex-direction:row!important;align-items:center;justify-content:center;gap:6px!important;border:1px solid var(--jk-line);border-radius:10px;padding:9px;cursor:pointer}
.jk-radio:has(input:checked){border-color:var(--jk-c);box-shadow:inset 0 0 0 1px var(--jk-c)}
.jk-msg{margin:0;font-size:13px;min-height:18px}.jk-msg.bad{color:#dc2626}
.jk-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:1100;background:#0f172a;color:#fff;padding:10px 16px;border-radius:10px;font:600 14px/1.4 "Noto Sans Bengali",system-ui;box-shadow:0 12px 30px -12px rgba(0,0,0,.5);transition:opacity .4s}
.jk-toast.bad{background:#b91c1c}.jk-toast.out{opacity:0}

@media (max-width:980px){
  .jk-two,.jk-info{grid-template-columns:1fr}
  .jk-info > .jk-form{position:static;max-height:none}
  .jk-hero-side{align-items:flex-start}
  .jk-paper{padding:32px 26px;min-height:0}
}
@media (max-width:560px){
  .jk-paper-wrap{padding:8px}
  .jk-paper{font-size:13px;padding:22px 16px}
  .jk-items li{grid-template-columns:1fr;gap:0}
  .jk-items li b{display:none}
  .jk-edu{grid-template-columns:1fr}
  .jk-out{flex-direction:column;align-items:flex-start}
  .jk-age-big b{font-size:26px}
}
/* no printing the watermark-free page while locked */
@media print{ body.jk-locked *{visibility:hidden!important} body.jk-locked::after{content:"Printing is available after unlocking — aljubaer.com/services/job-kit";visibility:visible;display:block;padding:40px;font:16px sans-serif} }
.jk-presets label{min-width:0;max-width:100%}
.jk-presets select{min-width:0;flex:1 1 auto;text-overflow:ellipsis}
@media (max-width:560px){ .jk-presets label{flex:1 1 100%} .jk-presets select{width:100%} }