/* =====================================================================
   Tokeny MaterialM dla panelu admina.
   ---------------------------------------------------------------------
   PLIK GENEROWANY — nie edytuj recznie.
   Zrodlo: MaterialM Nuxt Pro (licencja WrapPixel), pakiet trzymany poza
   repo (patrz .gitignore w repo infra). Generator:
   tools/materialm-tokens.mjs — kolory z theme/{Light,Dark}Theme.ts, reszta
   przepisana z assets/scss/_variables.scss i assets/scss/{layout,components}/.

   Szablon jest napisany pod Vuetify, wiec jego CSS nie da sie przeniesc:
   selektory celuja w .v-card / .v-btn / .v-table, ktorych w Blade nie ma.
   Przenosi sie SYSTEM — ten plik. Wyglad odtwarzamy na Bootstrapie w
   materialm-admin.css, siegajac po te zmienne zamiast po wartosci wprost.
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. Kolory — 6 motywow, kazdy w wersji jasnej i ciemnej.
   Przelacznik: <html data-mm-theme="blue" data-bs-theme="light|dark">
   --------------------------------------------------------------------- */

/* domyslny: BLUE, jasny */
:root {
  --mm-primary: #00A1FF;
  --mm-secondary: #8965E5;
  --mm-info: #46caeb;
  --mm-success: #00ceb6;
  --mm-warning: #ffae1f;
  --mm-error: #ff6692;
  --mm-lightprimary: #e5f5ff;
  --mm-lightsecondary: #e7e2f3;
  --mm-lightsuccess: #d2f9f4;
  --mm-lighterror: #ffe4ec;
  --mm-lightinfo: #e1f5fa;
  --mm-lightwarning: #fff1cc;
  --mm-text-primary: #111c2d;
  --mm-text-secondary: #7b8893;
  --mm-border-color: #e0e6eb;
  --mm-container-bg: #F8FAFD;
  --mm-background: #F8FAFD;
  --mm-hover-color: #EFF4FA;
  --mm-surface: #fff;
  --mm-grey100: #EAEFF4;
  --mm-grey200: #29343d;
  --mm-light: #EFF4FA;
  --mm-muted: #526b7a;
}

[data-mm-theme="blue"] {
  --mm-primary: #00A1FF;
  --mm-secondary: #8965E5;
  --mm-info: #46caeb;
  --mm-success: #00ceb6;
  --mm-warning: #ffae1f;
  --mm-error: #ff6692;
  --mm-lightprimary: #e5f5ff;
  --mm-lightsecondary: #e7e2f3;
  --mm-lightsuccess: #d2f9f4;
  --mm-lighterror: #ffe4ec;
  --mm-lightinfo: #e1f5fa;
  --mm-lightwarning: #fff1cc;
  --mm-text-primary: #111c2d;
  --mm-text-secondary: #7b8893;
  --mm-border-color: #e0e6eb;
  --mm-container-bg: #F8FAFD;
  --mm-background: #F8FAFD;
  --mm-hover-color: #EFF4FA;
  --mm-surface: #fff;
  --mm-grey100: #EAEFF4;
  --mm-grey200: #29343d;
  --mm-light: #EFF4FA;
  --mm-muted: #526b7a;
}

[data-mm-theme="aqua"] {
  --mm-primary: #0074BA;
  --mm-secondary: #47D7BC;
  --mm-info: #46caeb;
  --mm-success: #00ceb6;
  --mm-warning: #ffae1f;
  --mm-error: #ff6692;
  --mm-lightprimary: #E5F1F8;
  --mm-lightsecondary: #EDFBF7;
  --mm-lightsuccess: #E6FFFA;
  --mm-lighterror: #FDEDE8;
  --mm-lightinfo: #EBF3FE;
  --mm-lightwarning: #FEF5E5;
  --mm-text-primary: #111c2d;
  --mm-text-secondary: #7b8893;
  --mm-border-color: #e5eaef;
  --mm-container-bg: #F8FAFD;
  --mm-background: #F8FAFD;
  --mm-hover-color: #EFF4FA;
  --mm-surface: #fff;
  --mm-grey100: #EAEFF4;
  --mm-grey200: #29343d;
  --mm-light: #EFF4FA;
  --mm-muted: #526b7a;
}

[data-mm-theme="purple"] {
  --mm-primary: #763EBD;
  --mm-secondary: #95CFD5;
  --mm-info: #46caeb;
  --mm-success: #00ceb6;
  --mm-warning: #ffae1f;
  --mm-error: #ff6692;
  --mm-lightprimary: #F2ECF9;
  --mm-lightsecondary: #EDF8FA;
  --mm-lightsuccess: #E6FFFA;
  --mm-lighterror: #FDEDE8;
  --mm-lightinfo: #EBF3FE;
  --mm-lightwarning: #FEF5E5;
  --mm-text-primary: #111c2d;
  --mm-text-secondary: #7b8893;
  --mm-border-color: #e5eaef;
  --mm-container-bg: #F8FAFD;
  --mm-background: #F8FAFD;
  --mm-hover-color: #EFF4FA;
  --mm-surface: #fff;
  --mm-grey100: #EAEFF4;
  --mm-grey200: #29343d;
  --mm-light: #EFF4FA;
  --mm-muted: #526b7a;
}

[data-mm-theme="green"] {
  --mm-primary: #0A7EA4;
  --mm-secondary: #CCDA4E;
  --mm-info: #46caeb;
  --mm-success: #00ceb6;
  --mm-warning: #ffae1f;
  --mm-error: #ff6692;
  --mm-lightprimary: #E6F2F6;
  --mm-lightsecondary: #FAFBEF;
  --mm-lightsuccess: #E6FFFA;
  --mm-lighterror: #FDEDE8;
  --mm-lightinfo: #EBF3FE;
  --mm-lightwarning: #FEF5E5;
  --mm-text-primary: #111c2d;
  --mm-text-secondary: #7b8893;
  --mm-border-color: #e5eaef;
  --mm-container-bg: #F8FAFD;
  --mm-background: #F8FAFD;
  --mm-hover-color: #EFF4FA;
  --mm-surface: #fff;
  --mm-grey100: #EAEFF4;
  --mm-grey200: #29343d;
  --mm-light: #EFF4FA;
  --mm-muted: #526b7a;
}

[data-mm-theme="cyan"] {
  --mm-primary: #01C0C8;
  --mm-secondary: #FB9678;
  --mm-info: #46caeb;
  --mm-success: #00ceb6;
  --mm-warning: #ffae1f;
  --mm-error: #ff6692;
  --mm-lightprimary: #EBF9FA;
  --mm-lightsecondary: #FFF5F2;
  --mm-lightsuccess: #E6FFFA;
  --mm-lighterror: #FDEDE8;
  --mm-lightinfo: #EBF3FE;
  --mm-lightwarning: #FEF5E5;
  --mm-text-primary: #111c2d;
  --mm-text-secondary: #7b8893;
  --mm-border-color: #e5eaef;
  --mm-container-bg: #F8FAFD;
  --mm-background: #F8FAFD;
  --mm-hover-color: #EFF4FA;
  --mm-surface: #fff;
  --mm-grey100: #EAEFF4;
  --mm-grey200: #29343d;
  --mm-light: #EFF4FA;
  --mm-muted: #526b7a;
}

[data-mm-theme="orange"] {
  --mm-primary: #FA896B;
  --mm-secondary: #0074BA;
  --mm-info: #46caeb;
  --mm-success: #00ceb6;
  --mm-warning: #ffae1f;
  --mm-error: #ff6692;
  --mm-lightprimary: #FBF2EF;
  --mm-lightsecondary: #EFF9FF;
  --mm-lightsuccess: #E6FFFA;
  --mm-lighterror: #FDEDE8;
  --mm-lightinfo: #EBF3FE;
  --mm-lightwarning: #FEF5E5;
  --mm-text-primary: #111c2d;
  --mm-text-secondary: #7b8893;
  --mm-border-color: #e5eaef;
  --mm-container-bg: #F8FAFD;
  --mm-background: #F8FAFD;
  --mm-hover-color: #EFF4FA;
  --mm-surface: #fff;
  --mm-grey100: #EAEFF4;
  --mm-grey200: #29343d;
  --mm-light: #EFF4FA;
  --mm-muted: #526b7a;
}

[data-bs-theme="dark"][data-mm-theme="blue"] {
  --mm-primary: #00A1FF;
  --mm-secondary: #8965E5;
  --mm-info: #3CACC8;
  --mm-success: #13DEB9;
  --mm-warning: #FFAE1F;
  --mm-error: #ff6692;
  --mm-lightprimary: #1C3651;
  --mm-lightsecondary: #2A304E;
  --mm-lightsuccess: #1B3C48;
  --mm-lighterror: #4B313D;
  --mm-lightinfo: #274A60;
  --mm-lightwarning: #4D3A2A;
  --mm-text-primary: #EAEFF4;
  --mm-text-secondary: #7C8FAC;
  --mm-border-color: #333F55;
  --mm-container-bg: #1A2537;
  --mm-background: #1A2537;
  --mm-hover-color: #2A3851;
  --mm-surface: #1F2A3D;
  --mm-grey100: #333F55;
  --mm-grey200: #465670;
  --mm-light: #1A2537;
}

[data-bs-theme="dark"][data-mm-theme="aqua"] {
  --mm-primary: #0074BA;
  --mm-secondary: #47D7BC;
  --mm-info: #3CACC8;
  --mm-success: #13DEB9;
  --mm-warning: #FFAE1F;
  --mm-error: #ff6692;
  --mm-lightprimary: #1C324A;
  --mm-lightsecondary: #0C4339;
  --mm-lightsuccess: #1B3C48;
  --mm-lighterror: #4B313D;
  --mm-lightinfo: #274A60;
  --mm-lightwarning: #4D3A2A;
  --mm-text-primary: #EAEFF4;
  --mm-text-secondary: #7C8FAC;
  --mm-border-color: #333F55;
  --mm-container-bg: #1A2537;
  --mm-background: #1A2537;
  --mm-hover-color: #2A3851;
  --mm-surface: #1F2A3D;
  --mm-grey100: #333F55;
  --mm-grey200: #465670;
  --mm-light: #1A2537;
}

[data-bs-theme="dark"][data-mm-theme="purple"] {
  --mm-primary: #763EBD;
  --mm-secondary: #95CFD5;
  --mm-info: #3CACC8;
  --mm-success: #13DEB9;
  --mm-warning: #FFAE1F;
  --mm-error: #ff6692;
  --mm-lightprimary: #282C4A;
  --mm-lightsecondary: #09454B;
  --mm-lightsuccess: #1B3C48;
  --mm-lighterror: #4B313D;
  --mm-lightinfo: #274A60;
  --mm-lightwarning: #4D3A2A;
  --mm-text-primary: #EAEFF4;
  --mm-text-secondary: #7C8FAC;
  --mm-border-color: #333F55;
  --mm-container-bg: #1A2537;
  --mm-background: #1A2537;
  --mm-hover-color: #2A3851;
  --mm-surface: #1F2A3D;
  --mm-grey100: #333F55;
  --mm-grey200: #465670;
  --mm-light: #1A2537;
}

[data-bs-theme="dark"][data-mm-theme="green"] {
  --mm-primary: #0A7EA4;
  --mm-secondary: #CCDA4E;
  --mm-info: #3CACC8;
  --mm-success: #13DEB9;
  --mm-warning: #FFAE1F;
  --mm-error: #ff6692;
  --mm-lightprimary: #1D3348;
  --mm-lightsecondary: #282917;
  --mm-lightsuccess: #1B3C48;
  --mm-lighterror: #4B313D;
  --mm-lightinfo: #274A60;
  --mm-lightwarning: #4D3A2A;
  --mm-text-primary: #EAEFF4;
  --mm-text-secondary: #7C8FAC;
  --mm-border-color: #333F55;
  --mm-container-bg: #1A2537;
  --mm-background: #1A2537;
  --mm-hover-color: #2A3851;
  --mm-surface: #1F2A3D;
  --mm-grey100: #333F55;
  --mm-grey200: #465670;
  --mm-light: #1A2537;
}

[data-bs-theme="dark"][data-mm-theme="cyan"] {
  --mm-primary: #01C0C8;
  --mm-secondary: #FB9678;
  --mm-info: #3CACC8;
  --mm-success: #13DEB9;
  --mm-warning: #FFAE1F;
  --mm-error: #ff6692;
  --mm-lightprimary: #1C3A4B;
  --mm-lightsecondary: #40241C;
  --mm-lightsuccess: #1B3C48;
  --mm-lighterror: #4B313D;
  --mm-lightinfo: #274A60;
  --mm-lightwarning: #4D3A2A;
  --mm-text-primary: #EAEFF4;
  --mm-text-secondary: #7C8FAC;
  --mm-border-color: #333F55;
  --mm-container-bg: #1A2537;
  --mm-background: #1A2537;
  --mm-hover-color: #2A3851;
  --mm-surface: #1F2A3D;
  --mm-grey100: #333F55;
  --mm-grey200: #465670;
  --mm-light: #1A2537;
}

[data-bs-theme="dark"][data-mm-theme="orange"] {
  --mm-primary: #FA896B;
  --mm-secondary: #0074BA;
  --mm-info: #3CACC8;
  --mm-success: #13DEB9;
  --mm-warning: #FFAE1F;
  --mm-error: #ff6692;
  --mm-lightprimary: #353442;
  --mm-lightsecondary: #082E45;
  --mm-lightsuccess: #1B3C48;
  --mm-lighterror: #4B313D;
  --mm-lightinfo: #274A60;
  --mm-lightwarning: #4D3A2A;
  --mm-text-primary: #EAEFF4;
  --mm-text-secondary: #7C8FAC;
  --mm-border-color: #333F55;
  --mm-container-bg: #1A2537;
  --mm-background: #1A2537;
  --mm-hover-color: #2A3851;
  --mm-surface: #1F2A3D;
  --mm-grey100: #333F55;
  --mm-grey200: #465670;
  --mm-light: #1A2537;
}

/* ciemny bez wskazanego motywu = DARK_BLUE */
[data-bs-theme="dark"] {
  --mm-primary: #00A1FF;
  --mm-secondary: #8965E5;
  --mm-info: #3CACC8;
  --mm-success: #13DEB9;
  --mm-warning: #FFAE1F;
  --mm-error: #ff6692;
  --mm-lightprimary: #1C3651;
  --mm-lightsecondary: #2A304E;
  --mm-lightsuccess: #1B3C48;
  --mm-lighterror: #4B313D;
  --mm-lightinfo: #274A60;
  --mm-lightwarning: #4D3A2A;
  --mm-text-primary: #EAEFF4;
  --mm-text-secondary: #7C8FAC;
  --mm-border-color: #333F55;
  --mm-container-bg: #1A2537;
  --mm-background: #1A2537;
  --mm-hover-color: #2A3851;
  --mm-surface: #1F2A3D;
  --mm-grey100: #333F55;
  --mm-grey200: #465670;
  --mm-light: #1A2537;
}

/* ---------------------------------------------------------------------
   2. Typografia — skala z _variables.scss ($typography).
   Font Inter; szablon laduje go z Google Fonts w style.scss.
   --------------------------------------------------------------------- */
:root {
  --mm-font-family: "Inter", sans-serif;

  --mm-h1-size: 2.25rem;    --mm-h1-weight: 600;  --mm-h1-lh: 3.75rem;
  --mm-h2-size: 1.875rem;   --mm-h2-weight: 600;  --mm-h2-lh: 2.25rem;
  --mm-h3-size: 1.375rem;   --mm-h3-weight: 600;  --mm-h3-lh: 2rem;
  --mm-h4-size: 1.25rem;    --mm-h4-weight: 600;  --mm-h4-lh: 1.6rem;
  --mm-h5-size: 1.125rem;   --mm-h5-weight: 600;  --mm-h5-lh: 1.6rem;
  --mm-h6-size: 1rem;       --mm-h6-weight: 600;  --mm-h6-lh: 1.2rem;

  --mm-subtitle-1-size: 0.94rem;  --mm-subtitle-1-weight: 400;  --mm-subtitle-1-lh: 1.1rem;
  --mm-subtitle-2-size: 0.81rem;  --mm-subtitle-2-weight: 400;  --mm-subtitle-2-lh: 1rem;
  --mm-body-1-size: 0.875rem;     --mm-body-1-weight: 400;
  --mm-body-2-size: 0.75rem;      --mm-body-2-weight: 400;
  --mm-caption-size: 0.875rem;    --mm-caption-weight: 400;
  --mm-overline-size: 0.75rem;    --mm-overline-weight: 400;

  /* przyciski: 13px, polgruba, bez wersalikow — Vuetify domyslnie krzyczy CAPSEM,
     MaterialM to wylacza; Bootstrap nie transformuje, wiec token jest informacyjny */
  --mm-button-size: 0.81rem;
  --mm-button-weight: 600;
  --mm-button-transform: capitalize;
  --mm-letter-spacing: 0;
}

/* ---------------------------------------------------------------------
   3. Promienie — $border-radius-root: 8px + skala $rounded.
   --------------------------------------------------------------------- */
:root {
  --mm-radius: 8px;
  --mm-radius-sm: 4px;
  --mm-radius-xs: 9px;
  --mm-radius-md: 12px;
  --mm-radius-lg: 16px;
  --mm-radius-xl: 24px;
  --mm-radius-pill: 9999px;

  /* przyciski i linki menu sa kapsulkowe — to znak rozpoznawczy MaterialM */
  --mm-btn-radius: 30px;
  --mm-nav-radius: 30px;
}

/* ---------------------------------------------------------------------
   4. Cienie — $box-shadow + klasy .elevation-* z components/_VShadow.scss.
   --------------------------------------------------------------------- */
:root {
  --mm-shadow: 0px 1px 4px 0px rgba(133, 146, 173, 0.2);
  --mm-shadow-1: 0px 12px 30px -2px rgba(58, 75, 116, 0.14);
  --mm-shadow-2: 0px 24px 24px -12px rgba(0, 0, 0, 0.05);
  --mm-shadow-3: rgba(145, 158, 171, 0.2) 0px 0px 2px 0px, rgba(145, 158, 171, 0.12) 0px 12px 24px -4px;
  --mm-shadow-4: 0px 12px 12px -6px rgba(0, 0, 0, 0.15);
  --mm-shadow-9: rgb(0 0 0 / 5%) 0px 9px 17.5px;
}

/* ---------------------------------------------------------------------
   5. Wymiary ukladu — z layout/_container.scss, _sidebar.scss,
   _horizontal.scss oraz _theme-variables.
   --------------------------------------------------------------------- */
:root {
  --mm-header-height: 70px;
  /* rail = waski pasek ikon grup (v-navigation-drawer rail-width="80"),
     sidebar = panel z pozycjami wybranej grupy (width="240") */
  --mm-rail-width: 80px;
  --mm-sidebar-width: 240px;
  --mm-page-padding: 24px;
  --mm-page-padding-sm: 20px 10px;

  /* uklad boxed */
  --mm-boxed-width: 1270px;
  --mm-boxed-width-inner: 1160px;

  /* karta */
  --mm-card-padding: 24px;
  --mm-card-title-mb: 8px;

  /* tabela */
  --mm-table-cell-padding: 14px 24px;
  --mm-table-th-weight: 600;
  --mm-table-th-size: 16px;
  --mm-table-td-size: 14px;

  /* link w menu */
  --mm-nav-min-height: 42px;
  --mm-nav-gap: 13px;
  --mm-nav-font-size: 15px;
  --mm-nav-margin: 0 0 5px;
}