:root {
  /* Blue */
  --brand-blue:        #0073f2;
  --brand-blue-dark:   #005ac8;
  --brand-blue-light:  #e6f0fe;

  /* Orange */
  --brand-orange:       #ffc300;
  --brand-orange-dark:  #cc9c00;
  --brand-orange-light: #fff8e0;

  /* Text */
  --text-dark:  #1f2937;
  --text-muted: #5b6774;
}
html,body{font-family:'Inter','Poppins',system-ui,sans-serif;color:var(--text-dark);}
body{font-size:1rem;line-height:1.6;background:#f7f9fc;}
h1,h2,h3,h4,h5{font-weight:700;letter-spacing:-.01em;}
a{color:var(--brand-blue);}
a:hover{color:var(--brand-blue-dark);}

.text-brand{color:var(--brand-blue)!important;}
.text-brang-orange{color:var(--brang-orange)!important;}
.bg-brand{background:var(--brand-blue)!important;color:#fff;}
.bg-brang-orange{background:var(--brang-orange)!important;color:#fff;}
.bg-brand-light{background:var(--brand-blue-light)!important;}
.btn-brand{background:var(--brand-blue);color:#fff;border:1px solid var(--brand-blue);}
.btn-brand:hover{background:var(--brand-blue-dark);color:#fff;border-color:var(--brand-blue-dark);}
.btn-outline-brand{color:var(--brand-blue);border:1px solid var(--brand-blue);background:#fff;}
.btn-outline-brand:hover{background:var(--brand-blue);color:#fff;}
.btn-brang-orange{background:var(--brang-orange);color:#fff;border:1px solid var(--brang-orange);}
.btn-brang-orange:hover{background:var(--brang-orange-dark);color:#fff;border-color:var(--brang-orange-dark);}
.badge-medical{background:var(--brand-blue-light);color:var(--brand-blue);}
.badge-nonmedical{background:var(--brang-orange-light);color:var(--brang-orange-dark);}

/* Navbar */
.navbar-brand-title{font-weight:800;color:var(--brand-blue)!important;letter-spacing:-.02em;}
.navbar-brand-title small{display:block;font-size:.65rem;font-weight:500;color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase;}
.navbar .nav-link{font-weight:500;color:var(--text-dark);}
.navbar .nav-link.active,.navbar .nav-link:hover{color:var(--brand-blue);}
.navbar{border-bottom:1px solid #e5e9f0;}

/* Hero */
.hero{background:linear-gradient(135deg,var(--brand-blue) 0%,var(--brand-blue-dark) 100%);color:#fff;padding:5rem 0 6rem;}
.hero h1{font-size:clamp(1.8rem,4vw,3rem);}
.hero .search-bar{background:#fff;border-radius:.75rem;padding:.75rem;box-shadow:0 10px 30px rgba(0,0,0,.15);}
.page-hero{background:var(--brand-blue-light);padding:2.5rem 0;border-bottom:1px solid #e5e9f0;}
.page-hero h1{color:var(--brand-blue);margin:0;}

/* Cards */
.card{border:1px solid #e5e9f0;border-radius:.75rem;}
.job-card{transition:.2s;height:100%;}
.job-card:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(10,92,168,.1);border-color:var(--brand-blue);}
.benefit-icon{width:56px;height:56px;border-radius:50%;background:var(--brand-blue-light);color:var(--brand-blue);display:inline-flex;align-items:center;justify-content:center;font-size:1.6rem;}

/* Footer */
footer.site-footer{background:#0b2540;color:#c9d3e0;padding:3rem 0 1rem;margin-top:4rem;}
footer.site-footer h5{color:#fff;font-size:1rem;text-transform:uppercase;letter-spacing:.05em;}
footer.site-footer a{color:#c9d3e0;text-decoration:none;}
footer.site-footer a:hover{color:#fff;}
footer .copyright{border-top:1px solid #1c3a5c;padding-top:1rem;margin-top:2rem;font-size:.85rem;color:#8a99ab;}

/* Auth */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--brand-blue-light),#fff);padding:2rem 1rem;}
.auth-card{width:100%;max-width:460px;background:#fff;border-radius:1rem;padding:2rem;box-shadow:0 10px 40px rgba(10,92,168,.12);}
.auth-logo{text-align:center;margin-bottom:1.25rem;}
.auth-logo a{text-decoration:none;color:var(--brand-blue);font-weight:800;font-size:1.25rem;}
.password-wrap{position:relative;}
.password-wrap .toggle-pw{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--text-muted);cursor:pointer;}
.strength-bar{height:6px;border-radius:3px;background:#e5e9f0;overflow:hidden;margin-top:.4rem;}
.strength-bar > span{display:block;height:100%;width:0;transition:.3s;}
.strength-weak{background:#dc3545;}
.strength-med{background:#f5b301;}
.strength-strong{background:var(--brang-orange);}

/* Stepper */
.stepper{display:flex;align-items:center;gap:0;flex-wrap:nowrap;overflow-x:auto;padding:1rem 0;}
.stepper .step{flex:1;min-width:120px;text-align:center;position:relative;}
.stepper .step .circle{width:44px;height:44px;border-radius:50%;background:#e5e9f0;color:#8a99ab;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem;margin-bottom:.5rem;}
.stepper .step.done .circle{background:var(--brang-orange);color:#fff;}
.stepper .step.current .circle{background:var(--brand-blue);color:#fff;box-shadow:0 0 0 4px rgba(10,92,168,.2);}
.stepper .step .label{font-size:.85rem;font-weight:600;color:var(--text-muted);}
.stepper .step.done .label,.stepper .step.current .label{color:var(--text-dark);}
.stepper .step:not(:last-child)::after{content:"";position:absolute;top:22px;left:calc(50% + 22px);right:calc(-50% + 22px);height:3px;background:#e5e9f0;z-index:-1;}
.stepper .step.done:not(:last-child)::after{background:var(--brang-orange);}

/* Sidebar (profile) */
.profile-sidebar .list-group-item{border:0;border-radius:.5rem!important;margin-bottom:.25rem;color:var(--text-dark);font-weight:500;}
.profile-sidebar .list-group-item.active{background:var(--brand-blue);color:#fff;}
.profile-sidebar .list-group-item i{margin-right:.6rem;}

/* Sticky apply */
.sticky-apply{position:sticky;top:80px;}

/* Doc checklist */
.doc-item{display:flex;align-items:center;gap:.75rem;padding:.6rem .8rem;border:1px solid #e5e9f0;border-radius:.5rem;margin-bottom:.5rem;background:#fff;}
.doc-item.required{border-left:4px solid var(--brand-blue);}
.doc-item.optional{border-left:4px solid #cbd3dc;}
.doc-item .req-badge{margin-left:auto;font-size:.75rem;font-weight:600;}

.avatar-lg{width:120px;height:120px;border-radius:50%;object-fit:cover;border:4px solid #fff;box-shadow:0 4px 12px rgba(0,0,0,.1);}
.avatar-sm{width:32px;height:32px;border-radius:50%;object-fit:cover;}

.section{padding:4rem 0;}
@media(max-width:768px){.hero{padding:3rem 0 4rem;}.section{padding:2.5rem 0;}}

/* ===== Loading state untuk form submit ===== */
.btn-loading {
  position: relative;
  pointer-events: none;
  opacity: 0.75;
}

.btn-loading .btn-text {
  visibility: hidden;
}

.btn-loading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  margin: -9px 0 0 -9px;
  border: 2px solid rgba(255, 255, 255, 0.5);
  border-top-color: #fff;
  border-radius: 50%;
  animation: btn-spin 0.6s linear infinite;
}

.btn-loading.btn-outline-brand::after,
.btn-loading.btn-light::after {
  border-color: rgba(0, 0, 0, 0.2);
  border-top-color: var(--brand-blue);
}

@keyframes btn-spin {
  to { transform: rotate(360deg); }
}

/* Overlay full-page untuk proses yang lebih berat (upload dokumen besar) */
#page-loading-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(255, 255, 255, 0.7);
  z-index: 9999;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 12px;
}

#page-loading-overlay.show {
  display: flex;
}

#page-loading-overlay .spinner-border {
  width: 3rem;
  height: 3rem;
  color: var(--brand-blue);
}

#page-loading-overlay .loading-text {
  color: var(--text-dark);
  font-size: 14px;
  font-weight: 500;
}