/* QuickDocX Pro UI (QDX Teams) */
:root{
  --qdx-orange:#ff7a18;
  --qdx-orange-2:#ff9a4d;
  --qdx-slate:#0f172a;
  --qdx-text:#0b1220;
  --qdx-muted:#64748b;
  --qdx-border:#e5e7eb;
  --qdx-bg:#ffffff;
  --qdx-soft:#f8fafc;
  --qdx-shadow: 0 12px 30px rgba(2,6,23,.08);
}

.qdx-pro-wrap{
  max-width:1100px;
  margin:0 auto;
  padding:18px 0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--qdx-text);
}

.qdx-pro-card{
  background:var(--qdx-bg);
  border:1px solid var(--qdx-border);
  border-radius:18px;
  box-shadow: var(--qdx-shadow);
}

.qdx-pro-header{
  padding:18px 18px 14px;
  border-bottom:1px solid var(--qdx-border);
  display:flex;
  gap:14px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
}

.qdx-pro-title{
  display:flex;
  gap:12px;
  align-items:center;
}
.qdx-pro-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(255,122,24,.16), rgba(255,122,24,.06));
  border:1px solid rgba(255,122,24,.25);
  color:#b45309;
  font-weight:700;
  font-size:12px;
  letter-spacing:.2px;
}
.qdx-pro-h{
  margin:0;
  font-size:18px;
  font-weight:800;
  letter-spacing:-.2px;
}
.qdx-pro-sub{
  margin:2px 0 0;
  color:var(--qdx-muted);
  font-size:13px;
}

.qdx-pro-stats{
  display:flex;
  gap:14px;
  align-items:center;
  flex-wrap:wrap;
}
.qdx-pro-stat{
  padding:10px 12px;
  border:1px solid var(--qdx-border);
  border-radius:14px;
  background:var(--qdx-soft);
  min-width:160px;
}
.qdx-pro-stat strong{
  display:block;
  font-size:14px;
}
.qdx-pro-stat span{
  display:block;
  font-size:12px;
  color:var(--qdx-muted);
  margin-top:2px;
}

.qdx-pro-body{
  padding:16px 18px 18px;
}

.qdx-pro-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:16px;
}
@media (max-width: 960px){
  .qdx-pro-grid{ grid-template-columns:1fr; }
}

.qdx-pro-panel{
  border:1px solid var(--qdx-border);
  border-radius:16px;
  background:#fff;
  overflow:hidden;
}

.qdx-pro-panel-h{
  padding:12px 14px;
  background:linear-gradient(180deg,#fff, #f8fafc);
  border-bottom:1px solid var(--qdx-border);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.qdx-pro-panel-h h3{
  margin:0;
  font-size:14px;
  font-weight:800;
}
.qdx-pro-panel-h p{
  margin:0;
  font-size:12px;
  color:var(--qdx-muted);
}

.qdx-pro-form{
  padding:14px;
  display:grid;
  grid-template-columns: 1fr 200px 180px;
  gap:10px;
  align-items:end;
}
@media (max-width: 960px){
  .qdx-pro-form{ grid-template-columns: 1fr; }
}

.qdx-input, .qdx-select{
  width:100%;
  padding:11px 12px;
  border:1px solid var(--qdx-border);
  border-radius:14px;
  background:#fff;
  outline:none;
}
.qdx-input:focus, .qdx-select:focus{
  border-color: rgba(255,122,24,.6);
  box-shadow: 0 0 0 4px rgba(255,122,24,.15);
}

.qdx-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:11px 12px;
  border-radius:14px;
  border:1px solid var(--qdx-border);
  background:#fff;
  cursor:pointer;
  text-decoration:none;
  color:var(--qdx-text);
  font-weight:800;
  letter-spacing:.1px;
}
.qdx-btn-primary{
  background: linear-gradient(180deg, var(--qdx-orange), #ff6a00);
  border-color: rgba(255,106,0,.55);
  color:#fff;
  box-shadow: 0 10px 22px rgba(255,122,24,.22);
}
.qdx-btn-primary:hover{ filter:brightness(.98); transform: translateY(-1px); }
.qdx-btn:active{ transform: translateY(0); }

.qdx-pro-note{
  padding:10px 12px;
  margin:0 14px 14px;
  border-radius:14px;
  font-size:13px;
}
.qdx-pro-note.ok{
  background:#f0fdf4;
  border:1px solid #bbf7d0;
  color:#166534;
}
.qdx-pro-note.err{
  background:#fff1f2;
  border:1px solid #fecaca;
  color:#9f1239;
}

.qdx-table{
  width:100%;
  border-collapse:collapse;
}
.qdx-table th{
  text-align:left;
  font-size:12px;
  color:var(--qdx-muted);
  padding:10px 14px;
  border-bottom:1px solid var(--qdx-border);
  background:#fcfcfd;
}
.qdx-table td{
  padding:12px 14px;
  border-bottom:1px solid #f1f5f9;
  vertical-align:middle;
  font-size:13px;
}
.qdx-chip{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  border:1px solid var(--qdx-border);
  background:var(--qdx-soft);
}
.qdx-chip.owner{ border-color: rgba(255,122,24,.35); background: rgba(255,122,24,.10); color:#b45309; }
.qdx-chip.admin{ border-color: rgba(59,130,246,.35); background: rgba(59,130,246,.10); color:#1d4ed8; }
.qdx-chip.member{ border-color: rgba(16,185,129,.35); background: rgba(16,185,129,.10); color:#065f46; }
.qdx-chip.viewer{ border-color: rgba(148,163,184,.55); background: rgba(148,163,184,.12); color:#334155; }

.qdx-chip.status-active{ border-color: rgba(16,185,129,.35); background: rgba(16,185,129,.10); color:#065f46; }
.qdx-chip.status-removed{ border-color: rgba(239,68,68,.35); background: rgba(239,68,68,.08); color:#991b1b; }

.qdx-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
}

.qdx-mini{
  padding:8px 10px;
  border-radius:12px;
  font-weight:800;
  font-size:12px;
}

.qdx-progress{
  height:12px;
  background:#f1f5f9;
  border-radius:999px;
  overflow:hidden;
  border:1px solid var(--qdx-border);
}
.qdx-progress > div{
  height:12px;
  background: linear-gradient(90deg, var(--qdx-orange), #ffb26b);
}

.qdx-cta{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:12px;
}
.qdx-help{
  font-size:12px;
  color:var(--qdx-muted);
}

.qdx-soft-box{
  padding:12px 14px;
  border-radius:16px;
  background:linear-gradient(180deg,#fff, #f8fafc);
  border:1px solid var(--qdx-border);
}


.qdx-urgency{
  display:inline-flex;align-items:center;
  padding:6px 10px;border-radius:999px;
  font-size:12px;font-weight:900;
  border:1px solid #e5e7eb;background:#f8fafc;
}
.qdx-urgency.warn{ background:#fff7ed;color:#9a3412; }
.qdx-urgency.critical{ background:#fee2e2;color:#991b1b; }
.qdx-urgency.full{ background:#fecaca;color:#7f1d1d; }

.qdx-dashboard-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
@media (max-width:960px){
  .qdx-dashboard-grid{ grid-template-columns:1fr; }
}


/* Seat status bar */
.qdx-seatbar{
  margin-top:10px;
  height:12px;
  border-radius:999px;
  overflow:hidden;
  border:1px solid var(--qdx-border);
  background:#f1f5f9;
}
.qdx-seatbar > div{
  height:12px;
  background: linear-gradient(90deg, var(--qdx-orange), #ffb26b);
  transition: width .65s ease;
}
.qdx-seatbar.critical > div, .qdx-seatbar.full > div{
  background: linear-gradient(90deg, #ef4444, #fb7185);
}
@keyframes qdxPulse {
  0%{ transform: scale(1); }
  50%{ transform: scale(1.02); }
  100%{ transform: scale(1); }
}
.qdx-urgency.pulse{ animation: qdxPulse 1.1s ease-in-out infinite; }

/* Pro modal */
.qdx-modal-backdrop{
  position:fixed; inset:0;
  background:rgba(2,6,23,.62);
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  z-index:99999;
}
.qdx-modal{
  width:min(920px, 100%);
  background:#fff;
  border-radius:18px;
  border:1px solid var(--qdx-border);
  box-shadow: 0 20px 60px rgba(2,6,23,.35);
  overflow:hidden;
}
.qdx-modal-h{
  padding:14px 16px;
  border-bottom:1px solid var(--qdx-border);
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  background:linear-gradient(180deg,#fff, #f8fafc);
}
.qdx-modal-h strong{ font-size:14px; }
.qdx-modal-x{
  border:1px solid var(--qdx-border);
  background:#fff;
  border-radius:12px;
  padding:8px 10px;
  cursor:pointer;
  font-weight:900;
}
.qdx-modal-b{ padding:16px; }
.qdx-matrix{
  display:grid;
  grid-template-columns: 1.2fr .9fr .9fr;
  gap:10px;
}
@media (max-width: 860px){
  .qdx-matrix{ grid-template-columns:1fr; }
}
.qdx-matrix .col{
  border:1px solid var(--qdx-border);
  border-radius:16px;
  overflow:hidden;
}
.qdx-matrix .col .top{
  padding:12px 14px;
  background:#fcfcfd;
  border-bottom:1px solid var(--qdx-border);
  font-weight:900;
}
.qdx-matrix ul{
  margin:0; padding:12px 16px 14px 22px;
  color:var(--qdx-muted);
  line-height:1.7;
}
.qdx-matrix .cta{
  padding:12px 14px 14px;
  border-top:1px solid var(--qdx-border);
}


/* Manage Team button badge */
.qdx-btn-with-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.qdx-btn-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  border:1px solid var(--qdx-border);
  background: var(--qdx-soft);
  color: var(--qdx-slate);
}
.qdx-btn-badge.warn{
  border-color: rgba(245,158,11,.35);
  background: rgba(245,158,11,.10);
  color:#92400e;
}
.qdx-btn-badge.critical, .qdx-btn-badge.full{
  border-color: rgba(239,68,68,.45);
  background: rgba(239,68,68,.10);
  color:#991b1b;
}


/* Add seats button contrast (white button on orange CTA) */
.qdx-cta .qdx-btn-primary{
  background:#fff !important;
  border-color:#fff !important;
  color: var(--qdx-orange) !important;
}
.qdx-cta .qdx-btn-primary svg,
.qdx-cta .qdx-btn-primary svg *{
  fill: var(--qdx-orange) !important;
  stroke: var(--qdx-orange) !important;
}