
/* Stage DOSAB-BRANDING-2.1 · Kokpit canlı veri bağlantısı */



.dcl-panel{

  margin-top:18px;

  display:grid;

  grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);

  gap:16px;

  align-items:start;

}



.dcl-card{

  background:#fff;

  border:1px solid #d8eadf;

  border-radius:24px;

  box-shadow:0 14px 36px rgba(10,143,67,.07);

  overflow:hidden;

}



.dcl-head{

  display:flex;

  align-items:flex-start;

  justify-content:space-between;

  gap:12px;

  padding:18px 18px 12px;

  border-bottom:1px solid #eef5f0;

}



.dcl-title{

  font-size:16px;

  font-weight:950;

  color:#17211c;

  letter-spacing:-.02em;

}



.dcl-sub{

  margin-top:4px;

  color:#607066;

  font-size:12px;

  font-weight:800;

  line-height:1.35;

}



.dcl-pill{

  display:inline-flex;

  align-items:center;

  gap:7px;

  padding:6px 9px;

  border-radius:999px;

  background:#eaf8ef;

  color:#08753a;

  border:1px solid #bfe8cf;

  font-size:11px;

  font-weight:950;

  white-space:nowrap;

}



.dcl-pill.warn{

  background:#fff7ed;

  color:#b45309;

  border-color:#fed7aa;

}



.dcl-pill.err{

  background:#fef2f2;

  color:#991b1b;

  border-color:#fecaca;

}



.dcl-body{

  padding:16px;

}



.dcl-status-grid{

  display:grid;

  grid-template-columns:repeat(4,minmax(0,1fr));

  gap:10px;

}



.dcl-status{

  border-radius:18px;

  padding:13px;

  background:#f8fcfa;

  border:1px solid #e2f0e7;

}



.dcl-status b{

  display:block;

  font-size:25px;

  line-height:1;

  color:#17211c;

  font-weight:950;

  letter-spacing:-.04em;

}



.dcl-status span{

  display:block;

  margin-top:7px;

  color:#607066;

  font-size:11px;

  font-weight:900;

}



.dcl-status.ok{

  background:#eaf8ef;

  border-color:#bfe8cf;

}



.dcl-status.warn{

  background:#fff7ed;

  border-color:#fed7aa;

}



.dcl-status.danger{

  background:#fef2f2;

  border-color:#fecaca;

}



.dcl-list{

  display:grid;

  gap:10px;

}



.dcl-job{

  display:grid;

  grid-template-columns:minmax(0,1fr) auto;

  gap:12px;

  align-items:start;

  padding:12px;

  border-radius:18px;

  background:#f8fcfa;

  border:1px solid #e2f0e7;

}



.dcl-job-title{

  font-size:13px;

  font-weight:950;

  color:#17211c;

  line-height:1.25;

}



.dcl-job-meta{

  margin-top:5px;

  color:#607066;

  font-size:11px;

  font-weight:800;

  line-height:1.35;

}



.dcl-job-tags{

  display:flex;

  flex-wrap:wrap;

  gap:6px;

  margin-top:8px;

}



.dcl-tag{

  display:inline-flex;

  padding:5px 7px;

  border-radius:999px;

  font-size:10px;

  font-weight:950;

  background:#eaf8ef;

  color:#08753a;

  border:1px solid #bfe8cf;

}



.dcl-tag.warn{

  background:#fff7ed;

  color:#b45309;

  border-color:#fed7aa;

}



.dcl-tag.danger{

  background:#fef2f2;

  color:#991b1b;

  border-color:#fecaca;

}



.dcl-job-action{

  display:inline-flex;

  align-items:center;

  justify-content:center;

  min-height:32px;

  padding:7px 9px;

  border-radius:12px;

  background:linear-gradient(135deg,#0a8f43,#08753a);

  color:#fff;

  font-size:11px;

  font-weight:950;

  white-space:nowrap;

}



.dcl-source{

  display:grid;

  grid-template-columns:minmax(0,1fr) auto;

  gap:12px;

  align-items:center;

  padding:11px 0;

  border-bottom:1px solid #eef5f0;

}



.dcl-source:last-child{

  border-bottom:0;

}



.dcl-source-name{

  display:flex;

  align-items:center;

  gap:9px;

  font-size:13px;

  font-weight:950;

  color:#17211c;

}



.dcl-dot{

  width:10px;

  height:10px;

  border-radius:999px;

  background:#23d36b;

  box-shadow:0 0 0 6px rgba(35,211,107,.12);

}



.dcl-dot.warn{

  background:#f59e0b;

  box-shadow:0 0 0 6px rgba(245,158,11,.12);

}



.dcl-dot.err{

  background:#dc2626;

  box-shadow:0 0 0 6px rgba(220,38,38,.12);

}



.dcl-source-state{

  font-size:11px;

  font-weight:950;

  color:#08753a;

}



.dcl-source-state.warn{

  color:#b45309;

}



.dcl-source-state.err{

  color:#991b1b;

}



.dcl-empty{

  border-radius:18px;

  padding:18px;

  background:#f8fcfa;

  border:1px dashed #cfe7d7;

  color:#607066;

  font-size:13px;

  font-weight:850;

  line-height:1.45;

}



.dcl-refresh-line{

  margin-top:12px;

  color:#607066;

  font-size:11px;

  font-weight:850;

}



@media(max-width:1280px){

  .dcl-status-grid{

    grid-template-columns:repeat(2,minmax(0,1fr));

  }

}



@media(max-width:1080px){

  .dcl-panel{

    grid-template-columns:1fr;

  }

}



@media(max-width:680px){

  .dcl-status-grid{

    grid-template-columns:1fr;

  }



  .dcl-job{

    grid-template-columns:1fr;

  }



  .dcl-job-action{

    width:max-content;

  }

}

