/**
 * Way To Care - Custom Theme CSS Framework
 * License: MIT (Free for commercial and non-commercial use)
 * Version: 1.0.0
 * Date: 2026-01-31
 */

:root {
  /* Colors */
  --wtc-primary: #0057a8;
  --wtc-primary-variant: #1e88e5;
  --wtc-primary-light: #4a90c2;
  --wtc-primary-dark: #003d75;
  --wtc-secondary: #e6f2fb;
  --wtc-secondary-variant: #585858;
  --wtc-primary-contrast: #ffffff;
  --wtc-primary-contrast-variant: #f9f9f9;
  --wtc-secondary-contrast: #0c0c0c;
  --wtc-secondary-contrast-variant: #454545;
  --wtc-white: #ffffff;
  --wtc-black: #000000;
  --wtc-grey: #585858;
  --wtc-grey-light: #abb8c3;
  --wtc-transparent: transparent;
  --wtc-success: #00d084;
  --wtc-warning: #fcb900;
  --wtc-error: #cf2e2e;
  --wtc-info: #0693e3;
  
  /* Typography */
  --wtc-font-primary: 'Roboto', -apple-system, BlinkMacSystemFont, sans-serif;
  --wtc-font-secondary: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --wtc-font-accent: 'Varela Round', sans-serif;
  --wtc-text-xs: 12px;
  --wtc-text-sm: 14px;
  --wtc-text-base: 16px;
  --wtc-text-lg: 18px;
  --wtc-text-xl: 20px;
  --wtc-text-2xl: 24px;
  --wtc-text-3xl: 30px;
  --wtc-text-4xl: 40px;
  --wtc-text-5xl: 50px;
  --wtc-font-light: 300;
  --wtc-font-normal: 400;
  --wtc-font-medium: 500;
  --wtc-font-semibold: 600;
  --wtc-font-bold: 700;
  --wtc-leading-tight: 1.25;
  --wtc-leading-normal: 1.5;
  --wtc-leading-loose: 1.75;
  
  /* Spacing & Layout */
  --wtc-space-1: 4px;
  --wtc-space-2: 8px;
  --wtc-space-4: 16px;
  --wtc-space-6: 24px;
  --wtc-space-8: 32px;
  --wtc-radius-sm: 4px;
  --wtc-radius-md: 8px;
  --wtc-radius-lg: 12px;
  --wtc-radius-full: 9999px;
  --wtc-shadow-header: 0 0 25px 10px rgba(0,0,0,0.1);
  --wtc-transition-normal: 300ms ease;
  
  /* Preset Colors */
  --wp--preset--color--black: #000000;
  --wp--preset--color--white: #ffffff;
  --wp--preset--color--cyan-bluish-gray: #abb8c3;
  --wp--preset--color--vivid-red: #cf2e2e;
  --wp--preset--color--vivid-green-cyan: #00d084;
  --wp--preset--color--vivid-cyan-blue: #0693e3;
  --wp--preset--color--wtc-primary: var(--wtc-primary);
  --wp--preset--color--wtc-primary-variant: var(--wtc-primary-variant);
  --wp--preset--color--wtc-secondary: var(--wtc-secondary);
  --wp--preset--color--wtc-secondary-variant: var(--wtc-secondary-variant);
  --wp--preset--color--wtc-primary-contrast: var(--wtc-primary-contrast);
  --wp--preset--color--wtc-primary-contrast-variant: var(--wtc-primary-contrast-variant);
  --wp--preset--color--wtc-secondary-contrast: var(--wtc-secondary-contrast);
  --wp--preset--color--wtc-secondary-contrast-variant: var(--wtc-secondary-contrast-variant);
  --wp--preset--color--wtc-nochange-transparent: transparent;
  --wp--preset--color--wtc-nochange-white: white;
  --wp--preset--color--wtc-nochange-grey: var(--wtc-grey);
}

/* Background color utilities */
.has-wtc-primary-background-color { background-color: var(--wtc-primary) !important; }
.has-wtc-primary-variant-background-color { background-color: var(--wtc-primary-variant) !important; }
.has-wtc-secondary-background-color { background-color: var(--wtc-secondary) !important; }
.has-wtc-secondary-variant-background-color { background-color: var(--wtc-secondary-variant) !important; }
.has-wtc-primary-contrast-background-color { background-color: var(--wtc-primary-contrast) !important; }
.has-wtc-primary-contrast-variant-background-color { background-color: var(--wtc-primary-contrast-variant) !important; }
.has-wtc-secondary-contrast-background-color { background-color: var(--wtc-secondary-contrast) !important; }
.has-wtc-secondary-contrast-variant-background-color { background-color: var(--wtc-secondary-contrast-variant) !important; }
.has-wtc-nochange-transparent-background-color { background-color: transparent !important; }
.has-wtc-nochange-white-background-color { background-color: white !important; }
.has-wtc-nochange-grey-background-color { background-color: var(--wtc-grey) !important; }
.has-white-background-color { background-color: var(--wtc-white) !important; }
.has-black-background-color { background-color: var(--wtc-black) !important; }

/* Text color utilities */
.has-wtc-primary-color { color: var(--wtc-primary) !important; }
.has-wtc-primary-variant-color { color: var(--wtc-primary-variant) !important; }
.has-wtc-secondary-color { color: var(--wtc-secondary) !important; }
.has-wtc-secondary-variant-color { color: var(--wtc-secondary-variant) !important; }
.has-wtc-primary-contrast-color { color: var(--wtc-primary-contrast) !important; }
.has-wtc-primary-contrast-variant-color { color: var(--wtc-primary-contrast-variant) !important; }
.has-wtc-secondary-contrast-color { color: var(--wtc-secondary-contrast) !important; }
.has-wtc-secondary-contrast-variant-color { color: var(--wtc-secondary-contrast-variant) !important; }
.has-wtc-nochange-transparent-color { color: transparent !important; }
.has-wtc-nochange-white-color { color: white !important; }
.has-wtc-nochange-grey-color { color: var(--wtc-grey) !important; }
.has-white-color { color: var(--wtc-white) !important; }
.has-black-color { color: var(--wtc-black) !important; }
.has-text-color { color: inherit; }
.has-background { background-color: inherit; }
/* Border color utilities */
.has-wtc-primary-border-color { border-color: var(--wtc-primary) !important; }
.has-wtc-secondary-border-color { border-color: var(--wtc-secondary) !important; }
.has-wtc-nochange-white-border-color { border-color: white !important; }

/* Header shadow */
header { box-shadow: var(--wtc-shadow-header); }
html.wtc-theme-no-js { }
