/**
 * Syntaksi Pro — κοινό θέμα UI (tokens + επιφάνειες).
 * Φορτώνεται από τις σελίδες HTML· ένα σημείο αλλαγής για χρώμα φόντου / κάρτες / inset.
 * Ιεραρχία (paper, προεπιλογή): σελίδα λευκή · τομείς αχνό γκρι · πεδία λευκά.
 * data-app-surfaces="classic": σελίδα γκρι · τομείς λευκοί · πεδία αχνό γκρι.
 *
 * Ενιαίο radius: 0.625rem (10px). Τα pill (διακόπτες) μένουν 999px.
 */

:root {
    --app-bg: #ffffff;
    --app-surface: #f3f4f6;
    --app-field-bg: #ffffff;
    --app-inset-from: #f1f2f4;
    --app-inset-to: #eef0f2;
    --app-muted-fill: #f1f2f4;
    --app-surface-border: var(--app-surface);
    --app-focus-border: #a5b4fc;
    --app-radius: 0.625rem;
    --radius-md: var(--app-radius);
    --radius-lg: var(--app-radius);
    --radius-xl: var(--app-radius);
    --radius-2xl: var(--app-radius);
    --radius-3xl: var(--app-radius);
}

html[data-app-surfaces="classic"] {
    --app-bg: #e8eaec;
    --app-surface: #ffffff;
    --app-field-bg: #f8fafc;
    --app-inset-from: #f8fafc;
    --app-inset-to: #f1f5f9;
    --app-muted-fill: #f1f5f9;
    --app-surface-border: rgba(15, 23, 42, 0.08);
}

.app-surfaces-switch {
    display: flex;
    align-items: stretch;
    gap: 0.2rem;
    padding: 0.2rem;
    border-radius: var(--app-radius);
    background: #e8eaec;
}
html[data-app-surfaces="classic"] .app-surfaces-switch {
    background: #f1f5f9;
}
.app-surfaces-btn {
    flex: 1 1 0;
    min-width: 0;
    padding: 0.55rem 0.85rem;
    border: 0;
    border-radius: calc(var(--app-radius) - 0.1rem);
    background: transparent;
    color: #64748b;
    font-size: 0.875rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.app-surfaces-btn:hover {
    color: #334155;
}
.app-surfaces-btn.is-on {
    background: #fff;
    color: #4338ca;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}
.app-surfaces-btn:focus-visible {
    outline: 2px solid var(--app-focus-border);
    outline-offset: 1px;
}

.app-surface {
    background: var(--app-surface);
    border-radius: var(--radius-2xl);
    border: 1px solid var(--app-surface-border);
    box-shadow: none;
}

.app-surface--xl {
    background: var(--app-surface);
    border-radius: var(--radius-3xl);
    border: 1px solid var(--app-surface-border);
    box-shadow: none;
}

.app-inset-panel {
    border-radius: var(--radius-2xl);
    border: 1px solid rgba(148, 163, 184, 0.4);
    background: linear-gradient(180deg, var(--app-inset-from) 0%, var(--app-inset-to) 100%);
    box-shadow: none;
}

/* Ενιαίο radius με τα κουμπιά των Προσωπικών στοιχείων (rounded-xl = 0.75rem) */
.rounded,
.rounded-sm,
.rounded-md,
.rounded-lg,
.rounded-xl,
.rounded-2xl,
.rounded-3xl {
    border-radius: var(--app-radius) !important;
}

/* Κοινά πεδία φόρμας (Προϋπηρεσία + tabs καταμέτρησης) — ίδια εμφάνιση χωρίς panel overrides */
.app-label {
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 0.25rem;
}

.app-field {
    width: 100%;
    background: var(--app-field-bg);
    border: 1px solid #e2e8f0;
    border-radius: var(--radius-xl);
    padding: 0.625rem 0.75rem;
    color: #0f172a;
    outline: none;
    box-shadow: none;
}

/* Tailwind bg-slate-50 στα πεδία → λευκό γέμισμα (αντιστροφή γκρι/λευκού) */
input.bg-slate-50,
select.bg-slate-50,
textarea.bg-slate-50,
p.ee-days-months-eq.bg-slate-50 {
    background-color: var(--app-field-bg);
}

.app-field:focus {
    outline: none;
    border-width: 1px;
    border-color: var(--app-focus-border);
    box-shadow: none;
}

/* Κοινή τυπογραφία metrics σε μπάρες (σενάριο / προϋπηρεσία / συντάξιμες) */
.app-metric-label {
    display: block;
    text-align: center;
    font-size: 0.75rem;
    line-height: 1.25;
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    color: #64748b;
    margin-bottom: 0.375rem;
    word-wrap: break-word;
}
@media (min-width: 640px) {
    .app-metric-label {
        font-size: 0.875rem;
    }
}
.app-metric-label--accent {
    color: #4338ca;
}
.app-metric-label .app-metric-hint {
    font-weight: 400;
    color: #94a3b8;
    text-transform: none;
    letter-spacing: normal;
}
.app-metric-value,
.senario-bar-amount-font {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    font-weight: 900;
    letter-spacing: -0.025em;
    font-variant-numeric: tabular-nums;
    font-feature-settings: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #0f172a;
}
.app-metric-value,
.senario-bar-metric-value {
    font-size: 1.5rem;
    line-height: 1.25;
}

/* Μπάρα σεναρίου: metrics σε μία σειρά (η Παράλληλη εμφανίζεται μόνο όταν υπάρχει ποσό) */
.senario-sticky-metrics {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 0.5rem;
    width: 100%;
    min-width: 0;
}
.senario-sticky-metric {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    flex: 1 1 0;
    min-width: 0;
    padding: 0.75rem 0.5rem;
    border-radius: var(--app-radius);
    background: var(--app-field-bg);
    border: 1px solid #e2e8f0;
}
.senario-sticky-metric:hover {
    background: var(--app-field-bg);
    border-color: #cbd5e1;
}
html[data-app-surfaces="classic"] .senario-sticky-metric:hover {
    background: #fff;
}
.senario-sticky-metric .app-metric-label {
    font-size: 0.65rem;
    margin-bottom: 0.25rem;
    line-height: 1.2;
}
.senario-sticky-metric .senario-bar-metric-value {
    font-size: 1.05rem;
    line-height: 1.2;
    max-width: 100%;
    overflow-wrap: anywhere;
}
.senario-sticky-metric .senario-bar-delta {
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.3;
    min-height: 1.35rem;
    white-space: nowrap;
}
.senario-bar-delta.senario-bar-delta--pos { color: #047857; }
.senario-bar-delta.senario-bar-delta--neg { color: #e11d48; }
.senario-bar-delta.is-empty {
    visibility: hidden;
    min-height: 1.25rem;
}
.senario-sticky-metric.is-epik-excluded,
#btnOpenEpikourikisi.is-epik-excluded,
#btnOpenParallelAsfalisi.is-epik-excluded {
    opacity: 0.45;
    background: var(--app-muted-fill);
    border-color: #d4d8dc;
}
.senario-epik-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
    margin: 0;
    padding: 0.2rem 0.15rem;
    cursor: pointer;
    user-select: none;
    color: #334155;
}
.senario-epik-toggle input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
}
.senario-epik-toggle-track {
    position: relative;
    width: 2.75rem;
    height: 1.5rem;
    border-radius: 999px;
    background: #cbd5e1;
    border: 1px solid #94a3b8;
    transition: background-color 0.15s ease, border-color 0.15s ease;
    flex-shrink: 0;
}
.senario-epik-toggle-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.25);
    transition: transform 0.15s ease;
}
.senario-epik-toggle input:checked + .senario-epik-toggle-track {
    background: #4f46e5;
    border-color: #4338ca;
}
.senario-epik-toggle input:checked + .senario-epik-toggle-track .senario-epik-toggle-thumb {
    transform: translateX(1.2rem);
}
.senario-epik-toggle input:focus-visible + .senario-epik-toggle-track {
    outline: 2px solid #818cf8;
    outline-offset: 2px;
}
.senario-epik-toggle-text {
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.15;
    white-space: nowrap;
}
.senario-epik-toggle-text.is-off {
    text-decoration: line-through;
    text-decoration-thickness: 1.5px;
    color: #94a3b8;
    font-weight: 600;
}
@media (min-width: 640px) {
    .senario-sticky-metrics {
        gap: 0.625rem;
    }
    .senario-sticky-metric {
        padding: 0.875rem 0.625rem;
    }
    .senario-sticky-metric .app-metric-label {
        font-size: 0.72rem;
    }
    .senario-sticky-metric .senario-bar-metric-value {
        font-size: 1.2rem;
    }
}
@media (min-width: 1280px) {
    .senario-sticky-metric {
        padding: 1rem 0.75rem;
    }
    .senario-sticky-metric .app-metric-label {
        font-size: 0.8rem;
    }
    .senario-sticky-metric .senario-bar-metric-value {
        font-size: 1.35rem;
    }
}
@media (max-width: 639px) {
    .senario-sticky-metrics {
        flex-wrap: wrap;
    }
    .senario-sticky-metric {
        flex: 1 1 calc(33.333% - 0.35rem);
        min-width: 5.75rem;
    }
}

/**
 * Focus κελιών / πεδίων: λεπτό 1px περίγραμμα, χωρίς glow / ring.
 */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):focus,
select:focus,
textarea:focus,
[contenteditable="true"]:focus {
    outline: none !important;
    border-width: 1px !important;
    border-color: var(--app-focus-border) !important;
    --tw-ring-offset-width: 0px !important;
    --tw-ring-offset-shadow: 0 0 #0000 !important;
    --tw-ring-shadow: 0 0 #0000 !important;
    --tw-ring-width: 0px !important;
    --tw-shadow: 0 0 #0000 !important;
    box-shadow: none !important;
}

/* Χωρίς διακοσμητικές σκιές σε κάρτες / κουμπιά (κρατάμε μόνο λεπτό focus border στα πεδία) */
.shadow-sm,
.shadow,
.shadow-md,
.shadow-lg,
.shadow-xl,
.shadow-2xl,
.shadow-indigo-600\/20,
.shadow-indigo-600\/25 {
    --tw-shadow: 0 0 #0000 !important;
    --tw-shadow-colored: 0 0 #0000 !important;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}

/* Προϋπηρεσία κλειδωμένη από sync Καταμέτρησης */
#panelProypiresia input.proyp-sync-locked,
#panelProypiresia textarea.proyp-sync-locked {
    background: var(--app-muted-fill) !important;
    color: #334155 !important;
    cursor: default;
    opacity: 0.95;
}

/* ==========================================================================
   ATLAS App Modals — κοινό στυλ για όλα τα modals
   ========================================================================== */

:root {
    --app-modal-z: 99996;
    --app-modal-overlay-bg: rgba(15, 23, 42, 0.55);
    --app-modal-radius: 0.625rem;
    --app-modal-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(148, 163, 184, 0.15);
    --app-modal-head-bg: linear-gradient(180deg, #eef2ff 0%, #fff 100%);
}

.modal-overlay,
.lite-filter-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: var(--app-modal-z);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: var(--app-modal-overlay-bg);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.modal-overlay.open,
.lite-filter-modal-overlay.is-open {
    display: flex;
}

/* Katametrisi filter modals: hidden + is-open */
.lite-filter-modal-overlay:not(.hidden).is-open {
    display: flex;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.lite-filter-modal-overlay:not(.hidden):not(.is-open) {
    display: flex;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.lite-filter-modal-overlay {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}

.lite-filter-modal-overlay.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.lite-filter-modal-overlay.hidden {
    display: none !important;
}

.modal-overlay .modal-backdrop,
.lite-filter-modal-overlay .modal-backdrop {
    position: absolute;
    inset: 0;
    background: transparent;
}

.modal-overlay > .modal-box,
.modal-overlay > .app-surface,
.lite-filter-modal-panel {
    position: relative;
    z-index: 1;
    width: min(720px, 100%);
    max-height: min(85vh, 880px);
    overflow: auto;
    background: #fff;
    border-radius: var(--app-modal-radius);
    border: none;
    box-shadow: var(--app-modal-shadow) !important;
}

.lite-filter-modal-panel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    transform: scale(0.96) translateY(12px);
    transition: transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.lite-filter-modal-overlay.is-open .lite-filter-modal-panel {
    transform: scale(1) translateY(0);
}

.lite-filter-modal-panel--wide {
    width: min(960px, 100%);
    max-height: min(90vh, 920px);
}

#funds-picker-modal .lite-filter-modal-panel--wide {
    width: min(1320px, 96vw);
    max-height: min(92vh, 960px);
}

/* Πλάτη ανά τύπο (υπερκαλύπτουν το default 720px) */
.modal-overlay > .modal-box.modal-box-wide,
#modalAppSettings .modal-box-wide {
    width: min(96vw, 64rem);
    max-width: min(96vw, 64rem);
}

.modal-overlay > .modal-box.modal-box-analysis {
    width: min(96vw, 79.2rem);
    max-width: min(96vw, 79.2rem);
}

.modal-overlay > .modal-box.modal-box-print {
    width: min(96vw, 72rem);
    max-width: min(96vw, 72rem);
    max-height: min(92vh, 52rem);
}

.modal-overlay > .modal-box.max-w-lg,
.modal-overlay > .app-surface.max-w-lg {
    width: min(32rem, 100%);
    max-width: min(32rem, 100%);
}

/* Ενιαίο πρότυπο modal ανάλυσης metrics (μπάρα σεναρίου) */
.modal-overlay > .modal-box.modal-box-metric {
    width: min(40rem, calc(100vw - 2rem));
    max-width: min(40rem, calc(100vw - 2rem));
}

/* Επικουρική: πλατύτερο για Α | Β δίπλα-δίπλα */
.modal-overlay > .modal-box.modal-box-metric.modal-box-metric--wide {
    width: min(58rem, calc(100vw - 2rem));
    max-width: min(58rem, calc(100vw - 2rem));
}

.modal-box-metric .metric-modal-ab-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.15rem 1.75rem;
    align-items: start;
    margin: 0 0 18px;
}
.modal-box-metric .metric-modal-ab-col {
    min-width: 0;
}
.modal-box-metric .metric-modal-ab-col + .metric-modal-ab-col {
    padding-left: 1.5rem;
    border-left: 1px solid #e2e8f0;
}
.modal-box-metric .metric-modal-ab-col .metric-modal-rows {
    margin-bottom: 0;
}
@media (max-width: 720px) {
    .modal-box-metric .metric-modal-ab-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
    .modal-box-metric .metric-modal-ab-col + .metric-modal-ab-col {
        padding-left: 0;
        border-left: 0;
        padding-top: 0.35rem;
        border-top: 1px solid #e2e8f0;
    }
}

.modal-box-metric .metric-modal-hero {
    border-radius: var(--app-radius);
    padding: 16px 18px;
    margin: 0 0 20px;
    color: #fff;
}
.modal-box-metric .metric-modal-hero--indigo {
    background: linear-gradient(160deg, #4f46e5 0%, #3730a3 100%);
}
.modal-box-metric .metric-modal-hero--violet {
    background: linear-gradient(160deg, #7c3aed 0%, #4c1d95 100%);
}
.modal-box-metric .metric-modal-hero--emerald {
    background: linear-gradient(160deg, #059669 0%, #064e3b 100%);
}
.modal-box-metric .metric-modal-hero--teal {
    background: linear-gradient(160deg, #0d9488 0%, #134e4a 100%);
}
.modal-box-metric .metric-modal-hero-kicker {
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.82);
}
.modal-box-metric .metric-modal-hero-value {
    margin: 0;
    font-size: 1.875rem;
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: -0.025em;
    font-variant-numeric: tabular-nums;
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
}
.modal-box-metric .metric-modal-hero-value--pair {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: flex-start;
    gap: 0.5rem 0.75rem;
}
.modal-box-metric .metric-modal-hero-value--pair > * {
    margin: 0;
    font: inherit;
    letter-spacing: inherit;
}
.modal-box-metric .metric-modal-hero-sep {
    color: rgba(255, 255, 255, 0.45);
    user-select: none;
    flex-shrink: 0;
}
.modal-box-metric .metric-modal-hero-sub {
    margin: 8px 0 0;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.86);
}
.modal-box-metric .metric-modal-hero-warn {
    margin: 8px 0 0;
    font-size: 14px;
    font-weight: 600;
    color: #fecaca;
}
.modal-box-metric .metric-modal-hero-delta {
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}
.modal-box-metric .metric-modal-hero-delta.is-neg { color: #fecaca; }
.modal-box-metric .metric-modal-hero-delta.is-pos { color: #a7f3d0; }
.modal-box-metric .metric-modal-badge {
    display: inline-flex;
    align-items: center;
    margin-top: 10px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(16, 185, 129, 0.22);
    color: #a7f3d0;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
}
.modal-box-metric .metric-modal-badge.hidden,
.modal-box-metric .metric-modal-hero-warn.hidden {
    display: none;
}
.modal-box-metric .metric-modal-section-title {
    margin: 0 0 12px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}
.modal-box-metric .metric-modal-section-title .metric-modal-section-hint {
    text-transform: none;
    letter-spacing: normal;
    font-weight: 500;
    color: #94a3b8;
}
.modal-box-metric .metric-modal-rows {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0 0 22px;
    font-size: 16px;
    line-height: 1.45;
}
.modal-box-metric .metric-modal-rows:last-of-type {
    margin-bottom: 0;
}
.modal-box-metric .metric-modal-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 16px;
}
.modal-box-metric .metric-modal-label {
    color: #475569;
    font-weight: 500;
    min-width: 0;
}
.modal-box-metric .metric-modal-value {
    color: #0f172a;
    font-weight: 700;
    font-size: 16px;
    font-variant-numeric: tabular-nums;
    text-align: right;
    flex-shrink: 0;
    max-width: 58%;
}
.modal-box-metric .metric-modal-value.is-neg { color: #dc2626; }
.modal-box-metric .metric-modal-value.is-pos { color: #059669; }
.modal-box-metric .metric-modal-value--accent { color: #4f46e5; }
.modal-box-metric .metric-modal-value--teal { color: #0f766e; }
.modal-box-metric .metric-modal-row--total {
    padding-top: 10px;
    margin-top: 2px;
    border-top: 1px solid #e2e8f0;
}
.modal-box-metric .metric-modal-row--total + .metric-modal-row--total {
    border-top: none;
    padding-top: 0;
    margin-top: 0;
}
.modal-box-metric .metric-modal-row--strong .metric-modal-label,
.modal-box-metric .metric-modal-row--strong .metric-modal-value {
    font-weight: 800;
    color: #0f172a;
}
.modal-box-metric .metric-modal-row--total .metric-modal-label,
.modal-box-metric .metric-modal-row--total .metric-modal-value {
    font-weight: 800;
    color: #0f172a;
}
.modal-box-metric .metric-modal-row--total .metric-modal-value--accent { color: #4f46e5; }
.modal-box-metric .metric-modal-row--total .metric-modal-value--teal { color: #0f766e; }
.modal-box-metric .metric-modal-steps {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #e2e8f0;
}
.modal-box-metric .metric-modal-steps .metric-modal-rows {
    margin-bottom: 0;
    font-size: 16px;
}
.modal-box-metric .metric-modal-steps .metric-modal-label {
    color: #64748b;
}
.modal-box-metric .metric-modal-note {
    margin: 16px 0 0;
    font-size: 13px;
    color: #64748b;
    line-height: 1.55;
}
.modal-box-metric .metric-modal-group-label {
    margin: 4px 0 2px;
    padding: 6px 0 2px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
    border-top: 1px dashed #e2e8f0;
}
.modal-box-metric .metric-modal-group-label:first-child {
    border-top: none;
    margin-top: 0;
    padding-top: 0;
}
.modal-box-metric .metric-modal-group-label--future {
    color: #4338ca;
    border-top-color: #c7d2fe;
}
.modal-box-metric .metric-modal-group {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.modal-box-metric .metric-modal-group.hidden {
    display: none;
}
#epikBMisthotiWrap:not(.hidden),
#epikBEeWrap:not(.hidden) {
    display: contents;
}

.modal-overlay > .app-surface.max-w-2xl {
    width: min(42rem, 100%);
    max-width: min(42rem, 100%);
}

#modalNewScenarioSetup {
    z-index: calc(var(--app-modal-z) + 10);
}

#modalNewScenarioSetup .new-scenario-modal-shell.modal-box {
    width: min(92vw, 36rem);
    max-width: min(92vw, 36rem);
    overflow: hidden;
}

.app-modal-head,
.lite-filter-modal-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 22px 26px 18px;
    border-bottom: 1px solid #e2e8f0;
    background: var(--app-modal-head-bg);
    flex-shrink: 0;
}

.app-modal-head h2,
.app-modal-head h3,
.lite-filter-modal-head h2,
.lite-filter-modal-head h3,
.app-modal-head .app-modal-title {
    margin: 0;
    font-size: 24px;
    font-weight: 800;
    color: #1e293b;
    line-height: 1.35;
}

.app-modal-sub,
.lite-filter-modal-sub {
    margin: 6px 0 0;
    font-size: 13px;
    line-height: 1.45;
    color: #64748b;
    font-weight: 500;
}

.app-modal-close,
.lite-filter-modal-close,
.modal-overlay button[aria-label="Κλείσιμο"],
#period-filter-modal-close,
#syntaksimes-period-filter-modal-close,
#funds-picker-modal-x {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border: none;
    border-radius: var(--app-radius);
    background: #e0e7ff;
    color: #4338ca;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: background 0.15s, color 0.15s;
}

.app-modal-close:hover,
.lite-filter-modal-close:hover,
.modal-overlay button[aria-label="Κλείσιμο"]:hover,
#period-filter-modal-close:hover,
#syntaksimes-period-filter-modal-close:hover,
#funds-picker-modal-x:hover {
    background: #c7d2fe;
    color: #312e81;
}

.app-modal-body,
.lite-filter-modal-body {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: 18px 28px 22px;
}

.app-modal-foot,
.lite-filter-modal-foot {
    display: flex;
    gap: 10px;
    padding: 16px 26px 22px;
    border-top: 1px solid #e2e8f0;
    background: #f8fafc;
    flex-shrink: 0;
    align-items: center;
    flex-wrap: wrap;
}

.app-modal-btn,
.lite-filter-modal-btn {
    padding: 11px 20px;
    border-radius: var(--app-radius);
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #334155;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
}

.app-modal-btn:hover,
.lite-filter-modal-btn:hover {
    border-color: #6366f1;
    color: #4f46e5;
    background: #eef2ff;
}

.app-modal-btn--primary,
.lite-filter-modal-apply {
    margin-left: auto;
    background: #2563eb;
    color: #fff;
    border-color: #2563eb;
}

.app-modal-btn--primary:hover,
.lite-filter-modal-apply:hover {
    background: #1d4ed8;
    border-color: #1d4ed8;
    color: #fff;
}

.lite-filter-modal-toolbar {
    padding: 16px 26px 0;
    flex-shrink: 0;
}

.lite-filter-modal-toolbar-row {
    display: flex;
    gap: 10px;
    width: 100%;
}

.lite-filter-modal-search {
    flex: 1;
    min-width: 0;
    padding: 12px 16px;
    border: 1px solid #cbd5e1;
    border-radius: var(--app-radius);
    font-size: 17px;
    font-family: inherit;
    color: #1e293b;
    background: #fff;
}

.lite-filter-modal-search:focus {
    border-color: #6366f1;
    outline: none;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.lite-filter-modal-search::placeholder {
    color: #64748b;
}

/* Νέο σενάριο: ίδιο head με τα υπόλοιπα (όχι ξεχωριστό dark gradient) */
.new-scenario-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 22px 26px 18px;
    border-bottom: 1px solid #e2e8f0;
    background: var(--app-modal-head-bg);
    color: #1e293b;
}

.new-scenario-modal-header h3 {
    margin: 0;
    font-size: 24px;
    font-weight: 800;
    color: #1e293b;
    line-height: 1.35;
}

.new-scenario-modal-header p,
#newScenarioModalSubtitle {
    color: #64748b !important;
}

.new-scenario-modal-header .shrink-0.w-11 {
    background: #e0e7ff !important;
    color: #4338ca;
    box-shadow: none !important;
}

/* ---- App Confirm ---- */
#modalAppConfirm {
    z-index: calc(var(--app-modal-z) + 40);
}

#modalAppConfirm .modal-box {
    width: min(28rem, 100%);
    max-width: min(28rem, 100%);
    padding: 0;
    overflow: hidden;
}

#modalAppConfirm .app-modal-body {
    white-space: pre-line;
    font-size: 15px;
    line-height: 1.55;
    color: #334155;
}

#modalAppConfirm .app-modal-btn--danger {
    margin-left: auto;
    background: #dc2626;
    border-color: #dc2626;
    color: #fff;
}

#modalAppConfirm .app-modal-btn--danger:hover {
    background: #b91c1c;
    border-color: #b91c1c;
    color: #fff;
}

/* ---- Συνυπολογισμός εξωτερικού (μπάρα σεναρίου) ---- */
.senario-synyp-strip {
    width: 100%;
    min-width: 0;
    margin-top: 0.15rem;
}
.senario-synyp-strip-kicker {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
    margin: 0 0 0.4rem;
}
.senario-synyp-strip-cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}
.senario-synyp-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.15rem;
    text-align: left;
    padding: 0.65rem 0.75rem;
    border-radius: var(--app-radius);
    background: var(--app-field-bg);
    border: 1px solid #e2e8f0;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.senario-synyp-card:hover {
    background: var(--app-field-bg);
    border-color: #c7d2fe;
}
html[data-app-surfaces="classic"] .senario-synyp-card:hover {
    background: #fff;
}
.senario-synyp-card.is-proposed {
    background: #eef2ff;
    border-color: #818cf8;
    box-shadow: 0 0 0 1px rgba(99, 102, 241, 0.25);
}
.senario-synyp-card.is-dimmed {
    opacity: 0.62;
}
.senario-synyp-card-label {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
}
.senario-synyp-card.is-proposed .senario-synyp-card-label {
    color: #4338ca;
}
.senario-synyp-card-value {
    font-size: 1.05rem;
    font-weight: 800;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}
.senario-synyp-strip-hint {
    margin: 0.45rem 0 0;
    font-size: 0.72rem;
    line-height: 1.4;
    color: #475569;
}
@media (max-width: 639px) {
    .senario-synyp-strip-cards {
        grid-template-columns: 1fr;
    }
}
