/* =================================================================
   DRYON — design tokens
   Ink #0C1C12 · Forest #0C301F · Stone #DAD7CD · Fog #EEF0EC · White
   ================================================================= */
/* Fonts are declared in functions.php (Appearance > Customize > DRYON > الخط) */

/* Doubled :root beats Kadence's inline palette so every Kadence component follows the brand. */
:root:root {
	--dry-ink: #0C1C12;
	--dry-forest: #0C301F;
	--dry-stone: #DAD7CD;
	--dry-fog: #EEF0EC;
	--dry-line: #DDE1DB;
	--dry-muted: #5E6A62;
	--dry-radius: 2px;

	--global-palette1: var(--dry-forest);
	--global-palette2: var(--dry-ink);
	--global-palette3: var(--dry-ink);
	--global-palette4: #1E2B23;
	--global-palette5: var(--dry-muted);
	--global-palette6: #8A938D;
	--global-palette7: var(--dry-line);
	--global-palette8: var(--dry-fog);
	--global-palette9: #FFFFFF;

	--global-palette-btn-bg: var(--dry-ink);
	--global-palette-btn: #FFFFFF;
	--global-palette-btn-bg-hover: var(--dry-forest);
	--global-palette-btn-hover: #FFFFFF;

	--global-heading-font-family: var(--global-body-font-family);
	--global-content-width: 1240px;
}

/* =================================================================
   Base type — one family, weight does the work
   ================================================================= */
body {
	font-family: var(--global-body-font-family);
	font-weight: 400;
	font-size: 16px;
	line-height: 1.75;
	color: var(--dry-ink);
	background: #fff;
	-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 {
	font-family: var(--global-heading-font-family);
	color: var(--dry-ink);
	font-weight: 600;
	line-height: 1.35;
}
h1 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem); }
h2 { font-size: clamp(1.3rem, 1.1rem + 0.9vw, 1.8rem); }
a { color: var(--dry-ink); }
a:hover { color: var(--dry-forest); }
:focus-visible { outline: 2px solid var(--dry-forest); outline-offset: 2px; }
::selection { background: var(--dry-stone); color: var(--dry-ink); }

/* =================================================================
   Announcement bar + header
   ================================================================= */
.dryon-bar {
	background: var(--dry-forest);
	color: var(--dry-stone);
	text-align: center;
	font-size: 13px;
	font-weight: 400;
	line-height: 1;
	padding: 11px 16px;
}
.site-header .site-main-header-wrap,
.site-header .site-header-row-container-inner {
	background: #fff;
}
#masthead {
	border-bottom: 1px solid var(--dry-line);
}
.site-branding .custom-logo {
	max-height: 26px;
	width: auto;
}
.header-cart-button .header-cart-total {
	background: var(--dry-ink);
	color: #fff;
}

/* =================================================================
   Buttons — square, confident, no pills
   ================================================================= */
.button,
button.button,
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce button.button.alt,
.woocommerce a.button.alt,
input[type="submit"] {
	border-radius: var(--dry-radius);
	font-family: var(--global-body-font-family);
	font-weight: 500;
	letter-spacing: 0;
	padding: 14px 28px;
	box-shadow: none;
	transition: background-color .2s ease;
}

/* =================================================================
   Product grid — photo first, no card chrome
   ================================================================= */
.woocommerce ul.products {
	column-gap: 16px;
	row-gap: 40px;
}
.woocommerce ul.products li.product {
	text-align: start;
	background: transparent;
	border: 0;
	box-shadow: none;
}
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product .woocommerce-loop-image-link img {
	aspect-ratio: 4 / 5;
	object-fit: cover;
	width: 100%;
	border-radius: var(--dry-radius);
	background: var(--dry-fog);
	margin-bottom: 14px;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-size: 15px;
	font-weight: 500;
	line-height: 1.5;
	padding: 0;
	margin: 0 0 6px;
	color: var(--dry-ink);
}
.woocommerce ul.products li.product .price {
	font-size: 15px;
	font-weight: 600;
	color: var(--dry-ink);
	margin: 0;
}
.woocommerce ul.products li.product .product-details .button-wrap,
.woocommerce ul.products li.product .product-action-wrap {
	display: none;
}

/* Prices everywhere: current price bold ink, old price quiet */
.woocommerce .price del,
.woocommerce .price del .amount {
	color: var(--dry-muted);
	font-weight: 400;
	opacity: 1;
}
.woocommerce .price ins {
	text-decoration: none;
	font-weight: 600;
}

/* Sale badge: stone chip, not a red sticker */
.woocommerce span.onsale {
	background: var(--dry-stone);
	color: var(--dry-forest);
	border-radius: var(--dry-radius);
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	min-height: 0;
	min-width: 0;
	padding: 7px 10px;
	top: 10px;
	inset-inline-start: 10px;
	inset-inline-end: auto;
	margin: 0;
}

/* =================================================================
   Single product (base — the order form comes with the checkout plugin)
   ================================================================= */
.single-product div.product .product_title {
	font-size: clamp(1.35rem, 1.1rem + 1vw, 1.9rem);
	font-weight: 600;
	margin-bottom: 10px;
}
.single-product div.product p.price,
.single-product div.product span.price {
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--dry-ink);
}
.single-product div.product .woocommerce-product-gallery img {
	border-radius: var(--dry-radius);
	background: var(--dry-fog);
}

/* Forms */
input[type="text"], input[type="tel"], input[type="email"], input[type="number"],
select, textarea {
	border: 1px solid var(--dry-line);
	border-radius: var(--dry-radius);
	font-family: var(--global-body-font-family);
	font-size: 16px; /* stops iOS zoom on focus */
	padding: 12px 14px;
	background: #fff;
	color: var(--dry-ink);
}
input:focus, select:focus, textarea:focus {
	border-color: var(--dry-forest);
	outline: none;
	box-shadow: 0 0 0 1px var(--dry-forest);
}

/* =================================================================
   Footer — the one bold moment: deep forest, stone type
   ================================================================= */
.site-footer,
.site-footer .site-footer-row-container-inner {
	background: var(--dry-forest);
	color: var(--dry-stone);
}
.site-footer a { color: var(--dry-stone); }
.site-footer a:hover { color: #fff; }
.site-footer .site-bottom-footer-wrap .site-footer-row-container-inner {
	border-top: 1px solid rgba(218, 215, 205, .18);
}

/* =================================================================
   Mobile
   ================================================================= */
@media (max-width: 767px) {
	.woocommerce ul.products { column-gap: 10px; row-gap: 28px; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 14px; }
	.woocommerce ul.products li.product .price { font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; animation: none !important; }
}