/*
Theme Name: WT Bazaar
Theme URI: https://webmasters.team/themes/wt-bazaar/
Author: webmasters.team
Author URI: https://webmasters.team/en/
Description: A lightweight, dependency-free WooCommerce theme. Built on the native WordPress Customizer with no page-builder or customizer-framework plugins required. Includes a configurable shop layout, product image zoom, a lean homepage (hero, promo boxes, product sections) and a system-font stack for fast, privacy-friendly loading.
Version: 1.0.1
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wt-bazaar
Tags: two-columns, right-sidebar, left-sidebar, custom-logo, custom-menu, custom-colors, featured-images, footer-widgets, theme-options, threaded-comments, translation-ready, e-commerce, full-width-template, block-styles

WT Bazaar WordPress Theme, (C) 2026 webmasters.team.
WT Bazaar is distributed under the terms of the GNU GPL v2 or later.
*/

/* -------------------------------------------------------------------------
 * Design tokens (overridden by the Customizer via wp_add_inline_style).
 * ---------------------------------------------------------------------- */
:root {
	--wtb-color-primary: #1f6feb;
	--wtb-color-accent: #d6336c;
	--wtb-color-text: #1c1e21;
	--wtb-color-muted: #6b7280;
	--wtb-color-bg: #ffffff;
	--wtb-color-surface: #f6f7f9;
	--wtb-color-border: #e4e7eb;

	--wtb-font-body: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--wtb-font-heading: var(--wtb-font-body);

	--wtb-container: 1200px;
	--wtb-radius: 8px;
	--wtb-gap: 24px;
}

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

body {
	margin: 0;
	font-family: var(--wtb-font-body);
	font-size: 16px;
	line-height: 1.6;
	color: var(--wtb-color-text);
	background-color: var(--wtb-color-bg);
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--wtb-font-heading);
	line-height: 1.25;
	margin: 0 0 0.5em;
	overflow-wrap: break-word;
	word-wrap: break-word;
}

.entry-title,
.wtb-hero-heading,
.wtb-section-title,
.wtb-page-title {
	overflow-wrap: break-word;
	word-wrap: break-word;
	hyphens: auto;
}

a {
	color: var(--wtb-color-primary);
	text-decoration: none;
}

a:hover,
a:focus {
	text-decoration: underline;
}

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

/* -------------------------------------------------------------------------
 * Layout
 * ---------------------------------------------------------------------- */
.wtb-container {
	width: 100%;
	max-width: var(--wtb-container);
	margin-inline: auto;
	padding-inline: var(--wtb-gap);
}

.wtb-site-content {
	padding-block: 40px;
}

.wtb-content-area {
	display: grid;
	gap: var(--wtb-gap);
}

/* Allow grid columns to shrink so long content wraps instead of overflowing. */
.wtb-content-area > * {
	min-width: 0;
}

@media (min-width: 782px) {
	.wtb-has-sidebar .wtb-content-area {
		grid-template-columns: minmax(0, 1fr) 300px;
	}

	.wtb-has-sidebar.wtb-sidebar-left .wtb-content-area {
		grid-template-columns: 300px minmax(0, 1fr);
	}

	.wtb-has-sidebar.wtb-sidebar-left .wtb-primary {
		order: 2;
	}
}

/* -------------------------------------------------------------------------
 * Header
 * ---------------------------------------------------------------------- */
.wtb-site-header {
	border-bottom: 1px solid var(--wtb-color-border);
	background-color: var(--wtb-color-bg);
}

.wtb-header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wtb-gap);
	padding-block: 18px;
}

.wtb-site-title {
	font-size: 1.5rem;
	margin: 0;
}

.wtb-site-title a {
	color: var(--wtb-color-text);
}

.wtb-site-description {
	margin: 0;
	color: var(--wtb-color-muted);
	font-size: 0.875rem;
}

/* Navigation */
.wtb-primary-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.wtb-primary-nav > ul {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	align-items: center;
}

.wtb-primary-nav a {
	color: var(--wtb-color-text);
	font-weight: 500;
}

/* Sub-menus (dropdowns) — covers wp_nav_menu (.sub-menu) and wp_list_pages (.children). */
.wtb-primary-nav .menu-item-has-children > a::after,
.wtb-primary-nav .page_item_has_children > a::after {
	content: "\25be";
	margin-left: 4px;
	font-size: 0.75em;
}

@media (min-width: 782px) {
	.wtb-primary-nav li {
		position: relative;
	}

	.wtb-primary-nav .sub-menu,
	.wtb-primary-nav .children {
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 1000;
		min-width: 210px;
		display: none;
		padding: 8px 0;
		background: var(--wtb-color-bg);
		border: 1px solid var(--wtb-color-border);
		border-radius: var(--wtb-radius);
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.09);
	}

	.wtb-primary-nav .sub-menu .sub-menu,
	.wtb-primary-nav .children .children {
		top: 0;
		left: 100%;
	}

	.wtb-primary-nav li:hover > .sub-menu,
	.wtb-primary-nav li:focus-within > .sub-menu,
	.wtb-primary-nav li:hover > .children,
	.wtb-primary-nav li:focus-within > .children {
		display: block;
	}

	.wtb-primary-nav .sub-menu a,
	.wtb-primary-nav .children a {
		display: block;
		padding: 8px 16px;
		white-space: nowrap;
	}
}

/* -------------------------------------------------------------------------
 * Buttons
 * ---------------------------------------------------------------------- */
.wtb-button,
button,
input[type="submit"] {
	display: inline-block;
	padding: 10px 20px;
	border: 0;
	border-radius: var(--wtb-radius);
	background-color: var(--wtb-color-primary);
	color: #fff;
	font: inherit;
	cursor: pointer;
	text-decoration: none;
}

.wtb-button:hover,
.wtb-button:focus {
	text-decoration: none;
	opacity: 0.92;
}

/* -------------------------------------------------------------------------
 * Footer
 * ---------------------------------------------------------------------- */
.wtb-site-footer {
	border-top: 1px solid var(--wtb-color-border);
	background-color: var(--wtb-color-surface);
	padding-block: 40px 24px;
}

.wtb-footer-widgets {
	display: grid;
	gap: var(--wtb-gap);
}

@media (min-width: 600px) {
	.wtb-footer-widgets.wtb-cols-2 { grid-template-columns: repeat(2, 1fr); }
	.wtb-footer-widgets.wtb-cols-3 { grid-template-columns: repeat(3, 1fr); }
	.wtb-footer-widgets.wtb-cols-4 { grid-template-columns: repeat(4, 1fr); }
}

.wtb-site-info {
	margin-top: 24px;
	padding-top: 18px;
	border-top: 1px solid var(--wtb-color-border);
	color: var(--wtb-color-muted);
	font-size: 0.875rem;
	text-align: center;
}

.wtb-credits {
	margin-top: 8px;
	color: var(--wtb-color-muted);
	font-size: 0.8rem;
	text-align: center;
}

.wtb-credits a {
	color: var(--wtb-color-muted);
	text-decoration: underline;
}

.wtb-credits a:hover,
.wtb-credits a:focus {
	color: var(--wtb-color-primary);
}

.wtb-credits .wtb-sep {
	opacity: 0.6;
}

/* -------------------------------------------------------------------------
 * Accessibility
 * ---------------------------------------------------------------------- */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	word-wrap: normal !important;
}

.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100000;
	padding: 12px 18px;
	background: #fff;
	color: var(--wtb-color-primary);
}

.skip-link:focus {
	clip: auto !important;
	clip-path: none;
	left: 6px;
	top: 6px;
	height: auto;
	width: auto;
	overflow: visible;
	outline: 2px solid var(--wtb-color-primary);
}

/* -------------------------------------------------------------------------
 * Top bar / banner / header search (Customizer-driven regions)
 * ---------------------------------------------------------------------- */
.wtb-topbar {
	background-color: var(--wtb-color-surface);
	border-bottom: 1px solid var(--wtb-color-border);
	font-size: 0.85rem;
}

.wtb-topbar-inner {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	align-items: center;
	padding-block: 8px;
}

.wtb-topbar a {
	color: var(--wtb-color-muted);
}

.wtb-banner-img {
	display: block;
	width: 100%;
	height: auto;
}

.wtb-header-search form {
	display: flex;
	gap: 6px;
	align-items: center;
}

/* -------------------------------------------------------------------------
 * WooCommerce header cart + breadcrumbs
 * ---------------------------------------------------------------------- */
.wtb-header-cart {
	display: flex;
	align-items: center;
}

.wtb-cart-link {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--wtb-color-text);
	font-weight: 500;
}

.wtb-cart-link .dashicons {
	font-size: 22px;
	width: 22px;
	height: 22px;
}

.wtb-cart-count {
	min-width: 20px;
	padding: 1px 6px;
	border-radius: 999px;
	background-color: var(--wtb-color-accent);
	color: #fff;
	font-size: 0.75rem;
	line-height: 1.5;
	text-align: center;
}

.woocommerce-breadcrumb {
	margin-bottom: var(--wtb-gap);
	color: var(--wtb-color-muted);
	font-size: 0.875rem;
}

/* -------------------------------------------------------------------------
 * Typography scale & shared elements
 * ---------------------------------------------------------------------- */
h1 { font-size: clamp(1.8rem, 1.2rem + 2.4vw, 2.6rem); }
h2 { font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2rem); }
h3 { font-size: 1.25rem; }

p { margin: 0 0 1em; }

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
textarea,
select {
	width: 100%;
	max-width: 100%;
	padding: 9px 12px;
	border: 1px solid var(--wtb-color-border);
	border-radius: var(--wtb-radius);
	background: #fff;
	color: var(--wtb-color-text);
	font: inherit;
}

input:focus,
textarea:focus,
select:focus,
a:focus,
button:focus {
	outline: 2px solid var(--wtb-color-primary);
	outline-offset: 2px;
}

.wtb-button--ghost {
	background: transparent;
	border: 2px solid currentColor;
	color: inherit;
}

/* -------------------------------------------------------------------------
 * Header layout (responsive) + mobile navigation
 * ---------------------------------------------------------------------- */
.wtb-header-inner {
	flex-wrap: wrap;
}

.wtb-site-branding {
	margin-right: auto;
}

.wtb-menu-toggle {
	display: none;
	background: transparent;
	color: var(--wtb-color-text);
	border: 1px solid var(--wtb-color-border);
	padding: 8px 14px;
}

@media (max-width: 781px) {
	.wtb-menu-toggle {
		display: inline-block;
	}

	.wtb-primary-nav {
		order: 3;
		width: 100%;
	}

	.wtb-primary-nav > ul {
		display: none;
		flex-direction: column;
		gap: 0;
		width: 100%;
		padding-top: 10px;
	}

	.wtb-primary-nav.wtb-nav-open > ul {
		display: flex;
	}

	.wtb-primary-nav > ul > li {
		border-top: 1px solid var(--wtb-color-border);
	}

	.wtb-primary-nav a {
		display: block;
		padding: 10px 0;
	}

	.wtb-primary-nav .sub-menu,
	.wtb-primary-nav .children {
		padding-left: 16px;
	}
}

/* -------------------------------------------------------------------------
 * Full-bleed homepage sections
 * ---------------------------------------------------------------------- */
#page {
	overflow-x: hidden;
}

.wtb-section {
	position: relative;
	left: 50%;
	right: 50%;
	width: 100vw;
	margin-left: -50vw;
	margin-right: -50vw;
}

body.home .wtb-site-content {
	padding-block: 0;
}

.wtb-hero,
.wtb-promos,
.wtb-product-section {
	padding-block: 56px;
}

.wtb-product-section:nth-of-type(even) {
	background-color: var(--wtb-color-surface);
}

/* Hero */
.wtb-hero {
	background-color: var(--wtb-color-surface);
	text-align: center;
}

.wtb-hero--image {
	background-size: cover;
	background-position: center;
	color: #fff;
	padding-block: 96px;
}

.wtb-hero--image::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.45);
}

.wtb-hero-inner {
	position: relative;
}

.wtb-hero-heading {
	margin-bottom: 0.3em;
}

.wtb-hero-text {
	max-width: 620px;
	margin-inline: auto;
	font-size: 1.125rem;
}

.wtb-hero-actions {
	display: flex;
	gap: 14px;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 24px;
}

/* Promo boxes */
.wtb-promos-grid {
	display: grid;
	gap: var(--wtb-gap);
	grid-template-columns: 1fr;
}

@media (min-width: 600px) {
	.wtb-promos-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

.wtb-promo {
	display: block;
	padding: 28px 24px;
	border: 1px solid var(--wtb-color-border);
	border-radius: var(--wtb-radius);
	background: #fff;
	color: inherit;
	text-align: center;
}

a.wtb-promo:hover,
a.wtb-promo:focus {
	text-decoration: none;
	border-color: var(--wtb-color-primary);
}

.wtb-promo-icon {
	font-size: 40px;
	width: 40px;
	height: 40px;
	color: var(--wtb-color-primary);
}

.wtb-promo-title {
	margin: 12px 0 6px;
}

.wtb-promo-text {
	margin: 0;
	color: var(--wtb-color-muted);
}

/* Product section headings */
.wtb-section-title {
	text-align: center;
	margin-bottom: 32px;
}

/* -------------------------------------------------------------------------
 * WooCommerce
 * ---------------------------------------------------------------------- */
.woocommerce ul.products,
ul.products {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--wtb-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 600px) {
	.woocommerce ul.products.columns-3 { grid-template-columns: repeat(3, 1fr); }
	.woocommerce ul.products.columns-4 { grid-template-columns: repeat(4, 1fr); }
	.woocommerce ul.products.columns-5 { grid-template-columns: repeat(5, 1fr); }
	.woocommerce ul.products.columns-6 { grid-template-columns: repeat(6, 1fr); }
}

.woocommerce ul.products li.product,
ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	float: none !important;
	position: relative;
	padding: 16px;
	border: 1px solid var(--wtb-color-border);
	border-radius: var(--wtb-radius);
	background: #fff;
	text-align: center;
}

.woocommerce ul.products li.product a img {
	margin: 0 auto 12px;
	border-radius: calc(var(--wtb-radius) - 2px);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-size: 1rem;
	padding: 0;
}

.woocommerce ul.products li.product .price {
	color: var(--wtb-color-text);
	font-weight: 600;
}

.woocommerce ul.products li.product .price del {
	color: var(--wtb-color-muted);
	font-weight: 400;
	margin-right: 6px;
}

.woocommerce span.onsale {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 1;
	min-height: auto;
	min-width: auto;
	margin: 0;
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--wtb-color-accent);
	color: #fff;
	font-size: 0.75rem;
	line-height: 1.4;
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
	background-color: var(--wtb-color-primary);
	color: #fff;
	border-radius: var(--wtb-radius);
	padding: 10px 18px;
	font: inherit;
	font-weight: 500;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover {
	opacity: 0.92;
}

/* Single product */
@media (min-width: 782px) {
	.woocommerce div.product {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 40px;
		align-items: start;
	}

	.woocommerce div.product .woocommerce-tabs,
	.woocommerce div.product .related,
	.woocommerce div.product .upsells {
		grid-column: 1 / -1;
	}
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
	color: var(--wtb-color-primary);
	font-size: 1.5rem;
}

/* Shop tables (cart / checkout / account) */
.woocommerce table.shop_table {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid var(--wtb-color-border);
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
	padding: 12px;
	border-bottom: 1px solid var(--wtb-color-border);
	text-align: left;
}

.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error {
	padding: 12px 16px;
	border-radius: var(--wtb-radius);
	border-left: 4px solid var(--wtb-color-primary);
	background: var(--wtb-color-surface);
	list-style: none;
}

.woocommerce .woocommerce-error {
	border-left-color: var(--wtb-color-accent);
}

.woocommerce-result-count,
.woocommerce-ordering {
	margin-bottom: var(--wtb-gap);
}

/* -------------------------------------------------------------------------
 * Blog / entries
 * ---------------------------------------------------------------------- */
.wtb-entry {
	padding-bottom: 32px;
	margin-bottom: 32px;
	border-bottom: 1px solid var(--wtb-color-border);
}

.wtb-entry:last-child {
	border-bottom: 0;
}

.entry-title {
	margin-bottom: 0.3em;
}

.entry-title a {
	color: var(--wtb-color-text);
}

.entry-meta {
	margin-bottom: 1em;
	color: var(--wtb-color-muted);
	font-size: 0.875rem;
}

.post-thumbnail {
	margin: 0 0 18px;
}

.post-thumbnail img {
	border-radius: var(--wtb-radius);
}

.entry-footer {
	margin-top: 1em;
	color: var(--wtb-color-muted);
	font-size: 0.875rem;
}

.wtb-page-header {
	margin-bottom: 32px;
}

.pagination,
.navigation.pagination {
	margin-top: 32px;
}

.nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.nav-links .page-numbers {
	display: inline-block;
	padding: 8px 14px;
	border: 1px solid var(--wtb-color-border);
	border-radius: var(--wtb-radius);
}

.nav-links .page-numbers.current {
	background: var(--wtb-color-primary);
	color: #fff;
	border-color: var(--wtb-color-primary);
}

/* Widgets */
.widget {
	margin-bottom: 32px;
}

.widget-title {
	font-size: 1.1rem;
	margin-bottom: 14px;
	padding-bottom: 8px;
	border-bottom: 2px solid var(--wtb-color-border);
}

.wtb-footer-column .widget-title {
	color: inherit;
}

/* Comments */
.comment-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.comment-list .comment-body {
	padding: 16px 0;
	border-bottom: 1px solid var(--wtb-color-border);
}

/* WordPress required helper classes */
.alignleft { float: left; margin-right: 1.5em; }
.alignright { float: right; margin-left: 1.5em; }
.aligncenter { display: block; margin-inline: auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text { text-align: center; }
.sticky { display: block; }
.gallery-caption { display: block; }
.bypostauthor { display: block; }
