/* =========================================================
   LIFTRIX Theme Color
   Shared color tokens for PC / Tablet / Mobile

   Role:
   - Brand colors
   - Background colors
   - Text colors
   - Border colors
   - Status colors
   - Surface colors
========================================================= */

:root{
  --bg-0:#04142F;
  --bg-1:#0F1A2B;
  --bg-2:#1A2742;
  --bg-3:#1F2F4D;
  --bg-4:#2A3F66;

  --bg:var(--bg-1);

  --panel:#14213A;
  --panel-2:#1A2945;
  --panel-3:#223556;

  --surface-0:rgba(15, 26, 43, 0.96);
  --surface-1:rgba(26, 39, 66, 0.92);
  --surface-2:rgba(31, 47, 77, 0.94);
  --surface-3:rgba(42, 63, 102, 0.94);

  --text:#F4F8FF;
  --text-main:#F4F8FF;
  --text-soft:#DCE9FF;
  --text-sub:rgba(226,236,255,0.78);
  --text-muted:rgba(226,236,255,0.55);
  --muted:#9FB0CB;

  --border:rgba(125,170,255,0.14);
  --border-strong:rgba(125,170,255,0.25);
  --border-soft:rgba(125,170,255,0.08);

  --primary:#3FA9FF;
  --primary-strong:#1E4FD8;
  --primary-soft:rgba(63,169,255,0.18);
  --primary-glow:rgba(63,169,255,0.25);

  --highlight:#3FA9FF;
  --highlight-soft:rgba(63,169,255,0.18);

  --success:#25B8AA;
  --success-bg:rgba(37,184,170,0.18);
  --success-border:rgba(89,224,206,0.28);

  --info:#6E9BF3;
  --info-bg:rgba(110,155,243,0.25);
  --info-border:rgba(154,191,255,0.36);

  --warn:#FFC45C;
  --warn-bg:rgba(255,196,92,0.16);
  --warn-border:rgba(255,210,125,0.24);

  --danger:#FF5C5C;
  --danger-soft:#FF7D87;
  --danger-bg:rgba(255,92,92,0.16);
  --danger-border:rgba(255,120,120,0.24);

  --page-bg-gradient:
    linear-gradient(
      180deg,
      #1A2F66 0%,
      #10244F 45%,
      #04142F 100%
    );

  --page-overlay-top:
    radial-gradient(
      circle at 50% 18%,
      rgba(63, 169, 255, 0.10) 0%,
      rgba(63, 169, 255, 0.04) 18%,
      rgba(63, 169, 255, 0.00) 42%
    );

  --page-overlay-depth:
    linear-gradient(
      180deg,
      rgba(255,255,255,0.015) 0%,
      rgba(255,255,255,0.00) 30%,
      rgba(0,0,0,0.08) 100%
    );
}