/* ============================================================
   Cafe Panel (Frontend) – Modernized Consolidated Version
   NOTE:
   - Tüm mevcut class / selector isimleri korunmuştur (geriye dönük uyumluluk).
   - Görsel dokunuşlar: CSS değişkenleri, daha yumuşak renkler, hover / focus efektleri, koyu mod desteği, transition'lar.
   - Temayı :root içindeki değişkenleri düzenleyerek özelleştirebilirsiniz.
   ============================================================ */

:root {
  --cps-bg-panel: #ffffff;
  --cps-bg-alt: #fafafa;
  --cps-bg-soft: #f6f7f8;
  --cps-bg-accent: #eef6ff;
  --cps-border: #d9dfe4;
  --cps-border-soft: #e5e8ea;
  --cps-border-strong: #c4cdd4;
  --cps-text: #1f2d36;
  --cps-text-light: #55626c;
  --cps-primary: #2271b1;
  --cps-primary-hover: #1b5c91;
  --cps-primary-soft: #d7ecff;
  --cps-danger: #d63638;
  --cps-danger-hover: #b92b2d;
  --cps-warn: #ffb900;
  --cps-warn-text: #2a2100;
  --cps-success: #2d6a2d;
  --cps-success-hover: #235323;
  --cps-info: #7057ff;
  --cps-info-hover: #5a45e0;
  --cps-radius-sm: 3px;
  --cps-radius: 4px;
  --cps-radius-lg: 8px;
  --cps-shadow-sm: 0 1px 2px rgba(0,0,0,.06);
  --cps-shadow: 0 4px 14px -2px rgba(0,0,0,.12);
  --cps-focus-ring: 0 0 0 3px rgba(34,113,177,.35);
  --cps-transition: .18s cubic-bezier(.4,0,.2,1);
  --cps-font-stack: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --cps-modal-backdrop: rgba(0,0,0,.55);
  --cps-grid-gap: 14px;
  --cps-gradient-primary: linear-gradient(135deg,#2271b1,#1b5c91);
  --cps-gradient-success: linear-gradient(135deg,#2d6a2d,#235323);
  --cps-gradient-danger: linear-gradient(135deg,#d63638,#b92b2d);
  --cps-gradient-info: linear-gradient(135deg,#7057ff,#5a45e0);
  --cps-gradient-warn: linear-gradient(135deg,#ffcf43,#ffb900);
}

/* Dark mode */
@media (prefers-color-scheme: dark){
  :root {
    --cps-bg-panel: #1f262c;
    --cps-bg-alt: #252e35;
    --cps-bg-soft: #2b353d;
    --cps-bg-accent: #233649;
    --cps-border: #3a4752;
    --cps-border-soft: #424f5b;
    --cps-border-strong: #566370;
    --cps-text: #e5ecf1;
    --cps-text-light: #9eacb8;
    --cps-primary: #3d8fd4;
    --cps-primary-hover: #3177ad;
    --cps-primary-soft: #2b4d63;
    --cps-danger: #f05c5e;
    --cps-danger-hover: #cc4c4e;
    --cps-warn: #ffc83a;
    --cps-warn-text: #2a2100;
    --cps-success: #49a349;
    --cps-success-hover: #3a823a;
    --cps-info: #8a75ff;
    --cps-info-hover: #6e5dd4;
    --cps-modal-backdrop: rgba(0,0,0,.7);
    --cps-shadow-sm: 0 1px 3px rgba(0,0,0,.4);
    --cps-shadow: 0 6px 18px -2px rgba(0,0,0,.5);
  }
}

/* Container & Base */
.cps-cafe-panel{
  border:1px solid var(--cps-border);
  background:var(--cps-bg-panel);
  padding:18px 20px;
  font-family:var(--cps-font-stack);
  font-size:14px;
  max-width:1200px;
  margin:18px auto;
  box-sizing:border-box;
  color:var(--cps-text);
  border-radius:var(--cps-radius-lg);
  box-shadow:var(--cps-shadow-sm);
  position:relative;
}

.cps-cafe-panel *{
  box-sizing:border-box;
  font-family:inherit;
}

.cps-cafe-panel a{
  color:var(--cps-primary);
  text-decoration:none;
  transition:var(--cps-transition);
}
.cps-cafe-panel a:hover{
  color:var(--cps-primary-hover);
  text-decoration:underline;
}

.cps-cafe-panel button,
.cps-cafe-panel .button{
  font-family:inherit;
  cursor:pointer;
  border:1px solid var(--cps-primary);
  background:var(--cps-primary);
  color:#fff;
  border-radius:var(--cps-radius);
  padding:6px 12px;
  font-size:12px;
  line-height:1.2;
  display:inline-flex;
  align-items:center;
  gap:4px;
  transition:var(--cps-transition);
  position:relative;
  font-weight:500;
}
.cps-cafe-panel button:hover,
.cps-cafe-panel .button:hover{
  background:var(--cps-primary-hover);
  border-color:var(--cps-primary-hover);
}
.cps-cafe-panel button:focus-visible,
.cps-cafe-panel .button:focus-visible{
  outline:none;
  box-shadow:var(--cps-focus-ring);
}

.button.small{
  padding:4px 8px;
  font-size:11px;
}

.button.tiny{
  padding:2px 6px;
  font-size:11px;
  line-height:1.2;
}

.button.inline-danger{
  background:var(--cps-danger);
  border-color:var(--cps-danger);
}
.button.inline-danger:hover{
  background:var(--cps-danger-hover);
  border-color:var(--cps-danger-hover);
}

.button.small.reprint{
  background:var(--cps-info);
  border-color:var(--cps-info);
}
.button.small.reprint:hover{
  background:var(--cps-info-hover);
  border-color:var(--cps-info-hover);
}

.cps-cafe-login h3{
  margin-top:0;
  font-size:18px;
  letter-spacing:.5px;
}

.cps-cafe-login input.cps-cafe-pass{
  padding:6px 8px;
  width:240px;
  margin-right:6px;
  border:1px solid var(--cps-border);
  background:var(--cps-bg-alt);
  border-radius:var(--cps-radius);
  transition:var(--cps-transition);
}
.cps-cafe-login input.cps-cafe-pass:focus{
  outline:none;
  border-color:var(--cps-primary);
  box-shadow:var(--cps-focus-ring);
}

.cps-cafe-login-result{
  margin-top:8px;
  font-size:12px;
  font-weight:500;
}
.cps-cafe-login-result.cps-ok{color:var(--cps-success);}
.cps-cafe-login-result.cps-err{color:var(--cps-danger);}
.cps-cafe-login-result.cps-info{color:var(--cps-text-light);}

/* Toolbar & Filters */
.cps-cafe-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:12px;
  align-items:center;
}

.cps-cafe-toolbar button{
  background:var(--cps-bg-alt);
  color:var(--cps-text);
  border:1px solid var(--cps-border-soft);
}
.cps-cafe-toolbar button:hover{
  background:var(--cps-primary-soft);
  color:var(--cps-primary-hover);
}

.cps-cafe-toolbar .filter.active{
  background:var(--cps-primary);
  color:#fff;
  border-color:var(--cps-primary);
  box-shadow:0 0 0 1px var(--cps-primary-soft) inset;
}

.meta-filter{
  background:var(--cps-primary);
  color:#fff;
  padding:2px 6px;
  border-radius:12px;
  font-size:11px;
  font-weight:600;
  letter-spacing:.3px;
  display:inline-flex;
  align-items:center;
  gap:4px;
}

/* Job List Grid */
.cps-cafe-job-meta{
  margin-bottom:10px;
  font-size:12px;
  color:var(--cps-text-light);
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
}

.cps-job-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:var(--cps-grid-gap);
  margin:0;
  padding:0;
  list-style:none;
}

.cps-job-card{
  border:1px solid var(--cps-border-soft);
  background:var(--cps-bg-alt);
  border-radius:var(--cps-radius);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  position:relative;
  transition:var(--cps-transition);
  box-shadow:var(--cps-shadow-sm);
}
.cps-job-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--cps-shadow);
  border-color:var(--cps-border);
}

.cps-job-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:6px 8px;
  background:var(--cps-bg-soft);
  border-bottom:1px solid var(--cps-border-soft);
  font-size:12px;
  font-weight:600;
  gap:8px;
  color:var(--cps-text);
}

.cps-job-media{
  width:100%;
  aspect-ratio:1/1;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  overflow:hidden;
  border-bottom:1px solid var(--cps-border-soft);
  position:relative;
}
@media (prefers-color-scheme: dark){
  .cps-job-media{background:var(--cps-bg-soft);}
}

.cps-job-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.01);
  transition:var(--cps-transition);
}
.cps-job-card:hover .cps-job-media img{
  transform:scale(1.05);
}

.cps-job-media .no-image{
  font-size:11px;
  color:var(--cps-text-light);
}

.cps-job-info{
  padding:8px 9px 6px;
  font-size:12px;
  line-height:1.4;
  word-break:break-word;
  color:var(--cps-text);
}

.cps-job-info .fail{
  color:var(--cps-danger);
  font-weight:600;
}

.cps-job-actions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding:6px 8px 10px;
  margin-top:auto;
  background:linear-gradient(to bottom,var(--cps-bg-alt),var(--cps-bg-panel));
}
.cps-job-actions .button.small{
  padding:4px 8px;
  font-size:11px;
  line-height:1.2;
}

/* Status badges */
.cps-status-badge{
  display:inline-block;
  padding:3px 7px 4px;
  font-size:10.5px;
  border-radius:14px;
  background:#555;
  color:#fff;
  line-height:1;
  letter-spacing:.4px;
  font-weight:600;
  text-transform:uppercase;
  box-shadow:var(--cps-shadow-sm);
}
.status-pending{background:var(--cps-warn);color:var(--cps-warn-text);}
.status-approved{background:var(--cps-primary);}
.status-printing{background:var(--cps-info);}
.status-printed{background:var(--cps-success);}
.status-failed{background:var(--cps-danger);}
.status-rejected{background:#555;}
.status-canceled{background:#777;}

/* Generic states */
.cps-loader,
.cps-error,
.cps-empty{
  padding:10px;
  font-size:13px;
  border-radius:var(--cps-radius);
}
.cps-loader{
  background:var(--cps-bg-soft);
  color:var(--cps-text-light);
}
.cps-error{
  color:var(--cps-danger);
  background:linear-gradient(135deg,#fff5f5,#ffe3e3);
  border:1px solid #f1d3d3;
}
@media (prefers-color-scheme: dark){
  .cps-error{
    background:linear-gradient(135deg,#422828,#512e2e);
    border-color:#703d3d;
    color:#ffb3b3;
  }
}
.cps-empty{
  text-align:center;
  background:var(--cps-bg-alt);
  border:1px solid var(--cps-border-soft);
  color:var(--cps-text-light);
}

/* Pagination */
.cps-pages{
  display:flex;
  gap:4px;
  flex-wrap:wrap;
  margin-top:14px;
}
.cps-page-btn{
  padding:5px 10px;
  font-size:12px;
  cursor:pointer;
  border:1px solid var(--cps-border-soft);
  background:var(--cps-bg-soft);
  border-radius:var(--cps-radius-sm);
  line-height:1.2;
  transition:var(--cps-transition);
  color:var(--cps-text);
  font-weight:500;
}
.cps-page-btn:hover{
  background:var(--cps-primary-soft);
  border-color:var(--cps-primary);
  color:var(--cps-primary-hover);
}
.cps-page-btn.current{
  background:var(--cps-primary);
  color:#fff;
  border-color:var(--cps-primary);
  box-shadow:var(--cps-shadow-sm);
}

/* Full layout header & tabs */
.cps-layout-full .cps-cafe-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid var(--cps-border-soft);
  margin-bottom:10px;
  padding-bottom:6px;
}
.cps-layout-full .cps-cafe-header h2{
  margin:0;
  font-size:22px;
  line-height:1.2;
  font-weight:600;
  letter-spacing:.5px;
  display:flex;
  gap:8px;
  align-items:center;
}
.cps-cafe-head-meta{
  display:flex;
  gap:10px;
  align-items:center;
  font-size:12px;
  flex-wrap:wrap;
  color:var(--cps-text-light);
}
.owner-badge{
  background:var(--cps-gradient-primary);
  color:#fff;
  padding:3px 8px;
  border-radius:20px;
  font-size:11px;
  font-weight:600;
  letter-spacing:.4px;
  box-shadow:var(--cps-shadow-sm);
}

.cps-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:12px 0 14px;
}
.cps-tabs a{
  padding:7px 14px;
  background:var(--cps-bg-soft);
  border-radius:var(--cps-radius);
  text-decoration:none;
  color:var(--cps-text-light);
  font-size:13px;
  line-height:1.2;
  transition:var(--cps-transition);
  font-weight:500;
  position:relative;
  border:1px solid var(--cps-border-soft);
}
.cps-tabs a:hover{
  background:var(--cps-primary-soft);
  color:var(--cps-primary-hover);
  border-color:var(--cps-primary);
}
.cps-tabs a.active{
  background:var(--cps-primary);
  color:#fff;
  border-color:var(--cps-primary);
  box-shadow:var(--cps-shadow-sm);
}
.cps-tab-badge[data-badge-for]{
  font-size:10px;
  background:var(--cps-danger);
  color:#fff;
  padding:2px 6px;
  border-radius:10px;
  position:absolute;
  top:-6px;
  right:-6px;
  line-height:1;
  box-shadow:var(--cps-shadow-sm);
}

.cps-tab-panel{
  display:none;
  animation:fadeIn .25s ease;
}
.cps-tab-panel.active{
  display:block;
}
@keyframes fadeIn{
  from{opacity:0;transform:translateY(4px);}
  to{opacity:1;transform:translateY(0);}
}

/* Dashboard sections */
.cps-summary-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:12px;
  margin:12px 0 6px;
}
.cps-s-item{
  background:var(--cps-bg-alt);
  border:1px solid var(--cps-border-soft);
  border-radius:var(--cps-radius);
  padding:10px 10px 12px;
  text-align:center;
  box-shadow:var(--cps-shadow-sm);
  position:relative;
  overflow:hidden;
}
.cps-s-item:before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(145deg,transparent 60%,rgba(0,0,0,.05));
  opacity:.5;
  pointer-events:none;
}
@media (prefers-color-scheme: dark){
  .cps-s-item:before{
    background:linear-gradient(145deg,transparent 60%,rgba(255,255,255,.05));
  }
}
.cps-s-item h4{
  margin:0 0 4px;
  font-size:11px;
  color:var(--cps-text-light);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.5px;
}
.cps-s-item p{
  margin:0;
  font-size:20px;
  font-weight:600;
  line-height:1.1;
  color:var(--cps-text);
}

.cps-recent-jobs,
.cps-critical-logs,
.cps-mini-dev,
.cps-logs-list{
  list-style:none;
  margin:6px 0;
  padding:0;
  font-size:12px;
}
.cps-recent-jobs li,
.cps-critical-logs li,
.cps-logs-list li{
  border-bottom:1px solid var(--cps-border-soft);
  padding:6px 0;
  display:flex;
  gap:6px;
  align-items:center;
  color:var(--cps-text-light);
}
.cps-logs-list li.lvl-critical{background:linear-gradient(90deg,#ffecec,#fff);}
.cps-logs-list li.lvl-error{background:linear-gradient(90deg,#fff4f4,#fff);}
@media (prefers-color-scheme: dark){
  .cps-logs-list li.lvl-critical{background:linear-gradient(90deg,#4e2f2f,#1f262c);}
  .cps-logs-list li.lvl-error{background:linear-gradient(90deg,#543131,#1f262c);}
}
.cps-mini-dev{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  color:var(--cps-text-light);
}
.cps-dev-table{
  width:100%;
  border-collapse:collapse;
  font-size:12px;
  margin-top:8px;
  background:var(--cps-bg-alt);
  border:1px solid var(--cps-border-soft);
  border-radius:var(--cps-radius);
  overflow:hidden;
  box-shadow:var(--cps-shadow-sm);
}
.cps-dev-table th,
.cps-dev-table td{
  border:1px solid var(--cps-border-soft);
  padding:7px 8px;
  text-align:left;
  vertical-align:top;
  line-height:1.3;
}
.cps-dev-table th{
  background:var(--cps-bg-soft);
  font-weight:600;
  font-size:11px;
  letter-spacing:.5px;
  text-transform:uppercase;
  color:var(--cps-text-light);
}

/* Requests Panel */
.cps-request-form input,
.cps-request-form textarea{
  width:100%;
  margin-bottom:6px;
  padding:6px 8px;
  font-size:13px;
  border:1px solid var(--cps-border-soft);
  background:var(--cps-bg-alt);
  border-radius:var(--cps-radius);
  transition:var(--cps-transition);
}
.cps-request-form input:focus,
.cps-request-form textarea:focus{
  outline:none;
  border-color:var(--cps-primary);
  box-shadow:var(--cps-focus-ring);
}
.cps-req-list{
  list-style:none;
  margin:12px 0;
  padding:0;
  font-size:12px;
}
.cps-req-list li{
  border:1px solid var(--cps-border-soft);
  padding:8px 9px;
  margin-bottom:8px;
  border-radius:var(--cps-radius);
  background:var(--cps-bg-alt);
  cursor:pointer;
  transition:var(--cps-transition);
  position:relative;
  box-shadow:var(--cps-shadow-sm);
}
.cps-req-list li:hover{
  background:var(--cps-bg-soft);
  border-color:var(--cps-primary);
}
.req-status{
  background:var(--cps-primary);
  color:#fff;
  padding:2px 6px;
  border-radius:12px;
  font-size:10px;
  margin-left:6px;
  font-weight:600;
  letter-spacing:.3px;
}
.req-head{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  margin-bottom:4px;
  color:var(--cps-text);
  font-weight:600;
}
.req-meta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  font-size:11px;
  color:var(--cps-text-light);
}
.last-reply{color:var(--cps-text-light);}
.req-replies{
  background:var(--cps-primary);
  color:#fff;
  font-size:10px;
  padding:2px 6px;
  border-radius:10px;
  margin-left:6px;
  font-weight:500;
}

.cps-request-detail{
  position:relative;
  border:1px solid var(--cps-border-soft);
  background:var(--cps-bg-panel);
  border-radius:var(--cps-radius-lg);
  margin-top:14px;
  padding:0;
  display:flex;
  flex-direction:column;
  max-height:560px;
  box-shadow:var(--cps-shadow);
}
.cps-request-detail.hidden{display:none;}
.cps-request-detail .crd-head{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border-bottom:1px solid var(--cps-border-soft);
  background:var(--cps-bg-soft);
  position:sticky;
  top:0;
  z-index:2;
}
.cps-request-detail .crd-title{
  font-weight:600;
  font-size:14px;
  flex:1;
  color:var(--cps-text);
}
.cps-request-detail .crd-status{
  font-size:11px;
  background:var(--cps-primary);
  color:#fff;
  padding:4px 10px;
  border-radius:16px;
  text-transform:uppercase;
  letter-spacing:.5px;
  font-weight:600;
}
.cps-request-detail .crd-status[data-status="closed"]{background:#666;}
.cps-request-detail .crd-status[data-status="open"]{background:var(--cps-warn);color:var(--cps-warn-text);}
.cps-request-detail .crd-status[data-status="answered"]{background:var(--cps-success);}
.cps-request-detail .crd-actions{
  display:flex;
  align-items:center;
  gap:6px;
}
.cps-request-detail .crd-body{
  flex:1;
  overflow:auto;
  padding:14px 14px 12px;
  background:var(--cps-bg-panel);
}

.crd-messages{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.crd-msg{
  border:1px solid var(--cps-border-soft);
  border-radius:var(--cps-radius);
  padding:8px 10px;
  background:var(--cps-bg-alt);
  font-size:12px;
  max-width:700px;
  line-height:1.45;
  position:relative;
  box-shadow:var(--cps-shadow-sm);
}
.crd-msg.admin{
  background:var(--cps-bg-accent);
  border-color:#bcd5f2;
}
@media (prefers-color-scheme: dark){
  .crd-msg.admin{border-color:#40688a;}
}
.crd-msg.cafe{background:var(--cps-bg-alt);}
.crd-msg .cm-meta{
  display:flex;
  justify-content:space-between;
  font-size:11px;
  color:var(--cps-text-light);
  margin-bottom:4px;
  font-weight:500;
}
.crd-msg .cm-body{
  white-space:pre-wrap;
  line-height:1.45;
  color:var(--cps-text);
}
.crd-loading{
  font-size:12px;
  color:var(--cps-text-light);
}

.crd-reply-form{
  border-top:1px solid var(--cps-border-soft);
  padding:12px 14px;
  display:flex;
  flex-direction:column;
  gap:8px;
  background:var(--cps-bg-soft);
  position:sticky;
  bottom:0;
  z-index:2;
}
.crd-reply-form textarea{
  width:100%;
  resize:vertical;
  font-size:13px;
  padding:8px 10px;
  border:1px solid var(--cps-border-soft);
  border-radius:var(--cps-radius);
  background:var(--cps-bg-panel);
  color:var(--cps-text);
  transition:var(--cps-transition);
}
.crd-reply-form textarea:focus{
  outline:none;
  border-color:var(--cps-primary);
  box-shadow:var(--cps-focus-ring);
}
.crd-reply-bar{
  display:flex;
  align-items:center;
  gap:10px;
}
.crd-reply-msg{
  font-size:12px;
  font-weight:500;
  color:var(--cps-text-light);
}

/* Solutions Panel */
.cps-solutions-search{
  display:flex;
  gap:6px;
  margin-bottom:10px;
}
.cps-solutions-search input{
  flex:1;
  padding:7px 10px;
  font-size:13px;
  border:1px solid var(--cps-border-soft);
  border-radius:var(--cps-radius);
  background:var(--cps-bg-alt);
  transition:var(--cps-transition);
}
.cps-solutions-search input:focus{
  outline:none;
  border-color:var(--cps-primary);
  box-shadow:var(--cps-focus-ring);
}

.cps-sol-list{
  list-style:none;
  margin:12px 0;
  padding:0;
  font-size:12px;
}
.cps-sol-list li{
  border:1px solid var(--cps-border-soft);
  padding:8px 10px;
  margin-bottom:8px;
  border-radius:var(--cps-radius);
  background:var(--cps-bg-alt);
  box-shadow:var(--cps-shadow-sm);
  line-height:1.5;
}
.cps-sol-list li .steps{
  margin-top:6px;
  font-size:11px;
  color:var(--cps-text-light);
  white-space:pre-wrap;
}

/* Upload Panel */
.cps-upload-form input[type=file]{
  margin-bottom:10px;
  display:block;
  font-size:13px;
  color:var(--cps-text-light);
}
.cps-upload-form select,
.cps-upload-form input[type=text]{
  margin-bottom:8px;
  padding:7px 10px;
  font-size:13px;
  width:100%;
  max-width:260px;
  border:1px solid var(--cps-border-soft);
  border-radius:var(--cps-radius);
  background:var(--cps-bg-alt);
  transition:var(--cps-transition);
}
.cps-upload-form select:focus,
.cps-upload-form input[type=text]:focus{
  outline:none;
  border-color:var(--cps-primary);
  box-shadow:var(--cps-focus-ring);
}
.cps-upload-msg{
  font-size:12px;
  margin-top:6px;
  font-weight:500;
  color:var(--cps-text-light);
}

/* Multi Upload Section */
.cps-multi-upload{
  margin-top:18px;
  border:1px solid var(--cps-border-soft);
  padding:14px 16px;
  border-radius:var(--cps-radius-lg);
  background:var(--cps-bg-alt);
  box-shadow:var(--cps-shadow-sm);
  position:relative;
  overflow:hidden;
}
.cps-multi-upload:before{
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 85% 15%,rgba(34,113,177,.08),transparent 60%);
  pointer-events:none;
}
.cps-multi-upload .cps-auto-approve{
  display:inline-flex;
  align-items:center;
  font-size:12px;
  margin-bottom:8px;
  gap:6px;
  font-weight:500;
  color:var(--cps-text-light);
}

.cps-drop-zone{
  border:2px dashed var(--cps-border);
  padding:28px 20px;
  border-radius:var(--cps-radius-lg);
  text-align:center;
  position:relative;
  background:var(--cps-bg-panel);
  cursor:pointer;
  transition:var(--cps-transition);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.02);
}
.cps-drop-zone.drag-over{
  background:var(--cps-primary-soft);
  border-color:var(--cps-primary);
  box-shadow:0 0 0 3px rgba(34,113,177,.25);
}
.cps-drop-zone .dz-instructions{
  font-size:13px;
  color:var(--cps-text-light);
  font-weight:500;
}
.cps-drop-zone .dz-instructions small{
  display:block;
  margin-top:4px;
  color:var(--cps-text-light);
  font-size:11px;
  font-weight:400;
}

.cps-upload-actions{
  display:flex;
  gap:10px;
  margin:12px 0 10px;
  flex-wrap:wrap;
}

.cps-upload-queue{
  list-style:none;
  margin:0;
  padding:0;
  max-height:380px;
  overflow:auto;
  font-size:12px;
  scrollbar-width:thin;
  scrollbar-color:var(--cps-primary) var(--cps-bg-alt);
}
.cps-upload-queue::-webkit-scrollbar{
  width:10px;
}
.cps-upload-queue::-webkit-scrollbar-track{
  background:var(--cps-bg-alt);
}
.cps-upload-queue::-webkit-scrollbar-thumb{
  background:var(--cps-primary);
  border-radius:6px;
  border:2px solid var(--cps-bg-alt);
}

.cps-upload-queue li{
  border:1px solid var(--cps-border-soft);
  background:var(--cps-bg-panel);
  margin-bottom:10px;
  padding:10px;
  border-radius:var(--cps-radius);
  position:relative;
  display:flex;
  flex-direction:column;
  gap:6px;
  box-shadow:var(--cps-shadow-sm);
  transition:var(--cps-transition);
}
.cps-upload-queue li:hover{
  transform:translateY(-2px);
  box-shadow:var(--cps-shadow);
}
.cps-upload-queue li.empty{
  background:var(--cps-bg-alt);
  text-align:center;
  color:var(--cps-text-light);
}
.cps-upload-queue li .file-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:2px;
  font-size:12px;
  gap:8px;
  flex-wrap:wrap;
  font-weight:500;
  color:var(--cps-text);
}
.cps-upload-queue li .file-head strong{
  max-width:60%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:600;
  letter-spacing:.3px;
}
.cps-upload-queue li .size{
  color:var(--cps-text-light);
  font-size:11px;
  font-weight:400;
}
.cps-progress{
  height:6px;
  background:var(--cps-bg-soft);
  border-radius:3px;
  overflow:hidden;
  margin:4px 0 4px;
  position:relative;
}
.cps-progress .bar{
  height:100%;
  background:var(--cps-gradient-primary);
  width:0;
  transition:width .25s ease;
  position:relative;
}
.state{
  display:inline-block;
  padding:3px 8px 4px;
  border-radius:6px;
  font-size:10px;
  text-transform:uppercase;
  background:#999;
  color:#fff;
  margin-right:6px;
  font-weight:600;
  letter-spacing:.5px;
  box-shadow:var(--cps-shadow-sm);
}
.state-queued{background:#888;}
.state-uploading{background:var(--cps-info);}
.state-done{background:var(--cps-success);}
.state-error{background:var(--cps-danger);}
.cps-upload-queue li .row-foot{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  font-size:11px;
  color:var(--cps-text-light);
}
.cps-upload-queue li .err{
  color:var(--cps-danger);
  font-size:11px;
  font-weight:500;
}
.cps-upload-queue li .job-ref{
  font-size:11px;
  background:var(--cps-primary);
  color:#fff;
  padding:3px 8px;
  border-radius:14px;
  font-weight:600;
  letter-spacing:.4px;
  box-shadow:var(--cps-shadow-sm);
}
.cps-upload-queue li .actions{
  margin-left:auto;
  display:flex;
  gap:6px;
}

/* Success rate badges & utilities */
.rate-badge{
  display:inline-block;
  padding:5px 10px;
  border-radius:20px;
  font-weight:600;
  font-size:12px;
  letter-spacing:.3px;
  box-shadow:var(--cps-shadow-sm);
}
.rate-badge.good{background:var(--cps-gradient-success);color:#fff;}
.rate-badge.mid{background:var(--cps-gradient-warn);color:var(--cps-warn-text);}
.rate-badge.bad{background:var(--cps-gradient-danger);color:#fff;}

.cps-job-search{
  padding:7px 10px;
  border:1px solid var(--cps-border-soft);
  border-radius:var(--cps-radius);
  font-size:13px;
  max-width:240px;
  background:var(--cps-bg-alt);
  transition:var(--cps-transition);
  color:var(--cps-text);
}
.cps-job-search:focus{
  outline:none;
  border-color:var(--cps-primary);
  box-shadow:var(--cps-focus-ring);
  background:var(--cps-bg-panel);
}

.button.link-like{
  background:none;
  border:none;
  color:var(--cps-primary);
  padding:0;
  cursor:pointer;
  font-size:12px;
  font-weight:500;
  transition:var(--cps-transition);
}
.button.link-like:hover{
  text-decoration:underline;
  color:var(--cps-primary-hover);
}

.cps-inline-badge{
  display:inline-block;
  font-size:11px;
  padding:3px 8px;
  background:var(--cps-primary);
  color:#fff;
  border-radius:20px;
  line-height:1;
  font-weight:600;
  letter-spacing:.4px;
  box-shadow:var(--cps-shadow-sm);
}

.hidden{display:none !important;}

/* Toast Notifications */
.cps-toast-box{
  position:fixed;
  top:18px;
  right:18px;
  z-index:99999;
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:flex-end;
  pointer-events:none;
}
.cps-toast{
  background:var(--cps-gradient-primary);
  color:#fff;
  padding:11px 16px;
  border-radius:var(--cps-radius-lg);
  font-size:13px;
  opacity:0;
  transform:translateY(-6px) scale(.98);
  transition:.35s var(--cps-transition);
  box-shadow:var(--cps-shadow);
  max-width:300px;
  line-height:1.45;
  pointer-events:auto;
  position:relative;
  font-weight:500;
}
.cps-toast.show{
  opacity:1;
  transform:translateY(0) scale(1);
}
.cps-toast.error{background:var(--cps-gradient-danger);}
.cps-toast.success{background:var(--cps-gradient-success);}
.cps-toast.warn{background:var(--cps-gradient-warn);color:var(--cps-warn-text);}
.cps-toast:before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(160deg,rgba(255,255,255,.15),transparent 70%);
  mix-blend-mode:overlay;
  pointer-events:none;
  border-radius:inherit;
}

/* Settings & Notifications */
.cps-settings-form {
  max-width:420px;
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-top:10px;
  background:var(--cps-bg-alt);
  padding:14px 16px;
  border-radius:var(--cps-radius-lg);
  border:1px solid var(--cps-border-soft);
  box-shadow:var(--cps-shadow-sm);
}
.cps-settings-form label{
  display:flex;
  flex-direction:column;
  font-size:12px;
  font-weight:600;
  gap:5px;
  color:var(--cps-text);
  letter-spacing:.3px;
}
.cps-settings-form input[type=text],
.cps-settings-form input[type=number],
.cps-settings-form select{
  padding:7px 10px;
  font-size:13px;
  border:1px solid var(--cps-border-soft);
  border-radius:var(--cps-radius);
  background:var(--cps-bg-panel);
  transition:var(--cps-transition);
  color:var(--cps-text);
}
.cps-settings-form input[type=text]:focus,
.cps-settings-form input[type=number]:focus,
.cps-settings-form select:focus{
  outline:none;
  border-color:var(--cps-primary);
  box-shadow:var(--cps-focus-ring);
}
.cps-settings-save-msg{
  font-size:12px;
  margin-top:2px;
  color:var(--cps-text-light);
  font-weight:500;
}

.cps-notifs-actions{
  display:flex;
  gap:10px;
  align-items:center;
  margin-bottom:12px;
  flex-wrap:wrap;
}
.cps-notif-list{
  list-style:none;
  margin:0;
  padding:0;
  font-size:12px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.cps-notif-list li{
  border:1px solid var(--cps-border-soft);
  padding:10px 12px;
  border-radius:var(--cps-radius);
  background:var(--cps-bg-alt);
  display:flex;
  flex-direction:column;
  gap:6px;
  position:relative;
  box-shadow:var(--cps-shadow-sm);
  transition:var(--cps-transition);
}
.cps-notif-list li.unread{
  border-color:var(--cps-primary);
  background:var(--cps-primary-soft);
}
.cps-notif-list li:hover{
  transform:translateY(-2px);
  box-shadow:var(--cps-shadow);
}
.cps-notif-head{
  display:flex;
  gap:8px;
  align-items:center;
  font-size:11px;
  flex-wrap:wrap;
  color:var(--cps-text-light);
  font-weight:500;
}
.cps-notif-type{
  background:var(--cps-primary);
  color:#fff;
  padding:3px 8px;
  font-size:10px;
  border-radius:14px;
  letter-spacing:.4px;
  font-weight:600;
}
.cps-notif-channel{
  background:#555;
  color:#fff;
  padding:3px 8px;
  font-size:10px;
  border-radius:14px;
  letter-spacing:.4px;
  font-weight:600;
}
.cps-notif-payload{
  white-space:pre-wrap;
  word-break:break-word;
  font-size:11.5px;
  color:var(--cps-text);
  line-height:1.5;
}
.cps-notif-time{
  font-size:10px;
  color:var(--cps-text-light);
  font-weight:400;
}
.cps-notif-mark{
  position:absolute;
  top:8px;
  right:8px;
  font-size:11px;
  background:var(--cps-danger);
  border-color:var(--cps-danger);
}
.cps-notif-mark:hover{
  background:var(--cps-danger-hover);
  border-color:var(--cps-danger-hover);
}

/* Job Detail Modal */
.cps-job-modal{
  position:fixed;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:999999;
  background:var(--cps-modal-backdrop);
  opacity:0;
  pointer-events:none;
  transition:.25s ease;
  padding:16px;
}
.cps-job-modal.show{
  opacity:1;
  pointer-events:all;
}
.cps-job-modal .cjm-dialog{
  background:var(--cps-bg-panel);
  max-width:680px;
  width:100%;
  padding:20px 22px 24px;
  border-radius:var(--cps-radius-lg);
  box-shadow:var(--cps-shadow);
  display:flex;
  flex-direction:column;
  gap:16px;
  max-height:90vh;
  overflow:auto;
  position:relative;
  border:1px solid var(--cps-border-soft);
}
.cps-job-modal h3{
  margin:0;
  font-size:20px;
  letter-spacing:.4px;
  font-weight:600;
  color:var(--cps-text);
}
.cjm-meta{
  font-size:12px;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:10px;
}
.cjm-meta div{
  background:var(--cps-bg-alt);
  padding:8px 10px;
  border-radius:var(--cps-radius);
  line-height:1.3;
  border:1px solid var(--cps-border-soft);
  box-shadow:var(--cps-shadow-sm);
  font-weight:500;
  color:var(--cps-text);
}
.cjm-times{
  font-size:11.5px;
  background:var(--cps-bg-alt);
  border:1px solid var(--cps-border-soft);
  border-radius:var(--cps-radius);
  padding:10px 12px;
  display:flex;
  flex-direction:column;
  gap:5px;
  line-height:1.5;
  box-shadow:var(--cps-shadow-sm);
  color:var(--cps-text);
}
.cjm-chain{
  font-size:11.5px;
  background:var(--cps-bg-alt);
  border:1px solid var(--cps-border-soft);
  border-radius:var(--cps-radius);
  padding:10px 12px;
  line-height:1.5;
  box-shadow:var(--cps-shadow-sm);
  color:var(--cps-text);
}
.cjm-close{
  position:absolute;
  right:14px;
  top:14px;
  background:var(--cps-danger);
  color:#fff;
  border:none;
  border-radius:50%;
  width:32px;
  height:32px;
  cursor:pointer;
  font-weight:600;
  line-height:1;
  font-size:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:var(--cps-shadow-sm);
  transition:var(--cps-transition);
}
.cjm-close:hover{
  background:var(--cps-danger-hover);
  transform:scale(1.05);
}
.cjm-close:focus-visible{
  outline:none;
  box-shadow:var(--cps-focus-ring);
}

/* Duplicate variant ensure */
.button.small.reprint{
  background:var(--cps-info);
  border-color:var(--cps-info);
}
.button.small.reprint:hover{
  background:var(--cps-info-hover);
  border-color:var(--cps-info-hover);
}

/* Responsive */
@media (max-width:900px){
  .cps-summary-grid{
    grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
    gap:10px;
  }
}
@media (max-width:700px){
  .cps-job-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));}
  .cps-cafe-panel{padding:15px 14px;}
  .cps-upload-queue li .file-head strong{max-width:50%;}
  .cps-cafe-head-meta{gap:6px;}
  .cps-tabs a{flex:1 1 auto;text-align:center;justify-content:center;}
  .cps-job-search{max-width:100%;width:100%;}
  .cps-job-modal .cjm-dialog{padding:18px 18px 22px;}
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce){
  *{
    animation:none !important;
    transition:none !important;
  }
  .cps-job-card:hover,
  .cps-upload-queue li:hover,
  .cps-tabs a:hover{transform:none !important;}
}

/* End of modernized stylesheet */