/* В этом файле будут храниться все значения переменных в исходном состоянии, а так же их изменения в зависимости от ширины устройства */

:root {
  --main-font: "Inter";
  --accent-font: "Press Start 2P";
  --tittle-card-weight: 715;
  --text-card-weight: 410;
  --bg-gradient:
    repeating-linear-gradient(
      0deg,
      #d3d3d3 0,
      #d3d3d3 2px,
      transparent 2px,
      transparent 4px
    ),
    repeating-linear-gradient(
      90deg,
      #d3d3d3 0,
      #d3d3d3 2px,
      transparent 2px,
      transparent 4px
    ),
    linear-gradient(180deg, #e7e7e7 0%, #e7e7e7 0.01%, #1a1a1a 100%);
  --container-width: clamp(280px, 100vw, 700px);
  --header-height: clamp(327px, calc(300px + 4.44vw), 368px);
  --header-logo-size: clamp(49px, 6vw, 65px);
  --header-text-size: clamp(14px, 4vw, 23px);
  --header-block-inset: clamp(122px, 20%, 130px);
  --header-inline-inset: clamp(16px, 2vw, 492.5px);
  --floppy-inline-size: clamp(341px, 50vw, 353px);
  --dialog-width: clamp(calc(100%-17px), 50vw, calc(100%-543.5px));

  --text-stroke-color: #ffffff;
  --accent-color: #000000;

  --heart-contour: #000000;
  --animation-fill-color: #ff0000;

  --lable-text-color: #000000;

  --box-background: #ffffff;
  --box-bg-invers: #000000;

  --font-size-main: 18px;
  --font-size-s: 14px;

  --margin-s: 10px;
  --margin-m: 20px;
  --margin-l: 25px;
  --inset-big: 30px;
  --button-gap: 6px;

  --button-width: 130px;
  --button-height: 38px;

  --ok-button-w: 39px;
  --ok-button-h: 39px;

  --save-button-w: 21px;
  --save-button-h: 21px;

  --icon-w: 33px;
  --icon-h: 33px;
}