/* Уход с Vue V3 (аудит PROD №6): часть старых стилей в начале списка (на месте main.css и плагинов). Собрано из старого шаблона specialty по покрытию CSS страниц v2 (PROD 07.11 гостем; ЛК и корзина с товарами - dev2)
   (правила, которые применялись, и их состояния :hover/:focus); пути url() - абсолютные в папку старого шаблона. Не править вручную без сверки «как на PROD». */

/* ---- /local/templates/specialty/custom_vue.css: 1 из 4 правил */
.breadcrumbs{justify-content: flex-start;}

/* ---- /local/templates/specialty/plugins/swiper-bundle.min.css: 2 из 127 правил */
:root{--swiper-theme-color:#007aff}
:root{--swiper-navigation-size:44px}

/* ---- /local/templates/specialty/main.css: 10 из 1408 правил */
:root {
  --black: #212121;
  --white: #ffffff;
  --dark-gray: #777880;
  --dark-gray-2: #575555;
  --gray: #B8B3B3;
  --light-gray: #D6D2D2;
  --extra-light-gray: #E8E7ED;
  --validation: #FFC329;
  --error: #FF122E;
  --success: #83C83E;

  /* MAIN COLORS*/
  --main-blue: #6667AB;
  --main-gray: #F9F7F6;
  --main-light-blue: #F4F4FF;

  /* Secondary Pallette */
  --second-pink: #FF374F;
  --second-pink-light: #FF7E7E;
  --second-green: #97C06F;
  --second-green-light: #A9D97A;
  --second-yellow: #FFC329;
  --second-dark-gray: #9C968F;

  /* BG COLORS */
  --bg-white: #FFFFFF;
  --bg-disabled: #EDEAE7;
  --bg-light-gray: #F6F6F9;
  --bg-menu: #F6F4F2;

  /* STROKE COLORS*/
  --stroke-gray-dark: #D6D2D2;
  --stroke-gray-light: #EFEEEE;
  --stroke-gray-normal: #ECECEC;
  --stroke-focused: #212121;

  /* TEXT COLORS */
  --text-black: #212121;
  --text-white: #FFFFFF;
  --text-dark-gray: #777880;
  --text-light-gray: #D6D2D2;
  --text-gray: #B8B3B3;
  --text-disabled: #B8B3B3;
  --text-validation: #FFC329;
  --text-error: #FF122E;
  --text-success: #83C83E;

  /* BUTTON COLORS */
  --btn-violet-default: #6667AB;
  --btn-violet-hover: #55569B;
  --btn-violet-focused: #58599D;
  --btn-violet-active: #6667AB;
  --btn-violet-click: #4A4A8C;
  --btn-violet-disabled: #F2F3FB;
  --btn-violet-disabled-text: #B8B8E5;

  --btn-stroke-default: #6667AB;
  --btn-stroke-focused: #212121;
  --btn-stroke-hover: #55569B;

  --btn-white: #fff;

  /* FIELDS COLOR */
  --field-stroke-hover: #6667AB;
  --field-stroke-focused: #212121;
  --field-stroke-validation: #FFE5A2;
  --field-stroke-loading: #6667AB;
  --field-stroke-error: #FFBAC3;
  --field-stroke-success: #EFEEEE;
  --field-title: #B8B3B3;
  --field-text: #777780;
  --field-text-disable: #B8B3B3;
  --field-description: #807777;
  --field-white: #fff;

  /* SCROLL BAR COLORS */
  --scrollbar-color: #EBEBFD #fff;


  --width-container: 1200px;
  --gap-half: 24px;
  --gap: calc(var(--gap-half) * 2);
  --column-gap: 16px;
  --column-gap-half: calc(var(--column-gap) / 2);

  /* BREAKPOINTS */
  --mob: 320px;
  --tablet: 640px;
  --tablet-big: 960px;
  --desktop: 1280px;

  --mob-max: calc(var(--tablet) - 1px);
  --tablet-max: calc(var(--tablet-big) - 1px);
  --tablet-big-max: calc(var(--desktop) - 1px);

  /* FONTS */
  --font: 'Montserrat', sans-serif;

  --title-h1: 600 24px/110% var(--font);

  --font-body1: 400 16px/130% var(--font);
  --font-body2: 400 14px/130% var(--font);
  --font-body3: 400 12px/130% var(--font);
  --font-body4: 400 12px/130% var(--font);

}
@media screen and (min-width: 640px) {
:root {
    --gap-half: 32px;
    --column-gap: 24px;

    /* FONTS */
    --title-h1: 600 28px/120% var(--font);

    --font-body1: 400 16px/130% var(--font);
    --font-body2: 400 14px/130% var(--font);
    --font-body3: 400 12px/130% var(--font);
  }
}
@media screen and (min-width: 960px) {
:root {

  }
}
@media screen and (min-width: 1280px) {
:root {
    /* FONTS */
    --title-h1: 600 40px/110% var(--font);

    --font-body1: 400 18px/140% var(--font);
    --font-body2: 400 16px/140% var(--font);
    --font-body3: 400 14px/140% var(--font);
    --font-body4: 400 13px/120% var(--font);
  }
}
*,
*:before,
*:after {
  box-sizing: border-box;
}
html {
  overflow-x: initial !important;
}
body *,
body *:focus {
  outline: initial !important;
}
body {
  font-family: var(--font) !important;
  background-color: #FAFAFA !important;
}
.container {
  max-width: var(--width-container) !important;
}
.container, body, html {
  min-width: initial !important;
}
