/**
 * Teevora Master Stylesheet Aggregator
 */

/* 1. Base Tokens, Reset & Typography */
@import url('base/variables.css');
@import url('base/reset.css');
@import url('base/typography.css');

/* 2. Core Components */
@import url('components/buttons.css');
@import url('components/forms.css');
@import url('components/header.css');
@import url('components/footer.css');
@import url('components/product-card.css');
@import url('components/search-modal.css');
@import url('components/drawer-cart.css');

/* 3. Page Layouts & Templates */
@import url('pages/front-page.css');
@import url('pages/archive-product.css');
@import url('pages/single-product.css');
@import url('pages/cart.css');
@import url('pages/checkout.css');
@import url('pages/account.css');

/* -------------------------------------------------------------------------- */
/* GLOBAL CONTAINER & LAYOUT SYSTEM                                           */
/* -------------------------------------------------------------------------- */
.tv-container {
	max-width: var(--tv-container-max);
	margin-left: auto;
	margin-right: auto;
	padding-left: 24px;
	padding-right: 24px;
	width: 100%;
}

.tv-container-narrow {
	max-width: 820px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 24px;
	padding-right: 24px;
	width: 100%;
}

.tv-container-fluid {
	width: 100%;
	padding-left: 24px;
	padding-right: 24px;
}

/* Layout Utilities */
.tv-flex {
	display: flex;
}

.tv-flex-center {
	display: flex;
	align-items: center;
	justify-content: center;
}

.tv-flex-between {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.tv-grid-2 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
}

.tv-grid-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.tv-grid-4 {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

@media (max-width: 991px) {
	.tv-grid-4,
	.tv-grid-3 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px) {
	.tv-grid-4,
	.tv-grid-3,
	.tv-grid-2 {
		grid-template-columns: 1fr;
	}

	.tv-container,
	.tv-container-narrow,
	.tv-container-fluid {
		padding-left: 16px;
		padding-right: 16px;
	}
}
