/* NexarCovers - https://nexar.gr/ */
.thumb_cell {
    width:150px;
    position: relative;
}
.thumb_cell_small {
    width:40px;
}
img.thumb_img {
    width:150px;
    height:150px;
    display:block;
}
img.thumb_img_small {
    width:40px!important;
    height:40px!important;
    display:block;
}
.hide-desktop {
    display: none;
}
.hide-mobile {
    display: table-cell;
}
.grey_bg {
    background-color: #f3f3f3;
}
/*
 * TOP 30 (/chart/) και Airplay History (/player/) - 3.2.4
 *
 * Ήταν inline-block σε width:30% με margin-left:20px. Σε στήλη 492 pixel αυτό
 * βγάζει 148 + 20 = 168 ανά κάρτα, άρα 3 x 168 = 504 > 492: χωρούσαν ΔΥΟ ανά
 * σειρά και έμενε μισή στήλη κενή στα δεξιά. Με flex και ρητό υπολογισμό
 * χωράνε τρεις, και το εξώφυλλο πιάνει όλο το πλάτος της κάρτας.
 */
/*
 * Το λευκό κουτί της σελίδας έχει κλάση «in-sec-nopad»: μηδέν padding.
 * Τα εξώφυλλα ακουμπούσαν στις άκρες του και κολλούσαν στο γκρι της σελίδας.
 * Τα 20px δεξιά-αριστερά είναι ο αέρας που έλειπε.
 */
#nexar_wrap_full,
#chart_wrap_full {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding: 4px 20px 24px;
    box-sizing: border-box;
}
#nexar_wrap_full .last_wrapper,
#chart_wrap_full .last_wrapper {
    width: calc((100% - 32px) / 3);
    margin: 0 0 10px;
    vertical-align: top;
}
/*
 * Πόσες κάρτες ανά σειρά: το ορίζει ο κάθε σταθμός (chart_cols στο
 * jazler-songs.php). Στον Aquarius είναι 4, ώστε τα 40 τραγούδια να βγαίνουν
 * 10 γεμάτες σειρές - με 3 έμενε το τελευταίο μόνο του.
 */
#chart_wrap_full.cols-4 .last_wrapper {
    width: calc((100% - 48px) / 4);
}
#chart_wrap_full.cols-5 .last_wrapper {
    width: calc((100% - 64px) / 5);
}
#nexar_wrap_full .thumb_cell,
#chart_wrap_full .thumb_cell {
    width: 100%;
}
#nexar_wrap_full img.thumb_img,
#chart_wrap_full img.thumb_img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
}
/* Ο καλλιτέχνης ήταν 10px με line-height 1 - δυσανάγνωστος. */
#nexar_wrap_full h5,
#chart_wrap_full h5 {
    font-size: 15px !important;
    line-height: 19px !important;
    font-weight: 500;
    margin: 8px 0 2px !important;
    /* έως δύο γραμμές ο τίτλος */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
#nexar_wrap_full h6,
#chart_wrap_full h6 {
    font-size: 12px !important;
    line-height: 16px !important;
    font-weight: 300;
    color: #6b6b6b;
    margin: 0 0 4px !important;
    /* μία γραμμή ο καλλιτέχνης, ό,τι περισσεύει με «...» */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/*
 * Κλειδωμένη ζώνη κειμένου = 2 γραμμές τίτλος (19) + 1 καλλιτέχνης (16) = 54.
 * Χωρίς αυτό, μια σειρά με μακρύ όνομα ψήλωνε και οι σειρές έβγαιναν άνισες.
 * Τώρα κάθε κάρτα του TOP 30 είναι ακριβώς 194 pixel.
 */
#nexar_wrap_full .metadata,
#chart_wrap_full .metadata {
    height: 54px;
    overflow: hidden;
}
.last_wrapper:hover img {
    box-shadow: 0px 0px 15px #041938;
    border-radius: 10px;
}
.last_wrapper:hover h6 {
  color: #ff0000;
}
.chart_position{
    padding: 2px 10px;
    color: #fff;
    background: #041938;
    font-size: 11px;
    border-radius: 5px;
    position: absolute;
    top: 0;
    left: 0;
    font-weight: 700;
    box-shadow: 0px 0px 5px #fff;
}

/* =====================================================================
   3.2.1 - ΚΑΡΤΕΣ «NOW PLAYING» / «COMING NEXT»
   =====================================================================
   Ήταν πίνακας: εξώφυλλο αριστερά, κείμενο δεξιά. Η στήλη είναι 236px και
   το εξώφυλλο έπιανε 140, οπότε στο κείμενο έμεναν 86px - 6-7 χαρακτήρες
   τη γραμμή με κεφαλαία. Γι' αυτό η κάρτα άλλαζε ύψος σε κάθε τραγούδι.

   Μετρημένο σε 1.847 τραγούδια με την πραγματική γραμματοσειρά:
     πλάι-πλάι ΚΕΦΑΛΑΙΑ  ->  14% σε 2 γραμμές, χειρότερο 11 γραμμές
     πλάι-πλάι πεζά      ->  21% σε 2 γραμμές, χειρότερο  9 γραμμές
     στοιβαγμένο πεζά    ->  96% σε 2 γραμμές, χειρότερο  3 γραμμές

   Με το κείμενο κάτω παίρνει 220px. Κανένα τραγούδι δεν ξεπερνά τις 3
   γραμμές, άρα η ζώνη κλειδώνει στα 63px (3 x 21) με κάθετο κεντράρισμα:
   η κάρτα βγαίνει πάντα 262px και κανένας τίτλος δεν κόβεται με «...».
   --------------------------------------------------------------------- */
#nexar_wrap_now:hover img,
#nexar_wrap_next:hover img {
    box-shadow: 0 0 15px #041938;
    border-radius: 10px;
}
#nexar_wrap_now:hover h4,
#nexar_wrap_next:hover h4 {
    color: #ff0000;
}
/*
 * Το min-height ΔΕΝ είναι διακοσμητικό - ισοφαρίζει τις τρεις στήλες.
 *
 * Η στήλη «Last Played Songs» βγαίνει: 12 (αέρας) + 5 x 42 (γραμμές) + 30
 * (ο σύνδεσμος Airplay History) = 252 pixel.
 * Η κάρτα: 12 (margin) + 228 + 12 (margin) = 252. Ίδιο ύψος, στο pixel.
 *
 * Τα 228 μοιράζονται: 150 (εξώφυλλο) + 12 (κενό) + 66 (κείμενο) = 228.
 * Αν μεγαλώσει το ένα, πρέπει να μικρύνει το άλλο - αλλιώς χαλάει η ισοφάριση.
 *
 * ΑΝ αλλάξει ο αριθμός των τραγουδιών (nexarcovers_last_songs_count), το
 * min-height πρέπει να ξαναϋπολογιστεί: 228 + (πλήθος - 5) x 42.
 */
.nexar_card {
    margin: 12px 0;
    min-height: 228px;
    color: #3f3f3f;
    text-align: center;
}
/*
 * Το float:none ΔΕΝ είναι περιττό. Το θέμα έχει «a img { float:left }» και
 * «.widget_text .textwidget img { float:left }». Με τον σύνδεσμο σε display:block
 * η φλοατ εικόνα δεν τον «γεμίζει», αυτός μένει 0 pixel ύψος και το κείμενο
 * ανεβαίνει πάνω στο εξώφυλλο. Μέχρι την 3.2.3 ο σύνδεσμος ήταν inline-block,
 * που κρατούσε τη φλοατ μέσα αλλά πρόσθετε 6 pixel κενό από κάτω (κάθεται σε
 * γραμμή κειμένου). Τώρα: φύγε η φλοατ, ο σύνδεσμος γίνεται block, το κενό χάνεται
 * και τα 6 pixel πάνε στο εξώφυλλο.
 */
.nexar_card a {
    display: block;
    line-height: 0;
}
.nexar_card img {
    float: none !important;
    width: 150px;
    height: 150px;
    margin: 0 auto;
    border-radius: 3px;
    display: block;
}
/* Ζώνη κειμένου: 3 γραμμές x 22px. Μετρήθηκε σε 1.847 τραγούδια με τίτλο 20px
   και καλλιτέχνη 15px σε πλάτος 224: ΚΑΝΕΝΑ δεν ξεπερνά τις 3 γραμμές, το 94%
   πιάνει 2. */
.nexar_meta {
    height: 66px;
    margin-top: 12px;
    padding: 0 6px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
/*
 * Το !important στα font-size ΔΕΝ είναι τσαπατσουλιά - χρειάζεται.
 * Το site τυπώνει δικό του inline <style> με:
 *     h2 { font-size:20px !important }
 *     h4 { font-size:18px !important }
 * και το base.css του θέματος έχει «h1..h6 { text-transform: uppercase }».
 * Χωρίς το δικό μας !important τα μεγέθη αγνοούνται και η ζώνη των 63px
 * δεν βγαίνει. Επαληθεύτηκε στο ζωντανό site.
 */
.nexar_meta h2 {
    margin: 0;
    padding: 0;
    font-size: 20px !important;
    line-height: 22px;
    font-weight: 500;
    color: #041938;
    text-transform: none !important;
    letter-spacing: 0;
    word-spacing: 0;
}
.nexar_meta h4 {
    margin: 0;
    padding: 0;
    font-size: 15px !important;
    line-height: 22px;
    font-weight: 300;
    color: #6b6b6b;
    text-transform: none !important;
    letter-spacing: .02em;
    word-spacing: 0;
}
/* Σε κινητό οι κάρτες μπαίνουν η μία κάτω από την άλλη και η στήλη μεγαλώνει.
   Εκεί το ύψος μένει ελεύθερο επίτηδες: τίποτα δεν στέκεται δίπλα για να
   «χορέψει», και έτσι δεν κινδυνεύει να κοπεί μεγάλος τίτλος. */
@media (max-width: 767px) {
    .nexar_meta {
        height: auto;
        min-height: 42px;
        overflow: visible;
    }
}

/* ---------------------------------------------------------------------
   Η ΩΡΑ - ίδια με τον player της /live/
   Ήταν μπλε «πιλάκι» με λευκά γράμματα. Ο player δείχνει σκέτο κείμενο
   σε γκριζογάλαζο #6d7788 με λεπτό ρολόι SVG. Κρατάμε ένα στιλ παντού.
   --------------------------------------------------------------------- */
.nexar_time {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    margin: 11px 0 0;
    padding: 0;
    background: none;
    border-radius: 0;
    font-size: 14px;
    line-height: 21px;
    font-weight: 400;
    color: #6d7788;
}
.nexar_time .ico {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    opacity: .8;
}
/* Στις κάρτες της αρχικής όλα είναι κεντραρισμένα, άρα και η ώρα.
   Στο Airplay History το κείμενο είναι αριστερά, οπότε μένει αριστερά. */
.nexar_card .nexar_time {
    justify-content: center;
}

/* ---------------------------------------------------------------------
   ΠΕΖΑ ΣΕ ΟΛΕΣ ΤΙΣ ΛΙΣΤΕΣ ΤΡΑΓΟΥΔΙΩΝ
   Last Played Songs, Venus Top 5, Top 30 και Airplay History - ένα στιλ.
   Έχει και πρακτικό όφελος: με κεφαλαία πολλοί τίτλοι έσπαγαν σε δεύτερη
   γραμμή και οι λίστες μάκραιναν άτακτα.
   --------------------------------------------------------------------- */
#nexar_wrap_last3 h5,
#nexar_wrap_last3 h6,
#nexar_wrap_full h5,
#nexar_wrap_full h6,
.airplay_chart h5,
.airplay_chart h6 {
    text-transform: none !important;
    letter-spacing: 0;
}
/*
 * Οι συμπαγείς λίστες με εικονίδιο 40px.
 *
 * 3.2.6: μεγάλωσαν από 14/12 σε 15/13. ΔΕΝ κόστισε ύψος - το ύψος της γραμμής
 * το ορίζει το εικονίδιο των 40px, όχι το κείμενο (15+13 -> 19+17 = 36 < 40).
 * Οι γραμμές μένουν 42 pixel και οι τρεις στήλες 308.
 *
 * Το μόνο κόστος είναι λίγο περισσότερα «...»: μετρημένο σε 1.847 τραγούδια,
 * ολόκληρα χωράνε 88% αντί για 90%. Στα 16/13 θα έπεφτε στο 81%, γι' αυτό
 * σταμάτησα εδώ.
 */
#nexar_wrap_last3 h5,
.airplay_chart.side h5 {
    font-size: 15px !important;
    line-height: 19px;
    font-weight: 500;
}
#nexar_wrap_last3 h6,
.airplay_chart.side h6 {
    font-size: 13px !important;
    line-height: 17px;
    font-weight: 300;
    color: #6b6b6b;
}
/* Το πρώτο εξώφυλλο κολλούσε στη μπλε μπάρα της επικεφαλίδας. */
#nexar_wrap_last3,
.airplay_chart.side {
    padding-top: 12px;
}
/*
 * Μία γραμμή ο τίτλος, μία ο καλλιτέχνης - ό,τι περισσεύει κόβεται με «...».
 * Χωρίς αυτό, ένα μακρύ όνομα («Timbaland Feat. Keri Hilson + D.O.E.») έσπαγε
 * σε δεύτερη γραμμή, η γραμμή γινόταν 50px αντί για 42 και όλη η στήλη
 * ξέφευγε προς τα κάτω σε σχέση με τις κάρτες δίπλα.
 * Λειτουργεί επειδή οι πίνακες έχουν table-layout:fixed με ρητά πλάτη.
 * Ολόκληρο το όνομα φαίνεται με το ποντίκι (title= στο κελί).
 */
#nexar_wrap_last3 h5,
#nexar_wrap_last3 h6,
.airplay_chart.side h5,
.airplay_chart.side h6 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---------------------------------------------------------------------
   ΤΙΤΛΟΙ ΑΡΘΡΩΝ ΣΤΟ «MUSIC NEWS» - ΠΕΖΟΙ
   Ζητήθηκε ρητά, για να ταιριάζουν με τα τραγούδια.

   ΣΗΜΕΙΩΣΗ: αυτό ΔΕΝ είναι δικό μας περιεχόμενο - είναι το grid άρθρων του
   WPBakery, που κληρονομεί το «h1..h6 { text-transform: uppercase }» του
   θέματος. Μπαίνει εδώ για να ταξιδεύει μαζί με το πρόσθετο και να μη
   χρειάζεται χειροκίνητη επικόλληση. Το «σωστό» του σπίτι είναι το
   Εμφάνιση -> Προσαρμογή -> Πρόσθετη CSS· αν απενεργοποιηθεί ποτέ το
   NexarCovers, οι τίτλοι ξαναγίνονται κεφαλαίοι.
   --------------------------------------------------------------------- */
.vc_gitem-post-data-source-post_title h1,
.vc_gitem-post-data-source-post_title h2,
.vc_gitem-post-data-source-post_title h3,
.vc_gitem-post-data-source-post_title h4,
.vc_gitem-post-data-source-post_title h5,
.vc_gitem-post-data-source-post_title h6 {
    text-transform: none !important;
}
/*
 * Η επικεφαλίδα «Music News» έχει καρφωμένο στη σελίδα margin-top:-55px και
 * καθόταν 3 pixel ψηλότερα από τη διπλανή «Venus Top 5». Τα -52 τη φέρνουν
 * ακριβώς στην ίδια ευθεία. (Το -55 είναι γραμμένο μέσα στο περιεχόμενο της
 * σελίδας, γι' αυτό διορθώνεται από εδώ και όχι στον WPBakery.)
 */
.two-thirds h1.heading[style*="-55px"] {
    margin-top: -52px !important;
}
/*
 * Το κουμπί «Load More» κάτω από τα νέα ήταν το προεπιλεγμένο του WPBakery:
 * μπλε-μωβ #5472D2 με ΓΚΡΙ γράμματα (το θέμα νικούσε το inline color:#fff)
 * και λευκή σκιά κειμένου από πάνω - γι' αυτό φαινόταν θολό και ξένο.
 * Το !important χρειάζεται: το κουμπί έχει inline style και onmouseenter που
 * ξαναγράφουν το χρώμα με JavaScript.
 */
.vc_pageable-load-more-btn .vc_btn3 {
    background-color: #041938 !important;
    background-image: none !important;
    border-color: #041938 !important;
    color: #fff !important;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px !important;
    padding: 12px 30px !important;
    font-size: 15px !important;
    letter-spacing: .06em;
}
.vc_pageable-load-more-btn .vc_btn3:hover {
    background-color: #d81f26 !important;
    border-color: #d81f26 !important;
    color: #fff !important;
}

@media (max-width: 500px) {
    .thumb_cell {
        width:75px;
        margin: auto;
    }
    img.thumb_img {
        width:75px;
        height:75px;
    }
    .hide-desktop {
        display: block;
    }
    .hide-mobile {
        display: none;
    }
    #nexar_wrap_full .last_wrapper,
    #chart_wrap_full .last_wrapper {
        width: calc((100% - 16px) / 2);
        margin: 0 0 10px;
        text-align: center;
    }
    #nexar_wrap_full,
    #chart_wrap_full {
        gap: 16px;
    }
    #chart_wrap_full, #nexar_wrap_full {
        text-align: center;
    }
    /* Εκεί που τα πάντα κεντράρονται, κεντράρεται και η ώρα. */
    #nexar_wrap_full .nexar_time {
        justify-content: center;
    }
}

/* =====================================================================
   ΤΟ ΜΕΓΑΛΟ CHART ΣΑΝ ΛΙΣΤΑ  (chart_layout = 'list')
   Στα πρότυπα του Official Big Top 40: τετράγωνο με τη θέση αριστερά,
   εξώφυλλο, τίτλος, καλλιτέχνης, και από κάτω η κίνηση της εβδομάδας.
   Το πλέγμα με τις κάρτες ΔΕΝ πειράχτηκε - ζει στο #chart_wrap_full.
   ===================================================================== */
#chart_wrap_list {
    list-style: none;
    margin: 0;
    padding: 4px 0 20px;
    /* Η ίδια γραμματοσειρά με τον live player. */
    font-family: 'Roboto Condensed', 'Oswald', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}
#chart_wrap_list .nxc-pos,
#chart_wrap_list .nxc-title,
#chart_wrap_list .nxc-artist,
#chart_wrap_list .nxc-stats,
#chart_wrap_list .nxc-new,
#chart_wrap_list .nxc-peak {
    font-family: inherit;
}
#chart_wrap_list .nxc-row {
    display: flex;
    align-items: stretch;
    margin: 0 0 10px;
    padding: 0;
    list-style: none;
    background: #fff;
    border: 1px solid #e9e9e9;
}
#chart_wrap_list .nxc-row:before {
    content: none;
}
/* Στο Big Top 40 το τετράγωνο είναι μαύρο· εδώ παίρνει το σκούρο μπλε
   του σταθμού για να δένει με την υπόλοιπη σελίδα. */
#chart_wrap_list .nxc-pos {
    flex: 0 0 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #041938;
    color: #fff;
    font-size: 26px;
    font-weight: 700;
    line-height: 1;
}
/* Χωρίς δικό του πλαίσιο και χωρίς padding: το εξώφυλλο πρέπει να ακουμπάει
   πάνω, κάτω και αριστερά, ακριβώς όπως το τετράγωνο της θέσης. */
#chart_wrap_list .nxc-card {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    gap: 0;
    align-items: stretch;
    background: none;
    border: 0;
    padding: 0;
    box-sizing: border-box;
}
/* Το εξώφυλλο τεντώνεται στο ύψος της γραμμής - έτσι μένει ευθυγραμμισμένο
   με τη θέση ακόμα κι αν ο τίτλος πιάσει δύο γραμμές. */
#chart_wrap_list .nxc-cover {
    flex: 0 0 100px;
    align-self: stretch;
}
#chart_wrap_list .nxc-cover img {
    width: 100px;
    height: 100%;
    min-height: 100px;
    object-fit: cover;
    display: block;
}
#chart_wrap_list .nxc-info {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 10px 14px;
}
#chart_wrap_list .nxc-artist,
#chart_wrap_list .nxc-stats {
    display: block;
    min-width: 0;
}
#chart_wrap_list .nxc-title {
    font-size: 19px;
    line-height: 24px;
    font-weight: 600;
    color: #041938;
    text-transform: none;
    letter-spacing: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
#chart_wrap_list .nxc-artist {
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #6b6b6b;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#chart_wrap_list .nxc-stats {
    font-size: 12px;
    line-height: 18px;
    color: #8a8a8a;
    margin-top: 8px;
}
#chart_wrap_list .nxc-move {
    font-size: 11px;
    line-height: 18px;
}
#chart_wrap_list .nxc-move.up    { color: #12a150; }
#chart_wrap_list .nxc-move.down  { color: #d13b3b; }
#chart_wrap_list .nxc-move.same  { color: #b0b0b0; }
#chart_wrap_list .nxc-new {
    display: inline-block;
    background: #d13b3b;
    color: #fff;
    font-size: 11px;
    line-height: 16px;
    font-weight: 700;
    padding: 0 6px;
    border-radius: 2px;
}
/* Η υψηλότερη θέση πάει σε δική της γραμμή, όπως στο Big Top 40. */
#chart_wrap_list .nxc-peak {
    display: block;
}
#chart_wrap_list .nxc-row:hover {
    border-color: #041938;
}

@media only screen and (max-width: 560px) {
    #chart_wrap_list .nxc-pos {
        flex: 0 0 40px;
        font-size: 20px;
    }
    #chart_wrap_list .nxc-cover {
        flex: 0 0 76px;
    }
    #chart_wrap_list .nxc-cover img {
        width: 76px;
        min-height: 76px;
    }
    #chart_wrap_list .nxc-info {
        padding: 8px 10px;
    }
    #chart_wrap_list .nxc-title {
        font-size: 16px;
        line-height: 20px;
    }
    #chart_wrap_list .nxc-artist {
        font-size: 13px;
    }
}