/* ==========================================================================
   RecruitFlow front-end design system (Primepower brand) — SP 2026-06-25
   Restyles the public careers pages over the existing theme. No markup hooks
   are changed; this is presentation only.
   ========================================================================== */
:root{
  --rf-navy:#0B2447;
  --rf-navy-2:#16335A;
  --rf-amber:#E0A82E;
  --rf-amber-ink:#3A2A05;
  --rf-ink:#1A2433;
  --rf-muted:#5B6776;
  --rf-line:#E1E6ED;
  --rf-bg:#F5F7FA;
  --rf-chip:#EAF0F7;
  --rf-radius:12px;
  --rf-shadow:0 6px 24px rgba(11,36,71,.08);
}
body{ background:#fff; color:var(--rf-ink); font-family:'Segoe UI',Roboto,Helvetica,Arial,sans-serif; }

/* ---- Topbar (kept dark so the inverse logo stays visible) ---------------- */
.topbar.topbar-inverse{ background:var(--rf-navy) !important; box-shadow:0 1px 0 rgba(255,255,255,.06); padding:.4rem 0; }
.topbar .topbar-brand img{ max-height:42px; width:auto; }
.topbar .btn-primary,.topbar .btn-default{ background:transparent !important; border:1px solid rgba(255,255,255,.5) !important; color:#fff !important; border-radius:8px; }
.topbar .btn-danger{ border-radius:8px; }

/* ---- Hero (all front pages) --------------------------------------------- */
header.bg-img-shape{ min-height:0 !important; height:auto !important; }
header.bg-img-shape .header.inner-header,
.header.inner-header,
.header{
  background-image:none !important;
  background:var(--rf-navy) !important;
  min-height:0 !important; height:auto !important;
  /* top clears the 90px absolute topbar; tight bottom removes the empty void */
  padding:118px 24px 54px !important;
}
/* theme sets .header{height:650px} + .header>.container{height:100%} which stretches
   the hero to a viewport-tall block — collapse the container to its content */
.header > .container,
.header.inner-header > .container{ height:auto !important; min-height:0 !important; }
.bg-img-shape:before,.bg-img-shape:after{ display:none !important; }
.header h1,.header h3,.header h4,.header .text-white{ color:#fff !important; }
.header h1{ font-weight:600; letter-spacing:-.01em; font-size:36px !important; line-height:1.15 !important; margin-bottom:10px !important; }
.header h3,.header h4{ font-size:18px !important; font-weight:400 !important; margin-bottom:10px !important; }
.header p{ color:#C7D3E0 !important; margin-bottom:18px !important; }
.header a u{ color:var(--rf-amber); text-decoration:none; }

/* ---- Hero search bar (job openings) ------------------------------------- */
.location-search{
  background:#fff !important; border-radius:12px !important; padding:8px !important;
  box-shadow:var(--rf-shadow); gap:4px; max-width:820px; margin:8px auto 0;
}
.location-search .location,.location-search .designation{ border-right:1px solid var(--rf-line); border-radius:0 !important; }
.location-search .myselect,.location-search select{ border:none !important; background:transparent; color:var(--rf-ink); font-size:14px; min-width:120px; height:46px; }
.location-search .search-btn{ width:auto !important; }
.location-search #search{
  background:var(--rf-amber) !important; color:var(--rf-amber-ink) !important; border:none !important;
  border-radius:8px !important; font-weight:600; letter-spacing:.3px; height:46px; padding:0 26px;
}
.location-search #search:hover{ filter:brightness(.96); }

/* ---- Sections ----------------------------------------------------------- */
.main-content .section{ padding:34px 0 28px !important; }
.section-header{ margin-bottom:22px !important; padding-bottom:0 !important; }
.section-header h2{ color:var(--rf-ink); font-weight:600; font-size:24px; margin-bottom:0; }
.section-header hr{ border-color:var(--rf-amber); max-width:64px; border-width:2px; opacity:1; margin:8px auto 0 !important; }
.section-header hr ~ hr{ display:none !important; } /* theme renders a duplicate <hr> */
#applicant-notes{ margin-top:4px; }

/* ---- Job cards (initial grid + load-more share .job-opening-card) -------- */
.job-opening-card{ display:block; height:100%; text-decoration:none !important; }
.job-opening-card .card-bordered{
  border:1px solid var(--rf-line) !important; border-left:3px solid var(--rf-amber) !important;
  border-radius:var(--rf-radius) !important; height:100%; transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease;
  box-shadow:none;
}
.job-opening-card:hover .card-bordered{ transform:translateY(-3px); box-shadow:var(--rf-shadow); border-color:var(--rf-navy) !important; }
.job-opening-card .card-block{ padding:18px 18px 16px; }
.job-opening-card .card-title{ color:var(--rf-ink) !important; font-weight:600; font-size:16px; margin-bottom:2px; }
.job-opening-card .company-title{ color:var(--rf-muted); display:block; margin-bottom:12px; font-size:12.5px; }
.job-opening-card .card-location{ gap:6px; }
.job-opening-card .card-location span{
  background:var(--rf-chip); color:var(--rf-navy) !important; font-size:11.5px !important; font-weight:500 !important;
  padding:4px 10px; border-radius:20px; display:inline-flex; align-items:center;
}
.job-opening-card .card-location span i{ color:var(--rf-navy); }
.job-opening-card .card-block:after{
  content:"View \0026 apply  \2192"; display:block; margin-top:14px; color:var(--rf-navy);
  font-size:13px; font-weight:600;
}
.job-opening-card:hover .card-block:after{ color:var(--rf-amber-ink); }
#no-data{ color:var(--rf-muted); }

/* ---- Load more ---------------------------------------------------------- */
#load_more_button{
  background:#fff !important; color:var(--rf-navy) !important; border:1px solid var(--rf-navy) !important;
  border-radius:8px !important; font-weight:600; padding:11px 28px;
  margin:20px auto 4px !important;
}
#load_more_button + .row, .main-content .section .row.gap-y:last-child{ margin-top:0 !important; }
#load_more_button:hover{ background:var(--rf-navy) !important; color:#fff !important; }

/* ---- New: trust strip + how-to-apply (added in job-openings) ------------- */
.rf-strip{ background:var(--rf-bg); padding:26px 0; }
.rf-trust{ display:flex; flex-wrap:wrap; justify-content:center; gap:18px; }
.rf-trust .rf-trust-item{ flex:1 1 200px; max-width:260px; text-align:center; }
.rf-trust i{ color:var(--rf-navy); font-size:26px; }
.rf-trust h6{ color:var(--rf-ink); font-weight:600; margin:8px 0 2px; font-size:14px; }
.rf-trust p{ color:var(--rf-muted); font-size:12.5px; margin:0; }
.rf-steps-wrap{ background:var(--rf-navy); padding:40px 0; }
.rf-steps-wrap h2{ color:#fff; font-weight:600; font-size:20px; text-align:center; margin-bottom:26px; }
.rf-steps{ display:flex; flex-wrap:wrap; gap:22px; justify-content:center; }
.rf-steps .rf-step{ flex:1 1 220px; max-width:300px; }
.rf-steps .rf-step .n{ color:var(--rf-amber); font-weight:700; font-size:14px; }
.rf-steps .rf-step h5{ color:#fff; font-size:15px; font-weight:600; margin:6px 0 3px; }
.rf-steps .rf-step p{ color:#9FB3C8; font-size:13px; margin:0; }

/* ---- Job detail --------------------------------------------------------- */
.main-content .bg-white.p-15{ border:1px solid var(--rf-line); border-radius:var(--rf-radius); padding:26px !important; }
.main-content .bg-white.p-15 h4{ color:var(--rf-ink); font-weight:600; }
.sidebar.bg-white{ border:1px solid var(--rf-line); border-radius:var(--rf-radius); overflow:hidden; }
.sidebar .bb-1{ border-bottom:1px solid var(--rf-line) !important; padding:16px 22px !important; }
.sidebar .text-dark{ color:var(--rf-ink) !important; }
.sidebar .text-color{ color:var(--rf-muted) !important; }
.badge-secondary{ background:var(--rf-chip) !important; color:var(--rf-navy) !important; font-weight:500; border-radius:20px; padding:5px 11px; }
.btn-primary,.theme-background.btn,.btn.theme-background{ background:var(--rf-navy) !important; border-color:var(--rf-navy) !important; color:#fff !important; border-radius:8px !important; font-weight:600; }
.sidebar .p-30 > .btn-primary,.sidebar .p-30 > .theme-background{ background:var(--rf-amber) !important; border-color:var(--rf-amber) !important; color:var(--rf-amber-ink) !important; }
.applyWithLinkedin{ border-radius:8px !important; }

/* ---- Apply form --------------------------------------------------------- */
#createForm h5{ color:var(--rf-ink); font-weight:600; }
#createForm .form-control{
  border:1px solid var(--rf-line); border-radius:8px; min-height:44px; background:#fff; color:var(--rf-ink);
  box-shadow:none; transition:border-color .12s ease, box-shadow .12s ease;
}
#createForm .form-control:focus{ border-color:var(--rf-navy); box-shadow:0 0 0 3px rgba(11,36,71,.12); }
#createForm .btn-primary,#createForm button[type=submit],#createForm .btn-success{
  background:var(--rf-amber) !important; border-color:var(--rf-amber) !important; color:var(--rf-amber-ink) !important;
  border-radius:8px !important; font-weight:600; padding:12px 30px;
}

/* ---- Footer ------------------------------------------------------------- */
.site-footer{ background:var(--rf-navy); color:#C7D3E0; padding:28px 0; }
.site-footer a,.site-footer span,.site-footer p{ color:#C7D3E0 !important; }
.site-footer a:hover{ color:#fff !important; }

@media (max-width:767px){
  .location-search{ flex-direction:column; gap:6px; }
  .location-search .location,.location-search .designation{ border-right:none; border-bottom:1px solid var(--rf-line); }
  .location-search #search{ width:100%; }
  .header.inner-header{ padding:44px 18px !important; }
}
