/* /Components/ExternalSignInButton.razor.rz.scp.css */
/* Το ::deep χρειάζεται επειδή το ίδιο το <button> το φτιάχνει το MudButton, και η
   απομόνωση CSS του Blazor δεν σημαδεύει στοιχεία που παράγει θυγατρικό component. */
.oauth-wrap[b-omov3ymjgp]  .oauth-button {
    /* Το κουμπί του τρίτου παρόχου δεν διεκδικεί την προσοχή του κύριου: ουδέτερο
       περίγραμμα, πεζά-κεφαλαία όπως τα γράφει ο άνθρωπος, χρώμα μόνο στο σήμα. */
    text-transform: none;
    font-weight: 550;
    border-color: var(--mud-palette-lines-default);
}

.oauth-wrap[b-omov3ymjgp]  .oauth-mark {
    display: inline-flex;
    margin-right: .625rem;
}

/* Το κενό μπαίνει ανάμεσα στα κουμπιά και όχι κάτω από το καθένα: με δύο παρόχους
   χρειάζεται διάστημα, με έναν θα ήταν περιττό κενό πάνω από τον διαχωριστή. */
.oauth-wrap + .oauth-wrap[b-omov3ymjgp] {
    margin-top: .5rem;
}
/* /Components/YearLines.razor.rz.scp.css */
/* Το δεξί περιθώριο είναι η γούβα των ετικετών. Μπαίνει ΕΔΩ και όχι στο .year-plot:
   οι ετικέτες, ο κέρσορας και η ζώνη τοποθετούνται με ποσοστά που μετριούνται πάνω στο
   .year-plot, οπότε padding εκεί θα ξεσυγχρόνιζε τα ποσοστά από τις ίδιες τις γραμμές.
   Εδώ συρρικνώνονται μαζί και το γράφημα και οι μήνες από κάτω, άρα μένουν ευθυγραμμισμένα. */
.year-lines[b-c8y839m3pf] {
    display: flex;
    flex-direction: column;
    gap: .6rem;
    padding: .25rem 5.5rem 0 0;
    margin-bottom: .75rem;
}

.year-legend[b-c8y839m3pf] {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem 1rem;
    font-size: .8rem;
    color: var(--mud-palette-text-secondary);
}

.year-key[b-c8y839m3pf] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    cursor: default;
}

/* Τα παιδιά του κλειδιού δεν πιάνουν γεγονότα: αλλιώς η μετάβαση από το δείγμα στον
   αριθμό θα πυροδοτούσε mouseout/mouseover και το φωτισμένο έτος θα τρεμόπαιζε. */
.year-key > *[b-c8y839m3pf] { pointer-events: none; }

/* Το έτος που δείχνει ο κέρσορας — στο υπόμνημα ή πάνω στη γραμμή του. */
.year-key.hot[b-c8y839m3pf] {
    font-weight: 600;
    color: var(--mud-palette-text-primary);
}

/* Το υπόμνημα ακολουθεί το γράφημα: τα δύο πιο πρόσφατα έτη ξεχωρίζουν και εδώ, αλλιώς
   ο κατάλογος θα έδειχνε έξι ισότιμα έτη πάνω από ένα γράφημα που λέει το αντίθετο. */
.year-key.lead[b-c8y839m3pf] { color: var(--mud-palette-text-primary); }

/* Δείγμα γραμμής, όχι τετράγωνο — να μοιάζει με αυτό που δείχνει. */
.year-swatch[b-c8y839m3pf] {
    width: 1rem;
    height: 3px;
    border-radius: 2px;
}

/* Και το δείγμα διακεκομμένο, όπως η γραμμή του: το χρώμα μόνο του δεν θα έλεγε ποιο
   έτος είναι αυτό που δεν έχει κλείσει. */
.year-key.partial .year-swatch[b-c8y839m3pf] {
    background-image: linear-gradient(90deg, var(--mud-palette-surface) 40%, transparent 0);
    background-size: 5px 100%;
    border-radius: 0;
}

/* Το δείγμα ζυγίζει όσο και η γραμμή του — ίδια αναλογία με το γράφημα, και για τον ίδιο
   λόγο χωρίς σβήσιμο: ένα δείγμα στο 40% δεν αφήνει να διακρίνεις καν το χρώμα του, που
   είναι όλη κι όλη η δουλειά του. */
.year-key.lead .year-swatch[b-c8y839m3pf] { height: 5px; }
.year-key:not(.lead) .year-swatch[b-c8y839m3pf] { height: 3px; opacity: .85; }
.year-key.hot .year-swatch[b-c8y839m3pf] { opacity: 1; }

.year-plot[b-c8y839m3pf] {
    position: relative;
    height: 170px;
}

/* Όλα τα παιδιά αφήνουν το ποντίκι να «πέφτει» στο ίδιο το .year-plot: έτσι τα
   OffsetX/OffsetY του mousemove μετρούν πάντα από την ίδια αφετηρία, και ο εντοπισμός
   μήνα/γραμμής γίνεται με μαθηματικά αντί για αδύνατα hover σε γραμμές 2px. */
.year-plot > *[b-c8y839m3pf] { pointer-events: none; }

.year-grid[b-c8y839m3pf] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.year-gridline[b-c8y839m3pf] {
    height: 0;
    border-top: 1px dashed var(--mud-palette-lines-default);
    position: relative;
}

/* Αριστερά, όχι δεξιά: δεξιά κάθονται πλέον οι ετικέτες των γραμμών, και οι δύο μαζί
   θα τυπώνονταν η μία πάνω στην άλλη. Επικάλυψη με τον Ιανουάριο αντί για τον Δεκέμβριο
   — ίδιο κόστος, αλλά το δεξί άκρο είναι εκεί που το μάτι ψάχνει ποια γραμμή είναι ποια. */
.year-gridline span[b-c8y839m3pf] {
    position: absolute;
    left: 0;
    top: 2px;
    font-size: .7rem;
    color: var(--mud-palette-text-secondary);
}

/* Στη γραμμή του μηδενός η τιμή πάει από πάνω — από κάτω δεν υπάρχει χώρος. */
.year-gridline.zero span[b-c8y839m3pf] {
    top: auto;
    bottom: 2px;
}

/* Η ζώνη του ημιτελούς μήνα — κάτω από τις γραμμές, πάνω από το πλέγμα. Χρωματίζεται με
   το χρώμα του θέματος και όχι με σταθερό μπλε, ώστε να δουλεύει και στα δύο θέματα. */
.year-band[b-c8y839m3pf] {
    position: absolute;
    top: 0;
    bottom: 0;
    background: color-mix(in srgb, var(--mud-palette-text-secondary) 9%, transparent);
    border-radius: 4px;
}

.year-band span[b-c8y839m3pf] {
    position: absolute;
    top: 2px;
    left: 50%;
    transform: translateX(-50%);
    font-size: .62rem;
    letter-spacing: .02em;
    white-space: nowrap;
    color: var(--mud-palette-text-secondary);
}

/* Στα άκρα η ετικέτα θα έβγαινε έξω από την κάρτα — γέρνει προς τα μέσα. */
.year-band.at-start span[b-c8y839m3pf] { left: 0; transform: none; }
.year-band.at-end span[b-c8y839m3pf] { left: auto; right: 0; transform: none; }

.year-plot svg[b-c8y839m3pf] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
}

/* Το πάχος σε οθόνη, όχι στο σύστημα του viewBox — αλλιώς το preserveAspectRatio="none"
   θα τέντωνε τη γραμμή αλλού χοντρή κι αλλού ψιλή. */
.year-line[b-c8y839m3pf] {
    stroke-width: 1.8px;
    vector-effect: non-scaling-stroke;
    stroke-linejoin: round;
    stroke-linecap: round;
    transition: opacity .15s, stroke-width .15s;
}

/* Ιεραρχία σε ηρεμία: τα δύο πιο πρόσφατα έτη με βάρος, τα παλαιότερα ένα σκαλί πίσω.

   🔴 Η ιεραρχία βγαίνει από το ΠΑΧΟΣ, όχι από το σβήσιμο. Ενδιάμεση απόπειρα έριξε τα
   παλαιότερα έτη σε 1,1px και ένταση 30%: η ιεραρχία φάνηκε, αλλά οι τέσσερις παλιές
   γραμμές έπαψαν να διαβάζονται και το γράφημα κατέληξε να δείχνει δύο έτη αντί για έξι.
   Και τα έξι έτη είναι δεδομένα που κάποιος ζήτησε να δει· κανένα δεν είναι διακοσμητικό.
   Γι' αυτό η ένταση μένει ψηλά (85%) και η διαφορά είναι 3 προς 1,8 — αρκετή για να
   ξεχωρίσει το φετινό ζεύγος με μια ματιά, όχι τόσο ώστε να εξαφανίσει τα υπόλοιπα. */
.year-line.lead[b-c8y839m3pf] { stroke-width: 3px; }
.year-line.back[b-c8y839m3pf] { opacity: .85; }

/* Το τρέχον έτος δεν έχει κλείσει — διακεκομμένο, ώστε να μη διαβάζεται ως ολοκληρωμένη
   χρονιά. Το κενό λέει «λείπει η συνέχεια» καθαρότερα από τη διαφάνεια, που απλώς έκανε
   τη γραμμή του πιο δυσανάγνωστη ακριβώς εκεί που ενδιαφέρει περισσότερο. */
.year-line.partial[b-c8y839m3pf] {
    stroke-dasharray: 6 4;
}

/* Όσο ένα έτος είναι φωτισμένο, τα υπόλοιπα υποχωρούν — αλλιώς «πιο έντονο» δεν
   ξεχωρίζει μέσα σε εφτά γραμμές. Το .hot μετά το .partial: το φωτισμένο τρέχον
   έτος παίρνει πλήρη ένταση όσο κρατά το hover. */
.year-line.dim[b-c8y839m3pf] { opacity: .18; }

/* Καθαρά πάνω από το .lead των 3px, ώστε το φώτισμα να αλλάζει κάτι ορατό ακόμη κι όταν
   πέφτει σε ένα από τα δύο έτη που ήδη έχουν βάρος. */
.year-line.hot[b-c8y839m3pf] {
    opacity: 1;
    stroke-width: 4.2px;
}

/* Η ετικέτα στην άκρη της γραμμής. HTML και όχι SVG, όπως κάθε κείμενο εδώ: μέσα στο
   preserveAspectRatio="none" τα γράμματα παραμορφώνονται μαζί με τον άξονα. Το χρώμα του
   έτους μπαίνει inline στον αριθμό της χρονιάς — αυτός κάνει την αντιστοίχιση με τη γραμμή. */
.year-end[b-c8y839m3pf] {
    position: absolute;
    transform: translateY(-50%);
    margin-left: 10px;
    display: flex;
    align-items: baseline;
    gap: .3rem;
    font-size: .7rem;
    line-height: 1;
    white-space: nowrap;
}

.end-year[b-c8y839m3pf] { font-weight: 600; }
.end-value[b-c8y839m3pf] { color: var(--mud-palette-text-secondary); }

/* Η ετικέτα του τρέχοντος έτους πέφτει ΜΕΣΑ στο γράφημα, στον μήνα που σταματά η γραμμή
   του. Χωρίς φόντο θα διαβαζόταν πάνω σε ό,τι περνά από κάτω. */
.year-end.partial[b-c8y839m3pf] {
    background: var(--mud-palette-surface);
    border-radius: 4px;
    padding: 2px 4px;
    margin-left: 6px;
}

/* Το πιασμένο σημείο πάνω στη γραμμή — παίρνει το χρώμα του έτους του (inline). */
.year-dot[b-c8y839m3pf] {
    position: absolute;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 0 2px var(--mud-palette-surface);
}

/* Ο κατακόρυφος οδηγός του μήνα. HTML και όχι SVG: μέσα στο preserveAspectRatio="none"
   το πάχος μιας κατακόρυφης γραμμής τεντώνεται μαζί με τον άξονα Χ. */
.year-cursor[b-c8y839m3pf] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 0;
    border-left: 1px dashed var(--mud-palette-lines-default);
}

/* Ο πίνακας του μήνα κάθεται ΔΙΠΛΑ στον οδηγό, όχι πάνω του — αλλιώς θα σκέπαζε τα ίδια
   τα σημεία που εξηγεί. Στο δεξί μισό γυρίζει αριστερά για να μη βγει από την κάρτα. */
.year-column[b-c8y839m3pf] {
    position: absolute;
    top: 0;
    transform: translateX(12px);
    background: var(--mud-palette-surface);
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
    padding: .4rem .6rem;
    font-size: .75rem;
    white-space: nowrap;
    box-shadow: 0 4px 14px rgb(0 0 0 / .25);
    z-index: 2;
}

.year-column.left[b-c8y839m3pf] { transform: translateX(calc(-100% - 12px)); }

.col-month[b-c8y839m3pf] {
    font-weight: 600;
    margin-bottom: .2rem;
}

.col-row[b-c8y839m3pf] {
    display: flex;
    align-items: center;
    gap: .45rem;
    line-height: 1.5;
}

.col-swatch[b-c8y839m3pf] {
    width: .5rem;
    height: .5rem;
    border-radius: 50%;
    flex: none;
}

.col-year[b-c8y839m3pf] { color: var(--mud-palette-text-secondary); }

/* Τα ποσά σε δική τους στήλη, στοιχισμένα δεξιά — έτσι συγκρίνονται κάθετα με μια ματιά. */
.col-amount[b-c8y839m3pf] {
    margin-left: auto;
    padding-left: 1.2rem;
    font-weight: 600;
}

.year-months[b-c8y839m3pf] {
    display: flex;
    justify-content: space-between;
    font-size: .72rem;
    color: var(--mud-palette-text-secondary);
}

/* Σε στενή οθόνη η γούβα των 5,5rem κοστίζει περισσότερο απ' όσο αξίζουν οι ετικέτες:
   θα έτρωγε το ένα τρίτο του πλάτους από τις ίδιες τις γραμμές. Το υπόμνημα από πάνω
   κάνει τη δουλειά, και ο κέρσορας εξακολουθεί να δείχνει όλα τα έτη με το όνομά τους. */
@media (max-width: 700px) {
    .year-lines[b-c8y839m3pf] { padding-right: 0; }
    .year-end[b-c8y839m3pf] { display: none; }
}

/* Στο κινητό δώδεκα ονόματα μηνών δεν χωρούν — μένει μήνας παρά μήνα. */
@media (max-width: 480px) {
    .year-months span:nth-child(even)[b-c8y839m3pf] { visibility: hidden; }
    .year-plot[b-c8y839m3pf] { height: 130px; }

    /* Έξι γραμμές με το κανονικό βήμα δεν χωρούν σε γράφημα 130 pixel. */
    .year-column[b-c8y839m3pf] {
        font-size: .68rem;
        padding: .3rem .45rem;
    }

    .col-row[b-c8y839m3pf] { line-height: 1.35; }
    .col-amount[b-c8y839m3pf] { padding-left: .7rem; }
}
/* /Layout/MainLayout.razor.rz.scp.css */
/* Το στυλ της διάταξης ζει στο wwwroot/css/app.css — ένα σημείο, όχι δύο.
   Το αρχείο μένει κενό επίτηδες: το περιεχόμενο που είχε ήταν του template
   (μπλε gradient sidebar) και υπερίσχυε του σχεδιαστικού συστήματος. */
/* /Layout/NavMenu.razor.rz.scp.css */
/* Κενό επίτηδες — δες MainLayout.razor.css. Το μενού στυλίζεται στο app.css. */