/*
Theme Name: Ihsane Beauty
Theme URI: https://ihsane-beauty.fr
Author: Ihsane Beauty
Description: Thème bloc (Full Site Editing) sur mesure pour une boutique WooCommerce mono-produit. Palette dérivée du visuel produit, typographies auto-hébergées (RGPD), pensé pour un site de cosmétique vendu en France.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.9
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ihsane-beauty
Tags: full-site-editing, block-styles, e-commerce, one-column, wide-blocks, custom-colors, custom-menu, editor-style, featured-images, block-patterns
*/

/* --------------------------------------------------------------------------
   L'essentiel du style vit dans theme.json.
   Ce fichier ne contient que ce que theme.json ne sait pas exprimer :
   micro-interactions, en-tête collant, décors, styles de blocs personnalisés
   et ajustements WooCommerce.
   -------------------------------------------------------------------------- */

:root {
	--ihs-transition: 220ms cubic-bezier(0.2, 0.7, 0.3, 1);
}

html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		transition-duration: 0.001ms !important;
	}
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

/* Accessibilité : anneau de focus visible, obligatoire pour la navigation clavier */
:where(a, button, input, select, textarea, summary, .wp-block-button__link):focus-visible {
	outline: 2px solid var(--wp--preset--color--rose-fonce);
	outline-offset: 3px;
	border-radius: 2px;
}

/* Lien d'évitement */
.skip-link:focus {
	background-color: var(--wp--preset--color--ivoire);
	color: var(--wp--preset--color--brun);
	z-index: 100000;
}

/* --------------------------------------------------------------------------
   En-tête
   -------------------------------------------------------------------------- */

.ihs-header {
	position: sticky;
	top: 0;
	z-index: 90;
	backdrop-filter: saturate(140%) blur(8px);
	-webkit-backdrop-filter: saturate(140%) blur(8px);
	background-color: rgba(253, 249, 245, 0.88);
	border-bottom: 1px solid rgba(193, 153, 100, 0.28);
	transition: box-shadow var(--ihs-transition);
}

.admin-bar .ihs-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .ihs-header { top: 46px; } }

/* Bandeau d'annonce défilant (réassurance) */
.ihs-annonce {
	font-size: 0.75rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   Décors
   -------------------------------------------------------------------------- */

/* Filet doré centré — style de bloc « Filet doré » sur le séparateur */
.wp-block-separator.is-style-ihs-filet-or {
	border: none;
	height: 1px;
	width: min(180px, 40%);
	background: linear-gradient(90deg, rgba(193,153,100,0) 0%, var(--wp--preset--color--or) 50%, rgba(193,153,100,0) 100%);
	opacity: 1;
}

/* Titre en petites capitales espacées — style de bloc sur le paragraphe */
.is-style-ihs-surtitre {
	font-size: 0.75rem !important;
	text-transform: uppercase;
	letter-spacing: 0.22em;
	color: var(--wp--preset--color--or-fonce);
	font-weight: 500;
}

/* Image au cadre doré */
.wp-block-image.is-style-ihs-cadre-or img {
	outline: 1px solid rgba(193, 153, 100, 0.55);
	outline-offset: 10px;
}

/* Groupe « carte » */
.wp-block-group.is-style-ihs-carte {
	background-color: var(--wp--preset--color--blanc);
	border: 1px solid rgba(193, 153, 100, 0.30);
	border-radius: 2px;
	box-shadow: 0 2px 24px rgba(62, 42, 32, 0.05);
}

/* Lettrine décorative sur les titres de section */
.ihs-ornement::after {
	content: "";
	display: block;
	width: 44px;
	height: 1px;
	margin: 1.25rem auto 0;
	background: var(--wp--preset--color--or);
}

.ihs-ornement.has-text-align-left::after { margin-left: 0; }

/* --------------------------------------------------------------------------
   Boutons et liens
   -------------------------------------------------------------------------- */

.wp-block-button__link {
	transition: background-color var(--ihs-transition), color var(--ihs-transition), border-color var(--ihs-transition), transform var(--ihs-transition);
}

.wp-block-button__link:hover {
	transform: translateY(-1px);
}

/* Bouton secondaire : contour seul */
.wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	color: var(--wp--preset--color--brun);
	border-color: var(--wp--preset--color--brun);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--brun);
	color: var(--wp--preset--color--ivoire);
}

/* Lien discret souligné à l'apparition */
.is-style-ihs-lien-fin a {
	text-decoration: none;
	border-bottom: 1px solid rgba(163, 60, 99, 0.4);
	padding-bottom: 2px;
	transition: border-color var(--ihs-transition);
}

.is-style-ihs-lien-fin a:hover {
	border-color: var(--wp--preset--color--rose-fonce);
}

/* --------------------------------------------------------------------------
   WooCommerce — ajustements ciblés
   -------------------------------------------------------------------------- */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner {
	border-radius: 2px;
	font-size: 0.9375rem;
}

.woocommerce-message,
.woocommerce-info {
	border-top-color: var(--wp--preset--color--or) !important;
	background-color: var(--wp--preset--color--creme);
	color: var(--wp--preset--color--brun);
}

/* Boutons WooCommerce alignés sur le style du thème */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wc-block-components-button:not(.is-link) {
	background-color: var(--wp--preset--color--brun);
	color: var(--wp--preset--color--ivoire);
	border: 1px solid var(--wp--preset--color--brun);
	border-radius: 999px;
	padding: 1rem 2.25rem;
	font-family: var(--wp--preset--font-family--texte);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	line-height: 1;
	transition: background-color var(--ihs-transition), border-color var(--ihs-transition);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.wc-block-components-button:not(.is-link):hover {
	background-color: var(--wp--preset--color--rose-fonce);
	border-color: var(--wp--preset--color--rose-fonce);
	color: var(--wp--preset--color--ivoire);
}

/* Champs de formulaire */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"] {
	border: 1px solid rgba(62, 42, 32, 0.22);
	border-radius: 2px;
	background-color: var(--wp--preset--color--blanc);
	padding: 0.85rem 1rem;
	font-family: var(--wp--preset--font-family--texte);
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	border-color: var(--wp--preset--color--or);
	outline: none;
	box-shadow: 0 0 0 3px rgba(193, 153, 100, 0.18);
}

/* Prix */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.75rem;
	color: var(--wp--preset--color--brun);
}

/* Onglets de la fiche produit */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding-left: 0;
	border-bottom: 1px solid rgba(193, 153, 100, 0.35);
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: transparent;
	border: none;
	border-radius: 0;
	margin: 0 1.75rem 0 0;
	padding: 0 0 0.75rem;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	font-family: var(--wp--preset--font-family--texte);
	font-size: 0.8125rem;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--wp--preset--color--taupe);
	text-decoration: none;
	font-weight: 400;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--wp--preset--color--brun);
	box-shadow: inset 0 -2px 0 var(--wp--preset--color--or);
}

/* Quantité */
.woocommerce .quantity .qty {
	border: 1px solid rgba(62, 42, 32, 0.22);
	border-radius: 999px;
	padding: 0.75rem 0.5rem;
	font-family: var(--wp--preset--font-family--texte);
}

/* Galerie produit */
.woocommerce div.product div.images img {
	border-radius: 2px;
}

/* Badge promo */
.woocommerce span.onsale {
	background-color: var(--wp--preset--color--rose-fonce);
	color: var(--wp--preset--color--ivoire);
	font-family: var(--wp--preset--font-family--texte);
	font-size: 0.6875rem;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-weight: 500;
	border-radius: 999px;
	min-height: auto;
	min-width: auto;
	line-height: 1;
	padding: 0.6rem 1rem;
}

/* Tableau de commande */
.woocommerce table.shop_table {
	border-radius: 2px;
	border-color: rgba(62, 42, 32, 0.12);
}

.woocommerce table.shop_table th {
	font-family: var(--wp--preset--font-family--texte);
	font-size: 0.8125rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-weight: 500;
	color: var(--wp--preset--color--taupe);
}

/* Fil d'Ariane */
.woocommerce .woocommerce-breadcrumb {
	font-size: 0.8125rem;
	color: var(--wp--preset--color--taupe);
	letter-spacing: 0.04em;
}

/* --------------------------------------------------------------------------
   Divers
   -------------------------------------------------------------------------- */

/* Images en chargement différé : évite le saut de mise en page */
img { max-width: 100%; height: auto; }

/* Impression : allège la facture et les pages légales */
@media print {
	.ihs-header, .ihs-footer, .ihs-annonce, .wp-block-navigation { display: none !important; }
	body { background: #fff; color: #000; }
}