/******* Do not edit this file ******* Simple Custom CSS and JS - by Silkypress.com Saved: Oct 08 2026 | 16:56:56 */ /* variables (edit here)*/ :root { /* Global Padding Variables - Editable */ /* Left and Right Padding All /Sections/Containers*/ --fluid-side-padding-min: 1.25rem; /* 20px */ --fluid-side-padding-max: 5rem; /* 80px */ /* Top and Bottom Padding All Containers*/ --section-xxl-padding-min: 9.375rem; /* 150px */ --section-xxl-padding-max: 10rem; /* 160px */ --section-xl-padding-min: 6.875rem; /* 110px */ --section-xl-padding-max: 7.5rem; /* 120px */ --section-l-padding-min: 5.625rem; /* 90px */ --section-l-padding-max: 6.25rem; /* 100px */ --section-m-padding-min: 5rem; /* 80px */ --section-m-padding-max: 5rem; /* 80px */ --section-s-padding-min: 3.75rem; /* 60px */ --section-s-padding-max: 3.75rem; /* 60px */ --section-xs-padding-min: 2.5rem; /* 40px */ --section-xs-padding-max: 2.5rem; /* 40px */ --section-xxs-padding-min: 1.5rem; /* 24px */ --section-xxs-padding-max: 1.5rem; /* 24px */ --section-header-padding-min: 1.25rem; /* 20px */ --section-header-padding-max: 1.25rem; /* 20px */ /* Hero Sections Height Variable */ --section-hero-height: 100vh; /* 100% the screen height */ /* Offset Padding for Overlay Headers */ --section-offset-header: 80px; /* Adjust to the overlay header's negative margin */ /* Width For Narrow Sections*/ --section-narrow: 62.5rem; /* 1000px */ --section-narrow-xs: 45rem; /* 720px */ /* Ονομασία μεταβλητών με βάση το όνομα της γραμματοσειράς */ --font-elektr: "AC-Elektr", sans-serif; --font-adelphi: "adelphi-pe-variable", sans-serif; --font-pixel: "FreePixel", sans-serif; /* Υποθέτοντας ότι είναι pixel/mono font */ --font-tektur:"Tektur", sans-serif; --main-color:#000000; --second-color:#48e8ff; } /* CSS Template (do not edit below) */ /* Section/Container Padding - Fluid Variants */ .section-xxl { padding-top: clamp(var(--section-xxl-padding-min), 1.087vw + 9.13rem, var(--section-xxl-padding-max)); padding-bottom: clamp(var(--section-xxl-padding-min), 1.087vw + 9.13rem, var(--section-xxl-padding-max)); padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; } .section-xl { padding-top: clamp(var(--section-xl-padding-min), 1.087vw + 6.63rem, var(--section-xl-padding-max)); padding-bottom: clamp(var(--section-xl-padding-min), 1.087vw + 6.63rem, var(--section-xl-padding-max)); padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; } .section-l { padding-top: clamp(var(--section-l-padding-min), 1.087vw + 5.38rem, var(--section-l-padding-max)); padding-bottom: clamp(var(--section-l-padding-min), 1.087vw + 5.38rem, var(--section-l-padding-max)); padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; } .section-m { padding-top: clamp(var(--section-m-padding-min), 0vw + 5rem, var(--section-m-padding-max)); padding-bottom: clamp(var(--section-m-padding-min), 0vw + 5rem, var(--section-m-padding-max)); padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; } .section-s { padding-top: clamp(var(--section-s-padding-min), 0vw + 3.75rem, var(--section-s-padding-max)); padding-bottom: clamp(var(--section-s-padding-min), 0vw + 3.75rem, var(--section-s-padding-max)); padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; } .section-xs { padding-top: clamp(var(--section-xs-padding-min), 0vw + 2.5rem, var(--section-xs-padding-max)); padding-bottom: clamp(var(--section-xs-padding-min), 0vw + 2.5rem, var(--section-xs-padding-max)); padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; } .section-xxs { padding-top: clamp(var(--section-xxs-padding-min), 0vw + 1.5rem, var(--section-xxs-padding-max)); padding-bottom: clamp(var(--section-xxs-padding-min), 0vw + 1.5rem, var(--section-xxs-padding-max)); padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; } .section-header { padding-top: clamp(var(--section-header-padding-min), 0vw + 1.25rem, var(--section-header-padding-max)); padding-bottom: clamp(var(--section-header-padding-min), 0vw + 1.25rem, var(--section-header-padding-max)); padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important; } /* Hero Container/Sections Height */ .section-hero { min-height: var(--section-hero-height)!important; } .section-hero .e-con-inner { justify-content: center!important; } /* Full Width Sections - No Side Padding */ .section-full div { max-width: 100%!important; } /* Narrow Sections */ .section-narrow .e-con-inner { max-width: var(--section-narrow)!important; } .section-narrow-xs .e-con-inner { max-width: var(--section-narrow-xs)!important; } /* Offset Padding for Overlay Headers */ .section-offset { padding-top: calc(var(--section-offset-header) + var(--section-xxl-padding-min)); } @media(max-width:767px){ .desktop-element{ display:none; } } @media(min-width:768px){ .mobile-element{ display:none; } } html, body{ overflow-x:hidden!important; } /* HEADER */ /* --- 1. Βασική Στοίχιση & Κενά --- */ .led-sign { display: flex; align-items: center; justify-content: center; gap: 10px; overflow: hidden; } /* Προετοιμασία για Performance (Ενημερώνει τον browser τι θα αλλάξει) */ .led-sign .elementor-heading-title, .led-sign .elementor-widget-icon svg { will-change: opacity, filter; } /* --- 2. Εφέ Καθαρού Neon στο Κείμενο --- */ .led-sign .elementor-heading-title { margin: 0; color: #f0ffff; /* Ένα πολύ απαλό "παγωμένο" λευκό για ρεαλισμό */ /* Δύο επίπεδα σκιάς: Ένα κοντινό (0.9 opacity) και ένα πιο διάχυτο (0.4) για βάθος χωρίς "βρωμιά" */ text-shadow: 0 0 10px rgba(74, 232, 255, 0.9), 0 0 25px rgba(74, 232, 255, 0.4); animation: pro-neon-flicker 7s infinite; } /* --- 3. Εφέ Καθαρού Neon στο SVG Εικονίδιο --- */ .led-sign .elementor-widget-icon svg { filter: drop-shadow(0 0 10px rgba(74, 232, 255, 0.9)) drop-shadow(0 0 25px rgba(74, 232, 255, 0.4)); animation: pro-neon-flicker 7s infinite; } /* --- Keyframes (Με ακρίβεια χιλιοστού του δευτερολέπτου) --- */ @keyframes pro-neon-flicker { 0%, 29.9% { opacity: 1; } 30%, 30.5% { opacity: 0.15; } 30.6%, 32% { opacity: 1; } 32.1%, 42.1% { opacity: 0.15; } /* Ακριβώς 0.7s σβηστό (Γκρι) */ 42.2%, 46% { opacity: 0.5; } /* Ελαφριά λάμψη */ 46.1%, 46.5% { opacity: 0.2; } 46.6%, 49% { opacity: 0.6; } 49.1%, 100% { opacity: 1; } } /* --- 4. Mobile Marquee (Hardware Accelerated & UX Optimized) --- */ @media (max-width: 768px) { .led-sign { justify-content: flex-start; flex-wrap: nowrap !important; width: 100%; /* Pro UX: Ομαλό ξεθώριασμα δεξιά-αριστερά αντί για απότομο κόψιμο */ -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%); mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%); } .led-sign > .elementor-widget { flex-shrink: 0; white-space: nowrap; will-change: transform; /* Performance */ animation: marquee-scroll-pro 12s linear infinite; /* Λίγο πιο αργό για καλύτερη ανάγνωση */ } /* Pro UX: Σταματάει όταν ο χρήστης ακουμπάει/κρατάει την οθόνη */ .led-sign:hover > .elementor-widget, .led-sign:active > .elementor-widget { animation-play-state: paused; } /* Χρήση translate3d για GPU επιτάχυνση (απόλυτα ομαλή κίνηση) */ @keyframes marquee-scroll-pro { 0% { transform: translate3d(100vw, 0, 0); } 100% { transform: translate3d(-150vw, 0, 0); } } } /* --- 5. ΠΡΟΣΒΑΣΙΜΟΤΗΤΑ (Accessibility / Pro Level) --- */ /* Αν ο χρήστης έχει ζητήσει "Μειωμένη Κίνηση" στις ρυθμίσεις του κινητού/υπολογιστή του: */ @media (prefers-reduced-motion: reduce) { .led-sign .elementor-heading-title, .led-sign .elementor-widget-icon svg, .led-sign > .elementor-widget { /* Απενεργοποίηση όλων των animations */ animation: none !important; opacity: 1 !important; transform: none !important; white-space: normal !important; } @media (max-width: 768px) { .led-sign { justify-content: center; /* Κεντράρισμα αντί για marquee */ flex-wrap: wrap !important; /* Επιστροφή στην κανονική ροή */ text-align: center; -webkit-mask-image: none; /* Αφαίρεση της μάσκας */ mask-image: none; } } } /* 1. Στήσιμο του wrapper του εικονιδίου ως σημείο αναφοράς */ .nc-mini-cart .elementor-button-icon { position: relative !important; display: inline-flex !important; align-items: center; justify-content: center; } /* 2. Στήσιμο του αριθμού ποσότητας (Badge) στο κέντρο */ .nc-mini-cart .elementor-button-icon-qty { position: absolute !important; /* Το 55% το κατεβάζει ελάχιστα πιο κάτω για να αποφύγει το "χερούλι" της τσάντας */ top: 68% !important; left: 49% !important; transform: translate(-50%, -50%) !important; /* Διαστάσεις και responsive συμπεριφορά */ margin: 0 !important; padding: 2px !important; min-width: 1.8em !important; height: 1.8em !important; /* Κεντράρισμα του αριθμού εσωτερικά */ display: flex !important; align-items: center !important; justify-content: center !important; /* Κυκλικό σχήμα χωρίς να ξεχειλίζει */ border-radius: 50% !important; overflow: hidden !important; z-index: 5 !important; /* Τυπογραφία */ font-size: 14px !important; font-family: var(--font-pixel); line-height: 1 !important; white-space: nowrap !important; color:var(--second-color)!important; } /* 3. Εξασφάλιση ότι το SVG μένει πίσω και προσαρμόζεται σωστά */ .nc-mini-cart .elementor-button-icon svg { position: relative !important; z-index: 1 !important; display: block !important; max-width: 100% !important; height: auto !important; min-width:clamp(1.875rem, 1.4063rem + 1.9737vw, 2.8125rem); } /* Remove temporary border after hover */ .nc-mini-cart .elementor-menu-cart__toggle_button, .nc-mini-cart .elementor-menu-cart__toggle_button:hover, .nc-mini-cart .elementor-menu-cart__toggle_button:focus, .nc-mini-cart .elementor-menu-cart__toggle_button:focus-visible, .nc-mini-cart .elementor-menu-cart__toggle_button:active { border: 0 !important; border-width: 0 !important; border-style: none !important; border-color: transparent !important; outline: 0 !important; box-shadow: none !important; } /* Prevent Elementor from animating border properties */ .nc-mini-cart .elementor-menu-cart__toggle_button { transition: color 0.3s ease, background-color 0.3s ease, opacity 0.3s ease, transform 0.3s ease !important; } /* Cover any border created by pseudo-elements */ .nc-mini-cart .elementor-menu-cart__toggle_button::before, .nc-mini-cart .elementor-menu-cart__toggle_button::after { border: 0 !important; outline: 0 !important; box-shadow: none !important; } .nc-mini-cart .elementor-menu-cart__product-name.product-name a{ font-size: 1rem; } .nc-mini-cart .elementor-menu-cart__subtotal{ padding-block:5px!important; } /* NC Mini Cart - Thin custom scrollbar */ .nc-mini-cart .elementor-menu-cart__products { scrollbar-width: thin; scrollbar-color: rgba(74, 232, 255, 0.55) rgba(255, 255, 255, 0.03); } .nc-mini-cart .elementor-menu-cart__products::-webkit-scrollbar { width: 4px; } .nc-mini-cart .elementor-menu-cart__products::-webkit-scrollbar-track { margin: 12px 0; background: transparent; } .nc-mini-cart .elementor-menu-cart__products::-webkit-scrollbar-thumb { background: linear-gradient( 180deg, rgba(74, 232, 255, 0.30), rgba(74, 232, 255, 0.75) ); border-radius: 20px; box-shadow: 0 0 5px rgba(74, 232, 255, 0.30); } /* END HEADER */ /* SINGLE PRODUCT */ .nc-product-gallery .woocommerce-product-gallery .flex-viewport, .nc-product-gallery .woocommerce-product-gallery__wrapper{ border-radius: 24px !important; border: 1px solid rgba(255, 255, 255, 0.2) !important; box-shadow: 0 8px 30px rgb(0 0 0), 0 0 15px rgb(255 255 255) !important; overflow: hidden !important; } .nc-product-short-desc ul { list-style: none; padding-left: 0; } /* Ρυθμίζουμε όλα τα li που είναι άμεσα παιδιά ενός ul */ .nc-product-short-desc ul li { position: relative; padding-left: 45px; /* Απόσταση κειμένου από το εικονίδιο */ margin-bottom: 10px; } /* Προσθέτουμε το custom SVG εικονίδιο */ .nc-product-short-desc ul li::before { content: ""; position: absolute; left: 0; top: 50%; /* Κεντράρει το εικονίδιο κάθετα στο κείμενο */ transform: translateY(-50%); width: 34px; /* Μέγεθος εικονιδίου */ height: 34px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 350 300'%3E%3Cpath fill='%2300e5ff' d='M342.9,230.45c0,11.18-2.11,22.07-6.28,32.34H43.97c.53-28.77,24.1-52.02,52.97-52.02,3.26,0,6.49.3,9.66.89.4.06.8-.13,1.01-.49,12.56-22.24,36.19-36.06,61.7-36.06,6.24,0,12.41.82,18.35,2.41.38.11.78-.02,1.01-.34,16.49-20.99,41.24-33.04,67.91-33.04,47.58,0,86.3,38.7,86.3,86.3Z'/%3E%3C/svg%3E"); background-size: contain; background-repeat: no-repeat; background-position: center; } .nc-product-layout .xt_woovs-auto-select-on-select ul.xt_woovs-swatches li{ padding-block:1.5rem!important; line-height:0em!important; font-size:clamp(0.8rem, 0.727rem + 0.36vw, 1rem)!important; border-radius:12px!important; } .nc-product-layout tr[data-attribute="pa_megisti-diastasi"] td.label{ padding-bottom:0px!important; } .nc-product-layout tr[data-attribute="pa_megisti-diastasi"] td.value{ background-color:transparent!important; padding-bottom:0px!important; } .nc-product-layout .yith-wapo-block > div{ background-color:transparent!important; } .nc-product-layout h5.wapo-addon-title { font-size:clamp(1rem, 0.9rem + 0.4211vw, 1.2rem)!important; text-transform:uppercase; font-weight:600; } .nc-product-layout .yith-wapo-block .yith-wapo-addon .yith-wapo-option label, .nc-product-layout .yith-wapo-block .yith-wapo-addon .yith-wapo-option div.label{ font-family:var(--font-adelphi); font-size:clamp(0.8rem, 0.727rem + 0.36vw, 1rem)!important; } /* Στοχεύουμε απευθείας τις εικόνες μέσα στις επιλογές του YITH */ .nc-product-layout .yith-wapo-option .image img { width: 100% !important; aspect-ratio: 16 / 9 !important; object-fit: contain !important; object-position: center !important; display: block !important; margin-inline:auto; } .nc-product-layout .yith-wapo-option .label-container-display { display: flex; flex-direction: column; justify-content: space-between; height: 100%; } .nc-related-products .swiper.elementor-loop-container.elementor-grid{ padding:10px!important; } /* 1. Γενικές ρυθμίσεις για να κρύψουμε το κείμενο και να δημιουργήσουμε τον "καμβά" */ .nc-shop-products .elementor-pagination .page-numbers.prev, .nc-shop-products .elementor-pagination .page-numbers.next { font-size: 0 !important; /* Εξαφανίζει το κείμενο */ color: transparent; display: inline-block; width: 40px; /* Προσάρμοσε το συνολικό πλάτος του κουμπιού */ height: 40px; /* Προσάρμοσε το συνολικό ύψος του κουμπιού */ padding: 0; vertical-align: middle; /* Ρυθμίσεις για το background image (τα SVGs) */ background-size: 20px; /* Προσάρμοσε το μέγεθος του βέλους (π.χ. contain ή συγκεκριμένα pixels) */ background-position: center; background-repeat: no-repeat; transition: opacity 0.3s ease; } /* Εφέ hover (προαιρετικό) */ .nc-shop-products .elementor-pagination .page-numbers.prev:hover, .nc-shop-products .elementor-pagination .page-numbers.next:hover { opacity: 0.7; } /* 2. SVG Icon για το κουμπί PREVIOUS */ .nc-shop-products .elementor-pagination .page-numbers.next { background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 169.61 139.42'%3E%3Cpath fill='%234ae8ff' d='m85.9,0c6.84.13,13.68.09,20.51,0-.22,3.81.44,7.71-.19,11.46-2.12-.2-4.23-.14-6.35-.1.1,4.59-.24,9.21.25,13.8,2.08-.3,4.19-.35,6.3-.4-.06,1.51-.1,3.03-.11,4.56.85-.08,1.71-.17,2.57-.26-.02,1.38-.05,2.76-.07,4.14,1.36-.07,2.72-.12,4.09-.15-.04.92-.07,1.84-.11,2.76,1.74-.09,3.48-.15,5.22-.2.37,1.49-.66,4.57,1.88,4.13.05,1.86.09,3.72.11,5.57,3.01,0,6.02-.14,9.02-.26-.03,1.07-.07,2.15-.07,3.23.97-.04,1.95-.07,2.94-.11.91-1.16,1.46-2.99-.45-3.48.03-2.87.18-5.74.2-8.61-4.08,0-8.15-.05-12.22-.07-.09-4.09-.5-8.17-.37-12.26-4.2-.03-8.42.15-12.61-.25-.03-3.29.06-6.58,0-9.88-.15-.9.33-1.69.59-2.51,4.3.18,8.6.11,12.9.13.02,3.97,0,7.95,0,11.91,4.09.11,8.18.11,12.27-.03-.07,3.98,0,7.96.03,11.95,4.15-.05,8.31.05,12.46-.13.05,4.28.11,8.56.03,12.85,4.16-.31,8.33-.06,12.49-.26.02,4.63-.05,9.26.01,13.9,4.13.15,8.24-.11,12.37-.21-.09,5.87-.11,11.74-.08,17.61-4.07,0-8.14.03-12.22.06.11,4.16-.03,8.32.08,12.48-4.22-.09-8.45.06-12.67,0,.11,4.22-.05,8.44.1,12.66-4.25-.02-8.5.11-12.75.05.05,4-.09,8.01-.03,12.01-4.15-.11-8.3,0-12.44.05,0,3.96-.12,7.92,0,11.88-4.43-.12-8.86.03-13.28-.08.03,3.83-.11,7.66-.02,11.48-6.82-.28-13.65-.11-20.46-.13.11-12.86-.05-25.72,0-38.58-28.61,0-57.21,0-85.82-.04.04-20.79.03-41.58-.02-62.36,28.64.15,57.28-.03,85.91.08-.02-12.79,0-25.58-.03-38.37m46.33,56.88c.57-.13,1.7-.38,2.26-.5,0,1.16,0,2.33.03,3.51,3.09-.03,6.19-.15,9.3-.07,1.4-2.12.52-4.81.79-7.19-.69-.26-1.36-.53-2.02-.82.09-1.15.52-2.23.88-3.31-3.44-.16-6.88-.2-10.32-.21l-.09-.85c-1.73,2.8-.49,6.33-.83,9.44m-118.25-5.37c.3,9.35-.13,18.7.19,28.04,2.25-.03,4.51,0,6.76.11-.19-7.14-.03-14.27-.15-21.41,25.94.21,51.88,0,77.81.23-.1-2.33-.08-4.65,0-6.97-28.2-.03-56.39-.07-84.59,0m130.56,7.23c-.06,2.49.01,4.98,0,7.48.44,0,1.31,0,1.75,0-.04,1.74-.06,3.47-.06,5.22,3.68-.02,7.36-.13,11.05.05.08-1.59.17-3.19.19-4.79-2.11-.87-.68-3.7-1.06-5.45-3.35-.07-6.68.21-10.02.34-.42-1.1.26-3.46-1.84-2.85h-.01Z'/%3E%3C/svg%3E"); } /* 3. SVG Icon για το κουμπί NEXT */ .nc-shop-products .elementor-pagination .page-numbers.prev { background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 169.61 139.42'%3E%3Cpath fill='%234ae8ff' d='m83.73.02c-.02,12.79,0,25.58-.03,38.37,28.63-.11,57.27.07,85.91-.08-.05,20.78-.06,41.57-.02,62.36-28.61.04-57.21.04-85.82.04.05,12.86-.11,25.72,0,38.58-6.81.02-13.64-.15-20.46.13.09-3.82-.05-7.65-.02-11.48-4.42.11-8.85-.04-13.28.08.12-3.96,0-7.92,0-11.88-4.14-.04-8.29-.16-12.44-.05.06-4-.08-8.01-.03-12.01-4.25.06-8.5-.07-12.75-.05.15-4.22,0-8.44.1-12.66-4.22.07-8.45-.08-12.67,0,.11-4.16-.03-8.32.08-12.48-4.08-.03-8.15-.06-12.22-.06.03-5.87.01-11.74-.08-17.61,4.13.1,8.24.36,12.37.21.06-4.64,0-9.27.01-13.9,4.16.2,8.33-.05,12.49.26-.08-4.29-.02-8.57.03-12.85,4.15.18,8.31.08,12.46.13.03-3.99.1-7.97.03-11.95,4.09.14,8.18.14,12.27.03,0-3.96-.01-7.94,0-11.91,4.3-.02,8.6.05,12.9-.13.26.82.74,1.61.59,2.51-.05,3.3.04,6.59,0,9.88-4.19.4-8.41.22-12.61.25.13,4.09-.28,8.17-.37,12.26-4.07.02-8.14.07-12.22.07.02,2.87.17,5.74.2,8.61-1.91.49-1.36,2.32-.45,3.48.99.04,1.97.07,2.94.11,0-1.08-.04-2.16-.07-3.23,3,.12,6.01.26,9.02.26.02-1.85.06-3.71.11-5.57,2.54.44,1.51-2.64,1.88-4.13,1.74.05,3.48.11,5.22.2-.04-.92-.07-1.84-.11-2.76,1.37.03,2.73.08,4.09.15-.02-1.38-.05-2.76-.07-4.14.86.09,1.72.18,2.57.26,0-1.53-.05-3.05-.11-4.56,2.11.05,4.22.1,6.3.4.49-4.59.15-9.21.25-13.8-2.12-.04-4.23-.1-6.35.1-.63-3.75.03-7.65-.19-11.46,6.83.08,13.67.12,20.51,0m-46.31,56.9c-.34-3.11.9-6.64-.83-9.44l-.09.85c-3.44.01-6.88.05-10.32.21.36,1.08.79,2.16.88,3.31-.66.29-1.33.56-2.02.82.27,2.38-.61,5.07.79,7.19,3.11-.08,6.21.04,9.3.07.02-1.18.03-2.35.03-3.51.56.12,1.69.37,2.26.5m118.24-5.37c-28.2-.07-56.39-.03-84.59,0,.07,2.32.09,4.64,0,6.97,25.93-.24,51.87-.02,77.81-.23-.12,7.14.04,14.27-.15,21.41,2.25-.11,4.51-.14,6.76-.11.32-9.34-.11-18.69.19-28.04m-130.58,7.22c-2.1-.61-1.42,1.75-1.84,2.85-3.34-.13-6.67-.41-10.02-.34-.38,1.75,1.05,4.58-1.06,5.45.02,1.6.11,3.2.19,4.79,3.69-.18,7.37-.07,11.05-.05,0-1.75-.02-3.48-.06-5.22.44,0,1.31,0,1.75,0-.01-2.5.06-4.99,0-7.48h-.01Z'/%3E%3C/svg%3E"); } .nc-shop-products span.page-numbers.current { text-decoration:underline; } /* Βασικό Κεντράρισμα */ .nc-shop-products .elementor-pagination { display: flex !important; justify-content: center; align-items: center; width: 100%; flex-wrap: wrap; gap: 10px; } /* Κρύβει μόνο την τιμή παραλλαγής μέσα στη φόρμα */ body.single-product #single-add-to-cart .woocommerce-variation-price { display: none !important; } .tp-woo-swatches .tp-swatches-color.selected{ border-color: var(--second-color)!important; } /* END SINGLE PRODUCT */ /* SHOP PAGE */ .filters-shortcode { background: rgba(255, 255, 255, 0.35); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); /* Λεπτό και ημιδιαφανές περίγραμμα για να δώσει την αίσθηση του γυαλιού */ border: 1px solid rgba(255, 255, 255, 0.1); /* Απαλή σκιά για να του δώσει βάθος και να το "σηκώσει" από το φόντο */ box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5); /* Προαιρετικά: Στρογγυλεμένες γωνίες (ταιριάζουν πολύ στο συγκεκριμένο style) */ border-radius: 32px; /* Εσωτερικό κενό (padding) για να μην ακουμπάει το περιεχόμενο στα άκρα - προσάρμοσέ το στις ανάγκες σου */ padding: 15px; color:var(--second-color)!important; font-family:var(--font-adelphi); } .filters-shortcode label{ color:var(--second-color)!important; font-family:var(--font-adelphi)!important; padding-bottom:0px; margin-left:0px!important; } .filters-shortcode h4{ font-size:clamp(1rem, 0.72rem + 0.6737vw, 1.2rem); text-transform:uppercase; font-family:var(--font-adelphi); font-weight:400; } .filters-shortcode .woof_list_label .woof_label_term{ background-color:transparent; border:2px solid var(--second-color); border-radius:8px; padding-inline:10px; height:30px; font-size:.8751rem; } .filters-shortcode .woof_list_label .woof_label_term:hover{ background-color:var(--second-color); color:var(--main-color); border-color:var(--second-color); } .filters-shortcode .woof_list_label .woof_label_term.checked{ background-color:var(--second-color); color:var(--main-color); border-color:var(--second-color); } .filters-shortcode .widget_price_filter .price_slider_wrapper .ui-widget-content{ background-color:var(--main-color); } .filters-shortcode .widget_price_filter .ui-slider .ui-slider-range, .filters-shortcode .widget_price_filter .ui-slider .ui-slider-handle{ background-color:var(--second-color)!important; } .filters-shortcode button.button.woof_reset_search_form { background-color:var(--main-color); color:var(--second-color); font-family:var(--font-adelphi); text-transform:uppercase; min-width:70%; max-width:70%; border-radius:32px; margin-inline:auto; } .filters-shortcode button.button.woof_reset_search_form:hover{ background-color:var(--second-color); color:var(--main-color); } .filters-shortcode .woof_submit_search_form_container { display:flex; flex-wrap:wrap; flex-direction:column-reverse; gap:10px; } .filters-shortcode button.button.woof_submit_search_form { background-color:var(--second-color); color:var(--main-color); font-family:var(--font-adelphi); text-transform:uppercase; min-width:100%; border-radius:32px; } .filters-shortcode button.button.woof_submit_search_form:hover{ background-color:white; color:var(--main-color); } /* Βεβαιώσου ότι το στοιχείο έχει overflow για να ενεργοποιηθεί το scroll */ .filters-shortcode { overflow-y: auto; /* Βάλε ένα μέγιστο ύψος (π.χ. max-height: 500px;) αν δεν έχεις ήδη, για να αναγκάσεις το περιεχόμενο να κάνει scroll */ /* Διακριτικό scrollbar για Firefox */ scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, 0.3) transparent; } /* --- Apple-style Scrollbar για Chrome, Safari, Edge --- */ /* 1. Καθορίζουμε το πλάτος (αρκετά λεπτό) */ .filters-shortcode::-webkit-scrollbar { width: 6px; } /* 2. Το "αυλάκι" (track) της μπάρας - το κάνουμε αόρατο */ .filters-shortcode::-webkit-scrollbar-track { background: transparent; margin: 8px 0; /* Αφήνει λίγο κενό πάνω-κάτω για να μην "χτυπάει" στις άκρες του container */ } /* 3. Η ίδια η μπάρα (thumb) */ .filters-shortcode::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, 0.3); /* Ημιδιαφανές λευκό (ταιριάζει με το γυαλί) */ border-radius: 10px; /* Στρογγυλεμένες άκρες (pill style) */ } /* 4. Προαιρετικά: Γίνεται ελαφρώς πιο ορατή όταν περνάς το ποντίκι από πάνω της */ .filters-shortcode::-webkit-scrollbar-thumb:hover { background-color: rgba(255, 255, 255, 0.5); } /* SHOP FILTERS */ @media(max-width:768px){ .filters-shortcode{ background-color:black!important; background:black!important; border:unset!important; } .filters-section .woof_hide_filter{ display:block!important; } .filters-section .woof_show_mobile_filter { position: fixed; bottom: 80px; right: 15px; z-index: 999999; background-color: var(--second-color); padding: 8px; border-radius: 50%; display: flex; justify-content: center; align-items: center; mix-blend-mode:multiply; } .filters-section .woof_hide_mobile_filter img{ padding: 8px; border-radius: 50%; background-color:white; width:40px; } .filters-section .woof_show_mobile_filter > span { display: none !important; } .filters-section .woof_show_filter_for_mobile.woof{ background: rgba(255, 255, 255, 0.35); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255, 255, 255, 0.1); box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5); border-radius: 32px; z-index:9999!important; } .filters-section .woof_redraw_zone{ display:none; } .filters-section .woof.woof_sid.woof_sid_neoncloud_filters.woof_hide_filter.woof_show_filter_for_mobile .woof_redraw_zone{ display:block; } } /* END SHOP PAGE */ /* SIDE MENU */ .off-canvas-menu .e-off-canvas__content{ background: rgb(255 255 255 / 25%); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-right: 1px solid rgba(255, 255, 255, 0.1); box-shadow: 0 4px 30px rgb(169 169 169 / 50%); } .off-canvas-menu .e-off-canvas__content .e-n-tabs-heading{ position:absolute; top:0px; left:0px; z-index:99; background-color:rgb(70 70 70); /* min-width:calc(100% + 20px); */ padding-bottom:10px; margin-left:-10px; margin-top:-10px; margin-inline:auto; } .off-canvas-menu .e-off-canvas__content .e-n-tabs-content{ overflow-y:auto; /* max-height: 90vh; margin-top:50px; padding-block: clamp(1.25rem, -0.2148rem + 4.6875vw, 3.125rem); */ } .off-canvas-menu .e-off-canvas__content .product-category.product h2{ padding:0px!important; line-height:1.1em!important; font-size:12px!important; font-weight:700!important; } .off-canvas-menu .e-off-canvas__content .product-category.product a{ display: flex; padding: 12px; flex-direction: column; justify-content: center; align-items: center; border-radius: 8px; background: #fff; box-shadow: 0 1px 2px #475b8140; height:90px; gap:10px; } .off-canvas-menu .e-off-canvas__content .product-category.product a img{ width:1.5em; height:auto; aspect-ratio:1/1; margin:0px; } .off-canvas-menu .e-off-canvas__content .product-category.product a mark.count{ display:none; } /* END OF SIDE MENU */ /* HOME PAGE */ .sale-points { position: relative; isolation: isolate; overflow: visible !important; max-width: 300px; padding: 20px; border-radius: 24px; background: radial-gradient( ellipse at 50% 40%, rgba(72, 232, 255, 0.14) 0%, rgba(72, 232, 255, 0.05) 40%, transparent 70% ), radial-gradient( circle at top left, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02) 60% ), rgba(255, 255, 255, 0.03); border: 1px solid rgba(72, 232, 255, 0.20); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); box-shadow: 0 0 25px rgba(72, 232, 255, 0.10), 0 0 70px rgba(72, 232, 255, 0.05), 0 10px 40px rgba(0, 0, 0, 0.55), inset 0 1px 1px rgba(255, 255, 255, 0.10), inset 0 0 35px rgba(72, 232, 255, 0.05); } .sale-points::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient( ellipse at 50% 35%, rgba(72, 232, 255, 0.10) 0%, rgba(255, 255, 255, 0.03) 40%, transparent 65% ); pointer-events: none; animation: innerGlow 4s ease-in-out infinite; } .sale-points::after { content: ""; position: absolute; inset: -1px; border-radius: inherit; border: 1px solid rgba(72, 232, 255, 0.25); box-shadow: 0 0 10px rgba(72, 232, 255, 0.15), inset 0 0 10px rgba(255, 255, 255, 0.03); pointer-events: none; animation: borderGlow 4s ease-in-out infinite; } @keyframes innerGlow { 0% { opacity: 0.5; } 50% { opacity: 1; } 100% { opacity: 0.5; } } @keyframes borderGlow { 0% { opacity: 0.4; box-shadow: 0 0 8px rgba(72, 232, 255, 0.10), inset 0 0 8px rgba(255,255,255,0.02); } 50% { opacity: 1; box-shadow: 0 0 22px rgba(72, 232, 255, 0.30), inset 0 0 14px rgba(255,255,255,0.04); } 100% { opacity: 0.4; box-shadow: 0 0 8px rgba(72, 232, 255, 0.10), inset 0 0 8px rgba(255,255,255,0.02); } } .sale-points .elementor-widget-icon-box, .sale-points .elementor-icon-box-wrapper{ height:100%; } .sale-points .elementor-icon-box-content{ display: flex; flex-direction: column; justify-content:flex-start; } /* SVG glow on hover */ .category-box svg { transition: filter 1s ease, stroke 0.4s ease; } .category-box:hover svg { filter: drop-shadow(0 0 6px #48e8ff) drop-shadow(0 0 14px #48e8ff) drop-shadow(0 0 30px rgba(72, 232, 255, 0.6)); } /* Text color */ .category-box .elementor-heading-title { position: relative; color: white; transition: color 0.3s ease; padding-bottom: 6px; } .category-box .elementor-heading-title { display: inline-block; /* κρίσιμο — κάνει το element ακριβώς όσο το κείμενο */ position: relative; color: white; transition: color 0.3s ease; padding-bottom: 6px; } .category-box:hover .elementor-heading-title { color: #48e8ff!important; } /* Γραμμή left to right */ .category-box .elementor-heading-title::after { content: ""; position: absolute; bottom: 0; left: 0; width: 0%; height: 1.5px; background: #48e8ff; box-shadow: 0 0 8px #48e8ff, 0 0 16px rgba(72, 232, 255, 0.5); transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1); } .category-box:hover .elementor-heading-title::after { width: 100%; } .newsletter-home { --newsletter-cyan: #4AE8FF; --newsletter-duration: 1.8s; position: relative; isolation: isolate; overflow: hidden; /* min-height: clamp(330px, 38vw, 520px); */ /* padding-block: clamp(40px, 6vw, 90px); */ /* Αρχικό σκοτεινό background */ background: #01090d; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), inset 0 -1px 0 rgba(255, 255, 255, 0.04); } /* ========================================= ΚΥΡΙΟ GRADIENT ========================================= */ .newsletter-home::before { content: ""; position: absolute; z-index: -2; /* inset: -3%; */ pointer-events: none; background: radial-gradient( ellipse 35% 85% at 63% 50%, rgba(74, 232, 255, 0.16) 0%, rgba(74, 232, 255, 0.07) 48%, transparent 78% ), linear-gradient( 90deg, #01090d 0%, #021018 15%, #062531 30%, #0b4758 43%, #13738a 55%, #21a9bf 68%, #35cee1 83%, var(--newsletter-cyan) 100% ); /* * Αρχικά βρίσκεται δεξιά και είναι μικρότερο. * Έτσι κινείται δεξιά → αριστερά και κάνει zoom-in. */ opacity: 0; transform: translate3d(12%, 0, 0) scale(0.88); transform-origin: right center; transition: opacity 1.15s ease-out, transform var(--newsletter-duration) cubic-bezier(0.16, 1, 0.3, 1); will-change: transform, opacity; } /* ========================================= ΑΠΑΛΟ CYAN GLOW ========================================= */ .newsletter-home::after { content: ""; position: absolute; z-index: -1; top: -25%; right: -12%; width: 58%; height: 150%; pointer-events: none; background: radial-gradient( ellipse at center, rgba(74, 232, 255, 0.22) 0%, rgba(74, 232, 255, 0.10) 38%, transparent 72% ); filter: blur(clamp(35px, 5vw, 80px)); opacity: 0; transform: translate3d(18%, 0, 0) scale(0.75); transform-origin: right center; transition: opacity 1.3s ease-out 0.15s, transform 2s cubic-bezier(0.16, 1, 0.3, 1); will-change: transform, opacity; } /* ========================================= ACTIVE VIEWPORT STATE ========================================= */ .newsletter-home.is-illuminated::before { opacity: 1; transform: translate3d(0, 0, 0) scale(1); } .newsletter-home.is-illuminated::after { opacity: 1; transform: translate3d(-8%, 0, 0) scale(1); } /* Το περιεχόμενο παραμένει πάνω από το gradient */ .newsletter-home > * { position: relative; z-index: 1; } /* ========================================= TABLET ========================================= */ @media (max-width: 1024px) { .newsletter-home::before { background: radial-gradient( ellipse 42% 80% at 65% 50%, rgba(74, 232, 255, 0.15) 0%, rgba(74, 232, 255, 0.06) 48%, transparent 78% ), linear-gradient( 95deg, #01090d 0%, #03141c 18%, #08313e 34%, #0d5668 48%, #16859a 61%, #25b5c8 75%, #39d5e5 88%, var(--newsletter-cyan) 100% ); } .newsletter-home::after { right: -20%; width: 70%; } } /* ========================================= MOBILE ========================================= */ @media (max-width: 767px) { .newsletter-home { min-height: clamp(500px, 145vw, 700px); } .newsletter-home::before { /* inset: -4%; */ /* * Στο mobile το gradient γίνεται κυρίως κάθετο, * ώστε να διατηρεί σωστή ισορροπία. */ background: radial-gradient( ellipse 90% 42% at 50% 73%, rgba(74, 232, 255, 0.16) 0%, rgba(74, 232, 255, 0.06) 48%, transparent 80% ), linear-gradient( 165deg, #01090d 0%, #03151d 20%, #083541 38%, #0e6171 54%, #178c9f 67%, #27b9ca 79%, #39d7e7 90%, var(--newsletter-cyan) 100% ); opacity: 0; transform: translate3d(14%, 0, 0) scale(0.86); transform-origin: right center; } .newsletter-home.is-illuminated::before { opacity: 1; transform: translate3d(0, 0, 0) scale(1); } .newsletter-home::after { top: 35%; right: -35%; width: 115%; height: 90%; transform: translate3d(30%, 0, 0) scale(0.72); } .newsletter-home.is-illuminated::after { opacity: 0.8; transform: translate3d(-5%, 0, 0) scale(1); } } /* ========================================= ACCESSIBILITY ========================================= */ @media (prefers-reduced-motion: reduce) { .newsletter-home::before, .newsletter-home::after { opacity: 1; transform: none; transition: none; } } /* END OF HOME PAGE */ /* --------------- SEARCH RESULTS ----------------- */ /* ===================================================== NEONCLOUD — LIVE SEARCH GLASSMORPHISM Scope: .nc-search-field ===================================================== */ .nc-search-field { --nc-cyan: #4AE8FF; --nc-cyan-dark: #089DB3; --nc-text: #F7FBFF; --nc-muted: rgba(235, 245, 250, 0.68); } /* ===================================================== SEARCH FORM ===================================================== */ .nc-search-field .e-search-form, .nc-search-field .e-search-form__container { position: relative; overflow: visible; } /* ===================================================== SEARCH INPUT Height και padding παραμένουν από το Elementor ===================================================== */ .nc-search-field input[type="search"], .nc-search-field .e-search-form__input { width: 100%; color: #101820 !important; caret-color: var(--nc-cyan-dark); background: linear-gradient( 135deg, rgba(255, 255, 255, 0.98), rgba(241, 250, 252, 0.91) ) !important; border: 1px solid rgba(255, 255, 255, 0.80) !important; border-radius: 18px !important; outline: none !important; box-shadow: 0 12px 35px rgba(0, 0, 0, 0.20), 0 2px 8px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 1); backdrop-filter: blur(22px) saturate(150%); -webkit-backdrop-filter: blur(22px) saturate(150%); transition: border-color 0.3s ease, box-shadow 0.3s ease, background 0.3s ease; } .nc-search-field input[type="search"]::placeholder, .nc-search-field .e-search-form__input::placeholder { color: rgba(16, 24, 32, 0.42) !important; opacity: 1; } .nc-search-field input[type="search"]:hover, .nc-search-field .e-search-form__input:hover { background: linear-gradient( 135deg, rgba(255, 255, 255, 1), rgba(244, 252, 253, 0.96) ) !important; border-color: rgba(74, 232, 255, 0.45) !important; } .nc-search-field input[type="search"]:focus, .nc-search-field .e-search-form__input:focus { color: #101820 !important; background: linear-gradient( 135deg, rgba(255, 255, 255, 1), rgba(237, 252, 255, 0.98) ) !important; border-color: rgba(74, 232, 255, 0.90) !important; box-shadow: 0 0 0 3px rgba(74, 232, 255, 0.13), 0 0 28px rgba(74, 232, 255, 0.15), 0 16px 42px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 1); } .nc-search-field input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /* ===================================================== SEARCH ICONS ===================================================== */ .nc-search-field .e-search-form__icon, .nc-search-field .e-search-form__submit, .nc-search-field .e-search-form__clear, .nc-search-field button[type="submit"] { color: #101820 !important; fill: #101820 !important; } .nc-search-field .e-search-form__icon svg, .nc-search-field .e-search-form__submit svg, .nc-search-field .e-search-form__clear svg, .nc-search-field button[type="submit"] svg { fill: currentColor !important; transition: color 0.25s ease, transform 0.25s ease, filter 0.25s ease; } .nc-search-field .e-search-form__submit:hover, .nc-search-field .e-search-form__clear:hover, .nc-search-field button[type="submit"]:hover { color: var(--nc-cyan-dark) !important; fill: var(--nc-cyan-dark) !important; } .nc-search-field .e-search-form__submit:hover svg, .nc-search-field .e-search-form__clear:hover svg, .nc-search-field button[type="submit"]:hover svg { transform: scale(1.1); filter: drop-shadow(0 0 6px rgba(74, 232, 255, 0.55)); } /* ===================================================== HIDE EMPTY RESULTS PANEL ===================================================== */ .nc-search-field .e-search-results-container.hide-loader:has(> .e-search-results:empty) { display: none !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } .nc-search-field .e-search-results-container.hide-loader .e-search-results:empty { display: none !important; } /* ===================================================== RESULTS GLASS PANEL ===================================================== */ .nc-search-field .e-search-results-container { position: absolute; z-index: 99999; width: 100%; max-height: min(570px, calc(100vh - 190px)); margin-top: 12px; padding: 12px !important; overflow-x: hidden; overflow-y: auto; background: radial-gradient( circle at 10% 0%, rgba(74, 232, 255, 0.13), transparent 34% ), linear-gradient( 145deg, rgba(13, 21, 29, 0.92), rgba(3, 7, 12, 0.86) ) !important; border: 1px solid rgba(74, 232, 255, 0.22) !important; border-radius: 22px !important; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55), 0 0 35px rgba(74, 232, 255, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.12); backdrop-filter: blur(28px) saturate(160%); -webkit-backdrop-filter: blur(28px) saturate(160%); animation: nc-search-reveal 0.32s cubic-bezier(0.22, 1, 0.36, 1) both; } @keyframes nc-search-reveal { from { opacity: 0; transform: translateY(-8px) scale(0.985); filter: blur(4px); } to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); } } .nc-search-field .e-search-results, .nc-search-field .e-search-results-list { background: transparent !important; } /* ===================================================== LOADING STATE ===================================================== */ .nc-search-field .e-search-results-container:not(.hide-loader) { display: block; min-height: 74px; } .nc-search-field .e-search-results-container:not(.hide-loader) .e-search-loader { display: flex !important; align-items: center; justify-content: center; min-height: 50px; } .nc-search-field .e-search-loader { background: transparent !important; backdrop-filter: none; -webkit-backdrop-filter: none; } .nc-search-field .e-search-loader svg { width: 30px; height: 30px; fill: var(--nc-cyan) !important; filter: drop-shadow(0 0 8px rgba(74, 232, 255, 0.70)); } /* ===================================================== RESULTS LIST ===================================================== */ .nc-search-field .e-search-results-list { display: flex; flex-direction: column; width: 100%; min-width: 0; gap: clamp(8px, 1vw, 11px); } /* ===================================================== PRODUCT GLASS CARD ===================================================== */ .nc-search-field .e-search-results-list .e-loop-item { position: relative; width: 100%; min-width: 0; overflow: hidden; background: linear-gradient( 120deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.035) ) !important; border: 1px solid rgba(255, 255, 255, 0.10); border-radius: 16px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 24px rgba(0, 0, 0, 0.14); transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.28s ease, background 0.28s ease, box-shadow 0.28s ease; } /* Cyan κάθετη γραμμή */ .nc-search-field .e-search-results-list .e-loop-item::before { content: ""; position: absolute; z-index: 3; top: 12%; bottom: 12%; left: 0; width: 3px; background: linear-gradient( 180deg, transparent, var(--nc-cyan), transparent ); opacity: 0; pointer-events: none; border-radius: 20px; box-shadow: 0 0 14px var(--nc-cyan); transition: opacity 0.28s ease; } .nc-search-field .e-search-results-list .e-loop-item:hover { transform: translateY(-2px); background: linear-gradient( 120deg, rgba(74, 232, 255, 0.13), rgba(255, 255, 255, 0.045) ) !important; border-color: rgba(74, 232, 255, 0.34); box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28), 0 0 22px rgba(74, 232, 255, 0.07), inset 0 1px 0 rgba(255, 255, 255, 0.12); } .nc-search-field .e-search-results-list .e-loop-item:hover::before { opacity: 1; } /* ===================================================== CLICKABLE LOOP CONTAINER Το κύριο container είναι πλέον hyperlink ===================================================== */ .nc-search-field .e-search-results-list .e-loop-item > a.e-con { position: relative; z-index: 2; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; width: 100% !important; max-width: 100% !important; min-width: 0; margin: 0; padding: clamp(8px, 1vw, 12px) !important; gap: clamp(10px, 1.5vw, 18px) !important; color: inherit !important; text-decoration: none !important; background: transparent !important; border: 0 !important; border-radius: 16px !important; outline: none; cursor: pointer; -webkit-tap-highlight-color: transparent; } .nc-search-field .e-search-results-list .e-loop-item > a.e-con:hover, .nc-search-field .e-search-results-list .e-loop-item > a.e-con:focus, .nc-search-field .e-search-results-list .e-loop-item > a.e-con:active, .nc-search-field .e-search-results-list .e-loop-item > a.e-con:visited { color: inherit !important; text-decoration: none !important; } /* Keyboard accessibility */ .nc-search-field .e-search-results-list .e-loop-item > a.e-con:focus-visible { outline: 2px solid var(--nc-cyan); outline-offset: -3px; box-shadow: inset 0 0 0 1px rgba(74, 232, 255, 0.20); } /* ===================================================== FLUID IMAGE CONTAINER ===================================================== */ .nc-search-field .e-loop-item > a.e-con > .e-con:has(> .elementor-widget-image) { flex: 0 1 clamp(82px, 18%, 150px) !important; width: clamp(82px, 18%, 150px) !important; max-width: clamp(82px, 18%, 150px) !important; min-width: 82px !important; align-self: stretch; overflow: hidden; aspect-ratio: 1 / 1; background: rgba(0, 0, 0, 0.30); border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 13px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.08); } /* Image widget και widget container */ .nc-search-field .e-loop-item > a.e-con > .e-con:has(> .elementor-widget-image) .elementor-widget-image, .nc-search-field .e-loop-item > a.e-con > .e-con:has(> .elementor-widget-image) .elementor-widget-container { width: 100% !important; max-width: 100% !important; height: 100% !important; overflow: hidden; border-radius: inherit; } /* Product image */ .nc-search-field .e-loop-item > a.e-con > .e-con:has(> .elementor-widget-image) img { display: block; width: 100% !important; max-width: 100% !important; height: 100% !important; object-fit: cover; object-position: center; border-radius: inherit; filter: saturate(0.92) contrast(1.04); transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), filter 0.35s ease; } .nc-search-field .e-loop-item:hover > a.e-con > .e-con:has(> .elementor-widget-image) img { transform: scale(1.055); filter: saturate(1.08) contrast(1.05); } /* ===================================================== FLUID TEXT CONTAINER ===================================================== */ .nc-search-field .e-loop-item > a.e-con > .e-con:has(> .elementor-widget-theme-post-excerpt) { flex: 1 1 0 !important; width: auto !important; max-width: none !important; min-width: 0 !important; justify-content: center; padding: clamp(2px, 0.5vw, 6px) 0 !important; gap: clamp(4px, 0.6vw, 8px) !important; overflow: hidden; background: transparent !important; } /* Όλα τα text widgets καταλαμβάνουν το διαθέσιμο πλάτος */ .nc-search-field .e-loop-item > a.e-con > .e-con:has(> .elementor-widget-theme-post-excerpt) > .elementor-element { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } /* ===================================================== LINK TYPOGRAPHY RESET ===================================================== */ .nc-search-field .e-loop-item a, .nc-search-field .e-loop-item a:hover, .nc-search-field .e-loop-item a:focus, .nc-search-field .e-loop-item a:active, .nc-search-field .e-loop-item a:visited { text-decoration: none !important; } /* ===================================================== PRODUCT TITLE ===================================================== */ .nc-search-field .e-loop-item .elementor-widget-heading h6.elementor-heading-title { width: 100%; max-width: 100%; margin: 0; overflow: hidden; color: var(--nc-text) !important; font-size: clamp(15px, 1.25vw, 20px) !important; font-weight: 600 !important; line-height: 1.25 !important; letter-spacing: 0.01em; text-decoration: none !important; text-overflow: ellipsis; white-space: nowrap; transition: color 0.25s ease, text-shadow 0.25s ease; } .nc-search-field .e-loop-item:hover .elementor-widget-heading h6.elementor-heading-title { color: var(--nc-cyan) !important; text-shadow: 0 0 14px rgba(74, 232, 255, 0.28); } /* ===================================================== PRODUCT EXCERPT ===================================================== */ .nc-search-field .e-loop-item .elementor-widget-theme-post-excerpt { display: -webkit-box; width: 100% !important; max-width: 100% !important; min-width: 0; margin: 0; overflow: hidden; color: var(--nc-muted) !important; font-size: clamp(12px, 1vw, 14px) !important; font-weight: 400 !important; line-height: 1.5 !important; text-decoration: none !important; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .nc-search-field .e-loop-item .elementor-widget-theme-post-excerpt img.emoji { display: inline !important; width: 1em !important; height: 1em !important; } /* ===================================================== PRODUCT PRICE ===================================================== */ .nc-search-field .e-loop-item .elementor-widget-heading p.elementor-heading-title { width: 100%; max-width: 100%; margin: 0; color: var(--nc-cyan) !important; font-size: clamp(15px, 1.1vw, 17px) !important; font-weight: 600 !important; line-height: 1.2 !important; letter-spacing: 0.015em; text-decoration: none !important; text-shadow: 0 0 12px rgba(74, 232, 255, 0.22); } /* ===================================================== SCROLLBAR ===================================================== */ .nc-search-field .e-search-results-container { scrollbar-width: thin; scrollbar-color: rgba(74, 232, 255, 0.55) rgba(255, 255, 255, 0.04); } .nc-search-field .e-search-results-container::-webkit-scrollbar { width: 6px; } .nc-search-field .e-search-results-container::-webkit-scrollbar-track { margin: 14px 0; background: transparent; } .nc-search-field .e-search-results-container::-webkit-scrollbar-thumb { background: linear-gradient( 180deg, rgba(74, 232, 255, 0.35), rgba(74, 232, 255, 0.80) ); border-radius: 20px; box-shadow: 0 0 8px rgba(74, 232, 255, 0.35); } /* ===================================================== TABLET ===================================================== */ @media (max-width: 1024px) { .nc-search-field .e-search-results-container { max-height: min(540px, calc(100vh - 160px)); } .nc-search-field .e-loop-item > a.e-con > .e-con:has(> .elementor-widget-image) { flex-basis: clamp(80px, 19%, 125px) !important; width: clamp(80px, 19%, 125px) !important; max-width: clamp(80px, 19%, 125px) !important; min-width: 80px !important; } } /* ===================================================== MOBILE ===================================================== */ @media (max-width: 767px) { /* * Το height και το padding του search input * εξακολουθούν να ελέγχονται από το Elementor. */ .nc-search-field .e-search-results-container { left: 50%; width: calc(100vw - 24px); max-width: none; max-height: min(66vh, 500px); margin-top: 9px; padding: 8px !important; border-radius: 18px !important; transform: translateX(-50%); animation: nc-search-reveal-mobile 0.3s cubic-bezier(0.22, 1, 0.36, 1) both; } @keyframes nc-search-reveal-mobile { from { opacity: 0; transform: translate(-50%, -7px) scale(0.985); } to { opacity: 1; transform: translate(-50%, 0) scale(1); } } .nc-search-field .e-search-results-list .e-loop-item > a.e-con { padding: clamp(7px, 2vw, 9px) !important; gap: clamp(8px, 3vw, 12px) !important; flex-direction: row !important; flex-wrap: nowrap !important; } .nc-search-field .e-loop-item > a.e-con > .e-con:has(> .elementor-widget-image) { flex-basis: clamp(72px, 25vw, 100px) !important; width: clamp(72px, 25vw, 100px) !important; max-width: clamp(72px, 25vw, 100px) !important; min-width: 72px !important; } .nc-search-field .e-loop-item > a.e-con > .e-con:has(> .elementor-widget-theme-post-excerpt) { flex: 1 1 0 !important; width: auto !important; min-width: 0 !important; padding: 0 !important; } .nc-search-field .e-loop-item .elementor-widget-heading h6.elementor-heading-title { font-size: clamp(14px, 4vw, 16px) !important; } .nc-search-field .e-loop-item .elementor-widget-theme-post-excerpt { font-size: clamp(11px, 3.2vw, 13px) !important; line-height: 1.4 !important; -webkit-line-clamp: 2; } .nc-search-field .e-loop-item .elementor-widget-heading p.elementor-heading-title { font-size: clamp(14px, 3.8vw, 16px) !important; } } /* ===================================================== VERY SMALL MOBILE ===================================================== */ @media (max-width: 420px) { .nc-search-field .e-loop-item > a.e-con > .e-con:has(> .elementor-widget-image) { flex-basis: clamp(68px, 23vw, 84px) !important; width: clamp(68px, 23vw, 84px) !important; max-width: clamp(68px, 23vw, 84px) !important; min-width: 68px !important; } .nc-search-field .e-loop-item .elementor-widget-theme-post-excerpt { -webkit-line-clamp: 2; } } /* ===================================================== REDUCED MOTION ===================================================== */ @media (prefers-reduced-motion: reduce) { .nc-search-field *, .nc-search-field *::before, .nc-search-field *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } } /* --------------- END OF SEARCH RESULTS -------------- */ /* SIDE MENU */ /* ===================================================== NEONCLOUD — OFF CANVAS GLASSMORPHISM Scope: .off-canvas-menu ===================================================== */ .off-canvas-menu { --nc-cyan: #4AE8FF; --nc-cyan-dark: #089DB3; --nc-white: #F7FBFF; --nc-muted: rgba(235, 245, 250, 0.66); --nc-panel: rgba(5, 10, 15, 0.82); --nc-card: rgba(255, 255, 255, 0.07); --nc-border: rgba(255, 255, 255, 0.12); } /* ===================================================== PAGE OVERLAY ===================================================== */ .off-canvas-menu .e-off-canvas__overlay { background: rgba(0, 4, 8, 0.68) !important; backdrop-filter: blur(5px) saturate(90%); -webkit-backdrop-filter: blur(5px) saturate(90%); transition: opacity 0.35s ease, backdrop-filter 0.35s ease; } /* ===================================================== MAIN OFF-CANVAS GLASS PANEL ===================================================== */ .off-canvas-menu .e-off-canvas__content { position: relative; color: var(--nc-white); background: radial-gradient( circle at 15% 0%, rgba(74, 232, 255, 0.15), transparent 28% ), radial-gradient( circle at 100% 45%, rgba(74, 232, 255, 0.07), transparent 36% ), linear-gradient( 155deg, rgba(15, 23, 31, 0.93), rgba(3, 8, 13, 0.88) ) !important; border-right: 1px solid rgba(74, 232, 255, 0.20); box-shadow: 24px 0 70px rgba(0, 0, 0, 0.52), 4px 0 25px rgba(74, 232, 255, 0.07), inset -1px 0 0 rgba(255, 255, 255, 0.06); backdrop-filter: blur(30px) saturate(155%); -webkit-backdrop-filter: blur(30px) saturate(155%); scrollbar-width: thin; scrollbar-color: rgba(74, 232, 255, 0.55) rgba(255, 255, 255, 0.03); } /* Διακριτική cyan λάμψη στο εξωτερικό άκρο */ .off-canvas-menu .e-off-canvas__content::after { content: ""; position: fixed; z-index: 20; top: 0; right: 0; bottom: 0; width: 1px; pointer-events: none; background: linear-gradient( 180deg, transparent 5%, rgba(74, 232, 255, 0.45) 28%, rgba(74, 232, 255, 0.12) 72%, transparent 96% ); box-shadow: 0 0 18px rgba(74, 232, 255, 0.28); } /* ===================================================== SCROLLBAR ===================================================== */ .off-canvas-menu .e-off-canvas__content::-webkit-scrollbar { width: 6px; } .off-canvas-menu .e-off-canvas__content::-webkit-scrollbar-track { background: transparent; } .off-canvas-menu .e-off-canvas__content::-webkit-scrollbar-thumb { background: linear-gradient( 180deg, rgba(74, 232, 255, 0.28), rgba(74, 232, 255, 0.72) ); border-radius: 20px; box-shadow: 0 0 8px rgba(74, 232, 255, 0.32); } /* ===================================================== REMOVE DEFAULT CONTAINER BACKGROUNDS ===================================================== */ .off-canvas-menu .e-off-canvas__content .e-con:not(.product-category) { background-color: transparent; } /* ===================================================== TOP HEADER ===================================================== */ .off-canvas-menu .e-off-canvas__content .elementor-sticky:not(.elementor-sticky__spacer) { z-index: 100; background: linear-gradient( 135deg, rgba(8, 14, 20, 0.94), rgba(3, 8, 12, 0.88) ) !important; border-bottom: 1px solid rgba(74, 232, 255, 0.15); box-shadow: 0 14px 35px rgba(0, 0, 0, 0.30), inset 0 -1px 0 rgba(255, 255, 255, 0.035); backdrop-filter: blur(24px) saturate(150%); -webkit-backdrop-filter: blur(24px) saturate(150%); } /* ===================================================== CLOSE BUTTON ===================================================== */ .off-canvas-menu a[href*="off_canvas"][href*="close"].elementor-icon { display: inline-flex; align-items: center; justify-content: center; color: var(--nc-cyan) !important; background: linear-gradient( 135deg, rgba(74, 232, 255, 0.13), rgba(255, 255, 255, 0.04) ); /* border: 1px solid rgba(74, 232, 255, 0.38); */ border-radius: 50%; box-shadow: 0 0 0 4px rgba(74, 232, 255, 0.04), 0 0 18px rgba(74, 232, 255, 0.17), inset 0 1px 0 rgba(255, 255, 255, 0.12); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); transition: color 0.25s ease, background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); } .off-canvas-menu a[href*="off_canvas"][href*="close"].elementor-icon svg { fill: currentColor !important; transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1); } .off-canvas-menu a[href*="off_canvas"][href*="close"].elementor-icon:hover { color: #061015 !important; background: var(--nc-cyan); border-color: var(--nc-cyan); box-shadow: 0 0 0 5px rgba(74, 232, 255, 0.09), 0 0 26px rgba(74, 232, 255, 0.48); transform: scale(1.06); } .off-canvas-menu a[href*="off_canvas"][href*="close"].elementor-icon:hover svg { transform: rotate(90deg); } .off-canvas-menu a[href*="off_canvas"][href*="close"].elementor-icon:focus-visible { outline: 2px solid var(--nc-cyan); outline-offset: 4px; } /* ===================================================== NESTED TABS ===================================================== */ .off-canvas-menu .e-n-tabs { width: 100%; } .off-canvas-menu .e-n-tabs-heading { position: relative; z-index: 10; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; padding: 7px; gap: 7px; background: linear-gradient( 135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025) ); border: 1px solid rgba(255, 255, 255, 0.10); border-radius: 16px; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.08); backdrop-filter: blur(18px) saturate(145%); -webkit-backdrop-filter: blur(18px) saturate(145%); } /* ===================================================== TAB BUTTON ===================================================== */ .off-canvas-menu .e-n-tab-title { position: relative; display: flex !important; align-items: center; justify-content: center; min-width: 0; padding: 13px 12px !important; overflow: hidden; color: rgba(247, 251, 255, 0.64) !important; background: transparent !important; border: 1px solid transparent !important; border-radius: 11px !important; outline: none; font-size: clamp(15px, 1.2vw, 18px) !important; font-weight: 600 !important; line-height: 1.2; letter-spacing: 0.01em; cursor: pointer; transition: color 0.3s ease, background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease; } /* * Αφαιρεί πλήρως τη φωτεινή γραμμή * κάτω από το ενεργό tab. */ .off-canvas-menu .e-n-tab-title::before, .off-canvas-menu .e-n-tab-title[aria-selected="true"]::before { content: none !important; display: none !important; opacity: 0 !important; transform: none !important; background: none !important; box-shadow: none !important; } .off-canvas-menu .e-n-tab-title:hover { color: var(--nc-white) !important; background: rgba(255, 255, 255, 0.055) !important; } .off-canvas-menu .e-n-tab-title[aria-selected="true"] { color: var(--nc-cyan) !important; background: linear-gradient( 135deg, rgba(74, 232, 255, 0.16), rgba(74, 232, 255, 0.05) ) !important; border-color: rgba(74, 232, 255, 0.30) !important; box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.10), 0 0 18px rgba(74, 232, 255, 0.07); } .off-canvas-menu .e-n-tab-title:focus-visible { outline: 2px solid var(--nc-cyan); outline-offset: 2px; } /* ===================================================== TABS CONTENT ===================================================== */ .off-canvas-menu .e-n-tabs-content { width: 100%; background: transparent !important; } .off-canvas-menu .e-n-tabs-content [role="tabpanel"] { width: 100%; background: transparent !important; } /* ===================================================== WOOCOMMERCE CATEGORY GRID ===================================================== */ .off-canvas-menu .elementor-widget-wc-categories, .off-canvas-menu .elementor-widget-wc-categories .woocommerce { width: 100%; } .off-canvas-menu .elementor-widget-wc-categories ul.products { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; width: 100%; margin: 0 !important; padding: 0 !important; gap: clamp(10px, 2.5vw, 14px) !important; list-style: none; } /* ===================================================== CATEGORY GLASS CARD ===================================================== */ .off-canvas-menu ul.products li.product-category.product { position: relative; float: none !important; width: 100% !important; min-width: 0; margin: 0 !important; padding: 0 !important; overflow: hidden; background: linear-gradient( 145deg, rgba(255, 255, 255, 0.095), rgba(255, 255, 255, 0.035) ) !important; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 15px; box-shadow: 0 10px 28px rgba(0, 0, 0, 0.20), inset 0 1px 0 rgba(255, 255, 255, 0.09); backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease; } /* Διακριτικό light sweep */ .off-canvas-menu ul.products li.product-category.product::before { content: ""; position: absolute; z-index: 0; top: -50%; left: -80%; width: 65%; height: 200%; pointer-events: none; background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.10), transparent ); transform: rotate(18deg); transition: left 0.65s cubic-bezier(0.22, 1, 0.36, 1); } .off-canvas-menu ul.products li.product-category.product:hover { transform: translateY(-3px); background: linear-gradient( 145deg, rgba(74, 232, 255, 0.14), rgba(255, 255, 255, 0.045) ) !important; border-color: rgba(74, 232, 255, 0.38); box-shadow: 0 16px 34px rgba(0, 0, 0, 0.30), 0 0 22px rgba(74, 232, 255, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.12); } .off-canvas-menu ul.products li.product-category.product:hover::before { left: 125%; } /* ===================================================== CATEGORY LINK ===================================================== */ .off-canvas-menu ul.products li.product-category.product > a { position: relative; z-index: 1; display: flex !important; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; min-height: clamp(112px, 14vw, 135px); padding: clamp(13px, 2vw, 18px) 10px; color: var(--nc-white) !important; text-align: center; text-decoration: none !important; background: transparent !important; -webkit-tap-highlight-color: transparent; } .off-canvas-menu ul.products li.product-category.product > a:focus-visible { outline: 2px solid var(--nc-cyan); outline-offset: -3px; border-radius: 14px; } /* ===================================================== CATEGORY MAIN IMAGE ===================================================== */ .off-canvas-menu ul.products li.product-category.product > a > img:not(.emoji) { display: block; width: clamp(38px, 11vw, 55px) !important; height: clamp(38px, 11vw, 55px) !important; margin: 0 auto clamp(9px, 1.5vw, 13px) !important; object-fit: contain; object-position: center; padding: 0px; border-radius: 0px; filter: brightness(0) invert(1) opacity(0.88) drop-shadow( 0 0 0 rgba(74, 232, 255, 0) ); transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), filter 0.35s ease; } .off-canvas-menu ul.products li.product-category.product:hover > a > img:not(.emoji) { transform: translateY(-2px) scale(1.07); filter: brightness(0) saturate(100%) invert(88%) sepia(18%) saturate(1393%) hue-rotate(153deg) brightness(102%) contrast(101%) drop-shadow( 0 0 8px rgba(74, 232, 255, 0.50) ); } /* ===================================================== PHOTOGRAPHIC CATEGORY IMAGES ===================================================== */ .off-canvas-menu ul.products li.product-category.product > a > img[src$=".webp"], .off-canvas-menu ul.products li.product-category.product > a > img[src$=".jpg"], .off-canvas-menu ul.products li.product-category.product > a > img[src$=".jpeg"], .off-canvas-menu ul.products li.product-category.product > a > img[src$=".png"] { filter: saturate(0.75) contrast(1.05) brightness(0.90); border: 1px solid rgba(255, 255, 255, 0.10); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.24); } .off-canvas-menu ul.products li.product-category.product:hover > a > img[src$=".webp"], .off-canvas-menu ul.products li.product-category.product:hover > a > img[src$=".jpg"], .off-canvas-menu ul.products li.product-category.product:hover > a > img[src$=".jpeg"], .off-canvas-menu ul.products li.product-category.product:hover > a > img[src$=".png"] { filter: saturate(1.05) contrast(1.07) brightness(1); } /* ===================================================== CATEGORY TITLE ===================================================== */ .off-canvas-menu .woocommerce-loop-category__title { width: 100%; margin: 0 !important; padding: 0 !important; color: var(--nc-white) !important; font-size: clamp(11px, 2.9vw, 14px) !important; font-weight: 600 !important; line-height: 1.3 !important; letter-spacing: 0.01em; text-align: center; text-transform: uppercase; overflow-wrap: anywhere; transition: color 0.3s ease, text-shadow 0.3s ease; } .off-canvas-menu li.product-category.product:hover .woocommerce-loop-category__title { color: var(--nc-cyan) !important; text-shadow: 0 0 12px rgba(74, 232, 255, 0.28); } /* ===================================================== CATEGORY COUNT ===================================================== */ .off-canvas-menu .woocommerce-loop-category__title mark.count { display: inline-flex; align-items: center; justify-content: center; margin-left: 4px; padding: 2px 6px; color: var(--nc-cyan) !important; background: rgba(74, 232, 255, 0.09) !important; border: 1px solid rgba(74, 232, 255, 0.18); border-radius: 20px; font-size: 9px !important; font-weight: 600; line-height: 1.2; opacity: 0.78; transition: opacity 0.3s ease, background 0.3s ease, box-shadow 0.3s ease; } .off-canvas-menu li.product-category.product:hover mark.count { opacity: 1; background: rgba(74, 232, 255, 0.15) !important; box-shadow: 0 0 10px rgba(74, 232, 255, 0.12); } /* ===================================================== EMOJI INSIDE TITLE ===================================================== */ .off-canvas-menu .woocommerce-loop-category__title img.emoji { display: inline-block !important; width: 1em !important; height: 1em !important; margin: 0 3px 0 0 !important; vertical-align: -0.12em; } /* ===================================================== ENTRY ANIMATION ===================================================== */ .off-canvas-menu ul.products li.product-category.product { animation: nc-category-reveal 0.45s cubic-bezier(0.22, 1, 0.36, 1) both; } .off-canvas-menu ul.products li.product-category.product:nth-child(2) { animation-delay: 0.035s; } .off-canvas-menu ul.products li.product-category.product:nth-child(3) { animation-delay: 0.07s; } .off-canvas-menu ul.products li.product-category.product:nth-child(4) { animation-delay: 0.105s; } .off-canvas-menu ul.products li.product-category.product:nth-child(5) { animation-delay: 0.14s; } .off-canvas-menu ul.products li.product-category.product:nth-child(6) { animation-delay: 0.175s; } .off-canvas-menu ul.products li.product-category.product:nth-child(n + 7) { animation-delay: 0.20s; } @keyframes nc-category-reveal { from { opacity: 0; transform: translateY(10px) scale(0.97); } to { opacity: 1; transform: translateY(0) scale(1); } } /* ===================================================== MOBILE ===================================================== */ @media (max-width: 767px) { .off-canvas-menu .e-off-canvas__content { border-right: 1px solid rgba(74, 232, 255, 0.16); box-shadow: 18px 0 50px rgba(0, 0, 0, 0.48), 3px 0 18px rgba(74, 232, 255, 0.06); } .off-canvas-menu .e-n-tabs-heading { padding: 6px; gap: 6px; border-radius: 14px; } .off-canvas-menu .e-n-tab-title { padding: 12px 8px !important; font-size: clamp(14px, 4.2vw, 17px) !important; border-radius: 10px !important; } .off-canvas-menu .elementor-widget-wc-categories ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: clamp(8px, 2.8vw, 12px) !important; } .off-canvas-menu ul.products li.product-category.product > a { min-height: clamp(106px, 31vw, 128px); padding: clamp(11px, 3vw, 15px) 8px; } .off-canvas-menu ul.products li.product-category.product > a > img:not(.emoji) { width: clamp(34px, 12vw, 48px) !important; height: clamp(34px, 12vw, 48px) !important; margin-bottom: clamp(7px, 2vw, 10px) !important; } .off-canvas-menu .woocommerce-loop-category__title { font-size: clamp(10px, 3.2vw, 13px) !important; } } /* ===================================================== VERY SMALL MOBILE ===================================================== */ @media (max-width: 380px) { .off-canvas-menu .elementor-widget-wc-categories ul.products { gap: 8px !important; } .off-canvas-menu ul.products li.product-category.product > a { min-height: 102px; padding: 10px 6px; } .off-canvas-menu ul.products li.product-category.product > a > img:not(.emoji) { width: 34px !important; height: 34px !important; } .off-canvas-menu .woocommerce-loop-category__title { font-size: 10px !important; } .off-canvas-menu .woocommerce-loop-category__title mark.count { padding: 1px 4px; font-size: 8px !important; } } /* ===================================================== REDUCED MOTION ===================================================== */ @media (prefers-reduced-motion: reduce) { .off-canvas-menu *, .off-canvas-menu *::before, .off-canvas-menu *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } } /* END SIDE MENU */ /* CART PAGE */ body.woocommerce-cart .elementor-widget-woocommerce-cart .select2-container--default .select2-selection--single .select2-selection__rendered, body.woocommerce-checkout .elementor-widget-woocommerce-checkout-page .select2-container--default .select2-selection--single .select2-selection__rendered{ line-height:2rem!important; } body.woocommerce-cart .select2-dropdown, body.woocommerce-checkout .select2-dropdown{ background-color:#121212!important; } body.woocommerce-cart .elementor-widget-woocommerce-cart .woocommerce .product-name a{ font-size:1rem!important; } @media(max-width:768px){ body.woocommerce-cart .elementor-widget-woocommerce-cart .woocommerce .product-name a{ font-size:0.875rem!important; } } /* END CART PAGE */ /* CHECKOUT PAGE */ body.woocommerce-checkout .e-coupon-box a{ font-size:clamp(0.8rem, 0.727rem + 0.36vw, 1rem)!important; } body.woocommerce-checkout .woocommerce-privacy-policy-text a{ font-size:clamp(0.8rem, 0.727rem + 0.36vw, 1rem)!important; } body.woocommerce-checkout .coupon-container-grid .col.coupon-col-2 { text-align:end!important; } /* END CHECKOUT */ /* HOMEPAGE REVIEWS */ /* NeonCloud · RichPlugins Google Reviews */ .reviews-home { --nc-accent: #4ae8ff; --nc-text: #f2f6f7; --nc-muted: #929fa5; background: radial-gradient(ellipse at 50% 0%, #4ae8ff12 0%, transparent 58%), radial-gradient(ellipse at 100% 100%, #4ae8ff08 0%, transparent 48%), #030506 !important; } .reviews-home .wp-gr { --font-family: "adelphi-pe-variable", sans-serif; --color: #4ae8ff !important; --rpi-star-color: #4ae8ff !important; --rpi-star-empty-color: #344249 !important; --rpi-rating-color: #f2f6f7 !important; --name-color: #f2f6f7 !important; --head-name-color: #f2f6f7 !important; --text-color: #cbd4d8 !important; --powered-color: #929fa5 !important; --head-scale-color: #4ae8ff !important; --head-based-color: #929fa5 !important; --rev-bg: linear-gradient(145deg, #10191c, #090d0f 75%) !important; --slider-head-card-bg: transparent !important; --slider-head-card-bg-color: transparent !important; --slider-head-card-shadow: none !important; --slider-dot-color: #66777d !important; --slider-act-dot-color: #4ae8ff !important; --slider-dot-size: 10px; --slider-dot-gap: 12px; --img-size: clamp(36px, 3vw, 44px); font-family: var(--font-family) !important; } /* Business summary */ .reviews-home .wp-gr .grw-header-inner { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 12px clamp(24px, 3vw, 44px) !important; } .reviews-home .wp-gr .grw-header .wp-google-name a { color: var(--nc-text) !important; font-family: inherit !important; font-size: clamp(17px, 1rem + .35vw, 22px) !important; font-weight: 600 !important; line-height: 1.4 !important; transition: color .25s ease; } .reviews-home .wp-gr .wp-google-based, .reviews-home .wp-gr .wp-google-based b { color: var(--nc-muted) !important; font-size: clamp(12px, .75rem + .15vw, 14px) !important; font-weight: 400 !important; } /* Dark cards with a fine cyan edge */ .reviews-home .wp-gr .grw-review-inner { background: var(--rev-bg) !important; border: 1px solid #4ae8ff24 !important; border-radius: clamp(12px, 1vw, 18px) !important; padding: clamp(18px, 1.6vw, 28px) !important; box-shadow: inset 0 1px 0 #ffffff06 !important; transition: border-color .3s ease, box-shadow .3s ease, background .3s ease; } .reviews-home .wp-gr a.wp-google-name { color: var(--nc-text) !important; font-size: clamp(14px, .85rem + .15vw, 16px) !important; font-weight: 600 !important; line-height: 1.4 !important; transition: color .25s ease; } .reviews-home .wp-gr .wp-google-time { color: var(--nc-muted) !important; font-size: 12px !important; font-weight: 400 !important; } .reviews-home .wp-gr .wp-google-text { color: #cbd4d8 !important; font-family: inherit !important; font-size: clamp(14px, .85rem + .15vw, 16px) !important; line-height: 1.75 !important; } .reviews-home .wp-gr .grw-img { border-radius: 50% !important; border: 1px solid #4ae8ff30 !important; box-shadow: none !important; } /* END HOMEPAGE REVIEWS */ /* ===================================================== NEONCLOUD — SERVICES GRID ===================================================== */ .custom-services { --nc-cyan: #4ae8ff; --nc-card-bg: rgba(255, 255, 255, 0.025); --nc-card-border: rgba(74, 232, 255, 0.17); --nc-card-radius: clamp(12px, 1.2vw, 18px); } /* GRID */ .custom-services .elementor-icon-list-items { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: clamp(9px, 1.2vw, 14px) !important; margin: 0 !important; padding: 0 !important; list-style: none; } /* CARD */ .custom-services .elementor-icon-list-item { position: relative; isolation: isolate; display: block !important; min-width: 0; margin: 0 !important; padding: 0 !important; border: 1px solid var(--nc-card-border); border-radius: var(--nc-card-radius); background: linear-gradient( 135deg, rgba(74, 232, 255, 0.055), var(--nc-card-bg) 70% ); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 8px 25px rgba(0, 0, 0, 0.12); overflow: hidden; transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.35s ease, box-shadow 0.35s ease; } /* FULL CARD LINK */ .custom-services .elementor-icon-list-item > a { position: relative; z-index: 2; display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: flex-start !important; width: 100%; min-height: clamp(76px, 7vw, 94px); gap: clamp(12px, 1.4vw, 18px); padding: clamp(13px, 1.4vw, 18px) clamp(48px, 4vw, 60px) clamp(13px, 1.4vw, 18px) clamp(13px, 1.4vw, 18px) !important; color: #fff; text-decoration: none !important; } /* BACKGROUND GLOW */ .custom-services .elementor-icon-list-item::before { content: ""; position: absolute; inset: 0; z-index: 0; border-radius: inherit; background: radial-gradient( circle at 0% 50%, rgba(74, 232, 255, 0.16), transparent 65% ); opacity: 0; pointer-events: none; transition: opacity 0.4s ease; } /* SVG ARROW — RIGHT SIDE */ .custom-services .elementor-icon-list-item::after { content: ""; position: absolute; z-index: 3; top: 50% !important; right: clamp(12px, 1.3vw, 18px) !important; bottom: auto !important; left: auto !important; display: block; width: clamp(25px, 2.5vw, 32px); height: clamp(25px, 2.5vw, 32px); border: 1px solid rgba(74, 232, 255, 0.28); border-radius: 50%; background-color: rgba(74, 232, 255, 0.07); transform: translateY(-50%); transition: transform 0.35s ease, background-color 0.35s ease, border-color 0.35s ease; pointer-events: none; } /* SVG ICON USING MASK */ .custom-services .elementor-icon-list-item > a::after { content: ""; position: absolute; top: 50%; right: clamp(19px, 1.85vw, 27px); width: 13px; height: 13px; background-color: var(--nc-cyan); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M7 7h10v10'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M7 7h10v10'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; transform: translateY(-50%); transition: transform 0.35s ease, background-color 0.35s ease; pointer-events: none; } /* ICON BOX */ .custom-services .elementor-icon-list-icon { display: flex !important; align-items: center; justify-content: center; flex: 0 0 auto; width: clamp(42px, 4vw, 52px); height: clamp(42px, 4vw, 52px); padding: clamp(9px, 0.9vw, 12px); border: 1px solid rgba(74, 232, 255, 0.2); border-radius: clamp(10px, 1vw, 14px); background: rgba(74, 232, 255, 0.065); transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.35s ease, box-shadow 0.35s ease; } /* EXISTING ELEMENTOR SVG ICONS */ .custom-services .elementor-icon-list-icon svg { display: block; width: 100% !important; height: 100% !important; fill: var(--nc-cyan) !important; transition: transform 0.35s ease, filter 0.35s ease; } /* TEXT */ .custom-services .elementor-icon-list-text { display: block; flex: 1 1 auto; min-width: 0; max-width: none; color: rgba(255, 255, 255, 0.92) !important; font-family: 'Tektur', sans-serif; font-size: clamp(0.8125rem, 0.75rem + 0.3vw, 1rem) !important; font-weight: 500; line-height: 1.4; overflow-wrap: break-word; transition: color 0.35s ease, transform 0.35s ease; } /* HOVER ANIMATIONS */ @media (hover: hover) and (pointer: fine) { .custom-services .elementor-icon-list-item:hover { transform: translateY(-3px); border-color: rgba(74, 232, 255, 0.55); box-shadow: 0 12px 32px rgba(0, 0, 0, 0.22), 0 0 24px rgba(74, 232, 255, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.08); } .custom-services .elementor-icon-list-item:hover::before { opacity: 1; } .custom-services .elementor-icon-list-item:hover::after { transform: translate(3px, -50%); background-color: rgba(74, 232, 255, 0.15); border-color: rgba(74, 232, 255, 0.6); } .custom-services .elementor-icon-list-item:hover > a::after { transform: translate(3px, calc(-50% - 3px)); background-color: #fff; } .custom-services .elementor-icon-list-item:hover .elementor-icon-list-icon { transform: rotate(-4deg) scale(1.04); background: rgba(74, 232, 255, 0.13); box-shadow: 0 0 22px rgba(74, 232, 255, 0.14); } .custom-services .elementor-icon-list-item:hover .elementor-icon-list-icon svg { transform: scale(1.08); filter: drop-shadow( 0 0 5px rgba(74, 232, 255, 0.55) ); } .custom-services .elementor-icon-list-item:hover .elementor-icon-list-text { color: #fff !important; transform: translateX(2px); } } /* ACCESSIBILITY */ .custom-services .elementor-icon-list-item:focus-within { border-color: var(--nc-cyan); } .custom-services .elementor-icon-list-item > a:focus-visible { outline: 2px solid var(--nc-cyan); outline-offset: -3px; border-radius: inherit; } /* MOBILE */ @media (max-width: 767px) { .custom-services .elementor-icon-list-items { gap: 10px !important; } .custom-services .elementor-icon-list-item > a { min-height: 76px; gap: 12px; padding: 12px 46px 12px 12px !important; } .custom-services .elementor-icon-list-icon { width: 42px; height: 42px; padding: 9px; border-radius: 11px; } .custom-services .elementor-icon-list-text { font-size: clamp(0.8125rem, 2.5vw, 0.9375rem) !important; line-height: 1.35; } .custom-services .elementor-icon-list-item::after { right: 12px !important; width: 25px; height: 25px; } .custom-services .elementor-icon-list-item > a::after { right: 18px; width: 13px; height: 13px; } } /* SMALL MOBILE */ @media (max-width: 360px) { .custom-services .elementor-icon-list-item > a { min-height: 70px; gap: 10px; padding: 10px 42px 10px 10px !important; } .custom-services .elementor-icon-list-icon { width: 38px; height: 38px; padding: 8px; } .custom-services .elementor-icon-list-text { font-size: 0.8125rem !important; } .custom-services .elementor-icon-list-item::after { right: 10px !important; width: 23px; height: 23px; } .custom-services .elementor-icon-list-item > a::after { right: 15px; width: 13px; height: 13px; } } /* REDUCED MOTION */ @media (prefers-reduced-motion: reduce) { .custom-services *, .custom-services *::before, .custom-services *::after { transition: none !important; animation: none !important; } .custom-services .elementor-icon-list-item:hover { transform: none; } } /* END HEADER SERVICES */ /* THANK YOU PAGE */ /* NeonCloud — Thank You Page */ body.woocommerce-order-received .woocommerce-order { --nc-accent: #4ae8ff; --nc-border: rgba(255, 255, 255, 0.16); --nc-muted: #c5c5c5; --nc-padding: clamp(16px, 2vw, 28px); color: #fff; font-family: inherit; font-size: clamp(0.9375rem, 0.9rem + 0.2vw, 1.0625rem); line-height: 1.7; overflow-wrap: anywhere; } /* Μήνυμα επιβεβαίωσης */ body.woocommerce-order-received .woocommerce-order .woocommerce-thankyou-order-received { margin: 0 0 24px; padding: var(--nc-padding); background: rgba(74, 232, 255, 0.08); border: 1px solid rgba(74, 232, 255, 0.35); border-radius: 14px; color: var(--nc-accent); font-size: clamp(1.125rem, 1rem + 0.5vw, 1.5rem); font-weight: 600; line-height: 1.5; } /* Τίτλοι */ body.woocommerce-order-received .woocommerce-order h2 { margin: 0 0 18px; color: #fff; font-size: clamp(1.125rem, 1rem + 0.6vw, 1.625rem); line-height: 1.4; font-family:'Tektur',sans-serif!important; font-weight:600!important; } body.woocommerce-order-received .woocommerce-order h3 { margin: 0 0 16px; color: var(--nc-muted); font-size: inherit; line-height: 1.5; } /* Οδηγίες πληρωμής */ body.woocommerce-order-received .woocommerce-order > p { margin: 0 0 20px; color: var(--nc-muted); } /* Σύνοψη παραγγελίας και τραπεζικά στοιχεία */ body.woocommerce-order-received .woocommerce-order ul.woocommerce-order-overview, body.woocommerce-order-received .woocommerce-order ul.wc-bacs-bank-details { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap: 20px; margin: 0 0 28px; padding: var(--nc-padding); list-style: none; background: rgba(255, 255, 255, 0.03); border: 1px solid var(--nc-border); border-radius: 14px; } body.woocommerce-order-received .woocommerce-order ul.woocommerce-order-overview::before, body.woocommerce-order-received .woocommerce-order ul.woocommerce-order-overview::after, body.woocommerce-order-received .woocommerce-order ul.wc-bacs-bank-details::before, body.woocommerce-order-received .woocommerce-order ul.wc-bacs-bank-details::after { display: none; } body.woocommerce-order-received .woocommerce-order ul.woocommerce-order-overview > li, body.woocommerce-order-received .woocommerce-order ul.wc-bacs-bank-details > li { float: none; min-width: 0; margin: 0; padding: 0; border: 0; color: var(--nc-muted); font-size: inherit; text-transform: none; } body.woocommerce-order-received .woocommerce-order ul.woocommerce-order-overview > li strong, body.woocommerce-order-received .woocommerce-order ul.wc-bacs-bank-details > li strong { display: block; margin-top: 6px; color: #fff; font-size: inherit; font-weight: 600; } /* Απόσταση μεταξύ ενοτήτων */ body.woocommerce-order-received .woocommerce-order > section { margin: 32px 0 0; } /* Πίνακας παραγγελίας */ body.woocommerce-order-received .woocommerce-order table.shop_table { width: 100%; margin: 0; border: 1px solid var(--nc-border); border-spacing: 0; border-collapse: separate; border-radius: 14px; overflow: hidden; background: rgba(255, 255, 255, 0.03); color: #fff; font-size: inherit; } body.woocommerce-order-received .woocommerce-order table.shop_table th, body.woocommerce-order-received .woocommerce-order table.shop_table td { padding: clamp(12px, 1.5vw, 20px); border: 0; border-bottom: 1px solid var(--nc-border); background: transparent; color: inherit; vertical-align: top; line-height: 1.6; } body.woocommerce-order-received .woocommerce-order table.shop_table thead th { background: rgba(74, 232, 255, 0.07); color: var(--nc-accent); } body.woocommerce-order-received .woocommerce-order table.shop_table tfoot th { font-weight: 500; } body.woocommerce-order-received .woocommerce-order table.shop_table tfoot tr:last-child > * { border-bottom: 0; } body.woocommerce-order-received .woocommerce-order .includes_tax { display: block; margin-top: 5px; color: var(--nc-muted); font-size: 0.85em; } /* Σύνδεσμοι και χαρακτηριστικά προϊόντος */ body.woocommerce-order-received .woocommerce-order a { color: var(--nc-accent); text-decoration: none; } body.woocommerce-order-received .woocommerce-order a:hover { text-decoration: underline; } body.woocommerce-order-received .woocommerce-order .wc-item-meta { margin: 10px 0 0; padding: 0; list-style: none; color: var(--nc-muted); font-size: 0.9em; } body.woocommerce-order-received .woocommerce-order .wc-item-meta li { margin: 4px 0; } body.woocommerce-order-received .woocommerce-order .wc-item-meta p { display: inline; margin: 0; } /* Διευθύνσεις */ body.woocommerce-order-received .woocommerce-order .woocommerce-columns--addresses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } body.woocommerce-order-received .woocommerce-order .woocommerce-columns--addresses::before, body.woocommerce-order-received .woocommerce-order .woocommerce-columns--addresses::after { display: none; } body.woocommerce-order-received .woocommerce-order .woocommerce-columns--addresses > .woocommerce-column { float: none; width: auto; min-width: 0; margin: 0; } body.woocommerce-order-received .woocommerce-order .woocommerce-customer-details address { height: auto !important; padding: var(--nc-padding); border: 1px solid var(--nc-border); border-radius: 14px; background: rgba(255, 255, 255, 0.03); color: var(--nc-muted); font-style: normal; } /* Mobile */ @media (max-width: 767px) { body.woocommerce-order-received .woocommerce-order .woocommerce-columns--addresses { grid-template-columns: 1fr; } } /* END THANK YOU PAGE */ .grecaptcha-badge { visibility: hidden!important; }