/* shared control language */
.button, .btn, .btnlink, .auth-submit, .cookie-accept, .cookie-reject {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 37px !important;
  padding: 0 14px !important;
  border: 1px solid var(--p2-line-default) !important;
  border-radius: var(--p2-radius) !important;
  background: var(--p2-surface-2) !important;
  color: var(--p2-text) !important;
  font-size: 13px !important;
  font-weight: 590 !important;
  line-height: 1 !important;
  letter-spacing: -.01em !important;
  text-decoration: none !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .025) inset !important;
}
.button:hover, .btn:hover, .btnlink:hover, .cookie-reject:hover {
  border-color: var(--p2-line-strong) !important;
  background: var(--p2-hover) !important;
  transform: translateY(-1px);
}
.button:active, .btn:active, .btnlink:active { transform: translateY(0) scale(.985); }
.button-login, .button-dark, .btn-primary, .btn.primary, .btnlink.primary, .auth-submit, .cookie-accept {
  border-color: #f4f4f5 !important;
  background: #f4f4f5 !important;
  color: #09090a !important;
}
.button-login:hover, .button-dark:hover, .btn-primary:hover, .btn.primary:hover,
.btnlink.primary:hover, .auth-submit:hover, .cookie-accept:hover {
  border-color: #dedee2 !important;
  background: #dedee2 !important;
}
.button-ghost, .btn-ghost { background: transparent !important; }
.btn-danger, .danger-zone .btn, [data-action="delete"] {
  border-color: rgba(242, 95, 114, .3) !important;
  background: rgba(242, 95, 114, .07) !important;
  color: #ff9aa8 !important;
}
button:disabled, .button:disabled, .btn:disabled, .btnlink:disabled {
  cursor: not-allowed !important;
  opacity: .42 !important;
  transform: none !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select, textarea, .input {
  width: 100%;
  min-height: 41px !important;
  padding: 9px 12px !important;
  border: 1px solid var(--p2-line-default) !important;
  border-radius: var(--p2-radius) !important;
  background: #0c0c0e !important;
  color: var(--p2-text) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .018) inset !important;
}
textarea { min-height: 112px !important; resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--p2-faint) !important; }
input:hover, select:hover, textarea:hover { border-color: var(--p2-line-strong) !important; }
input:focus, select:focus, textarea:focus {
  border-color: rgba(255, 255, 255, .3) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .055) !important;
}
label, .field-label {
  color: var(--p2-copy) !important;
  font-size: 12.5px !important;
  font-weight: 540 !important;
  letter-spacing: .005em;
}
input[type="checkbox"], input[type="radio"] { accent-color: #f4f4f5; }

.badge, .pill, .mini-badge, .status-badge, .role-badge, .admin-chip,
.files-badge, .plan-badge, .eyebrow, .product-kicker, .legal-kicker {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content;
  min-height: 22px;
  padding: 3px 7px !important;
  border: 1px solid var(--p2-line-default) !important;
  border-radius: 5px !important;
  background: rgba(255, 255, 255, .025) !important;
  color: var(--p2-muted) !important;
  font-family: "Geist Mono", "SFMono-Regular", Consolas, monospace !important;
  font-size: 10px !important;
  font-weight: 560 !important;
  line-height: 1 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
}
.ok, .good { color: var(--p2-positive) !important; }
.bad, .danger { color: #ff9aa8 !important; }
.warn { color: var(--p2-warning) !important; }

/* surface language */
.card, .panel, .product-card, .feature-card, .stats-card, .browser-card,
.code-window, .legal-card, .item, .report-card, .analytics-card, .plan-card,
.summary, .component {
  border: 1px solid var(--p2-line) !important;
  border-radius: var(--p2-radius-lg) !important;
  background: var(--p2-surface-1) !important;
  color: var(--p2-text) !important;
  box-shadow: none !important;
}
.card:hover, .product-card:hover, .feature-card:hover, .plan-card:hover {
  border-color: var(--p2-line-default) !important;
}
.inline-notice, .notice {
  padding: 11px 12px !important;
  border: 1px solid var(--p2-line-default) !important;
  border-radius: var(--p2-radius) !important;
  background: rgba(255, 255, 255, .025) !important;
  color: var(--p2-copy) !important;
  font-weight: 500 !important;
}