/* Mapped from Agon: Agon/1.Agon_HTML_Template/assets/scss/abstracts/_variables.scss */
@import url("https://fonts.bunny.net/css?family=chivo:400,700|noto-sans:400,700");

:root {
  --wl-font-heading: "Noto Sans", sans-serif;
  --wl-font-body: "Chivo", sans-serif;
  --wl-font-sans: "Chivo", sans-serif;

  /* Tenant-editable colour values. */
  --tenant-primary: #88110a;
  --tenant-primary-soft: #ffffff;
  --tenant-highlight: #D4A85A;
  /*--tenant-highlight-soft: #F8EED7;*/
  --tenant-highlight-soft: #f8eed7;
  --tenant-accent: #e7d5d5;
  --tenant-accent-soft: #E3F2EF;
  --tenant-search-box-bg: #d5c89a;
  --tenant-search-box-text: #101828;
  --tenant-pill-bg: #ffffff;
  --tenant-pill-text: #101828;
  --tenant-social-icon: var(--tenant-primary);

  /* Compatibility aliases; all resolve back to the tenant values above. */
  --brand-primary: var(--tenant-primary);
  --brand-primary-hover: var(--tenant-primary);
  --brand-soft: var(--tenant-primary-soft);
  --brand-light: var(--tenant-highlight-soft);
  --brand-background: var(--wl-color-gray-50);
  --brand-dark: var(--wl-color-gray-900);
  --brand-border: var(--wl-color-gray-200);
  --brand-white: var(--wl-color-white);

  --wl-color-gray-50: #F9FAFB;
  --wl-color-gray-100: #F2F4F7;
  --wl-color-gray-200: #E4E7EC;
  --wl-color-gray-300: #D0D5DD;
  --wl-color-gray-400: #98A2B3;
  --wl-color-gray-500: #667085;
  --wl-color-gray-600: #475467;
  --wl-color-gray-700: #344054;
  --wl-color-gray-800: #1D2939;
  --wl-color-gray-900: #101828;
  --wl-color-green-100: var(--tenant-primary-soft);
  --wl-color-green-500: var(--tenant-accent);
  --wl-color-green-900: var(--tenant-primary);
  --wl-color-green-1000: color-mix(in srgb, var(--tenant-primary) 70%, #000000);
  --wl-color-orange-100: var(--tenant-highlight-soft);
  --wl-color-orange-500: color-mix(in srgb, var(--tenant-highlight) 34%, #FFFFFF);
  --wl-color-orange-900: var(--tenant-highlight);
  --wl-color-warning: #FFD166;
  --wl-color-success: #06D6A0;
  --wl-color-danger: #EF476F;
  --wl-color-white: #FFFFFF;
  --wl-bg-1: color-mix(in srgb, var(--tenant-primary-soft) 76%, #EAE4E9);
  --wl-bg-2: var(--tenant-highlight-soft);
  --wl-bg-3: color-mix(in srgb, var(--tenant-primary-soft) 74%, #FDE2E4);
  --wl-bg-4: color-mix(in srgb, var(--tenant-primary) 20%, #FFFFFF);
  --wl-bg-5: var(--tenant-accent-soft);
  --wl-bg-6: color-mix(in srgb, var(--tenant-accent) 38%, #FFFFFF);
  --wl-bg-7: color-mix(in srgb, var(--tenant-highlight-soft) 65%, #F0EFEB);
  --wl-bg-8: color-mix(in srgb, var(--tenant-primary-soft) 58%, #DFE7FD);
  --wl-bg-9: color-mix(in srgb, var(--tenant-accent-soft) 72%, #D1ECFD);
  --wl-bg-10: color-mix(in srgb, var(--tenant-primary-soft) 62%, #DDD3FA);

  --wl-color-primary: var(--tenant-primary);
  --wl-color-primary-hover: var(--wl-color-gray-900);
  --wl-color-primary-dark: var(--wl-color-gray-900);
  --wl-color-primary-soft: var(--tenant-primary-soft);
  --wl-color-secondary: var(--tenant-accent);
  --wl-color-accent: var(--tenant-highlight);
  --wl-color-accent-soft: var(--tenant-highlight-soft);
  --wl-color-yellow: var(--wl-color-warning);
  --wl-color-ink: var(--wl-color-gray-900);
  --wl-color-body: var(--wl-color-gray-600);
  --wl-color-muted: var(--wl-color-gray-500);
  --wl-color-border: var(--wl-color-gray-200);
  --wl-color-border-strong: var(--wl-color-gray-300);
  --wl-color-background: var(--wl-color-gray-50);
  --wl-color-background-warm: var(--tenant-highlight-soft);
  --wl-color-surface: var(--wl-color-white);

  --wl-text-body: var(--wl-color-gray-900);
  --wl-text-muted: var(--wl-color-gray-500);
  --wl-text-inverse: var(--wl-color-white);
  --wl-link: var(--tenant-primary);
  --wl-link-hover: var(--wl-color-gray-900);
  --wl-button-primary-bg: #101828;
  --wl-button-primary-bg-hover: var(--wl-color-gray-200);
  --wl-button-secondary-bg: var(--wl-color-gray-100);
  --wl-button-secondary-bg-hover: var(--wl-color-gray-200);
  --wl-focus-ring: color-mix(in srgb, var(--tenant-primary) 42%, transparent);
  --wl-component-accent-bg: var(--tenant-primary-soft);
  --wl-component-accent-bg-light: var(--tenant-accent-soft);
  --wl-component-accent: var(--tenant-primary);
  --wl-component-accent-text: var(--wl-color-gray-900);
  --wl-component-accent-inverse: var(--wl-color-white);
  --wl-component-link-surface: rgba(255, 255, 255, 0.78);
  --wl-footer-background: var(--wl-color-white);
  --wl-watch-intro-blend-mode: luminosity;
  --wl-asset-pattern-1: url("../assets/wl_agon/imgs/template/pattern-1.svg");
  --wl-asset-pattern-2: url("../assets/wl_agon/imgs/template/pattern-2.svg");
  --wl-asset-banner-home-1: url("../assets/wl_agon/imgs/page/homepage1/banner.png");
  --wl-asset-watch-intro: url("../assets/wl_agon/imgs/page/homepage1/watch-intro.png");
  --wl-asset-arrow-right: url("../assets/wl_agon/imgs/template/icons/fi-sr-arrow-small-right.svg");
  --wl-asset-arrow-right-white: url("../assets/wl_agon/imgs/template/icons/arrow-small-right-w.svg");
  --wl-asset-arrow-right-orange: url("../assets/wl_agon/imgs/template/icons/fi-sr-arrow-small-right.svg");
  --wl-asset-check: url("../assets/wl_agon/imgs/template/icons/check-circle.svg");
  --wl-asset-check-pink: url("../assets/wl_agon/imgs/template/icons/check-circle-pink.svg");
  --wl-asset-uncheck: url("../assets/wl_agon/imgs/template/icons/un-check-circle.svg");
  --wl-asset-angle-down: url("../assets/wl_agon/imgs/template/icons/angle-down.svg");
  --wl-asset-angle-up-white: url("../assets/wl_agon/imgs/template/icons/angle-up-white.svg");
  --wl-asset-question: url("../assets/wl_agon/imgs/template/icons/icon-question.svg");
  --wl-asset-wave: url("../assets/wl_agon/imgs/template/icons/icon-wave.svg");
  --wl-asset-email: url("../assets/wl_agon/imgs/template/email.png");
  --wl-asset-send: url("../assets/wl_agon/imgs/template/icons/btn-send.svg");
  --wl-asset-blog-banner: url("../assets/wl_agon/imgs/page/blog/1/banner.png");
  --wl-asset-service-bg: url("../assets/wl_agon/imgs/page/services/1/bg-banner.svg");
  --wl-asset-service-banner: url("../assets/wl_agon/imgs/page/services/1/banner.png");
  --wl-asset-service-banner-small: url("../assets/wl_agon/imgs/page/services/1/banner-2.png");
  --wl-asset-leaf: url("../assets/wl_agon/imgs/page/homepage1/icon-leaf.svg");
  --wl-asset-breadcrumb-home: url("../assets/wl_agon/imgs/page/single-product/home.svg");
  --wl-asset-breadcrumb-arrow: url("../assets/wl_agon/imgs/page/single-product/right-arrow.svg");

  --wl-space-0: 0;
  --wl-space-1: 0.25rem;
  --wl-space-2: 0.5rem;
  --wl-space-3: 0.75rem;
  --wl-space-4: 1rem;
  --wl-space-5: 1.25rem;
  --wl-space-6: 1.5rem;
  --wl-space-8: 2rem;
  --wl-space-10: 2.5rem;
  --wl-space-12: 3rem;
  --wl-space-16: 4rem;
  --wl-space-20: 5rem;

  --wl-radius-xs: 4px;
  --wl-radius-sm: 8px;
  --wl-radius-md: 16px;
  --wl-radius-lg: 16px;
  --wl-radius-xl: 16px;
  --wl-radius-pill: 50px;

  --wl-shadow-1: 14px 14px 36px rgba(153, 153, 153, 0.22);
  --wl-shadow-2: 0px 45px 80px rgba(0, 0, 0, 0.04);
  --wl-shadow-3: 0px 47px 65px rgba(21, 28, 38, 0.1);
  --wl-shadow-4: 4px 6px 23px rgba(228, 92, 35, 0.1);
  --wl-shadow-5: 4px 4px 40px rgba(16, 24, 40, 0.1);
  --wl-shadow-inner: inset 0px 40px 80px #FCFCFC;
  --wl-shadow-xs: var(--wl-shadow-2);
  --wl-shadow-sm: var(--wl-shadow-5);

  --wl-container-sm: 540px;
  --wl-container-md: 720px;
  --wl-container-lg: 960px;
  --wl-container-xl: 1140px;
  --wl-container-xxl: 1320px;
  --wl-container-pad: 12px;

  --wl-z-header: 50;
  --wl-z-mobile-nav: 60;
  --wl-z-overlay: 80;
  --wl-z-modal: 100;
}
