/* Color Palette for Mifugo Digital */

:root {
  /* Dark Colors */
  --ws-color-dark-50: 218, 13%, 37%;
  --ws-color-dark-100: 218, 14%, 35%;
  --ws-color-dark-200: 220, 14%, 33%;
  --ws-color-dark-300: 217, 16%, 30%;
  --ws-color-dark-400: 218, 17%, 27%;
  --ws-color-dark-500: 218, 19%, 24%;
  --ws-color-dark-600: 217, 21%, 21%;
  --ws-color-dark-700: 217, 25%, 18%;
  --ws-color-dark-800: 215, 31%, 14%;
  --ws-color-dark-900: 214, 51%, 9%;
  
  /* Alt Dark Colors */
  --ws-color-alt-dark-50: 218, 13%, 37%;
  --ws-color-alt-dark-100: 218, 14%, 35%;
  --ws-color-alt-dark-200: 220, 14%, 33%;
  --ws-color-alt-dark-300: 217, 16%, 30%;
  --ws-color-alt-dark-400: 218, 17%, 27%;
  --ws-color-alt-dark-500: 218, 19%, 24%;
  --ws-color-alt-dark-600: 217, 21%, 21%;
  --ws-color-alt-dark-700: 217, 25%, 18%;
  --ws-color-alt-dark-800: 215, 31%, 14%;
  --ws-color-alt-dark-900: 214, 51%, 9%;
  
  /* Light Colors */
  --ws-color-light-50: 231, 100%, 99%;
  --ws-color-light-100: 231, 37%, 96%;
  --ws-color-light-200: 231, 20%, 93%;
  --ws-color-light-300: 231, 11%, 87%;
  --ws-color-light-400: 231, 8%, 83%;
  --ws-color-light-500: 230, 5%, 78%;
  --ws-color-light-600: 230, 4%, 73%;
  --ws-color-light-700: 231, 4%, 68%;
  --ws-color-light-800: 231, 4%, 63%;
  --ws-color-light-900: 231, 3%, 58%;
  
  /* Alt Light Colors */
  --ws-color-alt-light-50: 231, 100%, 99%;
  --ws-color-alt-light-100: 231, 37%, 96%;
  --ws-color-alt-light-200: 231, 20%, 93%;
  --ws-color-alt-light-300: 231, 11%, 87%;
  --ws-color-alt-light-400: 231, 8%, 83%;
  --ws-color-alt-light-500: 230, 5%, 78%;
  --ws-color-alt-light-600: 230, 4%, 73%;
  --ws-color-alt-light-700: 231, 4%, 68%;
  --ws-color-alt-light-800: 231, 4%, 63%;
  --ws-color-alt-light-900: 231, 3%, 58%;
  
  /* Primary Colors */
  --ws-color-primary-50: 207, 100%, 94%;
  --ws-color-primary-100: 210, 100%, 86%;
  --ws-color-primary-200: 208, 100%, 77%;
  --ws-color-primary-300: 207, 100%, 67%;
  --ws-color-primary-400: 206, 100%, 58%;
  --ws-color-primary-500: 206, 100%, 50%;
  --ws-color-primary-600: 209, 100%, 50%;
  --ws-color-primary-700: 214, 86%, 50%;
  --ws-color-primary-800: 218, 80%, 47%;
  --ws-color-primary-900: 228, 72%, 42%;
  
  /* Secondary Colors */
  --ws-color-secondary-50: 344, 100%, 96%;
  --ws-color-secondary-100: 350, 100%, 91%;
  --ws-color-secondary-200: 357, 85%, 80%;
  --ws-color-secondary-300: 356, 80%, 71%;
  --ws-color-secondary-400: 357, 99%, 67%;
  --ws-color-secondary-500: 359, 100%, 63%;
  --ws-color-secondary-600: 357, 91%, 60%;
  --ws-color-secondary-700: 356, 77%, 55%;
  --ws-color-secondary-800: 356, 68%, 51%;
  --ws-color-secondary-900: 355, 73%, 45%;
  
  /* Warning Colors */
  --ws-color-warning-50: 46, 100%, 94%;
  --ws-color-warning-100: 45, 100%, 85%;
  --ws-color-warning-200: 45, 100%, 75%;
  --ws-color-warning-300: 46, 100%, 65%;
  --ws-color-warning-400: 45, 100%, 58%;
  --ws-color-warning-500: 45, 100%, 51%;
  --ws-color-warning-600: 42, 100%, 50%;
  --ws-color-warning-700: 38, 100%, 50%;
  --ws-color-warning-800: 34, 100%, 50%;
  --ws-color-warning-900: 26, 100%, 50%;
  
  /* Error Colors */
  --ws-color-error-50: 351, 100%, 96%;
  --ws-color-error-100: 354, 100%, 90%;
  --ws-color-error-200: 0, 73%, 77%;
  --ws-color-error-300: 0, 69%, 67%;
  --ws-color-error-400: 1, 83%, 63%;
  --ws-color-error-500: 4, 90%, 58%;
  --ws-color-error-600: 1, 77%, 55%;
  --ws-color-error-700: 0, 65%, 51%;
  --ws-color-error-800: 0, 66%, 47%;
  --ws-color-error-900: 360, 74%, 41%;
  
  /* Info Colors */
  --ws-color-info-50: 199, 94%, 94%;
  --ws-color-info-100: 199, 92%, 85%;
  --ws-color-info-200: 199, 92%, 74%;
  --ws-color-info-300: 199, 91%, 64%;
  --ws-color-info-400: 199, 92%, 56%;
  --ws-color-info-500: 199, 98%, 48%;
  --ws-color-info-600: 200, 97%, 46%;
  --ws-color-info-700: 202, 96%, 42%;
  --ws-color-info-800: 203, 96%, 38%;
  --ws-color-info-900: 207, 96%, 31%;
  
  /* Success Colors */
  --ws-color-success-50: 127, 47%, 93%;
  --ws-color-success-100: 126, 46%, 84%;
  --ws-color-success-200: 128, 47%, 73%;
  --ws-color-success-300: 129, 48%, 62%;
  --ws-color-success-400: 131, 49%, 53%;
  --ws-color-success-500: 136, 75%, 41%;
  --ws-color-success-600: 139, 90%, 35%;
  --ws-color-success-700: 139, 100%, 29%;
  --ws-color-success-800: 136, 100%, 26%;
  --ws-color-success-900: 127, 100%, 20%;
  
  /* Text Colors */
  --ws-color-text-black: 218, 17%, 27%;
  --ws-color-text-white: 0, 0%, 100%;
  
  /* Cookie Banner Colors */
  --ws-cookie-banner-background-color: 208, 25%, 10%;
  --ws-cookie-banner-text-color: var(--ws-color-text-white);
  --ws-cookie-banner-button-hover-background-color: var(--ws-color-text-black);
  --ws-cookie-banner-link-visited-color: 0, 0%, 69%;
}

/* Surface Styles */
.ws-language-listbox,
[data-surface].ws-light-0 {
  --ws-surface-form-date-time-picker-wrapper-background-color: var(--ws-color-text-white);
  --ws-surface-form-date-time-picker-current-month-color: var(--ws-color-text-black);
  --ws-surface-form-date-time-picker-line-color: var(--ws-color-light-100);
  --ws-surface-form-date-time-picker-current-day-color: var(--ws-color-text-white);
  --ws-surface-form-date-time-picker-current-day-background: var(--ws-color-secondary-600);
  --ws-surface-form-date-time-picker-current-day-background-hover: var(--ws-color-light-50);
  --ws-surface-form-date-time-picker-icon-color: var(--ws-color-secondary-600);
  --ws-surface-form-date-time-picker-icon-hover-color: var(--ws-color-secondary-500);
  --ws-surface-form-date-time-picker-other-month-color: var(--ws-color-text-black);
  --ws-surface-form-date-time-picker-other-month-color-opacity: 0.38;
  --ws-surface-form-date-time-picker-weekday-color: var(--ws-color-text-black);
  --ws-surface-form-date-time-picker-weekday-color-opacity: 0.72;
  --ws-surface-form-time-picker-background-color: var(--ws-color-text-white);
  --ws-surface-form-time-picker-background-hover: var(--ws-color-light-50);
  --ws-surface-form-time-picker-color: var(--ws-color-text-black);
  --ws-surface-form-time-picker-line-color: var(--ws-color-light-100);
  --ws-surface-background-color: var(--ws-color-light-0);
  --ws-surface-border-color: var(--ws-color-light-300);
  --ws-surface-focus-outline-color: var(--ws-color-info-100);
  --ws-surface-focus-outline-color-opacity: 1;
  --ws-surface-error-focus-outline-color: var(--ws-color-secondary-100);
  --ws-surface-error-focus-outline-color-opacity: 1;
  
  /* Primary Button Colors */
  --ws-surface-primary-button-background-color: var(--ws-color-primary-600);
  --ws-surface-primary-button-background-opacity: 1;
  --ws-surface-primary-button-text-color: var(--ws-color-text-white);
  --ws-surface-primary-button-text-color-opacity: 1;
  --ws-surface-primary-button-border-color: var(--ws-color-primary-600);
  --ws-surface-primary-button-border-opacity: 1;
  --ws-surface-primary-button-hover-background-color: var(--ws-color-primary-500);
  --ws-surface-primary-button-hover-background-opacity: 1;
  --ws-surface-primary-button-hover-text-color: var(--ws-color-text-white);
  --ws-surface-primary-button-hover-text-color-opacity: 1;
  --ws-surface-primary-button-hover-border-color: var(--ws-color-primary-500);
  --ws-surface-primary-button-hover-border-opacity: 1;
  --ws-surface-primary-button-active-background-color: var(--ws-color-primary-700);
  --ws-surface-primary-button-active-background-opacity: 1;
  --ws-surface-primary-button-active-text-color: var(--ws-color-text-white);
  --ws-surface-primary-button-active-text-color-opacity: 1;
  --ws-surface-primary-button-active-border-color: var(--ws-color-primary-700);
  --ws-surface-primary-button-active-border-opacity: 1;
  --ws-surface-primary-button-disabled-background-color: var(--ws-color-primary-600);
  --ws-surface-primary-button-disabled-background-opacity: 0.04;
  --ws-surface-primary-button-disabled-text-color: var(--ws-color-text-black);
  --ws-surface-primary-button-disabled-text-color-opacity: 0.39;
  --ws-surface-primary-button-disabled-border-color: var(--ws-color-primary-600);
  --ws-surface-primary-button-disabled-border-opacity: 0.04;
  
  /* Secondary Button Colors */
  --ws-surface-secondary-button-1-background-color: var(--ws-color-light-100);
  --ws-surface-secondary-button-1-background-opacity: 1;
  --ws-surface-secondary-button-1-text-color: var(--ws-color-text-black);
  --ws-surface-secondary-button-1-text-color-opacity: 1;
  --ws-surface-secondary-button-1-border-color: var(--ws-color-light-100);
  --ws-surface-secondary-button-1-border-opacity: 1;
  --ws-surface-secondary-button-1-hover-background-color: var(--ws-color-light-100);
  --ws-surface-secondary-button-1-hover-background-opacity: 0.4;
  --ws-surface-secondary-button-1-hover-text-color: var(--ws-color-text-black);
  --ws-surface-secondary-button-1-hover-text-color-opacity: 1;
  --ws-surface-secondary-button-1-hover-border-color: var(--ws-color-light-100);
  --ws-surface-secondary-button-1-hover-border-opacity: 0.4;
  --ws-surface-secondary-button-1-active-background-color: var(--ws-color-light-100);
  --ws-surface-secondary-button-1-active-background-opacity: 0.4;
  --ws-surface-secondary-button-1-active-text-color: var(--ws-color-text-black);
  --ws-surface-secondary-button-1-active-text-color-opacity: 1;
  --ws-surface-secondary-button-1-active-border-color: var(--ws-color-light-100);
  --ws-surface-secondary-button-1-active-border-opacity: 0.4;
  --ws-surface-secondary-button-1-disabled-background-color: var(--ws-color-light-100);
  --ws-surface-secondary-button-1-disabled-background-opacity: 0.44;
  --ws-surface-secondary-button-1-disabled-text-color: var(--ws-color-text-black);
  --ws-surface-secondary-button-1-disabled-text-color-opacity: 0.39;
  --ws-surface-secondary-button-1-disabled-border-color: var(--ws-color-light-100);
  --ws-surface-secondary-button-1-disabled-border-opacity: 0.44;
  
  /* Secondary Button 2 Colors */
  --ws-surface-secondary-button-2-background-color: var(--ws-color-primary-600);
  --ws-surface-secondary-button-2-background-opacity: 0;
  --ws-surface-secondary-button-2-text-color: var(--ws-color-text-black);
  --ws-surface-secondary-button-2-text-color-opacity: 1;
  --ws-surface-secondary-button-2-border-color: var(--ws-color-primary-600);
  --ws-surface-secondary-button-2-border-opacity: 1;
  --ws-surface-secondary-button-2-hover-background-color: var(--ws-color-primary-600);
  --ws-surface-secondary-button-2-hover-background-opacity: 1;
  --ws-surface-secondary-button-2-hover-text-color: var(--ws-color-text-white);
  --ws-surface-secondary-button-2-hover-text-color-opacity: 1;
  --ws-surface-secondary-button-2-hover-border-color: var(--ws-color-primary-600);
  --ws-surface-secondary-button-2-hover-border-opacity: 1;
  --ws-surface-secondary-button-2-active-background-color: var(--ws-color-primary-600);
  --ws-surface-secondary-button-2-active-background-opacity: 1;
  --ws-surface-secondary-button-2-active-text-color: var(--ws-color-text-white);
  --ws-surface-secondary-button-2-active-text-color-opacity: 1;
  --ws-surface-secondary-button-2-active-border-color: var(--ws-color-primary-600);
  --ws-surface-secondary-button-2-active-border-opacity: 1;
  --ws-surface-secondary-button-2-disabled-background-color: var(--ws-color-primary-600);
  --ws-surface-secondary-button-2-disabled-background-opacity: 0;
  --ws-surface-secondary-button-2-disabled-text-color: var(--ws-color-text-black);
  --ws-surface-secondary-button-2-disabled-text-color-opacity: 0.38;
  --ws-surface-secondary-button-2-disabled-border-color: var(--ws-color-primary-600);
  --ws-surface-secondary-button-2-disabled-border-opacity: 0.04;
}
