/*
 * Cloudline
 * Soft Apple-level SaaS preset: milky white, translucent depth, tiny cobalt accents.
 */

html[data-saas-theme='cloudline'] {
  --st-color-scheme: light;

  --st-bg: #f7f8fb;
  --st-bg-rgb: 247, 248, 251;
  --st-surface: rgba(255, 255, 255, 0.86);
  --st-surface-2: #f1f4fa;
  --st-surface-3: #e3e9f4;
  --st-main-bg: rgba(255, 255, 255, 0.5);
  --st-nav-bg: rgba(255, 255, 255, 0.72);
  --st-sidebar-bg: rgba(255, 255, 255, 0.68);
  --st-sidebar-line: rgba(23, 32, 51, 0.08);
  --st-sidebar-active: rgba(65, 105, 225, 0.09);
  --st-sidebar-ink: #172033;
  --st-sidebar-muted: rgba(23, 32, 51, 0.58);

  --st-ink: #172033;
  --st-ink-rgb: 23, 32, 51;
  --st-muted: #6b7487;
  --st-muted-rgb: 107, 116, 135;
  --st-line: rgba(23, 32, 51, 0.09);
  --st-line-soft: rgba(23, 32, 51, 0.055);

  --st-primary: #4169e1;
  --st-primary-rgb: 65, 105, 225;
  --st-primary-strong: #3658c4;
  --st-secondary: #6b7487;
  --st-secondary-rgb: 107, 116, 135;
  --st-accent: #a7c5ff;
  --st-accent-rgb: 167, 197, 255;
  --st-success: #36856d;
  --st-success-rgb: 54, 133, 109;
  --st-warning: #b08334;
  --st-warning-rgb: 176, 131, 52;
  --st-danger: #b85f62;
  --st-danger-rgb: 184, 95, 98;
  --st-info: #547fd7;
  --st-info-rgb: 84, 127, 215;
  --st-on-primary: #ffffff;
  --st-on-success: #ffffff;
  --st-on-info: #ffffff;
  --st-on-warning: #fffaf3;
  --st-on-danger: #fff8f8;
  --st-tooltip-bg: #1c2432;
  --st-tooltip-ink: #f9fbff;

  --st-input-bg: rgba(255, 255, 255, 0.9);
  --st-input-bg-focus: #ffffff;
  --st-button-primary-bg: linear-gradient(135deg, #4169e1, #3658c4);
  --st-button-primary-border: rgba(65, 105, 225, 0.9);
  --st-button-primary-shadow: 0 16px 32px rgba(65, 105, 225, 0.16);
  --st-button-primary-hover-bg: linear-gradient(135deg, #3c63d8, #304fae);
  --st-button-primary-hover-border: rgba(54, 88, 196, 0.98);
  --st-button-primary-hover-shadow: 0 20px 38px rgba(65, 105, 225, 0.22);
  --st-button-outline-bg: rgba(255, 255, 255, 0.7);
  --st-button-outline-border: rgba(65, 105, 225, 0.22);
  --st-button-outline-shadow: 0 12px 24px rgba(23, 32, 51, 0.04);
  --st-button-outline-hover-bg: rgba(65, 105, 225, 0.07);
  --st-button-outline-hover-border: rgba(65, 105, 225, 0.4);
  --st-button-outline-hover-shadow: 0 14px 30px rgba(65, 105, 225, 0.1);
  --st-button-light-bg: rgba(255, 255, 255, 0.82);
  --st-button-light-border: rgba(23, 32, 51, 0.08);
  --st-button-light-shadow: 0 12px 24px rgba(23, 32, 51, 0.04);
  --st-button-light-hover-bg: rgba(255, 255, 255, 0.96);
  --st-button-light-hover-border: rgba(23, 32, 51, 0.12);
  --st-button-light-hover-shadow: 0 16px 30px rgba(23, 32, 51, 0.065);
  --st-radius-sm: 0.72rem;
  --st-radius-md: 1rem;
  --st-radius-lg: 1.4rem;
  --st-radius-xl: 1.9rem;
  --st-shadow-sm: 0 16px 34px rgba(23, 32, 51, 0.045);
  --st-shadow-md: 0 28px 60px rgba(23, 32, 51, 0.075);
  --st-shadow-lg: 0 42px 96px rgba(23, 32, 51, 0.11);

  --st-grid-line: rgba(65, 105, 225, 0.07);
  --st-grid-opacity: 0.12;
  --st-body-background:
    radial-gradient(circle at 12% -4%, rgba(167, 197, 255, 0.26), transparent 30%),
    radial-gradient(circle at 88% 2%, rgba(65, 105, 225, 0.12), transparent 26%),
    radial-gradient(circle at 54% 100%, rgba(255, 255, 255, 0.9), transparent 34%),
    linear-gradient(135deg, #fcfdff 0%, #f7f8fb 46%, #eef3fb 100%);
}