:root {
  --ob-accent: #FF6473;
  --ob-accent-hover: #FF3E50;
  --ob-accent-subtle: rgba(255, 100, 115, 0.12);
  --ob-highlight: #000000;
  --ob-body-bg: #FFFFFF;
  --ob-surface: #F3F3F3;
  --ob-extra-grey: #626A6D;
  --ob-text: #000000;
  --ob-line: var(--ob-extra-grey);

  --ob-form-bg: #FFFFFF;
  --ob-form-active-bg: #FFFFFF;
  /* Dedicated focus fill: intentionally matches the #F3F3F3 action surface. */
  --ob-form-focus-bg: #F3F3F3;
  --ob-form-placeholder: rgba(0, 0, 0, 0.6);
  --ob-form-helper: #444444;
  --ob-form-readonly-bg: var(--ob-control-disabled-bg);
  --ob-form-readonly-border: var(--ob-control-disabled-border);
  --ob-form-error-bg: #ffebea;
  --ob-form-error-border: #C30000;
  --ob-form-error-text: #C30000;
  --ob-form-disabled-text: rgba(0, 0, 0, 0.6);
  --ob-form-disabled-border: transparent;
  --ob-form-active-border-width: 2px;
  --ob-form-item-radius: 8px;
  --ob-form-transition: 0.15s;
  --ob-control-hover: rgba(0, 0, 0, 0.08);
  --ob-control-active: rgba(0, 0, 0, 0.14);
  --ob-control-disabled-bg: #E5E5E5;
  --ob-control-disabled-border: rgba(0, 0, 0, 0.20);
  --ob-control-disabled-text: rgba(0, 0, 0, 0.60);
  --ob-control-border: #666666;
  /* Deliberately follows the design reference, not the Openbank pink accent. */
  --ob-radio-selected: #C30000;
  --ob-radio-border: #CCCCCC;
  --ob-radio-focus: #242424;
  --ob-control-success: #008A00;
  --ob-control-transition: 600ms;
  --ob-button-default: #242424;
  --ob-button-hover: #444444;
  --ob-button-pressed: #000000;
  --ob-button-light-text: #F3F3F3;
  --ob-button-secondary-hover-bg: #E5E5E5;
  --ob-button-disabled-bg: #CCCCCC;
  --ob-button-disabled-text: #FFFFFF;
  --ob-button-focus-ring: #000000;
  --ob-waterdrop-easing: linear(0, 0.0188, 0.0679, 0.1374, 0.2195, 0.308, 0.3978, 0.4856, 0.5686, 0.6452, 0.7142, 0.7753, 0.8283, 0.8735, 0.9113, 0.9423, 0.9671, 0.9866, 1.0014, 1.0123, 1.0198, 1.0247, 1.0274, 1.0283, 1.0281, 1.0268, 1.025, 1.0227, 1.0202, 1.0177, 1.0152, 1.0128, 1.0106, 1.0085, 1.0068, 1.0052, 1.0039, 1.0028, 1.0018, 1.0011, 1.0005, 1, 0.9997, 0.9995, 0.9993, 0.9992, 0.9993, 0.9995, 0.9997, 1);

  --ob-error-text: #C20000;
  --ob-warning-text: #C6000C;

  --ob-radius: 6px;
  --ob-spacing-xs: 5px;
  --ob-spacing-sm: 10px;
  --ob-spacing-md: 30px;
  --ob-spacing-lg: 50px;
  --ob-transition: 0.3s;
  --ob-link-easing: cubic-bezier(0.45, 0, 0.55, 1);
  --ob-overlay: rgba(111, 119, 121, 0.56);
  --ob-tooltip-border: #e5e5e5;
  --ob-tooltip-text: #222222;
  --ob-tooltip-shadow: rgba(163, 163, 163, 0.4);
  --ob-header-border-width: 3px;
  --ob-overlay-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
  /* Keep page content below the header, dialogs above it, and contact/loading layers topmost. */
  --ob-z-content: 1;
  --ob-z-header: 100;
  --ob-z-modal: 1030;
  --ob-z-contact-overlay: 1040;
  --ob-z-contact-sidebar: 1041;
  --ob-z-loading: 1050;

  --ob-font-headline: 'Openbank Display', Arial, sans-serif;
  --ob-font-text: 'Openbank', 'open_sans', sans-serif;
}

.theme-openbank {
  --ob-surface-brand: var(--ob-surface);
}