@import './components/buttons.styles.css';
@import './components/link.styles.css';
@import './components/base.styles.css';
@import './components/input.styles.css';
@import './components/radio.styles.css';
@import './components/overlay.styles.css';
@import './components/checkbox.styles.css';

:root {
  /* Surface Colors */
  --mds-surface-01: #f2f3f5;
  --mds-surface-02: #ffffff;
  --mds-surface-03: #f2f3f5;
  --mds-surface-04: #dfe0e6;
  --mds-surface-05: var(--mds-surface-navigation);
  --mds-surface-navigation: #001122;
  --mds-surface-scrim: #000000b2;

  /* Text Colors */
  --mds-text-heading: #001e3c;
  --mds-text-primary: var(--mds-text-heading);
  --mds-text-body-copy: #3e414f;
  --mds-text-secondary: var(--mds-text-body-copy);
  --mds-text-subtle: #6c718a;
  --mds-text-tertiary: var(--mds-text-subtle);
  --mds-text-confirmation: #167b3d;
  --mds-text-notice: #ab5300;
  --mds-text-alert: #c01933;
  --mds-text-link: #0066cc;
  --mds-text-disabled: #80859c;
  --mds-text-inverse: #ffffff;
  --mds-text-reverse: #ffffff;

  /* Button Colors */
  --mds-button-focus: var(--mds-stroke-03);
  --mds-button-primary: #e01933;
  --mds-button-primary-hover: #ad1834;
  --mds-button-primary-pressed: #661024;
  --mds-button-primary-disabled: #caccd6;
  --mds-button-secondary: #001e3c;
  --mds-button-secondary-hover: #003366;
  --mds-button-secondary-pressed: #001e3c;
  --mds-button-secondary-disabled: #c0c2cd;
  --mds-button-inverse: #ffffff;

  /* Support Colors */
  --mds-support-surface-confirmation: #e7fbee;
  --mds-support-surface-notice: #ffe9d4;
  --mds-support-surface-alert: #fce3e5;
  --mds-support-surface-information: #d4e7fa;

  /* Fill Colors */
  --mds-fill-primary: #001e3c;
  --mds-fill-secondary: #6c718a;
  --mds-fill-tertiary: #d5d6de;
  --mds-fill-highlight-01: #003366;
  --mds-fill-highlight-02: #0057ad;
  --mds-fill-highlight-03: #d4e7fa;
  --mds-fill-confirmation: #167b3d;
  --mds-fill-notice: #cc6400;
  --mds-fill-alert: #c01933;
  --mds-fill-information: #0066cc;
  --mds-fill-inverse: #ffffff;

  /* Icon Colors */
  --mds-icon-primary: #001e3c;
  --mds-icon-secondary: #6c718a;
  --mds-icon-confirmation: #167b3d;
  --mds-icon-notice: #ab5300;
  --mds-icon-alert: #c01933;
  --mds-icon-link: #0066cc;
  --mds-icon-disabled: #80859c;
  --mds-icon-inverse: #ffffff;
  --mds-icon-reverse: #ffffff;

  /* Stroke Colors */
  --mds-stroke-01: #dfe0e6;
  --mds-stroke-02: #aaadbd;
  --mds-stroke-03: #80859c;
  --mds-stroke-04: #001e3c;
  --mds-stroke-confirmation: #167b3d;
  --mds-stroke-notice: #ab5300;
  --mds-stroke-alert: #c01933;
  --mds-stroke-information: #0066cc;
  --mds-stroke-inverse: #ffffff;

  /* Brand Colors */
  --mds-brand-blue: #003366;
  --mds-brand-red: #c01933;
  --mds-brand-light-red: #e01933;
  --mds-brand-dark-red: #991933;

  /* Seat Map Colors */
  --mds-seat-map-aircraft-01: #dfe0e6;
  --mds-seat-map-aircraft-02: #c0c2cd;
  --mds-seat-map-aircraft-03: #d5d6de;
  --mds-seat-map-aircraft-04: #caccd6;
  --mds-seat-map-aircraft-05: #f2f3f5;
  --mds-seat-map-selected-seat: #167b3d;

  /* Loyalty Surface Colors */
  --mds-loyalty-surface-member-primary: #3e56aa;
  --mds-loyalty-surface-member-secondary: #2a3a73;
  --mds-loyalty-surface-silver-primary: #55616c;
  --mds-loyalty-surface-silver-secondary: #3a434a;
  --mds-loyalty-surface-gold-primary: #8f6c32;
  --mds-loyalty-surface-gold-secondary: #6c4f26;
  --mds-loyalty-surface-platinum-primary: #635682;
  --mds-loyalty-surface-platinum-secondary: #483e5d;
  --mds-loyalty-surface-diamond-primary: #4c738e;
  --mds-loyalty-surface-diamond-secondary: #385468;
  --mds-loyalty-surface-delta-360-primary: #38393b;
  --mds-loyalty-surface-delta-360-secondary: #101011;

  /* Loyalty Gradient Colors */
  --mds-loyalty-gradients-dm-member: linear-gradient(
    63deg,
    #2a3a73 22.21%,
    #5970c2 78.01%
  );
  --mds-loyalty-gradients-dm-silver: linear-gradient(
    64deg,
    #454f58 22.11%,
    #5e6b77 78.02%
  );
  --mds-loyalty-gradients-dm-gold: linear-gradient(
    66deg,
    #6c4f26 22.1%,
    #ac8545 78.13%
  );
  --mds-loyalty-gradients-dm-platinum: linear-gradient(
    65deg,
    #483e5d 22.15%,
    #726394 78.01%
  );
  --mds-loyalty-gradients-dm-diamond: linear-gradient(
    63deg,
    #385468 22.15%,
    #648eac 78.02%
  );
  --mds-loyalty-gradients-dm-delta-360: linear-gradient(
    63deg,
    #101011 22.13%,
    #47494c 78.05%
  );

  /* Loyalty Text Colors */
  --mds-loyalty-text-member-text: #4660bc;
  --mds-loyalty-text-silver-text: #5e6b77;
  --mds-loyalty-text-gold-text: #ac8545;
  --mds-loyalty-text-platinum-text: #726394;
  --mds-loyalty-text-diamond-text: #648eac;
  --mds-loyalty-text-delta-360-text: #575a5d;

  /* Product Surface Colors */
  --mds-product-basic-primary: #5e75b1;
  --mds-product-basic-secondary: #374872;
  --mds-product-main-primary: #4e67d5;
  --mds-product-main-secondary: #1f3285;
  --mds-product-comfort-primary: #0879cf;
  --mds-product-comfort-secondary: #054c81;
  --mds-product-premium-first-primary: #d9105b;
  --mds-product-premium-first-secondary: #880a39;
  --mds-product-delta-one-primary: #ac17bf;
  --mds-product-delta-one-secondary: #410948;
  --mds-product-skypriority-primary: #eb0000;
  --mds-product-skypriority-secondary: #a30000;

  /* Product Gradient Colors */
  --mds-product-gradients-dm-basic: linear-gradient(
    134deg,
    #324067 14.06%,
    #5e75b1 100%
  );
  --mds-product-gradients-dm-main: linear-gradient(
    313deg,
    #4e67d5 0%,
    #1f3285 85.94%
  );
  --mds-product-gradients-dm-comfort: linear-gradient(
    135deg,
    #054c81 13.97%,
    #0879cf 100%
  );
  --mds-product-gradients-dm-premium-first: linear-gradient(
    135deg,
    #880a39 13.91%,
    #d9105b 100%
  );
  --mds-product-gradients-dm-delta-one: linear-gradient(
    135deg,
    #4b0a54 13.92%,
    #ac17bf 100%
  );
  --mds-product-gradients-dm-skypriority: linear-gradient(
    134deg,
    #950000 13.89%,
    #eb0000 100%
  );

  /* Product Text Colors */
  --mds-product-text-basic-text: #425689;
  --mds-product-text-main-text: #4e67d5;
  --mds-product-text-comfort-text: #0762a8;
  --mds-product-text-premium-first-text: #d9105b;
  --mds-product-text-delta-one-text: #ac17bf;
  --mds-product-text-skypriority-text: #d90000;

  /* Shadows */
  --mds-shadow-01: 0rem 0.0625rem 0.0625rem 0rem rgba(0, 45, 89, 0.12);
  --mds-shadow-02: 0rem 0.3315rem 0.193375rem 0rem rgba(0, 45, 89, 0.02),
    0rem 0.138125rem 0.138125rem 0rem rgba(0, 45, 89, 0.04),
    0rem 0.027625rem 0.082875rem 0rem rgba(0, 45, 89, 0.06);
  --mds-shadow-03: 0rem 2.375rem 1.4375rem 0rem rgba(0, 45, 89, 0.02),
    0rem 1.0625rem 1.0625rem 0rem rgba(0, 45, 89, 0.03),
    0rem 0.25rem 0.5625rem 0rem rgba(0, 45, 89, 0.05);
  --mds-shadow-04: 0rem -2.375rem 1.4375rem 0rem rgba(0, 45, 89, 0.02),
    0rem -1.0625rem 1.0625rem 0rem rgba(0, 45, 89, 0.03),
    0rem -0.25rem 0.5625rem 0rem rgba(0, 45, 89, 0.05);

  --mds-shadow-small-card: 0rem 0.125rem 0.25rem 0rem rgba(7, 11, 36, 0.15);
  --mds-shadow-large-card: 0rem 0.125rem 0.125rem 0rem rgba(7, 11, 36, 0.1);
  --mds-shadow-bottom-sheet: 0rem -0.25rem 1rem 0rem rgba(7, 11, 36, 0.15);
  --mds-shadow-modal: 0rem 1.5rem 1.5rem 0rem rgba(7, 11, 36, 0.2);
  --mds-shadow-tooltip: 0rem 0.0625rem 0.5rem 0rem rgba(7, 11, 36, 0.15);
  --mds-shadow-dropdown-menu: 0rem 0.125rem 0.25rem 0rem rgba(7, 11, 36, 0.2);
  --mds-shadow-side-sheet: 0rem 0.25rem 1.5rem 0rem rgba(7, 11, 36, 0.2);

  /* Strokes */
  --mds-stroke-line: 0.0625rem solid var(--mds-stroke-03);
  --mds-stroke-border: 0.125rem solid var(--mds-stroke-03);
  --mds-stroke-indicator: 0.1875rem solid var(--mds-stroke-03);
  --mds-stroke-card-accent: 0.1875rem solid var(--mds-stroke-03);
  --mds-stroke-button: 0.125rem solid var(--mds-stroke-03);
  --mds-stroke-badge: 0.125rem solid var(--mds-stroke-03);

  /* Radius */
  --mds-radius-xs: 0.125rem; /* 2px */
  --mds-radius-sm: var(--mds-radius-01); /* 4px */
  --mds-radius-md: var(--mds-radius-03); /* 8px */
  --mds-radius-lg: 0.75rem; /* 12px */
  --mds-radius-xl: 1rem; /* 16px */
  --mds-radius-xxl: 2rem; /* 32px */
  --mds-radius-01: 0.25rem;
  --mds-radius-02: 0.375rem;
  --mds-radius-03: 0.5rem;

  /* Component Radius */
  --mds-radius-card: var(--mds-radius-sm);
  --mds-radius-button: var(--mds-radius-sm);
  --mds-radius-checkbox: var(--mds-radius-03);
  --mds-radius-picker: var(--mds-radius-md);
  --mds-radius-sheet: var(--mds-radius-lg) var(--mds-radius-lg)
    var(--mds-radius-none) var(--mds-radius-none);

  /* Opacity */
  --mds-opacity-image-overlay: 0.2;
  --mds-opacity-scrim: 0.7;
  --mds-opacity-badge: 0.5;
  --mds-opacity-pop-up: var(--mds-opacity-blur-overlay);
  --mds-opacity-blur-overlay: 0.4;
}
