/* Common CSS variables */
:root {
  --default-body-font-size: 1.4rem;
  --large-font-size: 120%;
  --small-font-size: 80%;
  --default-font-size: 1rem;
  --priority-font-size: 1.4rem;

    /* AxonIvy Colors: */
  --ivy-primary-color-black: hsl(0, 0%, 11%);
  --ivy-primary-color-white: hsl(0, 0%, 100%);
  --ivy-primary-color-dark: var(--primary-color);
  --ivy-primary-color-medium: hsl(192, 63%, 56%);
  --ivy-primary-color-light: hsl(186, 63%, 73%);
  --ivy-primary-color-grey-dark: hsl(0, 1%, 34%);
  --ivy-primary-color-grey-medium: hsl(180, 1%, 61%);
  --ivy-primary-color-grey-light: hsl(180, 1%, 85%);
  --ivy-primary-color-grey-pale: hsl(180, 5%, 96%);
  --ivy-primary-color-grey-basic: hsl(180, 9%, 98%);
  --ivy-secondary-color-dark: hsl(62, 61%, 44%);
  --ivy-secondary-color-medium: hsl(64, 70%, 49%);
  --ivy-secondary-color-light: hsl(65, 78%, 54%);
  --ivy-tertinary-color-red-dark: hsl(0, 63%, 52%);
  --ivy-tertinary-color-red-medium: hsl(357, 83%, 61%);
  --ivy-tertinary-color-red-light: hsl(0, 90%, 88%);
  --ivy-tertinary-color-green-dark: hsl(164, 59%, 40%);
  --ivy-tertinary-color-green-medium: hsl(137, 51%, 53%);
  --ivy-tertinary-color-green-light: hsl(79, 65%, 78%);
  --ivy-tertinary-color-yellow-dark: hsl(46, 100%, 58%);
  --ivy-tertinary-color-yellow-medium: hsl(49, 99%, 65%);
  --ivy-tertinary-color-yellow-light: hsl(47, 100%, 79%);

  /* Colors for Portal */
  --ivy-portal-blue-light: #90DDE9;
  --ivy-portal-blue-dark: #007095;
  --ivy-portal-color-black: #1B1B1B;
  --ivy-portal-color-gray-dark: #565656;

  /* Default Portal styles */
  --header-font-size: 2rem;
  --portal-icon-font-family: "StreamlineIcons";
  --portal-icon-font-size: 1em;
  --portal-icon-line-height: 1;
  --portal-icon-ui-icon-font-size: 1.4rem;
  --default-font-style: normal;
  --login-logo-height: 50px;
  --home-logo-height: 42px;
  --home-logo-width: calc(100% - 72px);
  --small-home-logo-width: 42px;
  --border-color: var(--ivy-primary-color-grey-light);
  --body-background-color: var(--ivy-primary-color-white);
  --accordion-header-active-background-color: var(--ivy-primary-color-grey-light);
  --accordion-header-background-color: var(--ivy-primary-color-grey-light);
  --case-task-state-done-or-resume-green: #4eb41c;
  --box-shadow-color: hsla(0, 0%, 15%, 0.2);
  --portal-border-radius: 5px;
  --item-background-hover: rgba(144, 221, 233, 0.24);
  --item-border-hover: 1px solid #90DDE9;

  --top-bar-icon-size: 1.4rem;
  --topbar-bg-color: var(--primary-color);
  --first-header-bar-color: var(--topbar-bg-color);
  --second-header-bar-color: var(--topbar-bg-color);
  --third-header-bar-color: var(--topbar-bg-color);

  /* Task priority color */
  --task-priority-low-color: #d4d4d4;
  --task-priority-normal-color: #96dc82;
  --task-priority-high-color: #ffc0c0;
  --task-priority-exception-color: #ff5a5a;

  /* Text color of buttons */
  --cancel-button-text-color: var(--ivy-primary-color-black);
  --context-button-text-color: var(--ivy-primary-color-black);

  --task-state-reserved-font-size: 1.8rem;
  --task-state-system-font-size: 1.8rem;
  --portal-dialog-icon-font-size: 5rem;
  --widget-header-font-size: var(--large-font-size);
  --widget-header-font-weight: bold;
  --process-warning-icon-font-weight: bold;
  --process-icon-font-size: 1.5rem;
  --process-grid-icon-font-size: 4.8rem;
  --process-grid-name-font-size: 1.8rem;
  --process-grid-name-font-weight: 700;
  --process-edit-name-font-size: 1.6rem;
  --process-edit-name-font-weight: 700;
  --process-grid-header-color: var(--text-color);

  --case-item-name-font-weight: bold;
  --case-item-description-font-weight: 400;
  --case-item-description-font-style: normal;
  --case-item-description-font-size: 1.4.rem;
  --case-item-description-font-size: var(--small-font-size);
  --case-item-description-line-height: 1.6rem;
  --case-item-name-line-height: 2rem;
  --case-item-name-font-weight: 700;

  --task-item-description-font-size: var(--small-font-size);
  --task-item-description-line-height: 1.6rem;
  --task-item-name-line-height: 2rem;
  --task-item-name-font-weight: 700;
  --task-state-border-radius: 10px;
  --task-state-font-size: 0.9rem;
  --task-state-line-height: 1.6rem;

  --participants-list-header-font-weight: bold;
  --message-chat-header-name-font-weight: bold;
  --chat-contact-type-header-font-size: var(--large-font-size);
  --close-chat-font-size: 1.4rem;
  --contact-card-icon-font-size: 2rem;
  --contact-card-icon-after-fontsize: 1.2rem;
  --notification-badge-font-size: 1.2rem;
  --notification-badge-icon-font-size: 2rem;

  --delete-deputy-icon-font-size: var(--large-font-size);
  --express-import-status-font-weight: bold;
  --express-helper-loading-container-si-lg-font-size: 1.2em;

  --no-item-icon-font-size: 8rem;
  --no-item-header-font-size: 2rem;
  --breadcrumb-font-size: 1.2rem;
  --breadcrumb-home-icon-font-size: 2rem;
  
  --security-member-header-font-size: 12px;
  --security-member-item-font-size: 10px;
  --security-member-header-font-weight: bold;

  --image-process-header-font-size: 12px;
  --process-info-icon-font-size: 4rem;
  --process-info-step-icon-font-size: 2rem;
  --widget-filter-noti-font-size: var(--small-font-size);
  --widget-filter-noti-font-weight: 700;

  --dashboard-table-column-small-screen-name-font-weight: bold;
  --dashboard-table-column-small-screen-description-font-weight: 400;
  --dashboard-table-column-small-screen-description-font-style: normal;
  --dashboard-table-column-small-screen-description-font-size: 1.4.rem;

  --new-widget-dialog-description-font-weight: 400;
  --new-widget-dialog-description-font-style: normal;
  --new-widget-dialog-description-font-size: 1.3rem;
  --dashboard-table-empty-message-icon-font-size: 6rem;
  --new-widget-dialog-title-font-weight: 700;
  --new-widget-dialog-title-font-style: normal;
  --new-widget-dialog-title-font-size: 1.4rem;

  /* News feed widget */
  --news-feed-item-border-radius: 1rem;
  --news-feed-item-title-line-height: 1rem;
  --news-feed-item-title-font-weight: bold;
}