/*
 * The WooCommerce palette. This is the only file to edit when restyling the shop.
 *
 * It mirrors $colors and $font-family in assets/scss/utils/ one for one, so the
 * shop uses the theme's colours and nothing else. Change a colour in $colors and
 * the shop follows automatically; override a line here to let the shop differ.
 * Each token reads the theme variable first and falls back to the same literal,
 * so this folder still renders correctly in a theme that has no --it-* palette.
 *
 * The bundles in this folder contain no raw colour or font of their own. To add
 * a new shop colour, add it to $colors and expose it here — never hardcode it in
 * a bundle.
 *
 * Registered as the dependency of every shop bundle, so it always loads first.
 */

:root {
  /* Common */
  --wc-white: var(--it-common-white, #ffffff);
  --wc-black: var(--it-common-black, #1f2432);
  --wc-black-2: var(--it-common-black-2, #313537);
  --wc-brown: var(--it-common-brown, #272422);

  /* Heading and body text */
  --wc-heading: var(--it-heading-primary, #0c121d);
  --wc-text: var(--it-text-body, #6c757d);

  /* Gray */
  --wc-gray-1: var(--it-gray-1, #f0f4f5);
  --wc-gray-2: var(--it-gray-2, #d9d9d9);
  --wc-gray-3: var(--it-gray-3, #f5f7f9);
  --wc-gray-4: var(--it-gray-4, #fff8f4);

  /* Theme */
  --wc-theme-1: var(--it-theme-1, #03594e);
  --wc-theme-2: var(--it-theme-2, #f8c62f);
  --wc-theme-3: var(--it-theme-3, #1ab69d);
  --wc-theme-4: var(--it-theme-4, #618269);
  --wc-theme-5: var(--it-theme-5, #fe8235);
  --wc-theme-6: var(--it-theme-6, #cd935a);

  /* Error red. The theme palette has no red, and delete/remove controls and
     WooCommerce error notices need one. Add a red to $colors and point this at
     it to bring it under the theme palette too. */
  --wc-danger: #d63638;

  /* See-through shades for hairline borders and shadows. Mixed from the palette
     above, so they follow the theme colour rather than being a fixed grey. */
  --wc-border-faint: color-mix(in srgb, var(--wc-text) 20%, transparent);
  --wc-shadow: color-mix(in srgb, var(--wc-black) 10%, transparent);

  /* Type */
  --wc-ff-body: var(--it-ff-body, "Open Sans", sans-serif);
  --wc-ff-heading: var(--it-ff-heading, "Spartan-Bold", sans-serif);
  --wc-ff-semibold: var(--it-ff-spartan-semibold, "Spartan-SemiBold", sans-serif);
  --wc-ff-icon: var(--it-ff-fontawesome, "Font Awesome 6 Pro");
}
