/* Custom Overrides - Αυτό το αρχείο πρέπει να φορτώνει τελευταίο */
.filter {
    padding-right: 10% !important;
}
.filter ul {
    list-style: none !important;
    padding-left: 0 !important;
}

/* ορισμός μεγέθους h3 στο filter menu προϊόντων */
.filter h3 {
    font-size: 1.8rem !important;
    color: #014d8b !important;
    font-weight: 400;
}


.search-box{
    width: 250px !important;
}

.img-responsive{
    padding-top: 20px !important;
    max-height: 450px !important;
}

.box-container {
    display: flex;
    justify-content: center; /* Κεντράρισμα οριζόντια */
    align-items: center;     /* Κεντράρισμα κάθετα (αν χρειάζεται) */
    height: 200px;           /* Ένα σταθερό ύψος για το πλαίσιο */
    background-color: none !important; /* Προαιρετικό: χρώμα φόντου για να φαίνεται το πλαίσιο */
}

.img-responsive-about{
    max-height: 200px;
    width: auto;             /* Αυτόματη αναλογία */
    display: block;          /* Βοηθάει στην αποφυγή περιττών κενών */
}

.img-responsive-gpumps{
    max-height: 350px;
    width: auto;
    min-width: 600px;           /* Αυτόματη αναλογία */
    display: block;          /* Βοηθάει στην αποφυγή περιττών κενών */
}

.img-responsive-family{
    max-height: 300px !important;
    width: auto;             /* Αυτόματη αναλογία */
    display: block;          /* Βοηθάει στην αποφυγή περιττών κενών */
}

 /* καθορισμός διαστάσεων και αποστάσεων image gallery product στην show */
.gallery-container{
    display: inline-block;
    margin: 5px;
}

.img-responsive-image-gallery{
    width: 120px !important;
    height: 120px !important;
    object-fit: cover; /* Κόβει την εικόνα ομοιόμορφα για να γεμίσει το πλαίσιο */
}

.img-responsive-homePage{
    max-height: 300px !important;
}


.contact-infos {
    margin-top: 12%; /* Καθορισμός απόστασης στοιχείων διευθύνσεων contact */
    text-align: right;
    padding-right: 15%;
}

.contact-infos h3{
    font-size: 3rem;
}
.contact-infos ul li a{
    font-size: 2rem !important;
}


.titleProducts{
    color: #014d8b;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 700;
    font-size: 1.6rem;
}

.filter .sidebar-category h4 {
    cursor: pointer !important;
    display: flex !important;
    justify-content: space-between !important;
    padding: 1% 0 !important;
    border-bottom: 1px solid #ccc !important;
    font-size: 1.4rem !important;
    color: #474747 !important;
}

.filter .sidebar-category h4::after {
    content: '+' !important;
    color: #014d8b !important;
}

.filter .sidebar-category.active h4::after {
    content: '-' !important;
}

.filter .sidebar-category ul {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    display: none;
    padding-left: 20px !important;
}
.filter .sidebar-category em, li, li a {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    font-size: 1.5rem !important;
    font-weight: 500;
    color: #515769;
    padding-bottom: 2% !important;
}

.list-unstyled .idebar-category ul, li a{
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    font-size: 1.4rem !important;
    font-weight: 500;
    color: #515769;
}

.product-description {
    display: -webkit-box;
    -webkit-line-clamp: 3; /* Εδώ ορίζεις τον αριθμό των γραμμών */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.parallax-window{
    max-height: 390px !important;
}

.btn {
  color: #fff;
  background-color: #014d8b;
  width: 100%;
  max-width: 200px;
  padding: 2%;
  margin-bottom: 5%;
}

.filter .btn{
    max-width: 400px;
}


.btn:hover {
  color: #fff;
  background-color: #a7a7a7;
  width: 100%;
}

/* Διαχωρισμός των κουμπιών */
.mb-4 { margin-bottom: 1.5rem; }
.mt-2 { margin-top: 0.5rem; }

/* Στυλ για το εικονίδιο μέσα στο input */
.input-group .btn {
    border: 0;
    background-color: #f8f9fa;
}
.input-group .form-control {
    border-right: 0;
}

/* Πρόσθεσε αυτό στο CSS αρχείο σου */
.wow.zoomIn a img:hover {
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.applications{
    padding-bottom: 5%;
    color: #4e4e4e;
}


/* Μείωσε την απόσταση μεταξύ των γραμμών στα χαρακτηριστικά */
#specs ul li {
    margin-bottom: 2px !important;
    padding: 2px 0 !important;
    line-height: 1.2 !important;
    color: #4e4e4e;
}
/* Αν τα χαρακτηριστικά είναι σε div αντί για λίστα, μάζεψε τα p */
#specs p {
    margin-bottom: 5px !important;
}

.applications_line{
    color: #c5c5c5;
    font-size: 2rem;
}

.selected-subcategory {
color: #014d8b !important; /* Το χρώμα που θέλεις */
font-weight: bold;
}

/* Για να μένει το μενού ανοιχτό */
.sidebar-category.active ul {
    display: block !important;
}

.sidebar-category.active ul {
    display: block !important;
    padding-bottom: 20px !important; /* Προσθέτει χώρο προς τα κάτω για το sidebar των υποκατηγοριών */
}

/* Για να είναι μπλε η επιλεγμένη υποκατηγορία */
.selected-subcategory a {
    color: #014d8b !important;
    font-weight: bold;
}


.filter-status-bar {
    margin-bottom: 20px;
    padding: 10px 15px;
    font-size: 16px;
    color: #333;
}

.filter-status-bar strong {
    color: #666666;
}

.input-group {
    color: #cccccc; /* Ένα πιο σκούρο μπλε για το brand σου */
}
.input-group input {
    border: none !important; /* Βγάζουμε το default border του input */
    box-shadow: none !important;
}
.input-group .btn {
    color: #cecece; /* Ένα πιο σκούρο μπλε για το brand σου */
    border: none;
    transition: background-color 0.3s;
    width: 100px !important;
    height: 50px !important;
}
.input-group .btn:hover {
    color: #004a99;
}

#productRow{
    margin-top: 20px;
}

.link {
  color: #6d6d6d !important;
}

.map{
    margin-bottom: 3% !important;
}

.carousel-indicators li {
  display: inline-block;
  cursor: pointer;
  background-color: #ffffff52; /* Το μπλε χρώμα του brand σου */
  border: 1px solid #ffffff52;
  margin-bottom: 300%;
}

.carousel-indicators .active {
    background-color: #17bed2; /* Το μπλε χρώμα του brand σου */
    border-color: #17bed2; /* Το μπλε χρώμα του brand σου */
    margin-bottom: 298%;

}

.carousel-centered h2{
    font-size: 4rem;
    font-weight: 300;
    color: #ffffff52;
}


.video-container {
    position: relative;
    padding-bottom: 32.25%; /* 16:9 Aspect Ratio */
    height: 0;
    overflow: hidden;
    max-width: 100%;
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Αναγκάζουμε το link να μην έχει άλλο κείμενο εκτός από το εικονίδιο */
.js-back-to-top {
    font-size: 0 !important; /* Κρύβει τυχόν κείμενο */
}

.js-back-to-top i {
    margin: 8px auto; /* Κεντράρει το εικονίδιο */
    font-size: 14px !important; /* Επαναφέρει το σωστό μέγεθος στο βέλος */
}


.active-menu {
    color: #17bed2 !important; /* Βάλε εδώ το χρώμα που θέλεις */
}



#loader-wrapper {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: #061324; /* Το χρώμα του background σου */
    z-index: 9999;
}


.readMoreHome{
    color: #808080;
    padding-top: 15%;
    font-weight: 600;
    font-size: 1.2rem;
}


.lineReadMore{
    color: #004a99;
    font-weight: 800;
    font-size: 1.5rem;
    padding-top: 1%;
    padding-left: 1%;
}

.textApplicationHomePage{
    padding-top: 5%;
    padding-bottom: 5%;
    color: #4e4e4e;
}
.textApplicationHomePage h4{
    color: #014d8b !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 700;
    font-size: 2rem;
}


.rowApplicationsHomePage .content-lg{
    padding-top: 2% !important;
}


.category-meta-description{
    font-size: 1.5rem;
    color: #666;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.industry-img{
    padding-top: 5%;
}

.industry-title h5{
    font-family: Hind, sans-serif;
    font-weight: 700 !important;
    font-size: 1.8rem !important;
}

.industry .link {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important; /* Η απόσταση ανάμεσα στη λέξη και τη γραμμή */
}

.industry .link::after {
    content: "" !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    display: inline-block !important;
    width: 10px !important;
    height: 2px !important;
    background: #014d8b !important;
    flex-shrink: 0 !important;
}


.img-responsive-indusrty{
    width: 100%;             /* Αυτόματη αναλογία */
    display: block;          /* Βοηθάει στην αποφυγή περιττών κενών */
    margin-top: 5%;
    margin-bottom: 10%;
}


.selected-application {
color: #014d8b !important; /* Το χρώμα που θέλεις */
font-weight: bold;
}


.pagination {
    margin-top: 5%;
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: 4px;
}


.pagination li {
    margin: 0 3px;
}

.pagination li a,
.pagination li span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 38px; /* Προσαρμόσε το αν θες πιο φαρδύ ή στενό */
    height: 38px;
    padding: 0 12px;
    text-align: center;
}

.pagination li.active span {
    z-index: 3;
    color: #fff;
    background-color: #014d8b;
    border-color: #014d8b;
}

.pagination li.disabled span {
    color: #777;
    background-color: #fff;
    border-color: #ddd;
}


.breadcrumb-wrapper{
    margin-top: 1%;
}

.tab-content p{
    color: #555;
    padding-top: 1%;
}

.tab-content ul li{
    padding-top: 5px !important;
}

/* Διασφάλιση ότι το πρώτο tab φαίνεται όταν ανοίγει η σελίδα */
#productTabsContent > .tab-pane:first-child:not(.active) {
    /* Ανάλογα με τη ροή του Bootstrap */
}

/* Η σωστή εμφάνιση του active tab */
.tab-content > .tab-pane.active {
    display: block !important;
    opacity: 1 !important;
}
.tab-content > .tab-pane:not(.active) {
    display: none !important;
}

.product{
    margin-bottom: 10%;
}


/* 1. Κάνουμε το row να συμπεριφέρεται ως flexbox για ομοιόμορφο ύψος */
.col-sm-9 .row {
    display: flex;
    flex-wrap: wrap;
}

/* 2. Κάθε στήλη προϊόντος να γεμίζει όλο το διαθέσιμο ύψος */
#productRow {
    display: flex;
    flex-direction: column;
    margin-bottom: 30px; /* Αντικαθιστά το sm-margin-b-50 για πιο ομοιόμορφα κενά */
}

/* 3. Η κάρτα του προϊόντος γίνεται flex container για να σπρώχνει το "Read More" κάτω */
#productRow > div:first-of-type {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* 4. Σταθεροποίηση εικόνων ώστε να μην αλλάζουν ύψος */
#productRow img.img-responsive {
    width: 100%;
    height: 220px; /* Ορίζεις ένα σταθερό ύψος για τις εικόνες */
    object-fit: contain; /* Ή cover ανάλογα με το πώς θες να γεμίζουν */
}

/* 5. Σταθερό ύψος ήπεριορισμός γραμμών στην περιγραφή, ώστε να μη μεγαλώνει ανόμοια */
#productRow .product-description {
    display: -webkit-box;
    -webkit-line-clamp: 3; /* Κόβει την περιγραφή στις 3 γραμμές μέγιστο */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Εξαναγκασμός εμφάνισης του κουμπιού μόνο σε κινητές/μικρές οθόνες */
#custom-mobile-toggle {
    display: none;
    background: transparent;
    border: none;
    color: #014d8b;
    font-size: 35px;
    cursor: pointer;
    position: absolute;
    right: 20px;
    top: 25px;
    z-index: 100;
}

.img-responsive-services{
    max-height: 300px !important;
    width: auto;             /* Αυτόματη αναλογία */
    display: block;          /* Βοηθάει στην αποφυγή περιττών κενών */
}

/* Στους υπολογιστές: κρύβουμε το κουμπί, δείχνουμε τα φίλτρα κανονικά */
.mobile-filter-btn-wrap {
    display: none !important;
}
#mobile-filters-box {
    display: block !important;
}

.brochures {
    display: flex;
    flex-wrap: wrap;
}

/* Εξασφάλιση ότι οι εικόνες είναι responsive και παίρνουν 100% πλάτος */
.brochures img {
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.089);
    width: 100%;
    height: auto;
    max-width: 100%;
}

.brochures h4 {
    font-size: 1.5rem !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 300;
    text-align: center;
    padding-top: 2%;
}


.brochures h4{
    font-size: 1.5rem !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 300;
    text-align: center;
    padding-top: 2%;
}

.brochures img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.089);
    height: 100%;
}


.form-control {
  color: #000000 !important;
}

#contact-form .form-control {
  color: #faf9f9 !important;
}

@media (max-width: 991px) {
    /* Το κυρίως header γίνεται διαφανές στην κορυφή (όπως στον υπολογιστή) */
    header.header, .header-sticky, .navbar-fixed-top {
        background: transparent !important;
        position: absolute !important;
        width: 100% !important;
        z-index: 1000 !important;
        box-shadow: none !important;
    }

    .brochures img {
            margin-top: 15%;
            max-height: 230px !important;
            object-fit: contain; /* Διατηρεί τις αναλογίες της εικόνας χωρίς να παραμορφώνεται */
        }


    #custom-mobile-toggle {
        display: block !important;
    }

    #mobile-nav-collapse:not(.mobile-open) {
        display: none !important;
    }

    #mobile-nav-collapse.mobile-open {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        background: #ffffff !important;
        position: absolute !important;
        top: 100% !important;

        /* Τρικ για πλήρες πλάτος οθόνης αγνοώντας τα margins του γονικού container */
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%) !important;
        width: 100vw !important;
        max-width: 100vw !important;

        height: auto !important;
        max-height: none !important;
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2) !important;
        padding: 0 !important;
        margin: 0 !important;
        z-index: 99999 !important;
        float: none !important;
    }

    #mobile-nav-collapse .menu-container {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        padding: 0 !important;
        margin: 0 !important;
        float: none !important;
    }

    #mobile-nav-collapse .navbar-nav {
        display: block !important;
        float: none !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #mobile-nav-collapse .navbar-nav > li {
        display: block !important;
        float: none !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border-bottom: 2px solid #eef2f5 !important;
        text-align: left !important;
    }

    #mobile-nav-collapse .navbar-nav > li:last-child {
        border-bottom: none !important;
    }

    #mobile-nav-collapse .navbar-nav > li > a {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        color: #2c3e50 !important;
        background: #e2e2e2  !important;
        padding: 16px 25px !important; /* Ελαφρώς μεγαλύτερο padding αριστερά-δεξιά για ομοιομορφία */
        font-weight: 600 !important;
        font-size: 1.5rem !important;
        line-height: 3 !important;
        text-transform: uppercase;
        box-sizing: border-box !important;
        float: none !important;
        text-align: center;
    }

    #mobile-nav-collapse .navbar-nav > li > a:hover,
    #mobile-nav-collapse .navbar-nav > li > a.active-menu {
        color: #013b6c !important;
        background: #f8f9fa !important;
    }

    #mobile-nav-collapse .navbar-nav > li:last-child > a {
        background-color: #013b6c !important;
        color: #ffffff !important;
        text-align: center !important;
        margin: 0 !important;
    }

    #mobile-nav-collapse .navbar-nav > li:last-child > a:hover {
        background-color: #013b6c !important;
        color: #ffffff !important;
    }


    .header {
        padding-top: 2% !important;
    }

    .header .logo-img {
        width: 100%;
        height: auto;
        min-width: 200px;
        max-height: 20%;
        vertical-align: middle;
        margin-left: 5% !important;
    }

    .img-responsive-family {
        max-height: 150px !important;
        width: auto;
        display: block;
    }

    .img-responsive-services{
        max-height: 170px !important;
        width: auto;             /* Αυτόματη αναλογία */
        display: block;          /* Βοηθάει στην αποφυγή περιττών κενών */
    }


    p {
        font-size: 1.35rem;
        margin-bottom: 15px;

    }

    .ApplicationsHomePage .row {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
    }
    .ApplicationsHomePage h2 {
        margin-left: 5%;
    }

    /*

        .ApplicationsHomePage .col-sm-4,
        .ApplicationsHomePage .col-sm-6 {
            width: 100% !important;
            min-width: 100% !important;
            max-width: 100% !important;
            flex: 0 0 100% !important;
            margin-bottom: 100px !important;
        }

    */


    /* Μετατροπή των στηλών σε πλήρες πλάτος */
    .bg-color-sky-light .col-sm-4 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        float: none !important;
        margin-bottom: 20px !important;
    }

    /* Απενεργοποίηση του forced δυναμικού ύψους από το JS/data-auto-height */
    .bg-color-sky-light .service,
    .bg-color-sky-light [data-height] {
        height: auto !important;
        min-height: 0 !important;
    }

    .img-responsive-about {
        width: 100%;
        height: auto;
        max-height: 400px;
        min-height: 200px;
        display: block;
    }

    /*homePage*/

    .carousel-inner p{
        margin-bottom: 15px;
        padding-left: 5% !important;
        padding-right: 5% !important;
    }

    .textApplicationHomePage{
        padding-top: 0% !important;
        margin-bottom: 10% !important;
    }

    .textApplicationHomePage h4 {
        font-size: 2rem;
        text-align: left;
    }

    .carousel-title {
        margin-top: 20%;
        font-size: 3rem;
        padding-left: 5% !important;
        padding-right: 5% !important;
    }

    .carousel-inner .btn-theme-sm{
        margin-left: 5% !important;
    }

    .carousel-centered h2 {
        font-size: 1.7rem;
        font-weight: 300;
        color: #ffffff52;
        padding-left: 5% !important;
        padding-right: 5% !important;
    }

    .service-info h3{
        font-size: 2.5rem !important;
    }
    .service-info .readMoreHome{
        font-size: 1rem;
    }

    .service .service-icon {
        font-size: 30px;
        margin-bottom: 30px;
        text-align: left;
    }

    .linkhome {
        font-size: 1.2rem;
    }

    .carousel-indicators {
        position: absolute;
        bottom: -550px;
        left: 50%;
        z-index: 15;
        width: 60%;
        padding-left: 0;
        margin-left: -60%;
        text-align: center;
        list-style: none;
    }

    .carousel-indicators .active {
    background-color: #17bed2; /* Το μπλε χρώμα του brand σου */
    border-color: #17bed2; /* Το μπλε χρώμα του brand σου */
    margin-bottom: 299%;

}


    .letestProductHome h2{
        font-size: 3rem;
        text-align: center;
    }

    .letestProductHome p{
        font-size: 1.2rem;
        text-align: center;
        padding-left: 5%;
        padding-right: 5%;
    }


    /* Επιλέγουμε τις στήλες των τελευταίων προϊόντων */
    .row > .col-sm-3 {
        width: 50% !important; /* Βάλτο 100% αν θες ακριβώς 1 προϊόν ανά γραμμή */
        float: left !important;
        margin-bottom: 30px !important;
    }

    /* Καθαρισμός για να μην μπερδεύονται τα floats αν έχουν διαφορετικό ύψος */
    .row > .col-sm-3:nth-child(odd) {
        clear: left;
    }

    .parallax-window {
        height: auto !important;
        min-height: 500px !important;
        padding: 40px 0 !important; /* Προσαρμόζεις τα margins/paddings επάνω-κάτω */
    }

    .parallax-window .parallax-content {
        margin-top: 15% !important;
        position: relative !important;
        top: auto !important;
        transform: none !important;
        padding: 20px !important;
    }


    /* ABOUT */
    .row {
            display: flex !important;
            flex-direction: column !important;
        }

    /* Ρύθμιση πλάτους για να πιάνουν όλη την οθόνη στο κινητό */
    .col-sm-7,
    .col-sm-4.col-sm-offset-1 {
        width: 100% !important;
        margin-left: 0 !important;
        float: none !important;
    }

    /* Φέρνουμε το δεύτερο div (που περιέχει την εικόνα) στην πρώτη θέση */
    .col-sm-4.col-sm-offset-1 {
        order: -1 !important;
        margin-bottom: 25px !important; /* Περιθώριο κάτω από την εικόνα πριν ξεκινήσει το κείμενο */
    }

    .img-responsive-family {
        max-height: 200px !important;
        width: auto;
    }


    .titleProducts{
        color: #014d8b;
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-weight: 700;
        font-size: 1.5rem;
    }

}

@media (max-width: 991px) {
    /* Ενιαίος κανόνας για όλες τις κλάσεις scroll (ανεξάρτητα ποιο script την πρόσθεσε) */
    header.header.mobile-scrolled,
    header.header.header-fixed,
    header.header.scrolled,
    .header-sticky.mobile-scrolled,
    .header-sticky.header-fixed,
    .navbar-fixed-top.mobile-scrolled,
    .navbar-fixed-top.header-fixed {
        background: #ffffff !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
        z-index: 999999 !important;
    }

}

@media (max-width: 991px) {
    /* Στην κορυφή (διαφανές header): δείχνουμε το λευκό logo και κρύβουμε το μπλε */
    header.header:not(.mobile-scrolled):not(.menu-is-open) img[src*="logo-Georgiadis-ELW.png"],
    header.header:not(.mobile-scrolled):not(.menu-is-open) .logo-Georgiadis-ELW {
        display: inline-block !important;
    }

    header.header:not(.mobile-scrolled):not(.menu-is-open) img[src*="logo-Georgiadis-EL.png"],
    header.header:not(.mobile-scrolled):not(.menu-is-open) .logo-Georgiadis-EL {
        display: none !important;
    }

    /*
     * Διορθώσεις για mobile (max-width: 991px)
     * Εξασφαλίζουμε τη σωστή εναλλαγή λογοτύπων και χρωμάτων μενού
     * μεταξύ αρχικής κατάστασης (διαφανές header, λευκά στοιχεία)
     * και κατάστασης scroll (λευκό header, μπλε λογότυπο, σκούρα στοιχεία).
     */

    /* 1. Αρχική κατάσταση (όταν δεν έχει γίνει scroll και το μενού είναι κλειστό) */
    header.header:not(.mobile-scrolled):not(.menu-is-open) .header .logo .logo-img-main { /* Λευκό λογότυπο */
        display: inline-block !important;
    }
    header.header:not(.mobile-scrolled):not(.menu-is-open) .header .logo .logo-img-active { /* Μπλε λογότυπο */
        display: none !important;
    }
    header.header:not(.mobile-scrolled):not(.menu-is-open) .header .nav-item-child { /* Γράμματα μενού */
        color: #ffffff !important;
    }

    /* 2. Κατάσταση scroll (όταν έχει γίνει scroll ή το μενού είναι ανοιχτό) */
    header.header.mobile-scrolled .header .logo .logo-img-main,
    header.header.header-fixed .header .logo .logo-img-main,
    header.header.scrolled .header .logo .logo-img-main,
    header.header.menu-is-open .header .logo .logo-img-main { /* Λευκό λογότυπο */
        display: none !important;
    }
    header.header.mobile-scrolled .header .logo .logo-img-active,
    header.header.header-fixed .header .logo .logo-img-active,
    header.header.scrolled .header .logo .logo-img-active,
    header.header.menu-is-open .header .logo .logo-img-active { /* Μπλε λογότυπο */
        display: inline-block !important;
    }
    header.header.mobile-scrolled .header .nav-item-child,
    header.header.header-fixed .header .nav-item-child,
    header.header.scrolled .header .nav-item-child,
    header.header.menu-is-open .header .nav-item-child { /* Γράμματα μενού */
        color: #2c3e50 !important;
    }

    /* Εξαίρεση για το τελευταίο στοιχείο του μενού (π.χ. κουμπί επικοινωνίας) */
    header.header.mobile-scrolled #mobile-nav-collapse .navbar-nav > li:last-child > a,
    header.header.header-fixed #mobile-nav-collapse .navbar-nav > li:last-child > a,
    header.header.scrolled #mobile-nav-collapse .navbar-nav > li:last-child > a,
    header.header.menu-is-open #mobile-nav-collapse .navbar-nav > li:last-child > a {
        background-color: #014d8b !important;
        color: #ffffff !important;
    }
    header.header.mobile-scrolled #mobile-nav-collapse .navbar-nav > li:last-child > a:hover,
    header.header.header-fixed #mobile-nav-collapse .navbar-nav > li:last-child > a:hover,
    header.header.scrolled #mobile-nav-collapse .navbar-nav > li:last-child > a:hover,
    header.header.menu-is-open #mobile-nav-collapse .navbar-nav > li:last-child > a:hover {
        background-color: #013b6c !important;
        color: #ffffff !important;
    }
}

/* Νέοι κανόνες για desktop (>= 992px) */
@media (min-width: 992px) {
    /* Εξασφαλίζουμε ότι το header έχει πάντα λευκό φόντο, μπλε logo και σκούρα γράμματα
       όταν έχει γίνει scroll (σε οποιαδήποτε σελίδα) ή όταν δεν είναι η αρχική σελίδα
       και δεν έχει γίνει scroll. */
    /* Αυτό το μπλοκ είναι πλέον κενό, καθώς το layout.css χειρίζεται σωστά το desktop. */
}

@media (max-width: 991px) {
    /* Εξ αρχής λευκό χρώμα για το custom toggle σύμβολο στην κορυφή */
    header.header:not(.mobile-scrolled):not(.menu-is-open) #custom-mobile-toggle {
        color: #ffffff !important;
    }

    /* Όταν γίνεται scroll ή ανοίγει το μενού, γίνεται σκούρο */
    header.header.mobile-scrolled #custom-mobile-toggle,
    header.header.menu-is-open #custom-mobile-toggle {
        color: #014d8b !important;
    }
}

@media (max-width: 991px) {
    header.header,
    .header .navbar,
    .header .container {
        border-bottom: none !important;
        box-shadow: none !important;
    }

    /* Αν η γραμμή δημιουργείται από pseudo-element του template */
    header.header::after,
    header.header::before,
    .header .navbar::after,
    .header .navbar::before {
        display: none !important;
    }
    header.header,.header  {
        border-bottom: 0.5px solid rgba(255, 255, 255, 0.3) !important;
        transform-origin: bottom;
        box-shadow: none !important;
    }


    .content-lg .row.latest-products-row {
        display: flex !important;
        flex-wrap: wrap !important;
        flex-direction: row !important;
    }

    .content-lg .row.latest-products-row > .col-sm-3 {
        width: 50% !important;
        flex: 0 0 50% !important;
        max-width: 50% !important;
        float: left !important;
        clear: none !important;
        margin-bottom: 30px !important;
    }


    .row.products-row {
        margin-left: 0 !important;
        width: 550px !important;
    }

    .content-lg .row.products-row {
        width: 730px !important;
        display: flex !important;
        flex-wrap: wrap !important;
        flex-direction: row !important;
    }

    .content-lg .row.products-row > .col-sm-3 {
        width: 50% !important;
        flex: 0 0 50% !important;
        min-width: 50% !important;
        float: left !important;
        clear: none !important;
        margin-bottom: 30px !important;
    }

    /*καθορισμός μεγέθους φίλτρου για κινητά*/
    #mobile-filters-box {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
        float: none !important;
    }

    .filter .sidebar-category h4 {
        font-size: 1.5rem !important;
    }

    .filter h3 {
        font-size: 1.7rem !important;
    }

    .filter li a {
        font-size: 1.5rem !important;
    }


    /*product filter menu mob*/
    /* Εξ αρχής κλειστό στα κινητά */
    #mobile-filters-box {
        display: none;
        margin-bottom: 25px;
        background: #fdfdfd;
        padding: 15px;
        border: 1px solid #e1e1e1;
    }

    /* Περιστροφή βέλους όταν ανοίγει */
    .btn-filter-toggle .fa-chevron-down {
        transition: transform 0.3s ease;
    }
    .btn-filter-toggle.active-filter .fa-chevron-down {
        transform: rotate(180deg);
    }

    .mobile-filter-btn-wrap {
        display: none;
    }
    #mobile-filters-box {
        display: block;
    }

    .serviceRow .col-sm-6{
        width: 100% !important;

    }

    .service h3{
        font-size: 2rem;
    }



}

/* Στα κινητά και tablets (έως 991px) */
@media (max-width: 991px) {
    .mobile-filter-btn-wrap {
        display: block !important;
    }
    #mobile-filters-box {
        display: none !important; /* Ξεκινάει κλειστό στα κινητά */
        margin-bottom: 25px;
        background: #fdfdfd;
        padding: 15px;
        border: 1px solid #e1e1e1;
        width: 100% !important;
    min-width: 350px;
    }
    /* Δίνουμε αέρα στα αριστερά και δεξιά για να μην κολλάει */
    .content-lg,
    .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
        padding-top: 0 !important;
    }
}

/* Βελτιστοποίηση εμφάνισης: 1 Προϊόν ανά γραμμή, αλλά μεγαλύτερο (Mobile First) */
@media (max-width: 767px) {
    /* Σιγουρευόμαστε ότι το container δεν έχει περιττά padding */
    .col-sm-9 {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    /* Κάνουμε το κάθε προϊόν να πιάνει σχεδόν όλο το πλάτος */
    .col-sm-9 .row > div[class*="col-"] {
        width: 100% !important;
        margin-bottom: 35px !important; /* Μεγαλύτερο κενό ανάμεσα στα προϊόντα */
        float: none !important;
        padding: 0 15px !important; /* Ίσιο περιθώριο αριστερά-δεξιά */
    }

    /* --- ΜΕΓΕΘΥΝΣΗ ΣΤΟΙΧΕΙΩΝ --- */

    /* 1. Μεγαλύτερη εικόνα */
    .col-sm-9 .row > div[class*="col-"] .img-responsive {
        max-width: 100% !important; /* Η εικόνα θα πιάνει το 85% του πλάτους της οθόνης */
        height: auto !important;
        margin: 0 0 0 0 !important; /* Κεντράρισμα εικόνας */
        display: block;
    }

    .pagination {
        margin-top: 5%;
        margin-right: 0;
        display: flex;
        flex-wrap: wrap; /* Επιτρέπει στα κουμπιά να πέφτουν σε επόμενη γραμμή αν δεν χωράνε */
        justify-content: center;
        padding-left: 0;
        list-style: none;
        max-width: 100%;
        overflow-x: hidden;
    }



    /* 2. Τεράστιος τίτλος προϊόντος */
    .col-sm-9 .row > div[class*="col-"] h3 a.titleProducts {
        font-size: 22px !important; /* Πολύ μεγάλο font για ευκολία στο διάβασμα */
        line-height: 1.3 !important;
        font-weight: bold !important;
        margin-bottom: 10px !important;
    }

    /* 3. Περιγραφή (αν υπάρχει) */
    .col-sm-9 .row > div[class*="col-"] .product-description {
        font-size: 1.5rem !important;
        padding-right: 5%;
        line-height: 1.6 !important;
        margin-bottom: 15px !important;
        color: #555 !important;
    }

    /* 4. Κουμπί "ΠΕΡΙΣΣΟΤΕΡΑ" (full-width και μεγάλο) */
    .col-sm-9 .row > div[class*="col-"] .link {
        display: block !important;
        width: 100% !important;
        max-width: 180px;
        text-align: center !important;
        padding: 10px 15px !important;
        font-size: 1.2rem !important;
        background-color: #014d8b !important; /* Σταθερό χρώμα */
        color: #fff !important;
        text-decoration: none !important;
        border-radius: 4px !important;
    }

    /* Απόκρυψη ετικετών (new/sale) για να μην κρύβουν την εικόνα */
    .col-sm-9 .row > div[class*="col-"] .product-label {
        display: none !important;
    }

    /* Αρχική κατάσταση container: Κρυφό σε desktop, ορατό σε κινητά/tablets */
    #filterBtnContainer {
        display: none;
        margin-bottom: 15px;
        width: 350px;
    }

    /* Στυλ για το κουμπί φίλτρων κινητών */
    #mobileFilterToggleBtn {
        width: 100% !important;
        max-width: none !important; /* Ακυρώνει το 200px που το περιορίζει */
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        border-radius: 0 !important;
        padding: 14px 30px !important; /* Σταθερό padding σε pixels αντί για ποσοστά */
        font-weight: bold;
        background-color: #014d8b !important;
        border-color: #014d8b !important;
        box-sizing: border-box !important;
    }

    /* Εικονίδια και ομαλή κίνηση βέλους */
    #mobileFilterToggleBtn span i {
        margin-right: 8px;
    }

    #filter-arrow-icon {
        transition: transform 0.3s ease;
    }

    .swiper-clients-img {
        display: block;
        width: 100px;
        height: auto;
        margin: 0 auto;
        opacity: 1;
        cursor: pointer;
    }

    .header .menu-container {
    padding-left: 15px;
    padding-right: 15px;
    margin-left: 0;
    margin-right: 10% !important;
     /* 1. margin-top: 15%; */
  }

/* 1. Εξασφαλίζουμε ότι ο header δεν ξεπερνάει το πλάτος της οθόνης */
    header.mobile-scrolled {
        width: 100% !important;
        max-width: 100vw !important;
        left: 0 !important;
        right: 0 !important;
        box-sizing: border-box !important;
    }

    /* 2. Διορθώνουμε τα περιθώρια του container για να μη σπρώχνουν το menu δεξιά */
    header.mobile-scrolled .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }


    /* 4. Σιγουρεύουμε τη δεξιά στοίχιση του κουμπιού */
    #custom-mobile-toggle {
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        z-index: 9999;
    }



    /* 1. Σφίγγουμε το κεντρικό wrapper των προϊόντων */
    .products-container,
    .product-list,
    .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 2. Περιορίζουμε τις κάρτες των προϊόντων να μην υπερβαίνουν την οθόνη */
    .product-card,
    .product-item,
    .col-xs-12,
    .col-sm-6 {
        max-width: 100% !important;
        width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        box-sizing: border-box !important;
    }

    /* 3. Εξασφαλίζουμε ότι οι εικόνες των προϊόντων δεν ξεχειλίζουν */
    .product-card img,
    .product-item img {
        max-width: 100% !important;
        height: auto !important;
        display: block;
        margin: 0 auto;
    }

    .footer .footer-seperator .row {
        display: flex;
        flex-wrap: wrap;
    }

    .footer .footer-seperator .row > .col-xs-6 {
        width: 50% !important;
        float: left !important;
        margin-top: 30px;
    }


    .footer .footer-list-item {
        color: #cbd3e1;
        margin-bottom: 5px;
    }


    .services h2{
        font-size: 3.5rem !important;
        margin-top: 10%;
        text-align: center;
    }


    #contactForm{
        font-size: 1rem !important;
        margin-top: 3% !important;
        text-align: left !important;
    }

    .search-box{
        width: 350px !important;
        margin-top: 15%;
    }

    .img-responsive-gpumps{
        height: 200px !important;
        width: 150px !important;
        min-width: 350px !important;
    }
}




/* Cookie Banner Style */
.cookie-banner {
    position: fixed;
    bottom: 20px;
    right: 20px;
    max-width: 380px;
    background-color: #003f72; /* Το μπλε φόντο */
    color: #ffffff;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
    z-index: 99999;
    font-family: inherit;
}

.cookie-title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cookie-text {
    font-size: 13px;
    line-height: 1.5;
    color: #e2e8f0;
    margin-bottom: 16px;
}

.cookie-link {
    color: #93c5fd;
    text-decoration: underline;
}

.cookie-buttons {
    display: flex;
    gap: 12px;
}

.cookie-btn {
    flex: 1;
    padding: 8px 16px;
    font-weight: 700;
    font-size: 13px;
    border-radius: 6px;
    cursor: pointer;
    background: #ffffff;
    transition: all 0.2s ease;
}

.btn-accept {
    color: #1e293b;
    border: 2px solid #22c55e; /* Πράσινο περίγραμμα όπως το screenshot */
}

.btn-reject {
    color: #1e293b;
    border: 2px solid #ef4444; /* Κόκκινο περίγραμμα όπως το screenshot */
}

.cookie-btn:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

@media (max-width: 480px) {
    .cookie-banner {
        left: 10px;
        right: 10px;
        bottom: 10px;
        max-width: none;
    }
}


@media (max-width: 495px) {
  .service {
    padding: 5% !important;
    margin: 2% !important;
  }
}