@tailwind base;
@tailwind components;
@tailwind utilities;

@import 'remixicon/fonts/remixicon.css';

* {
  box-sizing: border-box;
}

body {
  margin: 0;
}

/* ── Vuexy logical property aliases ─────────────────────────── */
.bs-full { block-size: 100%; }
.is-full { inline-size: 100%; }

/* ── MUI colour text utilities ──────────────────────────────── */
.text-primary-main  { color: #7C6AF7; }
.text-secondary-main{ color: #9C89F6; }
.text-success-main  { color: #71DD37; }
.text-warning-main  { color: #FFAB00; }
.text-info-main     { color: #03C3EC; }
.text-error-main    { color: #FF3E1D; }

/* ── MUI colour background utilities ────────────────────────── */
.bg-primary-lighter  { background-color: rgba(124, 106, 247, 0.16); }
.bg-secondary-lighter{ background-color: rgba(156, 137, 246, 0.16); }
.bg-success-lighter  { background-color: rgba(113, 221,  55, 0.16); }
.bg-warning-lighter  { background-color: rgba(255, 171,   0, 0.16); }
.bg-info-lighter     { background-color: rgba(  3, 195, 236, 0.16); }
.bg-error-lighter    { background-color: rgba(255,  62,  29, 0.16); }
