/*
Theme Name: Merry Roses
Theme URI: https://merryroses.gr
Description: Block child theme για το merryroses.gr. B2B κατάστημα χονδρικής της Merry Roses (Πάτρα).
Author: Merry Roses
Template: twentytwentyfive
Version: 0.2.0
Requires at least: 6.7
Requires PHP: 8.2
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: merryroses
*/

/* ==========================================================================
   Τυπογραφική υγιεινή
   Οι ελληνικές λέξεις είναι μακριές· χωρίς αυτό ο τίτλος σπάει στη μέση
   της λέξης όταν στενέψει η στήλη.
   ========================================================================== */

:where(h1, h2, h3, h4, .wp-block-post-title, .wp-block-site-title) {
	overflow-wrap: normal;
	word-break: keep-all;
	hyphens: none;
	text-wrap: balance;
}

:where(p, li) {
	text-wrap: pretty;
}

/* Το iOS κάνει ζουμ σε κάθε πεδίο με κείμενο κάτω από 16px, και μετά ο
   χρήστης μένει ζουμαρισμένος. Στις οθόνες αφής κανένα πεδίο δεν πέφτει
   κάτω από 1rem, ό,τι κι αν λέει το στυλ του component. */
@media (max-width: 900px) {
	input,
	select,
	textarea {
		font-size: 1rem !important;
	}
}

/* Τίποτα δεν ξεχειλίζει οριζόντια στο κινητό. */
img,
select,
table {
	max-width: 100%;
}

/* Η ταξινόμηση του WooCommerce είναι δεξιά στοιχισμένη με σταθερό πλάτος
   και σπρώχνει τη σελίδα εκτός οθόνης στο κινητό. Παίρνει δική της γραμμή. */
@media (max-width: 900px) {
	.wc-block-catalog-sorting,
	.woocommerce-ordering {
		width: 100%;
		max-width: 100%;
		float: none;
		margin: 0 0 var(--wp--preset--spacing--20);
	}

	.wc-block-catalog-sorting select,
	.woocommerce-ordering select {
		width: 100%;
		max-width: 100%;
	}
}

/* Κείμενο σε πλάτος wide χρειάζεται φρένο: 78rem γραμμή δεν διαβάζεται.
   Διπλή κλάση για να υπερισχύει του .alignwide που φορτώνει αργότερα.
   Το alignwide βάζει margin auto και στις δύο πλευρές, που θα κεντράριζε
   την κολόνα κειμένου. Την κρατάμε στην αριστερή ακμή, όπως τα υπόλοιπα. */
.mr-measure.mr-measure {
	max-width: 46rem;
	margin-left: 0;
	margin-right: auto;
}

/* ==========================================================================
   Η υπογραφή: ο κωδικός προϊόντος.
   Ο έμπορος δεν ζητάει «το στεφάνι». Ζητάει ΣΤΕΦ41. Ο κωδικός είναι η
   γλώσσα της δουλειάς, οπότε τον μεταχειριζόμαστε ως αντικείμενο, όχι ως
   μεταδεδομένο: monospace, πάνω σε γραμμή, πάντα ορατός.
   ========================================================================== */

.mr-code {
	display: inline-block;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 500;
	letter-spacing: 0.06em;
	line-height: 1;
	padding: 0.45em 0 0.35em;
	border-top: 2px solid var(--wp--preset--color--garnet);
	color: var(--wp--preset--color--ink);
	white-space: nowrap;
}

/* Στη σελίδα προϊόντος ο κωδικός σηκώνει βάρος. */
.mr-code--lead {
	font-size: var(--wp--preset--font-size--lg);
	letter-spacing: 0.04em;
	padding-top: 0.5em;
	border-top-width: 3px;
}

/* ==========================================================================
   Κατάλογος
   ========================================================================== */

/* Το WooCommerce σερβίρει τον κατάλογο μέσω του Product Collection block.
   Οι διπλές κλάσεις ανεβάζουν τη βαρύτητα ώστε να υπερισχύουν των δικών
   του φύλλων, που φορτώνουν αργότερα. */
/* Ρητά σημεία αλλαγής αντί για auto-fill: ο έμπορος σαρώνει τον κατάλογο
   στο κινητό και δύο στήλες δείχνουν διπλάσια προϊόντα ανά οθόνη. */
.wc-block-product-template.wc-block-product-template,
.woocommerce ul.products,
.mr-results {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--20);
}

@media (min-width: 600px) {
	.wc-block-product-template.wc-block-product-template,
	.woocommerce ul.products,
	.mr-results {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
	}
}

@media (min-width: 900px) {
	.wc-block-product-template.wc-block-product-template,
	.woocommerce ul.products,
	.mr-results {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (min-width: 1200px) {
	.wc-block-product-template.wc-block-product-template,
	.woocommerce ul.products,
	.mr-results {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}
}

.wc-block-product-template li.wc-block-product,
.woocommerce ul.products li.product {
	position: relative;
	width: auto;
	max-width: none;
	float: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.6rem;
	text-align: left;
}

/* Σταθερός λόγος διαστάσεων: τα προϊόντα έχουν ανομοιόμορφες φωτογραφίες
   και χωρίς αυτό το πλέγμα χοροπηδάει όσο φορτώνει. */
.wc-block-product-template li.wc-block-product img,
.woocommerce ul.products li.product img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	margin: 0;
	background: var(--wp--preset--color--shade);
	transition: opacity 180ms ease;
}

.wc-block-product-template li.wc-block-product:hover img,
.woocommerce ul.products li.product:hover img {
	opacity: 0.88;
}

.wc-block-product-template li.wc-block-product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--base);
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: -0.01em;
	text-align: left;
	margin: 0;
	padding: 0;
}

.wc-block-product-template li.wc-block-product a,
.woocommerce ul.products li.product a {
	text-decoration: none;
	color: inherit;
}

.wc-block-product-template li.wc-block-product .price,
.woocommerce ul.products li.product .price {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	color: var(--wp--preset--color--ink);
	text-align: left;
	margin: 0;
}

/* Στο πλέγμα δεν χρειάζεται κουμπί: η ελάχιστη παραγγελία είναι 10 τεμάχια,
   οπότε η επιλογή γίνεται στη σελίδα προϊόντος ή στη γρήγορη παραγγελία. */
.wc-block-product-template li.wc-block-product .wc-block-components-product-button,
.wc-block-product-template li.wc-block-product .button,
.woocommerce ul.products li.product .button {
	display: none;
}

/* Ο κωδικός σημαδεύει την κάρτα από πάνω, σαν ετικέτα ραφιού. */
.wc-block-product-template li.wc-block-product .mr-code {
	order: -1;
}

/* Το block στοιχίζει τίτλο και τιμή στο κέντρο. Ο κατάλογος σαρώνεται
   κάθετα. Αριστερή στοίχιση κρατάει τα μάτια σε μία γραμμή. */
.wc-block-product-template li.wc-block-product .wp-block-post-title,
.wc-block-product-template li.wc-block-product .wp-block-post-title.has-text-align-center {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--base);
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: -0.01em;
	text-align: left;
	margin: 0;
}

.wc-block-product-template li.wc-block-product .wp-block-woocommerce-product-price,
.wc-block-product-template li.wc-block-product .wp-block-woocommerce-product-price.has-text-align-center {
	text-align: left;
	margin: 0;
}

.wc-block-product-template li.wc-block-product .wc-block-components-product-image {
	margin: 0;
	width: 100%;
}

/* ==========================================================================
   Κλειδωμένη τιμή
   Ο κατάλογος είναι ανοιχτός, οι τιμές όχι. Το μήνυμα πρέπει να διαβάζεται
   ως κατάσταση, όχι ως σφάλμα.
   ========================================================================== */

.mr-price-locked {
	display: block;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.4;
	color: var(--wp--preset--color--muted);
}

.mr-price-locked a {
	color: var(--wp--preset--color--garnet);
	text-underline-offset: 0.2em;
}

/* Η συνιστώμενη λιανική είναι εργαλείο πώλησης: δείχνει το περιθώριο.
   Ξεχωρίζει από τη χονδρική χωρίς να την ανταγωνίζεται. */
.mr-srp {
	display: block;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 400;
	color: var(--wp--preset--color--muted);
	margin-top: 0.15rem;
}

/* ==========================================================================
   Γρήγορη παραγγελία
   Η μηχανή της δουλειάς. Ο έμπορος έχει τον τιμοκατάλογο μπροστά του και
   πληκτρολογεί. Η φόρμα πρέπει να μοιάζει με φύλλο παραγγελίας.
   ========================================================================== */

.mr-qo-form {
	max-width: 34rem;
}

.mr-qo-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: var(--wp--preset--spacing--30);
}

.mr-qo-table th {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--muted);
	text-align: left;
	padding: 0 0 0.6rem;
	border-bottom: 1px solid var(--wp--preset--color--ink);
}

.mr-qo-table th:last-child {
	width: 7rem;
}

.mr-qo-table td {
	padding: 0;
	border-bottom: 1px solid var(--wp--preset--color--rule);
}

.mr-qo-table input {
	width: 100%;
	border: 0;
	background: transparent;
	padding: 0.7rem 0.5rem 0.7rem 0;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 1rem;
	color: var(--wp--preset--color--ink);
}

.mr-qo-table input::placeholder {
	color: #A8A29B;
}

.mr-qo-table input:focus {
	outline: 2px solid var(--wp--preset--color--garnet);
	outline-offset: 2px;
	background: var(--wp--preset--color--shade);
}

.mr-qo-message {
	font-size: var(--wp--preset--font-size--sm);
	padding: 0.7rem 0.9rem;
	margin: 0 0 0.5rem;
	border-left: 3px solid;
}

.mr-qo-error {
	border-color: var(--wp--preset--color--garnet);
	background: var(--wp--preset--color--shade);
	color: var(--wp--preset--color--ink);
}

.mr-qo-success {
	border-color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--shade);
	color: var(--wp--preset--color--ink);
}

/* ==========================================================================
   Αίτηση συνεργάτη
   ========================================================================== */

.mr-pa-form {
	max-width: 32rem;
}

.mr-pa-form p {
	margin: 0 0 var(--wp--preset--spacing--20);
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.mr-pa-form label {
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	color: var(--wp--preset--color--ink);
}

.mr-pa-form input {
	border: 1px solid var(--wp--preset--color--rule);
	border-radius: 0;
	background: var(--wp--preset--color--paper);
	padding: 0.8rem 0.85rem;
	font-family: inherit;
	font-size: 1rem;
	color: var(--wp--preset--color--ink);
}

.mr-pa-form input:focus {
	outline: 2px solid var(--wp--preset--color--garnet);
	outline-offset: 1px;
	border-color: transparent;
}

.mr-pa-form button,
.mr-qo-form button {
	align-self: flex-start;
	border: 0;
	border-radius: 0;
	background: var(--wp--preset--color--garnet);
	color: var(--wp--preset--color--paper);
	padding: 0.9rem 1.6rem;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 600;
	cursor: pointer;
	transition: background 160ms ease, transform 80ms ease;
}

.mr-pa-form button:hover,
.mr-qo-form button:hover {
	background: var(--wp--preset--color--ink);
}

.mr-pa-form button:active,
.mr-qo-form button:active {
	transform: translateY(1px);
}

.mr-pa-errors {
	list-style: none;
	margin: 0 0 var(--wp--preset--spacing--30);
	padding: 0.8rem 1rem;
	border-left: 3px solid var(--wp--preset--color--garnet);
	background: var(--wp--preset--color--shade);
	font-size: var(--wp--preset--font-size--sm);
}

.mr-pa-success {
	padding: var(--wp--preset--spacing--30);
	border-left: 3px solid var(--wp--preset--color--ink);
	background: var(--wp--preset--color--shade);
}

.mr-pa-note {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--muted);
	line-height: 1.5;
}

.mr-preorder-notice {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--ink);
	border-left: 3px solid var(--wp--preset--color--raw-wood);
	padding: 0.6rem 0.9rem;
	background: var(--wp--preset--color--shade);
}

/* ==========================================================================
   Αρχική. Το μητρώο εκθέσεων
   Η απόδειξη δεν είναι πλακίδια με νούμερα· είναι εγγραφή. Δέκα σειρές,
   καμία χαμένη. Η επανάληψη είναι το επιχείρημα.
   ========================================================================== */

.mr-ledger {
	border-top: 1px solid var(--wp--preset--color--ink);
	margin-top: var(--wp--preset--spacing--20);
}

.mr-ledger__row {
	display: grid;
	grid-template-columns: 5rem 1fr auto;
	gap: 1rem;
	align-items: baseline;
	padding: 0.55rem 0;
	border-bottom: 1px solid var(--wp--preset--color--rule);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--sm);
}

.mr-ledger__year {
	color: var(--wp--preset--color--ink);
}

.mr-ledger__what {
	font-family: var(--wp--preset--font-family--sans);
	color: var(--wp--preset--color--muted);
}

.mr-ledger__mark {
	color: var(--wp--preset--color--garnet);
}

/* Η μία θέση όπου μπαίνει το χρυσό: στο νούμερο που μετράει.
   Πάνω σε μαύρο, γιατί σε λευκό δεν περνάει τον έλεγχο αντίθεσης. */
.mr-figure {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	padding: var(--wp--preset--spacing--40);
}

.mr-figure__number {
	font-family: var(--wp--preset--font-family--didot);
	font-size: var(--wp--preset--font-size--hero);
	line-height: 0.9;
	color: var(--wp--preset--color--raw-wood);
	display: block;
}

.mr-figure__label {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--paper);
	display: block;
	margin-top: 0.6rem;
	max-width: 22ch;
}

/* ==========================================================================
   Λογότυπο
   Το μονόγραμμα MR είναι η σφραγίδα, το όνομα δίπλα είναι το λογότυπο.
   Ίδια λογική με το site υπηρεσιών, ώστε τα δύο domain να διαβάζονται
   ως μία εταιρεία.
   ========================================================================== */

/* Τίποτα στην κεφαλίδα δεν επιτρέπεται να ξεχειλίσει οριζόντια. */
.mr-header,
.mr-header * {
	min-width: 0;
}

.mr-header__end {
	flex-shrink: 1;
	min-width: 0;
}

.mr-brand {
	gap: 0;
	flex-shrink: 0;
}

.mr-logo {
	display: inline-flex;
	align-items: center;
	color: var(--wp--preset--color--ink);
	line-height: 0;
	text-decoration: none;
}

.mr-logo svg {
	height: 2.6rem;
	width: auto;
	display: block;
}

.mr-logo__scope {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
	padding-left: 0.75rem;
	margin-left: 0.75rem;
	border-left: 1px solid var(--wp--preset--color--rule);
	line-height: 1;
}

/* Ο τίτλος του site μένει για SEO και για αναγνώστες οθόνης, αλλά το
   μονόγραμμα ήδη λέει το όνομα. Δεύτερη φορά είναι θόρυβος. */
.mr-brand .wp-block-site-title {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* Η αναζήτηση στην κεφαλίδα συρρικνώνεται πριν σπάσει η γραμμή, και
   κρύβεται τελείως όταν δεν χωράει. Στο κινητό υπάρχει μέσα στο μενού. */
.mr-header .mr-search--header {
	flex: 0 1 12rem;
	min-width: 6rem;
}

/* Σε οθόνη αφής το μενού εμφανίζεται ακόμα οριζόντια στα 768px, οπότε οι
   σύνδεσμοι χρειάζονται ύψος δαχτύλου χωρίς να ψηλώσει η κεφαλίδα. */
@media (pointer: coarse) {
	.wp-block-navigation .wp-block-navigation-item__content {
		display: inline-flex;
		align-items: center;
		min-height: 2.75rem;
	}
}

.mr-header__search-row {
	display: none;
}

@media (max-width: 1100px) {
	.mr-header .mr-header__end .mr-search--header {
		display: none;
	}

	.mr-header__search-row {
		display: block;
		margin-top: var(--wp--preset--spacing--20);
	}

	.mr-header__search-row .mr-search--header {
		max-width: none;
		border-bottom-width: 2px;
		border-bottom-color: var(--wp--preset--color--ink);
	}

	.mr-header__search-row .mr-search__field {
		padding: 0.55rem 0.25rem 0.55rem 0;
		font-size: 1rem;
	}
}

@media (max-width: 600px) {
	.mr-logo__scope {
		padding-left: 0.55rem;
		margin-left: 0.55rem;
	}

	.mr-logo svg {
		height: 2.1rem;
	}
}

/* ==========================================================================
   Σελίδα συνεργασίας
   Δύο στήλες: αριστερά οι όροι σε αριθμημένες εγγραφές, δεξιά η αίτηση.
   Ο έμπορος διαβάζει τους όρους και συμπληρώνει χωρίς να χάσει τη θέση του.
   ========================================================================== */

.mr-terms {
	display: grid;
	gap: 0;
	border-top: 1px solid var(--wp--preset--color--ink);
}

.mr-term {
	display: grid;
	grid-template-columns: 3rem 1fr;
	gap: var(--wp--preset--spacing--20);
	align-items: start;
	padding: var(--wp--preset--spacing--30) 0;
	border-bottom: 1px solid var(--wp--preset--color--rule);
}

.mr-term__no {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.06em;
	color: var(--wp--preset--color--garnet);
	padding-top: 0.35em;
}

.mr-term__body {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.mr-term__title {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--base);
	font-weight: 600;
	line-height: 1.35;
	color: var(--wp--preset--color--ink);
}

.mr-term__text {
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.6;
	color: var(--wp--preset--color--muted);
	max-width: 46ch;
}

.mr-term__text strong {
	color: var(--wp--preset--color--ink);
	font-weight: 600;
}

/* Το φόντο μπαίνει στη στήλη, ώστε η επικεφαλίδα και η φόρμα να είναι ένα
   κουτί. Το shortcode βγάζει τη φόρμα ως αδελφό στοιχείο, οπότε αν έβαφα
   το καθένα χωριστά θα έμενε λευκή γραμμή ανάμεσά τους. */
.mr-apply-col {
	background: var(--wp--preset--color--shade);
	padding: var(--wp--preset--spacing--40);
	align-self: flex-start;
}

.mr-apply {
	margin-bottom: var(--wp--preset--spacing--30);
}

.mr-apply__title {
	font-family: var(--wp--preset--font-family--didot);
	font-size: var(--wp--preset--font-size--xl);
	line-height: 1.15;
	margin: 0 0 0.5rem;
}

.mr-apply__note {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--muted);
	margin: 0 0 var(--wp--preset--spacing--30);
	line-height: 1.55;
}

.mr-apply .mr-pa-form {
	max-width: none;
}

.mr-apply .mr-pa-form input {
	background: var(--wp--preset--color--paper);
}

/* ==========================================================================
   Αναζήτηση προϊόντος
   Ο έμπορος ξέρει τον κωδικό. Η αναζήτηση είναι η γρήγορη διαδρομή.
   ========================================================================== */

.mr-search {
	display: flex;
	gap: 0;
	max-width: 34rem;
	border-bottom: 2px solid var(--wp--preset--color--ink);
}

.mr-search__field {
	flex: 1;
	border: 0;
	background: transparent;
	padding: 0.85rem 0.25rem 0.85rem 0;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--lg);
	color: var(--wp--preset--color--ink);
}

.mr-search__field::placeholder {
	color: #A8A29B;
	font-family: var(--wp--preset--font-family--sans);
}

.mr-search__field:focus {
	outline: 0;
}

.mr-search:focus-within {
	border-bottom-color: var(--wp--preset--color--garnet);
}

.mr-search__go {
	border: 0;
	background: transparent;
	padding: 0 0.5rem;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 600;
	color: var(--wp--preset--color--garnet);
	cursor: pointer;
}

.mr-search__go:hover {
	color: var(--wp--preset--color--ink);
}

/* Στην κεφαλίδα η αναζήτηση είναι διακριτική. */
.mr-search--header {
	max-width: 13rem;
	border-bottom-width: 1px;
	border-bottom-color: var(--wp--preset--color--rule);
}

.mr-search--header .mr-search__field {
	padding: 0.4rem 0.25rem;
	font-size: 1rem;
}

/* Τα αποτελέσματα αναζήτησης διαβάζονται όπως ο κατάλογος. */
.mr-results {
	gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30) !important;
}

.mr-results > li {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}

.mr-results .wp-block-post-featured-image {
	margin: 0;
	order: 1;
}

.mr-results .wp-block-post-featured-image img {
	width: 100%;
	background: var(--wp--preset--color--shade);
}

.mr-results .mr-code {
	order: 0;
}

.mr-results .wp-block-post-title {
	order: 2;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 500;
	line-height: 1.35;
	margin: 0;
}

.mr-results .wp-block-post-title a {
	text-decoration: none;
	color: inherit;
	display: block;
	padding: 0.35rem 0;
}

/* Η σελιδοποίηση πατιέται με το δάχτυλο, όχι με ποντίκι. */
.wp-block-query-pagination {
	margin-top: var(--wp--preset--spacing--50);
	gap: 0.25rem;
}

.wp-block-query-pagination a,
.wp-block-query-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.75rem;
	min-height: 2.75rem;
	padding: 0 0.6rem;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--sm);
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	border: 1px solid var(--wp--preset--color--rule);
}

.wp-block-query-pagination a:hover,
.wp-block-query-pagination .page-numbers:hover {
	border-color: var(--wp--preset--color--ink);
}

.wp-block-query-pagination .page-numbers.current {
	background: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
}

/* Το ίδιο και για τη σελιδοποίηση του καταλόγου. */
.woocommerce-pagination .page-numbers li a,
.woocommerce-pagination .page-numbers li span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.75rem;
	min-height: 2.75rem;
	font-family: var(--wp--preset--font-family--mono);
	text-decoration: none;
}

.mr-search__hint {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--muted);
	margin-top: 0.6rem;
}

/* ==========================================================================
   Θέσεις φωτογραφιών
   Κάθε κενό λέει τι φωτογραφία θέλει και σε τι διαστάσεις. Όταν μπει η
   πραγματική εικόνα, το frame αντικαθίσταται ολόκληρο.
   ========================================================================== */

.mr-frame {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 0.4rem;
	padding: var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--shade);
	border: 1px dashed #C9C4BD;
	color: var(--wp--preset--color--muted);
	overflow: hidden;
}

/* Διακριτικό σταυρόνημα ώστε το κενό να διαβάζεται ως θέση, όχι ως σφάλμα. */
.mr-frame::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(to bottom right, transparent calc(50% - 0.5px), #E4E0DC 50%, transparent calc(50% + 0.5px)),
		linear-gradient(to bottom left, transparent calc(50% - 0.5px), #E4E0DC 50%, transparent calc(50% + 0.5px));
	pointer-events: none;
}

.mr-frame > * {
	position: relative;
}

.mr-frame__what {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	line-height: 1.35;
	color: var(--wp--preset--color--ink);
	max-width: 28ch;
}

.mr-frame__spec {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--muted);
}

/* Λόγοι διαστάσεων ανά χρήση. */
.mr-frame--wide     { aspect-ratio: 16 / 9; }
.mr-frame--hero     { aspect-ratio: 4 / 3; }
.mr-frame--portrait { aspect-ratio: 4 / 5; }
.mr-frame--square   { aspect-ratio: 1 / 1; }
.mr-frame--tall     { aspect-ratio: 2 / 3; }

/* ==========================================================================
   Πλακίδια συλλογών
   ========================================================================== */

.mr-tiles {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
	gap: var(--wp--preset--spacing--30);
}

.mr-tile {
	display: flex;
	flex-direction: column;
	gap: 0.9rem;
}

.mr-tile__caption {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.mr-tile__name {
	font-family: var(--wp--preset--font-family--didot);
	font-size: var(--wp--preset--font-size--xl);
	line-height: 1.1;
	color: var(--wp--preset--color--ink);
}

.mr-tile__meta {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.05em;
	color: var(--wp--preset--color--muted);
}

/* ==========================================================================
   Εποχή
   Οι τρεις ανταγωνιστές είναι χρυσό πάνω σε κρεμ. Η εποχική μας όψη δεν
   πηγαίνει εκεί: το γρανάτ γίνεται πεδίο αντί για τονισμός. Σκούρα ταινία
   πάνω από τον κατάλογο, με μία χρυσή τρίχα. Κανείς στη χονδρική δεν το κάνει.
   ========================================================================== */

.mr-ribbon {
	margin: 0 0 var(--wp--preset--spacing--50);
	background: var(--wp--preset--color--garnet);
	color: var(--wp--preset--color--paper);
	border-top: 2px solid var(--wp--preset--color--raw-wood);
	border-bottom: 2px solid var(--wp--preset--color--raw-wood);
}

.mr-ribbon__inner {
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.6rem;
}

.mr-ribbon__eyebrow {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--raw-wood);
}

.mr-ribbon__headline {
	font-family: var(--wp--preset--font-family--didot);
	font-size: var(--wp--preset--font-size--xxl);
	line-height: 1.12;
	margin: 0;
	max-width: 22ch;
	word-break: keep-all;
	hyphens: none;
}

.mr-ribbon__text {
	margin: 0;
	max-width: 46ch;
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.5;
	color: #E8DCDE;
}

.mr-ribbon__cta {
	margin-top: 0.5rem;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 1.4rem;
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--garnet);
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 600;
	letter-spacing: 0.02em;
	text-decoration: none;
	border: 1px solid var(--wp--preset--color--paper);
}

.mr-ribbon__cta:hover,
.mr-ribbon__cta:focus-visible {
	background: transparent;
	color: var(--wp--preset--color--paper);
}

/* Γάμος και βάπτιση: η ίδια δομή, άλλη θερμοκρασία. Ανοιχτό πεδίο, γιατί
   η σεζόν αυτή πουλάει λευκό και ροζ, όχι βαθύ κόκκινο. */
.mr-season--gamos .mr-ribbon {
	background: var(--wp--preset--color--shade);
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--rose);
}

.mr-season--gamos .mr-ribbon__eyebrow {
	color: var(--wp--preset--color--garnet);
}

.mr-season--gamos .mr-ribbon__text {
	color: var(--wp--preset--color--muted);
}

.mr-season--gamos .mr-ribbon__cta {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	border-color: var(--wp--preset--color--ink);
}

.mr-season--gamos .mr-ribbon__cta:hover,
.mr-season--gamos .mr-ribbon__cta:focus-visible {
	background: transparent;
	color: var(--wp--preset--color--ink);
}

/* Στη σεζόν Χριστουγέννων ο κωδικός στην κάρτα φοράει το γρανάτ, ώστε το
   πλέγμα να ακολουθεί την ταινία χωρίς να αλλάξει τίποτα άλλο. */
.mr-season--xristougenna .mr-code {
	color: var(--wp--preset--color--garnet);
	border-color: var(--wp--preset--color--garnet);
}

@media (max-width: 900px) {
	.mr-ribbon__headline {
		font-size: var(--wp--preset--font-size--xl);
	}

	.mr-ribbon__cta {
		width: 100%;
		justify-content: center;
	}
}

/* ==========================================================================
   Προτάσεις
   Ο έμπορος δεν αγοράζει κομμάτι, στήνει βιτρίνα. Οι προτάσεις λένε τι
   λείπει από τη σειρά, όχι τι άλλο υπάρχει στο κατάστημα.
   ========================================================================== */

.mr-suggest {
	margin-top: var(--wp--preset--spacing--60);
	padding-top: var(--wp--preset--spacing--40);
	border-top: 1px solid var(--wp--preset--color--rule);
	clear: both;
}

.mr-suggest__title {
	font-family: var(--wp--preset--font-family--didot);
	font-size: var(--wp--preset--font-size--xl);
	line-height: 1.15;
	margin: 0;
	color: var(--wp--preset--color--ink);
}

.mr-suggest__note {
	margin: 0.4rem 0 var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--muted);
	max-width: 52ch;
}

.mr-suggest__grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--wp--preset--spacing--30);
}

@media (min-width: 700px) {
	.mr-suggest__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 1000px) {
	.mr-suggest__grid { grid-template-columns: repeat(4, 1fr); }
}

.mr-suggest__grid li.product {
	width: auto;
	margin: 0;
	float: none;
	list-style: none;
}

.mr-suggest__grid li.product img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	margin-bottom: 0.7rem;
}

.mr-suggest__grid li.product .woocommerce-loop-product__title {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	line-height: 1.35;
	padding: 0;
	margin: 0 0 0.2rem;
	color: var(--wp--preset--color--ink);
}

/* Στο καλάθι η πρόταση δεν πρέπει να ανταγωνίζεται το κουμπί ολοκλήρωσης. */
.mr-suggest--cart {
	margin-top: var(--wp--preset--spacing--50);
}

/* ==========================================================================
   Καθολικά
   ========================================================================== */

:where(a:focus-visible),
:where(button:focus-visible),
:where(input:focus-visible) {
	outline: 2px solid var(--wp--preset--color--garnet);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
	}
}