/* WP Contact Pro v2.0.1 — maps --gpx-* from Gamepex Core, falls back to own defaults */
:root {
  --wcp-accent:  var(--gpx-accent,  #2563eb);
  --wcp-btn-text:var(--gpx-btn-text,#ffffff);
  --wcp-bg:      var(--gpx-form-bg, #ffffff);
  --wcp-surface: var(--gpx-input-bg,#f8fafc);
  --wcp-border:  var(--gpx-border,  #e2e8f0);
  --wcp-text:    var(--gpx-text,    #1e293b);
  --wcp-muted:   var(--gpx-muted,   #64748b);
  --wcp-success: var(--gpx-success, #16a34a);
  --wcp-error:   var(--gpx-error,   #dc2626);
  --wcp-radius:  var(--gpx-radius,  8px);
  --wcp-fs:      var(--gpx-font-size, 15px);
}

.wcp-form-wrap {
  max-width: 640px;
  margin: 0 auto;
  background: var(--wcp-bg);
  font-size: var(--wcp-fs);
}
.wcp-form-title { font-size: 1.4em; font-weight: 700; color: var(--wcp-text); margin-bottom: 1.2rem; }

.wcp-field { display: flex; flex-direction: column; gap: 5px; margin-bottom: 1rem; }

/* ── Label: * stays next to text, char counter pushes to the right ──────── */
.wcp-label {
  font-size: .875em;
  font-weight: 600;
  color: var(--wcp-text);
  display: flex;
  align-items: baseline;
  gap: 2px;
}
.wcp-req { color: var(--wcp-error); }
.wcp-charcount {
  margin-left: auto;           /* pushes the counter to the far right */
  font-size: 11px;
  font-weight: 400;
  color: var(--wcp-muted);
}
.wcp-charcount.wcp-near-limit { color: #f59e0b; }
.wcp-charcount.wcp-at-limit   { color: var(--wcp-error); }

/* ── Inputs — use #wcp-form to beat dark-theme attribute selectors ───────
   e.g. theme's  input[type="email"] { background: #111 }  has specificity 0,1,1
   our  #wcp-form .wcp-input          has specificity 1,1,0  → always wins       */
#wcp-form .wcp-input,
#wcp-form-wrap .wcp-input {
  padding: 10px 14px;
  border: 1px solid var(--wcp-border);
  border-radius: var(--wcp-radius);
  background: var(--wcp-surface);
  color: var(--wcp-text);
  font-size: var(--wcp-fs);
  width: 100%;
  box-sizing: border-box;
  transition: border-color .15s, box-shadow .15s;
  font-family: inherit;
}
#wcp-form .wcp-input:focus,
#wcp-form-wrap .wcp-input:focus {
  outline: none;
  border-color: var(--wcp-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--wcp-accent) 15%, transparent);
}
select.wcp-input { appearance: auto; }
.wcp-textarea    { resize: vertical; min-height: 130px; }
.wcp-captcha-input { max-width: 120px; }

.wcp-consent-label { display: flex; align-items: flex-start; gap: 8px; font-size: .8em; color: var(--wcp-muted); cursor: pointer; }
.wcp-consent-label input { margin-top: 2px; flex-shrink: 0; accent-color: var(--wcp-accent); }

.wcp-btn {
  background: var(--wcp-accent);
  color: var(--wcp-btn-text);
  border: none;
  padding: 11px 28px;
  border-radius: var(--wcp-radius);
  font-size: var(--wcp-fs);
  font-weight: 600;
  cursor: pointer;
  transition: opacity .15s, transform .1s;
  font-family: inherit;
}
.wcp-btn:hover   { opacity: .88; transform: translateY(-1px); }
.wcp-btn:active  { opacity: 1; transform: none; }
.wcp-btn:disabled { opacity: .6; cursor: not-allowed; transform: none; }

.wcp-response { padding: 12px 16px; border-radius: var(--wcp-radius); margin-bottom: 1rem; font-size: .9em; font-weight: 500; }
.wcp-response.success { background: #dcfce7; color: var(--wcp-success); border: 1px solid #bbf7d0; }
.wcp-response.error   { background: #fee2e2; color: var(--wcp-error);   border: 1px solid #fecaca; }

/* ── Admin ───────────────────────────────────────────────────────────────── */
.wcp-admin-wrap { max-width: 1200px; }
.wcp-table .wcp-unread td { font-weight: 600; }
.wcp-status-badge { display: inline-block; padding: 2px 8px; border-radius: 99px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.wcp-status-unread { background: #dbeafe; color: #1d4ed8; }
.wcp-status-read   { background: #f1f5f9; color: var(--wcp-muted, #64748b); }
.wcp-msg-preview   { margin-top: 8px; padding: 10px 14px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 6px; font-size: .875em; color: #64748b; white-space: pre-wrap; word-break: break-word; }

/* Analytics */
.wcp-stat-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px,1fr)); gap: 16px; margin: 20px 0; }
.wcp-stat-card  { background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 20px; text-align: center; box-shadow: 0 1px 4px rgba(0,0,0,.05); }
.wcp-stat-number { font-size: 2rem; font-weight: 800; color: #2563eb; line-height: 1; }
.wcp-stat-label  { font-size: 12px; color: #64748b; margin-top: 6px; font-weight: 500; }
.wcp-chart-wrap  { background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 20px; box-shadow: 0 1px 4px rgba(0,0,0,.05); }
.wcp-chart-wrap h2 { margin: 0 0 16px; font-size: 14px; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: .05em; }