/**
 * CSS custom properties (variables) for the seller theme.
 * These are normally provided by Swissup Breeze's default.css on the crystal theme,
 * but Breeze CSS is intentionally disabled on the Luma-based seller theme.
 * This file defines the subset of variables used by Webkul marketplace CSS files.
 */
:root {
  /* Palette */
  --black: 0, 0, 0;
  --white: 255, 255, 255;
  --gray-50: 249, 250, 251;
  --gray-100: 243, 244, 246;
  --gray-200: 229, 231, 235;
  --gray-300: 209, 213, 219;
  --gray-400: 156, 163, 175;
  --gray-500: 107, 114, 128;
  --gray-600: 75, 85, 99;
  --gray-700: 55, 65, 81;
  --gray-800: 31, 41, 55;
  --gray-900: 17, 24, 39;
  --blue: 29, 78, 216;

  /* Base colours */
  --base-alpha: 1;
  --base-color: 17, 24, 39;
  --base-bg: 255, 255, 255;
  --muted-bg: 243, 244, 246;
  --muted-bg-alpha: 1;

  /* Links */
  --link-alpha: 0.85;
  --link-color: var(--blue);

  /* Buttons */
  --button-color: 255, 255, 255;
  --button-bg: var(--brand-color, 0, 0, 0);
  --button-bg-alpha: 1;
  --button-border-alpha: 0;
  --button-border-color: var(--button-bg);
  --button-secondary-color: var(--gray-600);
  --button-secondary-bg: var(--gray-200);
  --button-secondary-border-color: var(--button-secondary-bg);

  /* Containers — used by product.css */
  --container-width: 100%;
  --container-margin: 0 auto;
  --container-max-width: 1260px;
  --container-padding: 0.625rem 0.5rem;
}

@media (min-width: 1280px) and (max-width: 1535px) {
  :root {
    --container-max-width: 85%;
  }
}

@media (min-width: 1536px) {
  :root {
    --container-max-width: 1280px;
  }
}