:root {
    /* Local variables */
    --title-font: var(--default-font, sans-serif);
    --list-font: var(--default-font, sans-serif);
    --primary: oklch(0.16 0.0588 258.24); /* 0 12 38 */
    --dark-brand: oklch(0.24 0.0432 271.28); /* 24 30 52 */
    --generic-text: oklch(0.16 0.0588 258.24); /* 0 12 38 */
    --accent-blue: oklch(0.4495 0.1273 267.42); /* 54 79 155 */
    --accent-blue-light: oklch(0.67 0.0899 252.36); /* 108 154 218 */
    --accent-blue-subtle: oklch(0.9634 0.0115 264.51); /* 239 243 251 */
    --accent-blue-border: oklch(0.85 0.0439 253.36); /* 197 215 242 */
    --green: oklch(0.72 0.1172 187.79); /* 42 188 178 */
    --green-subtle: oklch(0.9826 0.0117 190.45); /* 241 252 251 */
    --secondary-green: oklch(0.72 0.1204 187.91); /* 20 188 178 */
    --bg-ui: oklch(0.96 0.0019 264.54); /* 244 244 245 */
    --bg-container: oklch(0.96 0.0019 264.54); /* 244 244 245 */
    --bg-warm-subtle: oklch(0.95 0.0186 75.29); /* 245 236 224 */
    --default-border: oklch(0.89 0.0073 256.81); /* 220 223 229 */
    --default-border-hover: oklch(0.83 0 0); /* 200 200 200 */
    --default-input-font-size: 1.125rem;
    --control-border: oklch(0.89 0.0073 256.81); /* 220 223 229 */
    --muted-text: oklch(0.5 0.0147 286.07); /* 99 99 110 */
    --text-default: oklch(0.2077 0.0398 265.75); /* 15 23 42 */
    /* Salesdock-UI brand overrides */
    --brand-default: oklch(0.2443 0.0434 269.60); /* 24 31 53 */
    --brand-bold: oklch(0.2443 0.0434 269.60); /* 24 31 53 */
    --brand-subtlest: var(--accent-blue-subtle);
    /* Generic variables */
    --header-bg-default: var(--primary);
    --footer-bg-default: oklch(1 0 0); /* 255 255 255 */
    --base-font-family: var(--default-font);
    --title-font-family: var(--title-font);
    --list-item-font-family: var(--list-font);
    --base-font-size: 18px;
    --default-font-size: 1.125rem;
    --focus-ring: var(--accent-blue);
    --focus-ring-secondary: oklch(0 0 0); /* 0 0 0 */
    --focus-ring-width: 0.25rem;
    --focus-ring-offset: 0;
    --label-font-size: 1.125rem;
    --label-fw: 700;
    --label-text: var(--dark-brand);
    --label-leading: 1.5;
    --label-optional-text: oklch(0.45 0.043 257.42);
    --label-optional-font-size: 1.125rem;
    --label-optional-font-family: var(--default-font);
    --label-optional-leading: 1.27;
    --placeholder-default: oklch(0.73 0.0066 286.03); /* 172 172 180 */
    --link-text-default: var(--accent-blue); /* 54 79 155 — Figma #364f9b */
    --link-text-hover: oklch(0.38 0.1095 264.18); /* 42 62 130 */
    --label-text-default: var(--dark-brand);
    --label-optional-default: oklch(0.16 0.0588 258.24); /* 0 11 37 */
    --generic-icon-color: var(--accent-blue); /* 54 79 155 */
    --generic-icon-color-hover: var(--accent-blue); /* 54 79 155 */
    /* Overrides */
    --bg-brand: var(--primary);
    --text-error: oklch(0.51 0.1905 27.52); /* 185 28 28 */
    --button-primary-bg: oklch(0.83 0.1504 78.87); /* 254 187 62 */
    --button-primary-bg-hover: oklch(0.89 0.1226 85.25); /* 254 211 117 */
    --button-primary-border: oklch(0.83 0.1504 78.87);
    --button-primary-border-hover: oklch(0.89 0.1226 85.25);
    --button-primary-text: var(--dark-brand);
    --button-secondary-bg: var(--accent-blue-subtle);
    --button-secondary-bg-hover: oklch(0.94 0.0199 262.75); /* 228 236 248 */
    --button-secondary-border: var(--accent-blue-border);
    --button-secondary-text: var(--dark-brand);
    --button-disabled-bg: oklch(0.91 0.0032 286.03); /* 226 226 228 */
    --button-disabled-text: oklch(0.5 0.0147 286.07); /* 99 99 110 */
    --button-disabled-border: oklch(0.91 0.0032 286.03);
    --button-radius: 0.5rem;
    --button-px: 1rem;
    --button-py: 0.75rem;
    --button-font-size: 1.125rem;
    --button-leading: 1.125rem;
    --button-fw: var(--font-weight-bold);
    --button-border-width: 0;
    --button-link-font-family: var(--default-font);
    --button-link-text: var(--accent-blue);
    --button-link-text-hover: var(--link-text-hover);
    --button-link-fw: 600;
    --color-border-focus: var(--accent-blue);
    --focus-ring-color: var(--accent-blue);
    --input-outline-offset: -1px;
    --input-font-size: var(--default-input-font-size);
    --input-px: 0.75rem;
    --input-py: 0;
    --input-leading: normal;
    --input-bg: oklch(1 0 0); /* 255 255 255 */
    --input-bg-error: oklch(1 0 0); /* 255 255 255 */
    --input-border: var(--default-border);
    --input-border-hover: var(--default-border-hover);
    --input-text: var(--primary);
    --input-text-disabled: var(--primary);
    --input-border-error: oklch(0.6 0.247673 29.2339); /* 242 0 0 */
    --input-radius: 0.5rem;
    --input-min-h: 2.938rem;
    --input-h: 2.938rem;
    --input-trailing: oklch(0.46 0 0); /* 89 89 89 */
    --input-trailing-font-size: var(--base-font-size);
    --input-trailing-font-family: var(--title-font-family);
    --input-trailing-fw: 400;
    --input-text-error: oklch(0.53 0.2111 28.73); /* 200 12 12 */
    --error-leading: 1.25rem;
    --error-font-size: 1rem;
    --error-font-family: var(--base-font-family);
    --input-usage-w: 220px;
    --input-error-border-width: 0.063rem;
    --input-helper-spacing: 0.5rem;
    --input-helper-pt: var(--input-helper-spacing);
    --number-input-helper-pt: var(--input-helper-spacing);
    --select-helper-pt: var(--input-helper-spacing);
    --textarea-helper-mt: var(--input-helper-spacing);
    --datepicker-helper-pt: var(--input-helper-spacing);
    --phone-input-helper-pt: var(--input-helper-spacing);
    --switch-helper-pt: var(--input-helper-spacing);
    --checkbox-bg: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --checkbox-bg-hover: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --checkbox-bg-checked: var(--dark-brand);
    --checkbox-bg-checked-hover: var(--dark-brand);
    --checkbox-bg-disabled: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --checkbox-bg-disabled-checked: oklch(0.92 0 0); /*230 230 230*/
    --checkbox-bg-error: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --checkbox-bg-error-checked: oklch(0.58 0.238666 28.4765); /* 231 0 11 */
    --checkbox-bg-error-hover: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --checkbox-bg-error-checked-hover: oklch(
        0.58 0.238666 28.4765
    ); /* 231 0 11 */
    --checkbox-border: oklch(0.87 0.0032 286.03); /* 215 215 219 */
    --checkbox-border-hover: var(--default-border);
    --checkbox-border-disabled: var(--default-border);
    --checkbox-border-disabled-checked: oklch(0.86 0 0); /* 210 210 210 */
    --checkbox-border-error: oklch(0.58 0.238666 28.4765); /* 231 0 11 */
    --checkbox-border-error-hover: var(--default-border);
    --checkbox-border-error-checked-hover: oklch(
        0.58 0.238666 28.4765
    ); /* 231 0 11 */
    --checkbox-border-checked: var(--dark-brand);
    --checkbox-border-checked-hover: var(--dark-brand);
    --checkbox-w: 1.5rem;
    --checkbox-h: 1.5rem;
    --checkbox-radius: 0.25rem;
    --checkbox-text: var(--generic-text);
    --checkbox-font-size: 1.125rem;
    /* Boxed Radio */
    --boxed-radio-my: 0;
    --boxed-radio-bg-default: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --boxed-radio-bg-default-hover: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --boxed-radio-bg-checked: var(--accent-blue-subtle); /* 239 243 251 */
    --boxed-radio-bg-checked-hover: var(--accent-blue-subtle); /* 239 243 251 */
    --boxed-radio-bg-disabled: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --boxed-radio-bg-error: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --boxed-radio-bg-error-hover: oklch(0.96 0.0108 17.34); /* 250 240 240 */
    --boxed-radio-border-default: oklch(0.9 0.0073 256.81); /* 220 223 229 */
    --boxed-radio-border-default-hover: oklch(0.9 0.0073 256.81); /* 220 223 229 */
    --boxed-radio-border-checked: var(--accent-blue); /* 54 79 155 */
    --boxed-radio-border-checked-hover: var(--accent-blue); /* 54 79 155 */
    --boxed-radio-border-disabled: oklch(0.93 0.0126 255.51); /* 226 232 240 */
    --boxed-radio-border-error: oklch(0.53 0.2111 28.73); /* 200 12 12 */
    --boxed-radio-border-error-hover: oklch(0.5 0.2059 29.14); /* 190 2 2 */
    --boxed-radio-radius: 0.375rem;
    --boxed-radio-border: 2px;
    --boxed-radio-font-size: 1.5rem;
    --boxed-radio-font-fw: 700;
    --boxed-radio-px: 4.375rem;
    --boxed-radio-py: 1.25rem;
    --boxed-radio-border-outer-default: var(--control-border);
    --boxed-radio-border-outer-default-hover: oklch(0.83 0 0); /* 200 200 200 */
    --boxed-radio-border-outer-disabled: oklch(
        0.93 0.0126 255.51
    ); /* 226 232 240 */
    --boxed-radio-border-outer-checked: var(--accent-blue); /* 54 79 155 */
    --boxed-radio-border-outer-checked-hover: var(--accent-blue); /* 54 79 155 */
    --boxed-radio-bg-outer-default: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --boxed-radio-bg-outer-checked: oklch(1 0 0); /* 255 255 255 */
    --boxed-radio-bg-outer-disabled: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --boxed-radio-bg-outer-disabled-checked: oklch(
        0.81 0.0269 248.16
    ); /* 180 195 210 */
    --boxed-radio-bg-outer-error: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --boxed-radio-bg-outer-error-hover: oklch(
        0.91 0.15455 194.7689
    ); /* 0 255 255 */
    /* Card */
    --card-bg: oklch(1 0 0); /* 255 255 255 */
    --card-border: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --card-bg-collapsed: oklch(1 0 0); /* 255 255 255 */
    --card-border-collapsed: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --card-opacity-collapsed: 0.5;
    --card-radius: 0.75rem;
    --card-border-width: 0;
    --card-px: 2rem;
    --card-py: 2rem;
    --card-title-px: 0;
    --card-title-py: 0;
    --card-footer-px: 0;
    --card-footer-py: 0;
    --card-title-font-family: var(--title-font);
    --card-title: var(--primary);
    --card-title-collapsed: var(--primary);
    --card-title-font-size: 2rem;
    --card-subtitle-font-size: 1.5rem;
    --card-subtitle: 1.5rem;
    --card-title-fw: 700;
    --card-content-my: 1.5rem;
    --card-sub-title: var(--primary);
    --card-sub-title-font-size: 1.5rem;
    --card-text: var(--primary);
    --card-subtitle-mt: 0.25rem;
    --card-subtitle-mb: 0;
    --card-sub-title-font-family: var(--title-font);
    --card-sub-lead: oklch(0.16 0.0588 258.24); /* 0 11 37 */
    --card-sub-lead-font-size: 1.125rem;
    --card-sub-lead-font-family: var(--default-font);
    --card-sub-lead-fw: 400;
    --card-sub-lead-mt: 0.5rem;
    --card-sub-lead-mb: 0;
    /* Stepper */
    --stepper-count-font-family: var(--title-font);
    --stepper-count-fw: 700;
    --stepper-count-font-size: 0.938rem;
    --stepper-count-radius: 9999px;
    --stepper-count-px: 0.5rem;
    --stepper-count-py: 0.5rem;
    --stepper-count-bg-default: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --stepper-count-bg-default-hover: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --stepper-count-bg-active: var(--primary);
    --stepper-count-bg-active-hover: var(--primary);
    --stepper-count-border-default: oklch(0.97 0.011 303.11); /* 246 243 251 */
    --stepper-count-border-default-hover: oklch(
        0.97 0.011 303.11
    ); /* 246 243 251 */
    --stepper-count-border-active: var(--primary);
    --stepper-count-border-active-hover: var(--primary);
    --stepper-count-text-default: oklch(0.73 0.0066 286.03); /* 172 172 180 */
    --stepper-count-text-default-hover: oklch(0.73 0.0066 286.03); /* 172 172 180 */
    --stepper-count-text-active: oklch(1 0 0); /* 255 255 255 */
    --stepper-count-text-active-hover: oklch(1 0 0); /* 255 255 255 */
    --stepper-count-text-link-default: var(--dark-brand);
    --stepper-count-text-link-hover: var(--dark-brand);
    --stepper-count-w: 2rem;
    --stepper-count-h: 2rem;
    --stepper-label-default: oklch(0.73 0.0066 286.03); /* 172 172 180 */
    --stepper-label-hover: oklch(0.73 0.0066 286.03); /* 172 172 180 */
    --stepper-link-label-default: var(--muted-text);
    --stepper-link-label-hover: var(--muted-text);
    --stepper-label-active: var(--muted-text);
    --stepper-label-active-hover: var(--muted-text);
    --stepper-label-fw: 400;
    --stepper-label-active-fw: 600;
    --stepper-container-px: 1rem;
    --stepper-container-py: 2rem;
    /* Callout */
    --callout-bg-subtle: oklch(0.97 0.0091 258.34); /* 242 246 252 */
    --callout-border-subtle: oklch(0.46 0.2047 270.09); /* 49 66 199 */
    --callout-title-fw: 700;
    --callout-title-font-size: 1.375rem;
    --callout-body-font-size: 1.125rem;
    --callout-px: 1.25rem;
    --callout-py: 1rem;
    --callout-title-tracking: -0.015rem;
    --callout-body-tracking: -0.012rem;
    --callout-title-leading: 150%;
    --callout-body-leading: 127.778%;
    --callout-title-mb: 0.25rem;
    --callout-text: var(--generic-text);
    /* Tab */
    --tab-bg: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --tab-bg-hover: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --tab-bg-active: var(--dark-brand);
    --tab-text: oklch(0 0 0); /* 0 0 0 */
    --tab-text-hover: oklch(0.32 0 0); /* 50 50 50 */
    --tab-text-active: oklch(1 0 0); /* 255 255 255 */
    --tab-text-active-hover: oklch(1 0 0); /* 255 255 255 */
    --tab-fw: 400;
    --tab-active-fw: 700;
    --tab-font-family: var(--default-font);
    --tab-radius: 9999px;
    --tab-px: 1rem;
    --tab-py: 0.25rem;
    --tab-border-width: 1px;
    --tab-font-size: 1.125rem;
    /* Accordion */
    --accordion-header-bg: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --accordion-header-bg-hover: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --accordion-header-bg-active: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --accordion-header-bg-active-hover: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --accordion-header-text: oklch(0.38 0.0253 266.9); /* 59 65 79 */
    --accordion-header-text-hover: oklch(
        0.38 0.0253 266.9
    ); /* 59 65 79 */
    --accordion-header-text-active: oklch(0.38 0.0253 266.9); /* 59 65 79 */
    --accordion-header-text-active-hover: oklch(
        0.38 0.0253 266.9
    ); /* 59 65 79 */
    --accordion-header-font-family: var(--default-font);
    --accordion-header-font-size: 1rem;
    --accordion-border: oklch(0.83 0.0245 223.74); /* 183 203 211 */
    --accordion-header-fw: 600;
    --accordion-header-px: 1.5rem;
    --accordion-header-py: 1rem;
    --accordion-content-px: 1.5rem;
    --accordion-content-py: 1rem;
    /* Accordion Container */
    --accordion-container-px: 0;
    --accordion-container-py: 0;
    --accordion-container-border: oklch(
        0.83 0.0245 223.74
    ); /* 183 203 211 */
    --accordion-container-border-width: 1px;
    --accordion-container-heading-px: 1.5rem;
    --accordion-container-heading-py: 1.5rem;
    --accordion-container-header-font-family: var(--title-font-family);
    --accordion-container-header-fw: 600;
    --accordion-container-header-font-size: var(--base-font-size);
    --accordion-container-header: oklch(0 0 0); /* black — matches production */
    --accordion-footer-font-size: 1rem;
    --accordion-container-footer-px: 1.5rem;
    --accordion-container-footer-py: 1rem;
    --accordion-container-footer-bg: oklch(
        0.98 0.0025 228.78
    ); /* 247 249 250 */
    --accordion-container-radius: 1.5rem;
    --accordion-container-footer-font-family: var(--default-font);
    --accordion-container-footer-fw: 600;
    --accordion-container-footer-text: oklch(0.38 0.0253 266.9); /* 59 65 79 */
    /* Modal */
    --modal-header-font-family: var(--title-font-family);
    --modal-header-fw: 700;
    --modal-header-font-size: 2rem;
    --modal-header-bg: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --modal-header-text: var(--primary);
    --modal-header-border: 0;
    --modal-header-pl: 2rem;
    --modal-header-pr: 2rem;
    /* --modal-header-px: 2rem;
    --modal-header-py: 2rem; */
    --modal-header-pt: 2rem;
    --modal-header-pb: 1.5rem;
    --modal-footer-font-family: var(--title-font-family);
    --modal-footer-fw: 700;
    --modal-footer-font-size: 2rem;
    --modal-footer-bg: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --modal-footer-border: oklch(0.83 0.0245 223.74); /* 183 203 211 */
    --modal-footer-text: var(--primary);
    --modal-footer-border-width: 0;
    --modal-footer-px: 2rem;
    --modal-footer-py: 2rem;
    --modal-content-px: 2rem;
    --modal-content-py: 0rem;
    --modal-border-width: 0;
    --modal-border: oklch(0.83 0.0245 223.74); /* 183 203 211 */
    --modal-radius: 0.75rem;
    --modal-title-leading: 1;
    --modal-header-border-width: 0;
    /* Cost Specification */
    --cost-spec-item-font: var(--default-font);
    --cost-spec-item-font-size: 1rem;
    --cost-spec-default: oklch(0.38 0.0253 266.9); /* 59 65 79 */
    --cost-spec-fineprint-default: var(--muted-text);
    --cost-spec-icon-container-gas: oklch(0.89 0.1226 85.25); /* 254 211 117 */
    --cost-spec-icon-container-electricity: oklch(
        0.72 0.1204 187.91
    ); /* 30 188 178 */
    --cost-spec-icon-electricity: oklch(0.16 0.0588 258.24); /* 0 11 37 */
    --cost-spec-icon-gas: oklch(0.16 0.0588 258.24); /* 0 11 37 */
    --cost-spec-icon-size: 1rem;
    --cost-spec-icon-container-w: 1.5rem;
    --cost-spec-icon-container-h: 1.5rem;
    --cost-spec-icon-container-radius: 999px;
    --select-border: var(--input-border);
    --select-border-width: var(--input-border-width, 1px);
    --select-border-hover: var(--input-border-hover);
    --select-border-error: var(--input-border-error);
    --select-px: var(--input-px);
    --select-py: 0.75rem;
    --select-bg: var(--input-bg);
    --select-bg-hover: var(--input-bg);
    --select-text: var(--primary);
    --select-text-hover: oklch(0.63 0.2577 29.23); /* 255 0 0 */    --select-label-fw: 400;
    --select-font-size: var(--input-font-size);
    --select-dropdown-icon-mr: 0;
    --select-h-offset: 15;
    /* Dropdown */
    --dropdown-font-size: var(--default-input-font-size);
    --dropdown-text: var(--primary);
    --dropdown-text-hover: var(--primary);
    --dropdown-text-selected: var(--primary);
    --dropdown-text-selected-hover: var(--primary);
    --dropdown-bg: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --dropdown-bg-hover: var(--accent-blue-subtle); /* 239 243 251 */
    --dropdown-bg-selected: var(--accent-blue-subtle); /* 239 243 251 */
    --dropdown-bg-selected-hover: var(--accent-blue-subtle); /* 239 243 251 */
    --dropdown-text-focus: var(--primary);
    --dropdown-bg-focus: oklch(0.96 0 0); /* 240 240 240 */
    --dropdown-icon-selected: var(--accent-blue); /* 54 79 155 */
    --dropdown-icon-selected-hover: var(--accent-blue); /* 54 79 155 */    --dropdown-option-px: 0.75rem;
    --dropdown-option-py: 0.65rem;
    --select-option-text: var(--dropdown-text);
    --select-option-text-hover: var(--dropdown-text-hover);
    --select-option-text-focus: var(--dropdown-text-focus);
    --select-option-text-selected: var(--dropdown-text-selected);
    --select-option-text-selected-hover: var(--dropdown-text-selected-hover);
    --select-option-bg: var(--dropdown-bg);
    --select-option-bg-hover: var(--dropdown-bg-hover);
    --select-option-bg-focus: var(--dropdown-bg-focus);
    --select-option-bg-selected: var(--dropdown-bg-selected);
    --select-option-bg-selected-hover: var(--dropdown-bg-selected-hover);
    --select-option-icon-selected: var(--dropdown-icon-selected);
    --select-option-icon-selected-hover: var(--dropdown-icon-selected-hover);
    --select-option-font-size: var(--dropdown-font-size);
    --select-option-px: var(--dropdown-option-px);
    --select-option-py: var(--dropdown-option-py);
    --select-empty-text: var(--placeholder-default);
    --select-empty-font-size: var(--dropdown-font-size);
    --select-radius: var(--input-radius);
    /* Calendar */
    --calendar-dialog-bg: oklch(1 0 0);
    --calendar-dialog-border: 1px;
    --calendar-dialog-radius: 0.75rem;
    --calendar-header-text: var(--primary);
    --calendar-header-font-size: var(--base-font-size);
    --calendar-header-fw: 700;
    --calendar-header-font-family: var(--base-font-family);
    --calendar-weekday-text: var(--color-text-subtle);
    --calendar-weekday-font-size: 0.75rem;
    --calendar-weekday-fw: 400;
    --calendar-weekday-font-family: var(--base-font-family);
    --calendar-day-text: var(--primary);
    --calendar-day-text-hover: var(--accent-blue);
    --calendar-day-bg: oklch(1 0 0 / 0%);
    --calendar-day-bg-hover: oklch(0.97 0 0);
    --calendar-day-border: oklch(1 0 0 / 0%);
    --calendar-day-bg-selected: var(--dark-brand);
    --calendar-day-bg-selected-hover: var(--dark-brand);
    --calendar-day-text-selected: oklch(1 0 0);
    --calendar-day-text-selected-hover: oklch(1 0 0);
    --calendar-day-border-selected: oklch(1 0 0 / 0%);
    --calendar-day-border-selected-width: 0;
    --calendar-day-bg-today: oklch(1 0 0 / 0%);
    --calendar-day-bg-today-hover: oklch(0.97 0 0);
    --calendar-day-text-today: var(--dark-brand);
    --calendar-day-text-today-hover: var(--accent-blue);
    --calendar-day-border-today: var(--dark-brand);
    --calendar-day-border-today-hover: var(--dark-brand);
    --calendar-day-border-width: 1px;
    --calendar-day-text-disabled: var(--color-text-subtle);
    --calendar-day-bg-disabled: oklch(1 0 0 / 0%);
    --calendar-day-text-unavailable: oklch(0.63 0 0);
    --calendar-day-bg-unavailable: oklch(1 0 0 / 0%);
    --calendar-day-text-selected-unavailable: oklch(0.63 0 0);
    --calendar-cell-radius: 0.75rem;
    --calendar-cell-font-size: 0.875rem;

    /* Date Picker */
    --datepicker-bg: oklch(1 0 0 / 0%);
    --datepicker-bg-hover: oklch(1 0 0 / 0%);
    --datepicker-border: var(--default-border);
    --datepicker-border-hover: var(--default-border-hover);
    --datepicker-border-error: oklch(0.58 0.238666 28.4765);
    --datepicker-border-error-hover: oklch(0.58 0.238666 28.4765);
    --datepicker-border-success: var(--input-border-success);
    --datepicker-success-border-width: 0.125rem;
    --datepicker-text: var(--primary);
    --datepicker-text-hover: var(--primary);
    --datepicker-error-text: oklch(0.53 0.2111 28.73);
    --datepicker-h: var(--input-h);
    --datepicker-radius: 0.5rem;
    --datepicker-px: var(--input-px);
    --datepicker-py: 0;
    --datepicker-font-size: var(--default-input-font-size);
    --datepicker-fw: 400;
    --datepicker-font-family: var(--base-font-family);
    --datepicker-error-font-size: 1rem;
    --datepicker-error-fw: 400;
    --datepicker-error-font-family: var(--base-font-family);
    /* Phone Input */
    --phone-input-h: var(--input-h);
    --phone-input-border: var(--default-border);
    --phone-border: 1px;
    --phone-input-border-hover: var(--default-border-hover);
    --phone-px: 0.75rem;
    --phone-py: 0.75rem;
    --phone-input-bg: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --phone-bg-default-hover: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --phone-input-border-error: var(--input-border-error);
    --phone-border-error-hover: var(--input-border-error); /* 190 2 2 */
    --phone-text-default: var(--primary);
    --phone-text-default-hover: oklch(0.63 0.2577 29.23); /* 255 0 0 */
    --phone-label-font-size: var(--default-input-font-size);
    --phone-label-fw: 400;
    --phone-input-label-font-size: var(--label-font-size);
    --phone-input-radius: 0.5rem;
    --phone-input-field-font-size: var(--input-font-size);
    --phone-input-bg-disabled: oklch(0.96 0 0); /* 240 240 240 */
    --phone-input-border-disabled: oklch(0.76 0 0); /* 176 176 176 */
    --phone-input-text-disabled: oklch(0.76 0 0); /* 176 176 176 */
    --phone-input-error-text: oklch(0.53 0.2111 28.73); /* 200 12 12 */
    --phone-input-error-font-size: 1rem;
    --phone-input-error-font-family: var(--base-font-family);
    --phone-input-assistive-text: oklch(0.53 0.2111 28.73); /* 200 12 12 */
    --phone-input-assistive-font-size: 1rem;
    --phone-input-assistive-font-family: var(--base-font-family);
    --phone-input-assistive-fw: 400;
    --phone-input-prefix-before-h: 2.938rem;
    /* Icon Radio */
    --icon-radio-px: 1rem;
    --icon-radio-py: 1rem;
    --icon-radio-radius: 0.5rem;
    --icon-radio-border: 2px;
    --icon-radio-border-default: oklch(0.9 0.0073 256.81); /* 220 223 229 */
    --icon-radio-border-hover: oklch(0.9 0.0073 256.81); /* 220 223 229 */
    --icon-radio-border-disabled: oklch(0.89 0 0); /* 217 217 217 */
    --icon-radio-bg-default: oklch(1 0 0); /* 255 255 255 */
    --icon-radio-bg-selected: var(--accent-blue-subtle); /* 239 243 251 */
    --icon-radio-bg-selected-disabled: oklch(0.96 0 0); /* 240 240 240 */
    --icon-radio-border-selected: var(--accent-blue); /* 54 79 155 */
    --icon-radio-bg-error: oklch(1 0 0 / 0%); /* 255 255 255 0 */
    --icon-radio-bg-error-hover: oklch(0.56 0.2305 29.23); /* 220 0 0 */
    --icon-radio-bg-error-selected: oklch(0.56 0.2305 29.23); /* 220 0 0 */
    --icon-radio-bg-error-hover-selected: oklch(
        0.56 0.2305 29.23
    ); /* 220 0 0 */
    --icon-radio-text-error: oklch(0.46 0.0261 256.8); /* 79 89 103 */
    --icon-radio-text-error-hover: oklch(1 0 0); /* 255 255 255 */
    --icon-radio-text-error-selected: oklch(1 0 0); /* 255 255 255 */
    --icon-radio-text-error-hover-selected: oklch(1 0 0); /* 255 255 255 */
    --icon-radio-icon-error: oklch(0.46 0.0261 256.8); /* 79 89 103 */
    --icon-radio-icon-error-hover: oklch(1 0 0); /* 255 255 255 */
    --icon-radio-icon-error-selected: oklch(1 0 0); /* 255 255 255 */
    --icon-radio-icon-error-hover-selected: oklch(1 0 0); /* 255 255 255 */
    --icon-radio-border-error: oklch(0.56 0.2305 29.23); /* 220 0 0 */
    --icon-radio-border-error-hover: oklch(0.56 0.2305 29.23); /* 220 0 0 */
    --icon-radio-border-error-selected: var(--dark-brand);
    --icon-radio-border-error-hover-selected: var(--dark-brand);
    --icon-radio-border-selected-disabled: oklch(0.89 0 0); /* 217 217 217 */
    --icon-radio-bg-hover: oklch(0.96 0 0); /* 240 240 240 */
    --icon-radio-control-bg: oklch(1 0 0); /* 255 255 255 */
    --icon-radio-bg-disabled: oklch(0.99 0 0); /* 250 250 250 */
    --icon-radio-text-default: var(--dark-brand);
    --icon-radio-text-hover: oklch(0.16 0.0588 258.24); /* 0 11 37 */
    --icon-radio-text-checked: oklch(0.16 0.0588 258.24); /* 0 11 37 */
    --icon-radio-text-checked-hover: oklch(0.16 0.0588 258.24); /* 0 11 37 */
    --icon-radio-text-disabled: oklch(0.89 0 0); /* 217 217 217 */
    --icon-radio-icon-default: oklch(0.241 0.0432 271.28); /* 24 30 52 */
    --icon-radio-icon-hover: oklch(0.241 0.0432 271.28); /* 24 30 52 */
    --icon-radio-icon-checked: oklch(0.241 0.0432 271.28); /* 24 30 52 */
    --icon-radio-icon-checked-hover: oklch(0.241 0.0432 271.28); /* 24 30 52 */
    --icon-radio-icon-disabled: oklch(0.89 0 0); /* 217 217 217 */
    --icon-radio-font-size: 1.125rem;
    --icon-radio-icon-size: 2.25rem;
    --icon-radio-gap: 1rem;
    /*  Product Card  */
    --product-card-text-color: oklch(0.1611 0.059 257.73); /* 0 12 38 */
    --product-card-header-default: var(--product-card-text-color);
    --product-card-header-font-size: 2rem;
    --product-card-header-font: var(--title-font);
    --product-card-default-font: var(--default-font);
    --product-card-header-fw: 900;
    --product-card-usp-default: var(--product-card-text-color);
    --product-card-usp-font-size: 1.125rem;
    --product-card-price-default: var(--product-card-text-color);
    --product-card-price-font-size: 3rem;
    --product-card-price-font: var(--default-font);
    --product-card-price-fw: 700;
    --indication-text: oklch(0.5 0.0147 286.07); /* 99 99 110 */
    --product-card-vat-default: var(--product-card-text-color);
    --product-card-vat-opacity: 0.5;
    --product-card-vat-font-size: 1.125rem;
    --product-card-link-color: var(--accent-blue); /* 54 79 155 */
    --product-card-link-font: var(--default-font);
    --product-card-link-font-size: 1.125rem;
    --product-card-icon-w: 1.063rem;
    --product-card-icon-h: 1.063rem;
    --product-card-icon-container-w: 1.625rem;
    --product-card-icon-container-h: 1.625rem;
    --product-card-icon-color: oklch(0.702 0.1575 160.43); /* 2 188 125 */
    --product-card-item-gap: 0.25rem;
    --product-card-icon-pt: 0.25rem;
    --product-card-icon-pb: 0;
    --product-card-default-font-size: 1.125rem;
    --product-card-badge-border: var(--accent-blue-border); /* 197 215 242 */
    --product-card-badge-text: var(--dark-brand); /* 24 30 52 */
    /*Total Indication Section Variables*/
    --total-indication-bg: oklch(0.96 0 0); /* 240 240 240 */
    --total-indication-radius: 0.375rem;
    /* Spinner */
    --spinner-size: 1rem;
    --spinner-color: oklch(0.83 0.0036 247.87); /* 198 200 202 */
    /* File Upload */
    --file-upload-px: 0.75rem;
    --file-upload-py: 0.75rem;
    --file-upload-bg: oklch(1 0 0); /* 255 255 255 */
    --file-upload-bg-disabled: oklch(0.93 0.0126 255.51); /* 226 232 240 */
    --file-upload-bg-drop-target: oklch(1 0 0); /* 255 255 255 */
    --file-upload-border: var(--default-border);
    --file-upload-border-hover: var(--default-border-hover);
    --file-upload-border-error: oklch(0.6 0.247673 29.2339); /* 242 0 0; */
    --file-upload-radius: 0.25rem;
    --file-upload-border-drop-target: var(--accent-blue); /* 54 79 155 */
    --file-upload-button-bg: oklch(1 0 0); /* 255 255 255 */
    --file-upload-button-bg-hover: oklch(1 0 0); /* 255 255 255 */
    --file-upload-button-text: var(--primary);
    --file-upload-button-text-hover: var(--primary);
    --file-upload-button-font-size: 1.125rem;
    --file-upload-button-fw: 400;
    --file-upload-button-border: var(--default-border);
    --file-upload-button-border-hover: var(--default-border-hover);
    --file-upload-button-radius: 0.25rem;
    --file-upload-button-px: 0.75rem;
    --file-upload-button-py: 0.375rem;
    --file-upload-drop-zone-label-text: var(--primary);
    --file-upload-drop-zone-label-font-size: 1.125rem;
    --file-upload-drop-zone-label-fw: 400;
    --file-upload-divider-pb: 1rem;
    --file-upload-divider-mb: 1rem;
    --file-upload-divider: var(--default-border);
    --file-upload-divider-border: 1px;
    --file-upload-place-holder-text: var(--primary);
    --file-upload-place-holder-font-size: 1.125rem;
    --file-upload-place-holder-fw: 400;
    --file-upload-assistive-text: var(--primary);
    --file-upload-assistive-font-size: 1rem;
    --file-upload-assistive-fw: 400;
    --file-upload-preview-radius: 0.375rem;
    --file-upload-preview-bg: oklch(0.97 0.0069 247.9); /* 241 245 249 */
    --file-upload-file-name-text: var(--primary);
    --file-upload-file-name-font-size: 1.125rem;
    --file-upload-file-name-fw: 500;
    --file-upload-file-size-bg: var(--accent-blue); /* 54 79 155 */
    --file-upload-file-size-text: var(--primary);
    --file-upload-file-size-font-size: 0.75rem;
    --file-upload-file-size-fw: 500;
    --file-upload-failed-text: var(--text-error);
    --file-upload-failed-font-size: 1.125rem;
    --file-upload-failed-fw: 500;
    --switch-px: 0.5rem;
    --switch-py: 0.5rem;
    --switch-bg: var(--default-border);
    --switch-bg-hover: oklch(0.71 0.0351 256.79); /* 148 163 184 */
    --switch-bg-checked: var(--accent-blue); /* 54 79 155 */
    --switch-radius: 9999px;
    --switch-w: 2.25rem;
    --switch-h: 1.125rem;
    --switch-button-bg: oklch(1 0 0); /* 255 255 255 */
    --switch-button-radius: 9999px;
    --switch-assistive-text: oklch(0.45 0.0374 257.28); /* 71 85 105 */
    --switch-assistive-font-size: 0.875rem;
    --switch-assistive-fw: 400;
    --tooltip-bg: oklch(0.13 0.0406 264.7); /* 2 6 23 */
    --tooltip-border: oklch(0.13 0.0406 264.7); /* 2 6 23 */
    --tooltip-text: oklch(1 0 0); /* 255 255 255 */
    --tooltip-radius: 0.375rem;
    --tooltip-fw: 600;
    --tooltip-font-size: 1.125rem;
    --tooltip-px: 0.625rem;
    --tooltip-py: 0.375rem;
    --tooltip-w: 28rem;
    /* Divider */
    --hr-mt: 2.5rem;
    --hr-mb: 2.5rem;
    --hr-border-default: oklch(0.94 0.0037 264.54); /* 237 239 242 */
}

@media (width <= 64rem) {
    :root {
        /* Card */
        --card-px: 1.5rem;
        --card-py: 1.5rem;
        /* Stepper */
        --stepper-container-px: 1rem;
        --stepper-container-py: 1rem;
    }
}

@supports (-webkit-appearance: none) {
    input.orderflow-phone-input {
        height: 46px;
    }
}

.agreement-control p,
.product-question-control p {
    font-size: var(--default-font-size);
}

.agreement-control.agreement-control--info p:last-child {
    font-size: var(--default-font-size);
    display: inline;
}
.agreement-control.agreement-control--info + button {
    position: relative;
    top: 0.25rem;
}

.agreement-control a,
.product-question-control a {
    color: var(--green);
    text-decoration: underline;
}

.agreement-control ul,
.product-question-control ul,
.agreement-control ol,
.product-question-control ol {
    padding-left: 1.75rem;
}

.agreement-control--contract-summary h1 {
    display: inline-block;
    margin-bottom: 1rem;
}

.agreement-control:not(.agreement-control--contract-summary) > h2 + ul {
    margin-top: 1.5rem;
}

.agreement-control:not(.agreement-control--contract-summary) ul li:has(> a)::marker {
    color: var(--green);
}

.agreement-control ul > li,
.product-question-control ul > li {
    list-style-type: disc;
}

.agreement-control ol > li,
.product-question-control ol > li {
    list-style-type: decimal;
}

.agreement-control h1,
.agreement-control h2,
.agreement-control h3,
.agreement-control h4,
.agreement-control h5,
.agreement-control h6,
.product-question-control h1,
.product-question-control h2,
.product-question-control h3,
.product-question-control h4,
.product-question-control h5,
.product-question-control h6 {
    font-weight: bold;
    color: var(--primary);
}

.agreement-control h1 {
    font-size: 1.5rem;
    font-family: var(--title-font);
}

.product-question-control h1 {
    font-size: 2em;
}

.product-question-control h2 {
    font-size: 1.5em;
}

.product-question-control h3 {
    font-size: 1.17em;
}

.product-question-control h4 {
    font-size: 1em;
}

.product-question-control h5 {
    font-size: 0.83em;
}

.product-question-control h6 {
    font-size: 0.67em;
}

.agreement-control--contract-summary {
    background-color: var(--bg-container);
    padding: 2rem 1.5rem;
    border-radius: 0.75rem;
}

.agreement-control--contract-summary h2 + p:not(:last-child) {
    margin-bottom: 1.5rem;
}

.agreement-control__toggle .agreement-control__toggle-content {
    display: none;
}

.agreement-control__toggle.agreement-control__toggle--open
    .agreement-control__toggle-content {
    display: block;
}

.agreement-control__toggle button svg {
    transition: transform 0.2s ease;
}

.agreement-control__toggle.agreement-control__toggle--open button svg {
    transform: rotate(90deg);
}

.logo {
    width: 100px;
    height: auto;
}

.postcode-form-container {
    margin: 1.5rem auto;
}
.form-container {
    padding: 3rem 1rem;
    margin: 0 auto;
}

.orderflow-calendar button:focus-visible,
.orderflow-single-select[aria-expanded="true"] {
    outline-width: var(--outline-width-focus-ring-width);
    outline-color: var(--focus-ring);
}

.orderflow-date-control > button {
    cursor: pointer;
    position: relative;
}

.orderflow-date-control > button::after {
    content: "";
    background: transparent;
    width: 100%;
    height: 200%;
    position: absolute;
    left: -25%;
    top: -50%;
}

.orderflow-date-control svg.fa-calendar {
    margin-top: -2px;
}

.orderflow-calendar [role="gridcell"][aria-disabled="true"] {
    font-size: var(--calendar-cell-font-size);
}

.orderflow-calendar-today,
.orderflow-calendar-selected {
    font-size: var(--calendar-cell-font-size);
}

.orderflow-calendar-today {
    color: var(--calendar-day-text-today);
}

.orderflow-calendar-today[aria-disabled="true"] {
    display: flex;
    color: var(--calendar-day-text-unavailable);
    border-color: var(--calendar-day-text-unavailable);
}

.orderflow-phone-input-dropdown {
    max-height: 450px !important;
}

.orderflow-phone-input-dropdown > div.w-full {
    height: fit-content !important;
}

.orderflow-phone-input-dropdown ul {
    height: calc(100% - 41px);
}

.orderflow-phone-input-dropdown .input-search-input {
    height: 41px !important;
}

.orderflow-phone-input-dropdown .input-search-input + button {
    top: 0.56rem;
}

.orderflow-phone-input-dropdown .input-search-input:focus,
.orderflow-phone-input-dropdown .input-search-input:focus-visible {
    outline-width: var(--outline-width-focus-ring-width) !important;
    outline-color: var(--focus-ring) !important;
}

.label-default-style {
    font-size: var(--label-font-size);
    color: var(--label-text-default);
    line-height: 1.5 !important;
}

.orderflow-button.orderflow-button--secondary {
    --button-border-width: 2px;
}

.orderflow-modal {
    overflow: hidden;
}

/* The overflow-hidden modal wrapper rounds via --modal-base-radius (0 by
   default for fullscreen). On sm+ the inner panel rounds to --modal-radius,
   so match the wrapper there to stop it square-clipping the panel's corners. */
@media (min-width: 640px) {
    .orderflow-modal {
        --modal-base-radius: var(--modal-radius);
    }
}

.orderflow-modal [slot="title"] > span:last-child svg {
    width: 24px;
    height: 24px;
}

.orderflow-modal .orderflow-modal-header button:focus-visible {
    outline-width: var(--outline-width-focus-ring-width);
    outline-color: var(--focus-ring);
}

.orderflow-link-btn {
    line-height: var(--button-leading);
    overflow: visible;
}

.orderflow-link-btn[data-focused="true"] {
    outline: none !important;
}

.orderflow-link-btn[data-focus-visible="true"] {
    outline: var(--focus-ring) solid var(--outline-width-focus-ring-width) !important;
    outline-offset: 8px !important;
}

input.orderflow-phone-input:-webkit-autofill,
input.orderflow-phone-input:-webkit-autofill:hover,
input.orderflow-phone-input:-webkit-autofill:focus,
input.orderflow-input:-webkit-autofill,
input.orderflow-input:-webkit-autofill:hover,
input.orderflow-input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px transparent inset;
    -webkit-text-fill-color: inherit;
    transition: background-color 5000s ease-in-out 0s;
}

.agreement-control--contract-summary > ul > li {
    margin-bottom: 1rem;
}

.orderflow-product-card .orderflow-button.orderflow-button--primary {
    --button-primary-bg: oklch(0.42 0.1243 264.05); /* 54 79 155 */
    --button-primary-bg-hover: oklch(0.38 0.1095 264.18); /* 42 62 130 */
    --button-primary-bg-pressed: oklch(0.42 0.1243 264.05); /* 54 79 155 */
    --button-primary-text: oklch(1 0 0); /* 255 255 255 */
    --color-btn-bg-primary: oklch(0.42 0.1243 264.05);
    --color-btn-bg-primary-hover: oklch(0.38 0.1095 264.18);
    --color-btn-bg-primary-pressed: oklch(0.42 0.1243 264.05);
    --color-btn-primary-text: oklch(1 0 0);
}

.orderflow-product-card .orderflow-button.orderflow-button--secondary:disabled {
    --button-disabled-bg: transparent;
    --button-disabled-text: var(--product-card-badge-text);
    --color-btn-bg-disabled: transparent;
    --color-btn-disabled-text: var(--product-card-badge-text);
}

@media (width >= 48rem) {
    .form-container {
        max-width: 48.125rem;
    }
}

.modal-cost-specification {
    scrollbar-width: none;
}

.modal-cost-specification::-webkit-scrollbar {
    display: none;
}
