/* Seylac V4.2 — additive UX, mobile and accessibility contract. */
:root {
  --sy-v42-brand: #063e52;
  --sy-v42-brand-hover: #0a526b;
  --sy-v42-focus: #16b8c4;
  --sy-v42-border: #d9e3e7;
  --sy-v42-muted: #5f7179;
  --sy-v42-radius: 14px;
}

body.seylac-app,
body.seylac-guest,
body.pcc-body { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }

body.seylac-app :where(p, small, .muted, .help-text, .field-help),
body.seylac-guest :where(p, small, .muted, .help-text),
body.pcc-body :where(p, small, .muted) { line-height: 1.55; }

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--sy-v42-focus) 70%, white);
  outline-offset: 2px;
}

body.seylac-app :where(.btn-primary, button.primary, [type="submit"]:not(.link-button):not(.danger):not(.btn-danger):not(.is-danger)),
body.seylac-guest :where(.btn-primary, button.primary, [type="submit"]:not(.danger):not(.btn-danger):not(.is-danger)),
body.pcc-body :where(.pcc-btn:not(.secondary), .pcc-mini-btn) {
  background-color: var(--sy-v42-brand);
  border-color: var(--sy-v42-brand);
}

body.seylac-app :where(.btn-primary, button.primary, [type="submit"]:not(.link-button):not(.danger):not(.btn-danger):not(.is-danger)):hover,
body.seylac-guest :where(.btn-primary, button.primary, [type="submit"]:not(.danger):not(.btn-danger):not(.is-danger)):hover,
body.pcc-body :where(.pcc-btn:not(.secondary), .pcc-mini-btn):hover { background-color: var(--sy-v42-brand-hover); }

:where(.table-wrap, .responsive-table, .pcc-data-table) { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
:where(table) { border-collapse: collapse; }
:where(input, select, textarea, button) { font: inherit; }
:where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) { min-height: 44px; }
:where(textarea) { resize: vertical; }

@media (max-width: 760px) {
  body.seylac-app :where(.page-content, .content, main),
  body.pcc-body :where(.pcc-main, .pcc-content) { min-width: 0; }

  body.seylac-app :where(.page-header, .panel-head, .card-head, .toolbar),
  body.pcc-body :where(.pcc-panel-head, .pcc-toolbar) { align-items: flex-start; flex-wrap: wrap; gap: 12px; }

  body.seylac-app :where(.form-grid, .grid-2, .grid-3, .filters, .actions-grid),
  body.seylac-guest :where(.form-grid, .grid-2),
  body.pcc-body :where(.pcc-form-grid, .pcc-dashboard-grid, .pcc-metric-grid) { grid-template-columns: minmax(0, 1fr) !important; }

  body.seylac-app :where(.actions, .form-actions, .button-row),
  body.seylac-guest :where(.actions, .form-actions),
  body.pcc-body :where(.pcc-actions, .pcc-inline-form) { flex-wrap: wrap; }

  body.seylac-app :where(.actions, .form-actions, .button-row) > :where(a, button),
  body.seylac-guest :where(.actions, .form-actions) > :where(a, button) { min-height: 46px; }

  :where(.modal, .dialog, dialog, .pcc-modal) { max-width: calc(100vw - 24px) !important; max-height: calc(100dvh - 24px); overflow: auto; }
  :where(.card, .panel, .app-card, .pcc-panel) { border-radius: var(--sy-v42-radius); }
  :where(th, td) { white-space: nowrap; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}