/* Naeem Insights V5.4.3 — Tools UX & performance polish
   Presentation-first update. Tool calculations, Supabase, CMS, portals and footer content remain unchanged. */

:root{--ni-header-offset:84px}
@media(max-width:700px){:root{--ni-header-offset:74px}}

/* Keep all sticky secondary browsers directly below the real sticky header. */
body[data-page="tools"] .tools-command-wrap-v431,
body[data-page="tools"] .tool-detail-finder-v433,
body[data-page="services"] .svc-v538-browser-wrap,
body[data-page="knowledge"] .kh-v5313-browser-wrap,
body[data-page="knowledge-article"] .kh-v5313-browser-wrap,
body[data-page="cms-article"] .kh-v5313-browser-wrap,
body[data-page="solutions"] .sol-v535-browser-wrap{
  top:var(--ni-header-offset)!important;
}

/* Header remains scalable when an Admin-created public tab is present. */
.nav-cta{white-space:nowrap!important}
.primary-nav:has([data-cms-page]){gap:clamp(7px,.8vw,13px)!important}
.primary-nav:has([data-cms-page]) a{font-size:12px!important;padding-inline:4px!important}
.nav-shell:has([data-cms-page]){gap:12px!important}
.nav-shell:has([data-cms-page]) .nav-actions{gap:9px!important}
.nav-shell:has([data-cms-page]) .nav-cta{padding-inline:12px!important}
@media(max-width:1120px){.primary-nav:has([data-cms-page]) a{font-size:14px!important;padding:11px 12px!important}}

/* HTML hidden must always win. Several tool panels previously consumed space while hidden. */
body[data-page="tools"] [hidden]{display:none!important}

/* ---------- Tools Hub ---------- */
body[data-page="tools"] .breadcrumb{padding-top:4px!important;padding-bottom:3px!important}
body[data-page="tools"] .tools-live-hero{padding-top:12px!important;padding-bottom:14px!important}
body[data-page="tools"] .tools-live-hero .page-hero-grid{gap:18px!important;align-items:center!important}
body[data-page="tools"] .tools-live-hero h1{font-size:clamp(30px,3.1vw,40px)!important;line-height:1.08!important;margin-bottom:6px!important}
body[data-page="tools"] .tools-live-hero p{font-size:12.5px!important;line-height:1.55!important}
.tools-v543-hero-summary{min-height:0!important;display:block!important}
.tools-v543-summary-card{padding:13px;border:1px solid #dbe6f3;border-radius:15px;background:linear-gradient(145deg,#fff,#f5f9ff);box-shadow:0 10px 24px rgba(14,54,103,.055)}
.tools-v543-summary-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}
.tools-v543-summary-head span{color:#1763bf;font-size:8px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.tools-v543-summary-head a{color:#145cad;font-size:9px;font-weight:800;text-decoration:none}
.tools-v543-summary-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}
.tools-v543-summary-grid div{padding:9px;border:1px solid #dfe8f2;border-radius:10px;background:#fff}
.tools-v543-summary-grid strong{display:block;color:#0a2d5b;font-size:17px;line-height:1.05}
.tools-v543-summary-grid small{display:block;margin-top:3px;color:#687c94;font-size:8.2px;line-height:1.3}
.tools-v543-summary-cats{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.tools-v543-summary-cats span{padding:4px 7px;border:1px solid #dce7f3;border-radius:999px;background:#f8fbff;color:#3e5d7c;font-size:7.8px;font-weight:720}
body[data-page="tools"] .tools-command-wrap-v431{padding-top:4px!important;padding-bottom:4px!important}
body[data-page="tools"] .tools-command-v431{padding:6px 8px!important}
body[data-page="tools"] .quick-tools-v431{margin-top:4px!important;padding-top:4px!important}
body[data-page="tools"] .tools-v5310-browser-head{margin-bottom:4px!important}
body[data-page="tools"] .tools-v5310-browser a{min-height:28px!important;padding:4px 8px!important;font-size:9px!important}
body[data-page="tools"] .tools-category-v431{scroll-margin-top:178px}

/* Hub cards: readable descriptions without making cards tall. */
body[data-page="tools"] .tool-card-v431{min-height:112px!important;padding:11px!important}
body[data-page="tools"] .tool-card-v431 h3{font-size:12.2px!important;line-height:1.25!important}
body[data-page="tools"] .tool-card-v431 p{font-size:10.3px!important;line-height:1.43!important}
body[data-page="tools"] .tool-card-v431-copy>strong{font-size:9.3px!important}
body[data-page="tools"] .tool-card-v431-topline span{font-size:7.6px!important}
body[data-page="tools"] .category-heading-v431>p{font-size:11px!important;line-height:1.55!important}
body[data-page="tools"] .tools-v539-category-chips span{font-size:8.7px!important}

/* ---------- Individual Tool Pages ---------- */
body[data-page="tools"][data-tool] .tool-detail-finder-v433{padding-top:3px!important;padding-bottom:3px!important}
body[data-page="tools"][data-tool] .tool-detail-finder-inner-v433{min-height:36px!important}
body[data-page="tools"][data-tool] .breadcrumb{padding-top:3px!important;padding-bottom:2px!important}
body[data-page="tools"][data-tool] .tool-detail-hero-v434{padding-top:9px!important;padding-bottom:7px!important}
body[data-page="tools"][data-tool] .tool-detail-hero-v434 h1{font-size:clamp(29px,2.8vw,38px)!important;line-height:1.08!important;margin:4px 0 5px!important}
body[data-page="tools"][data-tool] .tool-detail-hero-v434 p{max-width:920px!important;font-size:13.2px!important;line-height:1.55!important}
body[data-page="tools"][data-tool] .tool-detail-badges{margin-top:6px!important;gap:5px!important}
body[data-page="tools"][data-tool] .tool-detail-badges span{padding:5px 8px!important;font-size:9px!important}
body[data-page="tools"][data-tool] .tool-workspace-section-v434{padding-top:5px!important;padding-bottom:10px!important}
body[data-page="tools"][data-tool] .tool-workspace-section-v434 .tool-workspace{padding:14px 16px 16px!important;border-radius:14px!important}
body[data-page="tools"][data-tool] .tool-workspace-label-v434{margin-bottom:8px!important;padding-bottom:7px!important}
body[data-page="tools"][data-tool] .tool-workspace-label-v434 span{font-size:8.6px!important}
body[data-page="tools"][data-tool] .tool-workspace-label-v434 strong{font-size:10.3px!important}
body[data-page="tools"][data-tool] .workspace-head{margin-bottom:10px!important}
body[data-page="tools"][data-tool] .workspace-head h2{font-size:clamp(19px,1.8vw,24px)!important}
body[data-page="tools"][data-tool] .workspace-head .kicker{font-size:8.7px!important}
body[data-page="tools"][data-tool] .tool-form-grid{gap:8px!important}
body[data-page="tools"][data-tool] .tool-form-grid label,
body[data-page="tools"][data-tool] .full-field,
body[data-page="tools"][data-tool] .inline-fields label{font-size:11.5px!important;gap:5px!important}
body[data-page="tools"][data-tool] .tool-form-grid input,
body[data-page="tools"][data-tool] .tool-form-grid select,
body[data-page="tools"][data-tool] .inline-fields input,
body[data-page="tools"][data-tool] .gpa-row input,
body[data-page="tools"][data-tool] .gpa-row select{min-height:39px!important;padding:8px 10px!important;font-size:12px!important}
body[data-page="tools"][data-tool] .full-field textarea{font-size:13px!important;line-height:1.55!important}
body[data-page="tools"][data-tool] .tool-action{margin-top:10px!important;min-height:40px!important;font-size:11px!important}
body[data-page="tools"][data-tool] .button.button-small{font-size:10px!important}
body[data-page="tools"][data-tool] .tool-result,
body[data-page="tools"][data-tool] .decision-result{padding:10px 12px!important;margin-top:9px!important}
body[data-page="tools"][data-tool] .tool-result .result-label,
body[data-page="tools"][data-tool] .decision-result .result-label{font-size:8.5px!important}
body[data-page="tools"][data-tool] .tool-result small{font-size:10.2px!important}
body[data-page="tools"][data-tool] .decision-result p,
body[data-page="tools"][data-tool] .decision-result li{font-size:10.8px!important;line-height:1.48!important}
body[data-page="tools"][data-tool] .tool-source-note{font-size:10.2px!important;line-height:1.45!important}
body[data-page="tools"][data-tool] .tool-caution{padding:8px 10px!important;font-size:10.3px!important;line-height:1.45!important}
body[data-page="tools"][data-tool] .tool-status-line{min-height:0!important;font-size:10.8px!important;line-height:1.4!important}
body[data-page="tools"][data-tool] .tool-status-line:empty{display:none!important;margin:0!important;padding:0!important}

/* Do not reserve vertical area for empty output/list containers. */
body[data-page="tools"][data-tool] .selected-file-list:empty,
body[data-page="tools"][data-tool] .pdf-image-output:empty,
body[data-page="tools"][data-tool] #pdf-image-output:empty,
body[data-page="tools"][data-tool] #images-pdf-list:empty,
body[data-page="tools"][data-tool] #pdf-merge-list:empty{display:none!important;margin:0!important;padding:0!important}
body[data-tool="docx-to-pdf"] .docx-preview-v473:has(#docx-pdf-preview[hidden]){display:none!important}

/* Long text outputs stay compact before results exist, then expand naturally. */
body[data-tool="ocr-image"] #ocr-output:placeholder-shown,
body[data-tool="pdf-text-extractor"] #pdf-text-output:placeholder-shown{min-height:82px!important;height:82px!important}
body[data-tool="ocr-image"] #ocr-output:not(:placeholder-shown),
body[data-tool="pdf-text-extractor"] #pdf-text-output:not(:placeholder-shown){min-height:210px!important;height:auto!important}

/* Output metric blocks only appear after their values have actually changed. */
body[data-tool="loan-mortgage-calculator"] .loan-results-v480:not(.tool-v543-ready),
body[data-tool="gpa-calculator"] #gpa-result:not(.tool-v543-ready),
body[data-tool="speed-latency-test"] .speed-summary-v480:not(.tool-v543-ready){display:none!important}

/* How-to / search-topic content is retained, but moved below the working tool. */
.tool-v543-guide-strip{padding-top:0!important;padding-bottom:10px!important}
.tool-v543-guide-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:8px;padding:10px 11px;border:1px solid #dce7f3;border-radius:11px;background:linear-gradient(180deg,#fff,#fbfdff)}
.tool-v543-guide-title{display:block;margin-bottom:5px;color:#1763bd;font-size:8px;font-weight:850;letter-spacing:.07em;text-transform:uppercase}
.tool-v543-guide-grid .tool-steps-v434{margin:0!important;gap:5px!important}
.tool-v543-guide-grid .tool-steps-v434>div{min-height:31px!important;padding:5px 7px!important}
.tool-v543-guide-grid .tool-steps-v434 span{width:22px!important;height:22px!important;font-size:8px!important}
.tool-v543-guide-grid .tool-steps-v434 strong{font-size:10.2px!important;line-height:1.3!important}
.tool-v543-guide-grid .tool-v539-keywords{margin:0!important;align-content:start}
.tool-v543-guide-grid .tool-v539-keywords span{min-height:24px!important;padding:4px 7px!important;font-size:9px!important}

/* Lower contextual cards: readable but still compact. */
body[data-page="tools"][data-tool] .tool-v539-info-section{padding-top:8px!important;padding-bottom:13px!important}
body[data-page="tools"][data-tool] .tool-v539-info-grid .tool-info-card{padding:10px 11px!important}
body[data-page="tools"][data-tool] .tool-v539-info-grid h2{font-size:14px!important}
body[data-page="tools"][data-tool] .tool-v539-about p:last-child{font-size:10.5px!important;line-height:1.5!important}
body[data-page="tools"][data-tool] .tool-v539-related .related-tool-link strong{font-size:9.7px!important}
body[data-page="tools"][data-tool] .tool-v539-related .related-tool-link span{font-size:8.6px!important}
body[data-page="tools"][data-tool] .tool-v539-service-links strong{font-size:9.2px!important}
body[data-page="tools"][data-tool] .tool-v539-service-links span{font-size:8px!important}

@media(max-width:900px){
  .tool-v543-guide-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
  body[data-page="tools"] .tools-live-hero .page-hero-grid{grid-template-columns:1fr!important}
  .tools-v543-hero-summary{display:none!important}
  body[data-page="tools"][data-tool] .tool-detail-hero-v434{padding-top:7px!important}
  body[data-page="tools"][data-tool] .tool-workspace-section-v434 .tool-workspace{padding:12px!important}
  body[data-page="tools"][data-tool] .tool-form-grid label,
  body[data-page="tools"][data-tool] .full-field,
  body[data-page="tools"][data-tool] .inline-fields label{font-size:12px!important}
  body[data-page="tools"][data-tool] .tool-form-grid input,
  body[data-page="tools"][data-tool] .tool-form-grid select{font-size:13px!important}
  .tool-v543-guide-grid .tool-steps-v434{grid-template-columns:1fr!important}
}

/* Tool-specific textarea heights: compact initial workspace, still comfortable for input. */
body[data-tool="qr-code-generator"] #qr-text{min-height:96px!important;height:96px!important}
body[data-tool="word-counter"] #word-text,
body[data-tool="reading-time"] #reading-text,
body[data-tool="text-case-converter"] #case-text{min-height:130px!important;height:130px!important}