/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
 */
 
/* 1. Δήλωση της γραμματοσειράς */
@font-face {
    font-family: 'GFSPorson';
    src: url('fonts/GFSPorson.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap; /* Επιτρέπει την εμφάνιση κειμένου μέχρι να φορτώσει η γραμματοσειρά */
}

/* 2. Εφαρμογή σε όλα τα H1 
*h1, .single-product .product_title, .gfsporson {
 *   font-family: 'GFSPorson', serif !important;
  *  font-weight: 400; Η Porson είναι συνήθως regular 
   * letter-spacing: 0.03em;  Λίγος αέρας για luxury αίσθηση 
}*/

/* --- 1. Αρχική Κατάσταση (Πριν το scroll) --- */

.animate-fade-in {
    opacity: 0;
    transform: translateY(20px);
    /* Δεν βάζουμε animation εδώ! */
}

.animate-slide-up {
    opacity: 0;
    transform: translateY(100px);
    /* Δεν βάζουμε animation εδώ! */
}

/* --- 2. Κατάσταση Animation (Μόλις προστεθεί η κλάση .is-visible) --- */

.animate-fade-in.is-visible {
    animation: fadeIn 1s ease-out forwards;
}

.animate-slide-up.is-visible {
    animation: slideUp 1s ease-out 0.3s forwards;
}

/* --- Keyframes (Παραμένουν τα ίδια) --- */
@keyframes fadeIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- Διορθωμένο Hover Zoom για Grids --- */

/* 1. Εξασφαλίζουμε ότι το zoom κόβεται στα όρια του κάθε προϊόντος */
/* Τα περισσότερα shortcodes (WooCommerce/Blocksy) χρησιμοποιούν li ή article για τα προϊόντα */
.has-hover-zoom li, 
.has-hover-zoom article, 
.has-hover-zoom .product,
.has-hover-zoom .ct-image-container {
    overflow: hidden !important;
    position: relative;
}

/* 2. Ρυθμίσεις για την εικόνα (transition) */
.has-hover-zoom img {
    transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    will-change: transform;
}

/* 3. Η κρίσιμη αλλαγή: Το zoom ενεργοποιείται ΜΟΝΟ στο αντικείμενο που γίνεται hover */
.has-hover-zoom li:hover img, 
.has-hover-zoom article:hover img, 
.has-hover-zoom .product:hover img,
.has-hover-zoom .ct-image-container:hover img {
    transform: scale(1.1) !important;
}

/* --- Global Product Preview Hover (Excluding Single Product Gallery) --- */

/* 1. Επιλογή των containers - Στοχεύουμε ΜΟΝΟ τα προϊόντα σε λίστες/grids */
ul.products li.product .ct-image-container, 
ul.products li.product .woo-entry-image,
.related.products .product .ct-image-container,
.upsells.products .product .ct-image-container,
.animate-slide-up.has-hover-zoom {
    overflow: hidden !important;
    position: relative;
}

/* 2. Ρυθμίσεις για την εικόνα - Μόνο για τα preview items */
ul.products li.product img,
.related.products .product img,
.upsells.products .product img,
.has-hover-zoom img {
    transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    will-change: transform;
}

/* 3. Hover Effect - Ενεργοποιείται μόνο στα previews */
ul.products li.product:hover img,
.related.products .product:hover img,
.upsells.products .product:hover img,
.has-hover-zoom:hover img {
    transform: scale(1.1) !important;
}

/* 4. Ρητή Εξαίρεση (Safety Net) για την κύρια εικόνα του προϊόντος */
.single-product .woocommerce-product-gallery img {
    transform: none !important;
    transition: none !important;
}
/* --- Απόλυτη Ευθυγράμμιση Column Blocks με τον Header --- */
.wp-block-columns.constrained-columns {
    /* 1. Εξαναγκασμός πλάτους */
    width: 100% !important;
    max-width: var(--theme-container-max-width) !important;
    
    /* 2. Κεντράρισμα */
    margin-inline: auto !important;
    
    /* 3. Αντιγραφή του "αέρα" (gutter) του Blocksy Header */
    /* Το Blocksy χρησιμοποιεί συνήθως 15px ή 20px padding στα containers του */
    padding-inline: var(--theme-container-padding, 20px) !important;
    
    /* 4. Reset τυχόν default margins του Gutenberg που χαλάνε τη στοίχιση */
    margin-block-start: 0;
    margin-block-end: 0;
    
    box-sizing: border-box !important;
}

/* Εξασφάλιση ότι το περιεχόμενο μέσα στις στήλες δεν "ξεχειλίζει" */
.constrained-columns > .wp-block-column {
    padding-inline: 0; 
}

/* --- Luxury Swatches Styling --- */

/* 1. Το εξωτερικό πλαίσιο (το li) */
li.variable-item.color-variable-item {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    border: 1px solid #e0e0e0 !important;
    padding: 2px !important; /* Δημιουργεί ένα luxury κενό ανάμεσα στο χρώμα και το border */
    background: transparent !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    box-shadow: none !important;
}

/* 2. Αφαιρούμε τυχόν default στυλ από το εσωτερικό div */
li.variable-item.color-variable-item .variable-item-contents {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

/* 3. Το εσωτερικό κυκλάκι με το χρώμα (το span) */
li.variable-item.color-variable-item .variable-item-span-color {
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important;
    display: block !important;
}

/* 4. Κατάσταση Επιλογής (Selected) */
li.variable-item.color-variable-item.selected {
    border-color: #1a1a1a !important; /* Μαύρο έντονο περίγραμμα */
    border-width: 2px !important;
}

/* 5. Hover Effect */
li.variable-item.color-variable-item:hover {
    transform: scale(1.1);
    border-color: #999 !important;
}

/* 1. Βασικό Setup της Κάρτας */
.luxury-card {
    transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    cursor: pointer;
}

/* 2. Setup του Image Wrapper (για τη σκιά και το κλείδωμα του Zoom) */
.luxury-card .stk-img-wrapper {
    overflow: hidden; /* Απαραίτητο για να μην βγαίνει η εικόνα έξω στο zoom */
    transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

/* 3. Setup της ίδιας της εικόνας (για το Zoom) */
.luxury-card .stk-img-wrapper img {
    transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

/* --- HOVER EFFECTS --- */

/* Σήκωμα της κάρτας και βάθος σκιάς */
.luxury-card:hover {
    transform: translateY(-10px);
}

.luxury-card:hover .stk-img-wrapper {
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.1);
}

/* Zoom-in της εικόνας */
.luxury-card:hover .stk-img-wrapper img {
    transform: scale(1.1);
}

/* Αλλαγή χρώματος τίτλου (αν είναι μέσα στην κλάση) */
.luxury-card:hover h3 {
    color: #000;
    transition: color 0.3s ease;
}

@media (min-width: 1024px) {
    .split-overlap {
        margin-left: -80px !important; /* Μετακίνηση του κειμένου προς τα αριστερά */
        background: #fff; /* Λευκό background για να ξεχωρίζει πάνω από την εικόνα */
        padding: 60px !important;
        z-index: 10;
        box-shadow: 20px 20px 60px rgba(0,0,0,0.05);
    }
}

/* 1. Mobile Only (έως 767px) */
@media (max-width: 767px) {
    .hide-on-mobile {
        display: none !important;
    }
    
   .flex-about div {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }
}

/* 2. Tablet Only (768px έως 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
    .hide-on-tablet {
        display: none !important;
    }
}

/* 3. Mobile & Tablet μαζί (0 έως 1024px) - Πολύ χρήσιμο */
@media (max-width: 1024px) {
    .hide-on-mobile-tablet {
        display: none !important;
    }
    
   .align-center-on-mobile-tablet {
       text-align: center !important;
   }
   
   .justify-content-center-on-mobile-tablet {
       justify-content: center !important;
   }
   
   .justify-content-center-on-mobile-tablet h1 {
       text-align: center !important;
   }
   

}

/* Απενεργοποίηση Fixed Background για Stackable Blocks σε Mobile/Tablet */
@media (max-width: 1024px) {
    /* Συνδυάζουμε τις κλάσεις για να αυξήσουμε την ειδικότητα (Specificity) */
    .stk-block.disable-fixed-bg-mobile,
    .stk-block.disable-fixed-bg-mobile .stk-block-background,
    .stk-block.disable-fixed-bg-mobile .stk-block-background::before {
        background-attachment: scroll !important;
        background-position: center left !important;
        background-size: cover !important;
        /* Σταματάμε τυχόν parallax κινήσεις της Stackable */
        transform: none !important;
    }
}

/* 4. Desktop Only (από 1025px και πάνω) */
@media (min-width: 1025px) {
    .hide-on-desktop {
        display: none !important;
    }
    
}

.gift-wrap-selection {
    display: flex;
    align-items: center;
    padding: 10px 0;
    border-top: 1px solid #eee; /* Διακριτικός διαχωρισμός όπως στο παλιό site */
}

.gift-wrap-text {
    font-family: 'Open Sans', sans-serif; /* */
    font-size: 1rem; /* 16px για mobile readability */
    color: #333;
    margin-left: 8px;
}

.gift-wrap-selection input[type="checkbox"] {
    accent-color: #ffb754; /* Το χρυσό/μπεζ χρώμα του brand σας */
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.gift-wrap-selection label {
    display: flex;
    align-items: center;
}

/* 1. Αρχικό κρύψιμο των πεδίων τιμολογίου */
.wc-block-components-address-form__cestla-company_name,
.wc-block-components-address-form__cestla-business_activity,
.wc-block-components-address-form__cestla-vat_number {
    display: none !important;
}

/* 2. Εμφάνιση ΜΟΝΟ όταν το body έχει το attribute data-cestla-invoice="true" */
body[data-cestla-invoice="true"] .wc-block-components-address-form__cestla-company_name,
body[data-cestla-invoice="true"] .wc-block-components-address-form__cestla-business_activity,
body[data-cestla-invoice="true"] .wc-block-components-address-form__cestla-vat_number {
    display: block !important;
}

/* 3. Κόκκινος αστερίσκος */
.wc-block-components-address-form__cestla-company_name label::after,
.wc-block-components-address-form__cestla-business_activity label::after,
.wc-block-components-address-form__cestla-vat_number label::after {
    content: " *";
    color: #e53e3e;
    font-weight: bold;
}

/* Κρύβουμε το span του "προαιρετικού" σε όλα τα δικά μας πεδία */
.wc-block-components-address-form__cestla-document_type label .wc-block-components-address-form__optional,
.wc-block-components-address-form__cestla-company_name label .wc-block-components-address-form__optional,
.wc-block-components-address-form__cestla-business_activity label .wc-block-components-address-form__optional,
.wc-block-components-address-form__cestla-vat_number label .wc-block-components-address-form__optional {
    display: none !important;
}

/* Styling για το πεδίο ΑΦΜ όταν είναι έγκυρο/άκυρο */
#contact-cestla-vat_number:invalid {
    box-shadow: none; /* Αφαιρούμε το default shadow του browser */
}

#contact-cestla-vat_number:focus:invalid {
    border-color: #e53e3e !important;
    outline-color: #e53e3e !important;
}

/* Προαιρετικό: Μήνυμα κάτω από το πεδίο αν θέλεις να φαίνεται μόνιμα το λάθος */
.wc-block-components-address-form__cestla-vat_number .wc-block-components-validation-error {
    color: #e53e3e;
    font-size: 0.85em;
    margin-top: 5px;
}

/* Animation για πιο luxury αίσθηση */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}