/* ==================================================
   RADIO SAMOS - CATEGORY FEATURE
   Κοινωνία / Υγεία / Αυτοδιοίκηση / Πολιτική κ.λπ.
   1 μεγάλη είδηση αριστερά + 3 μικρές δεξιά
   ================================================== */


/* ==================================================
   ΤΙΤΛΟΣ BLOCK
   ================================================== */

.home-category-feature-block {
    width: 100%;
}

.home-category-feature-block h2,
.home-category-feature-block .block-title {
    margin: 0 0 14px;
    padding: 0 0 10px;

    color: #171717;

    font-size: 1.45rem;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.02em;

    border-bottom: 3px solid #171717;
}


/* ==================================================
   ΒΑΣΙΚΗ ΔΙΑΤΑΞΗ
   ================================================== */

.home-category-feature {
    width: 100%;
}

.home-category-feature .view-content {
    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(320px, 0.85fr);

    grid-template-rows: repeat(3, auto);

    column-gap: 34px;

    align-items: start;
}


/* ==================================================
   1η ΕΙΔΗΣΗ - ΜΕΓΑΛΗ ΑΡΙΣΤΕΡΑ
   ================================================== */

.home-category-feature
.view-content
> .views-row:nth-of-type(1) {
    grid-column: 1;
    grid-row: 1 / span 3;

    min-width: 0;
}


/* --------------------------------------------------
   ΜΕΓΑΛΗ ΕΙΚΟΝΑ
   Το πλαίσιο μένει σταθερό και η εικόνα κάνει crop
   ΜΟΝΟ μέσα σε αυτό.
   -------------------------------------------------- */

.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.views-field-field-image {
    width: 100%;
    height: 270px;

    margin: 0 0 14px;

    overflow: hidden;

    border-radius: 10px;

    /* βοηθά και στο clipping των γωνιών */
    position: relative;
}

/* Drupal field-content */
.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.views-field-field-image
.field-content {
    display: block;

    width: 100%;
    height: 100%;

    overflow: hidden;

    border-radius: inherit;
}

/* Αν η εικόνα είναι link */
.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.views-field-field-image a {
    display: block;

    width: 100%;
    height: 100%;

    overflow: hidden;

    border-radius: inherit;
}

/* Πραγματική εικόνα */
.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.views-field-field-image img {
    display: block;

    width: 100% !important;
    height: 100% !important;

    max-width: none !important;

    object-fit: cover;
    object-position: center;

    margin: 0;
    padding: 0;

    border: 0;
    border-radius: 0;
}


/* --------------------------------------------------
   ΤΙΤΛΟΣ ΚΥΡΙΑΣ ΕΙΔΗΣΗΣ
   -------------------------------------------------- */

.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.views-field-title {
    margin: 0 0 8px;

    min-width: 0;
}

.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.views-field-title a {
    display: block;

    color: #171717;

    font-size: 1.4rem;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.02em;

    text-decoration: none;
}

.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.views-field-title a:hover {
    text-decoration: underline;
}


/* --------------------------------------------------
   LEAD / BODY ΚΥΡΙΑΣ ΕΙΔΗΣΗΣ
   -------------------------------------------------- */

.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.views-field-body,
.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.category-lead-summary {
    margin: 0 0 9px;

    color: #666;

    font-size: 0.96rem;
    line-height: 1.5;
}

.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.views-field-body *,
.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.category-lead-summary * {
    color: inherit !important;

    text-decoration: none !important;
}


/* --------------------------------------------------
   ΗΜΕΡΟΜΗΝΙΑ ΚΥΡΙΑΣ
   -------------------------------------------------- */

.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.views-field-created,
.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.category-news-date {
    margin: 0;

    color: #999;

    font-size: 0.8rem;
    line-height: 1.25;
}

.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.views-field-created a,
.home-category-feature
.view-content
> .views-row:nth-of-type(1)
.category-news-date a {
    color: inherit !important;

    text-decoration: none !important;
}


/* ==================================================
   2η - 4η ΕΙΔΗΣΗ - ΔΕΞΙΑ
   ================================================== */

.home-category-feature
.view-content
> .views-row:nth-of-type(2) {
    grid-column: 2;
    grid-row: 1;
}

.home-category-feature
.view-content
> .views-row:nth-of-type(3) {
    grid-column: 2;
    grid-row: 2;
}

.home-category-feature
.view-content
> .views-row:nth-of-type(4) {
    grid-column: 2;
    grid-row: 3;
}


/* --------------------------------------------------
   ΚΟΙΝΗ ΔΙΑΤΑΞΗ ΜΙΚΡΩΝ ΕΙΔΗΣΕΩΝ
   -------------------------------------------------- */

.home-category-feature
.view-content
> .views-row:nth-of-type(n+2) {
    display: grid;

    grid-template-columns: 115px minmax(0, 1fr);

    grid-template-areas:
        "image title"
        "image date";

    column-gap: 14px;
    row-gap: 6px;

    align-items: start;

    min-width: 0;

    padding: 16px 0;

    border-bottom: 1px solid #e5e5e5;
}


/* ==================================================
   ΜΙΚΡΕΣ ΕΙΚΟΝΕΣ ΔΕΞΙΑ
   Σταθερό 115x78 + crop μέσα στο πλαίσιο
   ================================================== */

.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.views-field-field-image {
    grid-area: image;

    width: 115px;
    height: 78px;

    margin: 0;
    padding: 0;

    overflow: hidden;

    border-radius: 9px;

    position: relative;
}

/* Drupal field-content */
.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.views-field-field-image
.field-content {
    display: block;

    width: 100%;
    height: 100%;

    overflow: hidden;

    border-radius: inherit;
}

/* Link γύρω από την εικόνα */
.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.views-field-field-image a {
    display: block;

    width: 100%;
    height: 100%;

    overflow: hidden;

    border-radius: inherit;
}

/* Πραγματική εικόνα */
.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.views-field-field-image img {
    display: block;

    width: 100% !important;
    height: 100% !important;

    max-width: none !important;

    object-fit: cover;
    object-position: center;

    margin: 0;
    padding: 0;

    border: 0;
    border-radius: 0;
}


/* ==================================================
   BODY ΜΙΚΡΩΝ - ΚΡΥΦΟ
   ================================================== */

.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.views-field-body {
    display: none;
}


/* ==================================================
   ΤΙΤΛΟΙ ΜΙΚΡΩΝ
   ================================================== */

.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.views-field-title {
    grid-area: title;

    min-width: 0;

    margin: 0;
}

.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.views-field-title a {
    display: block;

    color: #171717;

    font-size: 1rem;
    font-weight: 700;
    line-height: 1.28;

    text-decoration: none;
}

.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.views-field-title a:hover {
    text-decoration: underline;
}


/* ==================================================
   ΗΜΕΡΟΜΗΝΙΕΣ ΜΙΚΡΩΝ
   ================================================== */

.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.views-field-created,
.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.category-news-date {
    grid-area: date;

    margin: 0;

    color: #999;

    font-size: 0.76rem;
    line-height: 1.2;
}

.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.views-field-created a,
.home-category-feature
.view-content
> .views-row:nth-of-type(n+2)
.category-news-date a {
    color: inherit !important;

    text-decoration: none !important;
}


/* ==================================================
   RESET ΠΕΡΙΤΤΩΝ MARGINS ΤΟΥ VIEWS
   ================================================== */

.home-category-feature .views-field {
    box-sizing: border-box;
}

.home-category-feature img {
    box-sizing: border-box;
}


/* ==================================================
   TABLET
   ================================================== */

@media (max-width: 980px) {

    .home-category-feature .view-content {
        grid-template-columns:
            minmax(0, 1.05fr)
            minmax(280px, 0.95fr);

        column-gap: 24px;
    }

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(n+2) {
        grid-template-columns: 100px minmax(0, 1fr);

        column-gap: 12px;
    }

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(n+2)
    .views-field-field-image {
        width: 100px;
        height: 70px;
    }

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(n+2)
    .views-field-title a {
        font-size: 0.95rem;
    }
}


/* ==================================================
   MOBILE
   ================================================== */

@media (max-width: 767px) {

    .home-category-feature-block h2,
    .home-category-feature-block .block-title {
        margin-bottom: 10px;
        padding-bottom: 8px;

        font-size: 1.3rem;
    }


    /* Μία στήλη */
    .home-category-feature .view-content {
        display: block;
    }


    /* ----------------------------------------------
       Κύρια είδηση
       ---------------------------------------------- */

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(1) {
        padding-bottom: 18px;

        border-bottom: 2px solid #171717;
    }

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(1)
    .views-field-field-image {
        width: 100%;
        height: auto;

        aspect-ratio: 16 / 9;
    }

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(1)
    .views-field-title a {
        font-size: 1.25rem;
        line-height: 1.2;
    }

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(1)
    .views-field-body {
        font-size: 0.94rem;
    }


    /* ----------------------------------------------
       Μικρές ειδήσεις
       ---------------------------------------------- */

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(n+2) {
        grid-template-columns: 90px minmax(0, 1fr);

        column-gap: 12px;
        row-gap: 5px;

        padding: 14px 0;
    }

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(n+2)
    .views-field-field-image {
        width: 90px;
        height: 65px;

        border-radius: 8px;
    }

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(n+2)
    .views-field-title a {
        font-size: 0.95rem;
        line-height: 1.3;
    }
}


/* ==================================================
   ΠΟΛΥ ΜΙΚΡΕΣ ΟΘΟΝΕΣ
   ================================================== */

@media (max-width: 420px) {

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(n+2) {
        grid-template-columns: 82px minmax(0, 1fr);

        column-gap: 10px;
    }

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(n+2)
    .views-field-field-image {
        width: 82px;
        height: 60px;
    }

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(1)
    .views-field-title a {
        font-size: 1.15rem;
    }

    .home-category-feature
    .view-content
    > .views-row:nth-of-type(n+2)
    .views-field-title a {
        font-size: 0.9rem;
    }
}