/**
 * Arzoon Brand Theme — #8F0B13
 * Load after arzoon.css in storefront templates.
 */

:root {
  /* Brand core */
  --color-brand-primary: #8F0B13;
  --color-brand-primary-hover: #7a0a10;
  --color-brand-primary-active: #5c0a12;
  --color-brand-primary-subtle: rgba(143, 11, 19, 0.06);
  --color-brand-primary-muted: rgba(143, 11, 19, 0.14);

  /* Accent — cream/gold from existing palette */
  --color-brand-accent: #b8860b;
  --color-brand-accent-hover: #9a7209;
  --color-brand-accent-active: #7d5e08;
  --color-brand-accent-subtle: rgba(184, 134, 11, 0.08);
  --color-brand-accent-muted: rgba(184, 134, 11, 0.16);

  /* Surfaces */
  --color-bg-base: #f4f5f7;
  --color-bg-surface: #ffffff;
  --color-bg-elevated: #ffffff;
  --color-bg-sunken: #eeeff2;
  --color-bg-overlay: rgba(22, 24, 29, 0.52);
  --color-bg-inverse: #16181d;

  /* Text */
  --color-text-primary: #16181d;
  --color-text-secondary: #52525b;
  --color-text-muted: #8a8a96;
  --color-text-brand: var(--color-brand-primary);
  --color-text-accent: var(--color-brand-accent);

  /* Borders & focus */
  --color-border-focus: var(--color-brand-primary);
  --shadow-focus: 0 0 0 3px var(--color-brand-primary-subtle);

  /* Legacy alias map (main.css compat for unmigrated pages) */
  --primary: var(--color-brand-primary);
  --primary-dark: var(--color-brand-primary-active);
  --primary-light: #FBEDED;
  --brand: var(--color-brand-primary);
  --brand-600: var(--color-brand-primary-hover);
  --brand-700: var(--color-brand-primary-active);
  --brand-tint: #FBEDED;
  --cream: #EFDFC5;
  --ink: var(--color-text-primary);
  --line: #ececf0;
  --surface-2: var(--color-bg-sunken);
  --gray-200: #eeeff2;
  --gray-100: #f8f9fa;
  --gray-300: #dee2e6;
  --gray-700: #495057;
  --success: var(--color-success);
  --danger: var(--color-error);
  --text-muted: var(--color-text-muted);
  --text: var(--color-text-primary);
  --dark: var(--color-text-primary);
  --border: var(--color-border-default);
  --card-shadow: var(--shadow-sm);
  --card-hover: var(--shadow-md);
  --transition: var(--transition-fast);
  --radius: var(--radius-lg);
  --radius-sm: var(--radius-md);
}