/**
 * Loyalty.lt dizaino tokenai — vienintelis spalvų/tarpų šaltinis.
 *
 * Atitinka mobiliosios programėlės paletę (`expo/theme/palette.ts`) ir
 * `SheetKit` matmenis, kad WP plugin'as, admin ir programėlė atrodytų vienodai.
 *
 * Šis failas kraunamas PIRMAS — visi kiti CSS naudoja tik `var(--loyalty-*)`.
 */

:root {
  /* ── Brand (nekinta nuo temos) ── */
  --loyalty-primary: #65a949; /* brandGreen — pagrindinė žalia */
  --loyalty-primary-hover: #589740;
  --loyalty-dark: #19352d; /* brandDark — tamsiai žalia */
  /* Neoninis akcentas (#E6FD5A) sąmoningai NEnaudojamas UI — per ryškus
     ekranams; brand ženklas jį naudoja tik spaudoje. Vietoj jo — primary. */

  /* ── Paviršiai ── */
  --loyalty-app-bg: #f7f7f5; /* appBg — šiltas fonas */
  --loyalty-screen-bg: #fcfcfb; /* screenBg — puslapio fonas */
  --loyalty-surface: #ffffff; /* surface — kortelė */
  --loyalty-surface-muted: var(--loyalty-app-bg);
  --loyalty-light-bg: #e8f3e1; /* lightPrimary — švelnus žalias */
  --loyalty-surface-green: #eaf6e4;

  /* ── Linijos ── */
  --loyalty-border: #eeeeeb; /* cardBorder */
  --loyalty-line: #eeeeeb;
  --loyalty-line-strong: #e9e9e4;

  /* ── Tekstas ── */
  --loyalty-ink: #0a0a0a; /* pagrindinis tekstas */
  --loyalty-text: #161616;
  --loyalty-heading: #19352d;
  --loyalty-text-muted: #6b7280; /* grayText */
  --loyalty-on-dark: #ffffff;
  --loyalty-ink-inverted: #ffffff; /* tekstas ant `interactive` */

  /* ── Interaktyvūs ── */
  --loyalty-interactive: #161616; /* aktyvus „capsule" mygtukas */
  --loyalty-interactive-hover: #30302f;

  /* ── Būsenos (fonas / kraštinė / tekstas) ── */
  --loyalty-success: #4d903f;
  --loyalty-success-bg: #e8f3e1;
  --loyalty-success-ink: #1f4d18;

  --loyalty-warning: #f59e0b;
  --loyalty-warning-bg: #fef3c7;
  --loyalty-warning-ink: #7c4a03;

  --loyalty-error: #ef4444;
  --loyalty-error-bg: #fee2e2;
  --loyalty-error-ink: #8a1c1c;

  --loyalty-info: #3b82f6;
  --loyalty-info-bg: #e0edff;
  --loyalty-info-ink: #1e40af;

  /* ── Hero gradientas (toks pat kaip programėlės headeryje) ── */
  --loyalty-hero-from: #517e44;
  --loyalty-hero-mid: #234a29;
  --loyalty-hero-to: #173b22;
  --loyalty-hero-gradient: linear-gradient(
    160deg,
    var(--loyalty-hero-from) 0%,
    var(--loyalty-hero-mid) 55%,
    var(--loyalty-hero-to) 100%
  );

  /* ── Kampai (SheetKit matmenys) ── */
  --loyalty-radius: 20px; /* kortelė */
  --loyalty-radius-lg: 30px; /* sheet / hero */
  --loyalty-radius-field: 16px; /* įvesties laukas */
  --loyalty-radius-pill: 20px; /* pill mygtukas */
  --loyalty-radius-sm: 12px;

  /* ── Tarpai ── */
  --loyalty-gap: 16px; /* sekcijos šoninis tarpas */
  --loyalty-card-padding: 12px;
  --loyalty-section-gap: 14px;

  /* ── Šešėliai ── */
  --loyalty-shadow: 0 2px 12px rgba(0, 0, 0, 0.03);
  --loyalty-shadow-lg: 0 10px 30px rgba(8, 32, 26, 0.08);

  /* ── Ženkliukai prie kainų (Porto ir kitos temos) ── */
  --loyalty-badge-bg: var(--loyalty-light-bg);
  --loyalty-badge-color: var(--loyalty-dark);

  /* Senas pavadinimas su „lt" — `account-page-design.css` jį naudoja, bet
     niekur nebuvo apibrėžtas, todėl tos taisyklės neveikė. */
  --loyalty-lt-primary: var(--loyalty-primary);

  /* ── Šriftai ── */
  --loyalty-font-heading: "Hubot Sans", -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
  --loyalty-font-body: "Mona Sans", -apple-system, BlinkMacSystemFont, "Segoe UI",
    sans-serif;
}

/* ── Šriftai: tie patys, kuriuos naudoja programėlė (Mona Sans + Hubot Sans) ── */
@font-face {
  font-family: "Mona Sans";
  src: url("../fonts/mona-sans/MonaSans-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Mona Sans";
  src: url("../fonts/mona-sans/MonaSans-Medium.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Mona Sans";
  src: url("../fonts/mona-sans/MonaSans-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Mona Sans";
  src: url("../fonts/mona-sans/MonaSans-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Hubot Sans";
  src: url("../fonts/hubot-sans/HubotSans-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Hubot Sans";
  src: url("../fonts/hubot-sans/HubotSans-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
}