/* Copyright 2021 The Chromium Authors
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */

/* #css_wrapper_metadata_start
 * #type=vars
 * #import=//resources/ash/common/cr_elements/cr_shared_vars.css.js
 * #css_wrapper_metadata_end */

    html {
      /* Buttons */
      --oobe-button-radius: 16px;

      --oobe-back-button-padding-inline-end: 16px;
      --oobe-back-button-padding-inline-start: 12px;

      --oobe-next-button-padding-inline-end: 12px;
      --oobe-next-button-padding-inline-start: 16px;

      --oobe-button-icon-margin: 4px;

      --oobe-button-icon-size: 20px;

      --oobe-button-height: 32px;

      /* Fonts */
      --oobe-header-font-size: 28px;
      --oobe-header-line-height: 36px;
      --oobe-header-font-weight: 500; /* medium */

      --oobe-subheader-font-family: Roboto, sans-serif;
      --oobe-subheader-font-size: 14px;
      --oobe-subheader-line-height: 20px;

      --oobe-default-font-family: Roboto, sans-serif;
      --oobe-default-font-size: 14px;
      --oobe-default-line-height: 20px;

      --oobe-button-font-family: Roboto, sans-serif;
      --oobe-button-font-size: 13px;
      --oobe-button-font-weight: 500;

      --oobe-welcome-left-button-font-family: var(--oobe-button-font-family);
      --oobe-welcome-left-button-font-size: var(--oobe-button-font-size);
      --oobe-welcome-left-button-font-weight: var(--oobe-button-font-weight);

      --oobe-select-font-size: 13px;
      --oobe-select-line-height: 20px;

      --oobe-welcome-header-font-size: 36px;
      --oobe-welcome-header-font-weight: 500; /* medium */
      --oobe-welcome-header-line-height: 44px;

      --oobe-welcome-subheader-font-size: 24px;
      --oobe-welcome-subheader-line-height: 32px;

      --oobe-content-dialog-font-family: var(--oobe-default-font-family);
      --oobe-content-dialog-font-size: var(--oobe-default-font-size);
      --oobe-content-dialog-font-weight: var(--oobe-default-font-weight);
      --oobe-content-dialog-line-height: var(--oobe-default-line-height);

      --oobe-modal-dialog-header-font-family: var(--oobe-default-font-family);
      --oobe-modal-dialog-header-font-size:
          var(--oobe-modal-dialog-header-font-size);
      --oobe-modal-dialog-header-font-weight:
          var(--oobe-modal-dialog-header-font-weight);

      --oobe-modal-dialog-content-font-family: var(--oobe-default-font-family);
      --oobe-modal-dialog-content-font-size: var(--oobe-default-font-size);
      --oobe-modal-dialog-content-font-weight: var(--oobe-default-font-weight);
      --oobe-modal-dialog-content-line-height: var(--oobe-default-line-height);

      --oobe-sync-consent-list-item-title-font-size: 14px;
      --oobe-sync-consent-list-item-title-font-weight: 500;
      --oobe-sync-consent-list-item-title-line-height: 24px;

      --oobe-sync-consent-card-title-font: var(--cros-headline-1-font);
      --oobe-sync-consent-card-subtitle-font: var(--cros-body-1-font);
      --oobe-sync-consent-tooltip-text-font: var(--cros-body-2-font);

      --oobe-hw-data-collection-usage-line-height: 18px;

      --oobe-smart-privacy-item-title-font-size: 14px;
      --oobe-smart-privacy-item-title-font-weight: 500; /* roboto-medium */
      --oobe-smart-privacy-item-title-line-height: 24px;

      --oobe-enable-debugging-font-size: 12px;

      --oobe-demo-preferences-selection-title-font-size: 13px;
      --oobe-demo-preferences-number-input-font-size: 10px;

      --oobe-gesture-navigation-list-item-font-size: 15px;

      --oobe-encryption-migration-warning-line-height: 22px;

      --oobe-reset-firmware-update-line-height: 20px;

      --oobe-guest-tos-terms-title-font-family: var(--oobe-header-font-family);
      --oobe-guest-tos-terms-title-font-size: 18px;
      --oobe-guest-tos-terms-title-font-weight: var(--oobe-header-font-weight);
      --oobe-guest-tos-terms-title-line-height: 24px;

      --oobe-consolidated-consent-terms-title-font-family:
          var(--oobe-header-font-family);
      --oobe-consolidated-consent-terms-title-font-size: 18px;
      --oobe-consolidated-consent-terms-title-font-weight:
          var(--oobe-header-font-weight);
      --oobe-consolidated-consent-terms-title-line-height: 24px;

      --oobe-optin-row-font-size: 13px;

      --oobe-optin-title-font-family: var(--oobe-default-font-family);
      --oobe-optin-title-font-weight: var(--oobe-header-font-weight);

      --oobe-autolaunch-app-name-font-size: 22px;

      /* Select */
      --oobe-select-height: 32px;

      /* Dialog */
      --oobe-adaptive-dialog-icon-size: 32px;
      --oobe-adaptive-dialog-icon-fill-color: var(--cros-icon-color-blue);

      /* Welcome screen */
      --selection-entry-height: 60px;
      --a11y-option-height: 64px;

      /* Network screen */
      --oobe-network-row-height: 48px;
    }

    html.jelly-enabled {
      /* Fonts */
      --oobe-default-font-family: var(--cros-body-2-font-family);
      --oobe-default-font-size: var(--cros-body-2-font-size);
      --oobe-default-font-weight: var(--cros-body-2-font-weight);
      --oobe-default-line-height: var(--cros-body-2-line-height);

      --oobe-header-font-size: var(--cros-display-3_regular-font-size);
      --oobe-header-line-height: var(--cros-display-3_regular-line-height);
      --oobe-header-font-weight: var(--cros-display-3_regular-font-weight);
      --oobe-header-font-family: var(--cros-display-3_regular-font-family);

      --oobe-subheader-font-family: var(--cros-body-0-font-family);
      --oobe-subheader-font-size: var(--cros-body-0-font-size);
      --oobe-subheader-line-height: var(--cros-body-0-line-height);
      --oobe-subheader-font-weight: var(--cros-body-0-font-weight);

      --oobe-content-dialog-font-family: var(--oobe-default-font-family);
      --oobe-content-dialog-font-size: var(--oobe-default-font-size);
      --oobe-content-dialog-font-weight: var(--oobe-default-font-weight);
      --oobe-content-dialog-line-height: var(--oobe-default-line-height);

      --oobe-modal-dialog-header-font-family: var(--cros-display-7-font-family);
      --oobe-modal-dialog-header-font-size: var(--cros-display-7-font-size);
      --oobe-modal-dialog-header-font-weight: var(--cros-display-7-font-weight);
      --oobe-modal-dialog-header-line-height: var(--cros-display-7-line-height);

      --oobe-modal-dialog-content-font-family: var(--cros-body-1-font-family);
      --oobe-modal-dialog-content-font-size: var(--cros-body-1-font-size);
      --oobe-modal-dialog-content-font-weight: var(--cros-body-1-font-weight);
      --oobe-modal-dialog-content-line-height: var(--cros-body-1-line-height);

      --oobe-sync-consent-list-item-title-font-size:
          var(--oobe-default-font-size);
      --oobe-sync-consent-list-item-title-font-weight:
          var(--oobe-default-font-weight);
      --oobe-sync-consent-list-item-title-line-height:
          var(--oobe-default-line-height);

      --oobe-sync-consent-card-title-font: var(--cros-button-1-font);
      --oobe-sync-consent-card-subtitle-font: var(--cros-annotation-1-font);
      --oobe-sync-consent-tooltip-text-font: var(--cros-body-2-font);

      --oobe-button-font-family: var(--cros-button-2-font-family);
      --oobe-button-font-size: var(--cros-button-2-font-size);
      --oobe-button-font-weight: var(--cros-button-2-font-weight);

      --oobe-welcome-left-button-font-family: var(--cros-body-0-font-family);
      --oobe-welcome-left-button-font-size: var(--cros-body-0-font-size);
      --oobe-welcome-left-button-font-weight: var(--cros-body-0-font-weight);

      --oobe-hw-data-collection-usage-line-height:
          var(--oobe-default-line-height);

      --oobe-smart-privacy-item-title-font-size: var(--cros-button-1-font-size);
      --oobe-smart-privacy-item-title-font-weight:
          var(--cros-button-1-font-weight);
      --oobe-smart-privacy-item-title-line-height:
          var(--cros-button-1-line-height);

      --oobe-enable-debugging-font-size: var(--oobe-default-font-size);

      --oobe-demo-preferences-selection-title-font-size:
          var(--oobe-default-font-size);
      --oobe-demo-preferences-number-input-font-size:
          var(--cros-annotation-2-font-size);

      --oobe-gesture-navigation-list-item-font-size:
          var(--cros-body-1-font-size);

      --oobe-encryption-migration-warning-line-height:
          var(--oobe-default-line-height);

      --oobe-reset-firmware-update-line-height: var(--oobe-default-line-height);

      --oobe-guest-tos-terms-title-font-family:
          var(--cros-button-2-font-family);
      --oobe-guest-tos-terms-title-font-size:
          var(--cros-button-2-font-size);
      --oobe-guest-tos-terms-title-font-weight:
          var(--cros-button-2-font-weight);
      --oobe-guest-tos-terms-title-line-height:
          var(--cros-button-2-line-height);

      --oobe-consolidated-consent-terms-title-font-family:
          var(--cros-button-2-font-family);
      --oobe-consolidated-consent-terms-title-font-size:
          var(--cros-button-2-font-size);
      --oobe-consolidated-consent-terms-title-font-weight:
          var(--cros-button-2-font-weight);
      --oobe-consolidated-consent-terms-title-line-height:
          var(--cros-button-2-line-height);

      --oobe-optin-row-font-size: var(--oobe-default-font-size);

      --oobe-optin-title-font-family: var(--cros-button-2-font-family);
      --oobe-optin-title-font-weight: var(--cros-button-2-font-weight);

      --oobe-welcome-header-font-size: var(--cros-display-0-font-size);
      --oobe-welcome-header-font-weight: 400; /* regular */
      --oobe-welcome-header-line-height: var(--cros-display-0-line-height);

      --oobe-welcome-subheader-font-size:
          var(--cros-display-6_regular-font-size);
      --oobe-welcome-subheader-line-height:
          var(--cros-display-6_regular-line-height);

      --oobe-text-color: var(--cros-sys-on_surface);
      --oobe-text-color-secondary: var(--cros-sys-on_surface_variant);
      --oobe-header-text-color: var(--oobe-text-color);
      --oobe-subheader-text-color: var(--oobe-text-color-secondary);

      --oobe-autolaunch-app-name-font-size: var(--cros-button-1-font-size);

      --oobe-touchpad-scroll-font-size: var(--cros-button-1-font-size);
      --oobe-touchpad-scroll-font-weight: var(--cros-button-1-font-weight);
      --oobe-touchpad-scroll-line-height: var(--cros-button-1-line-height);

      --oobe-drive-pinning-title-font-family: var(--cros-button-2-font-family);
      --oobe-drive-pinning-title-font-size: var(--cros-button-2-font-size);
      --oobe-drive-pinning-title-font-weight: var(--cros-button-2-font-weight);
      --oobe-drive-pinning-title-line-height: var(--cros-button-2-line-height);

      --oobe-drive-pinning-subtitle-font-family:
          var(--oobe-default-font-family);
      --oobe-drive-pinning-subtitle-font-size:
          var(--oobe-default-font-size);
      --oobe-drive-pinning-subtitle-font-weight:
          var(--oobe-default-font-weight);
      --oobe-drive-pinning-subtitle-line-height:
          var(--oobe-default-line-height);

      --oobe-security-token-pin-font-family:
          var(--cros-annotation-1-font-family);
      --oobe-security-token-pin-font-size: var(--cros-annotation-1-font-size);
      --oobe-security-token-pin-font-weight:
          var(--cros-annotation-1-font-weight);
      --oobe-security-token-pin-line-height:
          var(--cros-annotation-1-line-height);

      --oobe-marketing-opt-in-legal-title-font-family:
          var(--cros-button-2-font-family);
      --oobe-marketing-opt-in-legal-title-font-size:
          var(--cros-button-2-font-size);
      --oobe-marketing-opt-in-legal-title-font-weight:
          var(--cros-button-2-font-weight);
      --oobe-marketing-opt-in-legal-title-line-height:
          var(--cros-button-2-line-height);

      --oobe-marketing-opt-in-legal-info-font-family:
          var(--oobe-default-font-family);
      --oobe-marketing-opt-in-legal-info-font-size:
          var(--oobe-default-font-size);
      --oobe-marketing-opt-in-legal-info-font-weight:
          var(--oobe-default-font-weight);
      --oobe-marketing-opt-in-legal-info-line-height:
          var(--oobe-default-line-height);

      --oobe-apps-list-app-title-font-family:
          var(--cros-button-1-font-family);
      --oobe-apps-list-app-title-font-size:
          var(--cros-button-1-font-size);
      --oobe-apps-list-app-title-font-weight:
          var(--cros-button-1-font-weight);
      --oobe-apps-list-app-title-line-height:
          var(--cros-button-1-line-height);

      --oobe-apps-list-secondary-text-font-family:
          var(--cros-annotation-1-font-family);
      --oobe-apps-list-secondary-text-font-size:
          var(--cros-annotation-1-font-size);
      --oobe-apps-list-secondary-text-font-weight:
          var(--cros-annotation-1-font-weight);
      --oobe-apps-list-secondary-text-line-height:
          var(--cros-annotation-1-line-height);

      --oobe-network-select-login-font-family:
          var(--cros-button-2-font-family);
      --oobe-network-select-login-font-size:
          var(--cros-button-2-font-size);
      --oobe-network-select-login-font-weight:
          var(--cros-button-2-font-weight);
      --oobe-network-select-login-line-height:
          var(--cros-button-2-line-height);

      /* Dialog */
      --oobe-adaptive-dialog-icon-size: 48px;
      --oobe-adaptive-dialog-icon-fill-color: var(--cros-sys-primary);

      /* Button Color */
      --oobe-button-icon-fill-color-bg-transparent: var(--cros-sys-primary);
      --oobe-icon-button-text-color-bg-transparent:
          var(--cros-sys-on_surface_variant);
    }

    html.boot-animation-enabled {
      --oobe-welcome-header-font-size:
          var(--cros-display-0_regular-font-size);
      --oobe-welcome-header-font-weight:
          var(--cros-display-0_regular-font-weight);
      --oobe-welcome-header-line-height:
          var(--cros-display-0_regular-line-height);
    }