/* public/assets/css/base.css */

/* ===== Reset ===== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  color-scheme: light dark; /* helps native controls match theme */
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", sans-serif;
}

/* ===== AMHelper Palette ===== */
:root {
  --blue: #1a7cff;
  --violet: #6525d9;
  --yellow: #ffd400;
  --green: #30d158;
  --red: #ff3a3a;

  --dark-bg: #211551;
  --light-bg: #f7f8fa;

  --dark-text: #211551;
  --light-text: #f7f8fa;

  --soft-grey: #6f7f78;

  /* dynamic tab color (light default) */
  --tabAndIcons: var(--violet);
  --tabAndIconsGlow: rgba(101, 37, 217, 0.3);

  /* idle borders */
  --borderIdle: rgba(128, 128, 128, 0.4);
  --placeholder: rgba(128, 128, 128, 0.6);

  /* unified theme tokens (so app.css and base.css don't fight) */
  --bg: var(--light-bg);
  --font: var(--dark-text);
}

@media (prefers-color-scheme: dark) {
  :root {
    --tabAndIcons: var(--yellow);
    --tabAndIconsGlow: rgba(255, 212, 0, 0.35);

    --borderIdle: rgba(255, 255, 255, 0.25);
    --placeholder: rgba(255, 255, 255, 0.4);

    --bg: var(--dark-bg);
    --font: var(--light-text);
  }
}

/* ===== Theme ===== */
body {
  background: var(--bg);
  color: var(--font);
}