/** Цвета по названиям **/

:root {
	/* Основные */
	--color-white: #ffffff;

	/* Основные :hover */
	--color-blue-hover: var(--color-blue-dark);

/* Дополнительные */
	--color-gray-input-text: #5f5f5f;
}

/** Цвета по назначению **/

:root {
	--color-danger: var(--color-red);
	--color-warning: var(--color-yellow);
	--color-success: var(--color-green);
	--color-primary: var(--color-blue);

	--color-section-top-border: #f2f2f2;
	--color-product-item-border: #eeeeee;
}



/** OWL **/
:root {
	--owl-gallery-nav-size: 50px;
	--owl-gallery-nav-border-radius: 50%;
	--owl-gallery-dots-height: 42px;
}



/** Отступы **/
:root {
    --page-section-padding: 40px;

	 --owl-gallery-nav-size: 50px;
	 --owl-gallery-nav-border-radius: 50%;
	 --owl-gallery-dots-height: 42px;	 
}

@media (min-width: 576px) {
    :root {
        --page-section-padding: 40px;
    }
}

@media (min-width: 768px) {
    :root {
        --page-section-padding: 60px;
    }
}

/** Эффекты **/
:root {
--products-item-hover-shadow: 0px 8px 32px rgba(27,30,37,0.25);
}



/* Для справки брейкпоинты в BS 4, но ещё плюс одна нужна 412 */

/*
   412px;
   sn: 576px;
   md: 768px;
   lg: 992px;
   xl: 1200px;
*/