/* ============================================================
   Δ.Δ.Ε. Καστοριάς — user.css
   Cassiopeia / Joomla 6

   1. Μεταβλητές
   2. Πάνω λωρίδα  — θέση topbar
   3. Κύριο μενού  — θέση menu (#navbar115)
   4. Κινητό / Tablet
   5. Logo και λευκή ζώνη
   6. Sticky header
   7. Slider αρχικής σελίδας
   8. Κάρτες άρθρων (mod_articles, layout=cards)
   9. Θεματικά blocks (main-top / main-bottom)
   ============================================================ */


/* ============================================================
   1. ΜΕΤΑΒΛΗΤΕΣ
   ============================================================ */

:root {
    --strip-bg:        steelblue;   /* χρώμα και των δύο λωρίδων   */
    --site-max:        1320px;      /* πλάτος περιεχομένου         */
    --dide-content-width: 700px; 
    --dide-top-width: 700px;

    --menu-top-size:   0.9rem;      /* ~14px — δευτερεύον μενού    */
    --menu-main-size:  1.05rem;     /* ~17px — κύριο μενού         */
    --menu-sub-size:   0.875rem;    /* υπομενού                    */

    --sub-text:        #1f3a4d;
    --sub-text-hover:  #14303f;
    --sub-hover-bg:    #e8f0f7;
    --top-accent: #5c4d9a;
}


/* ============================================================
   2. ΠΑΝΩ ΛΩΡΙΔΑ (topbar)
   ============================================================ */

.container-topbar {
    background-color: var(--strip-bg);
    padding: 6px 0;
}

@media (min-width: 992px) {

    .container-topbar ul.mod-menu {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 0.5rem;
        max-width: var(--site-max);
        margin: 0 auto;
        padding: 0 1rem;
    }

    .container-topbar ul.mod-menu > li {
        position: relative;
    }

    .container-topbar ul.mod-menu > li > a {
        display: inline-flex;
        align-items: center;
        gap: 0.45rem;
        padding: 7px 16px;
        border: 1px solid rgba(255, 255, 255, .28);
        border-radius: 6px;
        background-color: rgba(255, 255, 255, .10);
        color: #fff;
        font-size: var(--menu-top-size);
        font-weight: 400;
        text-decoration: none;
        transition: background-color .15s ease, color .15s ease;
    }

    .container-topbar ul.mod-menu > li > a:hover,
    .container-topbar ul.mod-menu > li:focus-within > a,
    .container-topbar ul.mod-menu > li.active > a {
        background-color: #fff;
        border-color: #fff;
        color: var(--strip-bg);
    }

    .container-topbar .mm-toggler { display: none; }

    .container-topbar ul.mod-menu > li.parent > a::after {
        content: "";
        width: 0; height: 0;
        margin-left: 4px;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-top: 5px solid currentColor;
    }

    .container-topbar ul.mod-menu ul {
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 1000;
        min-width: 240px;
        margin: 0;
        padding: 5px 0;
        list-style: none;
        background-color: #fff;
        border-top: 3px solid var(--strip-bg);
        border-radius: 0 0 6px 6px;
        box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
        display: none;

        --link-color: var(--sub-text);
        --link-hover-color: var(--sub-text-hover);
    }

    .container-topbar ul.mod-menu > li:hover > ul,
    .container-topbar ul.mod-menu > li:focus-within > ul {
        display: block !important;
        height: auto !important;
        overflow: visible !important;
    }

    .container-topbar ul.mod-menu ul li a:link,
    .container-topbar ul.mod-menu ul li a:visited,
    .container-topbar ul.mod-menu ul li a:hover,
    .container-topbar ul.mod-menu ul li a:focus,
    .container-topbar ul.mod-menu ul li a:active {
        display: block;
        padding: 9px 18px;
        border-left: 3px solid transparent;
        color: var(--sub-text);
        font-size: var(--menu-sub-size);
        line-height: 1.35;
        text-decoration: none;
        white-space: nowrap;
        transition: background-color .12s ease, border-color .12s ease;
    }

    .container-topbar ul.mod-menu ul li a:hover,
    .container-topbar ul.mod-menu ul li a:focus {
        background-color: var(--sub-hover-bg);
        border-left-color: var(--strip-bg);
        color: var(--sub-text-hover);
        text-decoration: none;
    }

    .container-topbar ul.mod-menu > li:last-child > ul,
    .container-topbar ul.mod-menu > li:nth-last-child(2) > ul {
        left: auto;
        right: 0;
    }
}


/* ============================================================
   3. ΚΥΡΙΟ ΜΕΝΟΥ (#navbar115)
   ============================================================ */

@media (min-width: 992px) {

    .container-header .container-nav {
        max-width: none;
        padding: 0;
        background-color: var(--strip-bg);
    }

    .container-header .container-nav > .navbar {
        width: 100%;
        max-width: var(--site-max);
        margin: 0 auto;
        padding: 0 1rem;
    }

    .container-header #navbar115 {
        justify-content: center;
    }

    #navbar115 ul.mod-menu {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin: 0;
        padding: 0;
    }

    #navbar115 ul.mod-menu > li {
        position: relative;
    }

    #navbar115 ul.mod-menu > li > a {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        padding: 12px 14px;
        border-bottom: 3px solid transparent;
        border-radius: 0;
        background: none;
        color: #fff;
        font-size: var(--menu-main-size);
        font-weight: 600;
        text-decoration: none;
        transition: background-color .15s ease, border-color .15s ease;
    }

    #navbar115 ul.mod-menu > li > a:hover,
    #navbar115 ul.mod-menu > li:focus-within > a,
    #navbar115 ul.mod-menu > li.active > a {
        background-color: rgba(0, 0, 0, .18);
        border-bottom-color: #fff;
        color: #fff;
    }

    #navbar115 .mm-toggler { display: none; }

    #navbar115 ul.mod-menu > li.parent > a::after {
        content: "";
        width: 0; height: 0;
        margin-left: 3px;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-top: 5px solid currentColor;
    }

    #navbar115 ul.mod-menu ul {
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 1000;
        min-width: 260px;
        margin: 0;
        padding: 6px 0;
        list-style: none;
        background: #fff;
        border-top: 3px solid var(--strip-bg);
        border-radius: 0 0 6px 6px;
        box-shadow: 0 8px 22px rgba(0, 0, 0, .20);
        display: none;

        --link-color: var(--sub-text);
        --link-hover-color: var(--sub-text-hover);
    }

    #navbar115 ul.mod-menu li:hover > ul,
    #navbar115 ul.mod-menu li:focus-within > ul {
        display: block !important;
        height: auto !important;
        overflow: visible !important;
    }

    #navbar115 ul.mod-menu ul li {
        position: relative;
    }

    #navbar115 ul.mod-menu ul li a:link,
    #navbar115 ul.mod-menu ul li a:visited,
    #navbar115 ul.mod-menu ul li a:hover,
    #navbar115 ul.mod-menu ul li a:focus,
    #navbar115 ul.mod-menu ul li a:active {
        display: block;
        padding: 9px 18px;
        border-left: 3px solid transparent;
        color: var(--sub-text);
        font-size: var(--menu-sub-size);
        font-weight: 400;
        line-height: 1.35;
        text-decoration: none;
        transition: background-color .12s ease, border-color .12s ease;
    }

    #navbar115 ul.mod-menu ul li a:hover,
    #navbar115 ul.mod-menu ul li a:focus {
        background-color: var(--sub-hover-bg);
        border-left-color: var(--strip-bg);
        color: var(--sub-text-hover);
        text-decoration: none;
    }

    #navbar115 ul.mod-menu ul ul {
        top: -6px;
        left: 100%;
        border-top: none;
        border-left: 3px solid var(--strip-bg);
        border-radius: 0 6px 6px 0;
    }

    #navbar115 ul.mod-menu ul li.parent > a::after {
        content: "";
        float: right;
        width: 0; height: 0;
        margin-top: 6px;
        border-top: 4px solid transparent;
        border-bottom: 4px solid transparent;
        border-left: 5px solid currentColor;
    }

    #navbar115 ul.mod-menu > li:last-child > ul,
    #navbar115 ul.mod-menu > li:nth-last-child(2) > ul {
        left: auto;
        right: 0;
    }

    #navbar115 ul.mod-menu > li:last-child ul ul,
    #navbar115 ul.mod-menu > li:nth-last-child(2) ul ul {
        left: auto;
        right: 100%;
        border-left: none;
        border-right: 3px solid var(--strip-bg);
        border-radius: 6px 0 0 6px;
    }
}


/* ============================================================
   4. ΚΙΝΗΤΟ / TABLET
   ============================================================ */

@media (max-width: 991.98px) {

    .container-header .container-nav {
        background-color: var(--strip-bg);
    }

    .container-header .container-nav .navbar-toggler {
        color: #fff;
        border-color: rgba(255, 255, 255, .4);
    }

    #navbar115 ul.mod-menu > li > a {
        color: #fff;
        font-size: var(--menu-main-size);
        font-weight: 600;
    }
}

@media (max-width: 991.98px) {

    /* Πρώτο επίπεδο — κάθεται στη μπλε λωρίδα */
    .container-topbar ul.mod-menu > li > a,
    .container-topbar ul.mod-menu > li > a:visited,
    .container-topbar .mm-toggler {
        color: #fff;
    }

    /* Υπομενού — ανοίγουν σε λευκό πλαίσιο */
    .container-topbar ul.mod-menu ul {
        margin: 4px 0;
        padding: 4px 0;
        list-style: none;
        background-color: #fff;
        border-radius: 6px;
    }

    .container-topbar ul.mod-menu ul a,
    .container-topbar ul.mod-menu ul a:visited {
        display: block;
        padding: 9px 16px;
        color: var(--sub-text);
    }

    .container-topbar ul.mod-menu ul a:hover,
    .container-topbar ul.mod-menu ul a:focus {
        background-color: var(--sub-hover-bg);
        color: var(--sub-text-hover);
    }
}

@media (min-width: 992px) and (hover: none) {
    .container-topbar .mm-toggler,
    #navbar115 .mm-toggler {
        display: inline-block;
    }
    .container-topbar ul.mod-menu > li.parent > a::after,
    #navbar115 ul.mod-menu > li.parent > a::after {
        display: none;
    }
}


/* ============================================================
   5. LOGO ΚΑΙ ΛΕΥΚΗ ΖΩΝΗ
   ============================================================ */

.container-header > .grid-child:not(.container-nav) {
    max-width: none;
    padding: 14px 0;
    background-color: #f0f9ff;
}

.container-header .navbar-brand {
    display: flex;
    justify-content: center;
    max-width: var(--site-max);
    margin: 0 auto;
    padding: 0 1rem;
}

.container-header .brand-logo img {
    max-width: 100%;
    height: auto;
}


/* ============================================================
   6. STICKY HEADER
   ============================================================ */

@media (min-width: 992px) {
    .container-header.sticky-top {
        top: -206px;
    }
}


/* ============================================================
   7. SLIDER ΑΡΧΙΚΗΣ ΣΕΛΙΔΑΣ
   ============================================================ */

/* ============================================================
   TOP ΕΚΠΑΙΔΕΥΤΙΚΕΣ ΕΙΔΗΣΕΙΣ (mod_articles, layout=topstory)
   Αντικαθιστά το παλιό .dide-slider μπλοκ στο user.css
   ============================================================ */

.dide-top {
    max-width: var(--dide-top-width);
    margin: 0 auto 34px;
    padding: 20px;
    border-radius: 12px;
    background-color: #fcfbf7;
}

/* --- Επικεφαλίδα --- */
.dide-top-heading {
    background-color: var(--top-accent);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
    padding: 7px 16px;
    border-radius: 30px;
    color: #fff;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.dide-top-heading::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: #fff;
}

/* --- Κύριο μέρος: εικόνα αριστερά, κείμενο δεξιά --- */
.dide-top-main {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: 20px;
    align-items: start;
    margin-bottom: 16px;
}

.dide-top-media {
    display: block;
    overflow: hidden;
    border-radius: 10px;
    background-color: #eef2f6;
}

.dide-top-media img,
.dide-top-noimage {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    transition: transform .4s ease;
}

.dide-top-noimage {
    background: linear-gradient(135deg, #1f3a4d, steelblue);
}

.dide-top-media:hover img {
    transform: scale(1.03);
}

/* --- Δεξιά στήλη --- */
.dide-top-side {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.dide-top-badge {
    margin-bottom: 10px;
    padding: 3px 10px;
    border-radius: 4px;
    background-color: #b5563c;
    color: #fff;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.dide-top-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    overflow: hidden;
    color: #1d3557;
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.28;
    text-decoration: none;
    text-wrap: balance;
}

.dide-top-title:hover {
    color: #0066cc;
}

.dide-top-date {
    margin-top: 10px;
    color: #64748b;
    font-size: .78rem;
}

.dide-top-pause {
    margin-top: auto;
    padding-top: 12px;
    border: none;
    background: none;
    color: #64748b;
    font-size: .72rem;
    cursor: pointer;
}

.dide-top-pause:hover {
    color: steelblue;
}

/* --- Οι μικρογραφίες από κάτω --- */
.dide-top-thumbs {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
}

.dide-top-thumb {
    position: relative;
    display: flex;
    flex-direction: column;
    padding-bottom: 8px;
    border-top: 3px solid transparent;
    color: #1d3557;
    text-decoration: none;
    transition: border-color .2s ease;
}

.dide-top-thumb.is-active {
    border-top-color: var(--top-accent);
    
}

.dide-top-thumb-media {
    display: block;
    overflow: hidden;
    margin: 8px 0 7px;
    border-radius: 6px;
    background-color: #eef2f6;
}

.dide-top-thumb-media img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.dide-top-thumb-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.3;
}

.dide-top-thumb:hover .dide-top-thumb-title {
    color: #0066cc;
}

/* Η μπάρα χρόνου */
.dide-top-thumb-track {
    position: absolute;
    top: -3px;
    left: 0;
    right: 0;
    height: 3px;
    background-color: #e2e8f0;
}

.dide-top-thumb.is-active .dide-top-thumb-track {
    background-color: rgba(92, 77, 154, .25);
}

.dide-top-thumb-bar {
    background-color: var(--top-accent);
    display: block;
    width: 0;
    height: 100%;
}

/* --- Κινητό --- */
@media (max-width: 700px) {
    .dide-top-main {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .dide-top-title {
        font-size: 1.05rem;
        -webkit-line-clamp: 4;
        line-clamp: 4;
    }

    .dide-top-thumbs {
        grid-template-columns: 1fr 1fr;
    }

    .dide-top-pause {
        margin-top: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dide-top-media img,
    .dide-top-thumb {
        transition: none;
    }

    .dide-top-media:hover img {
        transform: none;
    }
}

.container-banner {
    padding-left: 1rem;
    padding-right: 1rem;
}


/* ============================================================
   8. ΚΑΡΤΕΣ ΑΡΘΡΩΝ (mod_articles, layout=cards)
   Χρησιμοποιούνται αποκλειστικά μέσα στα θεματικά blocks
   της ενότητας 9 — δεν χρειάζεται ξεχωριστό μέγεθος
   "αρχικής" έναντι "block", υπάρχει μόνο ένα πλαίσιο πια.
   ============================================================ */

.dide-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 0;
}

@media (max-width: 700px) {
    .dide-cards {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .dide-cards {
        grid-template-columns: 1fr;
    }
}

.dide-card {
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-top: 4px solid var(--block-accent, steelblue);
    border-radius: 10px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .05),
                0 2px 4px -1px rgba(0, 0, 0, .03);
    transition: transform .25s ease,
                box-shadow .25s ease,
                border-color .25s ease;
}

.dide-card:hover,
.dide-card:focus-within {
    transform: translateY(-4px);
    border-color: var(--block-accent, steelblue);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .10),
                0 10px 10px -5px rgba(0, 0, 0, .04);
}

.dide-card-media {
    overflow: hidden;
    background-color: #eef2f6;
}

.dide-card-media img,
.dide-card-noimage {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    transition: transform .35s ease;
}

.dide-card-noimage {
    background: linear-gradient(135deg, #1f3a4d, steelblue);
}

.dide-card:hover .dide-card-media img {
    transform: scale(1.04);
}

.dide-card-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: 12px 14px 14px;
}

.dide-card-cat {
    align-self: flex-start;
    margin-bottom: .5rem;
    padding: 2px 9px;
    border-radius: 20px;
    background-color: #eef3f8;
    color: var(--block-accent, #0066cc);
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
}

.dide-card-title {
    margin: 0;
    font-size: .95rem;
    font-weight: 700;
    line-height: 1.32;
    text-align: left;
    text-wrap: balance;

    /* μέγιστο 4 γραμμές */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    overflow: hidden;
}

.dide-card-title a,
.dide-card-title a:visited {
    color: #1d3557;
    text-decoration: none;
}

.dide-card:hover .dide-card-title a {
    color: #0066cc;
}

.dide-card-date {
    margin-top: auto;
    padding-top: .7rem;
    color: #64748b;
    font-size: .78rem;
}

.dide-card-flags,
.dide-card-icons {
    position: relative;
    z-index: 2;
    margin-top: .6rem;
}

.dide-card-unpublished {
    border-top-color: #f0ad4e;
}

@media (prefers-reduced-motion: reduce) {
    .dide-card,
    .dide-card-media img {
        transition: none;
    }

    .dide-card:hover {
        transform: none;
    }

    .dide-card:hover .dide-card-media img {
        transform: none;
    }
}


/* ============================================================
   9. ΘΕΜΑΤΙΚΑ BLOCKS (main-top / main-bottom)

   ΣΗΜΑΝΤΙΚΟ: το Cassiopeia ΔΕΝ τυλίγει τα modules αυτών
   των θέσεων σε container div με ξεχωριστή κλάση — γι' αυτό
   στοχεύουμε με "Πρόσθετη Κλάση CSS" που δίνουμε εμείς σε
   κάθε module (Ένθεμα → Προηγμένες Επιλογές):

       dide-catblock

   Βάλε αυτή την κλάση σε ΟΛΑ τα modules κατηγοριών
   (Εκπαιδευτικοί, Μαθητές, Σχολικές Μονάδες, Συνέδρια).
   ============================================================ */

.dide-catblock {
    background: none;
    border: none;
    box-shadow: none;
    margin-bottom: 34px;
}

.dide-catblock .card-body {
    padding: 0;
}

.dide-catblock .card-header,
.dide-catblock > h3,
.dide-catblock .card-body > h3 {
    display: inline-block;
    margin: 0 0 18px;
    padding: 6px 18px;
    border: none;
    border-radius: 30px;
    background-color: var(--block-accent, steelblue);
    color: #fff;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
}
.dide-catblock {
    background-color: #fcfbf7 !important;
    max-width: var(--dide-content-width);
    padding: 20px;
    border-radius: 12px;
}
.dide-cb-mathites { --block-accent: #b5563c; }   /* Μαθητές — τερακότα */
.dide-cb-sxolika   { --block-accent: #2f7d5f; }   /* Σχολικές Μονάδες — πράσινο */
.dide-cb-roi      { --block-accent: #4a6572; }   /* Ροή ειδήσεων — γκρι-μπλε */
/* Η ροή ειδήσεων σε δύο στήλες — οι τίτλοι εδώ είναι μακριοί */
.dide-cb-roi .dide-cards {
    grid-template-columns: repeat(2, 1fr);
}

@media (max-width: 480px) {
    .dide-cb-roi .dide-cards {
        grid-template-columns: 1fr;
    }
}
.dide-cb-leitourgia { --block-accent: #5b8f76; }
.dide-divider {
    display: block;
    max-width: 700px;
    margin: 0 auto 34px;
    border-radius: 10px;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease;
}

.dide-divider img {
    display: block;
    width: 100%;
    height: auto;
}

.dide-divider:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, .12);
}
.dide-divider {
    display: block;
    max-width: var(--dide-content-width);
    margin: 0 0 34px;   /* ήταν: 0 auto 34px */
    border-radius: 10px;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease;
}
.dide-divider-wrap {
    max-width: var(--dide-content-width);
    background: none;
    border: none;
    box-shadow: none;
    padding: 0;
}

.dide-divider-wrap .card-body {
    padding: 0;
}
/** site background color**/
body.site {
    background-color: #f3f0e7;
}
/* ============================================================
   ΚΟΥΜΠΙΑ "ΔΕΣ ΠΕΡΙΣΣΟΤΕΡΑ" / "ΛΙΓΟΤΕΡΑ" ΣΤΑ BLOCKS
   Προσθήκη μετά την ενότητα 9 του user.css
   ============================================================ */

/* Απαραίτητο: το .dide-card έχει display:flex που αλλιώς
   θα υπερίσχυε του hidden και θα φαίνονταν όλα τα άρθρα */
.dide-card[hidden] {
    display: none;
}

/* Όταν πατιέται "Λιγότερα" η σελίδα ανεβαίνει στην αρχή του block —
   αυτό κρατάει την αρχή του ορατή κάτω από το sticky μενού */
.dide-cards-wrap {
    scroll-margin-top: 90px;
}

.dide-cards-nav {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 18px;
}

.dide-more-btn {
    padding: 8px 20px;
    border: 2px solid var(--block-accent, steelblue);
    border-radius: 30px;
    background-color: #fff;
    color: var(--block-accent, steelblue);
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .3px;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease;
}

.dide-more-btn:hover,
.dide-more-btn:focus-visible {
    background-color: var(--block-accent, steelblue);
    color: #fff;
}

.dide-more-btn[hidden] {
    display: none;
}

/* ============================================================
   10. ΔΕΞΙΑ ΣΤΗΛΗ — ΧΡΗΣΙΜΟΙ ΣΥΝΔΕΣΜΟΙ
   ============================================================ */

.dide-links {
    background: none;
    border: none;
    box-shadow: none;
    margin-bottom: 28px;
}

.dide-links .card-body {
    padding: 0;
}

.dide-links .card-header,
.dide-links > h3,
.dide-links .card-body > h3 {
    display: inline-block;
    margin: 0 0 14px;
    padding: 6px 16px;
    border: none;
    border-radius: 30px;
    background-color: #4a6572;
    color: #fff;
    font-size: .92rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
}

.dide-links-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.dide-links-grid a {
    display: block;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background-color: #fff;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.dide-links-grid img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.dide-links-grid a:hover {
    transform: translateY(-3px);
    border-color: steelblue;
    box-shadow: 0 10px 18px -6px rgba(0, 0, 0, .18);
}
@media (min-width: 992px) {
    .container-sidebar-right {
        border-left: 1px solid #ddd7c9;
        padding-left: 26px;
    }
}
/* --- Ροή Διαύγειας --- */

.dide-feed {
    background: none;
    border: none;
    box-shadow: none;
    margin-bottom: 28px;
}

.dide-feed .card-body {
    padding: 0;
}

.dide-feed .card-header,
.dide-feed > h3,
.dide-feed .card-body > h3 {
    display: inline-block;
    margin: 0 0 14px;
    padding: 6px 16px;
    border: none;
    border-radius: 30px;
    background-color: #4a6572;
    color: #fff;
    font-size: .92rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
}

.dide-feed ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dide-feed li {
    margin-bottom: 10px;
    padding: 10px 12px;
    border-left: 3px solid steelblue;
    border-radius: 0 6px 6px 0;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .04);
    transition: border-color .2s ease, transform .2s ease;
}

.dide-feed li:hover {
    border-left-color: #0066cc;
    transform: translateX(2px);
}

.dide-feed li a {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
    color: #1d3557;
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.35;
    text-decoration: none;
}

.dide-feed li a:hover {
    color: #0066cc;
}

.dide-feed .feed-item-date,
.dide-feed li span {
    display: block;
    margin-top: 5px;
    color: #64748b;
    font-size: .72rem;
}
/* ============================================================
   11. ΔΙΑΤΑΞΗ ΑΡΧΙΚΗΣ — ΤΡΕΙΣ ΣΤΗΛΕΣ
   ============================================================ */

@media (min-width: 1360px) {
    body.view-featured .site-grid {
        grid-template-columns:
            [full-start] minmax(1rem, 1fr)
            [main-start] 700px
            24px
            280px
            24px
            280px [main-end]
            minmax(1rem, 1fr)
            [full-end];
    }

    body.view-featured .container-component     { grid-column: 2 / 3; }
    body.view-featured .container-sidebar-left  { grid-column: 4 / 5; }
    body.view-featured .container-sidebar-right { grid-column: 6 / 7; }

    body.view-featured .full-width {
        grid-column: full-start / full-end;
    }
}
/* Διαχωριστικές γραμμές των δύο πλαϊνών στηλών */
@media (min-width: 992px) {
    .container-sidebar-left,
    .container-sidebar-right {
        border-left: 1px solid #ddd7c9;
        padding-left: 26px;
    }
}
/* ============================================================
   12. ACCORDIONS ΔΕΞΙΑΣ ΣΤΗΛΗΣ
   Module: Custom HTML, θέση sidebar-right,
   Κλάση Ενθέματος: dide-acc-wrap
   ============================================================ */

.dide-acc-wrap {
    background: none;
    border: none;
    box-shadow: none;
    margin-bottom: 28px;
}

.dide-acc-wrap .card-body {
    padding: 0;
}

/* Επικεφαλίδα — ίδιο pill με τα υπόλοιπα της στήλης */
.dide-acc-wrap .card-header,
.dide-acc-wrap > h3,
.dide-acc-wrap .card-body > h3 {
    display: inline-block;
    margin: 0 0 14px;
    padding: 6px 16px;
    border: none;
    border-radius: 30px;
    background-color: #4a6572;
    color: #fff;
    font-size: .92rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
}

/* --- Το ίδιο το accordion --- */
.dide-acc {
    --bs-accordion-border-color: #e2e8f0;
    --bs-accordion-border-radius: 8px;
    --bs-accordion-btn-focus-box-shadow: none;
}

.dide-acc .accordion-item {
    margin-bottom: 8px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
    background-color: #fff;
}

.dide-acc .accordion-button {
    padding: 11px 14px;
    background-color: #fff;
    color: #1d3557;
    font-size: .84rem;
    font-weight: 700;
    line-height: 1.3;
    box-shadow: none;
}

.dide-acc .accordion-button:not(.collapsed) {
    background-color: #eef3f8;
    color: steelblue;
    box-shadow: none;
}

.dide-acc .accordion-button::after {
    width: 1rem;
    height: 1rem;
    background-size: 1rem;
    flex-shrink: 0;
}

.dide-acc .accordion-body {
    padding: 12px 14px;
    color: #44525e;
    font-size: .8rem;
    line-height: 1.5;
}

.dide-acc .accordion-body a {
    color: steelblue;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.dide-acc .accordion-body a:hover {
    color: #0066cc;
}
/* ============================================================
   13. ΛΙΣΤΑ ΑΡΘΡΩΝ ΠΛΑΪΝΗΣ ΣΤΗΛΗΣ (layout=sidelist)
   Module: Άρθρα, θέση sidebar-right,
   Κλάση Ενθέματος: dide-sidelist-wrap
   ============================================================ */

.dide-sidelist-wrap {
    background: none;
    border: none;
    box-shadow: none;
    margin-bottom: 28px;
}

.dide-sidelist-wrap .card-body {
    padding: 0;
}

/* Επικεφαλίδα — ίδιο pill με τα υπόλοιπα της στήλης */
.dide-sidelist-wrap .card-header,
.dide-sidelist-wrap > h3,
.dide-sidelist-wrap .card-body > h3 {
    display: inline-block;
    margin: 0 0 14px;
    padding: 6px 16px;
    border: none;
    border-radius: 30px;
    background-color: #4a6572;
    color: #fff;
    font-size: .92rem;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: .3px;
    text-transform: uppercase;
}

/* --- Η λίστα (Προεπιλεγμένη διάταξη του module) --- */
.dide-sidelist-wrap ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dide-sidelist-wrap li {
    margin-bottom: 10px;
    padding: 10px 12px;
    border-left: 3px solid steelblue;
    border-radius: 0 6px 6px 0;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .04);
    transition: border-color .2s ease, transform .2s ease;
}

.dide-sidelist-wrap li:hover {
    border-left-color: #0066cc;
    transform: translateX(2px);
}

.dide-sidelist-wrap li h3,
.dide-sidelist-wrap li h4,
.dide-sidelist-wrap li h5 {
    margin: 0;
    padding: 0;
    font-size: .82rem;
    line-height: 1.35;
}

.dide-sidelist-wrap li a {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
    color: #1d3557;
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.35;
    text-decoration: none;
}

.dide-sidelist-wrap li a:hover {
    color: #0066cc;
    text-decoration: none;
}

.dide-sidelist-wrap li time,
.dide-sidelist-wrap li span,
.dide-sidelist-wrap li small {
    display: block;
    margin-top: 6px;
    color: #64748b;
    font-size: .72rem;
    font-weight: 400;
}

.dide-sidelist-wrap li [class*="icon-"] {
    margin-right: 4px;
}
.dide-nomargin {
    margin-bottom: 8px !important;
}

.dide-more-wrap {
    background: none;
    border: none;
    box-shadow: none;
    margin-bottom: 28px;
}

.dide-more-wrap .card-body {
    padding: 0;
}

.dide-more-link {
    display: block;
    padding: 8px 14px;
    border: 2px solid #4a6572;
    border-radius: 30px;
    color: #4a6572;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: background-color .2s ease, color .2s ease;
}

.dide-more-link:hover {
    background-color: #4a6572;
    color: #fff;
}
.dide-oikonomika li a {
    font-size: .88rem;
    letter-spacing: .3px;
}
/* ============================================================
   14. ΣΕΛΙΔΑ ΟΙΚΟΝΟΜΙΚΩΝ ΣΤΟΙΧΕΙΩΝ (layout=budget)
   Module: Άρθρα, θέση main-top,
   Κλάση Ενθέματος: dide-budget-wrap
   ============================================================ */

.dide-budget-wrap {
    background: none;
    border: none;
    box-shadow: none;
}

.dide-budget-wrap .card-body {
    padding: 0;
}

.dide-budget-wrap .card-header,
.dide-budget-wrap > h3,
.dide-budget-wrap .card-body > h3 {
    display: inline-block;
    margin: 0 0 22px;
    padding: 8px 20px;
    border: none;
    border-radius: 30px;
    background-color: #4a6572;
    color: #fff;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
}

/* --- Κάθε έτος --- */
.dide-budget-year {
    margin-bottom: 24px;
    padding: 18px 20px;
    border: 1px solid #e8e6e0;
    border-radius: 12px;
    background-color: #fcfbf7;
}

.dide-budget-title {
    margin: 0 0 14px;
    padding: 0 0 10px;
    border-bottom: 2px solid steelblue;
    color: #1d3557;
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: .5px;
}

/* --- Οι μήνες --- */
.dide-budget-months {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dide-budget-months li {
    margin: 0;
}

.dide-budget-months a,
.dide-budget-empty {
    display: block;
    padding: 9px 10px;
    border-radius: 8px;
    font-size: .86rem;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
}

.dide-budget-months a {
    border: 1px solid #d6e0ea;
    background-color: #fff;
    color: steelblue;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.dide-budget-months a:hover,
.dide-budget-months a:focus-visible {
    background-color: steelblue;
    border-color: steelblue;
    color: #fff;
    transform: translateY(-2px);
}

/* Μήνες χωρίς ανάρτηση — ορατοί αλλά σβηστοί */
.dide-budget-empty {
    border: 1px dashed #ddd7c9;
    background-color: transparent;
    color: #b0aa9c;
    font-weight: 400;
}

/* --- Μικρότερες οθόνες --- */
@media (max-width: 900px) {
    .dide-budget-months {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 600px) {
    .dide-budget-months {
        grid-template-columns: repeat(3, 1fr);
    }

    .dide-budget-year {
        padding: 14px;
    }

    .dide-budget-months a,
    .dide-budget-empty {
        padding: 8px 4px;
        font-size: .78rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dide-budget-months a {
        transition: none;
    }

    .dide-budget-months a:hover {
        transform: none;
    }
}
/* ============================================================
   15. BLOCK «ΧΡΗΣΙΜΑ» (layout=useful)
   Ένθεμα: Άρθρα, δεξιά στήλη,
   Κλάση Ενθέματος: dide-useful
   ============================================================ */

.dide-useful {
    --useful-accent: #b07d10;
}

/* --- Επικεφαλίδα --- */
.dide-useful .card-header {
    margin-bottom: 14px;
    padding: 0 0 8px;
    border: none;
    border-bottom: 3px solid var(--useful-accent);
    background: none;
    color: #1d3557;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
}

.dide-useful .card-body {
    padding: 0;
}

/* --- Οι κάρτες --- */
.dide-useful-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.dide-useful-item {
    position: relative;
    padding: 12px 14px 12px 16px;
    border: 1px solid #e8e2d4;
    border-left: 4px solid var(--useful-accent);
    border-radius: 8px;
    background-color: #fffdf8;
    transition: box-shadow .2s ease, transform .2s ease;
}

.dide-useful-item:hover {
    box-shadow: 0 3px 10px rgba(0, 0, 0, .08);
    transform: translateY(-1px);
}

/* --- Τίτλος --- */
.dide-useful-title {
    margin: 0;
    font-size: .92rem;
    font-weight: 600;
    line-height: 1.35;
}

.dide-useful-title a {
    color: #1d3557;
    text-decoration: none;
}

.dide-useful-title a:hover,
.dide-useful-title a:focus-visible {
    color: var(--useful-accent);
    text-decoration: underline;
}

/* --- Προθεσμία --- */
.dide-useful-deadline {
    margin: 7px 0 0;
    padding-top: 7px;
    border-top: 1px dotted #ddd7c9;
    color: #b3261e;
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.3;
}

/* --- Ημερομηνία --- */
.dide-useful-date {
    display: block;
    margin-top: 8px;
    color: #8a8478;
    font-size: .74rem;
}

/* --- Σύνδεσμος προς όλη την ετικέτα --- */
.dide-useful-all {
    display: inline-block;
    margin-top: 12px;
    color: var(--useful-accent);
    font-size: .82rem;
    font-weight: 600;
    text-decoration: none;
}

.dide-useful-all::after {
    content: " →";
}

.dide-useful-all:hover,
.dide-useful-all:focus-visible {
    text-decoration: underline;
}

@media (prefers-reduced-motion: reduce) {
    .dide-useful-item {
        transition: none;
    }

    .dide-useful-item:hover {
        transform: none;
    }
}
/* ============================================================
   16. ΠΡΟΒΟΛΗ ΚΑΤΗΓΟΡΙΑΣ — πλέγμα 4 στηλών
   ============================================================ */

.dide-catblog {
    --catlist-accent: steelblue;
}

/* --- Επικεφαλίδα και περιγραφή --- */
.dide-catblog-heading {
    margin: 0 0 6px;
    padding-bottom: 10px;
    border-bottom: 3px solid var(--catlist-accent);
    color: #1d3557;
    font-size: 1.5rem;
    font-weight: 700;
}

.dide-catblog-desc {
    margin: 14px 0 0;
    color: #5a5348;
    font-size: .92rem;
}

/* --- Το πλέγμα --- */
.dide-catlist {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
    margin-top: 26px;
}

/* --- Η κάρτα --- */
.dide-catlist-item {
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #e6e1d5;
    border-radius: 10px;
    background-color: #fff;
    transition: box-shadow .2s ease, transform .2s ease;
}

.dide-catlist-item:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, .1);
    transform: translateY(-3px);
}

/* --- Εικόνα σε σταθερή αναλογία, ώστε να μη χορεύουν τα ύψη --- */
.dide-catlist-media {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background-color: #fff;
    padding: 10px;
}

.dide-catlist-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

/* --- Σώμα --- */
.dide-catlist-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 14px 15px 16px;
}

.dide-catlist-title {
    margin: 0;
    font-size: .95rem;
    font-weight: 600;
    line-height: 1.35;
}

.dide-catlist-title a {
    color: #1d3557;
    text-decoration: none;
}

.dide-catlist-item:hover .dide-catlist-title a {
    color: var(--catlist-accent);
}

.dide-catlist-date {
    margin-top: 8px;
    color: #8a8478;
    font-size: .76rem;
}

/* Σπρώχνει το «Περισσότερα» στη βάση, ώστε να ευθυγραμμίζεται
   σε όλες τις κάρτες της σειράς όποιο κι αν είναι το μήκος του τίτλου */
.dide-catlist-more {
    margin-top: auto;
    padding-top: 12px;
    color: var(--catlist-accent);
    font-size: .8rem;
    font-weight: 600;
}

.dide-catlist-more::after {
    content: " →";
}

/* --- Άρθρα χωρίς εικόνα (link items) --- */
.dide-catlist-links {
    margin: 26px 0 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid #e6e1d5;
}

.dide-catlist-links li {
    border-bottom: 1px solid #efebe1;
}

.dide-catlist-links a {
    display: block;
    padding: 10px 2px;
    color: #1d3557;
    font-size: .9rem;
    text-decoration: none;
}

.dide-catlist-links a:hover {
    color: var(--catlist-accent);
}

/* --- Σελιδοποίηση --- */
.dide-catlist-pagination {
    margin-top: 30px;
    display: flex;
    justify-content: center;
}

/* --- Μικρότερες οθόνες --- */
@media (max-width: 1200px) {
    .dide-catlist {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 860px) {
    .dide-catlist {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 520px) {
    .dide-catlist {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dide-catlist-item {
        transition: none;
    }

    .dide-catlist-item:hover {
        transform: none;
    }
}
/* --- Διαδρομή πλοήγησης --- breadcrumb*/
.breadcrumb {
    margin: 0 0 18px;
    padding: 0;
    background: none;
    font-size: .82rem;
}

.breadcrumb-item a {
    color: #6b6558;
    text-decoration: none;
}

.breadcrumb-item a:hover {
    color: steelblue;
    text-decoration: underline;
}

.breadcrumb-item.active {
    color: #1d3557;
    font-weight: 600;
}
/* ============================================================
   17. ΠΛΗΡΗΣ ΠΡΟΒΟΛΗ ΑΡΘΡΟΥ
   ============================================================ */

.dide-article {
    --article-accent: steelblue;

    max-width: 980px;
    margin: 0 auto 30px;
    padding: 34px 40px 38px;
    border: 1px solid #e6e1d5;
    border-radius: 12px;
    background-color: #fff;
}

/* --- Τίτλος --- */
.dide-article-header {
    margin: 0 0 14px;
    padding: 0;
    border: none;
}

.dide-article-title {
    margin: 0;
    padding: 0 0 14px;
    border-bottom: 3px solid var(--article-accent);
    color: #1d3557;
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.25;
    text-transform: none;
}

/* --- Μπλοκ πληροφοριών --- */
.dide-article-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
    margin-bottom: 22px;
    color: #8a8478;
    font-size: .82rem;
}

.dide-article-meta-below {
    margin: 26px 0 0;
    padding-top: 14px;
    border-top: 1px solid #e6e1d5;
}

.dide-article-cat {
    padding: 3px 11px;
    border-radius: 20px;
    background-color: #ece7da;
    color: #4a6572;
    font-weight: 600;
    text-decoration: none;
}

.dide-article-cat:hover,
.dide-article-cat:focus-visible {
    background-color: var(--article-accent);
    color: #fff;
}

/* --- Ετικέτες --- */
.dide-article .tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0 0 22px;
    padding: 0;
    list-style: none;
}

.dide-article .tags > span {
    display: inline-block;
}

.dide-article .tags a,
.dide-article .tags a.btn,
.dide-article .tags a.btn-info {
    display: inline-block;
    padding: 3px 11px;
    border: 1px solid #d9d3c4;
    border-radius: 20px;
    background: none;
    background-color: transparent;
    box-shadow: none;
    color: #8a8478;
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.5;
    text-decoration: none;
}

.dide-article .tags a:hover,
.dide-article .tags a.btn:hover,
.dide-article .tags a:focus-visible {
    border-color: var(--article-accent);
    background-color: transparent;
    color: var(--article-accent);
}

/* --- Εικόνα πλήρους άρθρου --- */
.dide-article-image:not(:empty) {
    margin: 0 0 26px;
    text-align: center;
}

.dide-article-image figure {
    margin: 0;
}

.dide-article-image img {
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 420px;
    border-radius: 10px;
}

.dide-article-image figcaption {
    margin-top: 8px;
    color: #8a8478;
    font-size: .8rem;
    font-style: italic;
}

/* --- Σώμα κειμένου --- */
.dide-article-body {
    color: #2e2a24;
    font-size: 1rem;
    line-height: 1.75;
    overflow-x: auto;
}

.dide-article-body > *:first-child {
    margin-top: 0;
}

.dide-article-body p {
    margin: 0 0 1.1em;
}

.dide-article-body h2,
.dide-article-body h3,
.dide-article-body h4 {
    margin: 1.8em 0 .6em;
    color: #1d3557;
    font-weight: 700;
    line-height: 1.3;
}

.dide-article-body h2 { font-size: 1.3rem; }
.dide-article-body h3 { font-size: 1.12rem; }
.dide-article-body h4 { font-size: 1rem; }

.dide-article-body a {
    color: var(--article-accent);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.dide-article-body a:hover {
    color: #1d3557;
}

.dide-article-body ul,
.dide-article-body ol {
    margin: 0 0 1.1em;
    padding-left: 1.4em;
}

.dide-article-body li {
    margin-bottom: .4em;
}

.dide-article-body img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}

.dide-article-body blockquote {
    margin: 1.4em 0;
    padding: 2px 0 2px 18px;
    border-left: 4px solid var(--article-accent);
    color: #4a4439;
    font-style: italic;
}

.dide-article-body hr {
    margin: 2em 0;
    border: none;
    border-top: 1px solid #e0dacb;
}

/* --- Πίνακες μέσα στο άρθρο --- */
.dide-article-body table {
    width: 100%;
    margin: 1.4em 0;
    border-collapse: collapse;
    font-size: .9rem;
    line-height: 1.5;
}

.dide-article-body table th,
.dide-article-body table td {
    padding: 9px 12px;
    border: 1px solid #ddd7c9;
    text-align: left;
    vertical-align: top;
}

.dide-article-body table th,
.dide-article-body table thead td {
    background-color: var(--article-accent);
    color: #fff;
    font-weight: 600;
}

.dide-article-body table tbody tr:nth-child(even) td {
    background-color: #faf8f3;
}

/* --- Κοινοποίηση --- */
.dide-share {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 30px 0 0;
    padding-top: 18px;
    border-top: 1px solid #e6e1d5;
}

.dide-share-label {
    margin-right: 4px;
    color: #8a8478;
    font-size: .8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .4px;
}

.dide-share-btn {
    display: inline-block;
    padding: 6px 14px;
    border: 1px solid #d9d3c4;
    border-radius: 20px;
    background-color: #fff;
    color: #4a4439;
    font-family: inherit;
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.4;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.dide-share-btn:hover,
.dide-share-btn:focus-visible {
    background-color: var(--article-accent);
    border-color: var(--article-accent);
    color: #fff;
    text-decoration: none;
}

.dide-share-fb:hover    { background-color: #1877f2; border-color: #1877f2; }
.dide-share-x:hover     { background-color: #111;    border-color: #111; }
.dide-share-mail:hover  { background-color: #4a6572; border-color: #4a6572; }

.dide-share-btn.is-done {
    background-color: #2f7d5f;
    border-color: #2f7d5f;
    color: #fff;
}

/* --- Συνημμένα (πρόσθετο Attachments) --- */
.dide-article .attachmentsContainer {
    margin-top: 26px;
    padding: 16px 20px 18px;
    border: 1px solid #e6e1d5;
    border-radius: 10px;
    background-color: #fcfbf7;
}

.dide-article .attachmentsList table {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
}

.dide-article .attachmentsList caption {
    caption-side: top;
    padding: 0 0 10px;
    color: #4a4439;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-align: left;
    text-transform: uppercase;
}

.dide-article .attachmentsList td {
    padding: 8px 0;
    border: none;
    border-bottom: 1px solid #ece7da;
    vertical-align: middle;
}

.dide-article .attachmentsList tr:last-child td {
    border-bottom: none;
}

/* Η στήλη περιγραφής τυπώνει πάντα ένα κενό [ ] */
.dide-article .attachmentsList .at_description {
    display: none;
}

.dide-article .attachmentsList .at_filename a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--article-accent);
    font-size: .88rem;
    font-weight: 600;
    text-decoration: none;
}

.dide-article .attachmentsList .at_filename a:hover,
.dide-article .attachmentsList .at_filename a:focus-visible {
    color: #1d3557;
    text-decoration: underline;
}

.dide-article .attachmentsList .at_filename img {
    width: 16px;
    height: 16px;
}

.dide-article .attachmentsList .at_file_size {
    width: 90px;
    color: #8a8478;
    font-size: .78rem;
    text-align: right;
    white-space: nowrap;
}
/* --- Προηγούμενο / Επόμενο --- */
.dide-article .pagenavigation,
.dide-article .pager {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 30px;
    padding-top: 18px;
    border-top: 1px solid #e6e1d5;
    list-style: none;
}

.dide-article .pagenavigation a,
.dide-article .pager a {
    display: inline-block;
    padding: 8px 16px;
    border: 1px solid #d9d3c4;
    border-radius: 8px;
    background-color: #fff;
    color: #4a4439;
    font-size: .85rem;
    font-weight: 600;
    text-decoration: none;
}

.dide-article .pagenavigation a:hover,
.dide-article .pager a:hover {
    background-color: var(--article-accent);
    border-color: var(--article-accent);
    color: #fff;
}

/* ------------------------------------------------------------
   Δείτε επίσης
   ------------------------------------------------------------ */

.dide-related {
    margin-top: 36px;
    padding-top: 24px;
    border-top: 1px solid #e6e1d5;
}

.dide-related-title {
    margin: 0 0 18px;
    color: #1d3557;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
}

.dide-related-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

.dide-related-item {
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #e6e1d5;
    border-radius: 10px;
    background-color: #fcfbf7;
    transition: box-shadow .2s ease, transform .2s ease;
}

.dide-related-item:hover {
    box-shadow: 0 4px 14px rgba(0, 0, 0, .08);
    transform: translateY(-2px);
}

.dide-related-media {
    aspect-ratio: 16 / 10;
    padding: 8px;
    overflow: hidden;
    background-color: #fff;
}

.dide-related-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.dide-related-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 12px 13px 14px;
}

.dide-related-item-title {
    margin: 0;
    font-size: .86rem;
    font-weight: 600;
    line-height: 1.35;
}

.dide-related-item-title a {
    color: #1d3557;
    text-decoration: none;
}

.dide-related-item:hover .dide-related-item-title a {
    color: var(--article-accent);
}

.dide-related-date {
    margin-top: auto;
    padding-top: 8px;
    color: #8a8478;
    font-size: .74rem;
}

/* --- Μικρότερες οθόνες --- */
@media (max-width: 900px) {
    .dide-related-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .dide-article {
        padding: 22px 18px 26px;
        border-radius: 8px;
    }

    .dide-article-title {
        font-size: 1.35rem;
    }

    .dide-share-label {
        width: 100%;
        margin-bottom: 4px;
    }

    .dide-related-grid {
        grid-template-columns: 1fr;
    }
}

/* --- Εκτύπωση --- */
@media print {
    .dide-share,
    .dide-related,
    .dide-article .pagenavigation,
    .dide-article .pager,
    .container-header,
    .container-banner,
    .container-sidebar-left,
    .container-sidebar-right,
    .container-footer,
    .container-breadcrumbs {
        display: none !important;
    }

    .dide-article {
        max-width: none;
        padding: 0;
        border: none;
    }

    .dide-article-body {
        overflow: visible;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dide-share-btn,
    .dide-related-item {
        transition: none;
    }

    .dide-related-item:hover {
        transform: none;
    }
}
/* ============================================================
   18. FOOTER
   Ένθεμα: Προσαρμοσμένο HTML, θέση footer,
   Κλάση Ενθέματος: dide-footer-mod
   ============================================================ */

.dide-footer {
    --foot-text: rgba(255, 255, 255, .78);
    --foot-strong: #fff;
    --foot-rule: rgba(255, 255, 255, .18);

    max-width: var(--site-max, 1320px);
    margin: 0 auto;
    padding: 14px 0 6px;
    color: var(--foot-text);
    font-size: .88rem;
    line-height: 1.6;
    text-align: left;
}

/* --- Οι στήλες --- */
.dide-footer-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 30px 36px;
}

.dide-footer-col {
    min-width: 0;
}

.dide-footer-name {
    margin: 0 0 8px;
    color: var(--foot-strong);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
}

.dide-footer-parent {
    margin: 0;
    font-size: .8rem;
    opacity: .72;
}

.dide-footer-head {
    margin: 0 0 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--foot-rule);
    color: var(--foot-strong);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .6px;
    text-transform: uppercase;
}

.dide-footer-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dide-footer-list li {
    margin-bottom: 7px;
}

.dide-footer-list li:last-child {
    margin-bottom: 0;
}

.dide-footer-list strong {
    color: var(--foot-strong);
    font-size: .95rem;
}

.dide-footer-note {
    font-size: .78rem;
    opacity: .66;
}

/* --- Σύνδεσμοι: υπογράμμιση μόνο στο hover --- */
.dide-footer a {
    color: var(--foot-text);
    text-decoration: none;
    font-weight: 400;
}

.dide-footer a:hover,
.dide-footer a:focus-visible {
    color: var(--foot-strong);
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* --- Κάτω γραμμή --- */
.dide-footer-bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-top: 26px;
    padding-top: 14px;
    border-top: 1px solid var(--foot-rule);
    font-size: .78rem;
    opacity: .72;
}

/* --- Μικρότερες οθόνες --- */
@media (max-width: 992px) {
    .dide-footer-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 26px 30px;
    }
}

@media (max-width: 560px) {
    .dide-footer-grid {
        grid-template-columns: 1fr;
    }

    .dide-footer-bottom {
        justify-content: flex-start;
    }
}

@media print {
    .dide-footer {
        display: none;
    }
}
.container-footer {
    background-color: #24456b;
    background-image: none;
}
.dide-footer-list a[target="_blank"] {
    text-decoration: underline;
    text-decoration-color: rgba(255, 255, 255, .35);
    text-underline-offset: 3px;
}

.dide-footer-list a[target="_blank"]:hover {
    text-decoration-color: currentColor;
}
/* ============================================================
   19. ΑΝΑΖΗΤΗΣΗ ΣΤΗ ΜΠΑΡΑ ΤΟΥ ΜΕΝΟΥ
   Ένθεμα: Έξυπνη Αναζήτηση, θέση search
   ============================================================ */

.mod-finder {
    margin: 0;
}

.mod-finder .mod-finder__search,
.mod-finder .input-group {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}

/* --- Το πεδίο --- */
.mod-finder input[type="text"],
.mod-finder input[type="search"],
.mod-finder input.form-control {
    width: 190px;
    height: 34px;
    padding: 0 40px 0 15px;
    border: 1px solid rgba(255, 255, 255, .45);
    border-radius: 20px;
    background-color: rgba(255, 255, 255, .14);
    box-shadow: none;
    color: #fff;
    font-family: inherit;
    font-size: .85rem;
    transition: width .2s ease, background-color .2s ease, border-color .2s ease;
}

.mod-finder input::placeholder {
    color: rgba(255, 255, 255, .72);
    opacity: 1;
}

.mod-finder input:focus {
    width: 240px;
    border-color: #fff;
    background-color: #fff;
    box-shadow: none;
    color: #1d3557;
    outline: none;
}

.mod-finder input:focus::placeholder {
    color: #9a948a;
}

/* --- Το κουμπί με τον φακό --- */
.mod-finder button,
.mod-finder .btn,
.mod-finder [type="submit"] {
    position: absolute;
    top: 0;
    right: 0;
    width: 38px;
    height: 34px;
    padding: 0;
    border: none;
    border-radius: 0 20px 20px 0;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 17px 17px;
    box-shadow: none;
    color: transparent;
    font-size: 0;
    cursor: pointer;
}

/* Σκούρος φακός όταν το πεδίο γίνεται λευκό */
.mod-finder:focus-within button,
.mod-finder:focus-within .btn,
.mod-finder:focus-within [type="submit"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d3557' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E");
}

/* Κρύβει τυχόν εικονίδιο ή κείμενο μέσα στο κουμπί */
.mod-finder button span,
.mod-finder .btn span {
    display: none;
}

/* --- Λίστα αυτόματης συμπλήρωσης --- */
.mod-finder .awesomplete > ul {
    border: 1px solid #ddd7c9;
    border-radius: 8px;
    background-color: #fff;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
    font-size: .85rem;
}

.mod-finder .awesomplete > ul > li {
    padding: 7px 12px;
    color: #2e2a24;
}

.mod-finder .awesomplete > ul > li[aria-selected="true"] {
    background-color: steelblue;
    color: #fff;
}

/* --- Μικρότερες οθόνες --- */
@media (max-width: 1100px) {
    .mod-finder input[type="text"],
    .mod-finder input[type="search"],
    .mod-finder input.form-control {
        width: 150px;
    }

    .mod-finder input:focus {
        width: 190px;
    }
}

@media (max-width: 767px) {
    .mod-finder {
        width: 100%;
        margin: 10px 0 4px;
    }

    .mod-finder input[type="text"],
    .mod-finder input[type="search"],
    .mod-finder input.form-control,
    .mod-finder input:focus {
        width: 100%;
    }
}
/* ============================================================
   20. ΜΕΝΟΥ ΤΡΙΩΝ ΕΠΙΠΕΔΩΝ ΚΑΙ ΘΕΣΗ ΑΝΑΖΗΤΗΣΗΣ
   Αντικαθιστά ΚΑΘΕ προηγούμενη προσθήκη μετά την ενότητα 19.
   ============================================================ */

@media (min-width: 992px) {

    /* --- Όλο το πάνω μενού ζωγραφίζεται πάνω από τη σελίδα --- */
    .container-topbar {
        position: relative;
        z-index: 1100;
    }

    /* --- Κάθε εσωτερικό στοιχείο γίνεται σημείο αναφοράς,
           ώστε το υπομενού του να τοποθετείται ως προς αυτό --- */
    .container-topbar ul.mod-menu ul li {
        position: relative;
    }

    /* --- Άνοιγμα στο hover σε οποιοδήποτε βάθος --- */
    .container-topbar ul.mod-menu li:hover > ul,
    .container-topbar ul.mod-menu li:focus-within > ul {
        display: block !important;
        height: auto !important;
        overflow: visible !important;
    }

    /* --- Δεύτερο επίπεδο: κάτω από το κουμπί, από αριστερά.
           Η λωρίδα είναι στοιχισμένη αριστερά με λίγα στοιχεία,
           οπότε δεν χρειάζεται αναστροφή στα τελευταία. --- */
    .container-topbar ul.mod-menu > li > ul,
    .container-topbar ul.mod-menu > li:last-child > ul,
    .container-topbar ul.mod-menu > li:nth-last-child(2) > ul {
        top: 100%;
        left: 0;
        right: auto;
    }

       /* --- Τρίτο επίπεδο: πλάγια δεξιά, με δικό του πλαίσιο.
           Το !important είναι απαραίτητο — το Metismenu του
           Cassiopeia ορίζει τα ένθετα ul με πιο ειδικούς
           επιλογείς από ό,τι μπορούμε εδώ χωρίς ID. --- */
    .container-topbar ul.mod-menu ul ul,
    .container-topbar ul.mod-menu > li:last-child ul ul,
    .container-topbar ul.mod-menu > li:nth-last-child(2) ul ul {
        position: absolute !important;
        top: -5px !important;
        left: 100% !important;
        right: auto !important;
        z-index: 1100;
        min-width: 240px;
        margin: 0;
        padding: 5px 0;
        list-style: none;
        background-color: #fff !important;
        border: none;
        border-left: 3px solid var(--strip-bg);
        border-radius: 0 6px 6px 0;
        box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
    }

    /* --- Βελάκι πρώτου επιπέδου: λίγος αέρας από τη λέξη --- */
    .container-topbar ul.mod-menu > li.parent > a::after,
    #navbar115 ul.mod-menu > li.parent > a::after {
        margin-left: 7px;
        opacity: .75;
    }

    /* --- Βελάκι εσωτερικών επιπέδων: δείχνει δεξιά --- */
    .container-topbar ul.mod-menu ul li.parent > a::after,
    #navbar115 ul.mod-menu ul li.parent > a::after {
        content: "";
        float: right;
        width: 0;
        height: 0;
        margin-top: 6px;
        margin-left: 12px;
        border-top: 4px solid transparent;
        border-bottom: 4px solid transparent;
        border-left: 5px solid currentColor;
        opacity: .75;
    }

    /* --- Πιο συμπαγείς γραμμές στα υπομενού --- */
    .container-topbar ul.mod-menu ul li a:link,
    .container-topbar ul.mod-menu ul li a:visited,
    .container-topbar ul.mod-menu ul li a:hover,
    .container-topbar ul.mod-menu ul li a:focus,
    .container-topbar ul.mod-menu ul li a:active,
    #navbar115 ul.mod-menu ul li a:link,
    #navbar115 ul.mod-menu ul li a:visited,
    #navbar115 ul.mod-menu ul li a:hover,
    #navbar115 ul.mod-menu ul li a:focus,
    #navbar115 ul.mod-menu ul li a:active {
        padding: 7px 18px;
        line-height: 1.3;
    }

    /* --- Αχνές γραμμές ανάμεσα στις επιλογές --- */
    .container-topbar ul.mod-menu ul > li + li,
    #navbar115 ul.mod-menu ul > li + li {
        border-top: 1px solid #f1ede4;
    }

    /* --- Θέση του πεδίου αναζήτησης ---
           Το .container-nav είναι full-width για τη μπλε μπάρα,
           ενώ το περιεχόμενο σταματά στα --site-max. Το ένθεμα
           είναι αδελφός του .navbar, οπότε χρειάζεται δικό του
           περιθώριο για να ευθυγραμμιστεί με τα υπόλοιπα. --- */
    .container-header .container-nav {
        align-items: center;
    }

    .container-header .container-nav .mod-finder {
        margin-right: max(1rem, calc((100% - var(--site-max)) / 2 + 1rem));
    }
}

/* ------------------------------------------------------------
   21. any hover - Κουμπιά ανάπτυξης της Joomla

   Το (hover: none) της ενότητας 4 κοιτά μόνο την ΠΡΩΤΕΥΟΥΣΑ
   συσκευή εισόδου. Σε φορητό με οθόνη αφής και ποντίκι βγάζει
   λάθος αποτέλεσμα και επανέφερε τα κουμπιά. Το any-hover
   ελέγχει αν ΟΠΟΙΑΔΗΠΟΤΕ συσκευή μπορεί να κάνει hover.

   Πρέπει να μένει τελευταίο στο αρχείο.
   ------------------------------------------------------------ */

@media (min-width: 992px) and (any-hover: hover) {

    .container-topbar .mm-toggler,
    #navbar115 .mm-toggler {
        display: none !important;
    }

    .container-topbar ul.mod-menu > li.parent > a::after,
    #navbar115 ul.mod-menu > li.parent > a::after {
        display: inline-block;
    }
}
/* --- Ημερομηνία στην πάνω λωρίδα --- */
.dide-date {
    display: none;
}

@media (min-width: 992px) {
    .dide-date {
        position: absolute;
        top:50%;
        margin-top: -28px;
        right: max(1rem, calc((100% - var(--site-max)) / 2 + 1rem));
        transform: translateY(-50%);
        display: block;
        color: rgba(255, 255, 255, .85);
        font-size: .88rem;
        white-space: nowrap;
    }
}