/*
 * Path: /databass/css/000-core.css
 * ------------------------------------------------------------
 * Global variables, colours, typography, shadows and z-indexes
 */

:root {

  /* ----------------------------------------------------------
   * Colours
   * -------------------------------------------------------- */

  /* Primary */
  --databass-color-primary: #f368e0;
  --databass-color-primary-25pc: #f368e025;
  --databass-color-primary-50pc: #f368e050;
  --databass-color-primary-75pc: #f368e075;

  /* Secondary */
  --databass-color-secondary: #ffeafc;

  /* White / Grey / Black palette */
  --databass-color-white: #ffffff;

  --databass-color-grey1: #f5f5f5;
  --databass-color-grey2: #d0d0d0;
  --databass-color-grey3: #aaaaaa;
  --databass-color-grey4: #808080;
  --databass-color-grey5: #505050;
  --databass-color-grey6: #0e0e0e;

  --databass-color-black: #000000;
  --databass-color-black-25pc: rgba(0, 0, 0, 0.25);
  --databass-color-black-50pc: rgba(0, 0, 0, 0.5);
  --databass-color-black-75pc: rgba(0, 0, 0, 0.75);

  /* Text */
  --databass-color-text: var(--databass-color-grey6);

  /* Backgrounds */
  --databass-bg1: linear-gradient(
    -30deg,
    var(--databass-color-secondary),
    var(--databass-color-white)
  );

  /* ----------------------------------------------------------
   * Borders / Radius
   * -------------------------------------------------------- */
  --databass-border-radius: 8px;
  --databass-border-color-primary: 1px solid var(--databass-color-primary);
  --databass-border-color-secondary: 1px solid var(--databass-color-secondary);

  /* ----------------------------------------------------------
   * Shadows
   * -------------------------------------------------------- */
  --databass-shadow-button: 0 1px 3px var(--databass-color-grey2);
  --databass-shadow-table: 0 2px 6px var(--databass-color-grey2);
  --databass-shadow-popup: 0 2px 12px var(--databass-color-grey2);

  /* Inset Shadows */
  --databass-shadow-inset-field:
    inset 0 0 6px var(--databass-color-primary-75pc),
    inset 0 0 3px var(--databass-color-primary-75pc);

  /* ----------------------------------------------------------
   * Fonts
   * -------------------------------------------------------- */
  --databass-font-family:
    -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Helvetica, Arial, sans-serif;

  /* ----------------------------------------------------------
   * Z-Index Scale
   * -------------------------------------------------------- */
  --databass-z-base:       100;
  --databass-z-header:     3000;
  --databass-z-backdrop:   5500;
  --databass-z-dropdown:   5000;
  --databass-z-panel:      6000;
  --databass-z-tooltip:    6500;
  --databass-z-modal:      7000;
  --databass-z-debug:      9999;
}