/* B2B Portal · Νέο πάνω μέρος (header + μενού), στην παλέτα του νέου footer.
   Μπαίνει ΜΕΤΑ από όλα τα υπάρχοντα CSS. Νέες κλάσεις: gth-* */
:root {
    --gth-lime: #7fc701;
    --gth-green: #1f8714;
    --gth-olive: #4b5f46;
    --gth-deep: #3c4c38;
    --gth-deeper: #33412f;
    --gth-ink: #2b3528;
    --gth-muted: #6b7566;
    --gth-line: #e6ebe2;
    --gth-soft: #f6f8f3;
    --gth-mint: #eef6e2;
}

/* ---------- εικονίδια (από τον φάκελο images, παίρνουν χρώμα από το CSS) ---------- */
.gth-ic {
    display: inline-block;
    flex: 0 0 auto;
    width: 15px;
    height: 15px;
    background: currentColor;
    -webkit-mask: no-repeat center/contain;
    mask: no-repeat center/contain
}

.gth-ic-truck {
    -webkit-mask-image: url(/images/imagesRS/truck.svg);
    mask-image: url(/images/imagesRS/truck.svg)
}

.gth-ic-pin {
    -webkit-mask-image: url(/images/imagesRS/map-pin.svg);
    mask-image: url(/images/imagesRS/map-pin.svg)
}

.gth-ic-card {
    -webkit-mask-image: url(/images/imagesRS/card.svg);
    mask-image: url(/images/imagesRS/card.svg)
}

.gth-ic-calendar {
    -webkit-mask-image: url(/images/imagesRS/calendar.svg);
    mask-image: url(/images/imagesRS/calendar.svg)
}

.gth-ic-phone {
    -webkit-mask-image: url(/images/imagesRS/phone.svg);
    mask-image: url(/images/imagesRS/phone.svg)
}

/* ---------- 1. Πάνω μπάρα με τα πλεονεκτήματα ---------- */
#top_line_container.gth-top {
    background: var(--gth-deeper) !important;
    color: #dfe7d8;
    font: 12.5px/1 Arimo, Arial, sans-serif
}

.gth-top .gth-top-in {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 38px
}

.gth-perks {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none
}

.gth-perks li {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    padding: 0 16px;
    letter-spacing: .01em
}

.gth-perks li:first-child {
    padding-left: 0
}

.gth-perks li+li {
    border-left: 1px solid rgba(255, 255, 255, .14)
}

.gth-perks .gth-ic {
    color: var(--gth-lime)
}

.gth-perks b {
    color: #fff;
    font-weight: 700
}

.gth-top-links {
    display: flex;
    align-items: center;
    gap: 22px;
    white-space: nowrap
}

.gth-top-links a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #c5cfbf !important;
    text-decoration: none;
    transition: color .2s
}

.gth-top-links a:hover {
    color: var(--gth-lime) !important
}

.gth-top-links .gth-ic {
    width: 13px;
    height: 13px;
    color: var(--gth-lime)
}

/* ---------- 2. Λογότυπο, αναζήτηση, λογαριασμός, καλάθι ---------- */
/* χωρίς position/z-index: κρατά το z-index:9989 του /css/aboutnet/header.css, ώστε mega menu, αποτελέσματα
   αναζήτησης και sticky header του κινητού να μένουν πάνω από τα dropdown της σελίδας (z-index 99 / 500) */
header {
    box-shadow: 0 10px 24px -20px rgba(51, 65, 47, .45)
}

#center_line_container {
    background: #fff
}

#center_line_container .inner_center_line {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
    gap: 28px
}

#logo_cont img {
    height: 64px;
    width: auto;
    display: block
}

#searching {
    flex: 1 1 auto;
    max-width: 540px;
    margin-top: 0 !important
}

#searching #searchxxx {
    display: flex;
    align-items: center;
    background: var(--gth-soft);
    border: 1px solid var(--gth-line);
    border-radius: 999px;
    padding: 4px 4px 4px 20px;
    transition: border-color .2s, box-shadow .2s, background .2s
}

#searching #searchxxx:hover {
    border-color: #cfdcc0
}

#searching #searchxxx:focus-within {
    background: #fff;
    border-color: var(--gth-lime);
    box-shadow: 0 0 0 4px rgba(127, 199, 1, .14)
}

#searching #searchbox {
    flex: 1;
    min-width: 0;
    border: 0 !important;
    background: transparent !important
}

#searching #searchbox input {
    width: 100%;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font: 15px Arimo, Arial, sans-serif;
    color: var(--gth-ink);
    padding: 9px 0;
    height: auto
}

#searching #searchbox input::placeholder {
    color: #8a9385
}

#searching #searchright {
    display: flex;
    align-items: center;
    gap: 4px;
    padding-left: 6px !important
}

#searching #acloser {
    height: 28px !important;
    width: 28px;
    padding: 7px;
    box-sizing: border-box;
    cursor: pointer;
    opacity: .45;
    content: url(/images/imagesRS/close.svg)
}

#searching #acloser:hover {
    opacity: 1
}

#searching #searchbut {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--gth-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s
}

#searching #searchbut:hover {
    background: var(--gth-green)
}

#searching #searchbut img {
    height: 18px !important;
    width: 18px;
    content: url(/images/imagesRS/search.svg);
    filter: brightness(0) invert(1)
}

#right_container_icons {
    display: flex !important;
    align-items: center;
    gap: 12px;
    margin-right: 0 !important
}

#right_container_icons a {
    text-decoration: none
}

#right_container_icons img[src*="user.jpg"] {
    width: 40px !important;
    height: 40px;
    padding: 10px;
    box-sizing: border-box;
    border-radius: 50%;
    background: var(--gth-soft);
    border: 1px solid var(--gth-line);
    content: url(/images/imagesRS/user.svg)
}

#right_container_icons .gth-greet {
    display: none !important
}

/* «Καλώς ήρθες»: πιο λιτό χωρίς αυτό· το όνομα του πελάτη μένει */
#right_container_icons .head_buttonx {
    background: #fff !important;
    color: var(--gth-deep) !important;
    border: 1.5px solid var(--gth-deep) !important;
    border-radius: 999px !important;
    padding: 8px 18px !important;
    font-weight: 700;
    font-size: 14px;
    line-height: 1;
    transition: all .2s
}

#right_container_icons a:hover .head_buttonx {
    background: var(--gth-deep) !important;
    color: #fff !important
}

/* καλάθι desktop: το βγάζει το center_line.php δίπλα στην «Είσοδο» (d-none d-lg-inline-flex),
   οπότε η μπάρα με το ΜΕΝΟΥ, που στο desktop είχε μόνο το καλάθι, κρύβεται από την αρχή χωρίς JS */
#right_container_icons a.gth-cart {
    align-items: center;
    gap: 8px;
    background: var(--gth-lime);
    border-radius: 999px;
    padding: 5px 5px 5px 14px;
    text-decoration: none;
    box-shadow: 0 6px 14px -8px rgba(31, 135, 20, .6);
    transition: background .2s
}

#right_container_icons a.gth-cart:hover {
    background: var(--gth-green)
}

#right_container_icons a.gth-cart::before {
    content: "";
    width: 19px;
    height: 19px;
    background: #fff;
    -webkit-mask: url(/images/imagesRS/cart.svg) no-repeat center/contain;
    mask: url(/images/imagesRS/cart.svg) no-repeat center/contain
}

#right_container_icons a.gth-cart #gth_cart_total {
    background: #fff;
    color: var(--gth-deep);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
    white-space: nowrap
}

@media (min-width:992px) {
    #bottom_line_container {
        display: none
    }
}

/* ---------- 3. Μενού κατηγοριών ---------- */
header>.container.d-none.d-lg-block {
    border-top: 1px solid var(--gth-line)
}

/* Κάθε τίτλος πιάνει όλο το ύψος της γραμμής και ακουμπά το mega menu από κάτω. Το header.js κλείνει το μενού
   μόλις το ποντίκι βγει από τον τίτλο, οπότε κενό ανάμεσα σε τίτλο και κουτί το έκλεινε. Το κενό των 6px είναι
   πλέον μέσα στον τίτλο (10px αντί για 4px), όχι στο .col-12. */
header>.container.d-none.d-lg-block .col-12 {
    align-items: stretch;
    padding-top: 0;
    padding-bottom: 0
}

header .per_menu_d {
    flex: 1 1 auto;
    justify-content: center;
    padding: 10px 1px !important;
    background: transparent !important
}

header .per_menu_d a {
    display: block;
    padding: 8px 6px;
    border-radius: 12px;
    color: var(--gth-ink) !important;
    font-weight: 600 !important;
    font-size: 13px;
    line-height: 1.25;
    text-decoration: none;
    text-wrap: balance;
    transition: background .2s, color .2s
}

header .per_menu_d a:hover,
header .per_menu_d:hover a {
    padding-bottom: 8px !important;
    border-bottom: 0 !important;
    background: var(--gth-mint);
    color: var(--gth-green) !important
}

#d_479 a {
    background: var(--gth-mint)
}

#d_479 a span {
    color: var(--gth-green) !important
}

/* mega menu */
#menu_d_container .second_menu_d {
    border-top: 0 !important;
    border-radius: 0 0 18px 18px;
    box-shadow: 0 24px 48px -18px rgba(51, 65, 47, .35) !important;
    padding: 26px 34px !important
}

@media (min-width:1200px) {
    #menu_d_container .second_menu_d_left {
        height: auto !important;
        max-height: 70vh;
        padding-top: 6px;
        padding-bottom: 6px
    }
}

#menu_d_container .menu_totalx {
    margin-bottom: 16px
}

@media (min-width:1200px) {

    /* οι ομάδες υποκατηγοριών μοιράζονται σε στήλες αντί να στοιβάζονται σε μία */
    #menu_d_container .second_menu_d_left>.row {
        display: block;
        columns: 5 190px;
        column-gap: 36px;
        margin: 0
    }

    #menu_d_container .second_menu_d_left .columnx {
        display: contents
    }

    #menu_d_container .menu_totalx {
        break-inside: avoid;
        display: inline-block;
        width: 100%
    }
}

#menu_d_container .menu_titlex {
    font-size: 15px;
    margin-bottom: 6px
}

#menu_d_container .menu_titlex a {
    color: var(--gth-deep) !important;
    font-weight: 700
}

#menu_d_container .subcatx {
    font-size: 14px;
    line-height: 1.85
}

#menu_d_container .subcatx a {
    color: #4d5649
}

#menu_d_container .subcatx a:hover {
    color: var(--gth-green)
}

/* ---------- 4. Μπάρα κινητού (ΜΕΝΟΥ + καλάθι) ---------- */
#bottom_line_container {
    background: var(--gth-deep) !important
}

#bottom_line_container .menu1-bgxx {
    padding: 6px 0 !important
}

#blue_header_bar_right {
    justify-content: flex-end;
    align-items: center;
    padding-right: 12px
}

#blue_header_bar_right>.col-auto {
    display: none
}

#blue_header_bar_right>a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--gth-lime);
    border-radius: 999px;
    padding: 4px 4px 4px 14px;
    text-decoration: none
}

#blue_header_bar_right>a::before {
    content: "";
    width: 19px;
    height: 19px;
    background: #fff;
    -webkit-mask: url(/images/imagesRS/cart.svg) no-repeat center/contain;
    mask: url(/images/imagesRS/cart.svg) no-repeat center/contain
}

#blue_header_bar_right>a>div {
    font-size: 14px !important;
    font-weight: 700;
    align-items: center
}

#blue_header_bar_right #backetman2 {
    background: #fff;
    color: var(--gth-deep);
    border-radius: 999px;
    padding: 5px 12px;
    margin: 0 !important
}

#menu1 {
    color: #fff;
    font-weight: 700;
    letter-spacing: .06em;
    font-size: 15px;
    cursor: pointer
}

#menu1 #menu_burger_icon {
    display: inline-block;
    margin-right: 6px;
    color: var(--gth-lime)
}

/* μενού κατηγοριών στο κινητό */
#topper .container.hide-xl {
    background: var(--gth-deep);
    border-bottom: 3px solid var(--gth-lime) !important;
    max-width: none
}

#topper #close-menu div {
    color: #fff !important
}

#topper #close-menu .f-22 div {
    font-weight: 700;
    letter-spacing: .06em;
    font-size: 18px
}

/* ---------- οθόνες ---------- */
@media (max-width:1399px) {
    .gth-top-links a:not([href^="tel"]) {
        display: none
    }
}

@media (max-width:1199px) {
    header>.container.d-none.d-lg-block {
        max-width: 100%
    }

    header .per_menu_d a {
        font-size: 12px;
        padding: 7px 6px
    }

    #center_line_container .inner_center_line {
        gap: 18px
    }
}

@media (max-width:991px) {

    .gth-perks li:nth-child(4),
    .gth-top-links {
        display: none
    }

    .gth-top .gth-top-in {
        justify-content: center
    }

    #center_line_container .inner_center_line {
        flex-wrap: wrap;
        gap: 10px 16px;
        padding-top: 10px !important;
        padding-bottom: 12px !important
    }

    #logo_cont img {
        height: 50px
    }

    #searching {
        order: 3;
        flex-basis: 100%;
        max-width: none;
        margin-left: 0 !important
    }
}

@media (max-width:767px) {
    .gth-top .gth-top-in {
        min-height: 34px
    }

    .gth-perks {
        justify-content: center;
        width: 100%
    }

    .gth-perks li {
        display: none;
        padding: 0;
        border: 0 !important
    }

    .gth-perks li.is-on {
        display: flex;
        animation: gthIn .45s ease
    }

    #logo_cont img {
        height: 42px
    }
}

@keyframes gthIn {
    from {
        opacity: 0;
        transform: translateY(4px)
    }

    to {
        opacity: 1;
        transform: none
    }
}

@media (prefers-reduced-motion:reduce) {
    .gth-perks li.is-on {
        animation: none
    }
}

@media print {

    #bottom_line_container,
    #top_line_container {
        display: none
    }
}