/*
Theme Name: Vertige CBD
Theme URI: https://vertige-cbd.eva-team-manager.fr
Description: Theme enfant de Storefront pour la boutique Vertige CBD.
Author: Vertige CBD
Template: storefront
Version: 1.0.0
Text Domain: vertige-cbd
*/

:root {
	--vertige-black: #0a0a08;
	--vertige-black-deep: #000000;
	--vertige-green: #6a762e;
	--vertige-green-light: #9fa766;
	--vertige-green-dark: #3a4413;
	--vertige-gold: #e8d7ad;
	--vertige-gold-deep: #c9a660;
	--vertige-cream: #f5f0e1;
}

body {
	background-color: var(--vertige-black);
	color: var(--vertige-cream);
	font-family: "Poppins", -apple-system, BlinkMacSystemFont, sans-serif;
}

h1, h2, h3, h4, h5, h6,
.site-title, .site-branding,
.storefront-primary-navigation .site-title {
	font-family: "Cinzel", Georgia, serif;
	color: var(--vertige-gold);
	letter-spacing: 0.03em;
}

a {
	color: var(--vertige-green-light);
}
a:hover, a:focus {
	color: var(--vertige-gold);
}

/* Header */
.site-header {
	background-color: var(--vertige-black-deep);
	border-bottom: 1px solid var(--vertige-green-dark);
}
.site-header .site-title a,
.site-header .site-description {
	color: var(--vertige-gold);
}
.main-navigation ul li a {
	color: var(--vertige-cream);
}
.main-navigation ul li a:hover {
	color: var(--vertige-gold);
}
.site-header-cart .cart-contents,
.storefront-primary-navigation {
	background-color: var(--vertige-black-deep);
}

/* Footer */
#colophon.site-footer {
	background-color: var(--vertige-black-deep);
	color: var(--vertige-cream);
	border-top: 1px solid var(--vertige-green-dark);
}
#colophon.site-footer a {
	color: var(--vertige-green-light);
}
#colophon.site-footer .widget-title {
	color: var(--vertige-gold);
	font-family: "Cinzel", Georgia, serif;
}

/* Buttons */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, a.button.alt, button.button.alt {
	background-color: var(--vertige-green);
	color: var(--vertige-cream);
	border: 1px solid var(--vertige-green-light);
	border-radius: 2px;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
a.button.alt:hover, button.button.alt:hover {
	background-color: var(--vertige-gold-deep);
	color: var(--vertige-black-deep);
	border-color: var(--vertige-gold);
}

/* Product cards */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	background-color: #121208;
	border: 1px solid var(--vertige-green-dark);
	padding: 1em;
}
.woocommerce ul.products li.product .price {
	color: var(--vertige-gold);
}

/* Reassurance / homepage blocks */
.vertige-reassurance {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 2em;
	text-align: center;
	padding: 3em 1em;
	background-color: var(--vertige-black-deep);
}
.vertige-reassurance .item h3 {
	color: var(--vertige-gold);
	font-size: 1.1em;
}
.vertige-reassurance .item p {
	color: var(--vertige-cream);
	opacity: 0.85;
}

.vertige-hero {
	position: relative;
	text-align: center;
	padding: 5em 1em;
	background-color: var(--vertige-black-deep);
	border-bottom: 1px solid var(--vertige-green-dark);
}
.vertige-hero img.vertige-hero-logo {
	max-width: 220px;
	height: auto;
	margin-bottom: 1.5em;
}
.vertige-hero h1 {
	font-size: 2.6em;
	margin-bottom: 0.3em;
}
.vertige-hero p.tagline {
	color: var(--vertige-green-light);
	font-size: 1.1em;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.vertige-newsletter {
	background-color: #121208;
	padding: 3em 1em;
	text-align: center;
	border-top: 1px solid var(--vertige-green-dark);
}

/* Hide default page title on the static front page (hero banner replaces it) */
.page-id-14 .entry-header {
	display: none;
}

/* Header search widget */
.site-search .search-field,
.woocommerce-product-search .search-field {
	background-color: #121208;
	color: var(--vertige-cream);
	border: 1px solid var(--vertige-green-dark);
}
.site-search .search-field::placeholder {
	color: rgba(245, 240, 225, 0.5);
}
.site-search .search-submit,
.woocommerce-product-search .search-submit {
	background-color: var(--vertige-green);
	color: var(--vertige-cream);
	border: 1px solid var(--vertige-green-light);
}

/* Mobile handheld footer bar (account / search / cart icons) */
.storefront-handheld-footer-bar {
	background-color: var(--vertige-black-deep);
	border-top: 1px solid var(--vertige-green-dark);
}
.storefront-handheld-footer-bar ul {
	background-color: var(--vertige-black-deep);
}
.storefront-handheld-footer-bar li a,
.storefront-handheld-footer-bar li a .count {
	color: var(--vertige-cream);
}
.storefront-handheld-footer-bar li a:hover {
	color: var(--vertige-gold);
}

.storefront-handheld-footer-bar ul li > a,
.storefront-handheld-footer-bar ul li.search .site-search,
button.menu-toggle,
button.menu-toggle:hover {
	background-color: var(--vertige-black-deep) !important;
}

button.menu-toggle {
	border: 1px solid var(--vertige-green-dark) !important;
	color: var(--vertige-cream) !important;
}
button.menu-toggle:after,
button.menu-toggle:before,
button.menu-toggle span:before {
	background-color: var(--vertige-cream) !important;
}

/* "Epuise" badge on out-of-stock product cards */
ul.products li.product.outofstock {
	position: relative;
}
ul.products li.product.outofstock::before {
	content: "\00c9puis\00e9";
	position: absolute;
	top: 0.5em;
	right: 0.5em;
	z-index: 2;
	background-color: var(--vertige-gold-deep);
	color: var(--vertige-black-deep);
	font-family: "Cinzel", Georgia, serif;
	font-size: 0.7em;
	font-weight: 600;
	letter-spacing: 0.05em;
	padding: 0.3em 0.7em;
	border-radius: 2px;
	text-transform: uppercase;
}
ul.products li.product.outofstock img {
	opacity: 0.55;
}

/* Shop sidebar widgets */
.widget-area .widget {
	background-color: #121208;
	border: 1px solid var(--vertige-green-dark);
	padding: 1.5em;
	margin-bottom: 1.5em;
}
.widget-area .widget-title {
	color: var(--vertige-gold);
	font-family: "Cinzel", Georgia, serif;
	border-bottom: 1px solid var(--vertige-green-dark);
	padding-bottom: 0.5em;
}
.widget-area .widget a {
	color: var(--vertige-cream);
}
.widget-area .widget a:hover {
	color: var(--vertige-gold);
}
.widget-area .price_slider_amount .button {
	background-color: var(--vertige-green);
	color: var(--vertige-cream);
}
.widget-area .ui-slider .ui-slider-range {
	background-color: var(--vertige-green);
}
.widget-area .ui-slider .ui-slider-handle {
	background-color: var(--vertige-gold);
	border-color: var(--vertige-gold-deep);
}

/* Breadcrumb + page title on shop/archive pages */
.woocommerce-breadcrumb {
	color: var(--vertige-cream);
	opacity: 0.7;
}
.woocommerce-breadcrumb a {
	color: var(--vertige-green-light);
}

/* Light-background WooCommerce "receipt" cards (order details, bank transfer info,
   order review sidebar) need dark text since their background stays light by design. */
.order_details,
.order_details li,
#order_review,
#order_review table,
.woocommerce-table,
.shop_table,
#payment .payment_methods > li .payment_box,
#payment .place-order {
	color: #2b2b20;
}
.order_details li strong,
.woocommerce-table th,
.shop_table th {
	color: #14140e;
}
