/*
Theme Name: Saliver Child (Eurotrade)
Template: saliver
Version: 1.6.2
Description: Child theme container for Eurotrade: site-wide fixes and the brand shape motif (logo mark with two cut corners); hooks in functions.php that Elementor/ACF cannot do.
Author: umatter
*/

/* Theme post carousels with no matching projects render an empty slider: hide the whole widget. */
.elementor-widget-pxl_post_carousel:not(:has(.pxl-swiper-slide)) { display: none; }

/* Theme post carousels with up to 3 slides do not slide: hide their arrows and progress bar. */
.elementor-widget-pxl_post_carousel:not(:has(.pxl-swiper-wrapper > .pxl-swiper-slide:nth-child(4))) :is(.pxl-swiper-arrow-wrap, .pxl-swiper-dots-wrap) { display: none !important; }

/* ==========================================================================
   Brand motif (23/09/2026): the logo mark (green block, two cut corners, cut ratio 0.861)
   on images, tags, bullets and back-to-top. Buttons stay pill.
   Reusable Elementor CSS classes: .et-chamfer (any image/box), .et-tag, .et-bullet
   ========================================================================== */
:root { --et-green: #00FF85; --et-ink: #0A0A0A; --et-cut: 40px; --et-cut-sm: 18px; }
@media (max-width: 767px) { :root { --et-cut: 26px; --et-cut-sm: 12px; } }

.et-chamfer, .et-chamfer img,
.pxl-image-single .pxl-item--image img,
.elementor-990040 img,
.elementor-990075 .elementor-widget-theme-post-featured-image img,
.elementor-990075 .elementor-element-13c97567 img {
	border-radius: 0 !important;
	clip-path: polygon(var(--et-cut) 0, 100% 0, 100% calc(100% - var(--et-cut) * .861), calc(100% - var(--et-cut)) 100%, 0 100%, 0 calc(var(--et-cut) * .861));
}
.pxl-image-single, .pxl-image-single img { border-radius: 0 !important; }
.erga-gallery .gallery .gallery-item img,
.erga-gallery .wp-block-gallery figure img {
	border-radius: 0 !important;
	clip-path: polygon(var(--et-cut-sm) 0, 100% 0, 100% calc(100% - var(--et-cut-sm) * .861), calc(100% - var(--et-cut-sm)) 100%, 0 100%, 0 calc(var(--et-cut-sm) * .861));
}

/* Section labels: cut-corner tag with the mark before the text. */
.pxl-item--subtitle.px-sub-title-default {
	border-radius: 0 !important;
	clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 8.6px), calc(100% - 10px) 100%, 0 100%, 0 8.6px);
}
.pxl-item--subtitle.px-sub-title-default .pxl-item--subtext::before,
.et-tag::before,
.pxl-title--icon i.fa-check::before,
.et-bullet::before {
	content: "" !important;
	display: inline-block;
	width: .95em;
	height: .72em;
	background: var(--et-green);
	clip-path: polygon(33.3% 0, 100% 0, 100% 62%, 66.7% 100%, 0 100%, 0 38%);
}
.pxl-item--subtitle.px-sub-title-default .pxl-item--subtext::before,
.et-tag::before { margin-right: .5em; vertical-align: -.05em; }

/* Back to top: the green mark instead of the black circle. */
.pxl-scroll-top {
	border-radius: 0 !important;
	background: var(--et-green) !important;
	clip-path: polygon(33.3% 0, 100% 0, 100% 62%, 66.7% 100%, 0 100%, 0 38%);
}
.pxl-scroll-top::before, .pxl-scroll-top::after, .pxl-scroll-top .pxl-scroll-progress-circle { display: none !important; }
.pxl-scroll-top i { color: var(--et-ink) !important; }

/* Project page (single #990075): the facts row (Πελάτης / Τοποθεσία / Πότε / Χρήση). An empty ACF value removes the
   value widget and leaves the label alone: hide such cells, and the whole row when every value is empty. */
.elementor-990075 .elementor-element-27aabd7f > .e-con:not(:has(.elementor-widget-heading ~ .elementor-widget-heading)) { display: none !important; }
.elementor-990075 .elementor-element-27aabd7f:not(:has(.elementor-widget-heading ~ .elementor-widget-heading)) { display: none !important; }

/* Project cards (loop item #990040): the image had a fixed height and auto width, leaving a gap in wide cards. */
.elementor-990040 .elementor-widget-image a { display: block; }
.elementor-990040 .elementor-widget-image img { width: 100% !important; object-fit: cover; }

/* Project gallery: every photo the same size (4:3, 3 columns, 2 on mobile). The template made the first photo
   span two columns at 16:9, which left gaps in galleries with few photos. The lightbox shows the full, uncropped photo. */
.erga-gallery .gallery .gallery-item:first-child { grid-column: auto !important; }
.erga-gallery .gallery .gallery-item img,
.erga-gallery .gallery .gallery-item:first-child img { aspect-ratio: 4 / 3 !important; height: auto !important; }

/* Application pages (/efarmoges/<τύπος>/, archive template #990614): the Elementor hero carries the title,
   so the theme's page title banner is hidden there. */
.tax-erga_type #pxl-page-title-elementor { display: none !important; }

/* About page: the client list (29 organisations from the old site) as cut-corner chips with the logo mark. */
.et-clients { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.et-clients li { margin: 0; padding: 10px 16px; background: #F4F5F4; color: var(--et-ink); font-size: 13px; font-weight: 600; letter-spacing: .02em; line-height: 1.3;
	clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 8.6px), calc(100% - 10px) 100%, 0 100%, 0 8.6px); }
.et-clients li::before { content: ""; display: inline-block; width: .8em; height: .6em; margin-right: .5em; background: var(--et-green);
	clip-path: polygon(33.3% 0, 100% 0, 100% 62%, 66.7% 100%, 0 100%, 0 38%); }

/* ==========================================================================
   Footer (#2339), redesigned 23/09/2026: closing line + 2 pill buttons, logo in a white box with the
   logo-mark corners, certifications as chips, 3 link columns, one legal line, faint logo mark behind.
   Layout comes from the Elementor containers; this block adds the details. Class prefix etf-.
   ========================================================================== */
.etf { --etf-t1: #fff; --etf-t2: rgba(255,255,255,.64); --etf-t3: rgba(255,255,255,.42);
	overflow: hidden;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 77 58'%3E%3Cpath d='M76.51 0H25.5L0 21.95V57.77H51.01L76.51 35.82V0Z' fill='%23fff' fill-opacity='.03'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important; background-size: min(62%, 900px) auto !important; background-position: right -14vw bottom -390px !important; }
.etf a { transition: color .2s ease, background-color .2s ease, border-color .2s ease; }
.etf a[href^="mailto:"], .etf a[href^="mailto:"] * { text-transform: none !important; }
.etf .elementor-widget:not(:last-child) { margin-block-end: 0; }
.etf .etf-h { margin-block-end: 22px !important; }

/* 1 · closing line + buttons */
.etf .etf-title .elementor-heading-title { max-width: 15ch; color: var(--etf-t1); }
.etf .etf-title .elementor-heading-title span { background: linear-gradient(99deg, #fff 1%, var(--et-green) 98%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.etf .etf-actions { --width: auto; width: auto; flex: 0 0 auto; }
.etf .etf-btn .elementor-button { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 0 28px !important; border-radius: 999px !important;
	font-size: 15px !important; font-weight: 700 !important; line-height: 1 !important; white-space: nowrap; box-shadow: none !important; }
.etf .etf-btn .elementor-button * { color: inherit !important; fill: currentColor !important; }
.etf .etf-btn .elementor-button::before, .etf .etf-btn .elementor-button::after { display: none !important; }
.etf .etf-btn--main .elementor-button { background: var(--et-green) !important; color: var(--et-ink) !important; border: 1px solid var(--et-green) !important; }
.etf .etf-btn--main .elementor-button:hover { background: #fff !important; border-color: #fff !important; }
.etf .etf-btn--main .elementor-button-icon { transition: transform .2s ease; }
.etf .etf-btn--main .elementor-button:hover .elementor-button-icon { transform: translateX(3px); }
.etf .etf-btn--ghost .elementor-button { background: transparent !important; color: #fff !important; border: 1px solid rgba(255,255,255,.28) !important; }
.etf .etf-btn--ghost .elementor-button:hover { color: var(--et-green) !important; border-color: var(--et-green) !important; }

/* 2 · brand + three columns (grid: 1.35 / 1 / 1 / 1.35) */
.etf .etf-grid { display: grid !important; grid-template-columns: 1.35fr 1fr 1fr 1.35fr; gap: 48px; }
.etf .etf-grid > .e-con { --width: auto; width: auto; min-width: 0; }
.etf .etf-logo-box { width: auto; max-width: max-content; padding: 22px 28px; background: #fff; line-height: 0;
	clip-path: polygon(18px 0, 100% 0, 100% calc(100% - 15.5px), calc(100% - 18px) 100%, 0 100%, 0 15.5px); }
.etf .etf-logo-box img { display: block; height: auto; border-radius: 0 !important; }
.etf .etf-certs { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; max-width: 340px; }
.etf .etf-certs li { margin: 0; padding: 7px 12px; background: rgba(255,255,255,.07); color: rgba(255,255,255,.86); font-size: 12px; font-weight: 600; letter-spacing: .02em; line-height: 1.2;
	clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 6.9px), calc(100% - 8px) 100%, 0 100%, 0 6.9px); }
.etf .etf-h .elementor-heading-title { display: flex; align-items: center; gap: 10px; color: var(--etf-t1) !important; }
.etf .etf-h .elementor-heading-title::before { content: ""; flex: none; width: 12px; height: 9px; background: var(--et-green);
	clip-path: polygon(33.3% 0, 100% 0, 100% 62%, 66.7% 100%, 0 100%, 0 38%); }
.etf .etf-links .elementor-icon-list-text { color: var(--etf-t2); transition: color .2s ease; }
.etf .etf-links a:hover .elementor-icon-list-text { color: var(--et-green); }
.etf .etf-contact-body p { margin: 0; }
.etf .etf-contact-body a { color: inherit; text-decoration: none; }
.etf .etf-contact-body a:hover { color: var(--et-green); }
.etf .etf-contact-body .etf-phone { font-size: 24px; font-weight: 700; letter-spacing: -.01em; line-height: 1.2; color: var(--etf-t1); }
.etf .etf-contact-body .etf-mail { margin-top: 6px; font-weight: 500; color: var(--etf-t1); }
.etf .etf-contact-body .etf-addr { margin-top: 14px; }
.etf .etf-contact-body .etf-mail + .etf-addr { margin-top: 22px; }
.etf .etf-contact-body small { display: block; margin-bottom: 2px; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--etf-t3); }
.etf .etf-social .elementor-social-icons-wrapper { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 8px; }
.etf .etf-social .elementor-grid-item { margin: 0 !important; }
.etf .etf-social .elementor-social-icon { display: inline-grid; place-items: center; width: 42px; height: 42px; padding: 0 !important; border-radius: 0 !important;
	background: rgba(255,255,255,.08) !important; transition: background-color .2s ease;
	clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 8.6px), calc(100% - 10px) 100%, 0 100%, 0 8.6px); }
.etf .etf-social .elementor-social-icon i { color: #fff !important; font-size: 17px; }
.etf .etf-social .elementor-social-icon svg { fill: #fff !important; width: 17px; height: 17px; }
.etf .etf-social .elementor-social-icon:hover { background: var(--et-green) !important; }
.etf .etf-social .elementor-social-icon:hover i { color: var(--et-ink) !important; }
.etf .etf-social .elementor-social-icon:hover svg { fill: var(--et-ink) !important; }

/* 3 · legal line */
.etf .etf-copy p { margin: 0; }
.etf .etf-legal .elementor-icon-list-items { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0 !important; }
.etf .etf-legal .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; }
.etf .etf-legal .elementor-icon-list-item::after { display: none !important; }
.etf .etf-legal a:hover .elementor-icon-list-text { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 1024px) {
	.etf .etf-grid { grid-template-columns: 1fr 1fr; gap: 48px 32px; }
}
@media (max-width: 767px) {
	.etf { background-size: 130% auto !important; background-position: right -60vw bottom -130px !important; }
	.etf .etf-actions { width: 100%; }
	.etf .etf-btn, .etf .etf-btn .elementor-button { width: 100%; }
	.etf .etf-grid { gap: 40px 20px; }
	.etf .etf-brand, .etf .etf-contact { grid-column: 1 / -1; }
	.etf .etf-contact-body .etf-phone { font-size: 22px; }
}

/* Language switcher hidden while the site is Greek only (English comes with WPML). */
.elementor-widget-pxl_language_switch { display: none !important; }

/* About page: the NATO badge and its line are centred like the rest of the certifications section. */
.elementor-3465 .et-nato, .elementor-3465 .et-nato + .elementor-widget-text-editor { text-align: center !important; }
.elementor-3465 .et-nato img { margin: 0 auto; }

/* Contact page: travel directions under the addresses read as body text (only the lead-in is bold). */
.et-directions, .et-directions p { font-weight: 400 !important; color: #666 !important; font-size: 15px !important; line-height: 1.6 !important; }
.et-directions strong { font-weight: 700; color: var(--et-ink); }

/* Reusable photo gallery: an Elementor Text widget with the CSS class "et-gallery" that contains a [gallery] shortcode.
   Same-size 4:3 photos, 3 columns (2 on mobile), logo-mark corners; opens in the theme lightbox as a slideshow (functions.php 8). */
.et-gallery .gallery { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0 !important; }
.et-gallery .gallery .gallery-item,
#pxl-content-main .et-gallery .gallery .gallery-item { width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; float: none !important; }
.et-gallery .gallery .gallery-icon { padding: 0 !important; margin: 0 !important; }
.et-gallery .gallery .gallery-icon a { display: block; }
.et-gallery .gallery .gallery-item img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; display: block; border: 0 !important; border-radius: 0 !important;
	clip-path: polygon(var(--et-cut-sm) 0, 100% 0, 100% calc(100% - var(--et-cut-sm) * .861), calc(100% - var(--et-cut-sm)) 100%, 0 100%, 0 calc(var(--et-cut-sm) * .861)); }
.et-gallery .gallery .gallery-caption, .et-gallery .gallery br { display: none; }
@media (max-width: 767px) { .et-gallery .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } }
