/*
 * custom.css — Erifyli theme overrides
 * Version: 4.2
 * Last updated: 2026-09-29
 * —————————————————————————————————————————————————————————
 * ΜΗΝ τροποποιήσεις το Template/assets/css/style.css
 * Όλα τα custom overrides πάνε ΕΔΩ.
 * Κάθε φορά που αλλάζεις αυτό το αρχείο, αύξησε το version
 * και ενημέρωσε και το functions.php (zisi-custom).
 * ========================================================= */

/* Navigation dropdown items
============================================================ */

.dropdown ul li a {
    text-transform: none;
}

/* Global text-transform overrides (style.css έχει capitalize σε αυτά)
============================================================ */

h4, h5, h6 {
    text-transform: none;
}

.share-btn a,
.footer-widget ul li,
.footer-widget ul li a,
.medium-post .comm-icon > a,
footer .left p a {
    text-transform: none;
}

/* single-service.php
============================================================ */

.blog-details .medium-post .blog-text {
    padding-top: 0;
}

.service-area .single-service .media-body h5 a {
    font-size: 15px;
    font-weight: 400;
    color: #585858;
    text-transform: none;
}

/* FAQ Section - justhome.php
   Accordion 2 columns, CPT "faq", vanilla JS toggle (.faq-item.open)
============================================================ */

.faq-section {
    background-color: #fdf1ec;
    padding: 90px 0 80px;
}
.faq-section .faq-eyebrow {
    display: block;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 4px;
    text-transform: none;
    color: #eaa68b;
    margin-bottom: 14px;
}
.faq-section .faq-heading {
    font-size: 30px;
    font-weight: 400;
    color:#585858;
    line-height: 1.15;
    margin: 0;
    text-transform: none;
    letter-spacing: -0.5px;
}
.faq-section .faq-more-link {
    font-size: 15px;
    font-weight: 400;
    color: #585858;
    text-decoration: none;
    text-transform: none;
    letter-spacing: normal;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color 0.2s ease;
}
.faq-section .faq-more-link:hover { color: #b87a65; }
.faq-section .faq-top-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 48px;
}
.faq-section .faq-grid {
    display: flex;
    gap: 0 48px;
}
.faq-section .faq-col {
    flex: 1;
    min-width: 0;
}
.faq-section .faq-item {
    border-bottom: 1px solid #ddd;
}
.faq-section .faq-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 0;
    cursor: pointer;
    font-size: 16px;
    font-weight: 400;
    color: #656565;
    line-height: 1.4;
    user-select: none;
    gap: 16px;
    text-transform: none;
}
.faq-section .faq-question:hover { color: #b87a65; }
.faq-section .faq-chevron {
    flex-shrink: 0;
    font-size: 16px;
    color: #363f4b;
    transition: transform 0.3s ease;
}
.faq-section .faq-item.open .faq-chevron {
    transform: rotate(180deg);
}
.faq-section .faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease, padding-bottom 0.3s ease;
    padding: 0;
    font-size: 15px;
    font-weight: 300;
    line-height: 1.7;
    color: #414b5a;
}
.faq-section .faq-item.open .faq-answer {
    max-height: 2000px;
    padding-bottom: 15px;
}
.faq-section .faq-answer a {
    color: #363f4b;
    text-decoration: none;
    font-weight: 400;
    text-transform: none;
}
.faq-section .faq-answer a:hover { color: #b87a65; }
@media (max-width: 767px) {
    .faq-section .faq-heading { font-size: 32px; letter-spacing: 0; }
    .faq-section .faq-grid { flex-direction: column; gap: 0; }
    .faq-section .faq-top-row { flex-direction: column; align-items: flex-start; gap: 20px; }
}

/* archive-faq.php — 1 στήλη, light-bg background (#f6f6f6)
============================================================ */

.faq-section.faq-archive {
    background-color: #f6f6f6;
}


.hwinf li > span 
{
    color: #818181;
    float: left;
    font-size: 15px;
    line-height: 28px;
    width: 100%;
}

.contact-area .info-text li span 
{
    color: #6f6f6f;
    font-weight: 400;
}

.wpcf7-textarea
{
    height: 150px !important;
}

.slider-wh
{   
    color: #fff !important;
}

#sclul
{
    list-style-type: none;
}

#sclul li
{
    float: left;
    padding-right: 15px;
}

#sclul li a
{
    display: block;
}
/* Mobile: full-width container με gutter 30px
   Το responsive.css κλειδώνει το .container σε 300px (<767px) και 480px
   (480-767px), αφήνοντας τεράστια κενά στα πλάγια. Εδώ γίνεται ρευστό.

   Το gutter είναι 30px ώστε να ταιριάζει με το /viografiko/, όπου το
   περιεχόμενο της σελίδας περιέχει δικό του container > row > col μέσα σε
   αυτό του page.php. Κάθε ένθετο container θα πρόσθετε άλλα 30px, γι' αυτό
   μηδενίζεται το padding τους: το -15px του .row ακυρώνει το +15px της
   στήλης, οπότε το gutter μένει 30px σε οποιοδήποτε βάθος ένθεσης. */
@media (max-width: 767px) {
    .container {
        width: auto;
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px;
    }
    .container .container {
        padding-left: 0;
        padding-right: 0;
    }
}

/* Logo: μεταφέρθηκε από inline style (max-width:75%) του header.php,
   ώστε να μπορεί να αλλάζει ανά breakpoint. */
.header-style-1 .logo img {
    max-width: 75%;
}

/* Desktop: το logo να μη ξεπερνά το ύψος της μπάρας.
   Το max-width:75% δίνει εικόνα 95px ύψος, ενώ η sticky μπάρα σχεδιάζεται
   στα 70px (.is-sticky .logo { line-height: 70px }). Χωρίς όριο ύψους, το
   logo είτε ξεχειλίζει κάτω από τη λευκή μπάρα είτε την αναγκάζει να
   φουσκώσει στα 95px. Το max-height το κρατά μέσα και στις δύο καταστάσεις
   — και δίνει και ομαλή σμίκρυνση όταν το header κολλάει, αφού το theme
   έχει ήδη transition στο .logo. */
@media (min-width: 768px) {
    /* Λευκή μπάρα και στην κορυφή, όχι μόνο στο sticky. Το theme αφήνει το
       header διάφανο πάνω από τον slider, αλλά το logo_w2.jpg είναι JPG με
       δικό του λευκό φόντο, οπότε φαινόταν σαν λευκό ορθογώνιο να περισσεύει
       πάνω στην εικόνα. Με πραγματική μπάρα το logo κάθεται μέσα της. */
    .header-style-1 .header-top {
        background: #ffffff;
        box-shadow: 0 1px 4px rgba(2, 3, 3, 0.1);
    }
    .header-style-1 .header-top .logo img {
        max-height: 90px;
        width: auto;
    }
    .header-style-1 .header-top.is-sticky .logo img {
        max-height: 60px;
        width: auto;
    }
}

/* Mobile header: άσπρο background, μικρότερο logo, burger δεξιά */
@media (max-width: 767px) {
    .header-style-1 .header-top {
        background: #ffffff;
        padding-top: 10px;
        padding-bottom: 10px;
        box-shadow: 0 1px 4px rgba(2, 3, 3, 0.1);
    }
    .header-style-1 .header-top .logo img {
        max-width: 200px;
    }
    /* Το burger είναι absolute μέσα στη στήλη του μενού, η οποία στο mobile
       έχει ύψος 1px και κάθεται κάτω από το logo. Γι' αυτό αγκυρώνεται στο
       bottom της: έτσι μένει μέσα στη λευκή μπάρα, χωρίς να μετακινηθεί η
       στήλη (το dropdown μενού τοποθετείται κι αυτό ως προς αυτήν). */
    .header-style-1 .header-top .navbar-toggle {
        position: absolute;
        right: 15px;
        top: auto;
        bottom: 0;
        margin: 0;
    }
}

/* Services (justhome): παράγραφοι στο ίδιο γκρι με το .section-title p.
   Το χρώμα των τίτλων ορίζεται παραπάνω, στο .service-area .single-service
   .media-body h5 a (#585858, ίδιο με το .section-title h2). */
.single-service p {
    color: #838383;
    font-size: 16px;
    /* Το theme έχει σταθερό line-height: 22px, που στα 16px στριμώχνει
       τις γραμμές (1.375). Αναλογικό line-height κρατά την ίδια άνεση
       που είχε το κείμενο στα 14px. */
    line-height: 1.6;
}

/* Buttons: πιο έντονα. Το theme είχε #bed7f0 κανονικά και #709cc8 στο hover —
   πλέον το #709cc8 γίνεται η κανονική κατάσταση και το hover σκουραίνει λίγο
   ακόμα, ώστε να παραμένει αισθητή η απόκριση.
   Χρειάζεται !important: το style.css δηλώνει τα .btn χρώματα με !important,
   οπότε κανονικός κανόνας αγνοείται ανεξάρτητα από τη σειρά φόρτωσης. */
.btn {
    background: #709cc8 !important;
    border-color: #709cc8 !important;
    color: #ffffff !important;
}
.btn:hover,
.btn:focus,
.btn.focus {
    background: #5f85aa !important;
    border-color: #5f85aa !important;
    color: #ffffff !important;
}

/* Κουμπί αποστολής (Contact Form 7): κεντράρισμα λεκτικού.
   Ο κανόνας «.custom-input input, .custom-input textarea, .custom-select select»
   του style.css δίνει padding: 0 0 0 20px — σωστό για πεδία κειμένου, λάθος για
   το submit, που είναι κι αυτό input μέσα στο .custom-input. Με text-align:center
   και padding μόνο αριστερά, το λεκτικό έπεφτε 10px δεξιά του κέντρου.
   Η ειδικότητα .custom-input input (0-1-1) νικούσε το .btn (0-1-0) του theme. */
.custom-input input.wpcf7-submit {
    padding-left: 0;
    padding-right: 0;
}
