@import url('./main-layout.css');
@import url('./views/departments-view.css');
@import url('./views/users-view.css');

@font-face {
  font-family: 'Roboto'; /* Используем одно и то же имя семейства для разных начертаний */
  src: url('./fonts/Roboto-Light.ttf') format('truetype'); /* Путь к файлу шрифта */
  font-weight: 300; /* Соответствует Light */
  font-style: normal;
}

/* Определение шрифта Roboto SemiBold Italic */
@font-face {
  font-family: 'Roboto'; /* То же имя семейства */
  src: url('./fonts/Roboto-SemiBoldItalic.ttf') format('truetype'); /* Путь к файлу шрифта */
  font-weight: 600; /* Соответствует SemiBold */
  font-style: italic; /* Соответствует Italic */
}



/* Применение шрифта глобально */
html {
  --lumo-font-family: "Roboto", sans-serif; /* Используем имя семейства, определенное выше */
}

/* Опционально: можно применить шрифт и к body */
body {
   font-family: "Roboto", sans-serif;
}

:host {
  /* Базовый размер с динамическим ростом */
  --lumo-font-size: clamp(1rem, 1.2vw + 0.8rem, 1.5rem);

  /* Размеры с адаптацией */
  --lumo-size-m: clamp(2rem, 5vw + 1rem, 3rem);
}

/* Форсированное увеличение только для десктопа */
@media (min-width: 1280px) {
  :host {
    --lumo-font-size: 1.375rem;
    --lumo-size-m: 3.25rem;
  }

  /* Увеличенные карточки */
  .xl-card {
    padding: 2.5rem;
    font-size: 1.1em;
  }
}