/*
	Theme Name: Hello Elementor AK terra
	Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
	Description: CUstomization for: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
	Author: AK-terra
	Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
	Version: 3.4.6
	Stable tag: 3.4.6
	Requires at least: 6.0
	Tested up to: 6.8
	Requires PHP: 7.4
	License: GNU General Public License v3 or later.
	License URI: https://www.gnu.org/licenses/gpl-3.0.html
	Template:     hello-elementor
    Text Domain:  hello-elementor-ΑΚ-terra
	Tags: accessibility-ready, flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready,
*/
/* Κρύβουμε το dropdown του υλικού αλλά το αφήνουμε να υπάρχει στον κώδικα */
.hidden-variation-dropdown {
    display: none!important;
}

/* MAIN VARIATIONS LAYOUT */
.variations {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

/* κάθε attribute block */
.custom-variation-row {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* LABEL (material / size) */
.custom-variation-row .label {
    font-weight: 600;
    text-transform: lowercase;
}

/* VALUE container */
.custom-variation-row .value {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.material-options {
    display: flex;
    gap: 15px;
    flex-wrap: wrap; /* Για να αλλάζει γραμμή σε κινητά */
}

.material-box {
    cursor: pointer;
    border: 1px solid #ddd;
    padding: 5px;
    text-align: center;
    width: 100px; /* Ρύθμισε το πλάτος που θες */
    transition: all 0.3s ease;
    background: #fff;
}

/* Όταν ένα υλικό είναι επιλεγμένο (θα χρειαστεί το JS παρακάτω) */
.material-box.active {
    border: 2px solid black;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
}

.material-image {
    width: 100%;
    height: 80px; /* Σταθερό ύψος για ομοιομορφία */
    overflow: hidden;
    background: #f9f9f9;
    margin-bottom: 5px;
}

.material-image img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Κάνει τη φωτό να γεμίζει το κουτί χωρίς να παραμορφώνεται */
    display: block;
}

.material-label {
    font-size: 13px;
    text-transform: capitalize;
    font-weight: 500;
    color: #333;
}

.size-row{
    display:flex;
    align-items:center;
    gap:20px;
    flex-wrap: wrap; /* σημαντικό για mobile */
}

/* 
Στυλ για όλα τα quantity inputs στο WooCommerce site.
Επηρεάζει product page, cart, mini cart και checkout,
χωρίς να αγγίζει άλλα inputs του site.
*/
.woocommerce input.qty {
    padding: 0px 10px;
}

/**
 *********Additional fix-overrides on theme's rules has been added via wp backend menu Appearence > Customize > Additional CSS. Check there
 */