.partner-promo-admin {
  --pp-navy: #102445;
  --pp-blue: #2563eb;
  --pp-green: #059669;
  --pp-border: #dbe4f0;
  color: #16233a;
  display: grid;
  gap: 18px;
}

.pp-hero {
  align-items: center;
  background:
    radial-gradient(circle at 90% 15%, rgba(96, 165, 250, .34), transparent 30%),
    linear-gradient(135deg, #102445, #1d4ed8);
  border-radius: 24px;
  color: #fff;
  display: flex;
  gap: 22px;
  justify-content: space-between;
  overflow: hidden;
  padding: 26px 28px;
  position: relative;
}

.pp-hero.is-demo { background: linear-gradient(135deg, #5b21b6, #7c3aed); }
.pp-hero__copy { max-width: 740px; position: relative; z-index: 1; }
.pp-hero__copy > span { color: #bfdbfe; font-size: 12px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.pp-hero h2 { font-size: clamp(24px, 3vw, 36px); line-height: 1.08; margin: 8px 0; }
.pp-hero p { color: #dbeafe; font-size: 14px; line-height: 1.6; margin: 0; }
.pp-hero__actions { display: flex; flex-wrap: wrap; gap: 9px; justify-content: flex-end; position: relative; z-index: 1; }
.pp-hero button,
.pp-btn {
  align-items: center;
  background: #fff;
  border: 0;
  border-radius: 11px;
  color: #16315f;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  gap: 7px;
  justify-content: center;
  min-height: 42px;
  padding: 0 15px;
}
.pp-hero button.is-active { background: #fef3c7; color: #92400e; }
.pp-btn--primary { background: var(--pp-blue); color: #fff; }
.pp-btn--success { background: var(--pp-green); color: #fff; }
.pp-btn--muted { background: #eff4fa; color: #334155; }
.pp-btn--danger { background: #fff1f2; color: #be123c; }
.pp-btn--small { min-height: 34px; padding: 0 10px; }

.pp-demo-note {
  align-items: center;
  background: #f5f3ff;
  border: 1px solid #ddd6fe;
  border-radius: 15px;
  color: #5b21b6;
  display: flex;
  font-size: 13px;
  gap: 11px;
  padding: 13px 16px;
}

.pp-metrics {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.pp-metric {
  background: #fff;
  border: 1px solid var(--pp-border);
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .05);
  min-width: 0;
  padding: 17px;
}
.pp-metric span { color: #64748b; display: block; font-size: 12px; font-weight: 700; }
.pp-metric strong { color: var(--pp-navy); display: block; font-size: 27px; line-height: 1; margin: 9px 0 5px; }
.pp-metric small { color: #7c8ca5; font-size: 11px; }
.pp-metric.is-good strong { color: var(--pp-green); }
.pp-metric.is-warn strong { color: #d97706; }

.pp-layout {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(290px, .8fr) minmax(0, 1.6fr);
}
.pp-panel {
  background: #fff;
  border: 1px solid var(--pp-border);
  border-radius: 18px;
  box-shadow: 0 8px 26px rgba(15, 23, 42, .05);
  min-width: 0;
  overflow: hidden;
}
.pp-panel__head {
  align-items: center;
  border-bottom: 1px solid #edf1f6;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  padding: 18px 20px;
}
.pp-panel__head h3 { color: var(--pp-navy); font-size: 17px; margin: 0 0 3px; }
.pp-panel__head p { color: #718096; font-size: 12px; margin: 0; }
.pp-panel__body { padding: 18px 20px; }

.pp-form { display: grid; gap: 13px; }
.pp-form-grid { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; }
.pp-field { display: grid; gap: 6px; }
.pp-field.is-wide { grid-column: 1 / -1; }
.pp-field > span { color: #475569; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.pp-field input,
.pp-field select,
.pp-field textarea,
.pp-toolbar input {
  background: #fbfdff;
  border: 1px solid #cfd9e6;
  border-radius: 10px;
  color: #172033;
  font: inherit;
  font-size: 13px;
  min-height: 42px;
  outline: none;
  padding: 9px 11px;
  width: 100%;
}
.pp-field textarea { min-height: 74px; resize: vertical; }
.pp-field input:focus,
.pp-field select:focus,
.pp-field textarea:focus,
.pp-toolbar input:focus { border-color: #60a5fa; box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.pp-switch { align-items: center; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 11px; display: flex; gap: 10px; min-height: 46px; padding: 10px 12px; }
.pp-switch input { accent-color: var(--pp-blue); height: 18px; width: 18px; }
.pp-switch strong { display: block; font-size: 13px; }
.pp-switch small { color: #64748b; display: block; font-size: 11px; }
.pp-form-actions { display: flex; flex-wrap: wrap; gap: 8px; }

.pp-code-list { display: grid; gap: 10px; }
.pp-code-card {
  align-items: center;
  background: #fbfdff;
  border: 1px solid #dce5ef;
  border-radius: 14px;
  display: grid;
  gap: 13px;
  grid-template-columns: minmax(170px, 1.1fr) minmax(150px, .8fr) minmax(140px, .75fr) auto;
  padding: 14px;
}
.pp-code-card.is-off { opacity: .62; }
.pp-code-main code { background: #e8f0ff; border-radius: 7px; color: #1d4ed8; display: inline-block; font-size: 14px; font-weight: 900; letter-spacing: .06em; padding: 5px 8px; }
.pp-code-main strong { display: block; font-size: 13px; margin-top: 7px; }
.pp-code-main small,
.pp-code-stat small { color: #72819a; display: block; font-size: 11px; margin-top: 3px; }
.pp-code-stat strong { color: var(--pp-navy); display: block; font-size: 15px; }
.pp-code-badges { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.pp-badge { background: #eef2f7; border-radius: 999px; color: #475569; display: inline-flex; font-size: 10px; font-style: normal; font-weight: 800; padding: 4px 7px; }
.pp-badge.is-active { background: #dcfce7; color: #047857; }
.pp-badge.is-off { background: #ffe4e6; color: #be123c; }
.pp-code-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }

.pp-toolbar { align-items: center; display: flex; gap: 9px; justify-content: space-between; }
.pp-toolbar input { max-width: 360px; }
.pp-customer-wrap { overflow-x: auto; }
.pp-customer-table { border-collapse: collapse; min-width: 900px; width: 100%; }
.pp-customer-table th { background: #f6f8fb; color: #64748b; font-size: 10px; letter-spacing: .06em; padding: 10px 12px; text-align: left; text-transform: uppercase; }
.pp-customer-table td { border-top: 1px solid #edf1f6; font-size: 12px; padding: 12px; vertical-align: middle; }
.pp-customer-table td strong { color: #172033; display: block; font-size: 13px; }
.pp-customer-table td small { color: #748196; display: block; margin-top: 3px; }
.pp-customer-table tr.is-vip { background: #fffbeb; }
.pp-loyalty-score { align-items: center; display: flex; gap: 8px; }
.pp-loyalty-score b { align-items: center; background: #eff6ff; border-radius: 50%; color: #1d4ed8; display: inline-flex; height: 34px; justify-content: center; width: 34px; }
.pp-loyalty-score.is-vip b { background: #fef3c7; color: #b45309; }
.pp-empty { align-items: center; color: #718096; display: flex; flex-direction: column; gap: 8px; justify-content: center; min-height: 150px; padding: 25px; text-align: center; }
.pp-empty i { color: #a8b5c8; font-size: 28px; }
.pp-empty strong { color: #334155; }

.pp-modal {
  align-items: center;
  background: rgba(15, 23, 42, .72);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 20px;
  position: fixed;
  z-index: 100000;
}
.pp-modal__dialog { background: #fff; border-radius: 20px; box-shadow: 0 28px 80px rgba(15, 23, 42, .32); max-width: 540px; overflow: hidden; width: 100%; }
.pp-modal__head { align-items: center; background: var(--pp-navy); color: #fff; display: flex; justify-content: space-between; padding: 18px 20px; }
.pp-modal__head h3 { margin: 0; }
.pp-modal__head button { background: rgba(255,255,255,.15); border: 0; border-radius: 9px; color: #fff; cursor: pointer; height: 34px; width: 34px; }
.pp-modal__body { padding: 20px; }

@media (max-width: 1100px) {
  .pp-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pp-layout { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .pp-hero { align-items: flex-start; flex-direction: column; padding: 21px; }
  .pp-hero__actions { justify-content: flex-start; }
  .pp-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pp-form-grid { grid-template-columns: 1fr; }
  .pp-field.is-wide { grid-column: auto; }
  .pp-code-card { grid-template-columns: 1fr 1fr; }
  .pp-code-actions { grid-column: 1 / -1; justify-content: flex-start; }
}