/* BPMS MI1.9.2 - Project Status three-panel UI only */
body .pc-shell{
  max-width:1680px;
  padding:22px;
}

.pc-top{
  background:#fff;
  border:1px solid #dfe7f3;
  border-radius:18px;
  padding:16px;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
}

.kpis{
  grid-template-columns:repeat(5,minmax(170px,1fr));
}

.kpi{
  border-radius:16px;
  box-shadow:0 8px 22px rgba(15,23,42,.05);
}

.planning-main{
  display:grid!important;
  grid-template-columns:minmax(760px,1fr) 430px!important;
  gap:16px!important;
  align-items:start;
}

.main-card,
.side-card{
  border-radius:18px!important;
  box-shadow:0 10px 26px rgba(15,23,42,.07);
}

.card-head{
  background:#f8fbff;
}

.card-head h2{
  color:#102a66;
  font-weight:900;
}

.toolbar input,
.toolbar select{
  border-radius:10px;
  min-height:42px;
}

.bpms-ps-panel-labels{
  display:grid;
  grid-template-columns:360px minmax(620px,1fr);
  gap:0;
  margin-bottom:0;
  border:1px solid #dfe7f3;
  border-bottom:0;
  border-radius:14px 14px 0 0;
  overflow:hidden;
}

.bpms-ps-panel-labels div{
  background:#102a66;
  color:white;
  font-weight:900;
  padding:11px 14px;
  letter-spacing:.02em;
}

.bpms-ps-panel-labels div:nth-child(2){
  background:#0b55c8;
}

.split-view{
  display:grid!important;
  grid-template-columns:360px minmax(620px,1fr)!important;
  min-height:680px!important;
  border-radius:0 0 14px 14px!important;
}

.task-list{
  max-height:720px!important;
  background:#ffffff!important;
}

.task-row{
  grid-template-columns:18px 1fr auto!important;
  padding:12px 13px!important;
  min-height:72px;
  border-left:4px solid transparent;
}

.task-row.selected{
  background:#eef4ff!important;
  border-left-color:#0b55c8!important;
}

.task-name{
  color:#102a66!important;
  font-size:14px!important;
}

.task-meta{
  font-size:12px!important;
  line-height:1.35!important;
}

.gantt{
  max-height:720px!important;
  background:#fff!important;
  overflow:auto!important;
}

.gantt-header{
  display:flex!important;
  position:sticky!important;
  top:0!important;
  z-index:5!important;
  background:#f8fafc!important;
  border-bottom:1px solid #dfe7f3!important;
  min-width:900px;
}

.gantt-header div{
  flex:1 0 110px!important;
  border-right:1px solid #e5eaf2!important;
  color:#102a66!important;
  font-size:12px!important;
  font-weight:900!important;
  padding:11px 8px!important;
  text-align:center!important;
  white-space:nowrap;
}

.gantt-row{
  position:relative!important;
  display:block!important;
  min-width:900px;
  height:72px!important;
  border-bottom:1px solid #eef2f7!important;
  background:linear-gradient(to right,#fbfdff,#fff)!important;
}

.gantt-row::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(to right, rgba(15,23,42,.06) 1px, transparent 1px);
  background-size:110px 100%;
  pointer-events:none;
}

.gantt-bar{
  top:25px!important;
  height:22px!important;
  line-height:22px!important;
  border-radius:999px!important;
  box-shadow:0 4px 12px rgba(16,42,102,.16);
  cursor:pointer;
}

.inspector{
  position:sticky!important;
  top:14px!important;
  max-height:calc(100vh - 30px);
  overflow:auto;
}

.inspector .card-head{
  position:sticky;
  top:0;
  z-index:4;
  background:#102a66!important;
  color:white!important;
}

.inspector .card-head h2{
  color:white!important;
}

#detail h3{
  color:#102a66;
  font-size:19px;
  line-height:1.25;
}

#detail .info-line{
  color:#64748b;
  font-weight:700;
  margin-bottom:10px;
}

.progress-line{
  height:16px!important;
  background:#e8eef8!important;
  border-radius:999px!important;
  overflow:hidden!important;
  margin:9px 0 15px!important;
}

.progress-fill{
  height:100%!important;
  background:linear-gradient(90deg,#102a66,#0b55c8)!important;
  border-radius:999px!important;
}

#updateArea .section{
  border:1px solid #dfe7f3;
  background:#f8fbff;
  border-radius:16px;
  padding:14px;
}

#updateArea h3{
  margin-top:0;
  color:#102a66;
}

.quick{
  display:grid!important;
  grid-template-columns:repeat(2,1fr)!important;
  gap:8px!important;
  margin-bottom:10px!important;
}

.quick button{
  margin:0!important;
  min-height:42px;
  border-radius:10px!important;
}

.compact-form{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
}

.compact-form label{
  color:#102a66;
  font-weight:900;
}

.compact-form input,
.compact-form select,
.compact-form textarea{
  border-radius:11px!important;
  border:1px solid #cbd5e1!important;
  min-height:48px!important;
  font-size:16px!important;
}

.compact-form textarea{
  min-height:96px!important;
}

#saveBtn{
  border-radius:12px!important;
  min-height:52px;
  font-size:16px;
}

.legend{
  padding-top:14px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  color:#64748b;
  font-weight:700;
}

@media(max-width:1200px){
  .planning-main{
    grid-template-columns:1fr!important;
  }
  .inspector{
    position:static!important;
    max-height:none!important;
  }
  .bpms-ps-panel-labels,
  .split-view{
    grid-template-columns:320px minmax(620px,1fr)!important;
  }
}

@media(max-width:760px){
  body .pc-shell{
    padding:12px;
  }
  .bpms-ps-panel-labels{
    display:none!important;
  }
  .split-view{
    grid-template-columns:1fr!important;
  }
  .task-list{
    max-height:360px!important;
    border-right:0!important;
    border-bottom:1px solid #dfe7f3!important;
  }
  .gantt{
    max-height:430px!important;
  }
  .compact-form,
  .quick{
    grid-template-columns:1fr!important;
  }
}