/* --- RESPONSIVE SETTINGS (Full Corrected Version) --- */
@media (max-width: 1200px) {
    img.res{width:100%; height: auto;}

}


@media (max-width: 991px) {
    
    /* 1. LAYOUT WIDTHS (Διασύνδεση με XML Mobile Settings) */
    
    /* Πλάτος Header Mobile */
.main-header .container-custom { 
    width: var(--m-header-w) !important; 
    max-width: none !important; /* Εδώ είναι το κλειδί */
    min-width: var(--m-header-w) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 auto !important;
}

/* Αν θέλεις το header να πιάνει όλη την οθόνη χωρίς κενά δεξιά-αριστερά */
.main-header {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

    /* Πλάτος Top Content Mobile */
    .top-content-area .container-custom { 
        width: var(--m-top-w) !important; 
        max-width: var(--m-top-w) !important; 
        margin: 0 auto !important;
        padding: 0;
    }

    /* Πλάτος Main Mobile */
    main .container-custom { 
        width: var(--m-main-w) !important;
        border-width: var(--m-main-border-w) !important; 
        max-width: var(--m-main-w) !important; 
        margin: 0 auto !important;
    }

    /* Πλάτος Άρθρου Mobile */
    .article-area { 
        width: var(--m-art-w) !important; 
        max-width: 100% !important; 
        margin: 0 auto !important; 
        display: block !important;
        flex: 0 0 var(--m-art-w) !important;
    }

    /* Πλάτος Footer Mobile */
    .main-footer .container-custom { 
        width: var(--m-footer-w) !important; 
        max-width: var(--m-footer-w) !important; 
        margin: 0 auto !important;
    }

    /* 2. DISPLAY & FLEX CONTROLS */
    .header-desktop { display: none !important; }
    .header-mobile { display: block !important; }
    
    .main-flex { 
        flex-direction: column !important; 
        align-items: center !important; 
        width: 100% !important; 
        display: flex !important; 
        gap: 20px !important;
    }
    
    .sidebar-area { 
        width: 100% !important; 
        flex: 0 0 100% !important;
        margin-top: 20px !important; 
    }
    
    /* 3. MOBILE MENU BUTTON */
    .m-btn { 
        background-color: var(--m-box-bg) !important; 
        border: 1px solid var(--m-box-border) !important; 
        border-radius: var(--m-box-radius) !important; 
        color: var(--m-menu-text) !important; 
        padding: 10px 18px !important; 
        font-size: 1.4rem !important; 
        cursor: pointer; 
        display: inline-flex; 
        align-items: center; 
        justify-content: center; 
        transition: 0.3s ease;
    }
    
    /* 4. MOBILE DROPDOWN BOX */
    .m-dropdown { 
        display: none; 
        padding: 15px !important; 
        background: var(--m-box-bg) !important; 
        border: 1px solid var(--m-box-border) !important; 
        border-radius: var(--m-box-radius) !important; 
        margin-top: 15px !important; 
        width: 100% !important; 
        box-sizing: border-box !important; 
        position: relative; 
        z-index: 999; 
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }
    
    .m-dropdown.active { 
        display: block !important; 
    }
    
    .m-dropdown ul, 
    .m-dropdown .mod-menu { 
        display: flex !important; 
        flex-direction: column !important; 
        width: 100% !important; 
        gap: 8px !important; 
        padding: 0 !important; 
        list-style: none !important; 
        margin: 0 !important; 
        
    }
    
    .m-dropdown li { 
        width: 100% !important; 
        list-style: none !important; 
        display: block !important; 
        position: relative; 
    }

    /* 5. MOBILE LINKS STYLE */
    .m-dropdown a { 
        display: block !important; 
        width: 100% !important; 
        padding: 12px 15px !important; 
        color: var(--m-menu-text) !important; 
        background: rgba(0,0,0,0.03) !important; 
        border: 1px solid var(--m-box-border) !important; 
        border-radius: var(--m-box-radius) !important; 
        text-decoration: none !important; 
        position: relative !important; 
        text-align: left !important; 
        box-sizing: border-box !important; 
        font-size: var(--menu-font-size) !important; 
        transition: 0.2s ease;
    }

    /* 6. SUBMENU CARET (Βέλος για υποκατηγορίες) */
    .m-dropdown li.parent > a::after,
    .m-dropdown li.has-child > a::after { 
        content: ""; 
        position: absolute; 
        right: 15px; 
        top: 15px; 
        width: 12px; 
        height: 12px; 
        border-right: 2px solid currentColor; 
        border-bottom: 2px solid currentColor; 
        transform: rotate(45deg); 
        transition: transform 0.3s ease; 
        opacity: 0.6; 
    }
    
    .m-dropdown li.sub-open > a::after { 
        transform: rotate(-135deg); 
        top: 21px;
        color: var(--m-menu-active) !important; 
    }

    /* 7. MOBILE SUBMENUS (Επίπεδο 2) */
.m-dropdown li ul { 
    display: none !important; 
    background: transparent !important; /* Αφαίρεση του διαφορετικού φόντου */
    margin: 5px 0 0 0 !important; /* Μηδενισμός εσοχής αριστερά */
    padding: 0 !important; /* Μηδενισμός εσωτερικών περιθωρίων */
    width: 100% !important; 
    position: static !important;
    border: none !important; /* Αφαίρεση της γραμμής αριστερά */
    gap: 8px !important; /* Ίδια απόσταση μεταξύ των στοιχείων */
}

/* Διασφάλιση ότι τα Links του υπομενού έχουν το ίδιο στυλ με τα κύρια */
.m-dropdown li ul a { 
    background: rgba(0,0,0,0.00) !important; /* Ίδιο φόντο με τα κύρια */
    padding: 12px 15px !important; /* Ίδιο padding */
    margin-bottom: 5px !important;
    font-weight: normal !important;
    border-color: #fff !important;
}
    
.m-dropdown li.sub-open > ul { 
    display: flex !important; 
    flex-direction: column !important;
}
    
    /* Active & Hover States */
    .m-dropdown a:hover, 
    .m-dropdown li.active > a { 
        color: var(--m-menu-active) !important; 
        border-color: var(--m-menu-active) !important; 
        background: rgba(0,0,0,0.06) !important; 
    }

    button.mod-menu__toggle-sub{display: none;}

.pt-2 {
  border-top: none !important;
}

img.res{width:100% !important; height: auto;}

li.nav-item.item-102.default{display: none !important; }
}

@media (max-width: 490px) {
    img.erga {width: 100% !important; height: auto;}
}