/* ==========================================================
   GET4HOME — Ο ΛΟΓΑΡΙΑΣΜΟΣ ΜΟΥ (My Account)
========================================================== */

/* Раскладка через float — сознательно не полагаемся на то, что
   получится подобрать точный селектор родителя (сколько бы мы ни
   пытались через grid/:has(), это не срабатывало, видимо из-за
   лишней обёртки в разметке WooCommerce). float работает прямо на
   самих элементах меню/контента и не зависит от родителя вообще. */

/* Раскладка (сетка меню/контента) уже задаётся в page.css —
   там есть правило .woocommerce-account .g4h-page-content{display:grid...}.
   Здесь только визуальное оформление, чтобы не спорить с ним за
   display/float — именно такой спор и был причиной поломки раньше. */

.woocommerce-MyAccount-navigation,
.woocommerce-MyAccount-content{
    font-family:Inter, sans-serif;
}

/* ---------- Меню слева ---------- */

.woocommerce-MyAccount-navigation{
    background:#fff;
    border:1px solid #ececec;
    border-radius:20px;
    padding:14px;
}

/* "Κολλάει" στο scroll στις μεγάλες οθόνες, ώστε όταν το περιεχόμενο
   δεξιά (π.χ. λίστα παραγγελιών) είναι πολύ πιο ψηλό από το μενού,
   να μη μένει άδειος χώρος κάτω από την κάρτα του σαϊντμπαρ καθώς
   κατεβαίνει η σελίδα. Μόνο πάνω από το breakpoint στο οποίο το
   main.js βάζει τη στήλη σε πλήρες πλάτος (800px). */
@media(min-width:801px){
    .woocommerce-MyAccount-navigation{
        position:sticky;
        top:24px;
    }
}

.woocommerce-MyAccount-navigation ul{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:4px;
}

.woocommerce-MyAccount-navigation li{
    margin:0;
}

.woocommerce-MyAccount-navigation li a{
    display:flex;
    align-items:center;
    gap:10px;
    padding:12px 16px;
    border-radius:12px;
    color:#444;
    font-weight:600;
    font-size:15px;
    text-decoration:none;
    transition:background-color .15s ease, color .15s ease;
}

.g4h-nav-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    width:20px;
    height:20px;
    color:#8a97a8;
    transition:color .15s ease;
}

.g4h-nav-icon svg{
    width:20px;
    height:20px;
}

.woocommerce-MyAccount-navigation li a:hover .g4h-nav-icon,
.woocommerce-MyAccount-navigation li.is-active a .g4h-nav-icon{
    color:currentColor;
}

.g4h-nav-label{
    flex:1;
}

.g4h-nav-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:22px;
    height:22px;
    padding:0 6px;
    border-radius:999px;
    background:#eef3f8;
    color:#173d66;
    font-size:12px;
    font-weight:800;
    flex-shrink:0;
}

.woocommerce-MyAccount-navigation li.is-active a .g4h-nav-count{
    background:rgba(255,255,255,.25);
    color:#fff;
}

/* ---------- Κεφαλίδα προφίλ (gradient header + avatar + όνομα) ----------
   Ζει ΜΕΣΑ στο <nav> (βλ. navigation.php) ώστε menu+content να
   παραμείνουν τα μόνα δύο flex items που ρυθμίζει το main.js. Το
   αρνητικό margin "ξεχειλίζει" έξω από το padding:14px του <nav>,
   ώστε η μπάντα με το gradient να καλύπτει όλο το πλάτος της
   κάρτας μέχρι τις στρογγυλεμένες γωνίες της. */

.g4h-account-profile{
    display:flex;
    align-items:center;
    gap:12px;
    margin:-14px -14px 14px;
    padding:22px 18px;
    border-radius:20px 20px 0 0;
    background:linear-gradient(135deg,#3fc4e8 0%,#0077B6 100%);
}

.g4h-account-avatar{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    width:44px;
    height:44px;
    border-radius:50%;
    background:#fff;
    color:#0077B6;
    font-size:16px;
    font-weight:800;
    letter-spacing:.5px;
}

.g4h-account-profile-text{
    display:flex;
    flex-direction:column;
    gap:2px;
    min-width:0;
}

.g4h-account-profile-text strong{
    font-size:15px;
    font-weight:800;
    color:#fff;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.g4h-account-profile-text span{
    font-size:12.5px;
    color:rgba(255,255,255,.75);
}

.woocommerce-MyAccount-navigation li a:hover{
    background:#f5f7fa;
    color:#173d66;
}

.woocommerce-MyAccount-navigation li.is-active a{
    background:#2f8fae !important;
    color:#fff !important;
    font-weight:800;
}

.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout{
    margin-top:8px;
    padding-top:8px;
    border-top:1px solid #ececec;
}

.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a{
    color:#c62828;
}

.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a:hover{
    background:#fdeceb;
    color:#c62828;
}

/* ---------- Κάτω μπλοκ βοήθειας/επικοινωνίας ----------
   Γεμίζει τον κενό χώρο κάτω από τα στοιχεία μενού όταν το σαϊντμπαρ
   είναι πιο κοντό από το περιεχόμενο δεξιά (βλ. και sticky, πιο
   πάνω), και δίνει έναν φυσικό προορισμό αντί για άδειο λευκό. */

.g4h-account-help{
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:10px;
    padding:14px;
    border-radius:14px;
    background:#f5f9fc;
    text-decoration:none;
    transition:background-color .15s ease;
}

.g4h-account-help:hover{
    background:#eaf2f8;
}

.g4h-account-help-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    width:36px;
    height:36px;
    border-radius:50%;
    background:#e2eef7;
    color:#0077B6;
}

.g4h-account-help-text{
    display:flex;
    flex-direction:column;
    gap:2px;
    min-width:0;
}

.g4h-account-help-text strong{
    font-size:13.5px;
    font-weight:800;
    color:#173d66;
}

.g4h-account-help-text span{
    font-size:12px;
    color:#0077B6;
}

/* ---------- Контент справа ---------- */

.woocommerce-MyAccount-content{
    background:#fff;
    border:1px solid #ececec;
    border-radius:20px;
    padding:32px;
    color:#444;
    font-size:15px;
    line-height:1.8;
}

.woocommerce-MyAccount-content p{
    margin:0 0 16px;
}

.woocommerce-MyAccount-content a{
    color:#0077B6;
    font-weight:600;
    text-decoration:underline;
}

/* Το γενικό κανόνα από πάνω (.woocommerce-MyAccount-content a) έχει
   μεγαλύτερη ειδικότητα (class + type) από ένα μονό .g4h-xxx class,
   οπότε νικάει το δικό μας text-decoration:none σε κουμπιά/tabs/
   links -- εδώ αυξάνουμε την ειδικότητα ρητά για κάθε τέτοιο
   στοιχείο ώστε να μείνουν χωρίς υπογράμμιση. */
.woocommerce-MyAccount-content a.g4h-order-btn,
.woocommerce-MyAccount-content a.g4h-dash-track-btn,
.woocommerce-MyAccount-content a.g4h-dash-section-link,
.woocommerce-MyAccount-content a.g4h-quicklink,
.woocommerce-MyAccount-content a.g4h-orders-tab,
.woocommerce-MyAccount-content a.g4h-orders-page-btn,
.woocommerce-MyAccount-content a.g4h-orders-search-clear,
.woocommerce-MyAccount-content a.g4h-orders-empty-link{
    text-decoration:none;
}

.woocommerce-MyAccount-content strong{
    color:#173d66;
}

/* Подстраховка от переполнения: длинные email/адреса/слова без
   пробелов не должны вылезать за пределы карточки ни в одном блоке. */

.woocommerce-MyAccount-content,
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3,
.woocommerce-MyAccount-content address,
.woocommerce-MyAccount-content .woocommerce-Address,
.woocommerce-MyAccount-content .woocommerce-Address address{
    word-break:break-word;
    overflow-wrap:break-word;
}

.woocommerce-MyAccount-content .woocommerce-Address{
    max-width:100%;
    box-sizing:border-box;
}

.woocommerce-MyAccount-content .woocommerce-Address h2,
.woocommerce-MyAccount-content .woocommerce-Address .woocommerce-Address-title h2{
    font-size:18px;
    display:inline-block;
}

.woocommerce-MyAccount-content .woocommerce-Address-title{
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    gap:10px;
    margin-bottom:10px;
}

.woocommerce-MyAccount-content .woocommerce-Address-title a.edit{
    font-size:13px;
    white-space:nowrap;
}

/* Таблица заказов / способов оплаты / загрузок —
   оборачиваем в горизонтальный скролл на узких экранах, чтобы
   текст никогда не вылезал за пределы карточки, а сам не сжимался
   до нечитаемого состояния. */

.woocommerce-MyAccount-content{
    overflow-x:auto;
}

.woocommerce-MyAccount-content table.woocommerce-orders-table,
.woocommerce-MyAccount-content table.woocommerce-table,
.woocommerce-MyAccount-content table.shop_table{
    width:100%;
    min-width:480px;
    border-collapse:collapse;
    table-layout:auto;
}

.woocommerce-MyAccount-content table.woocommerce-orders-table th,
.woocommerce-MyAccount-content table.woocommerce-table th,
.woocommerce-MyAccount-content table.shop_table th{
    text-align:left;
    padding:12px 10px;
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.04em;
    color:#6b7280;
    border-bottom:1px solid #ececec;
    white-space:nowrap;
}

.woocommerce-MyAccount-content table.woocommerce-orders-table td,
.woocommerce-MyAccount-content table.woocommerce-table td,
.woocommerce-MyAccount-content table.shop_table td{
    padding:14px 10px;
    border-bottom:1px solid #f2f2f2;
    font-size:14px;
    word-break:break-word;
    overflow-wrap:break-word;
}

.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-status{
    font-weight:700;
    white-space:nowrap;
}

.woocommerce-MyAccount-content table td.woocommerce-orders-table__cell-order-actions,
.woocommerce-MyAccount-content table th.woocommerce-orders-table__header-order-actions{
    white-space:nowrap;
}

.woocommerce-MyAccount-content .woocommerce-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:38px;
    padding:0 20px;
    border-radius:999px;
    background:linear-gradient(135deg,#FFD60A 0%,#FF8500 100%);
    color:#0077B6 !important;
    font-weight:700;
    font-size:13px;
    text-decoration:none !important;
}

/* Формы (адреса, данные аккаунта) */

.woocommerce-MyAccount-content form .form-row{
    margin-bottom:16px;
}

.woocommerce-MyAccount-content form label{
    display:block;
    margin-bottom:6px;
    font-weight:600;
    font-size:14px;
    color:#444;
}

.woocommerce-MyAccount-content form input.input-text,
.woocommerce-MyAccount-content form select,
.woocommerce-MyAccount-content form textarea{
    width:100%;
    max-width:100%;
    height:48px;
    padding:0 16px;
    border:1px solid #e2e2e2;
    border-radius:12px;
    font-size:14px;
    box-sizing:border-box;
}

.woocommerce-MyAccount-content form textarea{
    height:auto;
    padding:12px 16px;
}

.woocommerce-MyAccount-content form fieldset{
    border:1px solid #ececec;
    border-radius:14px;
    padding:20px 20px 4px;
    margin:0 0 16px;
    max-width:100%;
    box-sizing:border-box;
}

.woocommerce-MyAccount-content form legend{
    padding:0 10px;
    margin-left:6px;
    font-weight:700;
    font-size:14px;
    color:#173d66;
}

.woocommerce-MyAccount-content *{
    max-width:100%;
    box-sizing:border-box;
}

.woocommerce-MyAccount-content form button[type="submit"]{
    height:48px;
    padding:0 32px;
    border:none;
    border-radius:999px;
    background:linear-gradient(135deg,#FFD60A 0%,#FF8500 100%);
    color:#0077B6;
    font-weight:800;
    font-size:15px;
    cursor:pointer;
}

@media(max-width:800px){

    .woocommerce-MyAccount-navigation ul{
        flex-direction:row;
        flex-wrap:wrap;
    }

    .woocommerce-MyAccount-navigation li a{
        padding:10px 14px;
        font-size:14px;
    }

}

/* ==========================================================
   ΣΥΝΔΕΣΗ / ΕΓΓΡΑΦΗ (my-account, μη συνδεδεμένοι χρήστες)
   -- override του woocommerce/myaccount/form-login.php
========================================================== */

/* Για επισκέπτες αφαιρούμε τα δύο εξωτερικά "λευκά κουτιά" της
   σελίδας (.g4h-page-content + .woocommerce-MyAccount-content), ώστε
   να μείνουν μόνο οι δύο δικές μας κάρτες πάνω στο φόντο της σελίδας
   -- ακριβώς όπως στο σχέδιο αναφοράς. Ο πίνακας πλοήγησης (μενού
   αριστερά) έτσι κι αλλιώς δεν εμφανίζεται σε μη συνδεδεμένους. */
body.woocommerce-account:not(.logged-in) .g4h-page-content{
    background:transparent;
    border:none;
    box-shadow:none;
    padding:0;
}

body.woocommerce-account:not(.logged-in) .woocommerce-MyAccount-content{
    background:transparent;
    border:none;
    box-shadow:none;
    padding:0;
    overflow:visible;
}

/* Defensive resets: το WooCommerce core CSS ορίζει ιστορικά κανόνες
   float για τα παλιά .u-columns/.col2-set/.col-1/.col-2 (τα οποία
   αφαιρέσαμε από το markup), αλλά κρατάμε εδώ και ρητά resets ώστε
   καμία άλλη τιμή float/width να μην μπορεί ποτέ να ξαναχαλάσει το
   layout, ό,τι κι αν αλλάξει σε core/plugin ενημερώσεις. */
#customer_login.g4h-auth-grid{
    display:flex !important;
    float:none !important;
    width:auto !important;
    clear:both;
}

/* Μία ενιαία κάρτα (σαν το σχέδιο αναφοράς): οι δύο μισές
   ενώνονται χωρίς κενό, με ΕΝΑ κοινό περίγραμμα/σκιά/στρογγύλεμα
   γύρω από ολόκληρο το block, και μια λεπτή κάθετη διαχωριστική
   γραμμή ανάμεσά τους. */
/* Το φόντο των δύο μισών μπαίνει ΕΔΩ, σαν gradient 50/50 πάνω στο
   ίδιο το container -- όχι σε κάθε κάρτα ξεχωριστά. Έτσι το γκρι της
   στήλης εγγραφής καλύπτει πάντα ολόκληρο το ύψος του container, ό,τι
   κι αν συμβαίνει με align-items (stretch ή start), και ανεξάρτητα
   από το ποια στήλη έχει περισσότερο περιεχόμενο. */
.g4h-auth-grid{
    display:flex;
    align-items:flex-start;
    max-width:940px;
    margin:0 auto;
    background:linear-gradient(90deg,#fff 50%,#f7fafd 50%);
    border:1px solid #ececec;
    border-radius:24px;
    box-shadow:0 6px 24px rgba(0,0,0,.05);
    overflow:hidden;
}

.g4h-auth-grid.g4h-auth-grid--single{
    max-width:480px;
    justify-content:center;
    background:#fff;
}

.g4h-auth-card{
    flex:1 1 0;
    min-width:0;
    padding:26px 32px;
    font-family:Inter, sans-serif;
    float:none !important;
    box-sizing:border-box;
}

.g4h-auth-card--register{
    border-left:1px solid #eaeef3;
}

/* Καμία εμφωλευμένη "κούτα μέσα σε κούτα" γύρω από τα πεδία --
   τα ίδια τα <form> της WooCommerce (woocommerce-form-login /
   woocommerce-form-register) ΔΕΝ πρέπει ποτέ να εμφανίζονται σαν
   ξεχωριστό πλαίσιο μέσα στην κάρτα, ό,τι κι αν προσθέσει κάποιο
   plugin/hook. */
.g4h-auth-card .woocommerce-form-login,
.g4h-auth-card .woocommerce-form-register{
    border:none !important;
    border-radius:0 !important;
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
}

.g4h-auth-card form fieldset{
    border:none;
    padding:0;
    margin:0 0 16px;
}

.g4h-auth-title{
    font-size:26px;
    font-weight:800;
    color:#173d66;
    margin:0 0 6px;
}

.g4h-auth-subtitle{
    font-size:14px;
    color:#8a98ad;
    margin:0 0 16px;
}

/* Πιο σφιχτό κενό ανάμεσα στα πεδία της φόρμας (μόνο εδώ, όχι σε
   ολόκληρο το .woocommerce-MyAccount-content). */
.g4h-auth-card .form-row{
    margin-bottom:12px !important;
}

/* Στη στήλη εγγραφής υπάρχει μόνο ΕΝΑ πεδίο (email), οπότε το κενό
   μέχρι την υποσημείωση από κάτω είναι πιο σφιχτό από το γενικό κενό
   ανάμεσα σε πολλαπλά πεδία. */
.g4h-auth-card--register .form-row{
    margin-bottom:6px !important;
}

.g4h-auth-note{
    font-size:12px;
    color:#8a98ad;
    margin:0 0 10px;
}

/* Ετικέτες πιο διακριτικές/μικρές, σύμφωνα με το μακέτο. */
.g4h-auth-card form label{
    font-size:13px;
    font-weight:800;
    color:#5b6b85;
}

/* Οι κόκκινες υποχρεωτικές αστερίσκοι δεν υπάρχουν στο μακέτο. */
.g4h-auth-card form label .required{
    display:none;
}

/* Πεδία εισαγωγής: ύψος/ακτίνα/περίγραμμα όπως στο μακέτο, χωρίς
   το μπλε highlight του browser autofill. */
.g4h-auth-card form input.input-text,
.g4h-auth-card input[type="text"],
.g4h-auth-card input[type="email"],
.g4h-auth-card input[type="password"]{
    height:44px !important;
    border-radius:12px !important;
    border-color:#e3e8f0 !important;
    box-sizing:border-box;
}

.g4h-auth-card form input:-webkit-autofill{
    -webkit-box-shadow:0 0 0 1000px #fff inset;
    -webkit-text-fill-color:#173d66;
}

.g4h-auth-card--register form input:-webkit-autofill{
    -webkit-box-shadow:0 0 0 1000px #f7fafd inset;
}

.g4h-auth-row-meta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:10px;
    margin:0 0 4px !important;
}

.g4h-auth-row-meta label{
    display:flex !important;
    align-items:center;
    gap:8px;
    margin:0 !important;
    font-weight:600;
    font-size:14px;
    color:#444;
}

/* Custom checkbox "Να με θυμάσαι" — 20px, γωνίες 6px, αντί για το
   προεπιλεγμένο τετράγωνο του browser. Στοχεύουμε και την core κλάση
   της WooCommerce (woocommerce-form__input-checkbox) επιπλέον της
   δικής μας, με !important -- ό,τι default στυλ κι αν έχει ο πυρήνας
   ή κάποιο plugin πάνω σε input[type=checkbox], εδώ πρέπει να χάνει. */
.g4h-auth-row-meta input[type="checkbox"]{
    appearance:none !important;
    -webkit-appearance:none !important;
    -moz-appearance:none !important;
    position:relative;
    width:20px !important;
    height:20px !important;
    margin:0 !important;
    flex-shrink:0;
    border:1.5px solid #d5dbe4 !important;
    border-radius:6px !important;
    background-color:#fff !important;
    cursor:pointer;
}

.g4h-auth-row-meta input[type="checkbox"]:checked{
    background-color:#173d66 !important;
    border-color:#173d66 !important;
}

.g4h-auth-row-meta input[type="checkbox"]:checked::after{
    content:"";
    position:absolute;
    left:6px;
    top:2px;
    width:5px;
    height:10px;
    border:solid #fff;
    border-width:0 2px 2px 0;
    transform:rotate(45deg);
}

.g4h-auth-forgot{
    font-size:14px;
    font-weight:600;
    color:#0077B6 !important;
    text-decoration:none !important;
}

.g4h-auth-forgot:hover{
    color:#005f8f;
}

.g4h-auth-submit-row{
    margin-top:12px !important;
}

.g4h-auth-submit-row button{
    width:100%;
}

/* Κουμπιά "Σύνδεση" / "Δημιουργία λογαριασμού" -- ίδιο ακριβώς
   στυλ με το βασικό CTA κουμπί του καλαθιού (.checkout-button στο
   cart.css): συμπαγές "χάπι" με το πορτοκαλί/κίτρινο gradient του
   site. Δεν βασιζόμαστε πια στο γενικό κανόνα
   ".woocommerce-MyAccount-content form button[type="submit"]"
   παραπάνω -- εδώ ορίζουμε τα πάντα ρητά με !important, ώστε το
   σχήμα να μην μπορεί να "σπάσει" ξανά από άλλο κανόνα. */
.woocommerce-MyAccount-content form button.g4h-auth-btn,
.woocommerce-MyAccount-content form button.g4h-auth-btn--login,
.woocommerce-MyAccount-content form button.g4h-auth-btn--register,
.g4h-auth-card .woocommerce-form-login__submit,
.g4h-auth-card .woocommerce-form-register__submit,
.g4h-auth-card button[name="login"],
.g4h-auth-card button[name="register"]{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    height:52px !important;
    padding:0 28px !important;
    margin:0 !important;
    border:none !important;
    border-radius:999px !important;
    background:linear-gradient(135deg,#FFD60A 0%,#FF8500 100%) !important;
    color:#0077B6 !important;
    font-weight:800 !important;
    font-size:15px !important;
    line-height:1 !important;
    white-space:nowrap;
    cursor:pointer;
    opacity:1 !important;
    filter:none !important;
    transition:transform .15s ease, box-shadow .15s ease;
}

.woocommerce-MyAccount-content form button.g4h-auth-btn:hover,
.g4h-auth-card button[name="login"]:hover,
.g4h-auth-card button[name="register"]:hover{
    transform:translateY(-1px);
    box-shadow:0 6px 14px rgba(255,133,0,.35);
}

/* Λεπτή διαχωριστική γραμμή + λίστα εμπιστοσύνης (SSL/αποστολή/
   επιστροφές) κάτω από το κουμπί "Σύνδεση" -- σταθερό κενό αμέσως
   μετά το κουμπί, ΟΧΙ πια "κολλημένο" στο κάτω μέρος της κάρτας.
   Η στήλη "Σύνδεση" μπορεί έτσι να είναι πιο κοντή από τη στήλη
   "Εγγραφή" -- είναι φυσιολογικό, δεν προσπαθούμε πια να τις
   εξισώσουμε σε ύψος. */
.g4h-auth-divider{
    height:1px;
    background:#eef0f3;
    margin:16px 0 12px;
}

.g4h-auth-trust{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:8px;
}

.g4h-auth-trust li{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:13.5px;
    font-weight:600;
    color:#7a8699;
}

.g4h-auth-trust li svg{
    flex-shrink:0;
    color:#1f6fb2;
}

/* "Τι κερδίζετε" -- λευκή κάρτα μέσα στην γκρι στήλη εγγραφής,
   ώστε οι galochki να μην κάθονται απευθείας πάνω στο γκρι φόντο. */
.g4h-auth-benefits-card{
    background:#fff;
    border-radius:16px;
    padding:14px 18px;
    margin:14px 0 0;
}

/* Χωρίς text-transform:uppercase -- σε ελληνικά κείμενα αυτό μπορεί
   να αφαιρέσει λάθος τους τόνους. Ο τίτλος γράφεται ήδη με κεφαλαία
   ΤΙ ΚΕΡΔΙΖΕΤΕ (χωρίς τόνο) απευθείας στο markup. */
.g4h-auth-benefits-title{
    font-size:11px;
    font-weight:900;
    letter-spacing:.06em;
    color:#8a98ad;
    margin:0 0 10px;
}

.g4h-auth-benefits{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:8px;
}

.g4h-auth-benefits li{
    position:relative;
    padding-left:26px;
    font-size:14px;
    font-weight:600;
    color:#173d66;
}

/* Line-art SVG check (stroke, όχι ο χαρακτήρας ✓) — 17px,
   stroke-width 2.4, στο τιρκουάζ χρώμα του site. */
.g4h-auth-benefits li::before{
    content:"";
    position:absolute;
    left:0;
    top:1px;
    width:17px;
    height:17px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f7a50' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 12.5 9.5 18 20 6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-size:contain;
}

.g4h-auth-terms{
    margin:14px 0 0;
    font-size:12.5px;
    color:#7a8699;
    line-height:1.6;
}

.g4h-auth-terms a{
    color:#0077B6;
    font-weight:600;
    text-decoration:underline;
}

@media(max-width:760px){

    .g4h-auth-grid{
        flex-direction:column;
        /* align-items αλλάζει άξονα όταν το flex-direction γίνεται
           column -- εδώ ελέγχει το πλάτος, όχι το ύψος, οπότε πρέπει
           να ξαναγίνει stretch για να πιάνουν οι κάρτες όλο το πλάτος. */
        align-items:stretch;
        /* Στοιβαγμένες κάρτες -- το gradient γίνεται πάνω/κάτω αντί
           για αριστερά/δεξιά. */
        background:linear-gradient(180deg,#fff 50%,#f7fafd 50%);
    }

    .g4h-auth-card--register{
        border-left:none;
        border-top:1px solid #dceefa;
    }

    .g4h-auth-card{
        padding:24px;
    }

}

/* ==========================================================
   ΠΙΝΑΚΑΣ ΕΛΕΓΧΟΥ (Dashboard)
========================================================== */

/* ---------- Banner καλωσορίσματος ---------- */

.g4h-dash-banner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    flex-wrap:wrap;
    background:linear-gradient(135deg,#3fc4e8 0%,#0077B6 100%);
    border-radius:22px;
    padding:28px 32px;
    margin-bottom:20px;
    color:#fff;
}

.g4h-dash-banner-text h2{
    margin:0 0 6px;
    font-size:22px;
    font-weight:800;
    color:#fff;
}

.g4h-dash-banner-text p{
    margin:0;
    font-size:14.5px;
    color:rgba(255,255,255,.85);
    line-height:1.6;
}

.g4h-dash-track-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    height:44px;
    padding:0 22px;
    border-radius:999px;
    background:linear-gradient(135deg,#FFD60A 0%,#FF8500 100%);
    color:#0077B6;
    font-weight:800;
    font-size:14.5px;
    text-decoration:none;
    white-space:nowrap;
    transition:transform .15s ease, box-shadow .15s ease;
}

.g4h-dash-track-btn:hover{
    transform:translateY(-1px);
    box-shadow:0 8px 20px rgba(255,133,0,.35);
    color:#0077B6;
}

/* ---------- Στατιστικά πλακίδια ---------- */

.g4h-dash-stats{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
    gap:16px;
    margin-bottom:24px;
}

.g4h-stat-tile{
    display:flex;
    flex-direction:column;
    gap:10px;
    background:#fff;
    border:1px solid #ececec;
    border-radius:18px;
    padding:20px;
    box-shadow:0 6px 24px rgba(0,0,0,.05);
}

.g4h-stat-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    border-radius:12px;
}

.g4h-stat-icon svg{
    width:20px;
    height:20px;
}

.g4h-stat-icon--navy{
    background:#e8f0f9;
    color:#173d66;
}

.g4h-stat-icon--green{
    background:#e6f7ee;
    color:#12915a;
}

.g4h-stat-icon--pink{
    background:#fdecf1;
    color:#d6336c;
}

.g4h-stat-icon--purple{
    background:#f1ecfa;
    color:#6f3fc4;
}

.g4h-stat-label{
    font-size:13px;
    color:#7a8699;
    font-weight:600;
}

.g4h-stat-value{
    font-size:22px;
    font-weight:800;
    color:#173d66;
}

/* ---------- Ενότητα με τίτλο + accent bar ---------- */

.g4h-dash-section{
    margin-bottom:24px;
}

.g4h-dash-section-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:14px;
}

.g4h-dash-section-head h3{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0;
    font-size:16px;
    font-weight:800;
    color:#173d66;
}

.g4h-accent-bar{
    display:inline-block;
    width:4px;
    height:16px;
    border-radius:999px;
    background:linear-gradient(180deg,#FFD60A 0%,#FF8500 100%);
}

.g4h-dash-section-link{
    font-size:13.5px;
    font-weight:700;
    color:#0077B6;
    text-decoration:none;
    white-space:nowrap;
}

.g4h-dash-section-link:hover{
    text-decoration:underline;
}

/* ---------- Κάρτα παραγγελίας (κοινή -- dashboard + λίστα) ---------- */

.g4h-order-card{
    background:#fff;
    border:1px solid #ececec;
    border-radius:18px;
    padding:20px 22px;
    box-shadow:0 6px 24px rgba(0,0,0,.05);
}

.g4h-order-card-head{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    margin-bottom:14px;
}

.g4h-order-number{
    order:1;
    margin-right:auto;
    font-size:15.5px;
    font-weight:800;
    color:#173d66;
}

.g4h-order-card-head .g4h-status-pill{
    order:2;
}

.g4h-order-meta{
    order:3;
    flex-basis:100%;
    display:block;
    font-size:13px;
    color:#8a97a8;
}

.g4h-status-pill{
    display:inline-flex;
    align-items:center;
    gap:6px;
    height:28px;
    padding:0 12px;
    border-radius:999px;
    font-size:12.5px;
    font-weight:700;
}

.g4h-status-pill svg{
    width:14px;
    height:14px;
}

.g4h-status-dot{
    display:inline-block;
    width:6px;
    height:6px;
    border-radius:50%;
    background:currentColor;
}

.g4h-status-pill.is-success{
    background:#e6f7ee;
    color:#12915a;
}

.g4h-status-pill.is-progress{
    background:#fff4e0;
    color:#c9781a;
}

.g4h-status-pill.is-cancelled{
    background:#fdecec;
    color:#c62828;
}

.g4h-order-card-body{
    display:grid;
    grid-template-columns:auto minmax(220px, 1fr) auto auto;
    align-items:center;
    gap:16px;
}

.g4h-order-thumbs{
    display:flex;
    gap:8px;
    flex-shrink:0;
}

.g4h-order-thumb{
    position:relative;
    width:56px;
    height:56px;
    border-radius:12px;
    overflow:hidden;
    background:#f5f7fa;
    border:1px solid #ececec;
}

.g4h-order-thumb img{
    width:100%;
    height:100%;
    object-fit:contain;
    background:#fff;
    display:block;
}

.g4h-order-thumb-qty{
    position:absolute;
    bottom:-4px;
    right:-4px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:18px;
    height:18px;
    padding:0 4px;
    border-radius:999px;
    background:#173d66;
    color:#fff;
    font-size:10.5px;
    font-weight:800;
    border:2px solid #fff;
}

.g4h-order-thumb-more{
    display:flex;
    align-items:center;
    justify-content:center;
    width:56px;
    height:56px;
    border-radius:12px;
    background:#f5f7fa;
    border:1px solid #ececec;
    color:#8a97a8;
    font-size:13px;
    font-weight:800;
}

.g4h-order-card-info{
    min-width:0;
}

.g4h-order-product-name{
    display:block;
    margin:0;
    font-size:15px;
    font-weight:700;
    line-height:1.4;
    color:#173d66;
    overflow-wrap:break-word;
}

.g4h-order-product-name span{
    display:block;
    margin-top:2px;
    font-size:12.5px;
    font-weight:600;
    color:#8a97a8;
}

.g4h-order-card-total{
    text-align:right;
    flex-shrink:0;
    white-space:nowrap;
}

.g4h-order-total-label{
    display:block;
    font-size:12px;
    color:#8a97a8;
    white-space:nowrap;
}

.g4h-order-total-amount{
    display:block;
    margin-top:2px;
    font-size:16px;
    font-weight:800;
    color:#173d66;
    white-space:nowrap;
}

.g4h-order-card-actions{
    display:flex;
    align-items:center;
    gap:10px;
    flex-shrink:0;
}

.g4h-order-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:40px;
    padding:0 18px;
    border-radius:999px;
    font-size:13.5px;
    font-weight:700;
    text-decoration:none;
    white-space:nowrap;
    transition:transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.g4h-order-btn--primary{
    background:linear-gradient(135deg,#FFD60A 0%,#FF8500 100%);
    color:#0077B6;
}

.g4h-order-btn--primary:hover{
    transform:translateY(-1px);
    box-shadow:0 8px 20px rgba(255,133,0,.3);
    color:#0077B6;
}

.g4h-order-btn--ghost{
    background:#f5f7fa;
    color:#173d66;
    border:1px solid #ececec;
}

.g4h-order-btn--ghost:hover{
    background:#eef3f8;
}

/* ---------- Γρήγοροι σύνδεσμοι ---------- */

.g4h-dash-quicklinks{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
    gap:16px;
}

.g4h-quicklink{
    display:flex;
    align-items:center;
    gap:14px;
    background:#fff;
    border:1px solid #ececec;
    border-radius:18px;
    padding:18px 20px;
    text-decoration:none;
    box-shadow:0 6px 24px rgba(0,0,0,.05);
    transition:transform .15s ease, box-shadow .15s ease;
}

.g4h-quicklink:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 28px rgba(0,0,0,.08);
}

.g4h-quicklink-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    width:44px;
    height:44px;
    border-radius:14px;
}

.g4h-quicklink-icon svg{
    width:22px;
    height:22px;
}

.g4h-quicklink-icon--blue{
    background:#e8f0f9;
    color:#0077B6;
}

.g4h-quicklink-icon--orange{
    background:#fff4e0;
    color:#c9781a;
}

.g4h-quicklink-icon--green{
    background:#e6f7ee;
    color:#12915a;
}

.g4h-quicklink-text{
    display:flex;
    flex-direction:column;
    gap:2px;
}

.g4h-quicklink-text strong{
    font-size:14.5px;
    font-weight:800;
    color:#173d66;
}

.g4h-quicklink-text span{
    font-size:12.5px;
    color:#8a97a8;
}

@media(max-width:760px){

    .g4h-dash-banner{
        flex-direction:column;
        align-items:flex-start;
        padding:24px;
    }

    .g4h-dash-track-btn{
        width:100%;
    }

    .g4h-dash-stats{
        grid-template-columns:repeat(2, 1fr);
    }

    .g4h-order-card-body{
        grid-template-columns:auto 1fr;
        row-gap:14px;
    }

    .g4h-order-card-total{
        grid-column:1 / -1;
        text-align:left;
    }

    .g4h-order-card-actions{
        grid-column:1 / -1;
        width:100%;
    }

    .g4h-order-btn{
        flex:1;
    }

}

/* ==========================================================
   ΛΙΣΤΑ ΠΑΡΑΓΓΕΛΙΩΝ (Orders)
========================================================== */

.g4h-orders-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
    margin-bottom:22px;
}

.g4h-orders-tabs{
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;
}

.g4h-orders-tab{
    display:inline-flex;
    align-items:center;
    gap:8px;
    height:38px;
    padding:0 16px;
    border-radius:999px;
    background:#f5f7fa;
    color:#5c6b7d;
    font-size:13.5px;
    font-weight:700;
    text-decoration:none;
    transition:background-color .15s ease, color .15s ease;
}

.g4h-orders-tab:hover{
    background:#eef3f8;
    color:#173d66;
}

.g4h-orders-tab.is-active{
    background:#173d66;
    color:#fff;
}

.g4h-orders-tab-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:20px;
    height:20px;
    padding:0 5px;
    border-radius:999px;
    background:rgba(0,0,0,.06);
    font-size:11.5px;
    font-weight:800;
}

.g4h-orders-tab.is-active .g4h-orders-tab-count{
    background:rgba(255,255,255,.22);
}

.g4h-orders-search{
    position:relative;
    display:flex;
    align-items:center;
    flex-shrink:0;
}

.g4h-orders-search-icon{
    position:absolute;
    left:14px;
    display:inline-flex;
    color:#9aa7b5;
    pointer-events:none;
}

.g4h-orders-search input[type="text"]{
    width:260px;
    max-width:100%;
    height:42px;
    padding:0 34px 0 40px;
    border:1px solid #ececec;
    border-radius:999px;
    background:#f9fafb;
    font-family:Inter, sans-serif;
    font-size:13.5px;
    color:#173d66;
}

.g4h-orders-search input[type="text"]:focus{
    outline:none;
    border-color:#149dcb;
    background:#fff;
}

.g4h-orders-search-clear{
    position:absolute;
    right:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:22px;
    height:22px;
    border-radius:50%;
    background:#eef3f8;
    color:#5c6b7d;
    font-size:15px;
    line-height:1;
    text-decoration:none;
}

.g4h-orders-search-clear:hover{
    background:#e2e9f0;
}

.g4h-orders-list{
    display:flex;
    flex-direction:column;
    gap:16px;
}

.g4h-orders-pagination{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:18px;
    margin-top:26px;
}

.g4h-orders-page-btn{
    font-size:13.5px;
    font-weight:700;
    color:#0077B6;
    text-decoration:none;
}

.g4h-orders-page-btn:hover{
    text-decoration:underline;
}

.g4h-orders-page-status{
    font-size:13px;
    color:#8a97a8;
}

.g4h-orders-empty{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:10px;
    padding:56px 24px;
    color:#8a97a8;
}

.g4h-orders-empty-icon{
    display:inline-flex;
    color:#c7d0da;
    margin-bottom:6px;
}

.g4h-orders-empty p{
    margin:0;
    font-size:15px;
    color:#5c6b7d;
}

.g4h-orders-empty-link{
    font-size:14px;
    font-weight:700;
    color:#0077B6;
    text-decoration:none;
}

.g4h-orders-empty-link:hover{
    text-decoration:underline;
}

@media(max-width:760px){

    .g4h-orders-toolbar{
        flex-direction:column;
        align-items:stretch;
    }

    .g4h-orders-search input[type="text"]{
        width:100%;
    }

}
/* ==========================================================
   ΞΕΧΑΣΑ ΤΟΝ ΚΩΔΙΚΟ ΜΟΥ (my-account -> lost-password)
   Στενή κάρτα στο κέντρο, ίδιο στυλ/γραμματοσειρά (Inter) και
   χρώματα με την υπόλοιπη σελίδα σύνδεσης (.g4h-auth-*) -- όχι η
   ξεχωριστή παλέτα Nunito των φορμών λογαριασμού/διεύθυνσης.
========================================================== */

.g4h-lost-wrap{
    max-width:480px;
    margin:0 auto;
}

.g4h-lost-card{
    background:#fff;
    border:1px solid #ececec;
    border-radius:24px;
    box-shadow:0 6px 24px rgba(0,0,0,.05);
    padding:36px 32px;
    font-family:Inter, sans-serif;
    text-align:center;
}

.g4h-lost-icon{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    width:56px !important;
    height:56px !important;
    margin:0 0 12px !important;
    border-radius:50%;
    background:#eaf4fb;
    color:#0077B6;
}

.g4h-lost-icon svg{
    width:24px;
    height:24px;
}

.g4h-lost-icon--success{
    background:#e6f7ee;
    color:#12915a;
}

.g4h-lost-title{
    font-size:22px;
    font-weight:800;
    color:#173d66;
    margin:0 0 8px;
}

.g4h-lost-subtitle{
    font-size:14px;
    line-height:1.6;
    color:#8a97a8;
    margin:0 0 22px;
}

.g4h-lost-form{
    text-align:left;
}

.g4h-lost-row{
    margin-bottom:16px !important;
}

.g4h-lost-row label{
    display:block;
    margin-bottom:6px;
    font-size:13px;
    font-weight:800;
    color:#5b6b85;
}

.g4h-lost-row label .required{
    color:#c62828;
}

.g4h-lost-input-wrap{
    position:relative;
    display:block;
}

.g4h-lost-input-wrap svg{
    position:absolute;
    top:50%;
    left:14px;
    transform:translateY(-50%);
    color:#8a97a8;
    pointer-events:none;
}

/* Ασφάλεια: αν ποτέ ξαναμπεί form-row-first/last εδώ, να μην ξαναπέσει
   στο γνωστό πρόβλημα της WooCommerce (width:47%;float) που στένεψε
   το πεδίο σε προηγούμενο γύρο (βλ. account.css). */
.g4h-lost-form .form-row-first,
.g4h-lost-form .form-row-last{
    width:auto !important;
    float:none !important;
}

.g4h-lost-input-wrap input.input-text{
    width:100% !important;
    height:48px !important;
    padding:0 16px 0 42px !important;
    border:1px solid #e3e8f0 !important;
    border-radius:12px !important;
    font-family:Inter, sans-serif;
    font-size:14.5px;
    color:#173d66;
    box-sizing:border-box;
}

.g4h-lost-input-wrap input.input-text:focus{
    outline:none;
    border-color:#149dcb !important;
}

.g4h-lost-input-wrap input:-webkit-autofill{
    -webkit-box-shadow:0 0 0 1000px #fff inset;
    -webkit-text-fill-color:#173d66;
}

.g4h-lost-submit-row{
    margin:20px 0 0 !important;
}

/* Κουμπιά -- ίδιο "χάπι" στυλ με το υπόλοιπο site (βλ. κουμπιά
   σύνδεσης/εγγραφής παραπάνω και .checkout-button στο cart.css).
   Πλήρες !important σε όλες τις ιδιότητες ώστε το σχήμα να μην
   μπορεί να χαλάσει ξανά από άλλον κανόνα με ίδια ειδικότητα. */
.woocommerce-MyAccount-content .g4h-lost-btn,
.g4h-lost-btn{
    display:flex !important;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:100% !important;
    height:52px !important;
    padding:0 24px !important;
    margin:0 !important;
    border:none !important;
    border-radius:999px !important;
    font-family:Inter, sans-serif;
    font-size:15px;
    font-weight:800;
    text-decoration:none !important;
    cursor:pointer;
    box-sizing:border-box;
    transition:transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.woocommerce-MyAccount-content .g4h-lost-btn--primary,
.g4h-lost-btn--primary{
    background:linear-gradient(135deg,#FFD60A 0%,#FF8500 100%) !important;
    color:#0077B6 !important;
}

.woocommerce-MyAccount-content .g4h-lost-btn--primary:hover,
.g4h-lost-btn--primary:hover{
    transform:translateY(-1px);
    box-shadow:0 6px 14px rgba(255,133,0,.35);
}

.woocommerce-MyAccount-content .g4h-lost-btn--secondary,
.g4h-lost-btn--secondary{
    background:#f5f7fa !important;
    color:#173d66 !important;
    border:1px solid #ececec !important;
}

.woocommerce-MyAccount-content .g4h-lost-btn--secondary:hover,
.g4h-lost-btn--secondary:hover{
    background:#eef3f8 !important;
}

.g4h-lost-btn svg{
    flex-shrink:0;
}

.g4h-lost-divider{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:18px 0;
    height:1px;
    background:#eef0f3;
}

.g4h-lost-divider span{
    position:relative;
    padding:0 12px;
    background:#fff;
    font-size:12.5px;
    font-weight:700;
    color:#8a97a8;
}

.g4h-lost-note{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    margin:18px 0 0;
    font-size:12.5px;
    font-weight:600;
    color:#8a97a8;
}

.g4h-lost-note svg{
    flex-shrink:0;
    color:#1f6fb2;
}

.g4h-lost-resend{
    margin:0 0 22px;
    padding:14px 16px;
    background:#f5f7fa;
    border-radius:14px;
    text-align:left;
}

.g4h-lost-resend strong{
    display:block;
    margin-bottom:4px;
    font-size:13.5px;
    color:#173d66;
}

.g4h-lost-resend p{
    margin:0;
    font-size:13px;
    line-height:1.6;
    color:#5c6b7d;
}

.g4h-lost-resend a{
    color:#0077B6;
    font-weight:700;
    text-decoration:none;
}

.g4h-lost-resend a:hover{
    text-decoration:underline;
}

/* Μετρητής δύναμης κωδικού -- το div #password_strength το γεννάει
   αυτόματα το ίδιο το JS της WooCommerce αμέσως μετά το πεδίο
   #password_1 (μόνο στη φόρμα .lost_reset_password), με μία από τις
   κλάσεις short/bad/good/strong ανάλογα με τη δύναμη -- του δίνουμε
   μορφή "χάπι" ίδιου στυλ με το υπόλοιπο site. */
.g4h-lost-form .woocommerce-password-strength{
    display:block;
    margin:-8px 0 16px !important;
    padding:6px 14px;
    border-radius:999px;
    font-family:Inter, sans-serif;
    font-size:12.5px;
    font-weight:700;
    text-align:center;
}

.g4h-lost-form .woocommerce-password-strength.short{
    background:#fdeaea;
    color:#c62828;
}

.g4h-lost-form .woocommerce-password-strength.bad{
    background:#fdf1e0;
    color:#b25b00;
}

.g4h-lost-form .woocommerce-password-strength.good{
    background:#eaf4fb;
    color:#0077B6;
}

.g4h-lost-form .woocommerce-password-strength.strong{
    background:#e6f7ee;
    color:#12915a;
}

@media(max-width:520px){

    .g4h-lost-card{
        padding:28px 22px;
        border-radius:18px;
    }

}

/* ==========================================================
   ΣΕΛΙΔΑ ΣΥΝΔΕΣΗΣ -- κόκκινη κάρτα σφάλματος με εικονίδιο
   (αντί για τη γενική πορτοκαλί ειδοποίηση του base.css). Το
   πεδίο εφαρμογής περιορίζεται ρητά στη σελίδα "Ο λογαριασμός μου"
   (body.woocommerce-account) ώστε να ΜΗΝ επηρεάζει τις γενικές
   ειδοποιήσεις καλαθιού/checkout/προϊόντος, που έχουν σκόπιμα το
   δικό τους ενιαίο ουδέτερο στυλ.
========================================================== */
body.woocommerce-account .woocommerce-error{
    position:relative;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:flex-start;
    gap:12px;
    width:100%;
    max-width:940px;
    margin:0 auto 24px !important;
    background:#fff2f4;
    border:1px solid #f5ccd4;
    border-left:4px solid #c33a52;
    border-radius:14px;
    padding:16px 20px !important;
    list-style:none;
    box-shadow:none;
}

body.woocommerce-account .woocommerce-error li{
    flex:1;
    min-width:0;
    margin:0 !important;
    padding:0 !important;
    font-family:Inter, sans-serif;
    font-size:14px;
    font-weight:800;
    color:#16233f;
    line-height:1.55;
}

body.woocommerce-account .woocommerce-error a{
    color:#c33a52 !important;
    font-weight:900;
    text-decoration:underline !important;
}

/* Το core CSS της ίδιας της WooCommerce βάζει στο ::before
   position:absolute (για να "επιπλέει" πάνω από το padding-left του
   παλιού, προεπιλεγμένου layout) -- εδώ το layout είναι flex, οπότε
   αυτό το absolute κάθεται πάνω στο κείμενο. Το ακυρώνουμε ρητά με
   position:static, ώστε το εικονίδιο να μπει σαν κανονικό flex-item
   πλάι στο κείμενο, όχι από πάνω του. */
body.woocommerce-account .woocommerce-error::before{
    content:"" !important;
    position:static !important;
    display:block !important;
    width:20px;
    height:20px;
    flex-shrink:0;
    margin:1px 0 0 !important;
    background:#c33a52;
    -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6'><circle cx='12' cy='12' r='9'/><path d='M12 7v6'/><path d='M12 16.5v.5'/></svg>") no-repeat center / contain;
    mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6'><circle cx='12' cy='12' r='9'/><path d='M12 7v6'/><path d='M12 16.5v.5'/></svg>") no-repeat center / contain;
}

/* Το ίδιο κόκκινο-κάρτα στυλ ισχύει και για τυχόν μηνύματα επιτυχίας/
   πληροφορίας στη σελίδα σύνδεσης (π.χ. "Η εγγραφή ολοκληρώθηκε") --
   εδώ με το πράσινο/μπλε χρώμα του site αντί για κόκκινο. */
body.woocommerce-account .woocommerce-message{
    box-sizing:border-box !important;
    width:100%;
    max-width:940px;
    margin:0 auto 24px !important;
    box-shadow:none;
}

body.woocommerce-account .woocommerce-info{
    box-sizing:border-box !important;
    width:100%;
    max-width:940px;
    margin:0 auto 24px !important;
    box-shadow:none;
}

/* Κόκκινο περίγραμμα στο συγκεκριμένο πεδίο που αφορά το σφάλμα
   (π.χ. λάθος κωδικός -> κόκκινο μόνο στο πεδίο κωδικού, όχι στο
   όνομα χρήστη). Το "ποιο πεδίο" υπολογίζεται στο PHP
   (g4h_get_notice_error_fields) από το ίδιο το μεταφρασμένο κείμενο
   του notice. */
.g4h-field-error label{
    color:#c33a52 !important;
}

.g4h-field-error input.input-text{
    border-color:#c33a52 !important;
    background:#fff7f8 !important;
}

@media(max-width:960px){

    body.woocommerce-account .woocommerce-error,
    body.woocommerce-account .woocommerce-message,
    body.woocommerce-account .woocommerce-info{
        max-width:none;
    }

}