/* Shared OperatorCore interface defaults. Page-specific CSS may extend these rules. */
.operatorcore-app {
  --oc-navy: #0d1254;
  --oc-blue: #0879c8;
  --oc-cyan: #08bfd3;
  --oc-ink: #15243a;
  --oc-muted: #60758b;
  --oc-surface: #fff;
  --oc-surface-soft: #f7fbfd;
  --oc-line: #d5e4eb;
  --oc-danger: #9f1d22;
  --oc-radius: 14px;
  --oc-shadow: 0 10px 30px rgba(13, 18, 84, .07);
  color: var(--oc-ink);
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

.operatorcore-app :where(main, .admin-main) { min-width: 0; }
.operatorcore-app :where(h1, h2, h3) { color: var(--oc-navy); line-height: 1.15; }
.operatorcore-app :where(h1, h2, h3, p) { overflow-wrap: anywhere; }
.operatorcore-app :where(.subtitle, small, .help-text, .field-help) { color: var(--oc-muted); }
.operatorcore-app :where(.panel, .card, .metric, .security-item, .management-card, .user-editor, .empty) {
  border-color: var(--oc-line);
  background: var(--oc-surface);
  box-shadow: var(--oc-shadow);
}

.operatorcore-app :where(form label) { color: var(--oc-ink); font-weight: 700; }
.operatorcore-app :where(input, select, textarea) {
  max-width: 100%;
  min-height: 48px;
  border: 1px solid #afc2ce;
  border-radius: 8px;
  padding: 10px 12px;
  background: var(--oc-surface);
  color: var(--oc-ink);
  font: inherit;
}
.operatorcore-app textarea { min-height: 112px; resize: vertical; }
.operatorcore-app :where(input, select, textarea, button, a):focus-visible {
  outline: 3px solid rgba(8, 191, 211, .45);
  outline-offset: 2px;
}
.operatorcore-app :where(input, select, textarea):disabled,
.operatorcore-app :where(input, select, textarea)[readonly] {
  background: #edf3f6;
  color: #40576b;
  cursor: not-allowed;
}

.operatorcore-app :where(.button, button, input[type="button"], input[type="submit"]) {
  min-height: 46px;
  border-radius: 8px;
  font: inherit;
  font-weight: 800;
}
.operatorcore-app :where(.button, button) { touch-action: manipulation; }
.operatorcore-app :where(.button.secondary, button.secondary) {
  border: 1px solid var(--oc-blue);
  background: var(--oc-surface);
  color: var(--oc-blue);
}
.operatorcore-app :where(.button.danger, button.danger, .delete-button) {
  background: var(--oc-danger);
  color: #fff;
}

.operatorcore-app :where(.form-grid, .admin-form, .weather-grid) { align-items: end; }
.operatorcore-app :where(.form-actions, .button-group, .flow-actions, .weather-actions, .request-actions) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}
.operatorcore-app :where(details > summary) { cursor: pointer; }
.operatorcore-app :where(.table-wrap, .weather-scroll) {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.operatorcore-app table { width: 100%; border-collapse: collapse; }
.operatorcore-app :where(th, td) { padding: 11px 12px; border-bottom: 1px solid #e5edf1; text-align: left; vertical-align: top; }
.operatorcore-app th { color: var(--oc-navy); background: var(--oc-surface-soft); font-size: .84rem; letter-spacing: .025em; }
.operatorcore-app :where(.saved, .error, .empty) { padding: 12px 14px; }

@media (min-width: 761px) {
  .operatorcore-app { --oc-radius: 12px; }
  .operatorcore-app :where(.panel, .card, .metric, .security-item, .management-card) { border-radius: var(--oc-radius); }
}

@media (max-width: 760px) {
  .operatorcore-app { --oc-radius: 18px; }
  .operatorcore-app :where(.panel, .card, .metric, .security-item, .management-card, .user-editor, .empty) {
    border-radius: var(--oc-radius);
  }
  .operatorcore-app :where(.form-grid, .admin-form, .weather-grid) { grid-template-columns: minmax(0, 1fr); }
  .operatorcore-app :where(.form-actions, .button-group, .flow-actions, .weather-actions, .request-actions) > :where(.button, button) {
    flex: 1 1 160px;
  }
  .operatorcore-app :where(input, select, textarea) { width: 100%; font-size: 16px; }
  .operatorcore-app :where(th, td) { padding: 10px; }
}

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