/*
 Theme Name: Flatsome Material Child
 Theme URI: https://example.com/flatsome-material-child
 Description: Material Design 3 skin for Flatsome via child theme (keeps WooCommerce & UX Builder intact).
 Author: ChatGPT
 Author URI: https://openai.com
 Template: flatsome
 Version: 1.0.0
 License: GPL v2 or later
 Text Domain: flatsome-material-child
*/

/* ---- Material Design tokens (edit to match your brand) ---- */
:root {
  /* MD3 Color Tokens (seed color example #6750A4) */
  --md-sys-color-primary: #6750A4;
  --md-sys-color-on-primary: #FFFFFF;
  --md-sys-color-primary-container: #EADDFF;
  --md-sys-color-on-primary-container: #21005D;

  --md-sys-color-secondary: #625B71;
  --md-sys-color-on-secondary: #FFFFFF;

  --md-sys-color-surface: #FFFBFE;
  --md-sys-color-on-surface: #1C1B1F;
  --md-sys-color-surface-variant: #E7E0EC;
  --md-sys-color-outline: #79747E;
  --md-sys-color-error:#B3261E;

  /* Elevation (shadow) */
  --md-elev-0: none;
  --md-elev-1: 0 1px 2px rgba(0,0,0,.08), 0 1px 3px rgba(0,0,0,.12);
  --md-elev-2: 0 2px 6px rgba(0,0,0,.10), 0 2px 4px rgba(0,0,0,.14);

  /* Shape & spacing */
  --md-shape-corner: 12px;
  --md-space-1: 4px; --md-space-2: 8px; --md-space-3: 12px; --md-space-4: 16px; --md-space-6: 24px;

  /* Typography scale cơ bản */
  --md-font-family: system-ui, -apple-system, "Inter", "Roboto", Arial, sans-serif;
  --md-title-l: 700 22px/28px var(--md-font-family);
  --md-title-m: 600 16px/22px var(--md-font-family);
  --md-body-m: 400 14px/20px var(--md-font-family);
}

/* Optional: basic body defaults */
body {
  background: var(--md-sys-color-surface);
  color: var(--md-sys-color-on-surface);
  font: var(--md-body-m);
}