/*
Theme Name: Ghorer Inspired
Theme URI: https://github.com/ghorer-inspired/ghorer-inspired
Author: Ghorer Inspired
Author URI: https://github.com/ghorer-inspired/ghorer-inspired
Description: A premium grocery & natural-products storefront theme for WooCommerce, inspired by the shopping experience of leading Bangladeshi online grocery stores. Includes a hero slider, featured category grid, best-selling product rows, category product sections, brand showcase, testimonials, trust badges, AJAX mini-cart drawer, live search and a configurable mobile bottom navigation. Requires the free WooCommerce plugin for shop functionality.
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ghorer-inspired
Tags: e-commerce, one-column, two-columns, custom-colors, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, wide-blocks
WC requires at least: 7.0
WC tested up to: 9.4
*/

/* =========================================================
   1. Design tokens
   ========================================================= */
:root {
	--gb-primary: #158b4a;
	--gb-primary-dark: #0d6b37;
	--gb-primary-soft: #e7f4ec;
	--gb-accent: #f5a623;
	--gb-accent-soft: #fef3e0;
	--gb-sale: #e23f3f;
	--gb-ink: #1f2a24;
	--gb-ink-soft: #55645b;
	--gb-muted: #8a968e;
	--gb-bg: #ffffff;
	--gb-bg-soft: #f6f8f5;
	--gb-bg-warm: #fbfaf6;
	--gb-border: #e5eae4;
	--gb-border-strong: #d3dcd2;

	--gb-radius-sm: 8px;
	--gb-radius: 12px;
	--gb-radius-lg: 18px;
	--gb-shadow-sm: 0 1px 2px rgba(23, 35, 28, 0.06);
	--gb-shadow: 0 10px 28px -14px rgba(23, 35, 28, 0.22);
	--gb-shadow-lg: 0 24px 48px -20px rgba(23, 35, 28, 0.28);

	--gb-container: 1240px;
	--gb-gutter: 20px;
	--gb-topbar-h: 42px;

	--gb-font: 'Inter', 'Hind Siliguri', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
	--gb-transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* =========================================================
   2. Reset & base
   ========================================================= */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background: var(--gb-bg);
	color: var(--gb-ink);
	font-family: var(--gb-font);
	font-size: 15px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}

img,
picture,
video,
svg {
	max-width: 100%;
	height: auto;
	display: block;
}

figure {
	margin: 0;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--gb-font);
	color: var(--gb-ink);
	line-height: 1.25;
	margin: 0 0 0.6em;
	font-weight: 700;
	letter-spacing: -0.01em;
}

h1 { font-size: clamp(24px, 3vw, 34px); }
h2 { font-size: clamp(20px, 2.4vw, 28px); }
h3 { font-size: 19px; }
h4 { font-size: 17px; }

p {
	margin: 0 0 1.1em;
}

a {
	color: var(--gb-primary-dark);
	text-decoration: none;
	transition: color var(--gb-transition);
}

a:hover {
	color: var(--gb-primary);
}

ul, ol {
	margin: 0;
	padding: 0;
}

ul {
	list-style: none;
}

button,
input,
select,
textarea {
	font-family: inherit;
	font-size: inherit;
	color: inherit;
}

table {
	border-collapse: collapse;
	width: 100%;
}

:focus-visible {
	outline: 2px solid var(--gb-primary);
	outline-offset: 2px;
	border-radius: 4px;
}

::selection {
	background: var(--gb-primary);
	color: #fff;
}

.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;
	background: var(--gb-primary);
	color: #fff;
	padding: 10px 18px;
	border-radius: 0 0 8px 0;
}

.skip-link:focus {
	left: 0;
	color: #fff;
}

/* Layout helpers */
.gb-container {
	width: 100%;
	max-width: var(--gb-container);
	margin: 0 auto;
	padding: 0 var(--gb-gutter);
}

.gb-text-center { text-align: center; }
.gb-hidden { display: none !important; }

/* Aligned wide content in posts */
.alignwide {
	margin-left: -40px;
	margin-right: -40px;
	max-width: calc(100% + 80px);
	width: calc(100% + 80px);
}

.alignfull {
	margin-left: calc(-1 * max(0px, (100vw - 100%) / 2));
	margin-right: calc(-1 * max(0px, (100vw - 100%) / 2));
	max-width: 100vw;
	width: 100vw;
}

@media (max-width: 991px) {
	.alignwide {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
		max-width: 100%;
	}
}