@charset "UTF-8";

@import url("./trialive-colors.css");

/**
 * Trialive colored v2 theme colors.
 * Strong brand treatment based on #415E97 and #93ABD5.
 */

:root {
  color-scheme: light;

  /* Trialive brand palette */
  --trialive-primary-1: #415E97;
  --trialive-primary-2: #415E97dd;
  --trialive-primary-3: #415E97aa;
  --trialive-primary-4: #415E9788;
  --trialive-primary-5: #415E9766;
  --trialive-primary-6: #415E9744;
  --trialive-primary-7: #415E9729;

  --trialive-secondary-1: #93ABD5;
  --trialive-secondary-2: #93ABD5dd;
  --trialive-secondary-3: #93ABD5af;
  --trialive-secondary-4: #93ABD58b;
  --trialive-secondary-5: #93ABD566;
  --trialive-secondary-6: #93ABD53b;
  --trialive-secondary-7: #93ABD529;

  /* Neutral palette with a clearly visible brand tint */
  --trialive-transparent: #ffffff00;
  --trialive-white: #ffffff;
  --trialive-black: #000000;
  --trialive-canvas: #dce6f4;
  --trialive-surface: #ffffff;
  --trialive-surface-raised: #ffffff;
  --trialive-surface-subtle: #e5ecf7;
  --trialive-surface-muted: #d0dced;
  --trialive-surface-pressed: #b9cae2;
  --trialive-surface-glass: #eef3faf5;
  --trialive-surface-glass-strong: #e5edf8f8;
  --trialive-text-1: #17233b;
  --trialive-text-2: #2f405f;
  --trialive-text-3: #58677e;
  --trialive-text-disabled: #8793a5;
  --trialive-text-inverse: #ffffff;
  --trialive-border-subtle: #c7d5e8;
  --trialive-border: #a9bdd9;
  --trialive-border-strong: #7895bf;
  --trialive-divider: #c2d1e5;
  --trialive-overlay: #17233b73;
  --trialive-overlay-soft: #17233b33;

  /* Semantic states */
  --trialive-info: #315a93;
  --trialive-info-bg: #cfe0f5;
  --trialive-info-border: #7296c5;
  --trialive-success: #287a43;
  --trialive-success-strong: #1f6536;
  --trialive-success-bg: #d8f0df;
  --trialive-success-border: #72b787;
  --trialive-warning: #8c5900;
  --trialive-warning-bg: #ffedc4;
  --trialive-warning-border: #d2a84d;
  --trialive-danger: #bd3732;
  --trialive-danger-strong: #922a27;
  --trialive-danger-bg: #ffdcd9;
  --trialive-danger-border: #dc807a;
  --trialive-highlight: #ffe897;

  /* Component color roles */
  --trialive-link: var(--trialive-primary-1);
  --trialive-link-hover: var(--trialive-primary-2);
  --trialive-focus: var(--trialive-primary-1);
  --trialive-focus-ring: var(--trialive-secondary-5);
  --trialive-control-bg: var(--trialive-surface);
  --trialive-control-hover-bg: #edf2fa;
  --trialive-control-readonly-bg: var(--trialive-surface-muted);
  --trialive-control-disabled-bg: var(--trialive-surface-subtle);
  --trialive-selection-bg: #cedbec;
  --trialive-selection-strong-bg: #afc4df;
  --trialive-hover-bg: #d8e4f3;
  --trialive-active-bg: var(--trialive-primary-1);
  --trialive-header-bg: var(--trialive-primary-1);
  --trialive-navigation-bg: var(--trialive-surface-glass-strong);
  --trialive-sidebar-bg: #d8e3f2;
  --trialive-table-header-bg: var(--trialive-primary-1);
  --trialive-table-row-alt-bg: #edf2f9;
  --trialive-table-row-hover-bg: #d5e2f2;
  --trialive-table-row-selected-bg: #b9cde6;
  --trialive-table-header-text: var(--trialive-text-inverse);
  --trialive-control-focus-line: var(--trialive-primary-1);
  --trialive-checkbox-bg: var(--trialive-primary-1);
  --trialive-checkbox-check: var(--trialive-white);
  --trialive-slider-track: var(--trialive-secondary-2);
  --trialive-slider-thumb: var(--trialive-primary-1);
  --trialive-slider-readonly-track: #b8c1ce;
  --trialive-slider-readonly-thumb: #778397;
  --trialive-pagination-bg: #c9d8eb;
  --trialive-pagination-hover-bg: #aec4df;
  --trialive-message-bg: var(--trialive-surface);
  --trialive-message-meta-bg: #cbd9eb;
  --trialive-message-body-bg: var(--trialive-surface);
  --trialive-message-border: #8fa9cb;
  --trialive-message-label: #2d4774;
  --trialive-message-status: var(--trialive-primary-1);
  --trialive-form-nav-bg: #c8d7ea;
  --trialive-form-nav-border: #94acd0;
  --trialive-form-nav-item-bg: var(--trialive-surface);
  --trialive-form-nav-item-hover-bg: #dce6f3;
  --trialive-form-nav-item-border: #9fb4d1;
  --trialive-form-nav-item-active-bg: #b9cde6;
  --trialive-form-nav-item-active-border: var(--trialive-primary-1);
  --trialive-form-nav-status: var(--trialive-success);

  /* Compact category chip roles */
  --trialive-chip-neutral-text: var(--trialive-text-2);
  --trialive-chip-neutral-bg: #dce5f2;
  --trialive-chip-neutral-hover-bg: #c8d6e9;
  --trialive-chip-neutral-border: #a8bad3;
  --trialive-chip-neutral-accent: var(--trialive-primary-3);

  --trialive-chip-info-text: #274d80;
  --trialive-chip-info-bg: #c8daf0;
  --trialive-chip-info-hover-bg: #b4cbe7;
  --trialive-chip-info-border: #84a4cc;
  --trialive-chip-info-accent: var(--trialive-primary-1);

  --trialive-chip-success-text: var(--trialive-success-strong);
  --trialive-chip-success-bg: #d6eddc;
  --trialive-chip-success-hover-bg: #c2e3cb;
  --trialive-chip-success-border: #83b991;
  --trialive-chip-success-accent: var(--trialive-success);

  --trialive-chip-warning-text: var(--trialive-warning);
  --trialive-chip-warning-bg: #ffecc3;
  --trialive-chip-warning-hover-bg: #ffdfa0;
  --trialive-chip-warning-border: #d2ae5f;
  --trialive-chip-warning-accent: var(--trialive-warning);

  --trialive-chip-danger-text: var(--trialive-danger-strong);
  --trialive-chip-danger-bg: #ffdcd9;
  --trialive-chip-danger-hover-bg: #ffc8c4;
  --trialive-chip-danger-border: #d98f89;
  --trialive-chip-danger-accent: var(--trialive-danger);

  --trialive-chip-purple-text: var(--trialive-primary-1);
  --trialive-chip-purple-bg: #cdd9eb;
  --trialive-chip-purple-hover-bg: #b8c9e1;
  --trialive-chip-purple-border: #91a8c8;
  --trialive-chip-purple-accent: var(--trialive-primary-1);
  --trialive-tooltip-bg: var(--trialive-primary-1);
  --trialive-tooltip-text: var(--trialive-text-inverse);

  /* Shadow colors */
  --trialive-shadow-color-soft: #17233b1a;
  --trialive-shadow-color: #17233b2e;
  --trialive-shadow-color-strong: #17233b47;
  --trialive-shadow-xs: 0 1px 2px var(--trialive-shadow-color-soft);
  --trialive-shadow-sm: 0 2px 8px var(--trialive-shadow-color-soft), 0 1px 2px var(--trialive-shadow-color);
  --trialive-shadow-md: 0 10px 30px var(--trialive-shadow-color), 0 2px 8px var(--trialive-shadow-color-soft);
  --trialive-shadow-lg: 0 24px 70px var(--trialive-shadow-color-strong), 0 8px 24px var(--trialive-shadow-color);
  --trialive-header-shadow: 0 1px 0 var(--trialive-primary-2), 0 5px 18px var(--trialive-shadow-color);

  --tab2-sel: var(--trialive-table-header-text);
}