/* ═══════════════════════════════════════════════════
   WellnessCarePNS Careers Plugin — Front-End Styles
   ═══════════════════════════════════════════════════ */

:root {
  --wc-dk:   #114C38;
  --wc-teal: #418A91;
  --wc-coral:#E8603A;
  --wc-gold: #C07D28;
  --wc-dark: #1A1714;
  --wc-body: #4A443E;
  --wc-muted:#6B7280;
  --wc-off:  #F4FAF7;
  --wc-lt:   #E8F5EE;
  --wc-brd:  #D1E5DE;
  --wc-brd2: #C4DAD3;
  --wc-white:#FFFFFF;
  --wc-rad:  12px;
  --wc-fh:   'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --wc-shadow: 0 4px 20px rgba(17,76,56,.08);
  --wc-shadow-lg: 0 12px 40px rgba(17,76,56,.13);
}

.wcpns-careers-wrap,
.wcpns-job-wrap {
  font-family: var(--wc-fh);
  color: var(--wc-dark);
  line-height: 1.65;
  max-width: 1200px;
  margin: 0 auto;
}

/* ── Hero ────────────────────────────────────────── */
.wcpns-car-hero {
  background: linear-gradient(135deg, var(--wc-dk) 0%, #0C382B 100%);
  padding: 72px 40px;
  border-radius: var(--wc-rad);
  margin-bottom: 32px;
  position: relative;
  overflow: hidden;
}
.wcpns-car-hero::after {
  content: '';
  position: absolute;
  top: -30%;
  right: -5%;
  width: 400px;
  height: 400px;
  border-radius: 50%;
  background: rgba(65,138,145,.12);
  pointer-events: none;
}
.wcpns-car-hero-inner { position: relative; z-index: 1; max-width: 640px; }
.wcpns-car-eyebrow { font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.6); margin-bottom: 14px; }
.wcpns-car-h1 { font-size: clamp(2rem,4vw,3.2rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.1; color: #fff; margin: 0 0 14px; }
.wcpns-car-italic { font-style: italic; font-weight: 400; color: rgba(255,255,255,.8); }
.wcpns-car-sub { font-size: 1rem; color: rgba(255,255,255,.7); margin: 0; }

/* ── Search bar ──────────────────────────────────── */
.wcpns-car-search-wrap { background: var(--wc-white); border: 1px solid var(--wc-brd); border-radius: var(--wc-rad); padding: 24px; margin-bottom: 28px; box-shadow: var(--wc-shadow); }
.wcpns-car-search-grid { display: grid; grid-template-columns: 2fr 1.5fr 1fr 1fr auto; gap: 12px; align-items: flex-end; }
.wcpns-car-slabel { display: block; font-size: .67rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--wc-muted); margin-bottom: 5px; }
.wcpns-car-sinput, .wcpns-car-sselect {
  width: 100%; padding: 11px 14px;
  border: 1.5px solid var(--wc-brd);
  border-radius: 9px;
  font-family: var(--wc-fh);
  font-size: .88rem;
  color: var(--wc-dark);
  background: var(--wc-white);
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  box-sizing: border-box;
}
.wcpns-car-sinput::placeholder { color: var(--wc-brd2); }
.wcpns-car-sinput:focus, .wcpns-car-sselect:focus { border-color: var(--wc-dk); box-shadow: 0 0 0 3px rgba(17,76,56,.1); }
.wcpns-car-sselect { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236B7280' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; padding-right: 32px; }
.wcpns-car-sbtn { padding: 12px 24px; background: var(--wc-dk); color: var(--wc-white); border: none; border-radius: 9px; font-family: var(--wc-fh); font-size: .86rem; font-weight: 700; cursor: pointer; transition: background .2s, transform .2s; white-space: nowrap; }
.wcpns-car-sbtn:hover { background: #0C382B; transform: translateY(-1px); }
.wcpns-car-active-filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--wc-brd); }
.wcpns-car-filter-label { font-size: .72rem; color: var(--wc-muted); font-weight: 600; }
.wcpns-car-tag { background: var(--wc-lt); border: 1px solid var(--wc-brd); color: var(--wc-dk); font-size: .72rem; font-weight: 700; padding: 3px 10px; border-radius: 100px; }
.wcpns-car-clear-btn { font-size: .76rem; color: var(--wc-coral); font-weight: 700; text-decoration: none; transition: opacity .2s; }
.wcpns-car-clear-btn:hover { opacity: .7; }

/* ── Results ─────────────────────────────────────── */
.wcpns-car-results-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.wcpns-car-count { font-size: .82rem; color: var(--wc-muted); font-weight: 600; }
.wcpns-car-empty { text-align: center; padding: 64px 24px; background: var(--wc-off); border-radius: var(--wc-rad); border: 1px solid var(--wc-brd); }
.wcpns-car-empty-icon { font-size: 2.5rem; margin-bottom: 14px; }
.wcpns-car-empty h3 { font-size: 1.1rem; font-weight: 700; margin: 0 0 8px; }
.wcpns-car-empty p { color: var(--wc-muted); font-size: .9rem; }
.wcpns-car-empty a { color: var(--wc-dk); font-weight: 700; }

/* ── Job card grid ───────────────────────────────── */
.wcpns-car-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 18px; }
.wcpns-car-card { background: var(--wc-white); border: 1px solid var(--wc-brd); border-radius: var(--wc-rad); padding: 22px 22px 16px; box-shadow: var(--wc-shadow); transition: box-shadow .24s, transform .24s; display: flex; flex-direction: column; position: relative; }
.wcpns-car-card:hover { box-shadow: var(--wc-shadow-lg); transform: translateY(-3px); }
.wcpns-car-card--featured { border-color: var(--wc-dk); box-shadow: 0 0 0 2px rgba(17,76,56,.12); }
.wcpns-car-featured-badge { position: absolute; top: -1px; right: 16px; background: var(--wc-dk); color: #fff; font-size: .64rem; font-weight: 700; padding: 3px 10px; border-radius: 0 0 6px 6px; }
.wcpns-car-card-top { display: flex; gap: 7px; margin-bottom: 10px; flex-wrap: wrap; }
.wcpns-car-pillar-badge { font-size: .67rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; padding: 3px 10px; border-radius: 100px; border: 1px solid; }
.wcpns-car-remote-badge { background: var(--wc-off); color: var(--wc-dk); border: 1px solid var(--wc-brd); font-size: .67rem; font-weight: 600; padding: 3px 10px; border-radius: 100px; }
.wcpns-car-card-title { font-size: 1.05rem; font-weight: 800; margin: 0 0 10px; line-height: 1.3; }
.wcpns-car-card-title a { color: var(--wc-dark); text-decoration: none; transition: color .2s; }
.wcpns-car-card-title a:hover { color: var(--wc-dk); }
.wcpns-car-card-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.wcpns-car-meta-item { font-size: .78rem; color: var(--wc-muted); }
.wcpns-salary { color: var(--wc-dk) !important; font-weight: 600; }
.wcpns-car-card-sector { font-size: .74rem; color: var(--wc-muted); margin-bottom: 12px; border-top: 1px solid var(--wc-brd); padding-top: 10px; margin-top: 4px; }
.wcpns-car-card-footer { display: flex; justify-content: space-between; align-items: center; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--wc-brd); flex-wrap: wrap; gap: 6px; }
.wcpns-car-posted { font-size: .72rem; color: var(--wc-muted); }
.wcpns-car-closing-soon { font-size: .72rem; color: var(--wc-coral); font-weight: 700; }
.wcpns-car-apply-link { font-size: .78rem; font-weight: 700; text-decoration: none; transition: opacity .2s; }
.wcpns-car-apply-link:hover { opacity: .75; }

/* ── Pagination ──────────────────────────────────── */
.wcpns-car-pagination { display: flex; gap: 6px; justify-content: center; margin-top: 28px; flex-wrap: wrap; }
.wcpns-car-page-btn { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border: 1.5px solid var(--wc-brd); border-radius: 8px; font-size: .82rem; font-weight: 700; color: var(--wc-body); text-decoration: none; transition: all .18s; }
.wcpns-car-page-btn:hover, .wcpns-car-page-btn.active { background: var(--wc-dk); color: #fff; border-color: var(--wc-dk); }

/* ═══ SINGLE JOB PAGE ═══════════════════════════════ */

.wcpns-job-breadcrumb { font-size: .8rem; color: var(--wc-muted); margin-bottom: 24px; display: flex; align-items: center; gap: 8px; }
.wcpns-job-breadcrumb a { color: var(--wc-dk); font-weight: 700; text-decoration: none; }
.wcpns-job-breadcrumb a:hover { text-decoration: underline; }
.wcpns-bc-sep { color: var(--wc-brd2); }

.wcpns-job-layout { display: grid; grid-template-columns: 1fr 320px; gap: 32px; align-items: start; }

/* Header */
.wcpns-job-header { margin-bottom: 32px; }
.wcpns-job-badges { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.wcpns-job-pillar-badge, .wcpns-job-remote-badge, .wcpns-job-featured-badge { font-size: .68rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; padding: 4px 12px; border-radius: 100px; }
.wcpns-job-remote-badge { background: var(--wc-off); color: var(--wc-dk); border: 1px solid var(--wc-brd); }
.wcpns-job-featured-badge { background: var(--wc-dk); color: #fff; }
.wcpns-job-title { font-size: clamp(1.6rem,3.5vw,2.6rem); font-weight: 800; letter-spacing: -.025em; line-height: 1.12; margin: 0 0 16px; color: var(--wc-dark); }
.wcpns-job-meta-row { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 10px; }
.wcpns-job-meta { font-size: .84rem; color: var(--wc-muted); }
.wcpns-job-meta.wcpns-salary { color: var(--wc-dk); font-weight: 700; }
.wcpns-job-meta-sub { font-size: .76rem; color: var(--wc-muted); display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 20px; }
.wcpns-job-closing { color: var(--wc-coral); font-weight: 700; }
.wcpns-job-apply-top { margin-top: 20px; }
.wcpns-job-apply-btn { display: inline-flex; align-items: center; padding: 13px 28px; border-radius: 100px; color: #fff; font-family: var(--wc-fh); font-size: .88rem; font-weight: 700; text-decoration: none; transition: opacity .2s, transform .2s; box-shadow: 0 4px 16px rgba(17,76,56,.22); }
.wcpns-job-apply-btn:hover { opacity: .88; transform: translateY(-2px); color: #fff; }

/* Sections */
.wcpns-job-section { margin-bottom: 36px; padding: 28px 32px; background: var(--wc-white); border: 1px solid var(--wc-brd); border-radius: var(--wc-rad); box-shadow: var(--wc-shadow); }
.wcpns-job-section-number { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 8px; }
.wcpns-job-section-title { font-size: 1.3rem; font-weight: 800; margin: 0 0 16px; }
.wcpns-job-section-body { font-size: .95rem; color: var(--wc-body); line-height: 1.78; }
.wcpns-job-section-body p { margin: 0 0 12px; }
.wcpns-job-section-body ul, .wcpns-job-section-body ol { padding-left: 24px; margin: 0 0 12px; }
.wcpns-job-section-body li { margin-bottom: 6px; }

/* Apply section */
.wcpns-apply-section { margin-top: 40px; }
.wcpns-apply-header { border-left: 4px solid var(--wc-dk); padding: 20px 24px; background: var(--wc-off); border-radius: 0 var(--wc-rad) var(--wc-rad) 0; margin-bottom: 24px; }
.wcpns-apply-title { font-size: 1.5rem; font-weight: 800; margin: 0 0 6px; }
.wcpns-apply-sub { font-size: .88rem; color: var(--wc-muted); margin: 0; }

/* Application form */
.wcpns-apply-form { background: var(--wc-white); border: 1px solid var(--wc-brd); border-radius: var(--wc-rad); padding: 32px; box-shadow: var(--wc-shadow); }
.wcpns-form-section-label { font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; color: var(--wc-dk); background: var(--wc-lt); border: 1px solid var(--wc-brd); border-radius: 6px; padding: 6px 14px; margin: 20px 0 14px; display: inline-block; }
.wcpns-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.wcpns-form-field { margin-bottom: 14px; }
.wcpns-flabel { display: block; font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--wc-muted); margin-bottom: 5px; }
.wcpns-flabel .req { color: var(--wc-coral); }
.wcpns-optional { font-weight: 400; text-transform: none; letter-spacing: 0; font-size: .68rem; }
.wcpns-finput, .wcpns-fselect, .wcpns-ftextarea {
  width: 100%; padding: 11px 14px;
  border: 1.5px solid var(--wc-brd);
  border-radius: 9px;
  font-family: var(--wc-fh);
  font-size: .88rem;
  color: var(--wc-dark);
  background: var(--wc-white);
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  box-sizing: border-box;
}
.wcpns-finput::placeholder, .wcpns-ftextarea::placeholder { color: #C4D4CE; }
.wcpns-finput:focus, .wcpns-fselect:focus, .wcpns-ftextarea:focus { border-color: var(--wc-dk); box-shadow: 0 0 0 3px rgba(17,76,56,.1); }
.wcpns-finput.wcpns-error, .wcpns-fselect.wcpns-error { border-color: var(--wc-coral); }
.wcpns-fselect { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236B7280' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; padding-right: 32px; }
.wcpns-ftextarea { resize: vertical; min-height: 100px; }
.wcpns-ferr { display: block; font-size: .71rem; color: var(--wc-coral); font-weight: 600; margin-top: 4px; }

/* File upload drop zone */
.wcpns-file-drop { border: 2px dashed var(--wc-brd); border-radius: 10px; padding: 24px 20px; text-align: center; background: var(--wc-off); cursor: pointer; transition: border-color .2s, background .2s; }
.wcpns-file-drop:hover, .wcpns-file-drop.dragover { border-color: var(--wc-dk); background: var(--wc-lt); }
.wcpns-file-drop-icon { font-size: 1.8rem; margin-bottom: 8px; }
.wcpns-file-drop-text { font-size: .88rem; color: var(--wc-body); margin-bottom: 4px; }
.wcpns-file-browse { color: var(--wc-dk); font-weight: 700; cursor: pointer; text-decoration: underline; }
.wcpns-file-drop-hint { font-size: .72rem; color: var(--wc-muted); }
.wcpns-file-selected { margin-top: 10px; padding: 8px 14px; background: var(--wc-lt); border-radius: 6px; font-size: .82rem; color: var(--wc-dk); font-weight: 600; }

/* Consent */
.wcpns-consent-block { margin-top: 14px; }
.wcpns-checkbox-label { display: flex; align-items: flex-start; gap: 10px; font-size: .84rem; color: var(--wc-body); line-height: 1.6; cursor: pointer; }
.wcpns-checkbox-label input[type="checkbox"] { accent-color: var(--wc-dk); margin-top: 3px; flex-shrink: 0; width: 16px; height: 16px; }
.wcpns-checkbox-label a { color: var(--wc-dk); }
.wcpns-checkbox-label .req { color: var(--wc-coral); }

/* Submit */
.wcpns-form-submit-row { margin-top: 22px; }
.wcpns-submit-btn { display: inline-flex; align-items: center; gap: 8px; padding: 14px 32px; border-radius: 100px; border: none; color: #fff; font-family: var(--wc-fh); font-size: .9rem; font-weight: 700; cursor: pointer; transition: opacity .2s, transform .2s; box-shadow: 0 4px 18px rgba(17,76,56,.25); }
.wcpns-submit-btn:hover { opacity: .88; transform: translateY(-2px); }
.wcpns-submit-btn:disabled { opacity: .6; cursor: not-allowed; transform: none; }

/* Success/Error */
.wcpns-apply-success { text-align: center; padding: 32px 24px; background: var(--wc-lt); border: 1px solid var(--wc-brd); border-radius: var(--wc-rad); margin-top: 16px; }
.wcpns-success-icon { font-size: 2.5rem; margin-bottom: 10px; }
.wcpns-apply-success h3 { font-size: 1.2rem; font-weight: 800; margin: 0 0 8px; color: var(--wc-dk); }
.wcpns-success-body { font-size: .9rem; color: var(--wc-body); }
.wcpns-apply-error { background: #FFF0EE; border: 1px solid #F5C4B3; border-radius: 9px; padding: 12px 16px; font-size: .86rem; color: var(--wc-coral); margin-top: 14px; }

/* ── Sidebar ─────────────────────────────────────── */
.wcpns-job-sidebar { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 90px; }
.wcpns-sidebar-card { background: var(--wc-white); border: 1px solid var(--wc-brd); border-radius: var(--wc-rad); padding: 22px; box-shadow: var(--wc-shadow); }
.wcpns-sidebar-apply { border-top-width: 4px; border-top-style: solid; }
.wcpns-sidebar-apply h3 { font-size: 1rem; font-weight: 800; margin: 0 0 6px; }
.wcpns-sidebar-apply p { font-size: .82rem; color: var(--wc-muted); margin: 0 0 14px; }
.wcpns-sidebar-apply-btn { display: block; text-align: center; padding: 12px; border-radius: 100px; color: #fff; font-family: var(--wc-fh); font-size: .86rem; font-weight: 700; text-decoration: none; transition: opacity .2s; }
.wcpns-sidebar-apply-btn:hover { opacity: .85; color: #fff; }
.wcpns-sidebar-card-title { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--wc-muted); margin: 0 0 12px; }
.wcpns-sidebar-details { display: flex; flex-direction: column; gap: 8px; }
.wcpns-sd-row { display: flex; justify-content: space-between; font-size: .82rem; color: var(--wc-body); }
.wcpns-sd-label { color: var(--wc-muted); }
.wcpns-sidebar-about { font-size: .82rem; color: var(--wc-body); line-height: 1.6; margin: 0 0 12px; }
.wcpns-sidebar-link { font-size: .82rem; color: var(--wc-dk); font-weight: 700; text-decoration: none; }
.wcpns-sidebar-link:hover { text-decoration: underline; }

/* ── Responsive ──────────────────────────────────── */
@media (max-width: 1024px) {
  .wcpns-job-layout { grid-template-columns: 1fr; }
  .wcpns-job-sidebar { position: static; }
  .wcpns-car-search-grid { grid-template-columns: 1fr 1fr; }
  .wcpns-car-search-grid .wcpns-search-keyword { grid-column: 1 / -1; }
  .wcpns-car-sbtn { grid-column: 1 / -1; }
}
@media (max-width: 680px) {
  .wcpns-car-hero { padding: 44px 22px; }
  .wcpns-car-search-grid { grid-template-columns: 1fr; }
  .wcpns-car-search-grid .wcpns-search-keyword { grid-column: 1; }
  .wcpns-car-grid { grid-template-columns: 1fr; }
  .wcpns-form-row { grid-template-columns: 1fr; }
  .wcpns-apply-form { padding: 20px 16px; }
  .wcpns-job-section { padding: 20px 18px; }
}