/**
 * PPP Design System v1 — shared components (buttons, forms, cards, callouts).
 * Visual-only; does not alter behavior. Load after ppp_design_tokens.css.
 */

/* ----- Base rhythm ----- */

body.ppp-ops-shell,
body.auth-page,
body.ci-page,
body.preview-mode,
body.report-print-layout,
body.inspector-schedule-body,
body.fc-field-checklist-route,
body.inspection-brief-print {
  font-family: var(--ppp-font-sans);
  font-size: var(--ppp-font-size-base);
  line-height: var(--ppp-line-height-base);
  color: var(--ppp-text);
}

/* ----- Forms ----- */

.ppp-control,
body.ppp-ops-shell input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
body.ppp-ops-shell select,
body.ppp-ops-shell textarea,
body.ci-page input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
body.ci-page select,
body.ci-page textarea,
body.inspector-schedule-body input:not([type="hidden"]):not([type="submit"]):not([type="button"]),
body.inspector-schedule-body select,
body.inspector-schedule-body textarea {
  font-family: inherit;
  font-size: inherit;
  color: var(--ppp-text);
  background: var(--ppp-control-bg);
  border: 1px solid var(--ppp-control-border);
  border-radius: var(--ppp-control-radius);
}

body.ppp-ops-shell input::placeholder,
body.ppp-ops-shell textarea::placeholder,
body.ci-page input::placeholder,
body.ci-page textarea::placeholder,
body.inspector-schedule-body input::placeholder,
body.inspector-schedule-body textarea::placeholder {
  color: var(--ppp-text-soft);
  opacity: 1;
}

body.ppp-ops-shell input:focus-visible,
body.ppp-ops-shell select:focus-visible,
body.ppp-ops-shell textarea:focus-visible,
body.ci-page input:focus-visible,
body.ci-page select:focus-visible,
body.ci-page textarea:focus-visible,
body.inspector-schedule-body input:focus-visible,
body.inspector-schedule-body select:focus-visible,
body.inspector-schedule-body textarea:focus-visible {
  outline: 2px solid var(--ppp-control-focus-ring);
  outline-offset: 1px;
  border-color: var(--ppp-gold-600);
}

/* ----- Native checkboxes & radios (PPP gold accent; no legacy teal) ----- */

input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--ppp-control-accent);
  cursor: pointer;
}

input[type="checkbox"]:not(:disabled):hover,
input[type="radio"]:not(:disabled):hover {
  accent-color: var(--ppp-control-accent-hover);
}

input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible {
  outline: 2px solid var(--ppp-control-accent-ring);
  outline-offset: 2px;
}

input[type="checkbox"]:disabled,
input[type="radio"]:disabled {
  opacity: 0.5;
  accent-color: color-mix(in srgb, var(--ppp-control-accent) 72%, var(--ppp-text-muted));
  cursor: not-allowed;
}

.eso-choice input[type="checkbox"],
.eso-choice input[type="radio"],
.insights-filter-check input,
.insights-filter-radio input,
.workflow-inspection-brief-complete-check__label input[type="checkbox"],
.qc-item-row__main input[type="checkbox"],
.qc-pipe-cb,
.qc-env-toggle__cb,
#qc-report-inline-root .qc-me-inline__radio-input {
  accent-color: var(--ppp-control-accent);
}

.eso-choice input[type="checkbox"]:not(:disabled):hover,
.eso-choice input[type="radio"]:not(:disabled):hover,
.insights-filter-check input:not(:disabled):hover,
.insights-filter-radio input:not(:disabled):hover {
  accent-color: var(--ppp-control-accent-hover);
}

/* ----- Cards ----- */

.ppp-card,
body.ppp-ops-shell .card,
body.ci-page .ci-card,
body.ci-page .ci-panel {
  background: var(--ppp-surface-card);
  border: 1px solid var(--ppp-border);
  border-radius: var(--ppp-radius-lg);
  box-shadow: var(--ppp-shadow-xs);
}

/* ----- Buttons (semantic variants; app.css .btn remains base) ----- */

.btn.ppp-btn--schedule,
.btn-warning,
.btn-schedule {
  background: var(--ppp-btn-warning-bg);
  border-color: var(--ppp-btn-warning-border);
  color: var(--ppp-btn-warning-text);
}

.btn.ppp-btn--success,
.btn-upload,
.btn-success {
  background: var(--ppp-btn-success-bg);
  border-color: var(--ppp-btn-success-border);
  color: var(--ppp-btn-success-text);
}

.btn.ppp-btn--danger,
.btn-submit-danger,
.btn-danger-soft {
  background: var(--ppp-btn-danger-bg);
  border-color: var(--ppp-btn-danger-border);
  color: var(--ppp-btn-danger-text);
}

.btn.ppp-btn--indigo,
.btn-checklist {
  background: var(--ppp-accent-indigo);
  border-color: #434b5c;
  color: #fff;
}

.btn-primary {
  background: var(--ppp-btn-primary-bg);
  border-color: var(--ppp-btn-primary-border);
  color: var(--ppp-btn-primary-text);
}

.btn-secondary,
.btn-neutral {
  background: var(--ppp-btn-secondary-bg);
  border-color: var(--ppp-btn-secondary-border);
  color: var(--ppp-btn-secondary-text);
}

/* ----- Callouts ----- */

.ppp-callout {
  padding: var(--ppp-space-3) var(--ppp-space-4);
  border-radius: var(--ppp-radius-md);
  border: 1px solid var(--ppp-border);
  font-size: var(--ppp-font-size-sm);
  line-height: var(--ppp-line-height-base);
}

.ppp-callout-info {
  background: var(--ppp-callout-info-bg);
  border-color: var(--ppp-callout-info-border);
  color: var(--ppp-text);
}

.ppp-callout-warning {
  background: var(--ppp-callout-warning-bg);
  border-color: var(--ppp-callout-warning-border);
  color: var(--ppp-text);
}

.ppp-callout-danger {
  background: var(--ppp-callout-danger-bg);
  border-color: var(--ppp-callout-danger-border);
  color: var(--ppp-text);
}

.ppp-callout-safety {
  background: var(--ppp-callout-safety-bg);
  border-color: var(--ppp-callout-safety-border);
  color: var(--ppp-text);
}

/* Bridge legacy brief/checklist callout class names */
.note,
.warning-muted,
.file-warning,
.map-note,
.callout-note {
  font-family: inherit;
}

@media print {
  .ppp-callout,
  .ppp-card {
    box-shadow: none;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}