/* ClueTrove tools site: fields shared by the tools and the tools directory. Uses the theme colour tokens. */
.ct-tool-field{display:flex;flex-direction:column;gap:8px;margin:0 0 20px;font-size:14px}
.ct-tool-field label{font-weight:600}
.ct-tool-field input[type=text],.ct-tool-field textarea,.ct-tool-field select{font:inherit;font-size:15px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:10px 12px;min-height:44px;max-width:100%}
.ct-tool-field textarea{resize:vertical;min-height:88px}
.ct-tool-field input[type=range]{width:min(100%,360px);min-height:44px;accent-color:var(--accent)}
.ct-tool-field :focus-visible{outline:3px solid var(--coral);outline-offset:3px}
.ct-tool-inline{flex-direction:row;flex-wrap:wrap;gap:16px 28px}.ct-tool-inline>div{display:flex;flex-direction:column;gap:8px}
.ct-tool-row{grid-template-columns:minmax(0,1fr) auto}
.ct-tool-result a,.ct-tool-links a{color:var(--accent)}
.ct-tool-results h3{font-size:18px;margin:18px 0 8px}
.ct-tool-links{margin:0;padding-inline-start:20px;font-size:14px;line-height:2;max-height:420px;overflow:auto}
.ct-qr-out{margin-top:18px}
.ct-qr-canvas{display:block;width:min(100%,280px);height:auto;image-rendering:pixelated;border:1px solid var(--line);background:#fff}
.ct-qr-out .ct-j2p-hint{word-break:break-all}
.ct-tools-dir{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px;margin:0 0 60px;padding:0;list-style:none}
.ct-tools-dir li{border:1px solid var(--line);border-radius:8px;background:var(--surface);padding:22px}
.ct-tools-dir h2{font-size:22px;margin:0 0 8px}
.ct-tools-dir h2 a{color:var(--ink);text-decoration:none}
.ct-tools-dir h2 a:hover,.ct-tools-dir h2 a:focus-visible{color:var(--accent)}
.ct-tools-dir p{font-size:14px;color:var(--muted);margin:0}
.ct-tool-guide{font-size:14px;margin:-40px 0 60px}
html[dir=rtl] .ct-tools-dir h2{font-size:21px}
@media(max-width:760px){.ct-tools-dir{grid-template-columns:minmax(0,1fr)}.ct-tool-guide{margin-top:-24px}}
.ct-tool-alpha{flex-basis:100%;max-width:70ch;color:var(--coral);margin:6px 0 0}.ct-tool-alpha[hidden]{display:none}

/* ---- 1.1.0: calculator, BMI, GPA, grades, CV builder, cover letter, CV checker ---- */
.ct-visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.ct-label-btn{display:inline-flex;align-items:center;cursor:pointer;text-decoration:none}
.ct-j2p-input:focus-visible+.ct-label-btn,.ct-label-btn:focus-within{outline:3px solid var(--coral);outline-offset:3px}
.ct-tool-callout{border-inline-start:4px solid var(--coral);background:var(--paper);padding:12px 16px;margin:0 0 20px;font-size:14px;line-height:1.9;max-width:78ch}
.ct-wide{flex:1 1 100%}.ct-wide textarea{width:100%}
.ct-details{border:1px solid var(--line);border-radius:6px;margin:0 0 16px;padding:0 16px}
.ct-details>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600}
.ct-details[open]>summary{border-bottom:1px solid var(--line);margin-bottom:14px}
.ct-details>summary:focus-visible{outline:3px solid var(--coral);outline-offset:2px}
.ct-result{border:1px solid var(--line);border-radius:8px;background:var(--paper);padding:20px 22px;margin:20px 0}
.ct-result h3{font-size:18px;margin:18px 0 8px}
.ct-bmi-value{font-size:44px;line-height:1.2;font-family:Inter,sans-serif;font-weight:700;margin:0 0 4px;color:var(--accent)}
.ct-table{border-collapse:collapse;width:100%;max-width:520px;font-size:14px}
.ct-table th,.ct-table td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:start}
.ct-table tr.is-current{background:var(--surface);font-weight:700}
.ct-calc-error{color:var(--coral);font-size:14px;margin:8px 0}.ct-calc-error:empty{display:none}
/* BMI scale: segments are laid out on a 12..45 axis */
.ct-bmi-bar{position:relative;display:flex;height:14px;border-radius:7px;overflow:hidden;margin:14px 0 22px;max-width:520px;background:var(--line)}
.ct-bmi-seg{display:block;height:100%}
.ct-bmi-s1{flex:6.5;background:#6a9fc0}.ct-bmi-s2{flex:6.5;background:#6fb28a}.ct-bmi-s3{flex:5;background:#d9b44a}.ct-bmi-s4{flex:5;background:#e08f4e}.ct-bmi-s5{flex:5;background:#d2603f}.ct-bmi-s6{flex:5;background:#a63a32}
.ct-bmi-marker{position:absolute;top:-4px;width:4px;height:22px;background:var(--ink);box-shadow:0 0 0 2px var(--paper);transform:translateX(-2px)}
html[dir=rtl] .ct-bmi-marker{transform:translateX(2px)}
/* calculator */
.ct-calc-input{font:500 22px/1.4 'Inter',monospace;width:100%;direction:ltr;text-align:left}
.ct-calc-display{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:12px 16px;margin:0 0 12px;display:flex;flex-direction:column;align-items:flex-end;direction:ltr}
.ct-calc-result{font:600 38px/1.2 'Inter',sans-serif;word-break:break-all;color:var(--accent)}
.ct-calc-opts{display:flex;flex-wrap:wrap;gap:0 28px}
.ct-calc-pad{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 10px;direction:ltr;max-width:420px}
.ct-calc-pad.ct-calc-sci{grid-template-columns:repeat(5,minmax(0,1fr));max-width:520px}
.ct-calc-pad[hidden]{display:none}
.ct-calc-key{min-height:48px;font:500 18px 'Inter',sans-serif;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:6px;cursor:pointer}
.ct-calc-key:hover{border-color:var(--accent)}.ct-calc-key:focus-visible{outline:3px solid var(--coral);outline-offset:2px}
.ct-calc-op{color:var(--accent)}.ct-calc-fn{color:var(--coral)}
.ct-calc-eq{background:var(--accent);color:#14231e;border-color:var(--accent);font-weight:700}
html[data-color-mode=light] .ct-calc-eq{color:#f2eee5}
.ct-calc-small{min-height:44px;font-size:14px}
.ct-calc-mem-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-width:420px;direction:ltr;margin:0 0 6px}
.ct-calc-history{list-style:none;margin:0 0 14px;padding:0;max-width:520px}
.ct-calc-hist-btn{width:100%;text-align:start;background:transparent;color:var(--ink);border:0;border-bottom:1px solid var(--line);min-height:44px;padding:8px 4px;font:15px 'Inter',monospace;cursor:pointer}
.ct-calc-hist-btn:hover{background:var(--surface)}
/* GPA and grades */
.ct-gpa-scale{margin:0 0 12px}
.ct-gpa-grade-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:8px;margin:0 0 8px;max-width:420px;align-items:center}
.ct-gpa-grade-row input,.ct-gpa-row input,.ct-gpa-row select,.ct-grade-row input{font:inherit;font-size:15px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:8px 10px;min-height:44px;max-width:100%;min-width:0}
.ct-gpa-head,.ct-gpa-row{display:grid;grid-template-columns:64px minmax(0,2fr) minmax(70px,.7fr) minmax(0,1.2fr) auto;gap:8px;align-items:center;margin:0 0 8px}
.ct-gpa-head{font-size:12px;color:var(--muted);margin-bottom:4px}
.ct-grade-head,.ct-grade-row{display:grid;grid-template-columns:64px minmax(0,2fr) minmax(70px,1fr) auto minmax(70px,.8fr) minmax(70px,.8fr) auto;gap:8px;align-items:center;margin:0 0 8px}
.ct-grade-head{font-size:12px;color:var(--muted);margin-bottom:4px}
.ct-grade-row .ct-j2p-hint{margin:0}
.ct-grade-num{direction:ltr;text-align:start}
.ct-gpa-grade-row button,.ct-gpa-row button,.ct-grade-row button{min-width:44px}
/* CV checker */
.ct-cv-textarea{width:100%;font:inherit;font-size:15px;line-height:1.7;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:12px;resize:vertical}
.ct-cv-textarea:focus-visible{outline:3px solid var(--coral);outline-offset:3px}
.ct-check-list{list-style:none;margin:12px 0;padding:0}
.ct-check{border:1px solid var(--line);border-inline-start-width:5px;border-radius:6px;padding:10px 16px;margin:0 0 10px;max-width:760px}
.ct-check p{margin:6px 0 0;font-size:14px}.ct-check .ct-j2p-hint{margin-top:2px}
.ct-check-pass{border-inline-start-color:#6fb28a}.ct-check-warn{border-inline-start-color:#e08f4e}.ct-check-info{border-inline-start-color:#6a9fc0}
.ct-check-tag{display:inline-block;font-size:12px;border:1px solid var(--line);border-radius:3px;padding:1px 8px;color:var(--muted)}
.ct-keywords{font-size:14px;line-height:2;max-width:760px}
/* CV builder and cover letter */
.cv-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start}
.cv-right{position:sticky;top:16px;min-width:0}
.cv-card{border:1px solid var(--line);border-radius:6px;padding:12px 14px;margin:0 0 12px;min-width:0}
.cv-card legend{padding:0 8px;font-size:13px;color:var(--muted)}
.cv-hints{margin:0 0 10px;padding-inline-start:20px;font-size:14px;color:var(--coral)}.cv-hints:empty{display:none}
.cv-preview{background:#d8d6cf;padding:14px;border-radius:6px;overflow:auto;max-height:80vh}
.cv-preview .ct-j2p-empty{color:#333;margin:0}
.ct-letter-out{min-height:320px}
.ct-letter-info p{margin:4px 0}
/* The CV and letter paper is always white with dark text, like a printed page */
.ct-cv-paper,.ct-letter-paper{background:#fff;color:#1b1b1b;font-family:'Tajawal','Inter',Arial,sans-serif;box-sizing:border-box;margin:0 auto;width:100%;max-width:210mm;padding:12mm 13mm;line-height:1.5;text-align:start}
.ct-cv-paper.is-letter{max-width:215.9mm}
.ct-cv-paper.fs-s{font-size:9.5pt}.ct-cv-paper.fs-m{font-size:10.5pt}.ct-cv-paper.fs-l{font-size:11.5pt}
.ct-cv-paper h1{font-size:2em;line-height:1.2;margin:0;color:#111}
.ct-cv-paper .cv-title{font-size:1.15em;margin:.15em 0 0;color:#444}
.ct-cv-paper .cv-contact{margin:.5em 0 0;font-size:.95em;color:#333;word-break:break-word}
.ct-cv-paper .cv-head{margin-bottom:.9em;padding-bottom:.6em;border-bottom:2px solid #1b1b1b}
.ct-cv-paper .cv-sec{margin:0 0 .9em}.ct-cv-paper .cv-sec h2{break-after:avoid}
.ct-cv-paper .cv-sec h2{font-size:1.05em;margin:0 0 .35em;padding-bottom:.15em;border-bottom:1px solid #bbb;text-transform:uppercase;letter-spacing:.04em;color:#111}
.ct-cv-paper[lang=ar] .cv-sec h2{text-transform:none;letter-spacing:0}
.ct-cv-paper .cv-entry{margin:0 0 .6em;break-inside:avoid}
.ct-cv-paper .cv-entry-head{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.ct-cv-paper .cv-dates{font-size:.9em;color:#555;white-space:nowrap}
.ct-cv-paper .cv-org{color:#444;font-size:.95em}
.ct-cv-paper ul{margin:.25em 0 0;padding-inline-start:1.3em}.ct-cv-paper li{margin:0 0 .15em}
.ct-cv-paper .cv-summary{margin:0}
.ct-cv-paper .cv-chips,.ct-cv-paper .cv-plain{list-style:none;padding:0;margin:0}
.ct-cv-paper .cv-chips{display:flex;flex-wrap:wrap;gap:.3em .5em}
.ct-cv-paper .cv-chips li{border:1px solid #bbb;border-radius:3px;padding:.05em .55em;margin:0}
.ct-cv-paper.tpl-modern .cv-cols{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(0,1fr);gap:1.4em}
.ct-cv-paper.tpl-modern .cv-side{background:#f3f2ee;padding:.8em;border-radius:3px;align-self:start}
.ct-cv-paper.tpl-modern .cv-side .cv-chips{flex-direction:column;gap:.2em}.ct-cv-paper.tpl-modern .cv-side .cv-chips li{border:0;padding:0}
.ct-cv-paper.tpl-modern .cv-head{border-bottom:0;border-inline-start:6px solid #1b1b1b;padding-inline-start:.7em}
.ct-letter-paper{font-size:11pt;line-height:1.7}.ct-letter-paper p{margin:0 0 1em}
@page cv-a4{size:A4;margin:0}@page cv-letter{size:letter;margin:0}
.ct-cv-paper.is-a4,.ct-letter-paper.is-a4{page:cv-a4}.ct-cv-paper.is-letter{page:cv-letter}
@media print{
 body.ct-printing{background:#fff!important}
 body.ct-printing>*:not(.ct-print-root){display:none!important}
 body.ct-printing .ct-print-root{display:block!important}
 .ct-print-root .ct-cv-paper,.ct-print-root .ct-letter-paper{max-width:none;width:auto;margin:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
@media(max-width:900px){.cv-layout{grid-template-columns:minmax(0,1fr)}.cv-right{position:static}.cv-preview{max-height:none}}
@media(max-width:760px){
 .ct-gpa-head,.ct-grade-head{display:none}
 .ct-gpa-row,.ct-grade-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-bottom:1px solid var(--line);padding-bottom:10px}
 .ct-gpa-row .ct-j2p-page,.ct-grade-row .ct-j2p-page{grid-column:1/-1}.ct-gpa-row .ct-gpa-name,.ct-grade-row .ct-gpa-name{grid-column:1/-1}
 .ct-calc-result{font-size:30px}.ct-bmi-value{font-size:36px}
 .ct-cv-paper,.ct-letter-paper{padding:8mm}.ct-cv-paper.tpl-modern .cv-cols{grid-template-columns:minmax(0,1fr)}
}

/* 1.2.0: store checkers and the priorities report */
.ct-link-button{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;text-decoration:none}
a.ct-j2p-secondary{color:var(--ink)}
.ct-tool-field textarea.ct-code-input{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;min-height:220px;width:100%;box-sizing:border-box;direction:ltr;text-align:left}
.ct-contact{border:1px solid var(--line);border-inline-start:5px solid var(--accent);border-radius:6px;padding:16px 20px;margin:24px 0;max-width:760px}
.ct-contact h2{font-size:20px;margin:0 0 8px}.ct-contact p{margin:0 0 10px;font-size:15px}
.ct-tools-group{font-size:26px;margin:8px 0 6px}.ct-tools-group-note{margin:0 0 18px}
.ct-jpg2pdf>.ct-j2p-app>.ct-j2p-hint{max-width:70ch}
.ct-jpg2pdf h2{font-size:22px;margin:24px 0 10px}
.ct-check input[type=checkbox]{width:20px;height:20px;vertical-align:middle;accent-color:var(--accent)}.ct-j2p-notice{border:1px solid var(--coral);border-inline-start-width:5px;border-radius:6px;padding:10px 16px;margin:0 0 20px;font-size:14px;max-width:760px}

/* 1.3.5 print fixes: a long section may continue on the next page (entries still stay whole); every printed page keeps the paper's top and bottom spacing
   (the page margin is 0 so browsers do not add their own header and footer); long unbroken contact text wraps inside the side column. */
@media print{.ct-print-root .ct-cv-paper,.ct-print-root .ct-letter-paper{-webkit-box-decoration-break:clone;box-decoration-break:clone}}
.ct-cv-paper.tpl-modern .cv-side{overflow-wrap:anywhere}

/* the top bar only holds the colour-mode button */
.ct-preview-bar{justify-content:flex-end}

/* visit counter switch (footer) */
.ct-count-switch{background:none;border:0;padding:0;margin-inline-start:1rem;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}
.ct-related{margin-top:2rem;padding-top:1rem;border-top:1px solid currentColor}
.ct-related h2{font-size:1.1rem;margin:0 0 .6rem}
.ct-related ul{margin:0;padding-inline-start:1.2rem}
.ct-related li{margin:.3rem 0}

/* footer: tool groups in a wide grid under the brand (2026-10-21) */
.ct-footer-main{grid-template-columns:minmax(0,1fr);gap:28px}
.ct-footer-links{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 24px}
.ct-footer-column p{overflow-wrap:anywhere}
@media(max-width:760px){.ct-footer-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}}
@media(max-width:480px){.ct-footer-links{grid-template-columns:minmax(0,1fr)}.ct-footer-column:last-child{grid-column:auto}}
/* index: group headings */
.ct-tools-page .ct-tools-group{margin-top:2.2rem}
