/* ============================================
   EngravingCanada Brand Foundation (site-wide)
   Design tokens + typography only.
   No layout, no component overrides yet.
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;600;700&family=DM+Sans:wght@300;400;500;600&display=swap');

:root {
  /* ---------- Brand palette ---------- */
  --ec-primary: #C6B991;          /* champagne gold */
  --ec-primary-dark: #A35838;     /* terracotta */
  --ec-primary-light: #F2DFD4;    /* peach cream */
  --ec-primary-hover: #d8cba6;
  --ec-primary-deep: #A89A72;
  --ec-accent: #C6B991;
  --ec-accent-dark: #A89A72;
  --ec-highlight: #627D47;        /* olive green */

  /* ---------- Backgrounds ---------- */
  --ec-bg-light: #FAF8F4;         /* warm off-white */
  --ec-bg-warm: #F0E9DC;          /* warm cream */
  --ec-bg-dark: #1E1A14;          /* deep brown */
  --ec-bg-deep: #181410;
  --ec-bg: var(--ec-bg-light);
  --ec-bg-light-alt: #F0E9DC;     /* legacy alias */

  /* ---------- Text ---------- */
  --ec-text-dark: #1E1A14;
  --ec-text-body: #3D3426;
  --ec-text-muted: rgba(245, 243, 238, 0.72);     /* on-dark muted */
  --ec-text-muted-light: #7A6A58;                  /* on-light muted */
  --ec-text-on-dark: #F0E9DC;
  --ec-text-on-light: #1E1A14;

  /* ---------- Borders ---------- */
  --ec-border: #E0D4C0;

  /* ---------- Typography ---------- */
  --ec-font-display: 'Lora', Georgia, 'Times New Roman', serif;
  --ec-font-body: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --ec-font: var(--ec-font-body);  /* legacy alias for existing code */

  /* ---------- Layout ---------- */
  --ec-radius: 6px;
  --ec-radius-card: 16px;
  --ec-radius-pill: 50px;
  --ec-shadow-card: 0 4px 24px rgba(30, 26, 20, 0.08);
  --ec-shadow-card-hover: 0 12px 40px rgba(30, 26, 20, 0.14);
  --ec-transition: 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ============================================
   Typography, applied site-wide
   Targets both generic HTML tags and Flatsome's
   common heading class hooks so the change reaches
   product titles, shop headers, widget titles, etc.
   ============================================ */

body {
  font-family: var(--ec-font-body);
}

h1, h2, h3, h4, h5, h6,
.heading-font,
.entry-title,
.product-title,
.shop-page-title,
.widget-title,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--ec-font-display);
}


/* ============================================
   Header top bar + mini-cart (site-wide)
   Brings Flatsome defaults onto the EC palette.
   ============================================ */

/* ---------- Top bar ---------- */
#top-bar.header-top {
  background-color: var(--ec-bg-dark) !important;
}
#top-bar.header-top,
#top-bar.header-top a,
#top-bar.header-top .nav > li > a {
  color: var(--ec-text-on-dark) !important;
}
#top-bar.header-top a:hover,
#top-bar.header-top .nav > li > a:hover {
  color: var(--ec-primary) !important;
}

/* ---------- Cart icon + count badge ---------- */
.header-cart-link:hover,
.cart-item > a:hover {
  color: var(--ec-primary-dark) !important;
}
.cart-icon strong {
  background-color: var(--ec-primary) !important;
  border-color: var(--ec-primary) !important;
  color: var(--ec-text-dark) !important;
}
.cart-icon::before,
.cart-icon b::after {
  border-color: var(--ec-primary) !important;
}

/* ---------- Mini-cart dropdown ---------- */
.cart-dropdown .dropdown-content,
.widget_shopping_cart_content {
  border-radius: var(--ec-radius-card);
  border: 1px solid var(--ec-border);
}
.widget_shopping_cart .cart_list a:not(.remove),
.cart-dropdown .product-title,
.cart-dropdown .cart_list a:not(.remove) {
  color: var(--ec-text-dark) !important;
}
.widget_shopping_cart .cart_list a:not(.remove):hover,
.cart-dropdown .cart_list a:not(.remove):hover {
  color: var(--ec-primary-dark) !important;
}
.widget_shopping_cart .total,
.cart-dropdown .total {
  border-top-color: var(--ec-border) !important;
}

/* Mini-cart action buttons */
.widget_shopping_cart .buttons a.button,
.cart-dropdown .buttons a.button {
  background-color: var(--ec-primary) !important;
  border-color: var(--ec-primary) !important;
  color: var(--ec-text-dark) !important;
  border-radius: var(--ec-radius-pill) !important;
  text-shadow: none !important;
}
.widget_shopping_cart .buttons a.button:hover,
.cart-dropdown .buttons a.button:hover {
  background-color: var(--ec-primary-hover) !important;
  border-color: var(--ec-primary-hover) !important;
}
.widget_shopping_cart .buttons a.button.checkout,
.widget_shopping_cart .buttons a.checkout,
.cart-dropdown .buttons a.button.checkout {
  background-color: var(--ec-primary-dark) !important;
  border-color: var(--ec-primary-dark) !important;
  color: #fff !important;
}
.widget_shopping_cart .buttons a.button.checkout:hover,
.cart-dropdown .buttons a.button.checkout:hover {
  background-color: #8f4a2e !important;
  border-color: #8f4a2e !important;
}
