/* ERPY · Departamento de Proyectos
   Mesa de control: cartera estrecha, WBS/Gantt ancho y demanda de materiales trazable. */
.project-command { display: grid; gap: var(--ty-e-4); min-width: 0; }
.project-command-bar,
.project-pane-head,
.project-header-actions { display: flex; align-items: center; justify-content: space-between; gap: var(--ty-e-4); }
.project-command-bar h1,
.project-header h2,
.project-pane-head h3 { margin: 0; }
.project-command-bar p,
.project-header p { margin: var(--ty-e-1) 0 0; color: var(--ty-tinta-suave); }
.project-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: var(--ty-e-4); align-items: start; min-width: 0; }
.project-portfolio,
.project-workspace,
.project-editor { border: 1px solid var(--ty-raya); border-radius: var(--ty-r-3); background-color: var(--ty-panel); }
.project-portfolio { position: sticky; top: var(--typy-topbar-alto, 80px); max-height: calc(100vh - var(--typy-topbar-alto, 80px) - var(--ty-e-5)); overflow: hidden; }
.project-portfolio-head { display: flex; justify-content: space-between; align-items: end; padding: var(--ty-e-4); border-bottom: 1px solid var(--ty-raya); }
.project-portfolio-list { overflow: auto; max-height: calc(100vh - var(--typy-topbar-alto, 80px) - 90px); }
.project-portfolio-row { display: grid; width: 100%; gap: var(--ty-e-1); padding: var(--ty-e-4); border: 0; border-bottom: 1px solid var(--ty-raya-fina); background-color: transparent; color: var(--ty-tinta); text-align: left; cursor: pointer; }
.project-portfolio-row:hover { background-color: var(--ty-panel-hondo); }
.project-portfolio-row.active { box-shadow: inset 4px 0 0 var(--ty-marca); background-color: var(--ty-marca-velo); }
.project-code { font: var(--ty-peso-maximo) var(--ty-t-micro)/1 var(--ty-fuente-dato); color: var(--ty-marca-tinta); letter-spacing: .04em; }
.project-portfolio-row small,
.project-wbs-row small,
.project-material-grid small,
.project-control-row small { display: block; color: var(--ty-tinta-suave); font-size: var(--ty-t-micro); }
.project-row-foot { display: flex; align-items: center; gap: var(--ty-e-2); margin-top: var(--ty-e-2); color: var(--ty-tinta-media); font-size: var(--ty-t-micro); }
.project-row-foot b { margin-left: auto; font-variant-numeric: tabular-nums; }
.project-health { width: 8px; height: 8px; border-radius: var(--ty-r-pastilla); background-color: var(--ty-info-tinta); }
.project-health.ok { background-color: var(--ty-exito-tinta); }
.project-health.warning { background-color: var(--ty-aviso-tinta); }
.project-health.danger { background-color: var(--ty-peligro-tinta); }
.project-workspace { min-width: 0; overflow: hidden; }
.project-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--ty-e-4); padding: var(--ty-e-5); border-bottom: 1px solid var(--ty-raya); }
.project-kpis { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--ty-raya); border-radius: var(--ty-r-2); overflow: hidden; }
.project-kpis > div { display: grid; gap: var(--ty-e-1); padding: var(--ty-e-3) var(--ty-e-4); border-right: 1px solid var(--ty-raya); }
.project-kpis > div:last-child { border-right: 0; }
.project-kpis span,
.project-economics-grid span { color: var(--ty-tinta-suave); font-size: var(--ty-t-micro); text-transform: uppercase; letter-spacing: .04em; }
.project-kpis strong { font-size: var(--ty-t-mayor); font-variant-numeric: tabular-nums; }
.project-kpis small { color: var(--ty-tinta-media); }
.project-negative { color: var(--ty-peligro-tinta); }
.project-tabs { display: flex; gap: 0; overflow-x: auto; border-bottom: 1px solid var(--ty-raya); padding: 0 var(--ty-e-5); }
.project-tabs button { flex: 0 0 auto; padding: var(--ty-e-3) var(--ty-e-4); border: 0; border-bottom: 3px solid transparent; background-color: transparent; color: var(--ty-tinta-media); font-weight: var(--ty-peso-fuerte); cursor: pointer; }
.project-tabs button.active { color: var(--ty-marca-tinta); border-bottom-color: var(--ty-marca); }
.project-pane { padding: var(--ty-e-5); min-width: 0; }
.project-pane-head { margin-bottom: var(--ty-e-4); }
.project-empty { margin: var(--ty-e-5) 0; padding: var(--ty-e-6); border: 1px dashed var(--ty-raya-fuerte); border-radius: var(--ty-r-2); }
.project-wbs-head,
.project-wbs-row { display: grid; grid-template-columns: minmax(230px, 1.2fr) 130px 150px minmax(280px, 1.5fr); gap: var(--ty-e-3); align-items: center; }
.project-wbs-head { padding: var(--ty-e-2) var(--ty-e-3); color: var(--ty-tinta-suave); font-size: var(--ty-t-micro); font-weight: var(--ty-peso-fuerte); text-transform: uppercase; }
.project-wbs { border: 1px solid var(--ty-raya); border-radius: var(--ty-r-2); overflow-x: auto; }
.project-wbs-row { width: 100%; min-width: 900px; min-height: 70px; padding: var(--ty-e-3); border: 0; border-bottom: 1px solid var(--ty-raya-fina); background-color: transparent; color: var(--ty-tinta); text-align: left; cursor: pointer; }
.project-wbs-row:last-child { border-bottom: 0; }
.project-wbs-row:hover { background-color: var(--ty-panel-hondo); }
.project-wbs-row.critical { box-shadow: inset 3px 0 0 var(--ty-peligro-tinta); }
.project-task-copy { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: var(--ty-e-1) var(--ty-e-2); align-items: baseline; }
.project-task-copy > b { font-family: var(--ty-fuente-dato); color: var(--ty-marca-tinta); }
.project-task-copy small { grid-column: 2; }
.status-dot { display: inline-block; width: 8px; height: 8px; margin-right: var(--ty-e-2); border-radius: var(--ty-r-pastilla); background-color: var(--ty-info-tinta); }
.status-dot.done { background-color: var(--ty-exito-tinta); }
.status-dot.blocked { background-color: var(--ty-peligro-tinta); }
.status-dot.not_started { background-color: var(--ty-raya-fuerte); }
.project-progress { display: flex; align-items: center; gap: var(--ty-e-2); }
.project-progress progress { flex: 1; width: 100%; accent-color: var(--ty-marca); }
.project-progress em { min-width: 38px; font-style: normal; font-size: var(--ty-t-micro); }
.project-gantt { position: relative; display: grid; gap: var(--ty-e-2); }
.project-gantt::before { content: ""; height: 18px; border: 1px solid var(--ty-raya); border-radius: var(--ty-r-1); background-image: repeating-linear-gradient(90deg, transparent 0 24%, var(--ty-raya-fina) 24% 25%); }
.project-gantt > i { position: absolute; top: 4px; min-width: 5px; height: 10px; border-radius: var(--ty-r-pastilla); background-color: var(--ty-info-tinta); }
.project-wbs-row.critical .project-gantt > i { background-color: var(--ty-peligro-tinta); }
.project-gantt > i.milestone { width: 10px; transform: rotate(45deg); border-radius: var(--ty-r-1); }
.project-offset-0 { left: 0; } .project-offset-10 { left: 10%; } .project-offset-20 { left: 20%; }
.project-offset-30 { left: 30%; } .project-offset-40 { left: 40%; } .project-offset-50 { left: 50%; }
.project-offset-60 { left: 60%; } .project-offset-70 { left: 70%; } .project-offset-80 { left: 80%; }
.project-offset-90 { left: 90%; } .project-offset-100 { left: 98%; }
.project-span-10 { width: 10%; } .project-span-20 { width: 20%; } .project-span-30 { width: 30%; }
.project-span-40 { width: 40%; } .project-span-50 { width: 50%; } .project-span-60 { width: 60%; }
.project-span-70 { width: 70%; } .project-span-80 { width: 80%; } .project-span-90 { width: 90%; }
.project-span-100 { width: 100%; }
.project-material-summary { display: flex; gap: var(--ty-e-4); padding: var(--ty-e-3) var(--ty-e-4); margin-bottom: var(--ty-e-4); border: 1px solid var(--ty-raya); border-radius: var(--ty-r-2); background-color: var(--ty-panel-hondo); }
.project-material-summary b { font-size: var(--ty-t-mayor); margin-right: var(--ty-e-1); }
.project-material-grid { min-width: 0; overflow-x: auto; border: 1px solid var(--ty-raya); border-radius: var(--ty-r-2); }
.project-material-head,
.project-material-row { display: grid; grid-template-columns: minmax(180px, 1.2fr) minmax(130px, 1fr) 110px 140px 80px 120px minmax(160px, auto); gap: var(--ty-e-3); align-items: center; min-width: 1040px; padding: var(--ty-e-3); }
.project-material-head { color: var(--ty-tinta-suave); font-size: var(--ty-t-micro); font-weight: var(--ty-peso-fuerte); text-transform: uppercase; background-color: var(--ty-panel-hondo); }
.project-material-row { border-top: 1px solid var(--ty-raya-fina); }
.project-material-row.project-shortage { box-shadow: inset 3px 0 0 var(--ty-peligro-tinta); }
.project-material-row .row-actions { display: flex; gap: var(--ty-e-2); justify-content: end; }
.project-cost-waterfall { display: grid; gap: var(--ty-e-3); max-width: 860px; }
.project-cost-row { display: grid; grid-template-columns: 170px minmax(180px, 1fr) 130px; align-items: center; gap: var(--ty-e-3); }
.project-cost-row > i { height: 14px; border-radius: var(--ty-r-pastilla); overflow: hidden; background-color: var(--ty-panel-hondo); }
.project-cost-row > i > b { display: block; height: 100%; background-color: var(--ty-info-tinta); }
.project-cost-row > i > b.committed { background-color: var(--ty-aviso-tinta); }
.project-cost-row > i > b.actual { background-color: var(--ty-marca); }
.project-cost-row > i > b.margin { background-color: var(--ty-exito-tinta); }
.project-cost-row > i > b.danger { background-color: var(--ty-peligro-tinta); }
.project-value-0 { width: 0; } .project-value-10 { width: 10%; } .project-value-20 { width: 20%; }
.project-value-30 { width: 30%; } .project-value-40 { width: 40%; } .project-value-50 { width: 50%; }
.project-value-60 { width: 60%; } .project-value-70 { width: 70%; } .project-value-80 { width: 80%; }
.project-value-90 { width: 90%; } .project-value-100 { width: 100%; }
.project-cost-row > strong { text-align: right; font-variant-numeric: tabular-nums; }
.project-economics-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--ty-e-3); margin-top: var(--ty-e-5); }
.project-economics-grid article { display: grid; gap: var(--ty-e-2); padding: var(--ty-e-4); border: 1px solid var(--ty-raya); border-radius: var(--ty-r-2); }
.project-economics-grid strong { font-size: var(--ty-t-titulo); }
.project-linked-orders { margin-top: var(--ty-e-5); }
.project-linked-orders button { display: grid; grid-template-columns: 160px 1fr auto; width: 100%; gap: var(--ty-e-3); padding: var(--ty-e-3); border: 0; border-top: 1px solid var(--ty-raya); background-color: transparent; color: var(--ty-tinta); text-align: left; cursor: pointer; }
.project-control-list { border: 1px solid var(--ty-raya); border-radius: var(--ty-r-2); overflow: hidden; }
.project-control-row { display: grid; grid-template-columns: 90px minmax(0, 1fr) 60px 110px; gap: var(--ty-e-3); align-items: center; width: 100%; padding: var(--ty-e-3); border: 0; border-bottom: 1px solid var(--ty-raya-fina); background-color: transparent; color: var(--ty-tinta); text-align: left; cursor: pointer; }
.project-control-kind { font-size: var(--ty-t-micro); font-weight: var(--ty-peso-maximo); text-transform: uppercase; color: var(--ty-info-tinta); }
.project-control-kind.risk { color: var(--ty-aviso-tinta); }
.project-control-kind.issue { color: var(--ty-peligro-tinta); }
.project-control-kind.change { color: var(--ty-enviado-tinta); }
.project-risk-score { text-align: center; }
.project-risk-score b { display: block; font-size: var(--ty-t-mayor); }
.project-editor { position: relative; z-index: var(--ty-z-elevado); padding: var(--ty-e-5); border-left: 4px solid var(--ty-marca); }
.project-editor form { display: grid; gap: var(--ty-e-3); max-width: 980px; }

@media (max-width: 1350px) {
  .project-layout { display: block; }
  .project-portfolio { position: static; max-height: none; margin-bottom: var(--ty-e-3); }
  .project-portfolio-list { display: flex; max-height: none; overflow-x: auto; }
  .project-portfolio-row { flex: 0 0 260px; border-right: 1px solid var(--ty-raya); }
  .project-kpis,
  .project-economics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-kpis > div:nth-child(2) { border-right: 0; }
  .project-kpis > div:nth-child(-n+2) { border-bottom: 1px solid var(--ty-raya); }
}

@media (max-width: 720px) {
  .project-command-bar { align-items: flex-start; }
  .project-portfolio-row { flex: 0 0 78vw; border-right: 1px solid var(--ty-raya); }
  .project-header { grid-template-columns: 1fr; padding: var(--ty-e-4); }
  .project-header-actions { justify-content: flex-start; }
  .project-kpis { grid-column: 1; display: flex; overflow-x: auto; }
  .project-kpis > div { min-width: 190px; }
  .project-tabs { padding-inline: var(--ty-e-3); }
  .project-pane { padding: var(--ty-e-4); }
  .project-pane-head { align-items: flex-start; }
  .project-material-summary { overflow-x: auto; }
  .project-material-summary span { flex: 0 0 auto; }
  .project-economics-grid { grid-template-columns: 1fr 1fr; }
  .project-cost-row { grid-template-columns: 120px minmax(100px, 1fr); }
  .project-cost-row > strong { grid-column: 2; }
  .project-control-row { grid-template-columns: 76px minmax(0, 1fr) 48px; }
  .project-control-row > .status-badge { grid-column: 2 / -1; }
}