/* ==========================================================================
   KarirLuar.id — Fitur v1.6.0
   Visa (jenis & sponsor), profil perusahaan, scroll panel detail, tombol
   scroll cepat, umpan balik interaksi. Dimuat setelah typography.css.
   ========================================================================== */

/* ---------- Respons sentuhan yang lebih cepat ---------- */
a,button,select,input,label,summary{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.view-link,.category-tabs a,.region-chip,.apply-button,.primary-button,.light-button,.filter-submit,.search-submit,.icon-button,.main-nav a{transition:transform .08s ease,background-color .15s ease,color .15s ease,border-color .15s ease,opacity .15s ease}
.view-link:active,.category-tabs a:active,.region-chip:active,.apply-button:active,.primary-button:active,.light-button:active,.filter-submit:active,.search-submit:active,.icon-button:active{transform:scale(.97)}
.job-card{content-visibility:auto;contain-intrinsic-size:auto 340px}
.kl-navigating,.kl-navigating *{cursor:progress}

/* Bilah progres navigasi */
.kl-progress{position:fixed;top:0;left:0;height:3px;width:0;background:#3FA9F5;box-shadow:0 0 8px rgba(63,169,245,.6);z-index:9999;opacity:0;pointer-events:none}
.kl-progress.is-active{opacity:1;width:82%;transition:width 8s cubic-bezier(.1,.7,.2,1)}
.kl-progress.is-done{opacity:0;width:100%;transition:width .2s ease,opacity .3s ease .15s}

/* Menu header tetap satu baris */
.main-nav a{white-space:nowrap}

/* ---------- Chip visa ---------- */
.job-card-labels,.detail-labels,.mini-job-top{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;min-width:0}
.mini-job-top .mini-arrow{margin-left:auto}
.visa-chip,.visa-sponsor-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:2px;font-size:var(--kl-fs-meta,13px);font-weight:700;line-height:1.2;white-space:nowrap;max-width:100%}
.visa-chip{background:#EAF3FB;color:#0B5C9E;border:1px solid #CFE3F4}
.visa-chip svg{width:13px;height:13px;flex:none}
.visa-sponsor-chip.is-yes{background:#E4F5EA;color:#1E6B2C}
.visa-sponsor-chip.is-no{background:#F1F3F5;color:#52687A}
.detail-labels{margin:2px 0 14px}
.detail-panel .visa-chip{background:rgba(63,169,245,.14);color:#BFE1FB;border-color:rgba(63,169,245,.3)}
.detail-panel .visa-sponsor-chip.is-yes{background:rgba(64,190,110,.16);color:#9BE3B5}
.detail-panel .visa-sponsor-chip.is-no{background:rgba(255,255,255,.1);color:#C6D2DB}
.detail-panel .deadline-chip{background:rgba(255,255,255,.1);color:#DCE6EE}
.detail-panel .deadline-chip.is-urgent{background:rgba(232,179,61,.18);color:#F2CD79}
.detail-panel .deadline-chip.is-closed{background:rgba(229,139,139,.18);color:#F0A9A9}

/* ---------- Scroll panel detail (kolom kanan) ---------- */
#job-detail{scroll-margin-top:84px}
@media(min-width:1081px){
  .detail-panel{top:88px;max-height:calc(100vh - 104px);max-height:calc(100dvh - 104px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.28) transparent;scroll-behavior:auto}
  .detail-panel::-webkit-scrollbar{width:6px}
  .detail-panel::-webkit-scrollbar-thumb{background:rgba(255,255,255,.28);border-radius:6px}
  .detail-panel::-webkit-scrollbar-track{background:transparent}
}
.detail-panel{position:relative}
@media(min-width:1081px){.detail-panel{position:sticky}}
.detail-panel.is-loading{opacity:.55;pointer-events:none;transition:opacity .12s ease}
.detail-panel.is-loading::after{content:"";position:absolute;top:18px;right:58px;width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:kl-spin .7s linear infinite}
@keyframes kl-spin{to{transform:rotate(360deg)}}

/* ---------- Profil perusahaan ---------- */
.company-preview{margin:18px 0 6px}
.company-preview-card{margin-top:8px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);border-radius:4px;overflow:hidden}
.company-preview-cover{display:block;width:100%;height:auto;max-height:140px;object-fit:cover;background:rgba(255,255,255,.05)}
.company-preview-body{padding:12px 14px 13px}
.company-preview-title{display:block;font-family:var(--kl-font-head,inherit);font-size:var(--kl-fs-body,14px);line-height:1.3;color:#fff;overflow-wrap:anywhere}
.company-preview-desc{margin:6px 0 10px;font-size:var(--kl-fs-meta,13px);line-height:1.55;color:#C6D2DB;overflow-wrap:anywhere}
.company-preview-link{display:inline-flex;align-items:center;gap:6px;font-size:var(--kl-fs-meta,13px);font-weight:700;color:#7CC3F7;text-decoration:none;overflow-wrap:anywhere}
.company-preview-link svg{width:13px;height:13px;flex:none}
.company-preview-link:hover{text-decoration:underline}
.company-preview.is-loading .company-preview-desc{position:relative;color:transparent;background:linear-gradient(90deg,rgba(255,255,255,.08),rgba(255,255,255,.2),rgba(255,255,255,.08));background-size:200% 100%;animation:kl-shimmer 1.2s linear infinite;border-radius:3px;min-height:38px}
@keyframes kl-shimmer{to{background-position:-200% 0}}

/* ---------- Tombol scroll cepat ---------- */
.kl-quickscroll{position:fixed;right:14px;right:max(14px,env(safe-area-inset-right));bottom:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:60;display:flex;flex-direction:column;gap:8px}
.kl-quickscroll.is-idle{display:none}
.kl-qs-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid rgba(255,255,255,.18);border-radius:50%;background:rgba(11,13,16,.88);color:#fff;cursor:pointer;
  box-shadow:0 8px 20px rgba(11,13,16,.28);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:transform .1s ease,background-color .15s ease}
.kl-qs-btn[hidden]{display:none}
.kl-qs-btn svg{width:20px;height:20px}
.kl-qs-btn:hover{background:#0F75C5}
.kl-qs-btn:active{transform:scale(.92)}
.kl-qs-btn:focus-visible{outline:3px solid #3FA9F5;outline-offset:2px}
@media(max-width:720px){.kl-quickscroll{right:10px;bottom:calc(12px + env(safe-area-inset-bottom))}.kl-qs-btn{width:42px;height:42px}}
@media print{.kl-quickscroll,.kl-progress{display:none!important}}

/* v1.7.0 — link Contact Us (WhatsApp) di footer. Tata letak inti juga ada inline di footer.php agar
   tampilan tidak rusak bila CSS lama ter-cache atau ditimpa plugin; selector di sini hanya untuk hover/fokus/layar sempit. */
.site-footer .footer-contact{-webkit-tap-highlight-color:transparent;transition:background .16s,border-color .16s}
.site-footer .footer-contact .footer-contact-ico{display:block;flex:none;width:22px;height:22px;max-width:22px}
.site-footer .footer-contact:hover{background:rgba(255,255,255,.08);border-color:rgba(228,241,251,.5)}
.site-footer .footer-contact:focus-visible{outline:2px solid var(--kl-blue-bright);outline-offset:3px}
@media(min-width:721px){.site-footer .footer-contact{margin-left:auto}.footer-inner p{margin-right:0}}
@media(max-width:720px){.footer-inner .brand{order:1}.site-footer .footer-contact{order:2;margin-left:auto}.footer-inner p{order:3}.footer-inner>span{order:4}}
@media(max-width:340px){.site-footer .footer-contact{gap:7px!important;padding:0 13px 0 11px!important;font-size:13px!important}.site-footer .footer-contact .footer-contact-ico{width:20px!important;height:20px!important;max-width:20px!important}}

/* v1.8.0: pagination daftar lowongan */
.results-range{color:#8a9aa5;font-weight:500}
.kl-pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 14px;margin-top:6px;padding:16px 0 4px;border-top:1px solid #DFE7ED}
.kl-page-numbers{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.kl-pagination a,.kl-pagination .kl-page-num,.kl-pagination .kl-page-prev,.kl-pagination .kl-page-next{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 12px;border:1px solid #D6DFE7;background:#fff;color:#34404B;font-size:12px;font-weight:700;text-decoration:none;line-height:1}
.kl-pagination a:hover{border-color:var(--kl-blue);color:var(--kl-blue)}
.kl-pagination a:focus-visible{outline:2px solid var(--kl-blue);outline-offset:2px}
.kl-pagination .is-current{background:var(--kl-blue);border-color:var(--kl-blue);color:#fff}
.kl-pagination .is-disabled{color:#B5C1CA;background:#F6F8FA;cursor:default}
.kl-page-gap{color:#94A2AB;padding:0 2px;font-size:12px}
.kl-page-status{flex-basis:100%;color:#8a9aa5;font-size:11px;text-align:center}
@media(max-width:600px){
.kl-pagination{justify-content:center}
.kl-pagination a,.kl-pagination .kl-page-num,.kl-pagination .kl-page-prev,.kl-pagination .kl-page-next{min-width:44px;height:44px}
.kl-page-numbers{order:-1;flex-basis:100%;justify-content:center}
}
