/*
Theme Name: FLAMTEES
Theme URI: https://flamtees.com
Author: FLAMTEES
Author URI: https://flamtees.com
Description: A custom premium WooCommerce theme built for the FLAMTEES streetwear brand.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: flamtees
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: ecommerce, woocommerce, fashion, streetwear, responsive, custom-logo, featured-images
*/

/* ==========================================================================
   FLAMTEES Theme Root Variables
   ========================================================================== */

:root {
	--flamtees-color-primary: #5793bd;
	--flamtees-color-secondary: #8ecbc4;
	--flamtees-color-text: #111111;
	--flamtees-color-muted: #6b7280;
	--flamtees-color-background: #ffffff;
	--flamtees-color-surface: #f7f7f7;
	--flamtees-color-border: #e5e7eb;

	--flamtees-font-primary: "Manrope", Arial, sans-serif;

	--flamtees-container-width: 1440px;
	--flamtees-container-padding: 24px;

	--flamtees-radius-small: 6px;
	--flamtees-radius-medium: 12px;
	--flamtees-radius-large: 20px;

	--flamtees-transition-fast: 180ms ease;
	--flamtees-transition-normal: 300ms ease;
}

/* ==========================================================================
   Base Reset
   ========================================================================== */

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

html {
	scroll-behavior: smooth;
}

html,
body {
	margin: 0;
	color: var(--flamtees-color-text);
	background-color: var(--flamtees-color-background);
	font-family: var(--flamtees-font-primary);
	font-weight: 400;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}

/* FLAMTEES scrollbars: visible on white pages and inside scrollable galleries. */
html,
body,
body * {
	scrollbar-color: var(--flamtees-color-primary, #5793bd) #e8f0f5;
	scrollbar-width: thin;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
body *::-webkit-scrollbar {
	width: 12px;
	height: 8px;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
body *::-webkit-scrollbar-track {
	background: #e8f0f5;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
body *::-webkit-scrollbar-thumb {
	min-height: 38px;
	border: 3px solid #e8f0f5;
	border-radius: 999px;
	background: var(--flamtees-color-primary, #5793bd);
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
body *::-webkit-scrollbar-thumb:hover {
	background: #315f80;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs::-webkit-scrollbar {
	width: 8px;
	height: 7px;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs::-webkit-scrollbar-thumb {
	border: 1px solid #e8f0f5;
}

/* Strong final override for Windows/Chromium: keep the draggable scrollbar
	thumb clearly visible instead of rendering it as a thin white sliver. */
html,
body,
body * {
	scrollbar-width: auto !important;
	scrollbar-color: #5793bd #dcecf4 !important;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
body *::-webkit-scrollbar {
	width: 16px !important;
	height: 12px !important;
	background: #dcecf4 !important;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
body *::-webkit-scrollbar-track {
	border-radius: 999px !important;
	background: #dcecf4 !important;
	box-shadow: inset 0 0 0 1px #c7dde9 !important;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
body *::-webkit-scrollbar-thumb {
	min-width: 44px !important;
	min-height: 54px !important;
	border: 2px solid #dcecf4 !important;
	border-radius: 999px !important;
	background-color: #5793bd !important;
	background-image: none !important;
	box-shadow: inset 0 0 0 1px rgba(23,56,79,.16) !important;
}

html::-webkit-scrollbar-thumb:hover,
html::-webkit-scrollbar-thumb:active,
body::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:active,
body *::-webkit-scrollbar-thumb:hover,
body *::-webkit-scrollbar-thumb:active {
	background-color: #315f80 !important;
}

body,
body p,
body li,
body a,
body span,
body div,
body table,
body th,
body td,
body button,
body input,
body select,
body textarea,
body label,
body .woocommerce,
body .woocommerce-page {
	font-family: "Manrope", Arial, sans-serif;
}

h1 {
	font-family: var(--flamtees-font-primary);
	font-weight: 900 !important;
}

h2,
h3 {
	font-family: var(--flamtees-font-primary);
	font-weight: 800 !important;
}

h4,
h5,
h6 {
	font-family: var(--flamtees-font-primary);
	font-weight: 700 !important;
}

/* Keep supporting copy readable without making the whole interface heavy. */
.flamtees-hero__description,
.flamtees-story__description,
.flamtees-footer__description,
.woocommerce-product-details__short-description,
.woocommerce-tabs .panel,
.woocommerce-result-count,
.product_meta,
small,
.description {
	font-weight: 500;
}

button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.button,
.flamtees-hero__button,
.flamtees-products__shop-link,
.flamtees-products__mobile-link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	font-family: var(--flamtees-font-primary);
	font-weight: 600 !important;
}

label,
legend {
	font-family: var(--flamtees-font-primary);
	font-weight: 500 !important;
}

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

img,
video {
	height: auto;
}

img {
	border-radius: 8px !important;
}

a {
	color: inherit;
	text-decoration: none;
}

button,
input,
select,
textarea {
	font: inherit;
}

button {
	cursor: pointer;
}

button:not(.flamtees-header__icon-button):not(.flamtees-search-panel__backdrop):not(.flamtees-search-panel__close),
input[type="button"],
input[type="submit"],
input[type="reset"],
a.button,
.flamtees-hero__button,
.flamtees-products__shop-link,
.flamtees-products__mobile-link,
.flamtees-story__button {
	border-radius: 10px !important;
}

ul,
ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* ==========================================================================
   Global Layout
   ========================================================================== */

.flamtees-container {
	width: min(
		calc(100% - (var(--flamtees-container-padding) * 2)),
		var(--flamtees-container-width)
	);
	margin-inline: auto;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.screen-reader-text:focus {
	top: 8px;
	left: 8px;
	z-index: 100000;
	width: auto;
	height: auto;
	padding: 12px 16px;
	margin: 0;
	overflow: visible;
	clip: auto;
	background: #ffffff;
	color: #111111;
}
/* FLAMTEES WooCommerce success and cart notices. */
.woocommerce-notices-wrapper {
	clear: both;
	width: min(100% - 32px, 1320px);
	margin: 18px auto;
}

.woocommerce .woocommerce-message,
.woocommerce-message {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 76px;
	margin: 0 0 22px!important;
	padding: 18px 190px 18px 66px!important;
	border: 1px solid #cfe2ed!important;
	border-left: 6px solid #5793bd!important;
	border-radius: 16px!important;
	background: linear-gradient(135deg, #f5fafc 0%, #edf6fb 100%)!important;
	color: #315f80!important;
	font-family: "DM Sans", Arial, sans-serif!important;
	font-size: 15px!important;
	line-height: 1.5!important;
	box-shadow: 0 12px 30px rgba(36, 76, 102, .10)!important;
}

.woocommerce .woocommerce-message::before,
.woocommerce-message::before {
	position: absolute!important;
	top: 50%!important;
	left: 20px!important;
	display: grid!important;
	width: 30px!important;
	height: 30px!important;
	margin: 0!important;
	transform: translateY(-50%)!important;
	border-radius: 50%!important;
	place-items: center!important;
	background: #5793bd!important;
	color: #fff!important;
	content: "✓"!important;
	font-family: Arial, sans-serif!important;
	font-size: 17px!important;
	font-weight: 700!important;
	line-height: 30px!important;
	text-align: center!important;
}

.woocommerce .woocommerce-message .button,
.woocommerce-message .button {
	position: absolute!important;
	top: 50%!important;
	right: 18px!important;
	min-width: 140px!important;
	min-height: 46px!important;
	padding: 0 20px!important;
	transform: translateY(-50%)!important;
	border: 0!important;
	border-radius: 11px!important;
	background: #5793bd!important;
	color: #fff!important;
	font: 700 13px/46px "League Spartan", Arial, sans-serif!important;
	text-align: center!important;
	text-transform: uppercase!important;
	box-shadow: none!important;
}

.woocommerce .woocommerce-message .button:hover,
.woocommerce-message .button:hover {
	background: #315f80!important;
	color: #fff!important;
}

@media (max-width: 600px) {
	.woocommerce-notices-wrapper {
		width: min(100% - 20px, 1320px);
		margin: 12px auto;
	}

	.woocommerce .woocommerce-message,
	.woocommerce-message {
		display: block;
		min-height: 0;
		padding: 18px 16px 16px 58px!important;
		font-size: 13px!important;
	}

	.woocommerce .woocommerce-message::before,
	.woocommerce-message::before {
		top: 17px!important;
		left: 16px!important;
		transform: none!important;
	}

	.woocommerce .woocommerce-message .button,
	.woocommerce-message .button {
		position: static!important;
		display: block!important;
		width: 100%!important;
		margin: 15px 0 0 -42px!important;
		transform: none!important;
	}
}