/* ManaResource Global UI/UX Standard V3
   Presentation-only normalization. Tool logic/functionality is intentionally untouched.
*/

.mr-unified-page {
  --mr-bg: var(--bg-main, #fbfbfa);
  --mr-surface: var(--bg-section, #fff);
  --mr-surface-2: var(--bg-section-alt, #f5f5f2);
  --mr-card: var(--bg-card, #fff);
  --mr-soft: var(--bg-card-soft, #fff9d9);
  --mr-text: var(--text-main, #181818);
  --mr-heading: var(--text-heading, #111);
  --mr-text-2: var(--text-secondary, #303030);
  --mr-muted: var(--text-muted, #666);
  --mr-border: var(--border-color, rgba(17,17,17,.1));
  --mr-border-strong: var(--border-strong, rgba(17,17,17,.18));
  --mr-accent: var(--accent, #ffd21c);
  --mr-accent-soft: var(--accent-soft, #fff3a6);
  --mr-accent-text: var(--accent-text, #111);
  --mr-primary-bg: var(--button-primary-bg, #111);
  --mr-primary-text: var(--button-primary-text, #fff);
  --mr-secondary-bg: var(--button-secondary-bg, #fff);
  --mr-secondary-text: var(--button-secondary-text, #111);
  --mr-secondary-border: var(--button-secondary-border, rgba(17,17,17,.12));
  --mr-focus: rgba(255,210,28,.45);
  color: var(--mr-text);
  background: var(--mr-bg);
  font-family: var(--font-stack, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
}

.mr-unified-page *,
.mr-unified-page *::before,
.mr-unified-page *::after { box-sizing: border-box; }

.mr-unified-page :where(input, select, textarea) {
  color: var(--mr-text) !important;
  background-color: var(--mr-surface) !important;
  border-color: var(--mr-border-strong) !important;
  caret-color: var(--mr-text);
}

.mr-unified-page :where(input, select, textarea)::placeholder {
  color: var(--mr-muted) !important;
  opacity: .85;
}

.mr-unified-page :where(input, select, textarea):focus {
  outline: none;
  border-color: var(--mr-accent) !important;
  box-shadow: 0 0 0 3px var(--mr-focus) !important;
}

.mr-unified-page :where(button, a, input, select, textarea) {
  font-family: inherit;
}

.mr-unified-page :where(button) { cursor: pointer; }
.mr-unified-page :where(button:disabled, input:disabled, select:disabled, textarea:disabled) { cursor: not-allowed; }

/* Neutral button baseline. Existing semantic classes keep their own colors. */
.mr-unified-page :where(.btn, .button, button[class*="btn"], a[class*="btn"]) {
  border-radius: var(--radius-md, 14px);
  min-height: 42px;
  font-weight: 800;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background-color .18s ease;
}

.mr-unified-page :where(.btn-primary, .btn-yellow, .btn-master-generate, .primary, .btn.primary) {
  background: var(--mr-primary-bg) !important;
  color: var(--mr-primary-text) !important;
  border-color: transparent !important;
}

.mr-unified-page :where(.btn-outline, .btn-secondary, .secondary) {
  background: var(--mr-secondary-bg) !important;
  color: var(--mr-secondary-text) !important;
  border-color: var(--mr-secondary-border) !important;
}

.mr-unified-page :where(.btn-primary, .btn-yellow, .btn-master-generate, .primary, .btn.primary):hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm, 0 6px 18px rgba(0,0,0,.06));
}

/* Common surface language */
.mr-unified-page :where(.card, .tool-card, .feature-card, .generator-card, .output-card, .shortcut-card, .section-card, .panel, .modal-card, .history-card) {
  border-color: var(--mr-border) !important;
}

/* Headings and supporting text use the global readable palette unless a component explicitly opts out. */
.mr-unified-page :where(.section-title, .section-heading, .card-title, .tool-title, .generator-head h3, .output-title, .modal-title) {
  color: var(--mr-heading);
}

.mr-unified-page :where(.section-subtitle, .card-description, .tool-description, .helper-text, .muted, .text-muted) {
  color: var(--mr-muted);
}

/* Select menus can inherit a browser white background that clashes with Midnight/Cat/Cream. */
.mr-unified-page :where(option, optgroup) {
  color: var(--mr-text) !important;
  background: var(--mr-surface) !important;
}

/* Code / JSON output remains readable across every theme. */
.mr-unified-page :where(pre, code, .json-code, .json-output, .output-code) {
  color: var(--mr-text) !important;
  background: var(--mr-surface-2) !important;
  border-color: var(--mr-border) !important;
}

/* Links should never inherit an unreadable dark-on-dark / light-on-light color. */
.mr-unified-page :where(a:not(.btn):not(.button):not(.platform-btn-card):not(.dropdown-item)) {
  color: inherit;
}

.mr-unified-page :where(a):focus-visible,
.mr-unified-page :where(button):focus-visible {
  outline: 3px solid var(--mr-focus) !important;
  outline-offset: 2px;
}

/* Tables / history lists */
.mr-unified-page :where(th) {
  color: var(--mr-heading) !important;
  background: var(--mr-surface-2) !important;
}
.mr-unified-page :where(td) {
  color: var(--mr-text) !important;
  border-color: var(--mr-border) !important;
}

/* Mobile consistency */
@media (max-width: 768px) {
  .mr-unified-page :where(.container) { width: min(100% - 28px, 1180px); }
  .mr-unified-page :where(.btn, .button, button[class*="btn"]) { min-height: 44px; }
}
