.topbar .brand { display: flex; align-items: center; gap: 8px; }
.login-logo img { display: block; margin: 0 auto; }

:root {
  --bg: #eef1f4;               /* απαλό ψυχρό γκρι ground (Stitch) */
  --bg-elev: #ffffff;
  --bg-elev2: #eef2f4;         /* tracks / chips */
  --line: #e4e9ec;
  --text: #131b21;
  --muted: #64727c;
  --accent: #0f7a5a;           /* Ledger βαθύ σμαραγδί */
  --accent-d: #0c6249;
  --accent-soft: #dcece5;
  --income: #12986c;           /* πιο λαμπερό πράσινο για ποσά (Stitch pop) */
  --danger: #e5484d;
  --warn: #e0902a;
  --topbar-bg: rgba(255,255,255,.82);
  --shadow: 0 1px 2px rgba(20,40,50,.05), 0 10px 26px rgba(20,40,50,.055);
  --radius: 18px;
}

[data-theme="dark"] {
  --bg: #0d1216;
  --bg-elev: #141b21;
  --bg-elev2: #1b242b;
  --line: #26313a;
  --text: #e7eef2;
  --muted: #8b9ca6;
  --accent: #35c692;
  --accent-d: #2ba97b;
  --accent-soft: #123027;
  --income: #35c692;
  --danger: #ff6b6b;
  --warn: #e8b13a;
  --topbar-bg: rgba(13,18,22,.9);
  --shadow: 0 1px 2px rgba(0,0,0,.25), 0 12px 30px rgba(0,0,0,.28);
}

/* Aurora — παλέτα του landing (σκούρο teal, mint accent, glow) */
[data-theme="aurora"] {
  --bg: #07110f;
  --bg-elev: #11231e;          /* κάρτες (surface) */
  --bg-elev2: #17302a;         /* chips / tracks */
  --line: rgba(222,255,244,.12);
  --text: #f4fbf7;
  --muted: #a3b7ae;
  --accent: #35c692;           /* κουμπιά/links (λευκό κείμενο — proven) */
  --accent-d: #2ba97b;
  --accent-soft: rgba(118,244,181,.13);
  --income: #6cf0b4;           /* λαμπερό mint για ποσά/θετικά */
  --danger: #ff8f91;
  --warn: #ffc76a;
  --topbar-bg: rgba(6,16,14,.82);
  --shadow: 0 18px 50px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.03);
  --radius: 20px;
  --field-bd: rgba(222,255,244,.16);
}
/* Απαλά radial glows στο φόντο (όπως το landing) */
[data-theme="aurora"] body {
  background:
    radial-gradient(1200px 520px at 8% -6%, rgba(67,215,153,.12), transparent 60%),
    radial-gradient(1000px 460px at 100% -2%, rgba(118,185,255,.08), transparent 55%),
    var(--bg);
  background-attachment: fixed;
}
/* Ελαφρύ glow στο ενεργό accent (κουμπιά/δείκτες) */
[data-theme="aurora"] .btn-primary,
[data-theme="aurora"] button[type="submit"] { box-shadow: 0 12px 30px rgba(53,198,146,.20); }

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

html, body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  font-size: 16px;
  transition: background .2s ease, color .2s ease;
}

.hidden { display: none !important; }
.muted { color: var(--muted); }
.error { color: var(--danger); font-size: .9rem; }

button {
  font: inherit; cursor: pointer; border: none; border-radius: 12px;
  background: var(--accent); color: #ffffff; font-weight: 650; padding: 12px 16px;
}
button:disabled { opacity: .6; }

input, select {
  font: inherit; color: var(--text); background: var(--bg-elev);
  border: 1px solid var(--field-bd, var(--line)); border-radius: 10px; padding: 10px 12px;
  box-shadow: 0 1px 1px rgba(20,30,50,.03);
}
input::placeholder { color: var(--muted); }
input:hover, select:hover { border-color: #b9c2d0; }
[data-theme="dark"] input:hover, [data-theme="dark"] select:hover { border-color: #3a465c; }
input:focus, select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(47,158,107,.18); }

/* ---------- Login ---------- */
.login {
  position: fixed; inset: 0; display: grid; place-items: center; padding: 24px;
}
.login-card {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 32px 28px; width: 100%; max-width: 340px;
  display: flex; flex-direction: column; gap: 12px; text-align: center;
  box-shadow: var(--shadow);
}
.login-logo { font-size: 48px; }
.login-card h1 { margin: 0; font-size: 1.6rem; }
.login-card p { margin: 0 0 8px; }
.login-card input { text-align: center; }
.login-demo { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-top: 6px; padding-top: 14px; border-top: 1px solid var(--line); }
.login-or { color: var(--muted); font-size: .8rem; }
.login-demo-btn { background: var(--bg-elev2); color: var(--text); border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; font-weight: 600; cursor: pointer; width: 100%; }
.login-demo-btn:hover { border-color: var(--accent); color: var(--accent); }
.login-demo-hint { font-size: .74rem; }

/* ---------- App shell ---------- */
.app { min-height: 100vh; padding-bottom: 76px; }

.topbar {
  position: sticky; top: 0; z-index: 10;
  background: var(--topbar-bg); backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
  padding-top: env(safe-area-inset-top);
}
.topbar-row {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; max-width: 760px; margin: 0 auto;
}
.topbar-actions { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.user-chip {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--bg-elev2); color: var(--text);
  padding: 4px 10px 4px 4px; border-radius: 999px;
  font-size: .82rem; font-weight: 600; max-width: 160px;
}
.user-chip .uc-avatar {
  flex: none; width: 24px; height: 24px; border-radius: 50%;
  background: var(--accent); color: #fff;
  display: grid; place-items: center; font-size: .78rem; font-weight: 700;
}
.user-chip.is-admin .uc-avatar { background: linear-gradient(135deg, var(--accent), var(--accent-d, var(--accent))); }
.user-chip.is-demo { border: 1px solid var(--warn, #e0a416); }
.user-chip.is-demo .uc-avatar { background: var(--warn, #e0a416); }
.user-chip.is-demo .uc-name { color: var(--warn, #e0a416); font-weight: 700; }
.user-chip .uc-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 520px) {
  .user-chip { padding: 3px; gap: 0; }
  .user-chip .uc-name { display: none; }
}
.brand { font-weight: 700; font-size: 1.1rem; cursor: pointer; user-select: none; }
.brand:hover { opacity: .8; }
.icon-btn { background: var(--bg-elev2); color: var(--text); padding: 8px 10px; border-radius: 10px; display: inline-grid; place-items: center; }
.icon-btn svg { width: 20px; height: 20px; display: block; }
.icon-btn:hover { color: var(--accent); }
.install-btn, .install-btn:hover { color: #fff; }
.install-btn { background: var(--accent); }

.monthbar { border-top: 1px solid var(--line); padding: 10px 16px 12px; }
.scope-seg { display: flex; width: fit-content; background: var(--bg-elev2); border-radius: 9px; padding: 3px; gap: 2px; margin: 0 auto 8px; }
.scope-seg button {
  background: transparent; color: var(--muted); border: none; cursor: pointer;
  padding: 5px 16px; border-radius: 7px; font-size: .82rem; font-weight: 600;
}
.scope-seg button.active { background: var(--accent); color: #fff; }
#yearLabel { display: inline-grid; place-items: center; }
.month-nav { display: flex; align-items: center; justify-content: center; gap: 12px; max-width: 760px; margin: 0 auto; }
.mn-arrow {
  background: var(--bg-elev2); color: var(--text); width: 36px; height: 36px;
  padding: 0; border-radius: 50%; font-size: 1.4rem; line-height: 1; display: grid; place-items: center;
}
.mn-arrow:disabled { opacity: .3; }
.month-picker { padding: 8px 14px; font-weight: 600; text-align: center; text-align-last: center; min-width: 150px; }
.month-summary { display: flex; justify-content: center; gap: 16px; margin-top: 8px; font-size: .85rem; font-weight: 600; }
.month-summary .ms-out { color: var(--danger); }
.month-summary .ms-in { color: var(--income); }
.month-summary .ms-net.neg { color: var(--danger); }
.month-summary .ms-net.pos { color: var(--income); }

main { padding: 16px; max-width: 760px; margin: 0 auto; }
.view { display: flex; flex-direction: column; gap: 16px; }

.card {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 16px; box-shadow: var(--shadow);
}

/* ---------- Dashboard ---------- */
.summary-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.stat {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center;
  gap: 4px 10px; padding: 15px 15px; text-align: left; overflow: hidden;
}
.stat-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.stat-spark { display: none; width: 74px; align-self: center; }
.spark-svg { width: 100%; height: 36px; display: block; }
@media (min-width: 560px) { .stat-spark { display: block; } }
.stat-label { font-size: .8rem; color: var(--text); font-weight: 650; line-height: 1.1; }
.stat-label small { display: block; font-size: .64rem; color: var(--muted); font-weight: 500; margin-top: 1px; }
.stat-value { font-size: 1.42rem; font-weight: 750; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.stat-delta { font-size: .74rem; font-weight: 650; font-variant-numeric: tabular-nums; }
.stat-delta.up { color: var(--income); }
.stat-delta.down { color: var(--danger); }
.stat-delta.flat { color: var(--muted); }
.stat-in .stat-value { color: var(--income); }
.stat-out .stat-value { color: var(--danger); }
.stat-net .stat-value { color: var(--text); }
.stat-value.negative { color: var(--danger); }
.stat-avg { font-size: .72rem; color: var(--muted); margin-top: 2px; }

/* ---------- Οδηγός χρήσης ---------- */
.guide-content { line-height: 1.6; max-width: 70ch; }
.guide-content h2 {
  font-size: 1.3rem; font-weight: 750; letter-spacing: -.02em; margin: 26px 0 10px;
  padding-bottom: 8px; border-bottom: 2px solid var(--accent-soft); scroll-margin-top: 80px;
}
.guide-content h2:first-child { margin-top: 0; }
.guide-content h3 { font-size: 1.06rem; font-weight: 680; margin: 18px 0 4px; }
.guide-content h4 { font-size: .96rem; font-weight: 650; margin: 14px 0 2px; }
.guide-content p { margin: 8px 0; }
.guide-content p:first-of-type { font-size: 1.02rem; }
.guide-content ul { margin: 8px 0 12px; padding-left: 4px; list-style: none; }
.guide-content li { margin: 6px 0; padding-left: 24px; position: relative; }
.guide-content li::before {
  content: ''; position: absolute; left: 6px; top: .62em; width: 7px; height: 7px;
  border-radius: 50%; background: var(--accent);
}
.guide-content hr { border: none; border-top: 1px solid var(--line); margin: 22px 0; }
.guide-content code { background: var(--bg-elev2); padding: 1px 6px; border-radius: 6px; font-size: .86em; }
.guide-content em { color: var(--muted); font-style: normal; background: var(--bg-elev2); padding: 8px 12px; border-radius: 10px; display: inline-block; }
.guide-content b { color: var(--text); }

.breakdown { display: flex; flex-direction: column; gap: 14px; }
.cat-row { display: flex; flex-direction: column; gap: 6px; }
.cat-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.cat-amounts { font-variant-numeric: tabular-nums; font-weight: 650; white-space: nowrap; }
.cat-name { display: flex; align-items: center; gap: 10px; font-weight: 560; }
.cat-icon {
  --c: var(--muted);
  width: 32px; height: 32px; flex: none; border-radius: 50%;
  display: inline-grid; place-items: center; font-size: 1rem;
  background: color-mix(in srgb, var(--c) 16%, transparent); color: var(--c);
}
.cat-amounts b.over { color: var(--danger); }

.bar-track {
  position: relative; height: 12px; background: var(--bg-elev2);
  border-radius: 999px; overflow: hidden;
}
.bar-fill { height: 100%; border-radius: 999px; transition: width .4s ease; }
.bar-budget {
  position: absolute; top: -2px; bottom: -2px; width: 2px;
  background: var(--text); opacity: .6;
}

.empty { text-align: center; color: var(--muted); padding: 40px 16px; line-height: 1.6; }

/* ---------- Charts ---------- */
.charts-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.chart-card { display: flex; flex-direction: column; gap: 12px; }
.chart-title { margin: 0; font-size: 1rem; font-weight: 680; letter-spacing: -.01em; }
.chart-title.center { text-align: center; }

/* Κατανομή εξόδων: donut + λίστα-με-μπάρες σε μία κάρτα (Stitch) */
.spend-cat-card { display: flex; flex-direction: column; gap: 14px; }
.spend-cat-body { display: grid; gap: 20px; grid-template-columns: 1fr; }
.spend-cat-card .donut-wrap { flex-direction: column; align-items: center; }
.spend-cat-card .donut-legend { flex: none; width: 100%; }
@media (min-width: 620px) {
  .spend-cat-body { grid-template-columns: 230px 1fr; align-items: start; }
}
.donut-wrap { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.donut-svg { position: relative; width: 168px; height: 168px; flex: none; margin: 0 auto; }
.donut { width: 100%; height: 100%; }
.donut-center {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 2px;
}
.donut-center span { font-size: .7rem; color: var(--muted); }
.donut-center b { font-size: 1.02rem; }
.donut-legend {
  list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column;
  gap: 6px; flex: 1; min-width: 150px; font-size: .85rem;
}
.donut-legend li { display: flex; align-items: center; gap: 8px; }
.donut-legend b { margin-left: auto; white-space: nowrap; }
.dot { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.trend { display: flex; align-items: flex-end; justify-content: space-around; gap: 8px; height: 124px; padding-top: 8px; }
.trend-col { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 1; min-width: 0; }
.trend-bars { display: flex; align-items: flex-end; gap: 3px; height: 92px; }
.tb { width: 12px; border-radius: 3px 3px 0 0; transition: height .3s ease; }
.tb-in { background: var(--accent); }
.tb-out { background: var(--danger); }
.trend-label { font-size: .72rem; color: var(--muted); white-space: nowrap; }
@media (max-width: 640px) { .charts-grid { grid-template-columns: 1fr; } }

/* ---------- Spend line chart (ανά ημέρα/μήνα) ---------- */
.spend-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.spend-toggles { display: flex; gap: 12px; }
.spend-toggle { display: inline-flex; align-items: center; gap: 6px; font-size: .82rem; color: var(--muted); cursor: pointer; user-select: none; }
.spend-toggle input { width: auto; accent-color: var(--accent); margin: 0; cursor: pointer; }
.spend-toggle.out::before, .spend-toggle.in::before { content: ''; width: 12px; height: 3px; border-radius: 2px; }
.spend-toggle.out::before { background: var(--danger); }
.spend-toggle.in::before { background: var(--accent); }
.spend-body { display: flex; gap: 16px; align-items: stretch; }
.spend-chart { position: relative; min-height: 120px; flex: 1; min-width: 0; }
.spend-side { display: none; }
.sc-wrap { position: relative; width: 100%; }
.spend-svg { width: 100%; height: auto; display: block; touch-action: pan-y; }
.sc-line { fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; }
.sc-dot { stroke: none; }
.sc-dot.out { fill: var(--danger); }
.sc-dot.in { fill: var(--accent); }
.sc-dot.big { stroke: var(--bg-elev); stroke-width: 1.5; }
.sc-grid { stroke: var(--line); stroke-width: 1; vector-effect: non-scaling-stroke; }
.sc-guide { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 3 3; opacity: .7; vector-effect: non-scaling-stroke; }
.sc-ylab, .sc-xlab { fill: var(--muted); font-size: 11px; font-family: inherit; }
.spend-tip {
  position: absolute; top: 4px; pointer-events: auto; z-index: 5;
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: 10px;
  padding: 8px 10px; box-shadow: 0 4px 16px rgba(20,30,50,.18); font-size: .8rem; white-space: nowrap;
}
.spend-tip.has-ai { white-space: normal; max-width: min(320px, 88%); }
.sc-ai { margin-top: 8px; border-top: 1px solid var(--line); padding-top: 8px; }
.sc-ai-head { font-size: .74rem; font-weight: 600; color: var(--muted); margin-bottom: 4px; }
.sc-ai-body { max-height: 200px; overflow: auto; font-size: .78rem; line-height: 1.45; }
.sc-ai-body h2, .sc-ai-body h3 { font-size: .82rem; margin: 6px 0 2px; }
.sc-ai-body ul { margin: 2px 0; padding-left: 18px; }
.sc-ai-body li { margin: 1px 0; }
.sc-ai-body p { margin: 3px 0; }
.sc-aibtn {
  display: inline-block; width: 100%; padding: 7px 10px; border-radius: 8px; cursor: pointer;
  background: var(--accent); color: #fff; border: none; font-size: .78rem; font-weight: 600;
}
.sc-aibtn:hover { background: var(--accent-d); }
.sc-ai-load { font-size: .78rem; }
.sc-ai-load.bad { color: var(--danger); margin-bottom: 6px; }
.spend-queue { font-size: .78rem; color: var(--accent); font-weight: 600; margin-left: 4px; }

/* Desktop: σταθερό πλαϊνό panel αντί για floating tooltip πάνω στο διάγραμμα */
@media (min-width: 900px) {
  .spend-side {
    display: block; flex: 0 0 288px; width: 288px; align-self: stretch;
    border-left: 1px solid var(--line); padding-left: 16px; overflow: auto; max-height: 340px;
  }
  .spend-side .spend-tip {
    position: static; display: block; box-shadow: none; border: none; background: none;
    padding: 0; max-width: none; white-space: normal;
  }
  .spend-side .sc-ai-body { max-height: none; }
  .spend-side:empty::before,
  .spend-side .sc-side-hint { color: var(--muted); font-size: .82rem; }
  .spend-card .sc-wrap .spend-tip { display: none !important; }   /* όχι floating πάνω στο διάγραμμα */
}
.sc-tip-title { font-weight: 600; margin-bottom: 4px; }
.sc-tip-row { display: flex; align-items: center; gap: 6px; }
.sc-tip-row + .sc-tip-row { margin-top: 2px; }
.sc-tip-row .sc-dotm { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.sc-tip-row.out .sc-dotm { background: var(--danger); }
.sc-tip-row.in .sc-dotm { background: var(--accent); }
.sc-tip-k { color: var(--muted); }
.sc-tip-row b { margin-left: 2px; }
.sc-delta { margin-left: 6px; font-size: .74rem; font-weight: 600; }
.sc-delta.good { color: var(--accent); }
.sc-delta.bad { color: var(--danger); }
.sc-tip-foot { margin-top: 4px; font-size: .72rem; }

/* ---------- AI ---------- */
.ai-card { display: flex; flex-direction: column; gap: 12px; }
.ai-toggle {
  background: none; color: var(--text); padding: 0; width: 100%;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
}
.ai-toggle .chart-title { margin: 0; }
.ai-chevron { color: var(--muted); transition: transform .2s ease; font-size: 1rem; }
.ai-card.collapsed .ai-chevron { transform: rotate(-90deg); }
.ai-card.collapsed .ai-body { display: none; }
.ai-body { display: flex; flex-direction: column; gap: 12px; }
.ai-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.ai-output { background: var(--bg-elev2); border-radius: 10px; padding: 12px 14px; font-size: .9rem; line-height: 1.55; }
.ai-output p { margin: 0 0 8px; }
.ai-output p:last-child { margin-bottom: 0; }
.ai-output ul { margin: 6px 0; padding-left: 20px; }
.ai-output li { margin: 2px 0; }
.ai-err { color: var(--danger); font-size: .85rem; }
.ai-ask { display: flex; gap: 8px; }
.ai-ask input { flex: 1; min-width: 0; }
.ai-ask button { flex: none; }

/* ---------- Compare & recurring ---------- */
.cmp-card, .rec-card { display: flex; flex-direction: column; gap: 10px; }
.cmp-head { font-size: .85rem; }
.cmp-head span { font-weight: 400; }
.cmp-proj { font-size: .85rem; color: var(--muted); }
.cmp-list, .rec-list { display: flex; flex-direction: column; gap: 6px; }
.cmp-row, .rec-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: .9rem; }
.cmp-delta.up { color: var(--danger); }
.cmp-delta.down { color: var(--accent); }
.cmp-delta small { color: var(--muted); }
.rec-total { font-size: .9rem; }
.rec-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.rec-meta { color: var(--muted); font-size: .85rem; }
.rec-item { display: flex; flex-direction: column; gap: 4px; padding: 8px 0; border-bottom: 1px dashed var(--line); }
.rec-item:last-child { border-bottom: none; }
.rec-item.off { opacity: .7; }
.rec-row b small, .adv-sub b small { font-weight: 400; color: var(--muted); }
.rec-flags, .rec-acts { display: flex; flex-wrap: wrap; gap: 6px; }
.rec-flag { display: inline-block; font-size: .76rem; font-weight: 600; color: var(--warn); border: 1px solid var(--warn); border-radius: 999px; padding: 1px 8px; }
.rec-off summary { cursor: pointer; font-size: .85rem; margin-top: 6px; }
.adv-q { display: flex; flex-direction: column; gap: 6px; padding: 6px 0; font-size: .86rem; border-bottom: 1px dashed var(--line); }
.adv-q:last-child { border-bottom: none; }
.adv-questions { margin-top: 12px; }
.inbox-tools { display: flex; flex-wrap: wrap; gap: 6px; }
.inbox-hint { margin: -4px 0 8px; font-size: .85rem; }
.inbox-why { font-size: .82rem; }
.inbox-samples summary { cursor: pointer; font-size: .8rem; }
.inbox-samples div { font-size: .8rem; margin-top: 4px; }
.inbox-cat { width: auto; max-width: 190px; padding: 6px 8px; font-size: .8rem; }
.inbox-rule { display: inline-flex; align-items: center; gap: 4px; font-size: .8rem; color: var(--muted); }
.inbox-rule input { width: auto; }

/* ---------- Transactions ---------- */
.tx-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.tx-period { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; align-items: center; }
/* Segmented Μήνας/Έτος */
.period-seg { display: inline-flex; background: var(--bg-elev2); border-radius: 9px; padding: 3px; gap: 2px; }
.period-seg button {
  background: transparent; color: var(--muted); border: none; cursor: pointer;
  padding: 6px 14px; border-radius: 7px; font-size: .85rem; font-weight: 600;
}
.period-seg button.active { background: var(--accent); color: #fff; }
/* ‹ label › */
.period-nav { display: inline-flex; align-items: center; gap: 6px; }
.period-nav .mn-arrow { width: 30px; height: 30px; font-size: 1.2rem; background: var(--bg-elev2); }
.period-label { font-weight: 600; min-width: 96px; text-align: center; }
/* date chips */
.period-range { display: inline-flex; align-items: center; gap: 6px; }
.date-chip {
  padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--bg-elev); color: var(--text); font-size: .82rem;
}
.range-on .date-chip { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; }
.range-on .period-nav { opacity: .45; }
.rng-sep { color: var(--muted); }
#txClear { margin-left: auto; }
@media (max-width: 560px) {
  .tx-period { gap: 6px; }
  .period-seg { flex: 1 1 100%; }
  .period-seg button { flex: 1 1 0; }
  .period-nav { flex: 1 1 auto; justify-content: center; }
  .period-range { flex: 1 1 100%; }
  .date-chip { flex: 1 1 auto; min-width: 0; }
}
.tx-add-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0; padding: 12px; background: var(--bg-elev2); border-radius: 12px; }
.tx-add-form select, .tx-add-form input { flex: 1 1 130px; min-width: 0; }
.tx-add-form #naDesc { flex: 2 1 180px; }
.tx-add-form button[type="submit"] { flex: 0 0 auto; }
.show-more { width: 100%; margin-top: 6px; padding: 10px; }
.tx-totals b { color: var(--text); font-weight: 700; }
.tx-totals .tt-out b { color: var(--danger); }
.tx-totals .tt-in b { color: var(--income); }
.tx-totals .tt-net.neg b { color: var(--danger); }
.tx-totals .tt-avg { padding-left: 14px; border-left: 1px solid var(--line); font-size: .82rem; }
.tx-totals .tt-label { margin-left: auto; font-size: .78rem; }
/* Φίλτρα/αναζήτηση πάνω-πάνω σε μία γραμμή (όπως toolbar λίστας) */
.tx-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; align-items: center; }
.tx-filters #txSearch { flex: 3 1 200px; min-width: 0; }
.tx-filters #txCatFilter { flex: 1 1 150px; min-width: 0; }
.tx-filters #txMinAmount, .tx-filters #txMaxAmount { flex: 0 0 100px; min-width: 0; }
.tx-filters #txDirFilter { flex: 1 1 150px; min-width: 0; }
.tx-filters #txAcctFilter { flex: 1 1 150px; min-width: 0; }
@media (max-width: 560px) {
  .tx-filters { gap: 6px; }
  .tx-filters #txSearch { flex: 1 1 100%; }
  .tx-filters #txCatFilter, .tx-filters #txAcctFilter, .tx-filters #txDirFilter,
  .tx-filters #txMinAmount, .tx-filters #txMaxAmount { flex: 1 1 calc(50% - 3px); }
}
.tx-toolbar { flex-wrap: wrap; }
.tx-export { display: flex; gap: 6px; flex-wrap: wrap; }
@media (max-width: 560px) {
  #txCount { flex: 1 1 100%; }
  .tx-export { width: 100%; }
}
.ghost-btn.small { padding: 7px 10px; font-size: .8rem; }
/* ---- Κινήσεις: επίπεδη λίστα με διαχωριστικά μέσα σε λευκό panel (Stitch) ---- */
.tx-list {
  display: flex; flex-direction: column; gap: 0;
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); overflow: hidden; padding: 2px 14px;
}
.tx-list .empty { padding: 32px 16px; }
.tx {
  border-bottom: 1px solid var(--line);
  padding: 12px 2px;
  display: grid; gap: 1px 13px; align-items: center;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  grid-template-areas:
    "cat desc   amount edit"
    "cat sub    amount edit";
}
.tx:last-of-type { border-bottom: none; }
/* Category control: κυκλικό badge σε mobile */
.tx-catctl {
  grid-area: cat; position: relative; --c: var(--muted);
  width: 44px; height: 44px; border-radius: 50%; align-self: center;
  display: inline-flex; align-items: center; justify-content: center; overflow: hidden;
  background: color-mix(in srgb, var(--c) 15%, transparent); color: var(--c);
}
.tx-ic { font-size: 1.25rem; pointer-events: none; line-height: 1; }
.tx-catname { display: none; }
.tx-catctl .tx-cat {
  position: absolute; inset: 0; width: 100%; height: 100%;
  opacity: 0; cursor: pointer; border: none; padding: 0; margin: 0; background: none;
}
.tx-desc { grid-area: desc; font-weight: 640; font-size: 1rem; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tx-sub { grid-area: sub; font-size: .78rem; color: var(--muted); min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tx-acct { font-weight: 600; }
.tx-datecol, .tx-acctcol { display: none; }
.tx-amount { grid-area: amount; align-self: center; justify-self: end;
  font-weight: 700; font-size: 1.05rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tx-amount.credit { color: var(--income); }
.tx-edit { grid-area: edit; align-self: center; background: none; color: var(--muted);
  padding: 6px 4px; font-size: 1.05rem; }
.tx-edit:hover { color: var(--accent); }

/* ---- Desktop: πραγματικός πίνακας (ledger) ---- */
/* Ταξινόμηση: κλικ στις κεφαλίδες στηλών (desktop) ή chips (mobile) */
.th-sort {
  background: none; border: none; padding: 0; margin: 0; font: inherit; color: var(--muted);
  cursor: pointer; display: inline-flex; align-items: center; gap: 4px;
  text-transform: uppercase; letter-spacing: .05em; font-size: .74rem; font-weight: 650;
}
.th-sort:hover { color: var(--accent); }
.th-sort.active { color: var(--accent); }
.th-arrow { font-size: .95em; opacity: .35; }
.th-sort.active .th-arrow { opacity: 1; }

/* Mobile: η κεφαλίδα γίνεται σειρά από sort-chips */
.tx-thead { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 2px 10px; }
.tx-thead .th-edit { display: none; }
.tx-thead .th-sort { background: var(--bg-elev2); border-radius: 8px; padding: 5px 11px; }
.tx-thead .th-sort.active { background: var(--accent-soft); }

@media (min-width: 900px) {
  .tx-thead {
    display: grid; gap: 18px; padding: 0 18px 8px;
    grid-template-columns: 110px minmax(0, 1fr) 190px 130px 130px 34px;
    font-size: .74rem;
  }
  .tx-thead .th-sort { background: none; border-radius: 0; padding: 0; }
  .tx-thead .th-sort.active { background: none; }
  .tx-thead .th-edit { display: block; }
  .tx-thead .th-amount { justify-content: flex-end; text-align: right; }
  .tx-list { padding: 4px 18px; }
  .tx {
    grid-template-columns: 110px minmax(0, 1fr) 190px 130px 130px 34px;
    grid-template-areas: "datecol desc cat acctcol amount edit";
    gap: 0 18px; padding: 12px 0;
  }
  /* Category → χρωματιστό pill */
  .tx-catctl {
    width: auto; height: auto; border-radius: 999px; justify-self: start; max-width: 100%;
    padding: 5px 12px 5px 8px; gap: 7px;
    background: color-mix(in srgb, var(--c) 15%, transparent);
  }
  .tx-ic { font-size: 1rem; }
  .tx-catname { display: inline; font-size: .82rem; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .tx-sub { display: none; }
  .tx-datecol { grid-area: datecol; display: block; font-size: .86rem; color: var(--muted); font-variant-numeric: tabular-nums; }
  .tx-acctcol { grid-area: acctcol; display: block; font-size: .86rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .tx-desc { font-size: .95rem; }
}
.tx-editor {
  grid-column: 1 / -1;
  margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line);
  display: flex; flex-direction: column; gap: 8px;
}
.ed-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.ed-row select, .ed-row input, .ed-desc { width: 100%; padding: 8px; }
.ed-actions { display: flex; gap: 8px; justify-content: flex-end; }
.danger-btn { background: var(--danger); color: #fff; }

/* ---------- Budget ---------- */
.section-hint { margin: 0; }
.budget-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 4px 0 10px; }
.budget-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.budget-tools #suggestMonths { padding: 7px 8px; }
.budget-totals { display: flex; gap: 14px; flex-wrap: wrap; font-size: .85rem; color: var(--muted); }
.budget-totals b { color: var(--text); }
.budget-totals .over b { color: var(--danger); }
.carry-toggle { display: inline-flex; align-items: center; gap: 7px; font-size: .85rem; cursor: pointer; user-select: none; }
.carry-toggle input { width: 16px; height: 16px; }
.budget-list { display: flex; flex-direction: column; gap: 8px; }
.budget-row {
  display: flex; flex-direction: column; gap: 7px;
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px;
}
.budget-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.budget-head .cat-name { min-width: 0; flex: 1; }
.cat-nm { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
/* Κάρτα budget: το όνομα σε δική του γραμμή ώστε να διαβάζεται πλήρως (όχι «Σού…») */
.budget-list:not(.as-list) .budget-head { flex-wrap: wrap; }
.budget-list:not(.as-list) .budget-head .cat-name { flex: 1 1 100%; }
.budget-list:not(.as-list) .budget-head .cat-nm { white-space: normal; overflow: visible; text-overflow: clip; }
.budget-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.budget-ring { display: none; }
.ring-svg { width: 130px; height: 130px; }
.ring-pct { fill: var(--muted); font-size: 11px; font-weight: 600; }
.ring-spent { fill: var(--text); font-size: 17px; font-weight: 780; font-variant-numeric: tabular-nums; }
.ring-lim { fill: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }

/* Desktop: grid από καθαρές κάρτες με κυκλικά rings */
@media (min-width: 900px) {
  .budget-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); gap: 14px; align-items: start; }
  .budget-row { gap: 10px; padding: 16px; }
  .budget-ring { display: grid; place-items: center; padding: 4px 0; }
  .budget-row .budget-bar { display: none; }
  .budget-row .budget-spent { display: none; }   /* το ring δείχνει ξοδεμένα/όριο/% */
  .budget-input input { width: 66px; padding: 8px 8px; }
  .budget-input span { color: var(--muted); }
}
.b-carry { font-size: .72rem; font-weight: 700; padding: 1px 6px; border-radius: 6px; }
.b-inherit { font-size: .68rem; font-weight: 600; color: var(--muted); background: var(--bg-elev2); padding: 1px 6px; border-radius: 6px; }
.b-carry.pos { color: var(--accent); background: rgba(66, 165, 245, .12); }
.b-carry.neg { color: var(--danger); background: rgba(239, 83, 80, .12); }
.budget-bar { height: 12px; border-radius: 999px; background: var(--bg-elev2); overflow: hidden; }
.budget-bar-fill { height: 100%; border-radius: 999px; transition: width .4s ease; background: var(--accent); }
.budget-bar-fill.st-ok   { background: var(--income); }
.budget-bar-fill.st-warn { background: var(--warn); }
.budget-bar-fill.st-over { background: var(--danger); }
.budget-spent { font-size: .82rem; color: var(--muted); }
.budget-spent.over, .budget-spent.st-over { color: var(--danger); font-weight: 600; }
.budget-spent.st-warn { color: #fb8c00; font-weight: 600; }
.budget-input { display: flex; align-items: center; gap: 4px; }
.budget-input input { width: 92px; text-align: right; }

/* Budget alerts (επισκόπηση) */
.budget-alerts .alerts-card { border-left: 4px solid var(--danger); }
.alert-item { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 10px; padding: 6px 0; border-top: 1px solid var(--line); font-size: .86rem; }
.alert-item:first-of-type { border-top: none; }
.alert-cat { font-weight: 600; flex: 0 0 auto; }
.alert-msg { color: var(--muted); min-width: 0; word-break: break-word; }
.alert-item.st-over .alert-msg { color: var(--danger); }

/* ---------- Πρόβλεψη μήνα ---------- */
.forecast-card .fc-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 4px; }
@media (min-width: 640px) { .forecast-card .fc-grid { grid-template-columns: repeat(4, 1fr); } }
.fc-stat { display: flex; flex-direction: column; gap: 2px; background: var(--bg-elev2); border-radius: 10px; padding: 10px 12px; }
.fc-label { font-size: .74rem; color: var(--muted); }
.fc-stat b { font-size: 1.05rem; }
.fc-stat b.fc-est { color: var(--accent); }
.fc-stat b.neg { color: var(--danger); }
.fc-stat b.pos { color: #2e9e5b; }
.fc-bills { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 8px; }
/* Λίστα παγίων: εσωτερικό scroll + ρυθμιζόμενο ύψος (drag από κάτω-δεξιά) */
.fc-bills-list { overflow-y: auto; resize: vertical; height: 220px; min-height: 70px; }
.fc-bills-title { font-size: .78rem; margin-bottom: 4px; }
.fc-bill { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; font-size: .86rem; border-top: 1px solid var(--line); }
.fc-bill:first-of-type { border-top: none; }
.fc-bill-meta { white-space: nowrap; }
.fc-due { color: var(--danger); font-size: .74rem; font-weight: 600; background: color-mix(in srgb, var(--danger) 12%, transparent); padding: 1px 6px; border-radius: 999px; }

/* ---------- Ανωμαλίες ---------- */
.anomalies-card .anom-box { border-left: 4px solid #fb8c00; }
.anom-item { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 10px; align-items: baseline; padding: 6px 0; border-top: 1px solid var(--line); font-size: .86rem; }
.anom-item:first-of-type { border-top: none; }
.anom-cat { font-weight: 600; flex: 0 0 auto; }
.anom-msg { min-width: 0; word-break: break-word; }
.anom-x { color: #fb8c00; }

/* ---------- Στόχοι αποταμίευσης ---------- */
.goals-card { margin-top: 14px; }
.goals-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.goal-form { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
.goal-form input { flex: 1 1 130px; min-width: 0; }
.goal-form input#goalName { flex: 2 1 180px; }
.goals-list { display: flex; flex-direction: column; gap: 10px; }
.goal-row { background: var(--bg-elev2); border-radius: 12px; padding: 10px 14px; }
.goal-top { display: flex; justify-content: space-between; gap: 10px; }
.goal-name { font-weight: 600; }
.goal-bar { height: 8px; border-radius: 6px; background: rgba(127,127,127,.18); overflow: hidden; margin: 7px 0; }
.goal-bar-fill { height: 100%; border-radius: 6px; background: var(--accent); transition: width .3s ease; }
.goal-bar-fill.done { background: #2e9e5b; }
.goal-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: .8rem; color: var(--muted); flex-wrap: wrap; }
.goal-sugg { color: var(--accent); font-weight: 600; }
.goal-actions { display: flex; gap: 6px; }

/* ---------- Γρήγορη καταχώρηση AI ---------- */
.quick-card .quick-form { display: flex; gap: 8px; margin-top: 6px; }
.quick-card .quick-form input { flex: 1 1 auto; min-width: 0; }
.quick-result { margin-top: 10px; }
.qr-card { background: var(--bg-elev2); border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.qr-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.qr-list { display: flex; flex-direction: column; gap: 4px; max-height: 320px; overflow: auto; }
.qr-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; border-top: 1px solid var(--line); }
.qr-row:first-child { border-top: none; }
.qr-dir { font-size: .78rem; font-weight: 700; padding: 2px 8px; border-radius: 7px; flex: 0 0 auto; }
.qr-dir.out { color: var(--danger); background: rgba(239,83,80,.12); }
.qr-dir.in { color: #2e9e5b; background: rgba(46,158,91,.12); }
.qr-amt { font-size: 1rem; flex: 0 0 auto; min-width: 64px; }
.qr-d { font-weight: 600; flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qr-meta { flex: 0 0 auto; font-size: .76rem; white-space: nowrap; }
.qr-del { background: none; color: var(--muted); padding: 2px 6px; flex: 0 0 auto; }
.qr-del:hover { color: var(--danger); }
.qr-actions { display: flex; gap: 8px; margin-top: 4px; }
.qr-ok { color: #2e9e5b; font-weight: 600; }
@media (max-width: 560px) { .qr-meta { display: none; } }
.ins-stamp { font-size: .74rem; margin-top: 10px; padding-top: 7px; border-top: 1px dashed var(--line); }
.rule-dir { font-size: .68rem; font-weight: 700; padding: 1px 6px; border-radius: 6px; margin: 0 2px; }
.rule-dir.out { color: var(--danger); background: rgba(216,51,47,.12); }
.rule-dir.in { color: #2e9e5b; background: rgba(46,158,91,.12); }

/* ---------- Λογαριασμοί ---------- */
.default-acct, .import-acct { display: flex; align-items: center; gap: 8px; font-size: .85rem; color: var(--muted); margin: 6px 0 10px; }
.import-acct { background: var(--bg-elev2); padding: 10px 12px; border-radius: 10px; border: 1px dashed var(--accent); color: var(--text); }
.import-acct select { flex: 1 1 auto; min-width: 0; }
.soft-hr { border: none; border-top: 1px solid var(--line); margin: 16px 0; }
.sub-h { font-size: 1rem; margin: 0 0 4px; }
.move-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; }
.move-form label { display: flex; flex-direction: column; gap: 3px; font-size: .76rem; color: var(--muted); flex: 1 1 120px; }
.move-form select { width: 100%; }
#moveResult { margin-top: 8px; font-size: .85rem; }
.default-acct select { flex: 0 1 auto; }
.acct-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid var(--line); }
.acct-row:first-child { border-top: none; }
.acct-name { font-weight: 600; flex: 1 1 auto; min-width: 0; }
.acct-bal { font-weight: 700; white-space: nowrap; }
.acct-bal.neg { color: var(--danger); }
.acct-bal.pos { color: #2e9e5b; }
.acct-flow { font-size: .76rem; white-space: nowrap; flex: 0 0 auto; }
.acct-total { border-top: 2px solid var(--line); margin-top: 2px; }
.ea-bal-lbl { display: inline-flex; align-items: center; gap: 4px; font-size: .82rem; white-space: nowrap; }
.ea-bal-lbl input { width: 100px; }
.m-name .acct-bal { font-size: .82rem; margin-left: 6px; }
@media (max-width: 480px) { .acct-flow { flex: 1 1 100%; text-align: right; } }

/* ---------- Import ---------- */
.import-card { display: flex; flex-direction: column; gap: 14px; }
.import-card h2 { margin: 0; font-size: 1.2rem; }
.file-drop {
  display: grid; place-items: center; text-align: center; cursor: pointer;
  border: 2px dashed var(--line); border-radius: 16px; padding: 34px 16px;
  color: var(--muted); background: var(--bg-elev2); transition: border-color .2s, background .2s;
}
.file-drop:hover { border-color: var(--accent); }
.file-drop.drag { border-color: var(--accent); background: var(--accent-soft); }
.import-preview { background: var(--bg-elev2); border-radius: 10px; padding: 12px 14px; line-height: 1.6; }
.import-result { font-weight: 500; }

/* ---------- Import review ---------- */
.import-review { display: flex; flex-direction: column; gap: 10px; }
.review-summary { font-size: .92rem; }
.review-hint { font-size: .85rem; }
.review-groups { display: flex; flex-direction: column; gap: 6px; max-height: 340px; overflow-y: auto; }
.review-row { display: flex; align-items: center; gap: 10px; background: var(--bg-elev2); border-radius: 10px; padding: 8px 10px; }
.review-m { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.review-name { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.review-m .muted { font-size: .8rem; }
.review-cat { flex: none; max-width: 46%; padding: 7px 8px; }
.review-toolbar { display: flex; }
.review-rule { display: flex; align-items: center; gap: 8px; font-size: .85rem; color: var(--muted); }
.review-rule input { width: auto; }

/* ---------- Manual entry (Excel-style batch) ---------- */
.manual-card { display: flex; flex-direction: column; gap: 12px; }
.manual-card h2 { margin: 0; font-size: 1.2rem; }
.manual-card > p { margin: 0; font-size: .85rem; }
.batch-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.batch-grid { min-width: 680px; display: flex; flex-direction: column; gap: 6px; }
#batchRows { display: flex; flex-direction: column; gap: 6px; }
.batch-head, .batch-row {
  display: grid;
  grid-template-columns: 96px 140px 88px minmax(110px, 1fr) 140px 130px 32px;
  gap: 6px; align-items: center;
}
.batch-head { font-size: .68rem; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; padding: 0 2px; }
.batch-row input, .batch-row select { width: 100%; padding: 8px; }
.batch-row .b-amount { text-align: right; }
.b-del { background: var(--bg-elev2); color: var(--muted); padding: 8px 0; font-size: .9rem; }
.b-del:hover { color: var(--danger); }
.batch-actions { display: flex; gap: 10px; }
.batch-actions #saveBatchBtn { flex: 1; }
.goal-overdue { color: var(--danger); font-weight: 600; }
.danger-card { border: 1px solid color-mix(in srgb, var(--danger) 40%, transparent); }
.danger-btn {
  background: transparent; color: var(--danger);
  border: 1px solid color-mix(in srgb, var(--danger) 55%, transparent);
  padding: 9px 16px; border-radius: 10px; font-weight: 700; cursor: pointer;
}
.danger-btn:hover:not(:disabled) { background: var(--danger); color: #fff; border-color: var(--danger); }
.danger-btn:disabled { opacity: .55; cursor: default; }
body.demo-mode .demo-hide { display: none !important; }
/* Μαζική καταχώρηση σε κινητό: κάρτα με στοιχισμένα πεδία αντί για οριζόντιο scroll */
@media (max-width: 600px) {
  .batch-scroll { overflow-x: visible; }
  .batch-grid { min-width: 0; }
  .batch-head { display: none; }
  .batch-row {
    grid-template-columns: 1fr 1fr; gap: 8px;
    padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg-elev);
  }
  .batch-row .b-desc, .batch-row .b-cat, .batch-row .b-acct { grid-column: 1 / -1; }
  .batch-row .b-del { grid-column: 1 / -1; justify-self: end; width: 46px; }
}
.ghost-btn { background: var(--bg-elev); color: var(--text); border: 1px solid var(--line); box-shadow: 0 1px 1px rgba(20,30,50,.03); }
.ghost-btn:hover { border-color: var(--accent); color: var(--accent); }

.paste-box { display: flex; flex-direction: column; gap: 8px; }
#pasteArea { display: flex; flex-direction: column; gap: 8px; }
.paste-box .small { font-size: .78rem; margin: 0; }
.paste-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.paste-actions .muted { font-size: .76rem; flex: 1; min-width: 120px; }

/* Επεξεργάσιμο πλέγμα τύπου Excel (σταθερές στήλες) */
.xls-grid-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 8px; max-height: 340px; }
.xls-grid { border-collapse: collapse; width: 100%; min-width: 560px; font-size: .82rem; }
.xls-grid th {
  position: sticky; top: 0; z-index: 1;
  background: var(--bg-elev2); color: var(--text); font-weight: 700; font-size: .76rem;
  text-align: left; padding: 7px 10px; white-space: nowrap;
  border: 1px solid var(--line); box-shadow: inset 0 -1px 0 var(--line);
}
.xls-grid td { border: 1px solid var(--line); padding: 0; }
.xls-grid .xls-cell {
  width: 100%; border: none; background: transparent; color: var(--text);
  padding: 7px 10px; font-size: .82rem; border-radius: 0;
}
.xls-grid .xls-cell:focus { outline: 2px solid var(--accent); outline-offset: -2px; background: var(--bg-elev); }
.xls-grid .xls-cell.xls-err { background: rgba(239, 83, 80, .14); color: var(--danger); box-shadow: inset 0 0 0 2px var(--danger); }
.xls-grid th:nth-child(1), .xls-grid td:nth-child(1) { width: 110px; }
.xls-grid th:nth-child(3), .xls-grid td:nth-child(3) { width: 90px; }
.xls-grid th:nth-child(4), .xls-grid td:nth-child(4) { width: 90px; }

/* ---------- Settings ---------- */
.settings-layout { display: grid; grid-template-columns: 190px 1fr; gap: 16px; align-items: start; }
.settings-nav { display: flex; flex-direction: column; gap: 4px; position: sticky; top: 76px; }
.settings-link {
  background: none; color: var(--text); text-align: left; font-weight: 500;
  padding: 10px 12px; border-radius: 10px; display: flex; align-items: center; gap: 8px;
}
.settings-link:hover { background: var(--bg-elev2); }
.settings-link.active { background: var(--accent-soft); color: var(--accent); font-weight: 650; }
.settings-content { min-width: 0; }
.settings-panel { display: flex; flex-direction: column; gap: 16px; }

.theme-seg {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; max-width: 420px;
  background: var(--bg-elev2); border-radius: 10px; padding: 4px;
}
.theme-seg .seg-btn { background: none; color: var(--muted); font-weight: 600; padding: 10px; border-radius: 8px; }
.theme-seg .seg-btn.active { background: var(--accent); color: #fff; }

@media (max-width: 640px) {
  .settings-layout { grid-template-columns: 1fr; gap: 12px; }
  .settings-nav { flex-direction: row; overflow-x: auto; position: static; -webkit-overflow-scrolling: touch; }
  .settings-link { white-space: nowrap; }
}

#view-settings .card { display: flex; flex-direction: column; gap: 12px; }
#view-settings h2 { margin: 0; font-size: 1.2rem; }
#view-settings .card > p { margin: 0; }
.manage-list { display: flex; flex-direction: column; gap: 6px; }
.settings-search { width: 100%; margin-bottom: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg-elev2); color: var(--text); font: inherit; }
.settings-search:focus { border-color: var(--accent); outline: none; }
.pager { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 10px; }
.pager:empty { display: none; }
.pg-btn { background: var(--bg-elev2); color: var(--text); border: 1px solid var(--line); border-radius: 8px; width: 34px; height: 34px; cursor: pointer; font-size: 1.1rem; line-height: 1; }
.pg-btn:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
.pg-btn:disabled { opacity: .4; cursor: default; }
.pg-info { font-size: .85rem; color: var(--muted); font-variant-numeric: tabular-nums; }

/* Rules toolbar + AI audit */
.rules-toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.rules-toolbar .settings-search { flex: 1 1 200px; margin-bottom: 0; }
.rules-toolbar #ruleAuditBtn { flex: 0 0 auto; white-space: nowrap; }
.audit-result { margin: 12px 0; }
.audit-ok { color: var(--income, #2e7d32); font-weight: 600; }
.audit-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: .9rem; margin-bottom: 8px; }
.audit-head #auditApplyAll { margin-left: auto; }
.audit-list { display: flex; flex-direction: column; gap: 6px; }
.audit-item { display: flex; align-items: center; gap: 10px; background: var(--bg-elev2); border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; }
.audit-item.done { opacity: .55; }
.audit-info { flex: 1; min-width: 0; }
.audit-line { font-size: .9rem; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.audit-issue { font-size: .8rem; margin-top: 2px; }
.audit-act { font-weight: 600; }
.audit-act.rec { color: var(--accent); }
.audit-act.del { color: var(--danger, #c62828); }
.audit-btns { display: flex; gap: 6px; flex: 0 0 auto; }
.audit-apply { background: var(--accent-soft); color: var(--accent); border: none; border-radius: 8px; padding: 5px 10px; cursor: pointer; font-weight: 700; }
.audit-skip { background: var(--bg-elev); color: var(--muted); border: 1px solid var(--line); border-radius: 8px; padding: 5px 10px; cursor: pointer; }
.audit-done { color: var(--income, #2e7d32); font-weight: 700; }
/* Τύποι ροής / κανόνες v2 */
.rule-dir.flow { color: var(--accent); background: var(--accent-soft); }
.lint-apply { margin-left: 6px; font-size: .8rem; }
.lint-head { font-size: .9rem; margin-bottom: 8px; }
.er-prio { width: 4.5em; }
.audit-line .flow-kind { margin-left: auto; max-width: 60%; }
.table-scroll { overflow-x: auto; }
.flow-months { width: 100%; border-collapse: collapse; font-size: .85rem; }
.flow-months th, .flow-months td { text-align: left; padding: 5px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.manage-row {
  display: flex; align-items: center; gap: 11px;
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: 12px; padding: 9px 12px;
  transition: border-color .15s ease;
}
.manage-row:hover { border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); }
.m-icon {
  display: inline-grid; place-items: center; width: 34px; height: 34px;
  border-radius: 50%; font-size: 1.05rem; flex: none; color: #fff;
}
.m-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.m-name code { background: var(--bg-elev); padding: 1px 6px; border-radius: 5px; font-size: .85em; }
.m-del, .m-del-rule { background: none; color: var(--muted); padding: 4px 8px; }
.m-del:hover, .m-del-rule:hover { color: var(--danger); }
.m-edit-cat, .m-edit-acct, .m-edit-rule, .m-apply-rule, .m-top-acct, .m-move-acct { background: none; color: var(--muted); padding: 4px 8px; }
.m-edit-cat:hover, .m-edit-acct:hover, .m-edit-rule:hover, .m-apply-rule:hover, .m-top-acct:hover, .m-move-acct:hover:not(:disabled) { color: var(--accent); }
.m-move-acct:disabled { opacity: .3; cursor: default; }
.acct-default { font-size: 11px; color: var(--accent); white-space: nowrap; }
.m-apply-rule { font-size: .8rem; }
/* inline edit μέσα στο manage-row */
.manage-row .ec-name, .manage-row .ea-name, .manage-row .er-pat { flex: 1 1 90px; min-width: 0; }
.manage-row .er-dir, .manage-row .er-cat { flex: 0 1 auto; min-width: 0; padding: 8px 6px; }
.manage-row .icon-input { flex: none; width: 46px; text-align: center; }
.manage-row input[type="color"] { flex: none; width: 40px; height: 36px; padding: 2px; }
.manage-row .ec-save, .manage-row .ea-save, .manage-row .er-save { background: none; color: #2e9e5b; padding: 4px 8px; font-weight: 700; }
.manage-row .ec-cancel, .manage-row .ea-cancel, .manage-row .er-cancel { background: none; color: var(--muted); padding: 4px 8px; }
.add-form { display: flex; gap: 8px; align-items: center; }
.add-form input[type="text"] { flex: 1; min-width: 0; }
.add-form .icon-input { flex: none; width: 54px; text-align: center; }
.add-form input[type="color"] { flex: none; width: 44px; height: 40px; padding: 2px; }
.add-form select { flex: 1; min-width: 0; }
.add-form button { flex: none; width: 44px; padding: 10px 0; font-size: 1.1rem; }
.add-form input[type="password"] { flex: 1; min-width: 120px; }
.add-form input[type="email"] { flex: 1; min-width: 120px; }
.add-form-user { flex-wrap: wrap; }
.add-form-user input, .add-form-user select { flex: 1 1 140px; }
.add-form .invite-btn { width: auto; flex: 0 0 auto; padding: 10px 16px; font-size: .9rem; font-weight: 600; }

.mini-h { font-size: .82rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); margin: 14px 0 8px; }
.invite-result { margin: 12px 0; }
.invite-ok { font-size: .9rem; color: var(--income, #2e7d32); margin-bottom: 8px; }
.invite-linkrow { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.invite-link { flex: 1 1 200px; min-width: 0; font-family: ui-monospace, monospace; font-size: .8rem; }
.invite-linkrow button { flex: 0 0 auto; padding: 9px 12px; font-size: .82rem; }
.invite-list { margin-top: 12px; }
.invite-row .m-name { font-size: .86rem; }
.invite-row .inv-copy, .invite-row .inv-share { background: var(--bg-elev2); border-radius: 8px; padding: 4px 8px; }
.sent-ok { color: var(--income, #2e7d32); font-weight: 600; }
.sent-no { color: var(--danger, #c62828); font-weight: 600; }
.m-reset-user { background: var(--bg-elev2); border-radius: 8px; padding: 4px 8px; }

/* ---------- Filters extras ---------- */
.tx-clear { background: var(--bg-elev2); color: var(--text); border-radius: 10px; padding: 8px 12px; font-size: .82rem; font-weight: 600; }
.tx-clear:hover { color: var(--danger, #c62828); }

/* ---------- Searchable select (combobox) ---------- */
.ss { position: relative; display: inline-flex; }
.tx-filters .ss { flex: 1 1 150px; min-width: 0; }
.ss-native { display: none !important; }
.ss-btn { width: 100%; text-align: left; background: var(--bg-elev2); color: var(--text); border: 1px solid var(--line); border-radius: 10px; padding: 9px 30px 9px 12px; cursor: pointer; font: inherit; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; }
.ss-btn::after { content: '▾'; position: absolute; right: 11px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: .75em; }
.ss-btn:hover { border-color: var(--accent); }
.ss-pop { position: absolute; z-index: 60; top: calc(100% + 4px); left: 0; right: 0; min-width: 220px; background: var(--bg-elev); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 10px 34px rgba(20,30,50,.18); padding: 7px; }
[data-theme="dark"] .ss-pop { box-shadow: 0 10px 34px rgba(0,0,0,.5); }
.ss-search { width: 100%; margin-bottom: 6px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg-elev2); color: var(--text); font: inherit; }
.ss-list { max-height: 260px; overflow-y: auto; }
.ss-opt { padding: 8px 10px; border-radius: 7px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ss-opt:hover { background: var(--accent-soft); }
.ss-opt.sel { color: var(--accent); font-weight: 600; }
.ss-empty { padding: 10px; text-align: center; }

/* ---------- Backup / Restore ---------- */
.restore-status { margin-top: 10px; font-size: .88rem; min-height: 1.2em; }
.restore-ok { color: var(--income, #2e7d32); font-weight: 600; }
.restore-warn { margin-top: 8px; }

/* ---------- Cashflow calendar ---------- */
.cal-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.cal-legend { display: flex; gap: 12px; font-size: .72rem; color: var(--muted); }
.cal-lg-exp::before { content: ''; display: inline-block; width: 11px; height: 11px; border-radius: 3px; background: rgba(229,57,53,.45); margin-right: 5px; vertical-align: middle; }
.cashflow-cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-top: 12px; }
.cal-wd { text-align: center; font-size: .7rem; font-weight: 700; color: var(--muted); padding: 2px 0; }
.cal-cell { position: relative; min-height: 58px; border-radius: 10px; border: 1px solid var(--line); padding: 5px 6px; display: flex; flex-direction: column; gap: 1px; overflow: hidden; }
.cal-empty { border: none; background: transparent !important; }
.cal-day { font-size: .72rem; font-weight: 700; color: var(--text); opacity: .7; }
.cal-exp { font-size: .8rem; font-weight: 700; color: var(--danger, #c62828); line-height: 1.1; }
.cal-inc { font-size: .68rem; font-weight: 600; color: var(--income, #2e7d32); line-height: 1.1; }
.cal-bill { position: absolute; top: 4px; right: 5px; font-size: .72rem; }
.cal-today { outline: 2px solid var(--accent); outline-offset: -2px; }
[data-theme="dark"] .cal-exp { color: #ff8a80; }
[data-theme="dark"] .cal-inc { color: #7bd88f; }
@media (max-width: 420px) {
  .cal-cell { min-height: 48px; padding: 3px 4px; }
  .cal-exp { font-size: .72rem; }
}

/* ---------- Tabbar ---------- */
.tabbar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 20;
  display: grid; grid-template-columns: repeat(5, 1fr);
  background: var(--topbar-bg); backdrop-filter: blur(8px);
  border-top: 1px solid var(--line);
  padding-bottom: env(safe-area-inset-bottom);
}
.tab {
  background: none; color: var(--muted); border-radius: 0; font-weight: 500; font-size: .72rem;
  display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 10px 4px;
}
.tab span { font-size: 1.25rem; display: inline-grid; place-items: center; }
.tab span svg { width: 23px; height: 23px; display: block; }
.tab.active { color: var(--accent); }

/* Τονισμένο «Νέα κίνηση» */
#txAddBtn { background: var(--accent); color: #fff; border: none; font-weight: 650; }
#txAddBtn:hover { background: var(--accent-d); }

@media (max-width: 380px) {
  .stat-value { font-size: 1rem; }
}

/* ============ DESKTOP (πλαϊνό μενού + ευρύτερο layout + polish) ============ */
@media (min-width: 1024px) {
  :root { --radius: 16px; }

  .app { padding-bottom: 0; padding-left: 244px; }

  /* Bottom tabbar → αριστερό sidebar */
  .tabbar {
    top: 0; bottom: 0; left: 0; right: auto; width: 244px; height: 100vh;
    display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start;
    gap: 6px; padding: 78px 14px 18px;
    background: var(--bg-elev); border-top: none; border-right: 1px solid var(--line);
    backdrop-filter: none;
  }
  .tabbar::before {
    content: 'Metronya'; padding-left: 38px; line-height: 32px; background: url('../../icons/icon.svg') left center / 30px 30px no-repeat; position: absolute; top: 24px; left: 22px;
    font-weight: 800; font-size: 1.2rem; color: var(--text); letter-spacing: -.01em;
  }
  .tab {
    flex-direction: row; justify-content: flex-start; gap: 13px;
    padding: 12px 16px; border-radius: 12px; font-size: .96rem; font-weight: 600;
    transition: background .15s ease, color .15s ease;
  }
  .tab span { font-size: 1.3rem; }
  .tab:hover { background: var(--bg-elev2); color: var(--text); }
  .tab.active { background: var(--accent-soft); color: var(--accent); }
  /* «Προσθήκη» → ξεχωριστό γεμάτο κουμπί (Stitch) */
  .tabbar .tab[data-view="import"] { background: var(--accent); color: #fff; margin-top: 6px; }
  .tabbar .tab[data-view="import"]:hover,
  .tabbar .tab[data-view="import"].active { background: var(--accent-d); color: #fff; }

  /* Topbar/περιεχόμενο: ευρύτερα & ευθυγραμμισμένα */
  main { max-width: 1080px; padding: 22px 28px 40px; }
  .topbar-row { display: none; }            /* λογότυπο & κουμπιά είναι στο sidebar */

  /* Κουμπιά ενεργειών στο κάτω μέρος του sidebar */
  .tabbar > .topbar-actions {
    margin-top: auto; margin-left: 0; width: 100%;
    display: flex; flex-wrap: wrap; gap: 8px;
    padding-top: 14px; border-top: 1px solid var(--line);
  }
  .tabbar > .topbar-actions .icon-btn { flex: 1 1 0; min-width: 46px; padding: 10px 0; }

  /* Κάρτες: απαλό hover lift */
  .card { transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease; }
  .card:hover { box-shadow: 0 6px 20px rgba(20,30,50,.08); border-color: #cfd6e1; }
  [data-theme="dark"] .card:hover { box-shadow: 0 6px 22px rgba(0,0,0,.4); border-color: #36425a; }

  /* Κινήσεις: hover highlight στη γραμμή */
  .tx { transition: background .15s ease; border-radius: 10px; }
  .tx:hover { background: var(--bg-elev2); }

  /* Dashboard: μεγαλύτερα νούμερα */
  .stat-value { font-size: 1.6rem; }
}

@media (min-width: 1440px) {
  main, .topbar-row { max-width: 1200px; }
}

/* ---------- 🧠 AI Σύμβουλος ---------- */
.wg-grid { display: flex; flex-direction: column; gap: 16px; }
.adv-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }

/* Επισκόπηση: υπο-tabs ενοτήτων */
.dash-subtabs { display: inline-flex; gap: 3px; background: var(--bg-elev2); border-radius: 11px; padding: 3px; margin-bottom: 4px; flex-wrap: wrap; }
.dash-subtabs button { background: transparent; color: var(--muted); border: none; cursor: pointer; padding: 7px 16px; border-radius: 8px; font-size: .92rem; font-weight: 600; }
.dash-subtabs button.active { background: var(--bg-elev); color: var(--accent); box-shadow: var(--shadow); }
.adv-sub-hint { margin: -4px 0 10px; font-size: .85rem; }

/* Δείκτης υγείας */
.adv-health { display: flex; flex-direction: column; gap: 16px; }
.adv-score-row { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.adv-gauge-wrap { flex: none; width: 176px; max-width: 46vw; }
.hg-svg { width: 100%; height: auto; display: block; }
.hg-num { fill: var(--text); font-size: 34px; font-weight: 800; letter-spacing: -1px; }
.hg-den { fill: var(--muted); font-size: 12px; font-weight: 600; }
.adv-score-meta { display: flex; flex-direction: column; gap: 3px; min-width: 140px; flex: 1; }
.adv-grade { font-size: 1.15rem; font-weight: 750; }
/* Ενιαία segmented μπάρα δεικτών (Stitch) */
.adv-seg { display: flex; flex-direction: column; gap: 12px; }
.adv-seg-bar { display: flex; gap: 3px; height: 12px; border-radius: 999px; overflow: hidden; }
.adv-seg-part { transition: flex .4s ease; }
.adv-seg-labels { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 14px; }
.adv-seg-lab { display: flex; flex-direction: column; gap: 1px; }
.adv-seg-name { font-size: .74rem; color: var(--muted); }
.adv-seg-lab b { font-weight: 750; font-variant-numeric: tabular-nums; font-size: 1.02rem; }
.adv-seg-lab b small { font-size: .62rem; color: var(--muted); font-weight: 500; }
.adv-seg-st { font-size: .72rem; font-weight: 650; }
@media (min-width: 560px) { .adv-seg-labels { grid-template-columns: repeat(4, 1fr); } }

/* Tinted κουμπιά στον Σύμβουλο (Stitch) */
#view-advisor .ghost-btn { background: var(--accent-soft); color: var(--accent); border: none; font-weight: 650; }
#view-advisor .ghost-btn:hover { background: color-mix(in srgb, var(--accent) 24%, transparent); }

/* Τι-αν: Τώρα → Πρόταση */
.wi-cur { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; font-size: .92rem; }
.wi-cur b { font-weight: 750; font-variant-numeric: tabular-nums; }
.wi-prop { color: var(--accent); }
.wi-arrow { color: var(--muted); font-weight: 700; }
.wi-save { margin-top: 12px; font-size: .95rem; }
.wi-year { color: var(--income); font-size: 1.2rem; font-weight: 800; }
.adv-subs { border-top: 1px solid var(--line); padding-top: 12px; }
.adv-subs-head { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; font-size: .88rem; font-weight: 600; margin-bottom: 8px; }
.adv-sub { display: flex; justify-content: space-between; gap: 8px; padding: 4px 0; font-size: .86rem; border-bottom: 1px dashed var(--line); }
.adv-sub:last-child { border-bottom: none; }

/* Σχέδιο δράσης */
.adv-plan-body { font-size: .9rem; line-height: 1.5; }
.adv-plan-body h2, .adv-plan-body h3 { font-size: .95rem; margin: 10px 0 4px; }
.adv-plan-body ul { margin: 4px 0; padding-left: 20px; }
.adv-plan-body li { margin: 3px 0; }
.adv-plan-body p { margin: 5px 0; }
.adv-plan-date { font-size: .72rem; margin-top: 10px; }

/* Τι-αν */
.adv-whatif-controls { display: flex; flex-direction: column; gap: 12px; }
.wi-slider-row { display: flex; align-items: center; gap: 12px; }
.wi-slider-row input[type=range] { flex: 1; accent-color: var(--accent); }
.wi-pct { font-weight: 700; min-width: 46px; text-align: right; }
.adv-whatif-result { margin-top: 14px; padding: 12px; border-radius: 10px; background: var(--bg-elev2); }
.wi-out { font-size: .95rem; }
.wi-out b { color: var(--accent); }
.wi-out .wi-year { font-size: 1.05rem; }

/* Chat */
.adv-chat-log { display: flex; flex-direction: column; gap: 8px; flex: 1 1 auto; min-height: 0; max-height: 380px; overflow-y: auto; padding: 4px 2px; }
.adv-chat-empty { text-align: center; padding: 20px 8px; }
.adv-msg { max-width: 85%; padding: 8px 12px; border-radius: 14px; font-size: .88rem; line-height: 1.45; word-break: break-word; }
.adv-msg.user { align-self: flex-end; background: var(--accent); color: #fff; border-bottom-right-radius: 4px; }
.adv-msg.assistant { align-self: flex-start; background: var(--bg-elev2); color: var(--text); border-bottom-left-radius: 4px; }
.adv-msg.assistant p { margin: 4px 0; }
.adv-msg.assistant ul { margin: 4px 0; padding-left: 18px; }
.adv-msg.typing { opacity: .6; letter-spacing: 2px; }
.adv-tool { font-size: .78rem; margin-top: 6px; opacity: .8; font-style: italic; }

/* Markdown πίνακες (chat + insights) */
.md-tblwrap { overflow-x: auto; margin: 8px 0; -webkit-overflow-scrolling: touch; }
.md-tbl { border-collapse: collapse; width: 100%; font-size: .82rem; }
.md-tbl th, .md-tbl td { padding: 6px 10px; text-align: left; border-bottom: 1px solid var(--line); white-space: nowrap; }
.md-tbl th { font-weight: 700; background: color-mix(in srgb, var(--accent) 12%, transparent); border-bottom: 2px solid var(--line); }
.md-tbl tbody tr:last-child td { border-bottom: none; }
.md-tbl td:nth-child(n+2), .md-tbl th:nth-child(n+2) { text-align: right; }
.md-tbl tbody tr:hover td { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.adv-msg .typing { opacity: .6; letter-spacing: 2px; }
.adv-chat-suggest { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.adv-sug { background: var(--bg-elev2); color: var(--text); border: 1px solid var(--line); border-radius: 999px; padding: 5px 12px; font-size: .8rem; cursor: pointer; }
.adv-sug:hover { border-color: var(--accent); }
.adv-chat-form { display: flex; gap: 8px; margin-top: 6px; }
.adv-chat-form input { flex: 1; }
.adv-chat-form button { flex: none; width: 44px; background: var(--accent); color: #fff; border: none; border-radius: 10px; font-size: 1.1rem; cursor: pointer; }
.adv-chat-form button:hover { background: var(--accent-d); }
.adv-chat-form button.adv-stop { background: var(--danger); }
.adv-chat-form button.adv-stop:hover { filter: brightness(.92); }

@media (max-width: 640px) {
  .adv-comps { grid-template-columns: 1fr; gap: 10px; }
  .adv-msg { max-width: 92%; }
}

/* AI Σύμβουλος — ρυθμίσεις στόχων */
.adv-cfg { background: var(--bg-elev2); border-radius: 12px; padding: 14px; margin-bottom: 14px; }
.adv-cfg-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.adv-cfg-grid label { display: flex; flex-direction: column; gap: 4px; font-size: .8rem; color: var(--muted); }
.adv-cfg-grid input { padding: 8px 10px; }
.ai-cfg-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin: 14px 0; }
.ai-cfg-grid label { display: flex; flex-direction: column; gap: 5px; font-size: .82rem; font-weight: 600; color: var(--muted); }
.ai-cfg-grid select { padding: 9px 10px; }
#aiCfgStatus { margin-bottom: 6px; font-size: .88rem; }
.adv-cfg-cats { margin-top: 12px; }
.adv-cfg-cats-title { font-size: .82rem; margin-bottom: 8px; }
/* Πολλές κατηγορίες → εσωτερικό scroll, ώστε να μη σπρώχνεται το κουμπί Αποθήκευση εκτός οθόνης */
.adv-cfg-cats-list { display: flex; flex-wrap: wrap; gap: 6px; max-height: 180px; overflow-y: auto; padding: 2px; }
.adv-cat-chk { display: inline-flex; align-items: center; gap: 5px; font-size: .82rem; background: var(--bg-elev); border: 1px solid var(--line); border-radius: 999px; padding: 5px 11px; cursor: pointer; }
.adv-cat-chk input { width: auto; margin: 0; accent-color: var(--accent); }
/* Κουμπί Αποθήκευση: πάντα ορατό (κολλάει στο κάτω μέρος του panel) */
.adv-cfg-actions { margin-top: 12px; display: flex; justify-content: flex-end; position: sticky; bottom: 0; background: var(--bg-elev2); padding-top: 10px; }
.adv-cfg-actions button { background: var(--accent); color: #fff; border: none; border-radius: 10px; padding: 9px 18px; font-weight: 600; cursor: pointer; }
.adv-comps { grid-template-columns: repeat(2, 1fr) !important; }
@media (min-width: 720px) { .adv-comps { grid-template-columns: repeat(4, 1fr) !important; } }

/* Καθαρή θέση (net worth) */
.nw-total { margin-bottom: 10px; }
.nw-big { font-size: 1.9rem; font-weight: 800; letter-spacing: -.01em; }
.nw-parts { font-size: .82rem; margin-top: 2px; }
.nw-chart { width: 100%; }
.nw-svg { width: 100%; height: auto; display: block; }
.nw-zero { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 2 3; opacity: .6; vector-effect: non-scaling-stroke; }
.nw-wrap { position: relative; width: 100%; }
.nw-dot { stroke: var(--bg-elev); stroke-width: 1.5; }
.nw-tip {
  position: absolute; top: 2px; pointer-events: none; z-index: 5;
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: 10px;
  padding: 6px 9px; box-shadow: 0 4px 16px rgba(20,30,50,.18); font-size: .82rem; white-space: nowrap;
}
.nw-tip .nw-tip-m { color: var(--muted); font-size: .72rem; margin-bottom: 1px; }
.nw-tip b { font-variant-numeric: tabular-nums; }

/* 📸 κουμπί απόδειξης */
#receiptBtn { white-space: nowrap; }

/* 🔔 Push ειδοποιήσεις */
.push-status { margin: 12px 0; font-size: .95rem; }
.push-status .push-on { color: var(--accent); font-weight: 600; }
.push-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.push-cron { margin-top: 16px; border-top: 1px solid var(--line); padding-top: 14px; }
.push-cron-url { display: block; background: var(--bg-elev2); border-radius: 8px; padding: 10px 12px; font-size: .78rem; word-break: break-all; margin: 8px 0; }
.push-cron-hint { font-size: .8rem; }

/* Card titles (Add/Import/Settings) — συνεπές bold */
.card h2 { font-weight: 720; letter-spacing: -.01em; }
.quick-card h2 { margin: 0 0 4px; font-size: 1.2rem; }

/* Page title (desktop) */
.page-title { display: none; }

/* AI Insights card — γαλάζιο tint (Stitch) */
.ai-card { background: #eef4fb; border-color: #d8e6f4; }
[data-theme="dark"] .ai-card { background: #121c27; border-color: #22303f; }

@media (min-width: 1024px) {
  .page-title { display: block; margin: 2px 0 20px; font-size: 1.9rem; font-weight: 780; letter-spacing: -.025em; }
  /* Σκούρο κουμπί «Προσθήκη» στο sidebar (Stitch) */
  .tabbar .tab[data-view="import"] { background: #1f2937; color: #fff; }
  .tabbar .tab[data-view="import"]:hover,
  .tabbar .tab[data-view="import"].active { background: #111826; color: #fff; }
  [data-theme="dark"] .tabbar .tab[data-view="import"] { background: #2a3542; }
  [data-theme="dark"] .tabbar .tab[data-view="import"]:hover,
  [data-theme="dark"] .tabbar .tab[data-view="import"].active { background: #333f4e; }
}

/* ===== Γενικό widget-grid (Σύμβουλος & Επισκόπηση): drag / resize / collapse / masonry ===== */
.wg-grid { position: relative; }
.wg-bar { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin: -6px -4px 6px; }
.wg-bar .wg-title { flex: 1; min-width: 0; display: none; font-weight: 650; font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wg-bar button { background: var(--bg-elev2); color: var(--muted); border: none; border-radius: 8px; padding: 2px 9px; font-size: .95rem; line-height: 1.4; cursor: pointer; }
.wg-bar button:hover { color: var(--accent); background: var(--accent-soft); }
.wg-drag { cursor: grab; } .wg-drag:active { cursor: grabbing; }
.wg-full.on { color: var(--accent); background: var(--accent-soft); }
.card.wg-dragging { opacity: .45; outline: 2px dashed var(--accent); outline-offset: -2px; }
.card.wg-collapsed .wg-title { display: block; }
.card.wg-collapsed > :not(.wg-bar) { display: none !important; }
.card.wg-collapsed { min-height: 0 !important; }
.card.wg-resizing { outline: 2px solid var(--accent); outline-offset: -2px; user-select: none; }
.wg-rz-x, .wg-rz-y { display: none; position: absolute; z-index: 4; touch-action: none; }
.wg-rz-x { top: 8px; right: -2px; width: 14px; height: calc(100% - 16px); cursor: ew-resize; }
.wg-rz-y { left: 8px; bottom: -2px; height: 14px; width: calc(100% - 16px); cursor: ns-resize; }
.wg-rz-x::after { content: ''; position: absolute; top: 50%; right: 5px; width: 4px; height: 40px; max-height: 60%; transform: translateY(-50%); border-radius: 3px; background: var(--line); transition: background .15s; }
.wg-rz-y::after { content: ''; position: absolute; left: 50%; bottom: 5px; height: 4px; width: 40px; max-width: 60%; transform: translateX(-50%); border-radius: 3px; background: var(--line); transition: background .15s; }
.card:hover .wg-rz-x::after, .card:hover .wg-rz-y::after { background: var(--accent); }

@media (min-width: 900px) {
  .wg-grid { display: grid; grid-template-columns: repeat(16, minmax(0, 1fr)); gap: 16px; align-items: start; }
  .wg-grid > .card { margin: 0; position: relative; grid-column: span var(--span, 8); min-width: 0; }
  .wg-grid > .card .wg-rz-x, .wg-grid > .card .wg-rz-y { display: block; }
  .adv-chat-log { max-height: 300px; }
  /* Masonry mode (JS): absolute τοποθέτηση, γεμίζει τα κενά */
  .wg-grid.wg-masonry { display: block; }
  .wg-grid.wg-masonry > .card { position: absolute; margin: 0; top: 0; left: 0; transition: top .2s ease, left .2s ease; }
  .wg-grid.wg-masonry > .card.wg-fixedh { overflow: hidden; }
  /* Σε σταθερό ύψος: το σχέδιο δράσης & το chat γίνονται flex column ώστε το περιεχόμενο
     να σκρολάρει εσωτερικά αντί να κόβεται. Η κεφαλίδα μένει σταθερή. */
  .wg-grid.wg-masonry > .card.advisor-plan.wg-fixedh,
  .wg-grid.wg-masonry > .card.advisor-chat.wg-fixedh { display: flex; flex-direction: column; }
  .card.advisor-plan.wg-fixedh > *, .card.advisor-chat.wg-fixedh > * { flex: none; }
  .card.advisor-plan.wg-fixedh > .adv-plan,
  .card.advisor-chat.wg-fixedh > .adv-chat-log { flex: 1 1 auto; min-height: 0; max-height: none; overflow-y: auto; }
  .wg-grid.wg-masonry > .card.wg-dragging,
  .wg-grid.wg-masonry > .card.wg-resizing { transition: none; }
}
@media (max-width: 899px) {
  .wg-full, .wg-rz-x, .wg-rz-y { display: none; }   /* μία στήλη: χωρίς πλάτος/ύψος resize */
}

/* ---------- Budget: view toggle, delete, list mode, invest goal ---------- */
.seg-toggle { display: inline-flex; background: var(--bg-elev2); border-radius: 9px; padding: 3px; gap: 2px; }
.seg-toggle button { background: transparent; color: var(--muted); border: none; cursor: pointer; padding: 5px 11px; border-radius: 7px; font-size: .95rem; line-height: 1; }
.seg-toggle button.active { background: var(--bg-elev); color: var(--accent); box-shadow: var(--shadow); }

.budget-del {
  flex: none; background: none; color: var(--muted); border: none; cursor: pointer;
  width: 26px; height: 26px; padding: 0; border-radius: 8px; font-size: .9rem; line-height: 1;
}
.budget-del:hover { background: color-mix(in srgb, var(--danger) 14%, transparent); color: var(--danger); }

.invest-goal-card { display: flex; flex-direction: column; gap: 8px; border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line)); }
.ig-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.ig-amount { font-weight: 750; font-variant-numeric: tabular-nums; }

/* Force list mode σε desktop (override του grid) */
@media (min-width: 900px) {
  .budget-list.as-list { display: flex; flex-direction: column; gap: 8px; }
  .budget-list.as-list .budget-ring { display: none; }
  .budget-list.as-list .budget-row .budget-bar { display: block; }
  .budget-list.as-list .budget-row .budget-spent { display: block; }
  .budget-list.as-list .budget-row { padding: 12px 14px; }
}

/* Mobile bottom-nav: active icon σε pill (όπως το παράδειγμα) */
@media (max-width: 1023px) {
  .tab span { padding: 5px 14px; border-radius: 12px; transition: background .15s ease; }
  .tab.active span { background: var(--accent-soft); }
}

/* ---------- Tutorial (onboarding) ---------- */
.tut-hero { display: flex; align-items: center; gap: 22px; overflow: hidden; background: linear-gradient(135deg, var(--accent-soft), var(--bg-elev) 65%); }
.tut-hero-txt { flex: 1; min-width: 0; }
.tut-badge { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: .8rem; color: var(--accent); background: var(--bg-elev); border: 1px solid var(--line); padding: 5px 12px; border-radius: 999px; }
.tut-hero h2 { margin: 12px 0 6px; font-size: 1.7rem; font-weight: 780; letter-spacing: -.025em; }
.tut-hero p { margin: 0 0 16px; color: var(--muted); max-width: 46ch; }
.tut-hero-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.tut-start { background: var(--accent); color: #fff; display: inline-flex; align-items: center; gap: 8px; }
.tut-start:hover { background: var(--accent-d); }
.tut-start span, .tut-cta span { transition: transform .15s ease; }
.tut-start:hover span, .tut-cta:hover span { transform: translateX(3px); }
.tut-hero-art { flex: none; width: 190px; }
.tut-hero-art svg { width: 100%; height: auto; display: block; }
@media (max-width: 680px) { .tut-hero-art { display: none; } .tut-hero { background: var(--bg-elev); } }

.tut-section-title { margin: 26px 2px 14px; font-size: 1.25rem; font-weight: 760; letter-spacing: -.02em; }
.tut-steps { display: flex; flex-direction: column; gap: 14px; }
.tut-step {
  display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: start;
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow);
  transition: border-color .15s ease, transform .15s ease;
}
.tut-step:hover { border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); }
.tut-num { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-weight: 780; color: #fff; background: var(--accent); font-variant-numeric: tabular-nums; }
.tut-head { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.tut-ic { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; color: var(--accent); background: var(--accent-soft); flex: none; }
.tut-ic svg { width: 22px; height: 22px; }
.tut-step h3 { margin: 0; font-size: 1.1rem; font-weight: 720; }
.tut-step p { margin: 0 0 10px; color: var(--muted); }
.tut-step ul { margin: 0 0 14px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 7px; }
.tut-step li { position: relative; padding-left: 22px; font-size: .92rem; }
.tut-step li::before { content: ''; position: absolute; left: 4px; top: .5em; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.tut-cta { background: var(--bg-elev2); color: var(--text); font-weight: 650; display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 10px; font-size: .92rem; }
.tut-cta:hover { background: var(--accent-soft); color: var(--accent); }
.guide-manual { margin-top: 16px; }

.adv-approval { padding:16px; margin:12px 0; border:1px solid var(--accent,#4caf50); border-radius:12px; overflow-wrap:anywhere; }
.adv-approval p { margin:6px 0; }
.adv-approval button { margin:8px 8px 0 0; padding:8px 16px; }

@media (max-width: 600px) { .topbar-row { flex-wrap: wrap; row-gap: 8px; } .topbar-actions { max-width: 100%; flex-wrap: wrap; } }
/* Ανάλυση Συμβούλου σε σταθερή μορφή */
.adv-advice h4 { margin: 14px 0 6px; font-size: 14px; }
.adv-headline { font-size: 16px; font-weight: 650; line-height: 1.5; margin: 6px 0 10px; }
.adv-keys { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; margin: 8px 0; }
.adv-keys > div { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg-elev2); min-width: 0; }
.adv-keys span { font-size: 12px; }
.adv-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.adv-list li { display: flex; justify-content: space-between; gap: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.adv-list li.adv-act { flex-direction: column; gap: 2px; }
.adv-badge { font-size: 11px; color: var(--accent); border: 1px solid var(--accent); border-radius: 999px; padding: 0 6px; }
.adv-chart { margin: 8px 0; }
.adv-chart svg { width: 100%; max-width: 420px; height: auto; display: block; }
.adv-key { display: inline-block; width: 10px; height: 3px; vertical-align: middle; margin-left: 6px; }
.adv-key.inc { background: var(--accent); } .adv-key.exp { background: var(--danger); }
.adv-next { margin-top: 12px; font-weight: 600; }
.advice-eval { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.advice-eval-row { padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; }
.advice-eval-row ul { margin: 4px 0 0; padding-left: 18px; }
#addCatForm { flex-wrap: wrap; }
#addCatForm #newCatFlow { flex: 1 1 220px; }