:root{
  --brand: #007c72;         
  --brand-ink: #ffffff;
  --brand-soft: rgba(0,124,114,.10);
  --ink: #0f172a;
  --border: rgba(15,23,42,.12);
  --radius: 5px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding: 10px 14px;
  border-radius: var(--radius);
  border: 1px solid transparent;
  text-decoration:none;
  font-weight:800;
  cursor:pointer;
}

.btn-brand{
  background: var(--brand);
  color: var(--brand-ink);
}
.btn-brand:hover{ filter: brightness(.98); }

.btn-brand-outline{
  background: #fff;
  color: var(--brand);
  border-color: rgba(0,124,114,.35);
}
.btn-brand-outline:hover{ background: var(--brand-soft); }

.acc{
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 10px 12px;
  background:#fff;
  margin-bottom: 10px;
}

.acc__summary{
  list-style:none;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  cursor:pointer;
  font-weight:900;
}

.acc__summary::-webkit-details-marker{ display:none; }

.acc__summary::after{
  content:"▾";
  opacity:.6;
  transition: transform .15s ease;
}

.acc[open] .acc__summary::after{
  transform: rotate(180deg);
}

.acc__meta{
  font-weight:800;
  font-size:12px;
  opacity:.65;
}

.acc__body{
  margin-top: 10px;
}

.status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight:900;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
  vertical-align: middle;
  border: 2px solid transparent; 
  background:#fff;               
}

.status-new{
  background:#fff7cc;
  color:#7a4d00;
  border-color:#f2c200;
}

.status-in_progress{
  background:#ffe6cc;
  color:#7a2f00;
  border-color:#ff8a00;
}

.status-ordered_from_supplier{
  background:#dbeafe;
  color:#123a7a;
  border-color:#3b82f6;
}

.status-ready{
  background:#dcfce7;
  color:#14532d;
  border-color:#22c55e;
}

.status-issued{
  background:#f1f5f9;
  color:#334155;
  border-color:#94a3b8;
}

.status-canceled{
  background:#fee2e2;
  color:#7f1d1d;
  border-color:#ef4444;
}

:root{
  --brand: #007c72;        
  --brand-dark: #00665d;
  --brand-light: #e6f4f2;
  --danger: #ef4444;
  --border: rgba(15,23,42,.12);
  --radius: 5px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding: 10px 16px;
  border-radius: var(--radius);
  font-weight:800;
  text-decoration:none;
  border:1px solid transparent;
  transition: all .15s ease;
  cursor:pointer;
}

.btn-primary,
.btn-success,
.btn-brand{
  background: var(--brand) !important;
  border-color: var(--brand) !important;
  color: #fff !important;
}

.btn-primary:hover,
.btn-success:hover,
.btn-brand:hover{
  background: var(--brand-dark) !important;
  border-color: var(--brand-dark) !important;
}

.btn-outline-primary,
.btn-outline-success,
.btn-brand-outline{
  background: #fff !important;
  color: var(--brand) !important;
  border: 2px solid var(--brand) !important;
}

.btn-outline-primary:hover,
.btn-outline-success:hover,
.btn-brand-outline:hover{
  background: var(--brand-light) !important;
}

.btn-danger{
  background: var(--danger) !important;
  border-color: var(--danger) !important;
  color:#fff !important;
}

.btn-danger:hover{
  filter: brightness(.95);
}