/* ───────── Θέμα γραφείου (πάνω στο Radzen Material) ───────── */
:root {
    --rz-primary: #1f3a5f;
    --rz-primary-light: #2d5285;
    --rz-primary-lighter: rgba(31, 58, 95, .12);
    --rz-primary-dark: #162a45;
    --rz-primary-darker: #0f1e31;
    --rz-secondary: #b8893b;
    --rz-secondary-light: #c9a15e;
    --rz-secondary-lighter: rgba(184, 137, 59, .14);
    --rz-secondary-dark: #936c2c;
    --rz-text-font-family: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
    --app-surface: var(--rz-base-background-color, #fff);
    --app-muted: var(--rz-text-secondary-color, #6b7280);
    --app-border: var(--rz-base-200, #e5e7eb);
    --app-hover: var(--rz-base-100, #f3f4f6);
    --app-accent: #b8893b;
    --app-danger: #c0392b;
}

html, body {
    font-family: var(--rz-text-font-family);
    margin: 0;
}

a { color: inherit; text-decoration: none; }
h1, h2, h3 { margin: 0; }
.muted { color: var(--app-muted); }
.flex-spacer { flex: 1 1 auto; }

/* ───────── Layout ───────── */
.app-layout { grid-template-areas: "rz-header rz-header" "rz-sidebar rz-body"; }
.app-header { background: var(--rz-primary) !important; color: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.app-header .rz-sidebar-toggle, .app-header .rz-button.rz-light, .app-header .rz-appearance-toggle .rz-button { color: #fff !important; }
.app-header-inner { padding: 0 .5rem; min-height: 56px; width: 100%; }
.app-header .rz-button.rz-variant-flat.rz-base, .app-header .rz-appearance-toggle button { color: #fff; background: transparent; }
.brand { display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; font-size: 1.15rem; letter-spacing: .2px; color: #fff; }
.brand .rzi { color: #e3c27d; font-size: 1.6rem; }
.demo-badge { margin-left: .35rem; }
.header-cta { margin-right: .25rem; }
.profile-menu .rz-navigation-item-link, .profile-menu .rz-profile-menu > ul { background: transparent !important; }
.profile-menu .rz-navigation-item-wrapper { color: #fff; }
.profile-text { line-height: 1.1; text-align: left; }
.profile-name { font-weight: 600; font-size: .9rem; color: #fff; }
.profile-role { font-size: .75rem; opacity: .8; color: #fff; }
.avatar {
    display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
    width: 36px; height: 36px; border-radius: 50%; color: #fff; font-weight: 700; font-size: .85rem;
    box-shadow: 0 0 0 2px rgba(255,255,255,.35);
}

.app-sidebar { display: flex; flex-direction: column; }
.app-sidebar .rz-panel-menu { flex: 1 1 auto; }
.sidebar-footer { padding: .75rem 1rem; font-size: .75rem; color: var(--app-muted); display: flex; gap: .35rem; align-items: center; }
.sidebar-footer .rzi { font-size: 1rem; }

.app-body { background: var(--rz-base-50, #f6f5f1); }
.page { max-width: 1400px; margin: 0 auto; padding: 1.25rem 1.5rem 4rem; }

.page-header { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-end; justify-content: space-between; margin-bottom: 1.25rem; }
.page-header h1 { font-size: 1.65rem; font-weight: 700; line-height: 1.2; }
.page-header p { margin: .25rem 0 0; }
.page-header-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.breadcrumb { font-size: .85rem; color: var(--app-muted); margin-bottom: .25rem; display: flex; gap: .35rem; flex-wrap: wrap; align-items: center; }
.breadcrumb a:hover { color: var(--rz-primary); text-decoration: underline; }

/* ───────── Αρχική ───────── */
.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.stat-tile {
    display: flex; gap: .9rem; align-items: center; padding: 1rem 1.1rem; border-radius: 14px;
    background: var(--app-surface); border: 1px solid var(--app-border); transition: transform .12s, box-shadow .12s;
}
.stat-tile:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.07); }
.stat-tile > .rzi { font-size: 2rem; color: var(--rz-primary); background: var(--rz-primary-lighter); border-radius: 12px; padding: .5rem; }
.stat-tile.warn > .rzi { color: var(--app-danger); background: rgba(192,57,43,.1); }
.stat-value { font-size: 1.8rem; font-weight: 700; line-height: 1; }
.stat-label { font-size: .85rem; color: var(--app-muted); margin-top: .2rem; }

.dash-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.dash-card { border-radius: 14px !important; }
.dash-card.wide { grid-column: 1 / -1; }
.card-title { display: flex; align-items: center; gap: .45rem; font-weight: 700; font-size: 1rem; margin-bottom: .75rem; }
.card-title .rzi { color: var(--rz-primary); }
.donut-title { text-align: center; line-height: 1.1; }

.event-row { display: flex; align-items: center; gap: .75rem; padding: .55rem .4rem; border-radius: 10px; }
.event-row:hover, .activity-row:hover { background: var(--app-hover); }
.event-date { display: flex; flex-direction: column; align-items: center; min-width: 46px; border-left: 4px solid; padding-left: .4rem; line-height: 1; }
.event-day { font-size: 1.35rem; font-weight: 700; }
.event-month { font-size: .7rem; text-transform: uppercase; color: var(--app-muted); }
.event-body { flex: 1 1 auto; min-width: 0; }
.event-title { font-weight: 600; display: flex; gap: .3rem; align-items: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.event-meta { font-size: .8rem; color: var(--app-muted); }
.days-chip { font-size: .75rem; font-weight: 600; padding: .15rem .55rem; border-radius: 999px; background: var(--app-hover); white-space: nowrap; }
.days-chip.soon { background: rgba(184,137,59,.18); color: #8a6424; }
.days-chip.urgent { background: rgba(192,57,43,.14); color: var(--app-danger); }

.task-row { display: flex; align-items: center; gap: .65rem; padding: .45rem .25rem; border-bottom: 1px dashed var(--app-border); }
.task-row:last-child { border-bottom: 0; }
.task-row.done .task-body > div:first-child { text-decoration: line-through; color: var(--app-muted); }
.task-body { flex: 1 1 auto; min-width: 0; }

.activity-row { display: flex; gap: .7rem; padding: .55rem .4rem; border-radius: 10px; align-items: flex-start; }
.activity-row > .rzi { color: var(--rz-primary); background: var(--rz-primary-lighter); border-radius: 8px; padding: .3rem; font-size: 1.1rem; }
.activity-text { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ───────── Λίστες: grid σε desktop, κάρτες σε κινητό ───────── */
.list-toolbar { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin-bottom: .9rem; }
.list-toolbar .search { flex: 1 1 260px; }
.mobile-only { display: none !important; }
.card-list { display: flex; flex-direction: column; gap: .6rem; }
.item-card {
    display: block; padding: .85rem 1rem; border-radius: 12px; background: var(--app-surface); border: 1px solid var(--app-border);
}
.item-card:active { background: var(--app-hover); }
.item-card-top { display: flex; justify-content: space-between; gap: .5rem; align-items: flex-start; }
.item-card-title { font-weight: 650; }
.item-card-sub { font-size: .85rem; color: var(--app-muted); margin-top: .2rem; }
.code { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: .85em; color: var(--app-muted); }
.link-strong { font-weight: 600; color: var(--rz-primary); }
.link-strong:hover { text-decoration: underline; }
.rz-data-grid .rz-cell-data { white-space: normal; }
.rz-tabview { max-width: 100%; min-width: 0; }
.rz-tabview-nav { overflow-x: auto; overflow-y: hidden; flex-wrap: nowrap; scrollbar-width: none; }
.rz-tabview-nav li { flex: 0 0 auto; }

/* ───────── Σελίδα υπόθεσης ───────── */
.detail-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem 1.25rem; }
.fact-label { font-size: .75rem; text-transform: uppercase; letter-spacing: .4px; color: var(--app-muted); }
.fact-value { font-weight: 550; overflow-wrap: anywhere; }
.fact-wide { grid-column: 1 / -1; }

.timeline { position: relative; padding-left: 2.4rem; }
.timeline::before { content: ""; position: absolute; left: .8rem; top: .3rem; bottom: .3rem; width: 2px; background: var(--app-border); }
.tl-item { position: relative; padding: 0 0 1.1rem; }
.tl-dot {
    position: absolute; left: -2.4rem; top: -.1rem; width: 1.7rem; height: 1.7rem; box-sizing: border-box; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; background: var(--app-surface); border: 2px solid var(--rz-primary); color: var(--rz-primary);
}
.tl-dot .rzi { font-size: .95rem; }
.tl-item.client .tl-dot { border-color: var(--app-accent); color: var(--app-accent); }
.tl-head { font-size: .8rem; color: var(--app-muted); display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; }
.tl-text { margin-top: .2rem; white-space: pre-line; }
.tl-bubble { background: var(--app-hover); border-radius: 10px; padding: .55rem .75rem; margin-top: .3rem; }
.tl-item.client .tl-bubble { background: rgba(184,137,59,.1); }
.chip { font-size: .7rem; padding: .05rem .45rem; border-radius: 999px; background: var(--app-hover); }
.chip.gold { background: rgba(184,137,59,.18); color: #8a6424; }

.composer { display: flex; flex-direction: column; gap: .5rem; margin-bottom: 1rem; }
.composer-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; justify-content: space-between; }

.doc-folder { margin-bottom: 1rem; }
.doc-folder-title { font-size: .8rem; text-transform: uppercase; letter-spacing: .4px; color: var(--app-muted); margin: .25rem 0 .35rem; display: flex; gap: .35rem; align-items: center; }
.doc-row { display: flex; align-items: center; gap: .7rem; padding: .5rem .45rem; border-radius: 10px; }
.doc-row:hover { background: var(--app-hover); }
.doc-icon { font-size: 1.7rem !important; color: #2b579a; }
.doc-icon.pdf { color: #c0392b; } .doc-icon.table_chart { color: #217346; } .doc-icon.mic { color: var(--app-accent); }
.doc-main { flex: 1 1 auto; min-width: 0; }
.doc-name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.doc-actions { display: flex; gap: .15rem; flex: 0 0 auto; }

.member-row { display: flex; align-items: center; gap: .6rem; padding: .35rem 0; }
.member-row .avatar { width: 32px; height: 32px; font-size: .75rem; box-shadow: none; }
.member-main { flex: 1 1 auto; min-width: 0; }

.request-row { display: flex; align-items: center; gap: .6rem; padding: .45rem 0; border-bottom: 1px dashed var(--app-border); }
.request-row:last-child { border-bottom: 0; }
.request-row .rzi.ok { color: #2e7d5b; }
.request-row .rzi.pending { color: var(--app-accent); }

/* ───────── Συνάντηση με AI ───────── */
.intake-steps { display: flex; gap: .4rem; margin-bottom: 1rem; flex-wrap: wrap; }
.intake-step { display: flex; align-items: center; gap: .4rem; padding: .35rem .8rem; border-radius: 999px; background: var(--app-surface); border: 1px solid var(--app-border); font-size: .85rem; color: var(--app-muted); }
.intake-step.active { border-color: var(--rz-primary); color: var(--rz-primary); font-weight: 650; }
.intake-step.done { color: #2e7d5b; }
.recorder { display: flex; flex-direction: column; align-items: center; gap: 1rem; padding: 1.5rem 1rem; text-align: center; }
.rec-button {
    width: 120px; height: 120px; border-radius: 50%; border: 0; cursor: pointer; color: #fff;
    background: radial-gradient(circle at 30% 30%, #e0584a, #b3281b); box-shadow: 0 10px 30px rgba(179,40,27,.35);
    display: flex; align-items: center; justify-content: center; transition: transform .1s;
}
.rec-button:active { transform: scale(.96); }
.rec-button .rzi { font-size: 3.2rem; }
.rec-button.recording { animation: pulse 1.6s infinite; background: radial-gradient(circle at 30% 30%, #444, #111); }
.rec-button:disabled { opacity: .5; cursor: not-allowed; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(179,40,27,.55); } 70% { box-shadow: 0 0 0 26px rgba(179,40,27,0); } 100% { box-shadow: 0 0 0 0 rgba(179,40,27,0); } }
.rec-time { font-size: 2.2rem; font-variant-numeric: tabular-nums; font-weight: 300; }
.rec-meter { display: flex; gap: 4px; height: 44px; align-items: center; }
.rec-meter span { width: 6px; height: 100%; border-radius: 3px; background: var(--rz-primary); transform: scaleY(.08); transition: transform .08s; }
.or-divider { display: flex; align-items: center; gap: .75rem; color: var(--app-muted); font-size: .85rem; width: 100%; max-width: 420px; }
.or-divider::before, .or-divider::after { content: ""; flex: 1; height: 1px; background: var(--app-border); }
.processing { display: flex; flex-direction: column; gap: .7rem; padding: 1rem; max-width: 520px; margin: 0 auto; }
.processing-step { display: flex; gap: .6rem; align-items: center; color: var(--app-muted); }
.processing-step.done { color: #2e7d5b; } .processing-step.active { color: var(--rz-primary); font-weight: 600; }
.review-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 1rem; align-items: start; }
.transcript { max-height: 70vh; overflow: auto; white-space: pre-wrap; font-size: .9rem; line-height: 1.55; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.form-grid .full { grid-column: 1 / -1; }
.form-grid .rz-form-field { width: 100%; }
.list-edit { display: flex; gap: .4rem; align-items: center; margin-bottom: .35rem; }
.list-edit .rz-textbox { flex: 1 1 auto; }
.ai-badge { display: inline-flex; gap: .3rem; align-items: center; font-size: .75rem; font-weight: 600; padding: .15rem .55rem; border-radius: 999px; background: linear-gradient(90deg, rgba(123,79,157,.15), rgba(31,58,95,.15)); color: #5b3a78; }
.sticky-actions { position: sticky; bottom: 0; background: var(--rz-base-50, #f6f5f1); padding: .75rem 0; display: flex; gap: .5rem; justify-content: flex-end; flex-wrap: wrap; z-index: 2; }

/* ───────── Editor ───────── */
.editor-shell { height: calc(100dvh - 190px); min-height: 480px; border-radius: 12px; overflow: hidden; border: 1px solid var(--app-border); background: var(--app-surface); }

/* ───────── Σύνδεση ───────── */
.login-page { min-height: 100dvh; display: grid; grid-template-columns: 1.1fr 1fr; background: #f4f1ea; }
.login-hero {
    background: linear-gradient(155deg, #1f3a5f 0%, #162a45 60%, #0f1e31 100%); color: #fff; padding: 4rem 3.5rem;
    display: flex; flex-direction: column; justify-content: center; gap: 1.2rem;
}
.login-brand { display: flex; gap: .5rem; align-items: center; font-weight: 700; font-size: 1.3rem; }
.login-brand .rzi { color: #e3c27d; font-size: 2rem; }
.login-hero h1 { font-size: 2.3rem; line-height: 1.15; font-weight: 700; max-width: 560px; }
.login-hero p { opacity: .85; max-width: 540px; line-height: 1.55; margin: 0; }
.login-features { list-style: none; padding: 0; margin: .5rem 0 0; display: flex; flex-direction: column; gap: .7rem; }
.login-features li { display: flex; gap: .6rem; align-items: center; }
.login-features .rzi { color: #e3c27d; }
.login-panel { padding: 3rem 2.5rem; overflow: auto; color: #1f2937; }
.login-panel h2 { font-size: 1.5rem; }
.login-panel > p { margin: .4rem 0 1.25rem; }
.login-group { margin-bottom: 1rem; }
.login-group-title { font-size: .8rem; text-transform: uppercase; letter-spacing: .5px; font-weight: 700; margin-bottom: .4rem; color: #1f3a5f; }
.login-group-title .muted { text-transform: none; letter-spacing: 0; font-weight: 400; color: #6b7280; }
.login-group form { margin: 0 0 .4rem; }
.login-user {
    width: 100%; display: flex; align-items: center; gap: .75rem; padding: .6rem .8rem; border-radius: 12px; cursor: pointer;
    background: #fff; border: 1px solid #e5e1d8; text-align: left; font: inherit; color: inherit; transition: border-color .12s, box-shadow .12s;
}
.login-user:hover { border-color: #1f3a5f; box-shadow: 0 4px 14px rgba(31,58,95,.12); }
.login-user .avatar { box-shadow: none; }
.login-user-text { flex: 1 1 auto; display: flex; flex-direction: column; }
.login-user-text small { color: #6b7280; }
.login-arrow { color: #9ca3af; }

/* ───────── Portal πελάτη ───────── */
.portal { min-height: 100dvh; display: flex; flex-direction: column; background: var(--rz-base-50, #f6f5f1); color: var(--rz-text-color); }
.portal-header { background: var(--rz-primary); color: #fff; position: sticky; top: 0; z-index: 10; }
.portal-header-inner { max-width: 1000px; margin: 0 auto; padding: .5rem 1rem; display: flex; gap: .5rem; align-items: center; min-height: 56px; }
.portal-header .rz-button, .portal-header .rz-appearance-toggle button { color: #fff !important; }
.portal-main { flex: 1 1 auto; width: 100%; max-width: 1000px; margin: 0 auto; padding: 1.25rem 1rem 3rem; box-sizing: border-box; }
.portal-footer { text-align: center; font-size: .8rem; color: var(--app-muted); padding: 1rem; display: flex; gap: .35rem; justify-content: center; align-items: center; }
.portal-case {
    display: block; padding: 1.1rem 1.2rem; border-radius: 14px; background: var(--app-surface); border: 1px solid var(--app-border); margin-bottom: .8rem;
}
.portal-case:hover { box-shadow: 0 6px 18px rgba(0,0,0,.07); }
.progress-track { display: flex; gap: 4px; margin: .8rem 0 .3rem; }
.progress-track span { flex: 1; height: 6px; border-radius: 3px; background: var(--app-border); }
.progress-track span.on { background: var(--app-accent); }
.progress-labels { display: flex; justify-content: space-between; font-size: .72rem; color: var(--app-muted); }
.next-hearing { display: flex; gap: .6rem; align-items: center; margin-top: .75rem; padding: .6rem .8rem; border-radius: 10px; background: var(--rz-primary-lighter); }
.next-hearing .rzi { color: var(--rz-primary); }

.empty-state { text-align: center; color: var(--app-muted); padding: 2rem 1rem; }
.empty-state .rzi { font-size: 3rem; opacity: .5; }
.notice { display: flex; gap: .6rem; align-items: flex-start; padding: .7rem .9rem; border-radius: 10px; background: var(--rz-primary-lighter); font-size: .9rem; margin-bottom: 1rem; }
.notice .rzi { color: var(--rz-primary); }

/* ───────── Responsive ───────── */
@media (max-width: 1100px) {
    .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .detail-grid, .review-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 768px) {
    .page { padding: .9rem .75rem 5rem; }
    .page-header h1 { font-size: 1.3rem; }
    .dash-grid { grid-template-columns: minmax(0, 1fr); }
    .stat-grid { gap: .6rem; }
    .stat-tile { padding: .75rem; gap: .6rem; }
    .stat-tile > .rzi { font-size: 1.5rem; }
    .stat-value { font-size: 1.4rem; }
    .desktop-only { display: none !important; }
    .mobile-only { display: block !important; }
    .mobile-only.card-list { display: flex !important; }
    .hide-xs { display: none !important; }
    .facts, .form-grid { grid-template-columns: minmax(0, 1fr); }
    .login-page { grid-template-columns: 1fr; }
    .login-hero { padding: 2rem 1.25rem; }
    .login-hero h1 { font-size: 1.5rem; }
    .login-features { display: none; }
    .login-panel { padding: 1.5rem 1rem; }
    .brand-text { font-size: 1rem; }
    .portal-header-inner { gap: .15rem; padding: .5rem .5rem; }
    .portal .brand { min-width: 0; }
    .portal .brand-text { font-size: .9rem; max-width: 60vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .doc-actions .rz-button .rz-button-text { display: none; }
    .editor-shell { height: calc(100dvh - 150px); }
    .rz-scheduler { height: 70vh !important; }
}

/* Σκοτεινό θέμα: μικρές διορθώσεις */
.rz-material-dark .login-user, [data-theme="material-dark"] .login-user { background: #fff; }
