/* ============================================================================
 * THEME 04 — الوحشي الجديد | Neo-Brutalist
 * Hard borders, solid offset shadows, press displacement. Layout: iconrail.
 * ============================================================================ */

html[data-theme="neo_brutal"],[data-preview-theme="neo_brutal"] {
  --ui-font: 'Cairo', 'Tajawal', system-ui, sans-serif;
  --ui-heading-weight: 900;
  --ui-heading-tracking: -0.015em;
  --ui-body-size: 13.5px;
  --ui-control-h: 44px;
  --ui-radius: 0px;
  --ui-radius-sm: 0px;
  --ui-radius-pill: 0px;
  --ui-avatar-radius: 0px;
  --ui-gap: 14px;
  --ui-card-pad: 18px;
  --ui-row-pad: 11px;
  --ui-motion: 110ms;

  --ui-canvas: #fffdf5;
  --ui-canvas-2: #ffffff;
  --ui-pattern: none;
  --ui-card-bg: #ffffff;
  --ui-card-bg-hover: #fffbef;
  --ui-subtle: #fff7dd;
  --ui-border: #111111;
  --ui-border-w: 3px;
  --ui-blur: none;
  --ui-shadow: 6px 6px 0 #111111;
  --ui-shadow-hover: 9px 9px 0 #111111;
  --ui-inset: none;

  --ui-text: #16161a;
  --ui-heading: #111111;
  --ui-muted: #4b4b52;
  --ui-faint: #6b6b73;

  --ui-primary: #ffd23f;
  --ui-primary-soft: rgba(255, 210, 63, .28);
  --ui-primary-contrast: #111111;
  --ui-primary-glow: 4px 4px 0 #111111;
  --ui-accent: #2f6bff;
  --ui-accent-soft: rgba(47, 107, 255, .18);
  --ui-danger: #ff5470;
  --ui-danger-soft: rgba(255, 84, 112, .18);
  --ui-chart-1: #111111;
  --ui-chart-2: #ffd23f;
  --ui-chart-3: #2f6bff;
  --ui-chart-4: #00c48c;
  --ui-chart-5: #ff5470;
  --ui-grid: rgba(17, 17, 17, .22);
}

html[data-theme="neo_brutal"][data-mode="dark"],[data-preview-theme="neo_brutal"][data-preview-mode="dark"] {
  --ui-canvas: #141414;
  --ui-canvas-2: #1b1b1b;
  --ui-card-bg: #1e1e1e;
  --ui-card-bg-hover: #262626;
  --ui-subtle: #2a2a2a;
  --ui-border: #f5f5f5;
  --ui-shadow: 6px 6px 0 #f5f5f5;
  --ui-shadow-hover: 9px 9px 0 #f5f5f5;

  --ui-text: #f5f5f5;
  --ui-heading: #fafafa;
  --ui-muted: #b5b5b8;
  --ui-faint: #8a8a90;

  --ui-primary: #ffd23f;
  --ui-primary-contrast: #111111;
  --ui-primary-glow: 4px 4px 0 #f5f5f5;
  --ui-accent: #5b8bff;
  --ui-chart-1: #f5f5f5;
  --ui-chart-2: #ffd23f;
  --ui-chart-3: #5b8bff;
  --ui-chart-4: #00d9a3;
  --ui-chart-5: #ff6b85;
  --ui-grid: rgba(245, 245, 245, .25);
}

/* Brutal press behaviour: the surface physically moves */
html[data-theme="neo_brutal"] .ui-btn,[data-preview-theme="neo_brutal"] .ui-btn,
html[data-theme="neo_brutal"] .ui-btn-ghost,
[data-preview-theme="neo_brutal"] .ui-btn-ghost,
html[data-theme="neo_brutal"] .glass-card-interactive,
[data-preview-theme="neo_brutal"] .glass-card-interactive {
  box-shadow: var(--ui-shadow);
}
html[data-theme="neo_brutal"] .ui-btn:active,[data-preview-theme="neo_brutal"] .ui-btn:active,
html[data-theme="neo_brutal"] .ui-btn-ghost:active,
[data-preview-theme="neo_brutal"] .ui-btn-ghost:active,
html[data-theme="neo_brutal"] .glass-card-interactive:active,
[data-preview-theme="neo_brutal"] .glass-card-interactive:active {
  transform: translate(4px, 4px);
  box-shadow: 1px 1px 0 var(--ui-border);
}
html[data-theme="neo_brutal"] .ui-chip.is-active,[data-preview-theme="neo_brutal"] .ui-chip.is-active,
html[data-theme="neo_brutal"] .ui-tab.is-active,
[data-preview-theme="neo_brutal"] .ui-tab.is-active,
html[data-theme="neo_brutal"] .ui-chip[aria-selected="true"],
[data-preview-theme="neo_brutal"] .ui-chip[aria-selected="true"],
html[data-theme="neo_brutal"] .ui-tab[aria-selected="true"],
[data-preview-theme="neo_brutal"] .ui-tab[aria-selected="true"] {
  box-shadow: 3px 3px 0 var(--ui-border);
}
/* Sticker-style rank badges */
html[data-theme="neo_brutal"] .ui-rank,[data-preview-theme="neo_brutal"] .ui-rank {
  border-width: 2px;
  border-color: var(--ui-border);
  box-shadow: 2px 2px 0 var(--ui-border);
}