/* BolsaJob V25 — Sincronización REAL de secciones internas con el front principal.
   Este archivo debe cargarse DESPUÉS de styles.css y DESPUÉS de cualquier <style> interno.
*/
:root{
  --bj-red:#e30613;
  --bj-red-dark:#bd0010;
  --bj-navy:#0a2f57;
  --bj-navy-2:#0e3a66;
  --bj-navy-3:#123f6d;
  --bj-cyan:#76e7f4;
  --bj-aqua:#45cfe2;
  --bj-green:#50d3a6;
  --bj-bg:#f4f6f8;
  --bj-bg-2:#eef2f6;
  --bj-white:#ffffff;
  --bj-text:#132033;
  --bj-muted:#65758a;
  --bj-line:#d8e1eb;
  --bj-shadow:0 18px 42px rgba(7,24,43,.10);
  --bj-shadow-soft:0 10px 25px rgba(7,24,43,.07);
  --bj-radius:24px;
  --bj-font:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body,
body.login-body,
body:has(.shell),
body:has(.admin-wrap){
  margin:0!important;
  font-family:var(--bj-font)!important;
  color:var(--bj-text)!important;
  background:
    radial-gradient(circle at 10% 0%, rgba(118,231,244,.16), transparent 29rem),
    linear-gradient(180deg,var(--bj-bg) 0%, var(--bj-bg-2) 100%)!important;
  min-height:100vh!important;
}
body *{font-family:var(--bj-font)!important}
a{color:var(--bj-navy)!important;text-decoration:none!important}
p,.muted,.note,.msg,small{color:var(--bj-muted)!important;line-height:1.55!important}
h1,h2,h3,h4,h5,h6{color:var(--bj-text)!important;letter-spacing:-.035em!important}

/* =========================
   LOGIN
========================= */
body.login-body{
  display:grid!important;
  place-items:center!important;
  padding:24px!important;
}
.login-card{
  width:min(540px,calc(100vw - 32px))!important;
  padding:30px!important;
  background:#fff!important;
  color:var(--bj-text)!important;
  border:1px solid var(--bj-line)!important;
  border-radius:26px!important;
  box-shadow:var(--bj-shadow)!important;
  backdrop-filter:none!important;
}
.login-card .brand span,
.brand span,
.badge{
  background:linear-gradient(135deg,var(--bj-red),#ff4b55)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.55)!important;
  box-shadow:0 12px 22px rgba(227,6,19,.18)!important;
}
.login-card .brand small,
.brand small,
.eyebrow,.small{
  color:var(--bj-aqua)!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.18em!important;
  text-transform:uppercase!important;
}
.login-card .brand h1,
.brand h1{color:var(--bj-text)!important}
.login-card .lead{color:var(--bj-muted)!important;margin:18px 0 22px!important}
.login-card a{color:var(--bj-red)!important;font-weight:900!important}

/* =========================
   DASHBOARD / PORTAL
========================= */
.shell{
  display:grid!important;
  grid-template-columns:320px 1fr!important;
  gap:18px!important;
  min-height:100vh!important;
  padding:18px!important;
  background:transparent!important;
}
.sidebar,
.sidebar.glass{
  background:#fff!important;
  color:var(--bj-text)!important;
  border:1px solid var(--bj-line)!important;
  border-radius:26px!important;
  box-shadow:var(--bj-shadow)!important;
  backdrop-filter:none!important;
}
.sidebar p{color:var(--bj-muted)!important}
.sidebar nav a,
.sidebar .btn,
.sidebar button,
.btn.ghost,
button.ghost,
a.btn.ghost{
  background:#fff!important;
  color:var(--bj-text)!important;
  border:1px solid #c7d4e2!important;
  border-radius:14px!important;
  box-shadow:0 7px 16px rgba(7,24,43,.05)!important;
}
.sidebar nav a:hover,
.sidebar .btn:hover,
.sidebar button:hover,
.btn.ghost:hover,
button.ghost:hover,
a.btn.ghost:hover{
  color:var(--bj-red)!important;
  border-color:rgba(227,6,19,.45)!important;
  background:#fff!important;
}
main{background:transparent!important;color:var(--bj-text)!important}
.hero,
.hero.glass{
  background:linear-gradient(135deg,#072648 0%,#0b355f 58%,#123f6d 100%)!important;
  color:#fff!important;
  border:1px solid rgba(118,231,244,.22)!important;
  border-radius:26px!important;
  box-shadow:0 20px 48px rgba(7,24,43,.22)!important;
  backdrop-filter:none!important;
}
.hero h2,
.hero h1,
.hero h3,
.hero strong,
.hero span{color:#fff!important}
.hero p{color:#dbe8f6!important}
.hero-metrics div{
  background:rgba(255,255,255,.10)!important;
  border:1px solid rgba(255,255,255,.18)!important;
  color:#fff!important;
  border-radius:18px!important;
}
.hero-metrics strong{color:#fff!important}
.hero-metrics span{color:#dbe8f6!important}
.panel,
.panel.glass,
.report-card,
.card,
.metric,
.mini-card,
.table-wrap,
.report.empty,
.alert,
.empty{
  background:#fff!important;
  color:var(--bj-text)!important;
  border:1px solid var(--bj-line)!important;
  border-radius:22px!important;
  box-shadow:var(--bj-shadow-soft)!important;
  backdrop-filter:none!important;
}
.panel h3,
.panel h4,
.panel strong,
.report-card h4,
.card h5{color:var(--bj-text)!important}
.panel p,
.panel .muted,
.report-card p,
.report-card li,
.card p{color:var(--bj-muted)!important}
.section-head h3::after,
.panel h3::after,
.login-card h1::after{
  content:"";
  display:block;
  width:42px;
  height:3px;
  margin-top:10px;
  background:var(--bj-red);
  border-radius:999px;
}
.query-grid,.form-grid,.filter-grid{gap:16px!important}
label{color:var(--bj-text)!important;font-weight:800!important;font-size:13px!important}
input,select,textarea{
  width:100%!important;
  min-height:44px!important;
  background:#fff!important;
  color:var(--bj-text)!important;
  border:1px solid #bfccd9!important;
  border-radius:12px!important;
  padding:12px 14px!important;
  outline:none!important;
  box-shadow:none!important;
}
input::placeholder,textarea::placeholder{color:#8897ab!important}
select option{background:#fff!important;color:var(--bj-text)!important}
input:focus,select:focus,textarea:focus{
  border-color:var(--bj-red)!important;
  box-shadow:0 0 0 4px rgba(227,6,19,.10)!important;
}
.check{
  background:#f9fbfd!important;
  border:1px solid var(--bj-line)!important;
  color:var(--bj-text)!important;
}
button,.btn,a.btn,[type="submit"],.primary,button.primary{
  border-radius:14px!important;
  padding:12px 18px!important;
  font-weight:900!important;
  cursor:pointer!important;
  transition:.18s ease!important;
}
.primary,button.primary,[type="submit"]{
  background:linear-gradient(90deg,#37c9ec,#54d2a5)!important;
  color:#061a2d!important;
  border:0!important;
  box-shadow:0 12px 26px rgba(55,201,236,.22)!important;
}
.btn:not(.ghost),button:not(.ghost):not(.primary){
  background:var(--bj-red)!important;
  color:#fff!important;
  border:1px solid var(--bj-red)!important;
  box-shadow:0 12px 24px rgba(227,6,19,.16)!important;
}
.btn.warn{background:#f6b23b!important;color:#102033!important;border-color:#f6b23b!important}
.btn.danger,.danger{background:var(--bj-red)!important;color:#fff!important;border-color:var(--bj-red)!important}
button:hover,.btn:hover,a.btn:hover{transform:translateY(-1px)!important}
.table,table{background:#fff!important;color:var(--bj-text)!important;border-collapse:separate!important;border-spacing:0!important}
th,.table th{
  background:var(--bj-navy)!important;
  color:#fff!important;
  padding:12px!important;
  text-align:left!important;
}
td,.table td{
  background:#fff!important;
  color:var(--bj-text)!important;
  border-bottom:1px solid var(--bj-line)!important;
  padding:12px!important;
}
.candidate-table th{background:var(--bj-navy)!important;color:#fff!important}
.tags .tag,.tag,.pill{
  background:#fff!important;
  color:var(--bj-navy)!important;
  border:1px solid #c9d5e2!important;
}
.tag.ok,.active{background:#e8fff7!important;color:#087254!important;border-color:#99ead2!important}
.tag.no,.inactive{background:#fff0f2!important;color:#a70012!important;border-color:#ffc0c8!important}
.code,.score-circle:after{background:#fff!important;color:var(--bj-text)!important;border-color:var(--bj-line)!important}
.score-circle{background:conic-gradient(var(--bj-red) calc(var(--p)*1%),#e9eef4 0)!important}
.score-circle b{color:var(--bj-text)!important}

/* =========================
   ADMIN BANNERS
========================= */
.admin-wrap{
  width:min(1180px,94vw)!important;
  margin:32px auto 70px!important;
  color:var(--bj-text)!important;
}
.admin-wrap .top,
.admin-wrap .top-actions{
  background:#fff!important;
  border:1px solid var(--bj-line)!important;
  border-radius:24px!important;
  box-shadow:var(--bj-shadow-soft)!important;
  padding:20px!important;
}
.admin-wrap h1,.admin-wrap h2,.admin-wrap h3{color:var(--bj-text)!important}
.admin-wrap .card{
  background:#fff!important;
  color:var(--bj-text)!important;
  border:1px solid var(--bj-line)!important;
  border-radius:24px!important;
  box-shadow:var(--bj-shadow)!important;
}
.admin-wrap .card .small{color:var(--bj-aqua)!important}
.admin-wrap .preview,.banner-thumb{
  background:#f5f7fa!important;
  border:1px solid var(--bj-line)!important;
}
.admin-wrap td{border-top:0!important;border-left:0!important;border-right:0!important;border-radius:0!important}
.admin-wrap th{color:#fff!important}
.admin-wrap a.btn.secondary,.admin-wrap .btn.secondary{
  background:#fff!important;
  color:var(--bj-navy)!important;
  border:1px solid #b8c7d8!important;
}
.admin-wrap a.btn.secondary:hover,.admin-wrap .btn.secondary:hover{
  color:var(--bj-red)!important;
  border-color:rgba(227,6,19,.45)!important;
}

/* =========================
   REGISTRO EMPRESA inline
========================= */
body.empresa-registro-v25{
  background:
    radial-gradient(circle at 10% 0%, rgba(118,231,244,.16), transparent 29rem),
    linear-gradient(180deg,var(--bj-bg) 0%, var(--bj-bg-2) 100%)!important;
  color:var(--bj-text)!important;
}
body.empresa-registro-v25 .wrap{
  max-width:760px!important;
  margin:48px auto!important;
  padding:30px!important;
  background:#fff!important;
  border:1px solid var(--bj-line)!important;
  border-radius:24px!important;
  box-shadow:var(--bj-shadow)!important;
}
body.empresa-registro-v25 h1{color:var(--bj-text)!important}
body.empresa-registro-v25 small{color:var(--bj-aqua)!important;font-weight:900!important;letter-spacing:.18em!important}
body.empresa-registro-v25 a{color:var(--bj-red)!important;font-weight:900!important}
body.empresa-registro-v25 .msg.ok{background:#e8fff7!important;color:#087254!important;border:1px solid #99ead2!important}
body.empresa-registro-v25 .msg.err{background:#fff0f2!important;color:#a70012!important;border:1px solid #ffc0c8!important}
body.empresa-registro-v25 .btn{background:linear-gradient(90deg,#37c9ec,#54d2a5)!important;color:#061a2d!important;border:0!important}

/* Dashboard section injected by JS */
#dashboardCandidateFields{
  background:#fff!important;
  border:1px solid var(--bj-line)!important;
  border-radius:24px!important;
  box-shadow:var(--bj-shadow)!important;
  color:var(--bj-text)!important;
  padding:24px!important;
}
.dashboard-form-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px 18px!important;
}
.dashboard-form-grid h4{grid-column:1/-1!important;color:var(--bj-navy)!important;margin:20px 0 0!important}
.dashboard-form-grid .wide{grid-column:1/-1!important}

@media(max-width:1100px){
  .shell{grid-template-columns:1fr!important}
  .sidebar{position:static!important;height:auto!important}
  .dashboard-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:760px){
  .dashboard-form-grid{grid-template-columns:1fr!important}
  .query-grid,.form-grid,.filter-grid{grid-template-columns:1fr!important}
}

/* =========================================================
   BolsaJob V27 — Dashboard responsive horizontal + checks compactos
   Objetivo: evitar scroll horizontal y hacer simétricos los botones de selección.
   Se carga al final para sobrescribir V25/V26 y styles.css.
========================================================= */
html, body{
  max-width:100%!important;
  overflow-x:hidden!important;
}
body:has(.shell){
  overflow-x:hidden!important;
}
.shell{
  width:100%!important;
  max-width:100vw!important;
  grid-template-columns:minmax(230px,300px) minmax(0,1fr)!important;
  gap:18px!important;
  padding:18px!important;
  overflow-x:hidden!important;
}
.shell > main,
main{
  min-width:0!important;
  width:100%!important;
  max-width:100%!important;
  overflow-x:hidden!important;
}
.sidebar,
.sidebar.glass{
  min-width:0!important;
  max-width:300px!important;
  overflow:hidden!important;
}
.hero,
.hero.glass,
.panel,
.panel.glass,
#dashboardCandidateFields{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
}
.hero,
.hero.glass{
  grid-template-columns:minmax(0,1fr) minmax(120px,160px)!important;
  gap:18px!important;
}
.hero h2{
  font-size:clamp(30px,4.1vw,54px)!important;
  max-width:100%!important;
  overflow-wrap:break-word!important;
}
.hero-metrics{
  min-width:0!important;
}
.hero-metrics div{
  min-width:0!important;
}
.section-head{
  min-width:0!important;
  gap:14px!important;
}

/* Grillas de formularios: columnas automáticas según ancho real de pantalla */
.query-grid,
.filter-grid,
.form-grid,
.form-grid.compact{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr))!important;
  gap:14px 16px!important;
  align-items:end!important;
  width:100%!important;
  min-width:0!important;
}
.query-grid > label,
.filter-grid > label,
.form-grid > label,
.form-grid.compact > label{
  min-width:0!important;
  width:100%!important;
}
.query-grid input,
.query-grid select,
.filter-grid input,
.filter-grid select,
.form-grid input,
.form-grid select,
.form-grid textarea{
  min-width:0!important;
}
.actions{
  max-width:100%!important;
  overflow:hidden!important;
}
.actions .msg{
  min-width:0!important;
  overflow-wrap:anywhere!important;
}

/* Tablas: el scroll debe vivir dentro de la tabla, no en toda la página */
.table-wrap{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
}
.table-wrap table,
.candidate-table{
  min-width:980px!important;
}

/* Ficha digital dashboard: compacta y simétrica */
#dashboardCandidateFields{
  margin-top:18px!important;
  padding:24px!important;
}
.dashboard-form-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr))!important;
  gap:14px 16px!important;
  align-items:stretch!important;
  width:100%!important;
  min-width:0!important;
}
.dashboard-form-grid > label{
  min-width:0!important;
  width:100%!important;
}
.dashboard-form-grid > h4{
  grid-column:1/-1!important;
  margin:18px 0 0!important;
  padding-top:4px!important;
}
.dashboard-form-grid > label.wide,
.dashboard-form-grid textarea[name="labor_references"]{
  grid-column:1/-1!important;
}

/* Checkboxes: corregir tamaño grande provocado por input{width:100%; min-height:44px} */
input[type="checkbox"],
.dashboard-form-grid input[type="checkbox"],
.check input[type="checkbox"]{
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  max-width:18px!important;
  min-height:18px!important;
  max-height:18px!important;
  padding:0!important;
  margin:0!important;
  flex:0 0 18px!important;
  accent-color:var(--bj-red)!important;
  box-shadow:none!important;
}
.check,
.dashboard-form-grid .check{
  min-height:58px!important;
  height:auto!important;
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr)!important;
  align-items:center!important;
  gap:12px!important;
  padding:10px 14px!important;
  border-radius:14px!important;
  background:#f8fafc!important;
  border:1px solid #d8e1eb!important;
  color:var(--bj-text)!important;
  font-size:13px!important;
  font-weight:800!important;
  line-height:1.25!important;
  text-align:left!important;
  white-space:normal!important;
  overflow-wrap:break-word!important;
}
.dashboard-form-grid .check:hover{
  border-color:rgba(227,6,19,.38)!important;
  background:#fff!important;
}

/* Botones de acción más proporcionales */
button,.btn,a.btn,[type="submit"],.primary,button.primary{
  min-height:40px!important;
  padding:10px 16px!important;
  line-height:1.1!important;
}

/* Media queries específicas para pantallas laptop/desktop estándar */
@media (max-width:1280px){
  .shell{
    grid-template-columns:minmax(220px,280px) minmax(0,1fr)!important;
    gap:16px!important;
    padding:14px!important;
  }
  .sidebar,.sidebar.glass{max-width:280px!important;padding:20px!important}
  .hero,.hero.glass{padding:22px!important}
  .panel,.panel.glass,#dashboardCandidateFields{padding:22px!important}
  .hero h2{font-size:clamp(28px,4vw,50px)!important}
  .query-grid,.filter-grid,.form-grid,.form-grid.compact,.dashboard-form-grid{
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr))!important;
  }
}
@media (max-width:1100px){
  .shell{
    grid-template-columns:1fr!important;
    padding:12px!important;
  }
  .sidebar,.sidebar.glass{
    position:static!important;
    height:auto!important;
    max-width:100%!important;
  }
  .hero,.hero.glass{
    grid-template-columns:1fr!important;
  }
  .hero-metrics{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media (max-width:760px){
  .shell{padding:10px!important;gap:12px!important}
  .hero,.hero.glass,.panel,.panel.glass,#dashboardCandidateFields{border-radius:18px!important;padding:18px!important}
  .hero-metrics{grid-template-columns:1fr!important}
  .query-grid,.filter-grid,.form-grid,.form-grid.compact,.dashboard-form-grid{
    grid-template-columns:1fr!important;
  }
  .table-wrap table,.candidate-table{min-width:760px!important}
}

/* =========================================================
   BolsaJob V28 — Dashboard exports, botón cerrar y simetría fina
========================================================= */
.dashboard-report-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  align-items:center!important;
  margin-top:14px!important;
}
.dashboard-report-actions button{
  min-width:132px!important;
  white-space:nowrap!important;
}
.dashboard-report-actions .export-btn[disabled]{
  opacity:.45!important;
  cursor:not-allowed!important;
  transform:none!important;
}
#closeReport{
  background:#fff!important;
  color:var(--bj-red)!important;
  border:1px solid rgba(227,6,19,.45)!important;
}
.report-toolbar-note{
  display:block!important;
  width:100%!important;
  color:var(--bj-muted)!important;
  font-size:12px!important;
  margin-top:2px!important;
}
.report-card .chart-wrap{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr))!important;
  gap:12px!important;
  margin-top:14px!important;
}
.report-chart-card{
  border:1px solid var(--bj-line)!important;
  border-radius:16px!important;
  padding:12px!important;
  background:#f8fafc!important;
}
.report-chart-card strong{display:block!important;margin-bottom:8px!important;color:var(--bj-text)!important}
.report-chart-card svg{width:100%!important;height:auto!important;display:block!important}
.report-card.export-summary{
  grid-column:1/-1!important;
}
.export-summary-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr))!important;
  gap:12px!important;
}
.export-summary-item{
  border:1px solid var(--bj-line)!important;
  border-radius:16px!important;
  padding:14px!important;
  background:#f8fafc!important;
}
.export-summary-item b{display:block!important;font-size:26px!important;color:var(--bj-red)!important}

@media(max-width:760px){
  .dashboard-report-actions button{width:100%!important;min-width:0!important;}
}

/* V28 ajuste fino: checks más pequeños y simétricos */
.dashboard-form-grid .check,
.check{
  min-height:46px!important;
  padding:8px 10px!important;
  gap:9px!important;
  grid-template-columns:20px minmax(0,1fr)!important;
  font-size:12.5px!important;
  line-height:1.18!important;
  align-content:center!important;
}
.dashboard-form-grid input[type="checkbox"],
.check input[type="checkbox"],
input[type="checkbox"]{
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  max-width:16px!important;
  min-height:16px!important;
  max-height:16px!important;
}
.dashboard-form-grid{
  grid-template-columns:repeat(auto-fit,minmax(185px,1fr))!important;
}
@media(min-width:1200px){
  .dashboard-form-grid{grid-template-columns:repeat(4,minmax(185px,1fr))!important;}
}

/* =========================================================
   BolsaJob V29 — botón cerrar dentro de la sección de informe + exportables simétricos
========================================================= */
.report-section-toolbar{
  grid-column:1/-1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  padding:14px 16px!important;
  margin:4px 0 14px!important;
  border:1px solid var(--bj-line)!important;
  border-radius:18px!important;
  background:#f8fafc!important;
}
.report-section-toolbar h4{margin:2px 0 0!important;color:var(--bj-text)!important}
.report-close-section{
  background:#fff!important;
  color:var(--bj-red)!important;
  border:1px solid rgba(227,6,19,.46)!important;
  box-shadow:none!important;
  min-width:140px!important;
}
.report-close-section:hover{
  background:#fff5f6!important;
  border-color:var(--bj-red)!important;
}
.report-grid{
  align-items:stretch!important;
}
.report-card{
  break-inside:avoid!important;
}
.export-summary .chart-wrap{
  grid-template-columns:1fr!important;
}
@media(max-width:760px){
  .report-section-toolbar{
    flex-direction:column!important;
    align-items:stretch!important;
  }
  .report-close-section{width:100%!important;min-width:0!important;}
}

/* =========================
   V30 — Demanda empacadora/camaronera completa
========================= */
#demanda.demand-panel .section-head p{
  max-width:860px;
  margin:8px 0 0!important;
}
.demand-selector{
  display:flex!important;
  gap:12px!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  padding:6px 0 4px!important;
}
.demand-selector input[type="radio"]{
  position:absolute!important;
  opacity:0!important;
  pointer-events:none!important;
  width:1px!important;
  height:1px!important;
  min-height:1px!important;
  padding:0!important;
}
.demand-selector .need-pill{
  width:auto!important;
  min-width:170px!important;
  min-height:44px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:11px 22px!important;
  border:1px solid #c7d4e2!important;
  border-radius:999px!important;
  background:#fff!important;
  color:var(--bj-text)!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  cursor:pointer!important;
  box-shadow:0 8px 18px rgba(7,24,43,.05)!important;
  transition:.18s ease!important;
}
.demand-selector input[type="radio"]:checked + .need-pill{
  background:linear-gradient(90deg,#35c8ec,#50d3a6)!important;
  color:#041526!important;
  border-color:transparent!important;
  box-shadow:0 12px 24px rgba(53,200,236,.22)!important;
}
.demand-form textarea{
  min-height:88px!important;
}
.job-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}
.job-card h5{
  margin:4px 0 8px!important;
  color:var(--bj-text)!important;
}
@media (max-width:900px){
  .demand-selector .need-pill{min-width:140px!important;flex:1 1 150px!important}
}

/* =========================
   V33 — Dashboard: cerrar sesión visible, edición y validaciones externas
========================= */
.logout-top{
  display:block!important;
  margin:14px 0 10px!important;
  background:#e30613!important;
  color:#fff!important;
  border-color:#e30613!important;
  text-align:center!important;
  box-shadow:0 12px 22px rgba(227,6,19,.18)!important;
}
.candidate-actions-cell{display:flex;gap:8px;flex-wrap:wrap;align-items:center;min-width:210px}
.candidate-status-select{
  min-width:118px!important;
  height:34px!important;
  min-height:34px!important;
  padding:6px 10px!important;
  border-radius:999px!important;
  font-weight:800!important;
  background:#fff!important;
}
.status-note{display:block;color:#64748b!important;margin-top:5px;max-width:140px;line-height:1.2}
.modal-backdrop{position:fixed;inset:0;background:rgba(7,24,43,.52);z-index:9999;display:flex;align-items:flex-start;justify-content:center;padding:28px;overflow:auto}
.modal-backdrop.hidden{display:none!important}
.modal-card{width:min(1120px,96vw);background:#fff;border:1px solid #d8e0ea;border-radius:24px;box-shadow:0 28px 72px rgba(7,24,43,.28);padding:24px;color:#132033}
.modal-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:16px;border-bottom:1px solid #e9eef4;padding-bottom:14px}
.modal-head h3{margin:4px 0 0!important;color:#0a2f57!important}
.candidate-editor-card .form-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.editor-check-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.editor-check-grid .check{min-height:44px}.modal-actions{margin-top:16px}.modal-actions .msg{align-self:center}
.validation-panel textarea{min-height:82px!important}.validation-upload-row{align-items:end}.screening-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0}.screening-card{border:1px solid #d8e0ea;border-radius:18px;background:#fff;padding:16px;box-shadow:0 8px 20px rgba(7,24,43,.06)}.screening-card-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.screening-card strong{color:#0a2f57}.screening-card p{margin:8px 0;color:#132033}.screening-card small{display:block;color:#64748b;line-height:1.35}.screening-actions{margin-top:12px}.validation-history-wrap{margin-top:16px}.table-wrap{max-width:100%;overflow:auto}.candidate-table th:last-child,.candidate-table td:last-child{position:sticky;right:0;background:#fff;z-index:1}.candidate-table th:last-child{background:#0a2f57!important;color:#fff!important}
@media(max-width:1180px){.screening-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.candidate-editor-card .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.editor-check-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.screening-grid{grid-template-columns:1fr}.candidate-editor-card .form-grid{grid-template-columns:1fr!important}.editor-check-grid{grid-template-columns:1fr}.modal-backdrop{padding:12px}.candidate-actions-cell{min-width:160px}}


/* =========================
   V34 — Sherlock activo, resumen visible y tabla de validaciones compacta
========================= */
.validation-history-wrap{
  overflow-x:hidden!important;
  border-radius:18px!important;
}
.validation-history-wrap .table,
.validation-history-wrap table{
  width:100%!important;
  min-width:0!important;
  table-layout:fixed!important;
}
.validation-history-wrap th,
.validation-history-wrap td{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  vertical-align:top!important;
  padding:10px 12px!important;
  font-size:13px!important;
  line-height:1.28!important;
}
.validation-history-wrap th:nth-child(1), .validation-history-wrap td:nth-child(1){width:16%!important}
.validation-history-wrap th:nth-child(2), .validation-history-wrap td:nth-child(2){width:12%!important}
.validation-history-wrap th:nth-child(3), .validation-history-wrap td:nth-child(3){width:13%!important}
.validation-history-wrap th:nth-child(4), .validation-history-wrap td:nth-child(4){width:28%!important}
.validation-history-wrap th:nth-child(5), .validation-history-wrap td:nth-child(5){width:10%!important;text-align:center!important}
.validation-history-wrap th:nth-child(6), .validation-history-wrap td:nth-child(6){width:21%!important;font-size:12px!important}
.validation-history-wrap .tag{
  display:inline-flex!important;
  max-width:100%!important;
  white-space:normal!important;
  justify-content:center!important;
  text-align:center!important;
  line-height:1.15!important;
  padding:7px 10px!important;
}
.validation-history-wrap .vh-summary{
  max-width:260px!important;
}
.verification-export-table{
  width:100%!important;
  table-layout:fixed!important;
}
.verification-export-table th,
.verification-export-table td{
  overflow-wrap:anywhere!important;
  white-space:normal!important;
  font-size:12px!important;
  line-height:1.25!important;
}
.verification-export-table th:nth-child(4),
.verification-export-table td:nth-child(4){width:28%!important}

/* =========================
   V35 — Exportables OSINT y evidencia/API visible
========================= */
.validation-history-wrap th:nth-child(1), .validation-history-wrap td:nth-child(1){width:15%!important}
.validation-history-wrap th:nth-child(2), .validation-history-wrap td:nth-child(2){width:11%!important}
.validation-history-wrap th:nth-child(3), .validation-history-wrap td:nth-child(3){width:12%!important}
.validation-history-wrap th:nth-child(4), .validation-history-wrap td:nth-child(4){width:30%!important;max-width:300px!important}
.validation-history-wrap th:nth-child(5), .validation-history-wrap td:nth-child(5){width:14%!important;text-align:center!important}
.validation-history-wrap th:nth-child(6), .validation-history-wrap td:nth-child(6){width:18%!important;font-size:12px!important}
.validation-history-wrap .vh-evidence a{display:inline-block;margin:2px 0;color:#0a2f57!important;font-weight:800;text-decoration:underline}
.verification-export-table th:nth-child(1),.verification-export-table td:nth-child(1){width:14%!important}
.verification-export-table th:nth-child(2),.verification-export-table td:nth-child(2){width:10%!important}
.verification-export-table th:nth-child(3),.verification-export-table td:nth-child(3){width:10%!important}
.verification-export-table th:nth-child(4),.verification-export-table td:nth-child(4){width:30%!important}
.verification-export-table th:nth-child(5),.verification-export-table td:nth-child(5){width:16%!important}
.verification-export-table th:nth-child(6),.verification-export-table td:nth-child(6){width:20%!important}
.verification-export-table a,.osint-export-table a{color:#0a2f57!important;text-decoration:underline!important;font-weight:700!important}
.osint-export-table{width:100%!important;table-layout:fixed!important;border-collapse:collapse!important;margin:8px 0 16px!important}
.osint-export-table th,.osint-export-table td{border:1px solid #d8e1eb!important;padding:7px!important;vertical-align:top!important;overflow-wrap:anywhere!important;font-size:12px!important;line-height:1.25!important}
.osint-export-table th{background:#0a2f57!important;color:#fff!important}
.osint-export-table th:nth-child(1),.osint-export-table td:nth-child(1){width:22%!important}
.osint-export-table th:nth-child(2),.osint-export-table td:nth-child(2){width:78%!important}

/* V38 — Contexto real de rol en Dashboard */
.session-role-card{
  margin:14px 0 12px;
  padding:13px 14px;
  border:1px solid #d8e0ea;
  border-radius:18px;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
  box-shadow:0 10px 24px rgba(10,47,87,.06);
}
.session-role-card small{
  display:block;
  color:#37c9ec!important;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-size:.68rem;
  margin-bottom:4px;
}
.session-role-card strong{
  display:block;
  color:#102033!important;
  font-size:1rem;
  line-height:1.25;
}
.session-role-card em{
  display:block;
  color:#64748b!important;
  font-style:normal;
  font-size:.82rem;
  margin-top:5px;
  overflow:hidden;
  text-overflow:ellipsis;
}
.role-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:9px;
  padding:6px 10px;
  border-radius:999px;
  font-size:.72rem;
  line-height:1;
  font-weight:900;
  border:1px solid #c9d5e2;
  color:#0a2f57!important;
  background:#fff;
}
.role-admin-general{color:#e30613!important;border-color:rgba(227,6,19,.35);background:#fff5f6}
.role-superadmin{color:#052b4f!important;border-color:rgba(55,201,236,.45);background:#eafcff}
.role-reclutador,.role-admin-empresas{color:#057a5f!important;border-color:rgba(80,211,166,.45);background:#effdf8}
.sidebar nav a[href*="admin/banners"], .sidebar nav a[href*="superadmin"]{
  border-color:rgba(227,6,19,.25)!important;
  font-weight:900!important;
}

/* =========================
   V39 — Dashboard 100%: sidebar visible, layout sin desbordamiento
   Objetivo: que el panel vertical izquierdo se vea/recorra completo a zoom 100%
   y que el main no obligue a usar zoom 50%.
========================= */
html, body{
  max-width:100%!important;
}
body:has(.shell){
  overflow-x:hidden!important;
}
.shell{
  width:100%!important;
  max-width:100vw!important;
  min-height:100vh!important;
  grid-template-columns:minmax(260px,300px) minmax(0,1fr)!important;
  gap:18px!important;
  padding:14px 18px!important;
  overflow-x:hidden!important;
  align-items:start!important;
}
.shell > main,
main{
  min-width:0!important;
  width:100%!important;
  max-width:100%!important;
  overflow-x:hidden!important;
}
.sidebar,
.sidebar.glass{
  width:100%!important;
  max-width:300px!important;
  min-width:0!important;
  position:sticky!important;
  top:12px!important;
  height:auto!important;
  max-height:calc(100vh - 24px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:18px 20px!important;
  gap:12px!important;
  overscroll-behavior:contain!important;
  scrollbar-width:thin!important;
}
.sidebar::-webkit-scrollbar{width:7px!important}
.sidebar::-webkit-scrollbar-thumb{background:#c8d5e2!important;border-radius:999px!important}
.sidebar .brand{gap:10px!important;align-items:flex-start!important}
.sidebar .brand span{
  width:54px!important;
  height:54px!important;
  min-width:54px!important;
  border-radius:16px!important;
}
.sidebar .brand h1{font-size:18px!important;line-height:1.15!important}
.sidebar .brand small{font-size:10px!important;letter-spacing:.16em!important}
.session-role-card{margin:10px 0 8px!important;padding:12px!important;border-radius:16px!important}
.logout-top{margin:10px 0!important;padding:12px 14px!important}
.sidebar p{font-size:14px!important;line-height:1.48!important;margin:6px 0!important}
.sidebar nav{gap:8px!important;margin:6px 0!important}
.sidebar nav a,
.sidebar .btn,
.sidebar button{
  min-height:38px!important;
  padding:9px 13px!important;
  border-radius:13px!important;
  font-size:14px!important;
  line-height:1.2!important;
}
.sidebar .note{font-size:11px!important;line-height:1.25!important;word-break:break-word!important}
.hero,
.hero.glass{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  grid-template-columns:minmax(0,1fr) minmax(130px,160px)!important;
  gap:18px!important;
  padding:26px!important;
  overflow:hidden!important;
}
.hero h2{
  font-size:clamp(30px,4.1vw,54px)!important;
  max-width:100%!important;
  overflow-wrap:normal!important;
}
.hero-metrics{min-width:0!important}
.hero-metrics div{min-width:0!important;padding:14px!important}
.panel,
.panel.glass,
#dashboardCandidateFields{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:hidden!important;
}
.section-head,
.query-grid,
.filter-grid,
.form-grid,
.dashboard-form-grid,
.metric-grid,
.report-grid,
.cards{
  min-width:0!important;
}
.query-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.filter-grid{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
}
.actions{max-width:100%!important;overflow:hidden!important}
.actions .btn,
.actions button,
.dashboard-report-actions .btn,
.dashboard-report-actions button{
  white-space:nowrap!important;
  padding:10px 16px!important;
  font-size:13px!important;
}
.table-wrap{
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
}
.table-wrap table{width:max-content!important;min-width:100%!important}
.candidate-table{min-width:1080px!important}
.validation-history-wrap{max-width:100%!important;overflow-x:auto!important}

@media (max-width:1280px){
  .shell{grid-template-columns:minmax(240px,285px) minmax(0,1fr)!important;padding:12px!important;gap:14px!important}
  .sidebar,.sidebar.glass{max-width:285px!important;padding:16px!important}
  .hero,.hero.glass{grid-template-columns:minmax(0,1fr) 145px!important;padding:24px!important}
  .hero h2{font-size:clamp(28px,4vw,48px)!important}
  .query-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media (max-width:1100px){
  .shell{grid-template-columns:1fr!important;overflow-x:hidden!important}
  .sidebar,.sidebar.glass{
    position:relative!important;
    top:auto!important;
    max-width:100%!important;
    max-height:none!important;
    overflow:visible!important;
  }
  .hero,.hero.glass{grid-template-columns:1fr!important}
  .hero-metrics{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media (max-width:760px){
  .shell{padding:10px!important}
  .query-grid,.filter-grid{grid-template-columns:1fr!important}
  .hero h2{font-size:30px!important;line-height:1.05!important}
  .hero-metrics{grid-template-columns:1fr!important}
  .actions .btn,.actions button{width:100%!important;justify-content:center!important}
}


/* V40 — menú administrativo por permisos ADMIN_GENERAL */
body .sidebar nav .nav-group-title{
  margin:14px 6px 7px!important;
  color:#37c9ec!important;
  font-size:11px!important;
  line-height:1.1!important;
  font-weight:900!important;
  letter-spacing:.18em!important;
  text-transform:uppercase!important;
}
body .sidebar nav a[href*="superadmin"]{
  border-color:rgba(227,6,19,.26)!important;
}
body .role-card .perm-grid label{
  min-height:34px!important;
  align-items:center!important;
}
body .role-card .perm-grid input[type="checkbox"]{
  width:16px!important;
  height:16px!important;
  min-height:16px!important;
}

/* =========================================================
   BolsaJob V42 — Sidebar compacto real para zoom 100%
   Objetivo: que el panel izquierdo completo sea usable a 100% sin forzar zoom 50%.
   Mantiene scroll interno solo si la pantalla es muy baja.
========================================================= */
body:has(.shell){
  overflow-x:hidden!important;
}
.shell{
  grid-template-columns:clamp(250px,22vw,285px) minmax(0,1fr)!important;
  gap:16px!important;
  padding:10px 14px!important;
  min-height:100dvh!important;
  align-items:start!important;
}
.shell > main{
  min-width:0!important;
  overflow:hidden!important;
}
.sidebar,
.sidebar.glass{
  position:sticky!important;
  top:8px!important;
  max-height:calc(100dvh - 16px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:12px 14px!important;
  border-radius:22px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:9px!important;
  scrollbar-width:thin!important;
}
.sidebar .brand{
  gap:8px!important;
  margin:0!important;
  align-items:flex-start!important;
}
.sidebar .brand span,
.sidebar .brand .badge,
.sidebar .badge{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  max-width:44px!important;
  min-height:44px!important;
  max-height:44px!important;
  border-radius:14px!important;
  font-size:14px!important;
}
.sidebar .brand h1{
  font-size:16px!important;
  line-height:1.05!important;
  margin:3px 0 0!important;
}
.sidebar .brand small,
.sidebar .small,
.sidebar .eyebrow{
  font-size:9px!important;
  line-height:1.1!important;
  letter-spacing:.16em!important;
}
.session-role-card{
  margin:6px 0 6px!important;
  padding:9px 10px!important;
  border-radius:14px!important;
}
.session-role-card span{
  font-size:9px!important;
  line-height:1.1!important;
  margin-bottom:3px!important;
}
.session-role-card strong{
  font-size:14px!important;
  line-height:1.15!important;
}
.session-role-card .role-pill,
.role-pill{
  margin-top:6px!important;
  padding:5px 8px!important;
  font-size:10px!important;
}
.session-role-card em{
  font-size:11px!important;
  margin-top:5px!important;
}
.logout-top,
.sidebar .logout-top,
.sidebar a[href*="logout"],
.sidebar form[action*="logout"] button{
  min-height:34px!important;
  padding:8px 12px!important;
  border-radius:12px!important;
  font-size:13px!important;
  margin:5px 0!important;
}
.sidebar > p,
.sidebar .intro,
.sidebar .sidebar-description{
  font-size:12px!important;
  line-height:1.34!important;
  margin:4px 0 6px!important;
}
.sidebar nav{
  display:flex!important;
  flex-direction:column!important;
  gap:5px!important;
  margin:4px 0!important;
}
.sidebar nav .nav-group-title{
  margin:7px 4px 3px!important;
  font-size:9px!important;
  line-height:1!important;
  letter-spacing:.15em!important;
}
.sidebar nav a,
.sidebar .btn,
.sidebar button,
.sidebar nav button{
  min-height:32px!important;
  height:auto!important;
  padding:7px 11px!important;
  border-radius:11px!important;
  font-size:13px!important;
  line-height:1.12!important;
}
.sidebar .btn.primary,
.sidebar button.primary,
.sidebar .danger,
.sidebar .btn.danger,
.sidebar [type="submit"]{
  min-height:34px!important;
  padding:8px 12px!important;
  font-size:12.5px!important;
  border-radius:12px!important;
}
.sidebar .note,
.sidebar small.note{
  font-size:9.5px!important;
  line-height:1.18!important;
  margin:4px 0 0!important;
}

/* Main dashboard: reducir cabecera y evitar que el hero empuje horizontalmente */
.hero,
.hero.glass{
  grid-template-columns:minmax(0,1fr) minmax(118px,145px)!important;
  gap:14px!important;
  padding:22px 24px!important;
  min-width:0!important;
}
.hero h1,
.hero h2{
  font-size:clamp(32px,3.45vw,48px)!important;
  line-height:1.04!important;
  letter-spacing:-.045em!important;
  max-width:100%!important;
  overflow-wrap:break-word!important;
  text-wrap:balance!important;
}
.hero p{
  font-size:14px!important;
  line-height:1.45!important;
  max-width:100%!important;
}
.hero-metrics{
  gap:10px!important;
}
.hero-metrics div{
  min-height:82px!important;
  padding:12px!important;
  border-radius:16px!important;
}
.hero-metrics strong{
  font-size:26px!important;
}
.hero-metrics span{
  font-size:12px!important;
}
.panel,
.panel.glass{
  padding:22px 24px!important;
}
.query-grid{
  grid-template-columns:repeat(4,minmax(170px,1fr))!important;
  gap:12px 14px!important;
}
.filter-grid{
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr))!important;
  gap:12px 14px!important;
}
.actions,
.dashboard-report-actions{
  gap:8px!important;
}
.actions .btn,
.actions button,
.dashboard-report-actions .btn,
.dashboard-report-actions button{
  min-height:36px!important;
  padding:8px 13px!important;
  font-size:12.5px!important;
}
input,select,textarea{
  min-height:40px!important;
  padding:10px 12px!important;
  border-radius:11px!important;
}
label{
  font-size:12px!important;
}

@media (max-height:760px) and (min-width:1001px){
  .sidebar,.sidebar.glass{
    padding:10px 12px!important;
    gap:7px!important;
  }
  .sidebar .brand span,.sidebar .badge{
    width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;border-radius:12px!important;
  }
  .sidebar .brand h1{font-size:14px!important}
  .session-role-card{padding:8px 9px!important;margin:4px 0!important}
  .session-role-card strong{font-size:13px!important}
  .role-pill{font-size:9.5px!important;padding:4px 7px!important}
  .session-role-card em{font-size:10px!important}
  .sidebar > p,.sidebar .intro,.sidebar .sidebar-description{font-size:11px!important;line-height:1.28!important}
  .sidebar nav{gap:4px!important}
  .sidebar nav a,.sidebar .btn,.sidebar button,.sidebar nav button{min-height:29px!important;padding:6px 10px!important;font-size:12px!important;border-radius:10px!important}
  .sidebar .btn.primary,.sidebar button.primary,.sidebar [type="submit"]{min-height:31px!important;font-size:11.8px!important}
  .sidebar .note{font-size:8.8px!important}
  .hero,.hero.glass{padding:20px 22px!important}
  .hero h1,.hero h2{font-size:clamp(28px,3.1vw,42px)!important}
  .hero-metrics div{min-height:76px!important;padding:10px!important}
}

@media (max-width:1280px) and (min-width:1001px){
  .shell{
    grid-template-columns:clamp(235px,22vw,270px) minmax(0,1fr)!important;
    gap:12px!important;
    padding:8px 10px!important;
  }
  .sidebar,.sidebar.glass{max-width:270px!important}
  .hero,.hero.glass{grid-template-columns:minmax(0,1fr) minmax(104px,132px)!important}
  .hero h1,.hero h2{font-size:clamp(28px,3.35vw,44px)!important}
  .query-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media (max-width:1000px){
  .shell{grid-template-columns:1fr!important;padding:10px!important}
  .sidebar,.sidebar.glass{
    position:relative!important;
    top:auto!important;
    max-width:100%!important;
    max-height:none!important;
    overflow:visible!important;
  }
}


/* BolsaJob V43 — limpieza de doble botón de cierre de sesión en sidebar.
   Se conserva el botón principal superior (.logout-top) por simetría visual. */
.sidebar a[href$="/logout"]:not(.logout-top),
.sidebar a[href*="logout"]:not(.logout-top) {
  display: none !important;
}
.sidebar .logout-top {
  display: flex !important;
  width: 100% !important;
  justify-content: center !important;
  align-items: center !important;
  margin: 12px 0 16px !important;
  min-height: 42px !important;
  border-radius: 14px !important;
  background: #e30613 !important;
  color: #fff !important;
  border: 1px solid #e30613 !important;
  box-shadow: 0 12px 24px rgba(227,6,19,.16) !important;
}