/*
 Theme Name:   Minimalista
 Description:  Minimalista theme
 Author:       E-GROWTH
 Author URI:   https://www.e-growth.gr
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
*/

.sr-only{
    display: none;
}


/* 1. Global Container - Περιορίζει το πλάτος για να μην κολλάνε οι εικόνες στις άκρες */
.blog-feed-container, .single-post-wrapper {
    max-width: 1200px; /* Το ιδανικό πλάτος για premium sites */
    margin: 0 auto;
    padding: 0 20px; /* Margin ασφαλείας για το κινητό */
    box-sizing: border-box;
}

/* 2. Blog Feed Grid */
.blog-feed-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 60px 40px;
    padding: 60px 20px;
}

/* 3. Hero Post - Responsive Fix */
.post-hero {
    grid-column: 1 / -1;
    display: flex;
    gap: 40px;
    align-items: center;
    margin-bottom: 40px;
}

.hero-image-link {
    flex: 0 0 60%;
    max-height: 500px; /* Περιορισμός ύψους για να μην "καταπίνει" την οθόνη */
    overflow: hidden;
}

.hero-image-link img, .card-image-link img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Κάνει την εικόνα να γεμίζει το χώρο χωρίς να παραμορφώνεται */
    display: block;
}

.hero-content { flex: 1; }

/* 4. Responsive Media Queries (Η λύση για το κινητό) */
@media (max-width: 992px) {
    /* Το Hero Post γίνεται κάθετο */
    .post-hero {
        flex-direction: column;
        gap: 20px;
    }

    .hero-image-link, .hero-content {
        width: 100%;
        flex: none;
    }

    .hero-content h2 {
        font-size: 2rem;
    }
}

@media (max-width: 768px) {
    /* Το Grid γίνεται μονόστηλο */
    .blog-feed-container {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .post-header-minimal h1 {
        font-size: 2.2rem;
    }

    /* Αφαιρούμε το dropcap στο κινητό αν ενοχλεί */
    .content-inner > p:first-of-type::first-letter {
        font-size: 3.5rem;
    }
}

.post-featured-image {
    width: 100%;
    max-height: 600px; /* Μέγιστο ύψος για desktop */
    overflow: hidden;
    margin-bottom: 50px;
}

.post-featured-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Περιορισμός πλάτους κειμένου για ξεκούραστη ανάγνωση */
.post-content-area {
    max-width: 750px; /* Το κείμενο δεν πρέπει να απλώνεται σε όλο το πλάτος */
    margin: 0 auto;
    line-height: 1.8;
}

/* Pagination Container */
.minimalista-pagination {
    grid-column: 1 / -1; /* Για να πιάνει όλο το πλάτος στο grid */
    margin: 80px 0 40px;
    border-top: 1px solid var(--p-border);
    padding-top: 40px;
}

.minimalista-pagination ul {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
    padding: 0;
    gap: 15px;
}

/* Pagination Links */
.minimalista-pagination a,
.minimalista-pagination span {
    font-family: var(--font-primary);
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: var(--color-grey-dark);
    text-decoration: none;
    padding: 8px 14px;
    transition: all 0.3s ease;
}

/* Active Page & Hover */
.minimalista-pagination .current {
    color: var(--color-black);
    border-bottom: 2px solid var(--p-gold);
}

.minimalista-pagination a:hover {
    color: var(--p-gold);
}

/* Arrows Styling */
.nav-arrow {
    display: inline-block;
    transition: transform 0.3s ease;
}

.minimalista-pagination a:first-child:hover .nav-arrow {
    transform: translateX(-5px);
}

.minimalista-pagination a:last-child:hover .nav-arrow {
    transform: translateX(5px);
}
.cat {
    margin-top: 20px;
    display: block;
}
/* Responsive για κινητά */
@media (max-width: 768px) {
    .minimalista-pagination ul {
        gap: 5px;
        flex-wrap: wrap;
    }

    .minimalista-pagination a,
    .minimalista-pagination span {
        font-size: 13px;
        padding: 5px 8px;
    }

    /* Κρύβουμε τις λέξεις "Προηγούμενο/Επόμενο" στα πολύ μικρά κινητά αν θες */
     @media (max-width: 360px) {
        .minimalista-pagination a:first-child,
        .minimalista-pagination a:last-child { font-size: 0; }
        .nav-arrow { font-size: 18px; }
    }
}
.spot-header time, .spot-header span {
    font-size: .8rem;
    color: #666;
}
.archive-hero-header {
    padding: 60px 0 60px;
    background-color: #fff;
    text-align: center;
    border-bottom: 1px solid var(--p-border);
    margin-bottom: 20px;
}

/* Breadcrumb */
.breadcrumb-minimal {
    font-family: var(--font-primary);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--color-grey-light);
    margin-bottom: 30px;
}

.breadcrumb-minimal a {
    text-decoration: none;
    color: inherit;
    transition: color 0.3s;
}

.breadcrumb-minimal a:hover {
    color: var(--p-gold);
}

/* Main Title */
.archive-label {
    display: block;
    font-family: var(--font-primary);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 4px;
    color: var(--p-gold);
    margin-bottom: 15px;
}

.archive-main-title {
    font-family: var(--font-serif);
    font-size: clamp(3rem, 8vw, 5rem); /* Responsive μέγεθος που προσαρμόζεται */
    line-height: 1;
    color: var(--color-black);
    margin: 0 auto 25px;
    max-width: 900px;
}

/* Description */
.archive-description {
    font-family: var(--font-primary);
    font-size: 1.1rem;
    line-height: 1.6;
    color: var(--color-grey-dark);
    max-width: 600px;
    margin: 0 auto;
}

/* Responsive Fixes */
@media (max-width: 768px) {
    .archive-hero-header {
        padding: 30px 20px 30px;
    }

    .archive-main-title {
        font-size: 2.8rem;
    }
}

body.custom-background{
    background: #fff!important;
}

.post-meta-cat {
    text-align: center;
    margin-bottom: 15px;
    font-weight: 500;
    border-bottom: 1px dotted;
    padding-bottom: 15px;
}

/* Post Navigation Container */
.post-navigation {
    border-top: 1px solid var(--p-border);
    border-bottom: 1px solid var(--p-border);
    padding: 40px 0;
    margin: 60px auto 0;
    max-width: 700px; /* Ευθυγράμμιση με το κείμενο του άρθρου */
}

.nav-links {
    display: flex;
    justify-content: space-between;
    gap: 40px;
}

.nav-previous, .nav-next {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.nav-next {
    text-align: right;
}

/* Labels: Προηγούμενο / Επόμενο */
.nav-label {
    font-family: var(--font-primary);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--p-gold);
    margin-bottom: 10px;
}

/* Post Titles */
.nav-links a {
    font-family: var(--font-primary);
    font-size: 1.1rem;
    line-height: 1.4;
    color: var(--color-black);
    text-decoration: none;
    transition: color 0.3s ease;
}

.nav-links a:hover {
    color: var(--p-gold);
}

/* Responsive Fix για κινητά */
@media (max-width: 768px) {
    .nav-links {
        flex-direction: column;
        gap: 30px;
        text-align: center;
    }

    .nav-next {
        text-align: center;
    }
}
.nav-next-thumbnail {
    margin-bottom: 5px;
}
.post-link,.single-post .spot-entry-content a {
    display: inline;
    font-family: var(--font-primary);
    font-size: 1.4rem; /* Μεγάλο και επιβλητικό */
    color: var(--p-gold);
    text-decoration: none;
    /*border-bottom: 2px solid var(--p-gold); !* Η χαρακτηριστική χρυσή γραμμή *!*/
    margin: 20px 0;
    padding-bottom: 5px;
    transition: all 0.3s ease;
    line-height: 1;
}


.post-link::after,.single-post .spot-entry-content a:after{
    content: "";
    display: block;
}

.post-link:hover,.single-post .spot-entry-content a:hover {
    color: var(--p-gold);
    border-bottom-color: var(--color-black);
}


/* Container Spacing */
.blog-feed-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 60px 40px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 20px;
}

/* Base Card Styling */
.post-card-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.card-image-link {
    display: block;
    width: 100%;
    overflow: hidden;
    margin-bottom: 20px;
    background-color: #f5f5f5; /* Placeholder χρώμα μέχρι να φορτώσει η φωτό */
}

.card-image-link img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s cubic-bezier(0.2, 1, 0.3, 1);
}

/* --- Η ΤΣΑΧΠΙΝΙΑ (Tall vs Standard) --- */

/* Standard Card: Τετράγωνη αισθητική */
.card-standard .card-image-link {
    aspect-ratio: 1 / 1;
}

/* Tall Card: Πορτρέτο αισθητική (σαν editorial σε περιοδικό) */
.card-tall .card-image-link {
    aspect-ratio: 4 / 5;
}

/* Hover Effect */
.post-card:hover .card-image-link img {
    transform: scale(1.04);
}

/* Typography μέσα στις κάρτες */
.post-date {
    display: block;
    font-family: var(--font-primary);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--p-gold);
    margin-bottom: 10px;
}

.card-info h3 {
    font-family: var(--font-serif);
    font-size: 1.5rem;
    line-height: 1.3;
    margin: 0;
}

.card-info h3 a {
    color: #1a1a1a;
    text-decoration: none;
    transition: color 0.3s ease;
}

.card-info h3 a:hover {
    color: var(--p-gold);
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .blog-feed-container {
        grid-template-columns: 1fr; /* Μία στήλη στο κινητό */
        gap: 40px;
    }

    .card-tall .card-image-link,
    .card-standard .card-image-link {
        aspect-ratio: 16 / 9; /* Στο κινητό προτιμάμε οριζόντιες φωτό για λιγότερο scroll */
    }

    .nav-previous::after,.spot-curator::after {
        border-bottom: 1px solid #ccc;
        padding-bottom: 30px;
        content: "";
        width: 100px;
        margin: auto;
        display: block;
    }

    .post-layout-hero.is-reversed{
        /*padding: 1% 10%!important;*/
        gap: 0px;
        height: max-content;
        border: 0!important;
    }
    .post-layout-hero{
        gap: 0!important;
    }
    .post-layout-hero.not-reversed {
        gap: 0px;
        height: max-content;
    }
}

/* Διασφαλίζουμε ότι η ημερομηνία είναι πάντα διακριτική */
.post-date {
    font-size: 9px;
    font-weight: 700;
    margin-bottom: 8px;
    opacity: 0.8;
}

/* Ο τίτλος στις κάρτες πρέπει να έχει σωστό spacing */
.card-info h3 {
    font-size: 1.3rem; /* Λίγο πιο μικρό για να μην "μπουκώνει" το grid */
    text-transform: unset;
    letter-spacing: 0.5px;
}

.blog-feed-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2 στήλες βάση */
    gap: 80px 40px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 20px;
}

/* Κοινά Styles */
.post-layout-hero, .post-layout-card { display: flex; flex-direction: column; gap: 20px; }
.layout-img { overflow: hidden; display: block; }
.layout-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.post-layout-hero:hover img, .post-layout-card:hover img { transform: scale(1.03); }

/* --- 1. HERO (Full Width) --- */
.post-layout-hero {
    grid-column: 1 / -1;
    flex-direction: row;
    align-items: center;
    gap: 60px;
}
.post-layout-hero .layout-img { flex: 0 0 50%; aspect-ratio: 1/1; }
.post-layout-hero h2 { font-family: var(--font-primary); font-size: 2.3rem; line-height: 1.1; margin: 15px 0;text-transform: unset }

/* --- 2. REVERSED (The "Minor" Hero) --- */
.post-layout-hero.is-reversed {
    grid-column: 1 / -1;
    flex-direction: row; /* Αντίστροφη σειρά λόγω HTML δομής */
    padding: 1% 10%; /* Το μικραίνουμε εσωτερικά για να μην έχει την ίδια βαρύτητα */
    border: 1px solid #ccc;
}
.post-layout-hero.is-reversed .layout-img { flex: 0 0 50%; aspect-ratio: 1/1; }
.post-layout-hero.is-reversed h2 { font-family: var(--font-primary); font-size: 1.8rem; margin: 10px 0;text-transform: unset }


.post-layout-hero.not-reversed {
    grid-column: 1 / -1;
    flex-direction: row-reverse; /* Αντίστροφη σειρά λόγω HTML δομής */
    padding: 1% 10%; /* Το μικραίνουμε εσωτερικά για να μην έχει την ίδια βαρύτητα */
    border: 1px solid #ccc;
}
.post-layout-hero.not-reversed .layout-img { flex: 0 0 50%; aspect-ratio: 1/1; }
.post-layout-hero.not-reversed h2 { font-family: var(--font-primary); font-size: 1.8rem; margin: 10px 0;text-transform: unset }

/* --- 3. EQUAL CARDS --- */
.post-layout-card .layout-img { aspect-ratio: 1 / 1; }
.post-layout-card h2 { font-family: var(--font-primary); font-size: 1.4rem; text-transform: unset; }

/* Responsive */
@media (max-width: 992px) {
     .post-layout-hero.is-reversed,.post-layout-hero.not-reversed {
        flex-direction: column-reverse !important;
        padding: 0;
    }

    .post-layout-hero.not-reversed{
        border: 0;
    }

    .minimalista-pagination{
        margin-top: 0;
    }

    .post-layout-hero{
        flex-direction: column !important;
        padding: 0;
    }
    .post-layout-hero .layout-img, .post-layout-hero.is-reversed .layout-img { flex: none; width: 100%; }
    .blog-feed-container { grid-template-columns: 1fr; gap: 50px; }
}

.layout-content .date {
    display: block;
    margin-bottom: 5px;
    color: #222;
    font-size: .8rem;
}
.layout-content .cat a {
    color: var(--p-gold);
}

