/* Color Theme names

--intense-color
--darkIntense-color
--hiIntense-color

--signal-color
--darkSignal-color

--day-color
--sunnyDay-color

--noon-color
--hiNoon-color
--darkNoon-color

--night-color
--lighterNight-color

*/
:root, *::before, *::after {
  --headline-ff: var(--ff-sans-headline, "ui-sans-serif");
  --copy-ff: var(--ff-sans);
  --special-ff:var(--ff-serif);
  --outside-bgr-color: var(--hiNoon-color);
  --std-bgr-color: hsl(var(--noon-color-HS-frag) 83%);
  --reporting-bgr-color: var(--hiNoon-color);
  --std-bgr-color-HSL-frag: var(--hiNoon-color-HSL-frag);
  --inverted-bgr-color: var(--night-color, black);
  --option-accent-bgr-c: hsla(var(--hiNoon-color-HSL-frag) / .5);
  --std-text-color: var(--night-color, black);
  --std-text-color-HSL-frag: var(--night-color-HSL-frag);
  --std-headline-color: var(--sunnyNight-color, dimgray);
  --inverted-bgr-intense-color:var(--darkIntense-color, hsl(210 13% 33%));
  --inverted-text-color: var(--hiNoon-color, white);
  --structuring-color: var(--noon-color, gainsboro);
  --structuring-color-HS-frag: var(--darkerNoon-color-HS-frag);
  --structuring-color-HSL-frag: var(--darkerNoon-color-HSL-frag);
  --ci-color: var(--darkIntense-color);
  --ci-color-HSL-frag: var(--darkIntense-color-HSL-frag);
  --ci-color-HS-frag: var(--darkIntense-color-HS-frag);
  --question-header-text-c: var(--hiNoon-color);
  --question-header-bgr-c: hsla(var(--lighterNight-color-HSL-frag) / .97);
  --question-header-bgr-backdrop-c: hsla(var(--lighterNight-color-HSL-frag) / .7);
  --header-bgr-c: var(--outside-bgr-color);
  --check-color: var(--signal-color);
  --checkbox-focus-color: hsla(var(--darkIntense-color-HSL-frag) / .3);
  --checkbox-bgr-c: hsla( var(--day-color-HSL-frag) / .4);
  --checkbox--checked-bgr-c: var(--noon-color);
  --checkbox-border-color: var(--std-text-color);
  --checkbox-size: 2rem;
  --checkbox-base-size: 2rem;
  --bf-bgr-c: var(--darkIntense-color);
  --bf-bgr-image: url("../images/room.webp");
  --bf-text-c: var(--hiNoon-color);
  --bf-headline-c: var(--hiNoon-color);
  --bf-text-ff: var(--ff-serif);
  --bf-headline-ff: var(--ff-sans-headline);
  --bf-label-text-color: var(--noon-color);
  --bf-label-ff: var(--ff-sans-headline);
  --bf-label-fw: 100;
  --bf-input-bgr-c: transparent;
  --bf-input-bgr-focus-c: hsla(var(--hiNoon-color-HSL-frag)/ .8);
  --bf-input-text-c: var(--hiNoon-color);
  --bf-input-text-ff: var(--ff-sans);
  --bf-input-text-focus-c-HSL-frag: var(--night-color-HSL-frag);
  --bf-input-text-focus-c: hsl(var(--bf-input-text-focus-c-HSL-frag));
  --bf-input-placeholder-c: hsla(var(--noon-color-HSL-frag)/ .5);
  --bf-input-placeholder-focus-c: hsla(var(--lighterNight-color-HSL-frag)/ .5);
  --bf-input-border-c: var(--sunnyDay-color);
  --bf-input-border-focus-c: var(--hiIntense-color);
  --bf-input-border-empty-c: var(--day-color);
  --bf-input-border-error-c: var(--hiIntense-color);
  --bf-input-icon-c: var(--noon-color);
  --bf-input-icon-focus-c: var(--hiNoon-color);
  --bf-input-icon-error-c: var(--hiNoon-color);
  --bf-input-warn-sign-c: var(--signal-color);
  --bf-input-icon-bgr-c: hsla(var(--night-color-HSL-frag)/ .33);
  --bf-input-icon-bgr-focus-c:var(--intense-color);
  --bf-input-icon-bgr-error-c:var(--darkSignal-color);
  --bf-button-bgr-disabled-c: hsla(var(--night-color-HSL-frag)/ .33);
  --bf-button-bgr-c: var(--sunnyDay-color);
  --bf-button-bgr-focus-c: hsl(90 var(--sunnyDay-color-S-frag) var(--sunnyDay-color-L-frag));
  --bf-button-text-disabled-c: hsla(var(--noon-color-HSL-frag)/ .33);
  --bf-button-text-focus-c: var(--darkNoon-color);
  --bf-button-text-c: hsl(var(--darkNoon-color-HS-frag) 30%);
  --bf-info-height: 55px;
  --bf-info-main-height: 40px;
  --bf-info-bgr-c: var(--day-color);
  --bf-info-text-c: var(--darkNoon-color);
  --bf-info-headline-text-c: var(--darkNoon-color);
  --bf-info-headline-text-weight: 200;
  --bf-info-headline-letter-spacing: normal;
  --bf-info-headline-bgr-c: hsl(var(--day-color-HS-frag) 50%);
  --bf-info-arrow-c:var(--darkIntense-color);
  --bf-info-arrow-hover-c:var(--intense-color);
  --nav-height: 75px;
  --nav-bgr-c: var(--day-color);
  --nav-button-bgr-disabled-c: hsla(var(--night-color-HSL-frag)/ .33);
  --nav-button-bgr-c: var(--sunnyDay-color);
  --nav-button-bgr-focus-c: var(--bf-button-bgr-focus-c);
  --nav-button-text-disabled-c: hsla(var(--noon-color-HSL-frag)/ .33);
  --nav-button-text-focus-c: var(--darkNoon-color);
  --nav-button-text-c: hsl(var(--darkNoon-color-HS-frag) 30%);
  --dialog-close-button-bgr-c: var(--darkSignal-color);
  --dialog-close-button-hover-bgr-c: var(--signal-color);
  --dialog-close-button-outline-c: var(--darkSignal-color);
  --dialog-header-icon-default-c: var(--darkerSad-color);
  --dialog-header-icon-warn-c: var(--sunnySad-color);
  --dialog-header-icon-neutral-c: var(--sunnyNeutral-color);
  --dialog-header-bgr-neutral-c: var(--darkerNeutral-color);
  --dialog-header-bgr-warn-c: var(--darkerSad-color);
  --baseinfo-hint-icon-default-c: var(--darkIntense-color);
  --baseinfo-hint-icon-bgr-default-c: var(--option-accent-bgr-c);
  --baseinfo-hint-icon-default-hover-c: var(--darkerIntense-color);
  --baseinfo-hint-icon-bgr-default-hover-c: var(--sunnyDay-color);
  --baseinfo-hint-icon-warn-c: var(--std-text-color);
  --baseinfo-hint-icon-bgr-warn-c: var(--darkerSad-color);
  --baseinfo-hint-icon-warn-hover-c: var(--darkerSad-color);
  --baseinfo-hint-icon-bgr-warn-hover-c: var(--sunnySad-color);
  --baseinfo-hint-icon-default-outline-c: var(--neutral-color);
  --footnote-default-c: var(--neutral-color);
  --footnote-warn-bgr-c: hsl(var(--lightSad-color-HSL-frag) / .5);
  --footnote-warn-header-bgr-c: hsl(var(--lightSad-color-HSL-frag) / 1);
  --footnote-warn-border-c: var(--darkerSad-color);
  --footnote-warn-icon-c: var(--darkSignal-color);
  --page-padding: 1rem;
  --advanced-live-field-bgr-c: hsl(var(--day-color-HS-frag) 90%);
  --advanced-live-field-text-c: var(--lighterNight-color);
  --tww-finder-text-c: var(--std-text-color);
  --tww-finder-padding: .3em;
  --tww-finder-f-size: 1.5rem;
  --tww-finder-f-lineheight: 1.4;
  --tww-finder-ff: var(--copy-ff);
  --tww-valid-check-c: var(--happy-color);
  --tww-finder-small-input-width: 4ch;
  --tww-finder-small-input-left-dist: 1.5ch;
  --tww-finder-validation-f-scale: 1.66;
  --tww-finder-validation-r-dist: calc(var(--tww-finder-padding));
  --tww-finder-small-width: calc(var(--tww-finder-small-input-width) + var(--tww-finder-small-input-left-dist));
  --tww-finder-body-text-c: var(--std-text-color);
  --finder-label-ff: var(--headline-ff);
  --finder-icon-bgr-c: var(--darkIntense-color);
  --finder-icon-focus-bgr-c: var(--intense-color);
  --finder-icon-c: var(--noon-color);
  --finder-icon-focus-c: var(--hiNoon-color);
  --finder-pin-icon-c: var(--hiNoon-color);
  --finder-pin-icon-focus-c: var(--hiIntense-color);
  --finder-input-passiv-bgr-c: var(--hiNoon-color);
  --finder-input-sub-focus-bgr-c: hsla(var(--structuring-color-HSL-frag) / .5);
  --finder-input-focus-bgr-c: var(--sunnyNoon-color);
  --finder-underline-passive-color: var(--day-color);
  --finder-underline-sub-focus-color: var(--intense-color);
  --finder-underline-focus-color: var(--darkIntense-color);
  --finder-selection-list-passive-item-text-c: var(--lighterNight-color);
  --finder-selection-list-passive-strong-item-c: var(--lightNight-color);
  --finder-selection-list-passive-item-bgr-c: var(--lightNoon-color);
  --finder-selection-list-highlight-item-bgr-c: var(--darkIntense-color);
  --finder-selection-list-highlight-item-c: var(--sunnyNoon-color);
  --finder-selection-list-highlight-strong-item-c: var(--sunnyDay-color);
  --finder-selection-list-scrollbar-thumb-c: hsla(var(--darkIntense-color-HSL-frag) / .3);
  --finder-bubble-bgr-c: var(--darkIntense-color);
  --finder-bubble-text-c: var(--hiNoon-color);
  --finder-bubble-key-bgr-c: var(--sunnyDay-color);
  --finder-bubble-key-text-c: var(--night-color);
  --finder-message-bgr-c: var(--hiNoon-color);
  --finder-message-border-c: var(--darkerNeutral-color);
  --finder-message-icon-default-c: var(--sunnyNeutral-color);
  --finder-message-border-success-c: var(--darkerHappy-color);
  --finder-message-icon-success-c: var(--sunnyHappy-color);
  --finder-message-border-warn-c: var(--darkerSad-color);
  --finder-message-icon-warn-c: var(--sunnySad-color);
  --finder-message-border-error-c: var(--darkerPanic-color);
  --finder-message-icon-error-c: var(--sunnyPanic-color);
}