/*
 * Cassoni EQM: vista 3D nella galleria e modulo preventivo nella scheda prodotto.
 * Colori e caratteri vengono dal tema Porto (variabili --porto-*); qui solo layout e i pochi elementi nuovi.
 */

/* ---------- galleria: vista 3D ---------- */
.eqm-cx-gallery { position: relative; }
.eqm-cx-view {
	position: relative;
	aspect-ratio: 4 / 5;
	background: var(--porto-gray-1, #f4f4f4);
	border: 1px solid var(--porto-gray-2, #e7e7e7);
	overflow: hidden;
}
.eqm-cx-stage { position: absolute; inset: 0; touch-action: none; cursor: grab; }
.eqm-cx-stage:active { cursor: grabbing; }
.eqm-cx-stage canvas { display: block; width: 100%; height: 100%; }
.eqm-cx-gallery .eqm-cx-photo { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: contain; background: #fff; }
.eqm-cx-photo[hidden], .eqm-cx-tools[hidden], .eqm-cx-hint[hidden], .eqm-cx-err[hidden] { display: none !important; }
.eqm-cx-hint {
	position: absolute; left: 16px; top: 12px; margin: 0;
	font-size: 12px; line-height: 1.5; color: var(--porto-body-color, #777);
	pointer-events: none;
}
.eqm-cx-tools {
	position: absolute; left: 12px; right: 12px; bottom: 12px;
	display: flex; flex-wrap: nowrap; justify-content: flex-end; gap: 5px;
}
.eqm-cx-tool {
	height: 32px; padding: 0 9px; margin: 0;
	background: #fff; color: var(--porto-heading-color, #222529);
	border: 1px solid var(--porto-gray-2, #e7e7e7); border-radius: 0;
	font-family: inherit; font-size: 10.5px; font-weight: 700; letter-spacing: 0; text-transform: uppercase; line-height: 30px; white-space: nowrap;
	cursor: pointer; transition: background-color .2s, color .2s, border-color .2s;
}
.eqm-cx-tool:hover, .eqm-cx-tool[aria-pressed="true"] {
	background: var(--porto-heading-color, #222529); border-color: var(--porto-heading-color, #222529); color: #fff;
}
.eqm-cx-tool--primary { background: var(--porto-primary-color, #d60a2e); border-color: var(--porto-primary-color, #d60a2e); color: #fff; margin-right: auto; }
.eqm-cx-tool--primary:hover { background: var(--porto-primary-light-5, #ef0c34); border-color: var(--porto-primary-light-5, #ef0c34); }
.eqm-cx-tool--primary[aria-pressed="true"] { background: #fff; color: var(--porto-primary-color, #d60a2e); border-color: var(--porto-primary-color, #d60a2e); }
.eqm-cx-tool[hidden] { display: none; }
.eqm-cx-err {
	position: absolute; left: 16px; right: 16px; bottom: 16px; margin: 0; padding: 10px 12px;
	background: #fff; border: 1px solid var(--porto-gray-2, #e7e7e7); font-size: 13px; line-height: 1.5;
}

/* inquadrature rapide, in alto a destra */
.eqm-cx-topbar { position: absolute; top: 10px; right: 10px; display: flex; gap: 6px; align-items: flex-start; }
.eqm-cx-views { display: flex; background: #fff; border: 1px solid var(--porto-gray-2, #e7e7e7); }
.eqm-cx-views[hidden] { display: none !important; }
.eqm-cx-views button {
	height: 28px; padding: 0 10px; margin: 0; border: 0; background: transparent; cursor: pointer;
	font-family: inherit; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .02em; color: var(--porto-body-color, #777);
}
.eqm-cx-views button + button { border-left: 1px solid var(--porto-gray-2, #e7e7e7); }
.eqm-cx-views button:hover { color: var(--porto-heading-color, #222529); }
.eqm-cx-views button[aria-pressed="true"] { background: var(--porto-heading-color, #222529); color: #fff; }

/* pulsante Ingrandisci, a sinistra delle inquadrature */
.eqm-cx-zoom {
	width: 30px; height: 30px; padding: 0; margin: 0;
	display: flex; align-items: center; justify-content: center; cursor: pointer;
	background: #fff; color: var(--porto-heading-color, #222529); border: 1px solid var(--porto-gray-2, #e7e7e7);
}
.eqm-cx-zoom:hover { background: var(--porto-heading-color, #222529); color: #fff; border-color: var(--porto-heading-color, #222529); }
.eqm-cx-zoom[hidden] { display: none; }

/* vista grande: finestra al centro pagina */
.eqm-cx-modal {
	width: min(1180px, 94vw); height: min(880px, 92vh); max-width: none; max-height: none;
	padding: 0; border: 0; background: #fff; overflow: hidden;
	box-shadow: 0 20px 60px rgba(0, 0, 0, .35);
}
.eqm-cx-modal[open] { display: flex; flex-direction: column; }
.eqm-cx-modal::backdrop { background: rgba(34, 37, 41, .78); }
.eqm-cx-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 12px 10px 20px; border-bottom: 1px solid var(--porto-gray-2, #e7e7e7); }
.eqm-cx-modal-title { font-size: 16px; font-weight: 600; color: var(--porto-heading-color, #222529); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eqm-cx-modal-close { flex: none; width: 36px; height: 36px; padding: 0; margin: 0; border: 0; background: none; font-size: 30px; line-height: 1; color: var(--porto-heading-color, #222529); cursor: pointer; }
.eqm-cx-modal-close:hover { color: var(--porto-primary-color, #d60a2e); }
.eqm-cx-modal-body { position: relative; flex: 1; min-height: 0; }
.eqm-cx-modal .eqm-cx-view { position: absolute; inset: 0; aspect-ratio: auto; border: 0; }
.eqm-cx-zoom .eqm-cx-ico-close, .eqm-cx-modal .eqm-cx-zoom .eqm-cx-ico-open { display: none; }
.eqm-cx-modal .eqm-cx-zoom .eqm-cx-ico-close { display: block; }
.eqm-cx-modal .eqm-cx-tool { height: 36px; line-height: 34px; padding: 0 14px; font-size: 11px; }
html.eqm-cx-modal-open { overflow: hidden; }

/* miniature come la galleria Porto */
.eqm-cx-thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 0; padding: 0; list-style: none; }
.eqm-cx-thumbs li { width: calc((100% - 32px) / 5); margin: 0; }
.eqm-cx-thumbs button {
	display: block; width: 100%; aspect-ratio: 1; padding: 0; margin: 0;
	background: #fff; border: 1px solid var(--porto-gray-2, #e7e7e7); cursor: pointer; overflow: hidden;
}
.eqm-cx-thumbs li.selected button { border: 2px solid var(--porto-heading-color, #222529); }
.eqm-cx-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eqm-cx-thumb-3d { background: var(--porto-gray-1, #f4f4f4) !important; }
.eqm-cx-thumb-3d span { font-size: 16px; font-weight: 700; letter-spacing: -.02em; color: var(--porto-heading-color, #222529); }

/* la colonna della galleria resta visibile mentre si scelgono le opzioni */
@media (min-width: 768px) {
	.eqm-cx-product .elementor-widget-porto_cp_image { position: sticky; top: 20px; align-self: flex-start; }
}

/* ---------- modulo nella colonna di destra ---------- */
body.single-product form.cart.eqm-cx-form { display: block; }
.eqm-cx-specs { margin: 0 0 10px; font-size: 14px; }
.eqm-cx-specs strong { color: var(--porto-heading-color, #222529); }

.eqm-cx-options { width: 100%; margin-bottom: 6px; }
.eqm-cx-options tr { display: block; padding-bottom: 6px; }
.eqm-cx-options th, .eqm-cx-options td { display: block; padding: 0; border: 0; }
.single-product .eqm-cx-options .label label { line-height: 32px; }
.eqm-cx-options .value { display: flex; flex-wrap: wrap; align-items: center; gap: 0 10px; }
.eqm-cx-options .filter-item-list { flex: 0 1 auto; }
.eqm-cx-options .filter-item-list a { text-decoration: none; }
.eqm-cx-options .filter-color { --porto-sw-size: 28px; }
.eqm-cx-chosen { font-size: 13px; color: var(--porto-heading-color, #222529); font-weight: 500; }

/* colore libero: un campione con l'arcobaleno, il selettore del browser sopra */
.eqm-cx-custom .filter-color { background: conic-gradient(#e33, #ec3, #3c6, #39e, #a3e, #e33); overflow: visible; cursor: pointer; margin: 5px 10px 5px 0; }
.eqm-cx-custom input[type="color"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; padding: 0; border: 0; text-indent: 0; }

.eqm-cx-acc { flex-direction: column; align-items: flex-start !important; }
.eqm-cx-acc label.checkbox { display: flex; align-items: center; gap: 8px; margin: 0; padding: 3px 0; font-size: 14px; line-height: 1.5; color: var(--porto-heading-color, #222529); cursor: pointer; }
.eqm-cx-acc input { margin: 0; }

.eqm-cx-pdf-now { margin: 14px 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
/* pulsante del PDF pieno, nel colore del sito (la cliente lo voleva più visibile, 30/10/2026) */
.eqm-cx-pdfbtn {
	display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 18px; margin: 0; cursor: pointer;
	background: var(--porto-primary-color, #d60a2e); color: #fff; border: 1px solid var(--porto-primary-color, #d60a2e);
	font-family: inherit; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .01em;
}
.eqm-cx-pdfbtn:hover { background: var(--porto-heading-color, #222529); border-color: var(--porto-heading-color, #222529); color: #fff; }
.eqm-cx-pdfbtn[disabled] { opacity: .6; cursor: wait; }
.eqm-cx-pdf-msg { flex-basis: 100%; font-size: 13px; }
.eqm-cx-ref { font-size: 13px; }
.eqm-cx-ref strong { color: var(--porto-heading-color, #222529); letter-spacing: .02em; }
.eqm-cx-request { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--porto-gray-2, #e7e7e7); }
.eqm-cx-request::after { content: ""; display: table; clear: both; }
.eqm-cx-title { margin: 0 0 4px; font-size: 16px; line-height: 24px; font-weight: 600; letter-spacing: -.01em; text-transform: uppercase; }
.eqm-cx-lead { margin: 0 0 14px; }
.eqm-cx-request .form-row { margin-bottom: 12px; }
.eqm-cx-request .form-row label { font-size: 12px; font-weight: 600; text-transform: uppercase; color: var(--porto-heading-color, #222529); margin-bottom: 4px; }
.eqm-cx-request .form-row .optional { font-weight: 400; text-transform: none; color: var(--porto-body-color, #777); }
.eqm-cx-request .input-text { width: 100%; }
.eqm-cx-request textarea.input-text { min-height: 84px; resize: vertical; }
.eqm-cx-request .woocommerce-invalid .input-text { border-color: #c10000; }
.eqm-cx-request .eqm-cx-privacy { clear: both; }
.eqm-cx-request .eqm-cx-privacy label { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; font-weight: 400; text-transform: none; color: var(--porto-body-color, #777); line-height: 1.5; }
.eqm-cx-request .eqm-cx-privacy input { margin-top: 3px; flex: none; }
.eqm-cx-promo-row { clear: both; }
.eqm-cx-promo-state { display: block; font-size: 12px; margin-top: 4px; }
.eqm-cx-promo-state.is-valid { color: #2fc589; }
.eqm-cx-promo-state.is-invalid { color: #c10000; }
.eqm-cx-error { clear: both; margin: 0 0 10px; color: #c10000; font-size: 13px; }
.eqm-cx-error[hidden] { display: none; }
.eqm-cx-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.single-product .product-summary-wrap .eqm-cx-submit { clear: both; width: 100%; margin: 4px 0 0; }
.single-product .product-summary-wrap .eqm-cx-submit::before { content: none; }
.eqm-cx-submit.loading { opacity: .7; pointer-events: none; }

.eqm-cx-models { margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--porto-gray-2, #e7e7e7); }
.eqm-cx-models-label { display: block; font-size: 12px; font-weight: 600; text-transform: uppercase; color: var(--porto-heading-color, #222529); margin-bottom: 4px; }
.eqm-cx-models .filter-item { text-decoration: none; }

/* scritta e logo sul cassone */
.eqm-cx-perso .value { gap: 6px 12px; }
.eqm-cx-options .eqm-cx-scritta { flex: 1 1 220px; max-width: 300px; margin: 0; text-transform: uppercase; }

/* prezzo sostituito («Preventivo gratuito») */
.eqm-cx-price { white-space: nowrap; }

/* ---------- pagina di conferma ---------- */
/* i passaggi carrello → pagamento non riguardano una richiesta di preventivo */
.eqm-cx-received .woo-page-header { display: none; }
.eqm-cx-received .wc-item-meta-label { white-space: nowrap; }
.eqm-cx-thanks { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 30px; align-items: start; margin: 10px 0 40px; }
.eqm-cx-thanks-img { padding: 0; border: 1px solid var(--porto-gray-2, #e7e7e7); background: var(--porto-gray-1, #f4f4f4); }
.eqm-cx-thanks-img img { display: block; width: 100%; height: auto; }
.eqm-cx-thanks-text h2 { margin-top: 0; }
.eqm-cx-thanks-text ol { padding-left: 1.2em; margin-bottom: 20px; }
.eqm-cx-thanks-text li { margin-bottom: 6px; }
.eqm-cx-thanks-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.eqm-cx-thanks-msg { min-height: 1.5em; font-size: 13px; }

@media (max-width: 767px) {
	.eqm-cx-view { aspect-ratio: 1 / 1; }
	.eqm-cx-tools { left: 8px; right: 8px; bottom: 8px; gap: 4px; flex-wrap: nowrap; }
	.eqm-cx-tool { height: 30px; line-height: 28px; padding: 0 8px; font-size: 10px; letter-spacing: 0; white-space: nowrap; }
	.eqm-cx-hint { display: none; }
	.eqm-cx-topbar { top: 8px; right: 8px; left: 8px; justify-content: space-between; }
	.eqm-cx-views button { padding: 0 8px; font-size: 10px; height: 26px; }
	.eqm-cx-zoom { width: 28px; height: 28px; }
	.eqm-cx-modal { width: 100vw; height: 100dvh; max-height: none; box-shadow: none; }
	.eqm-cx-modal .eqm-cx-tool { height: 32px; line-height: 30px; padding: 0 9px; font-size: 10.5px; }
	.eqm-cx-thumbs li { width: calc((100% - 24px) / 4); }
	.eqm-cx-thanks { grid-template-columns: 1fr; }
}

/* selle: pulsante accanto alla foto, modulo in fondo alla scheda */
.eqm-sella-vai { margin: 16px 0 0; }
.eqm-sella-vai .btn { font-size: 13px; font-weight: 700; text-transform: uppercase; padding: 12px 22px; }
.eqm-sella-fondo { max-width: 820px; margin: 10px auto 40px; padding-top: 10px; scroll-margin-top: 110px; }

/* telefono, schede dei cassoni: le opzioni subito sotto il 3D, il testo con caratteristiche e misure dopo il modulo
   (vocale della cliente del 30/10/2026: «la gente quando schiaccia deve vedere subito i colori, senza andare avanti e indietro») */
@media (max-width: 767px) {
	.eqm-cx-product .elementor-element-889898 > .elementor-widget-wrap { display: flex; flex-direction: column; }
	.eqm-cx-product .elementor-element-889898 > .elementor-widget-wrap > .elementor-element { order: 5; }
	.eqm-cx-product .elementor-element-04bfa52 { order: 0 !important; }
	.eqm-cx-product .elementor-element-4108949 { order: 1 !important; }
	.eqm-cx-product .elementor-element-dfadf36 { order: 2 !important; }
	.eqm-cx-product .elementor-element-31be6bf { order: 3 !important; margin-top: 24px; }
	.eqm-cx-product .elementor-element-4108949 .product_title { font-size: 22px; line-height: 1.25; margin-bottom: 8px; }
}
