/* =========================================================
   MRZ COMPONENTS v1 — shared, theme-agnostic (var() only).
   No hex colors here. Pages use these classes; themes own values.
   ========================================================= */
.mrz-card { background: var(--mrz-card); border: 1px solid var(--mrz-border); border-radius: var(--mrz-r); box-shadow: var(--mrz-sh-1); }
.mrz-card-2 { background: var(--mrz-card-2); border: 1px solid var(--mrz-border); border-radius: var(--mrz-r-sm); }
.mrz-page-title { margin: 0; font-size: 24px; font-weight: 700; color: var(--mrz-text); }
.mrz-page-sub { margin: 4px 0 0; font-size: 12px; color: var(--mrz-muted); }
.mrz-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 0 16px; border-radius: var(--mrz-r-sm); font-size: 13px; font-weight: 600; font-family: inherit; cursor: pointer; border: 1px solid transparent; transition: all .18s ease; text-decoration: none; }
.mrz-btn-sm { min-height: 35px; padding: 0 11px; font-size: 11px; border-radius: 8px; }
.mrz-btn-accent { background: var(--mrz-accent); border-color: var(--mrz-accent); color: #fff; box-shadow: 0 6px 18px rgba(237,127,34,.14); }
.mrz-btn-accent:hover { background: var(--mrz-accent-hover); border-color: var(--mrz-accent-hover); }
.mrz-btn-dark { background: var(--mrz-btn-dark-bg); border-color: var(--mrz-btn-dark-bd); color: var(--mrz-btn-dark-tx); box-shadow: var(--mrz-sh-1); }
.mrz-btn-ghost { background: transparent; border-color: var(--mrz-border-strong); color: var(--mrz-text-2); }
.mrz-btn-ghost:hover { border-color: var(--mrz-accent); color: var(--mrz-text); }
.mrz-btn-danger { background: var(--mrz-red-bg); border-color: var(--mrz-red-bd); color: var(--mrz-red-tx); }
.mrz-btn-success { background: var(--mrz-green-bg); border-color: var(--mrz-green-bd); color: var(--mrz-green-tx); }
.mrz-label { display: block; font-size: 11px; font-weight: 600; color: var(--mrz-text-2); margin-bottom: 6px; }
.mrz-input, .mrz-select, .mrz-textarea { width: 100%; box-sizing: border-box; min-height: 40px; padding: 0 12px; background: var(--mrz-input); border: 1px solid var(--mrz-border-strong); border-radius: var(--mrz-r-sm); color: var(--mrz-text); font-family: inherit; font-size: 13px; outline: none; }
.mrz-textarea { padding: 10px 12px; resize: vertical; }
.mrz-input:focus, .mrz-select:focus, .mrz-textarea:focus { border-color: var(--mrz-accent); box-shadow: 0 0 0 3px var(--mrz-accent-soft); }
.mrz-input::placeholder, .mrz-textarea::placeholder { color: var(--mrz-muted); }
.mrz-table-wrap { background: var(--mrz-card); border: 1px solid var(--mrz-border); border-radius: var(--mrz-r); box-shadow: var(--mrz-sh-2); overflow-x: auto; }
.mrz-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.mrz-table th { background: var(--mrz-card-2); color: var(--mrz-muted); font-weight: 600; text-align: right; padding: 11px 12px; border-bottom: 1px solid var(--mrz-border-strong); white-space: nowrap; }
.mrz-table td { padding: 11px 12px; border-bottom: 1px solid var(--mrz-border); color: var(--mrz-text-2); vertical-align: middle; }
.mrz-table tbody tr:last-child td { border-bottom: none; }
.mrz-table tbody tr:hover { background: var(--mrz-accent-soft); }
.mrz-badge { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 999px; font-size: 10px; font-weight: 600; border: 1px solid transparent; white-space: nowrap; }
.mrz-badge-green { background: var(--mrz-green-bg); border-color: var(--mrz-green-bd); color: var(--mrz-green-tx); }
.mrz-badge-red { background: var(--mrz-red-bg); border-color: var(--mrz-red-bd); color: var(--mrz-red-tx); }
.mrz-badge-amber { background: var(--mrz-amber-bg); border-color: var(--mrz-amber-bd); color: var(--mrz-amber-tx); }
.mrz-badge-blue { background: var(--mrz-blue-bg); border-color: var(--mrz-blue-bd); color: var(--mrz-blue-tx); }
.mrz-badge-gray { background: var(--mrz-card-2); border-color: var(--mrz-border-strong); color: var(--mrz-muted); }
.mrz-banner { padding: 12px 16px; border-radius: var(--mrz-r-sm); font-size: 12px; line-height: 1.9; border: 1px solid transparent; }
.mrz-banner-red { background: var(--mrz-red-bg); border-color: var(--mrz-red-bd); color: var(--mrz-red-tx); }
.mrz-banner-amber { background: var(--mrz-amber-bg); border-color: var(--mrz-amber-bd); color: var(--mrz-amber-tx); }
.mrz-banner-blue { background: var(--mrz-blue-bg); border-color: var(--mrz-blue-bd); color: var(--mrz-blue-tx); }
.mrz-banner-green { background: var(--mrz-green-bg); border-color: var(--mrz-green-bd); color: var(--mrz-green-tx); }
.mrz-btn-accent-soft { background: var(--mrz-accent-soft); border-color: var(--mrz-accent-bd); color: var(--mrz-accent-tx); }
.mrz-btn-accent-soft:hover { border-color: var(--mrz-accent); color: var(--mrz-accent-tx); }
.mrz-banner strong { font-weight: 800; }
.mrz-btn-purple { background: var(--mrz-purple-bg); border-color: var(--mrz-purple-bd); color: var(--mrz-purple-tx); }
.mrz-btn-dark:hover { border-color: var(--mrz-accent-bd); }