/*
Theme Name: Shopito Theme
Theme URI: https://shopito.rs
Author: Shopito
Description: Novi Shopito frontend (WooCommerce).
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: shopito-theme
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: e-commerce, woocommerce, custom-menu
*/

@charset "UTF-8";

/* Global width
  Design content width + 10px left + 10px right (box-sizing: border-box).
  Example: design 1386 → CSS width 1406.
  Add extra boxed-* variants only when a new width appears.
*/
/*------------------------------------------*/

:root {
	--global-width-boxed: 1406px; /* 1386 + 20 */
	--global-width-boxed-2: 1340px; /* 1320 + 20 */
	--global-width-full: 100%;
}

/*Global font family*/
/*------------------------------------------*/

:root {
	--global-font-family-1: "Montserrat", sans-serif;
}

/* Breakpoints reference
   Mobile:  max-width 767px
   Tablet + mobile shared base: max-width 1023px
   Desktop: 1024px +
   Order: write max-width 1023 first, then max-width 767 overrides.
*/

/*Website styles*/
/*------------------------------------------*/

*,
*::before,
*::after {
	box-sizing: border-box;
}

body {
	margin: 0;
	font-family: var(--global-font-family-1);
	padding-top: 0;
}

@media (max-width: 767px) {
	html,
	body {
		max-width: 100%;
		overflow-x: hidden;
	}
}

img {
	max-width: 100%;
	height: auto;
}

.page-width-boxed {
	width: var(--global-width-boxed);
	max-width: 100%;
	padding-left: 10px;
	padding-right: 10px;
	box-sizing: border-box;
}

@media (max-width: 1406px) {
	.page-width-boxed {
		width: 100%;
	}
}

.page-width-boxed-2 {
	width: var(--global-width-boxed-2);
	max-width: 100%;
	padding-left: 10px;
	padding-right: 10px;
	box-sizing: border-box;
}

@media (max-width: 1340px) {
	.page-width-boxed-2 {
		width: 100%;
	}
}

.page-width-full {
	width: var(--global-width-full);
	max-width: 100%;
}