/*
Theme Name:	Chemid - Child theme
Theme URI: https://themnific.com
Description:	A basic child theme for Chemid Theme
Author:		Dannci & Themnific
Author URI: https://themnific.com
Template:	chemid
Version:	0.1
*/

/* ADD SOME STYLE BELOW */


/* WPML Custom adapt to chemid*/

.wpml-ls-menu-item a::after {
  content: none !important;
}

.tmnf_menu .wpml-ls-menu-item .sub-menu {
  background-color: transparent;
  padding: 5px;
  top: 50%;
  left: 50px;
  width: auto;
}

@media screen and (max-width: 1200px) {
  .tmnf_menu .sub-menu {
    margin: 7px 0 7px 0px;
  }
}

.tmnf_menu > li.wpml-ls-item > ul.sub-menu::after {
  top: 5px;
  border-left-color: white;
}

/* ==========================================================================
   ΒΕΛΤΙΩΜΕΝΟ WPML SWITCHER CSS ΓΙΑ LABPOINT
============================================================================= */

/* 1. Κατακόρυφη στοίχιση στο κέντρο (Middle) */
@media screen and (min-width: 1200px) {
    .tmnf_menu {
        display: flex !important;
        align-items: center; /* Ευθυγραμμίζει όλα τα li στο κέντρο κατακόρυφα */
        flex-wrap: wrap;
    }
    
    .tmnf_menu li.wpml-ls-item {
        align-self: center; /* Διασφάλιση ειδικά για τις γλώσσες */
    }
}

/* 2. Bold & Contrast στην επιλεγμένη γλώσσα */
.tmnf_menu li.wpml-ls-current-language a span {
    font-weight: 900 !important;
    color: #026bb0 !important; /* Το μπλε σου */
    /* Προσθήκη απαλού λευκού περιγράμματος/σκιάς για να κάνει "pop" στο μαύρο */
    text-shadow: 
        -1px -1px 0 #ffffff,  
         1px -1px 0 #ffffff,
        -1px  1px 0 #ffffff,
         1px  1px 0 #ffffff,
         0px  0px 4px rgba(255,255,255,0.6); 
}

/* 3. Βελτίωση εμφάνισης στη ΜΗ επιλεγμένη γλώσσα */
.tmnf_menu li.wpml-ls-item:not(.wpml-ls-current-language) a span {
    font-weight: 500;
    color: #ffffff !important; /* Την κάνουμε λευκή αντί για μπλε */
    opacity: 0.6; /* Αλλά με opacity για να φαίνεται ότι είναι η δευτερεύουσα */
	text-shadow: -1px -1px 0 #ddd, 1px -1px 0 #ddd, -1px 1px 0 #ddd, 1px 1px 0 #ddd, 0px 0px 4px rgb(182, 182, 182);
}

/* 4. Κάθετο διαχωριστικό | */
@media screen and (min-width: 1200px) {
    .tmnf_menu li.wpml-ls-last-item {
        margin-left: 8px !important;
    }
    
    .tmnf_menu li.wpml-ls-last-item::before {
        content: "|";
        position: absolute;
        left: -6px;
        top: 50%;
        transform: translateY(-50%);
        color: #ddd; /* Λευκό διαχωριστικό για να ταιριάζει με τα κείμενα */
        opacity: 0.3;
        font-weight: 400;
        pointer-events: none;
		text-shadow: -1px -1px 0 #8f8f8f, 1px -1px 0 #8f8f8f, -1px 1px 0 #8f8f8f, 1px 1px 0 #8f8f8f, 0px 0px 4px rgb(182, 182, 182);
    }
}

/* 5. Clean up των paddings */
@media screen and (min-width: 1200px) {
    #additional_menu .tmnf_menu > li.wpml-ls-item > a {
        padding-left: 8px !important;
        padding-right: 8px !important;
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }
}

/* Κρατάμε τα δικά σου αρχικά resets για τα sub-menus */
.wpml-ls-menu-item a::after {
    content: none !important;
}
.tmnf_menu .wpml-ls-menu-item .sub-menu {
    background-color: transparent;
    padding: 5px;
    top: 50%;
    left: 50px;
    width: auto;
}
@media screen and (max-width: 1200px) {
    .tmnf_menu .sub-menu {
        margin: 7px 0 7px 0px;
    }
}
.tmnf_menu > li.wpml-ls-item > ul.sub-menu::after {
    top: 5px;
    border-left-color: white;
}

/* --- Mobile Menu Final Optimization --- */
@media screen and (max-width: 1200px) {
    #additional_menu_mobile .tmnf_menu {
        display: block !important;
    }

    #additional_menu_mobile .tmnf_menu li.wpml-ls-item {
        display: inline-block !important;
        width: auto !important;
        /* Η θέση αυτή το κλειδώνει δεξιά με ακρίβεια */
        position: relative !important;
        left: calc(100% - 75px); 
    }

    /* Ρύθμιση αποστάσεων για να μην κολλάνε οι γλώσσες */
    #additional_menu_mobile .tmnf_menu li.wpml-ls-last-item {
        margin-left: 10px !important;
    }

    /* Επαναφορά διαχωριστικού | */
    #additional_menu_mobile .tmnf_menu li.wpml-ls-last-item::before {
        content: "|";
        position: absolute;
        left: -6px;
        top: 50%;
        transform: translateY(-50%);
        color: #ffffff;
        opacity: 0.4;
        font-weight: 400;
    }

    /* Μέγεθος γραμματοσειράς και paddings */
    #additional_menu_mobile .tmnf_menu > li > a {
        font-size: 15px !important;
        padding: 5px !important;
        white-space: nowrap;
    }

    #additional_menu_mobile .tmnf_menu > li > a i {
        font-size: 15px !important;
        margin-right: 4px !important;
    }
}


/* ==========================================================================
   HEADER MAIN MENU
============================================================================= */

@media screen and (min-width: 1200px) {
	.tmnf_menu ul.sub-menu {
	  width: 300px;
	}
}

@media screen and (min-width: 1200px) {
	.tmnf_menu ul.sub-menu li.menu-item a {
	  padding-right: 5px !important;
	}
}



/* Mega Menu*/

/* 1. Επαναφορά Hover State & Μετατροπή σε CSS Grid ΜΟΝΟ όταν εμφανίζεται (hover/active) */
#main_menu > li.tmnf_mega:hover > .sub-menu,
#main_menu > li.tmnf_mega.sfHover > .sub-menu {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) 220px !important; /* 3 ισόποσες στήλες + 1 στήλη 220px για το Promo */
    gap: 15px !important;
    width: 780px !important; /* Συνολικό πλάτος */
    padding: 20px !important;
    box-sizing: border-box !important;
}

/* 2. Καθαρισμός των floats για όλα τα εσωτερικά li */
#main_menu > li.tmnf_mega > .sub-menu > li {
    width: 100% !important; /* Γεμίζουν τη στήλη του Grid στην οποία βρίσκονται */
    float: none !important;
    margin: 0 !important;
}

/* 1. Η Promo Κάρτα (tmnf_last_menu_item) -> Τοποθέτηση & Alignment πάνω αριστερά */
#main_menu > li.tmnf_mega > .sub-menu > li.tmnf_last_menu_item {
    grid-column: 4 !important;
    grid-row: 1 / -1 !important;
    background-color: #007bff !important;
    border-radius: 8px;
    padding: 20px 18px !important;
    box-sizing: border-box !important;
    position: relative !important; /* Απαραίτητο για την τοποθέτηση του βέλους κάτω δεξιά */
    
    /* Αλλαγή σε top alignment */
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important; /* Σπρώχνει το κείμενο τέρμα επάνω */
    align-items: flex-start !important;     /* Σπρώχνει το κείμενο αριστερά */
}

#main_menu > li.tmnf_mega > .sub-menu > li.tmnf_last_menu_item:hover {
    background-color: #0056b3 !important;
}

/* 2. Navigation Label (Τίτλος) - Μεγαλύτερη γραμματοσειρά & πάνω αριστερά */
#main_menu > li.tmnf_mega > .sub-menu > li.tmnf_last_menu_item > a {
    color: #ffffff !important;
    font-size: 17px !important; /* Ελαφρώς μεγαλύτερο */
    font-weight: 700 !important;
    line-height: 1.2 !important;
    padding: 0 !important;
    text-align: left !important;
    width: 100% !important;
}

/* 3. Description - Άνετος χώρος για περισσότερες γραμμές */
#main_menu > li.tmnf_mega > .sub-menu > li.tmnf_last_menu_item > a span.menu-item-description {
    color: #e2e8f0 !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    margin-top: 10px !important;
    line-height: 1.45 !important;
    display: block !important;
    text-align: left !important;
    white-space: normal !important; /* Επιτρέπει το σπάσιμο σε πολλές γραμμές */
}

/* 4. FontAwesome Βελάκι κάτω δεξιά */
#main_menu > li.tmnf_mega > .sub-menu > li.tmnf_last_menu_item::after {
    content: "\f35d"; /* FontAwesome arrow-right (ή \f105 για angle-right ">") */
    font-family: "Font Awesome 5 Free", "FontAwesome", sans-serif;
    font-weight: 900;
    color: #ffffff;
    font-size: 16px;
    position: absolute;
    bottom: 15px;
    right: 18px;
    opacity: 0.85;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

/* Μικρό hover animation στο βελάκι */
#main_menu > li.tmnf_mega > .sub-menu > li.tmnf_last_menu_item:hover::after {
    transform: translateX(4px);
    opacity: 1;
}

/* Αυτό λειτουργεί μαζί με το add_action('wp_footer', 'labpoint_split_menu_descriptions_js');
   που μπήκε στο functions.php στο child theme                                                */
#main_menu > li.tmnf_mega > .sub-menu > li > a span.menu-item-description {
  display: block !important;
  line-height: 1.6 !important;
  margin-top: 6px !important;
  white-space: pre-line !important;
}


/*----------------------------------------------------------------------------------------
/* Αν θέλουμε το 3ο επίπεδο μενού να μην είναι hover pulldown
/*-----------------------------------------------------------------------------------------

/* 1. Εμφάνιση των sub-items (3ο επίπεδο) ως στατική λίστα αντί για hover dropdown 
#main_menu > li.tmnf_mega .sub-menu .sub-menu {
    position: static !important; /* Ακυρώνει το absolute positioning του θέματος 
    display: block !important;   /* Εμφανίζεται πάντα (όχι μόνο στο hover) 
    visibility: visible !important;
    opacity: 1 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 8px 0 0 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

/* 2. Styling για τα links του 3ου επιπέδου 
#main_menu > li.tmnf_mega .sub-menu .sub-menu > li {
    display: block !important;
    margin-bottom: 6px !important;
}

#main_menu > li.tmnf_mega .sub-menu .sub-menu > li > a {
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #4a5568 !important; /* Adjust color ανάλογα με το φόντο 
    padding: 0 !important;
    line-height: 1.4 !important;
}

#main_menu > li.tmnf_mega .sub-menu .sub-menu > li > a:hover {
    color: #007bff !important; /* Hover χρώμα για τα υπο-links 
}

/* 3. Προσθήκη παύλας/bullet πριν από κάθε υπο-link μέσω CSS 
#main_menu > li.tmnf_mega .sub-menu .sub-menu > li > a::before {
    content: "– " !important;
    margin-right: 4px;
    opacity: 0.7;
}

@media screen and (min-width: 1200px) {
  .tmnf_menu li.menu-item-has-children > a::after {
    content: ''!important;
  }
}
/*---------------------------------------------------------------------------------*/

.sidebar_item ul li.wpml-ls-current-language {
  border-color: #85c2e1 !important;
  border-width: 0 0 1px 0!important;
}