/* ==========================================================================
   «ERP» look: DKN Media in the ERP Console's «Industry» system (projects/erp/frontend/src/index.css,
   admin-ui/erp-admin-ui.css). Loaded last instead of soft.css when dkn_look() is 'erp' (?look=erp).
   · square corners, hairline borders, no shadows: separation comes from lines, not depth
   · one navy-to-royal accent (#3B6FD0 family; #1E4FB0 where text sits on or in it, for 4.5:1), navy #132A4F (bluer than the ERP grey-navy, 2026-10-31)
   · grey ground #F2F2F3 between white panels
   · condensed headings: Fira Sans Condensed 600/700 (Barlow Condensed has no Greek, so it can't be used)
   · panels marked with registration crosses at the corners, like a technical drawing
   · tabular figures on every price
   ========================================================================== */

:root {
	--bg-alt: #F2F2F3;
	--bg-tint: #EEF3FE;
	--navy: #132A4F;
	--navy-2: #163C88;
	--text: #2B2D2F;
	--muted: #5D6063;
	--line: #D7D8D9;
	--line-strong: #B4B6B8;
	--hairline: #E6E7E8;
	--blue: #1E4FB0;
	--blue-dark: #163C88;
	--sky: #6E9BEA;
	--steel: #3B6FD0;
	--steel-100: #EEF3FE;
	--steel-200: #D5E2FB;
	--steel-300: #B3CBF5;
	--radius: 0;
	--shadow-sm: none;
	--shadow: none;
	--font-h: "Fira Sans Condensed", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

/* Nothing in this system is round. */
*, *::before, *::after { border-radius: 0 !important; }
::selection { background: rgba(59, 111, 208, .3); }
:focus-visible { outline: 2px solid var(--steel); outline-offset: 2px; }

/* Brand colour baked into inline SVGs (fill/stroke attributes) follows the steel scale */
[fill="#0D5BDD" i] { fill: #1E4FB0; }
[stroke="#0D5BDD" i] { stroke: #1E4FB0; }
[fill="#4D8DF7" i] { fill: #6E9BEA; }
[stroke="#4D8DF7" i] { stroke: #6E9BEA; }
[fill="#EAF1FD" i] { fill: #EEF3FE; }
[fill="#0A2540" i] { fill: #132A4F; }

/* ---------- Type ---------- */
h1, h2, h3, h4, .section-title, .hero__title, .lp-hero__title, .ab-hero__title {
	font-family: var(--font-h); font-weight: 600; letter-spacing: -.015em; line-height: 1.08;
}
.hero__title, .lp-hero__title { font-weight: 700; }
.section-title .hl, .hero__title .hl, .hero__title em, .lp-price { color: var(--blue); }
.eyebrow, .badge { color: var(--blue); }
.svc__price, .svc__price b, .lp-price, .aff-tier b, .aff-table, [class*="price"] { font-variant-numeric: tabular-nums; }

/* ---------- Header: ERP nav bar on top, hairline under the menu ---------- */
.topbar, .site-topbar { background: #132A4F; }
.site-header__inner { border-bottom: 1px solid var(--line); }
.site-header.is-scrolled { box-shadow: none; }

/* ---------- Buttons: square, solid steel, 3px underline on hover like the ERP tabs ---------- */
.btn { min-height: 44px; box-shadow: none; }
.btn--primary { background: var(--blue); border-color: var(--blue); }
.btn--primary:hover { background: var(--blue-dark); border-color: var(--blue-dark); }
.btn--ghost { background: #fff; border-color: var(--line-strong); }
.btn--ghost:hover { border-color: var(--navy); }

/* ---------- Hero: blueprint sheet. Hairline grid on the ground grey, steel dots on top ---------- */
.hero__bg.hero__bg--net {
	background:
		linear-gradient(rgba(19, 42, 79, .055) 1px, transparent 1px) 0 0 / 32px 32px,
		linear-gradient(90deg, rgba(19, 42, 79, .055) 1px, transparent 1px) 0 0 / 32px 32px,
		radial-gradient(800px 480px at 85% 0%, rgba(30, 79, 176, .12), transparent 65%),
		linear-gradient(180deg, #EDF1F8, #F7F7F8);
}
.hero__bg--net::after, .hero .hero__bg--net::after { background: linear-gradient(transparent, #F7F7F8); }
.hero-net { color: rgb(59, 111, 208); }
.lp-hero { background: #F2F2F3; }

/* ---------- Projects strip: the ERP sidebar colour ---------- */
section.trust { background: #132A4F; }
section.trust .trust__label { color: #8FA6C8; }
section.trust .trust__names li { color: #fff; border-left: 1px solid rgba(211, 222, 240, .14); }
section.trust .trust__names li:first-child { border-left: 0; }
section.trust .trust__tech li { background: transparent; color: #D3DEF0; border: 1px solid rgba(211, 222, 240, .22); }

/* ---------- Sections alternate white / ground grey ---------- */
.services, .projects, .ab-diff, .ct-main { background: #F2F2F3; }

/* ---------- Panels: white, hairline, registration marks at the corners ---------- */
.svc, .pcard, .contact-card, .fd__card, .fdf__card, .offer__card, .fd-cta, .project__meta, .next-project, .ct-box, .aff-calc, .aff-tier {
	background: #fff; border: 1px solid var(--line); box-shadow: none;
}
.svc:hover, .pcard:hover, .contact-card:hover, .fd-cta:hover { box-shadow: none; border-color: var(--line-strong); }
.svc, .fd-cta, .contact-card, .ct-box { position: relative; overflow: visible; }
.svc::after, .fd-cta::after, .contact-card::after, .ct-box::after {
	content: ""; position: absolute; inset: -6px; pointer-events: none; z-index: 1;
	--m: rgba(29, 31, 32, .55);
	background:
		linear-gradient(var(--m), var(--m)) 5px 0 / 1px 11px no-repeat,
		linear-gradient(var(--m), var(--m)) 0 5px / 11px 1px no-repeat,
		linear-gradient(var(--m), var(--m)) calc(100% - 5px) 0 / 1px 11px no-repeat,
		linear-gradient(var(--m), var(--m)) 100% 5px / 11px 1px no-repeat,
		linear-gradient(var(--m), var(--m)) 5px 100% / 1px 11px no-repeat,
		linear-gradient(var(--m), var(--m)) 0 calc(100% - 5px) / 11px 1px no-repeat,
		linear-gradient(var(--m), var(--m)) calc(100% - 5px) 100% / 1px 11px no-repeat,
		linear-gradient(var(--m), var(--m)) 100% calc(100% - 5px) / 11px 1px no-repeat;
}
.svc--featured { background: #fff; border-color: var(--steel); box-shadow: inset 0 3px 0 var(--steel); }
.svc__ribbon { background: var(--navy); color: #fff; }

/* Hero offer card: steel 0€ tile, arrow badge in navy */
.fd-cta__zero { background: var(--blue); }
.fd-cta__go { background: var(--navy); }
.fd-cta-arrow path { stroke: var(--steel); }

/* ---------- Chips and tags: hairline, no tint ---------- */
.chip, .svc__tags li, .pcard__tech li, .trust__tech li, .fd__steps li, .checklist li { background: #fff; border: 1px solid var(--line); }

/* ---------- Process band: ERP nav navy ---------- */
.process--dark { background: #132A4F; }

/* ---------- Forms: 44px fields, hairline, steel focus ring ---------- */
.fdf__form input, .fdf__form textarea, .fdf__form select { border: 1px solid var(--line-strong); box-shadow: none; }
.fdf__form input:focus, .fdf__form textarea:focus { border-color: var(--steel); box-shadow: 0 0 0 3px var(--steel-200); }

/* ---------- Footer: same navy as the strip ---------- */
.site-footer { background: #132A4F; }

/* Process on navy: the steps grid is drawn in light hairlines, like the ERP sidebar */
.process--dark .steps { background: transparent; border-color: rgba(211, 222, 240, .22); }
.process--dark .step { border-color: rgba(211, 222, 240, .22) !important; }
.process--dark .eyebrow, .process--dark .hl, .process--dark .step b { color: #8DB2F2; }
.process--dark .step p { color: #D3DEF0; }

/* ---------- Section rhythm: every section pads top AND bottom (the base rule had no bottom padding, so
   grey/navy sections ended flush under their last line).
   White sections pad less (two in a row meet at ~120px); tinted/navy sections pad more so their colour
   has room around the content. */
.section { padding: clamp(44px, 4.5vw, 64px) 0; }
.section--tight { padding-top: 40px; }
.services, .projects, .contact, .process--dark, .hw-steps-sec, .hw-runs, .ab-diff, .ct-main { padding: clamp(64px, 7vw, 96px) 0; }
.lp-faq { padding-bottom: clamp(64px, 7vw, 96px); }

/* ---------- Centred hero over a wall of our sites (template-parts/hero-wall.php) ---------- */
.hero--center { padding: clamp(36px, 4vw, 56px) 0 clamp(40px, 4vw, 56px); background: #F2F4F8; isolation: isolate; }
.hero__center { position: relative; z-index: 2; display: grid; justify-items: center; text-align: center; }
.hero__center .hero__title { max-width: 26ch; font-size: clamp(36px, 4.6vw, 64px); line-height: 1.04; margin-top: 12px; text-wrap: balance; }
.hero__center .hero__lead { max-width: 680px; margin: 18px auto 0; }
.hero__center .hero__offer-row { width: 100%; margin-top: clamp(28px, 3vw, 40px); display: grid; justify-items: center; gap: 18px; }
.hero__center .fd-cta-arrow { display: none; }

.hero-wall { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.hero-wall__grid {
	position: absolute; left: 50%; top: 50%; width: max(1500px, 108%); translate: -50% -50%;
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; padding: 16px;
	will-change: transform;
}
.hero-wall__tile { background: #fff; border: 1px solid #D5DBE6; overflow: hidden; }
.hero-wall__bar { display: flex; align-items: center; gap: 5px; height: 30px; padding: 0 10px; background: #EEF1F6; border-bottom: 1px solid #D5DBE6; }
.hero-wall__bar i { width: 8px; height: 8px; background: #C9D1DD; }
.hero-wall__bar span { display: inline-flex; align-items: center; gap: 6px; margin-left: 8px; padding: 0 10px; height: 18px; background: #fff; font: 600 11px/18px var(--font-b); color: #5D6063; }
.hero-wall__bar b { width: 6px; height: 6px; background: #12805C; }
.hero-wall__view { aspect-ratio: 16 / 10; overflow: hidden; container-type: size; }
.hero-wall__view img { width: 100%; height: auto; max-width: none; animation: wall-scroll var(--dur, 50s) ease-in-out var(--delay, 0s) infinite alternate; }
@keyframes wall-scroll { from { transform: translateY(0); } to { transform: translateY(calc(-100% + 100cqh)); } }
.hero-wall__veil {
	position: absolute; inset: 0;
	background:
		radial-gradient(70% 62% at 50% 46%, rgba(242, 244, 248, .96) 0%, rgba(242, 244, 248, .9) 45%, rgba(242, 244, 248, .66) 100%),
		linear-gradient(180deg, rgba(242, 244, 248, .5), transparent 22%, transparent 78%, rgba(242, 244, 248, .9));
}
@media (prefers-reduced-motion: reduce) { .hero-wall__view img { animation: none; } }
@media (max-width: 760px) {
	.hero-wall__grid { grid-template-columns: repeat(2, 1fr); width: 150%; gap: 10px; padding: 10px; }
	.hero-wall__veil { background: rgba(242, 244, 248, .86); }
}

/* ---------- «Πώς δουλεύουμε» (template-parts/how-we-work.php, page-pos-doulevoume.php) ---------- */
.hw { background: #fff; }
.hw__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(40px, 6vw, 88px); align-items: center; }
.hw .section-title { margin-top: 10px; }
.hw__lead { margin: 20px 0 0; font-size: 18px; line-height: 1.65; color: var(--text); }
.hw__points { list-style: none; counter-reset: hw; margin: 28px 0 0; padding: 0; border-top: 1px solid var(--line); }
.hw__points li { counter-increment: hw; display: grid; grid-template-columns: 44px 1fr; column-gap: 4px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.hw__points li::before { content: counter(hw, decimal-leading-zero); grid-row: span 2; font: 700 15px/1.5 var(--font-b); color: var(--blue); font-variant-numeric: tabular-nums; }
.hw__points b { color: var(--navy); font-size: 17px; }
.hw__points span { color: var(--muted); font-size: 15.5px; line-height: 1.6; margin-top: 2px; }
.hw__more { display: inline-flex; align-items: center; gap: 8px; margin-top: 24px; font-weight: 700; color: var(--blue); }
.hw__more .ico, .hw__more svg { width: 18px; height: 18px; }

.hw-map { position: relative; margin: 0; padding: 28px; background:
	linear-gradient(rgba(19, 42, 79, .05) 1px, transparent 1px) 0 0 / 24px 24px,
	linear-gradient(90deg, rgba(19, 42, 79, .05) 1px, transparent 1px) 0 0 / 24px 24px, #F7F8FB;
	border: 1px solid var(--line); }
.hw-map::after { content: ""; position: absolute; inset: -6px; pointer-events: none; --m: rgba(29, 31, 32, .55);
	background:
		linear-gradient(var(--m), var(--m)) 5px 0 / 1px 11px no-repeat, linear-gradient(var(--m), var(--m)) 0 5px / 11px 1px no-repeat,
		linear-gradient(var(--m), var(--m)) calc(100% - 5px) 0 / 1px 11px no-repeat, linear-gradient(var(--m), var(--m)) 100% 5px / 11px 1px no-repeat,
		linear-gradient(var(--m), var(--m)) 5px 100% / 1px 11px no-repeat, linear-gradient(var(--m), var(--m)) 0 calc(100% - 5px) / 11px 1px no-repeat,
		linear-gradient(var(--m), var(--m)) calc(100% - 5px) 100% / 1px 11px no-repeat, linear-gradient(var(--m), var(--m)) 100% calc(100% - 5px) / 11px 1px no-repeat; }
.hw-map figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 12px; margin-bottom: 20px; }
/* grey title bar across the top of the drawing, like a sheet header */
.hw-map figcaption em { flex-basis: calc(100% + 56px); margin: -28px -28px 14px; padding: 11px 28px; background: #EEF1F5; border-bottom: 1px solid var(--line); font: 700 14px/1.3 var(--font-b); font-style: normal; color: var(--blue); }
@media (max-width: 560px) { .hw-map figcaption em { flex-basis: calc(100% + 36px); margin: -18px -18px 12px; padding: 10px 18px; } }
.hw-map figcaption span { font: 600 20px/1.2 var(--font-h); color: var(--navy); }
.hw-map figcaption small { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 13px; }
.hw-map figcaption small::before { content: ""; width: 7px; height: 7px; background: #12805C; }
.hw-map__row { display: grid; gap: 12px; }
.hw-map__row--2 { grid-template-columns: 1fr 1fr; }
.hw-map__row--3 { grid-template-columns: repeat(3, 1fr); }
.hw-map__link { display: block; width: 100%; height: 24px; overflow: visible; }
.hw-map__link path { fill: none; stroke: var(--steel); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.hw-node { display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: start; padding: 14px; background: #fff; border: 1px solid var(--line); }
.hw-node svg { grid-row: span 2; width: 20px; height: 20px; color: var(--blue); margin-top: 1px; }
.hw-node b { color: var(--navy); font-size: 15.5px; line-height: 1.3; }
.hw-node span { color: var(--muted); font-size: 13.5px; line-height: 1.45; margin-top: 2px; }
.hw-node--core { background: var(--navy); border-color: var(--navy); padding: 18px; }
.hw-node--core svg { color: #8DB2F2; }
.hw-node--core b { color: #fff; font: 600 20px/1.2 var(--font-h); }
.hw-node--core span { color: #D3DEF0; font-size: 14.5px; }
@media (max-width: 960px) { .hw__grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
	.hw-map { padding: 18px; }
	.hw-map__row--3 { grid-template-columns: 1fr; }
	.hw-map__link { height: 12px; } .hw-map__link path { display: none; }
}

/* Page «Πώς δουλεύουμε» */
.hw-hero .section-lead { max-width: 720px; }
.hw-story { background: #fff; }
.hw-steps-sec { background: #F2F2F3; }
.hw-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--line); background: #fff; }
.hw-steps li { padding: 24px 20px 28px; border-left: 1px solid var(--line); }
.hw-steps li:first-child { border-left: 0; }
.hw-steps b { display: block; font: 700 15px/1 var(--font-b); color: var(--blue); font-variant-numeric: tabular-nums; }
.hw-steps h3 { margin: 14px 0 8px; font-size: 20px; color: var(--navy); }
.hw-steps p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.6; }
.hw-build { background: #fff; }
.hw-build__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.hw-build__grid li { display: grid; align-content: start; gap: 8px; padding: 24px 22px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.hw-build__grid svg { width: 24px; height: 24px; color: var(--blue); margin-bottom: 6px; }
.hw-build__grid b { color: var(--navy); font-size: 17px; line-height: 1.3; }
.hw-build__grid span { color: var(--muted); font-size: 15px; line-height: 1.6; }
.hw-runs { background: #F2F2F3; margin-top: 0; border-top: 0; }
@media (max-width: 1080px) { .hw-steps { grid-template-columns: 1fr 1fr; } .hw-steps li { border-left: 0; border-top: 1px solid var(--line); } .hw-steps li:nth-child(even) { border-left: 1px solid var(--line); } .hw-steps li:nth-child(-n+2) { border-top: 0; } .hw-build__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .hw-steps { grid-template-columns: 1fr; } .hw-steps li, .hw-steps li:nth-child(even) { border-left: 0; } .hw-steps li:nth-child(2) { border-top: 1px solid var(--line); } .hw-build__grid { grid-template-columns: 1fr; } }
.contact { background: #F2F2F3; }

/* Case study on /pos-doulevoume/: drawing (sticky) + one row per part, problem → what was built */
.hw-case { background: #F2F2F3; padding: clamp(64px, 7vw, 96px) 0; }
.hw-case__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.hw-case__map { position: sticky; top: calc(var(--header-h) + 24px); }
.hw-case__list { list-style: none; margin: 0; padding: 0; counter-reset: cs; border-top: 1px solid var(--line-strong); }
.hw-case__list li { counter-increment: cs; padding: 22px 0 24px; border-bottom: 1px solid var(--line-strong); }
.hw-case__list h3 { display: flex; align-items: baseline; gap: 12px; margin: 0 0 12px; font-size: 22px; color: var(--navy); }
.hw-case__list h3::before { content: counter(cs, decimal-leading-zero); font: 700 14px/1 var(--font-b); color: var(--blue); font-variant-numeric: tabular-nums; }
.hw-case__list dl { margin: 0; display: grid; gap: 10px; }
.hw-case__list dl > div { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 12px; }
.hw-case__list dt { font-weight: 700; font-size: 14px; line-height: 1.6; color: var(--muted); }
.hw-case__list dl > div + div dt { color: var(--blue); }
.hw-case__list dd { margin: 0; font-size: 16px; line-height: 1.6; color: var(--text); }
@media (max-width: 960px) { .hw-case__grid { grid-template-columns: 1fr; } .hw-case__map { position: static; } }
@media (max-width: 480px) { .hw-case__list dl > div { grid-template-columns: 1fr; gap: 2px; } }

/* Page «Hosting & υποστήριξη» (page-hosting.php, footer link only) */
.hs-plans { background: #F2F2F3; padding: clamp(64px, 7vw, 96px) 0; }
.hs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: stretch; }
.hs-plan { display: flex; flex-direction: column; padding: 28px; background: #fff; border: 1px solid var(--line); }
.hs-plan--featured { border-color: var(--steel); box-shadow: inset 0 3px 0 var(--steel); }
.hs-plan h2 { margin: 0; font-size: 24px; color: var(--navy); }
.hs-plan__price { display: flex; align-items: baseline; gap: 8px; margin: 14px 0 0; }
.hs-plan__price b { font: 600 40px/1 var(--font-h); color: var(--navy); font-variant-numeric: tabular-nums; }
.hs-plan__price span { color: var(--muted); font-size: 15px; }
.hs-plan__lead { margin: 12px 0 0; color: var(--text); font-size: 15.5px; line-height: 1.6; }
.hs-plan ul { list-style: none; margin: 20px 0 24px; padding: 18px 0 0; border-top: 1px solid var(--line); display: grid; gap: 10px; flex: 1; align-content: start; }
.hs-plan li { display: grid; grid-template-columns: 18px 1fr; gap: 10px; font-size: 15px; line-height: 1.5; color: var(--text); }
.hs-plan li svg { width: 18px; height: 18px; color: var(--blue); margin-top: 2px; }
.hs-plan .btn { justify-content: center; }
.hs-own { display: flex; justify-content: space-between; align-items: center; gap: 24px 40px; margin-top: 20px; padding: 22px 28px; background: #fff; border: 1px dashed var(--line-strong); }
.hs-own h2 { margin: 0 0 6px; font-size: 20px; color: var(--navy); }
.hs-own p { margin: 0; max-width: 760px; color: var(--text); font-size: 15px; line-height: 1.6; }
.hs-own .hs-own__note { margin-top: 8px; color: var(--muted); font-size: 14px; }
.hs-own .btn { flex: none; }
.hs-notes { background: #fff; }
@media (max-width: 960px) { .hs-grid { grid-template-columns: 1fr; } .hs-own { flex-direction: column; align-items: flex-start; } }
.hs-plan__price--text b { font-size: 30px; line-height: 40px; }

/* Prices: small «από» before and «+ ΦΠΑ» after (all prices are before VAT, 2026-10-31) */
.svc__price b { display: inline-flex; align-items: baseline; gap: 6px; }
.svc__price b .from, .lp-price-card__amount .from { font: 500 14px/1 var(--font-b); font-style: normal; color: var(--muted); }
.svc__price b .vat { font: 500 13px/1 var(--font-b); font-style: normal; color: var(--muted); margin-left: 0; }
.lp-price .vat { margin-left: .25em; font-size: .38em; font-weight: 600; letter-spacing: 0; color: var(--muted); vertical-align: baseline; }
.lp-price-card__amount .from { margin-right: 6px; }

/* User pictures stay round (Konstantinos, 2026-10-31): the square rule above is for UI, not faces */
img.avatar, .acct-pill img, .pt-avatar, .pt-avatar img, [class*="avatar"] img { border-radius: 50% !important; }
.pt-msg__av img, .dkn-av, .dkn-av img { border-radius: 50% !important; }

/* Language switch «EL · EN» (inc/i18n.php dkn_lang_switch): top bar on desktop, under the menu on phones */
.lang-switch { display: inline-flex; align-items: center; margin-left: auto; margin-right: 14px; font: 700 13px/1 var(--font-b); }
.lang-switch > * { padding: 6px 8px; color: #D3DEF0; }
.lang-switch > span { color: #fff; box-shadow: inset 0 -2px 0 #8DB2F2; }
.lang-switch a:hover { color: #fff; }
.mobile-nav .lang-switch { margin: 18px 0 0; }
.mobile-nav .lang-switch > * { color: var(--navy); font-size: 15px; padding: 8px 12px; }
.mobile-nav .lang-switch > span { color: var(--blue); box-shadow: inset 0 -2px 0 var(--blue); }

/* Portal: «Ορίστε κωδικό» box for accounts made by the free-design form (inc/platform/set-password.php) */
.pt-setpass { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin: 0 0 20px; padding: 16px 18px; background: #EEF3FE; border: 1px solid #B3CBF5; border-left: 3px solid var(--blue); }
.pt-setpass__txt { flex: 1 1 280px; display: grid; gap: 2px; }
.pt-setpass__txt b { color: var(--navy); font-size: 16px; }
.pt-setpass__txt span { color: var(--muted); font-size: 14px; }
.pt-setpass__in input { min-height: 44px; width: 240px; max-width: 100%; padding: 0 12px; border: 1px solid var(--line-strong); background: #fff; font: inherit; }
.pt-setpass .btn { min-height: 44px; }
@media (max-width: 600px) { .pt-setpass__in, .pt-setpass__in input, .pt-setpass .btn { width: 100%; } }

/* ===== Email-first sign in (template-parts/auth-card.php, assets/js/auth.js) ===== */
.auth { position: relative; display: grid; gap: 8px; text-align: left; }
.auth__step { display: grid; gap: 8px; animation: auth-in .32s var(--ease) both; }
.auth__step[hidden] { display: none; }
@keyframes auth-in { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: none; } }
.auth__row { display: flex; gap: 8px; margin: 0; }
.auth__row input { flex: 1; min-width: 0; min-height: 48px; padding: 0 14px; border: 1px solid var(--line-strong); background: #fff; font: 500 16px/1 var(--font-b); color: var(--navy); }
.auth__row input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px var(--steel-200); }
.auth__row .btn { min-height: 48px; flex: none; white-space: nowrap; }
.auth [name=code] { letter-spacing: .3em; font-variant-numeric: tabular-nums; font-weight: 700; }
.auth__fine, .auth__alt, .auth__msg, .auth__who { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.auth__msg { font-size: 14.5px; color: var(--text); }
.auth__who b, .auth__msg b { color: var(--navy); }
.auth__link { padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: var(--blue); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.auth__btns { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0; }
.auth__err { margin: 0; padding: 8px 12px; background: #FDECEC; border-left: 3px solid #B42318; color: #8A1C12; font-size: 14px; }
.auth.is-busy .btn { opacity: .6; pointer-events: none; }
.auth.is-busy .btn::after { content: ""; width: 14px; height: 14px; margin-left: 4px; border: 2px solid #fff; border-right-color: transparent; border-radius: 50% !important; animation: auth-spin .7s linear infinite; }
@keyframes auth-spin { to { transform: rotate(360deg); } }
.auth__done { grid-template-columns: auto 1fr; align-items: center; column-gap: 12px; padding: 10px 0; animation: auth-swipe .45s var(--ease) both; }
.auth__done b { font: 700 18px/1.2 var(--font-h); color: #12805C; }
.auth__done span { grid-column: 2; color: var(--muted); font-size: 14px; }
.auth__tick { grid-row: span 2; display: grid; place-items: center; width: 44px; height: 44px; background: #12805C; border-radius: 50% !important; animation: auth-pop .5s var(--ease) both; }
.auth__tick svg { width: 24px; height: 24px; fill: none; stroke: #fff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 24; stroke-dashoffset: 24; animation: auth-draw .4s .2s ease-out forwards; }
@keyframes auth-swipe { from { opacity: 0; transform: translateX(40px); } to { opacity: 1; transform: none; } }
@keyframes auth-pop { 0% { transform: scale(.4); } 70% { transform: scale(1.12); } 100% { transform: scale(1); } }
@keyframes auth-draw { to { stroke-dashoffset: 0; } }
/* inside the hero card */
.fd-cta--optin { cursor: default; }
.fd-cta--optin:hover { transform: none; }
.fd-cta--optin .fd-cta__txt { gap: 8px; }
.fd-cta--optin .auth { margin-top: 6px; }
.fd-cta--optin .auth span:not(.screen-reader-text):not(.auth__tick) { color: inherit; font-size: inherit; line-height: inherit; }
.fd-cta--optin .auth__done span { color: var(--muted); font-size: 14px; }
.fd-cta--optin .auth .btn span { color: #fff; }
.fd-cta__portal { justify-self: center; margin-top: 4px; font-weight: 700; color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.fd-cta__portal:hover { color: var(--blue-dark); }
.auth__go { width: 52px; padding: 0; justify-content: center; }
.auth__go svg { width: 22px; height: 22px; }
@media (max-width: 640px) { .auth__row { flex-direction: column; } .auth__row .btn { width: 100%; justify-content: center; } }
@media (prefers-reduced-motion: reduce) { .auth__step, .auth__done, .auth__tick, .auth__tick svg { animation: none; stroke-dashoffset: 0; } }

/* portal sign-in card */
.pt-auth__h { margin: 0 0 14px; font-size: 22px; color: var(--navy); }
.pt-auth__how { list-style: none; margin: 20px 0 0; padding: 16px 0 0; border-top: 1px solid var(--line); display: grid; gap: 10px; }
.pt-auth__how li { display: grid; grid-template-columns: 26px 1fr; gap: 10px; align-items: start; font-size: 14px; color: var(--text); }
.pt-auth__how b { display: grid; place-items: center; width: 26px; height: 26px; background: var(--bg-tint); color: var(--blue); font-size: 13px; }

/* ===== Full-screen loader (auth.js on sign-in, onboarding.php on the first portal view) ===== */
.dkn-loader { position: fixed; inset: 0; z-index: 100010; display: grid; place-items: center; background: rgba(242, 244, 248, .96); backdrop-filter: blur(6px); opacity: 0; pointer-events: none; transition: opacity .35s ease; }
.dkn-loader.is-on { opacity: 1; pointer-events: auto; }
.dkn-loader.is-boot { display: none; }
.js .dkn-loader.is-boot { display: grid; }
.dkn-loader__box { display: grid; justify-items: center; gap: 14px; text-align: center; }
.dkn-loader__bot { width: 110px; animation: ldr-bob 1.1s ease-in-out infinite; }
.dkn-loader__bot svg { width: 100%; height: auto; display: block; }
.dkn-loader b { font: 600 20px/1.3 var(--font-h); color: var(--navy); }
.dkn-loader i { position: relative; display: block; width: 180px; height: 4px; overflow: hidden; background: #D5E2FB; }
.dkn-loader em { position: absolute; inset: 0 auto 0 0; width: 40%; background: var(--blue); animation: ldr-bar 1.1s ease-in-out infinite; }
@keyframes ldr-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes ldr-bar { 0% { transform: translateX(-100%); } 100% { transform: translateX(260%); } }
@media (prefers-reduced-motion: reduce) { .dkn-loader__bot, .dkn-loader em { animation: none; } }

/* ===== Onboarding (inc/platform/onboarding.php) ===== */
.ob { position: fixed; inset: 0; z-index: 100000; overflow-y: auto; background:
	radial-gradient(800px 480px at 85% 0%, rgba(30, 79, 176, .12), transparent 65%),
	linear-gradient(rgba(19, 42, 79, .045) 1px, transparent 1px) 0 0 / 32px 32px,
	linear-gradient(90deg, rgba(19, 42, 79, .045) 1px, transparent 1px) 0 0 / 32px 32px, #F2F4F8;
	opacity: 0; transition: opacity .4s ease; }
.ob.is-in { opacity: 1; }
.ob-open, .ob-open body { overflow: hidden; }
.ob__inner { width: min(760px, 100%); margin: 0 auto; padding: clamp(28px, 6vh, 64px) 20px 48px; display: grid; gap: 22px; }
.ob__byte { display: grid; grid-template-columns: 92px 1fr; gap: 16px; align-items: center; }
.ob__bot { width: 92px; animation: ldr-bob 2.4s ease-in-out infinite; }
.ob__bot svg { width: 100%; height: auto; display: block; }
.ob__bubble { position: relative; margin: 0; padding: 14px 18px; background: #fff; border: 1px solid var(--line); font-size: 16px; line-height: 1.5; color: var(--text); }
.ob__bubble::before { content: ""; position: absolute; left: -7px; top: 22px; width: 12px; height: 12px; background: #fff; border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); transform: rotate(45deg); }
.ob__bubble b { display: block; color: var(--navy); font-size: 17px; }
.ob__steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); background: #fff; }
.ob__steps li { display: grid; grid-template-columns: 28px 1fr; gap: 10px; align-items: start; padding: 14px; font-size: 14px; line-height: 1.45; color: var(--muted); border-left: 1px solid var(--line); }
.ob__steps li:first-child { border-left: 0; }
.ob__steps b { display: grid; place-items: center; width: 28px; height: 28px; background: var(--bg-tint); color: var(--blue); }
.ob__steps .is-on { color: var(--navy); font-weight: 600; box-shadow: inset 0 3px 0 var(--blue); }
.ob__steps .is-on b { background: var(--blue); color: #fff; }
.ob__form { display: grid; gap: 16px; padding: clamp(20px, 3vw, 32px); background: #fff; border: 1px solid var(--line); animation: auth-in .5s .15s var(--ease) both; }
.ob__title { margin: 0; font-size: clamp(26px, 3vw, 34px); color: var(--navy); }
.ob__lead { margin: -8px 0 0; color: var(--muted); font-size: 15.5px; }
.ob__kinds { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; border: 0; }
.ob__kinds legend { width: 100%; margin-bottom: 8px; font-weight: 700; font-size: 14px; color: var(--navy); }
.ob__kinds input { position: absolute; opacity: 0; }
.ob__kinds span { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; border: 1px solid var(--line-strong); font-weight: 600; font-size: 14.5px; color: var(--navy); cursor: pointer; }
.ob__kinds span svg { width: 18px; height: 18px; color: var(--blue); }
.ob__kinds input:checked + span { border-color: var(--blue); background: var(--bg-tint); box-shadow: inset 0 -3px 0 var(--blue); }
.ob__kinds input:focus-visible + span { outline: 2px solid var(--steel); outline-offset: 2px; }
.ob__story, .ob__row label { display: grid; gap: 6px; font-weight: 700; font-size: 14px; color: var(--navy); }
.ob__row label small { font-weight: 500; color: var(--muted); }
.ob__story textarea, .ob__row input { width: 100%; padding: 12px 14px; border: 1px solid var(--line-strong); font: 400 16px/1.5 var(--font-b); color: var(--text); background: #fff; }
.ob__story textarea:focus, .ob__row input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px var(--steel-200); }
.ob__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ob__calm { margin: 0; padding: 12px 14px; background: #EEF8F3; border-left: 3px solid #12805C; font-size: 15px; line-height: 1.5; color: #1F4D3A; }
.ob__btns { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.ob__later { color: var(--muted); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 640px) { .ob__steps, .ob__row { grid-template-columns: 1fr; } .ob__steps li { border-left: 0; border-top: 1px solid var(--line); } .ob__steps li:first-child { border-top: 0; } .ob__byte { grid-template-columns: 64px 1fr; } .ob__bot { width: 64px; } }

/* ===== Guided tour (assets/js/portal-ux.js) ===== */
.pt-tour { position: fixed; inset: 0; z-index: 100005; }
.pt-tour__spot { position: fixed; box-shadow: 0 0 0 9999px rgba(19, 42, 79, .55); border: 2px solid #8DB2F2; transition: all .3s var(--ease); pointer-events: none; }
.pt-tour__card { position: fixed; display: grid; grid-template-columns: 54px 1fr; gap: 12px; width: min(380px, calc(100vw - 24px)); padding: 16px; background: #fff; border: 1px solid var(--line); box-shadow: 0 18px 40px -16px rgba(19, 42, 79, .45); transition: top .3s var(--ease), left .3s var(--ease); }
.pt-tour__bot svg { width: 54px; height: auto; display: block; }
.pt-tour__card small { color: var(--blue); font-weight: 700; font-size: 12px; }
.pt-tour__card b { display: block; margin: 2px 0 4px; font: 600 18px/1.25 var(--font-h); color: var(--navy); }
.pt-tour__card p { margin: 0 0 12px; font-size: 14.5px; line-height: 1.5; color: var(--text); }
.pt-tour__btns { display: flex; align-items: center; gap: 10px; }
.pt-tour__btns .btn { margin-left: auto; min-height: 38px; padding: 0 16px; }
.pt-tour__skip, .pt-tour__back { padding: 0; border: 0; background: none; font: 600 13.5px var(--font-b); color: var(--muted); cursor: pointer; }

/* ===== Portal: full-screen app ===== */
/* signed in only: the sign-in page keeps the normal footer */
.logged-in.dkn-portal .site-footer, .logged-in.dkn-portal .footer-cta, .dkn-portal .buddy { display: none !important; }

.dkn-portal .pt-nav { position: sticky; top: calc(var(--header-h) + 16px); max-height: calc(100vh - var(--header-h) - 32px); overflow-y: auto; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@media (max-width: 640px) { .auth--inline .auth__row { flex-direction: row; } .auth--inline .auth__row .btn.auth__go { width: 52px; } }



/* =====================================================================================
   Portal app (signed in): fixed navy sidebar (logo, menu, Byte) · top bar · work area
   Square, ERP look. header.php prints the top bar; portal-shell.php the sidebar; portal-dash.php the blocks.
   ===================================================================================== */
.pt-appmode { --app-h: 60px; --side-w: 264px; background: #F2F4F8; }
.pt-appmode .progress, .pt-appmode .skip:not(:focus) { display: none; }

/* top bar */
.app-bar { position: fixed; top: 0; left: var(--side-w); right: 0; z-index: 60; display: flex; align-items: center; gap: 20px; height: var(--app-h); padding: 0 clamp(16px, 2.4vw, 32px); background: #132A4F; color: #D3DEF0; }
.app-bar__menu { display: none; }
.app-bar__info { display: flex; gap: 26px; margin: 0; padding: 0; list-style: none; font-size: 13.5px; }
.app-bar__info li, .app-bar__info a { display: inline-flex; align-items: center; gap: 8px; color: #D3DEF0; }
.app-bar__info .ico { width: 15px; height: 15px; color: #8DB2F2; }
.app-bar__right { display: flex; align-items: center; gap: 18px; margin-left: auto; }
.app-bar .lang-switch { margin: 0; }
.app-bar__presence { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; background: none; color: #D3DEF0; font: 600 13.5px var(--font-b); cursor: pointer; }
.app-bar__presence i { width: 9px; height: 9px; background: #8FA6C8; border-radius: 50% !important; }
.app-bar__presence.is-on i { background: #34C77B; box-shadow: 0 0 0 3px rgba(52, 199, 123, .2); }
.app-bar__bell { position: relative; display: grid; place-items: center; width: 36px; height: 36px; color: #fff; }
.app-bar__bell svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.app-bar__bell em { position: absolute; top: 2px; right: 0; min-width: 17px; height: 17px; padding: 0 4px; background: #E5484D; color: #fff; font: 700 11px/17px var(--font-b); font-style: normal; text-align: center; }
.app-bar__me { position: relative; }
.app-bar__me summary { display: flex; align-items: center; gap: 8px; list-style: none; color: #fff; font-weight: 600; font-size: 14px; cursor: pointer; }
.app-bar__me summary::-webkit-details-marker { display: none; }
.app-bar__me summary img { width: 30px; height: 30px; }
.app-bar__me summary svg { width: 16px; height: 16px; fill: none; stroke: #D3DEF0; stroke-width: 2; }
.app-bar__menu-list { position: absolute; right: 0; top: calc(100% + 12px); min-width: 200px; display: grid; background: #fff; border: 1px solid var(--line); box-shadow: 0 16px 36px -14px rgba(14, 33, 64, .35); }
.app-bar__menu-list a { padding: 11px 16px; color: var(--navy); font-weight: 600; font-size: 14px; border-bottom: 1px solid var(--hairline); }
.app-bar__menu-list a:hover { background: #F2F4F8; color: var(--blue); }

/* page frame */
.pt-appmode .pt { min-height: 100vh; padding: var(--app-h) 0 0 var(--side-w); overflow: visible; background: transparent; }
.pt-appmode .pt > .hero__bg { display: none; }
.pt-appmode .pt__wrap, .pt-appmode .pt__wrap:has(.pt-app) { width: 100%; max-width: none; margin: 0; padding: 0; }
.pt-appmode .pt-app { display: block; }
.pt-appmode .pt-app__main { min-width: 0; padding: 32px clamp(20px, 3vw, 44px) 64px; }

/* sidebar */
.pt-appmode .pt-nav { position: fixed; left: 0; top: 0; bottom: 0; z-index: 61; display: flex; flex-direction: column; width: var(--side-w); height: auto; max-height: none; margin: 0; padding: 0 14px 18px; overflow-y: auto; background: #0E2140; border: 0; box-shadow: none; color: #D3DEF0; }
.pt-nav__logo { display: flex; align-items: center; height: 84px; padding: 0 10px; }
.pt-nav__logo svg { width: 170px; height: auto; }
.pt-appmode .pt-nav__links { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 4px; }
.pt-appmode .pt-nav__links a { display: flex; align-items: center; gap: 12px; padding: 12px 14px; color: #D3DEF0; font-weight: 600; font-size: 15px; background: transparent; border: 0; }
.pt-appmode .pt-nav__links a .ico { width: 19px; height: 19px; color: #8FA6C8; flex: none; }
.pt-appmode .pt-nav__links a span { flex: 1; }
.pt-appmode .pt-nav__links a em { min-width: 22px; height: 22px; padding: 0 6px; background: #E5484D; color: #fff; font: 700 12px/22px var(--font-b); font-style: normal; text-align: center; }
.pt-appmode .pt-nav__links a:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.pt-appmode .pt-nav__links a.is-on { background: #1E4FB0; color: #fff; }
.pt-appmode .pt-nav__links a.is-on .ico { color: #fff; }
.pt-appmode .pt-nav__foot { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 12px; padding: 12px 8px 0; font-size: 13px; }
.pt-appmode .pt-nav__foot a { color: #8FA6C8; }

/* Byte help card */
.pt-appmode .pt-byte { margin-top: auto; display: grid; grid-template-columns: 48px 1fr; gap: 10px; align-items: center; padding: 16px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(211, 222, 240, .16); }
.pt-appmode .pt-byte__bot { grid-row: auto; }
.pt-appmode .pt-byte__bot svg { width: 48px; height: auto; display: block; animation: ldr-bob 2.6s ease-in-out infinite; }
.pt-appmode .pt-byte p { margin: 0; color: #D3DEF0; font-size: 13px; line-height: 1.45; }
.pt-appmode .pt-byte p b { display: block; color: #fff; font-size: 15px; margin-bottom: 2px; }
.pt-appmode .pt-byte__go { grid-column: 1 / -1; padding: 10px 12px; border: 1px solid rgba(211, 222, 240, .35); background: transparent; color: #fff; font: 700 13.5px var(--font-b); text-align: center; cursor: pointer; }
.pt-appmode .pt-byte__go:first-of-type { background: #fff; border-color: #fff; color: #0E2140; }
.pt-appmode .pt-byte__go:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.pt-appmode .pt-byte__go:first-of-type:hover { background: #D3DEF0; color: #0E2140; }

/* dashboard head */
.dash-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 520px); gap: 24px; align-items: stretch; margin-bottom: 24px; }
.dash-head__hi p { margin: 0; color: var(--muted); font-size: 16px; }
.dash-head__hi h1 { margin: 2px 0 8px; font: 700 clamp(34px, 3.6vw, 52px)/1.05 var(--font-h); color: var(--navy); }
.dash-head__sub { font-size: 15.5px !important; }
.dash-cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px 28px; color: #fff; background:
	linear-gradient(120deg, #132A4F 0%, #1E4FB0 100%); position: relative; overflow: hidden; }
.dash-cta::after { content: ""; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; background: rgba(255, 255, 255, .07); transform: rotate(18deg); }
.dash-cta > div { position: relative; z-index: 1; display: grid; gap: 6px; }
.dash-cta b { font: 600 22px/1.2 var(--font-h); }
.dash-cta span { color: #D3DEF0; font-size: 14.5px; line-height: 1.5; }
.dash-cta__btn { position: relative; z-index: 1; flex: none; background: #fff; color: var(--blue); border-color: #fff; font-weight: 700; }
.dash-cta__btn:hover { background: #EEF3FE; color: var(--blue-dark); }

/* stat cards */
.dash-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; }
.dash-kpi { position: relative; display: grid; grid-template-columns: 52px 1fr auto; align-items: center; gap: 14px; padding: 20px; background: #fff; border: 1px solid var(--line); overflow: hidden; color: var(--navy); }
.dash-kpi::after { content: ""; position: absolute; right: -30px; bottom: -40px; width: 160px; height: 90px; transform: rotate(-14deg); opacity: .5; }
.dash-kpi:hover { border-color: var(--line-strong); }
.dash-kpi__ic { display: grid; place-items: center; width: 52px; height: 52px; }
.dash-kpi__ic .ico { width: 24px; height: 24px; }
.dash-kpi__txt small { display: block; color: var(--muted); font-size: 14px; }
.dash-kpi__txt b { font: 700 30px/1.15 var(--font-h); font-variant-numeric: tabular-nums; }
.dash-kpi__go { position: relative; z-index: 1; display: grid; place-items: center; width: 32px; height: 32px; background: #fff; border: 1px solid var(--line); }
.dash-kpi__go .ico { width: 15px; height: 15px; }
.dash-kpi--blue .dash-kpi__ic { background: #EEF3FE; color: #1E4FB0; } .dash-kpi--blue::after { background: #DCE7FB; }
.dash-kpi--amber .dash-kpi__ic { background: #FFF3E0; color: #B26A00; } .dash-kpi--amber::after { background: #FFE9C7; }
.dash-kpi--green .dash-kpi__ic { background: #E8F6EE; color: #12805C; } .dash-kpi--green::after { background: #D3EFDF; }
.dash-kpi--red .dash-kpi__ic { background: #FDECEC; color: #C62828; } .dash-kpi--red::after { background: #FAD9D9; }

/* two columns */
.dash-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 20px; align-items: start; }
.dash-main { display: grid; gap: 20px; min-width: 0; }
.dash-side { display: grid; gap: 20px; }
.dash-card, .pt-appmode .st-section.dash-card { margin: 0; padding: 22px; background: #fff; border: 1px solid var(--line); }
.dash-card__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.dash-card__head h2, .pt-appmode .dash-card .pt-h { margin: 0; font: 600 21px/1.2 var(--font-h); color: var(--navy); }
.dash-card__head a { color: var(--blue); font-weight: 700; font-size: 14px; }
.pt-appmode .dash-card .pt-h { margin-bottom: 14px; }
.dash-empty { margin: 0; color: var(--muted); font-size: 14.5px; }

/* tabs with counts */
.dash-tabs, .pt-appmode .dash-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; padding: 0; border: 0; background: none; }
.dash-tabs button, .pt-appmode .dash-tabs button { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 0; background: transparent; color: var(--muted); font: 600 14px var(--font-b); cursor: pointer; box-shadow: none; }
.dash-tabs button em { min-width: 20px; padding: 1px 6px; background: #EEF1F5; color: var(--muted); font-style: normal; font-size: 12px; }
.dash-tabs button:hover { color: var(--navy); }
.dash-tabs button.is-on, .pt-appmode .dash-tabs button.is-on { background: #EEF3FE; color: var(--blue); box-shadow: none; }
.dash-tabs button.is-on em { background: #D5E2FB; color: var(--blue); }

/* project rows */
.dash-rows { display: grid; gap: 10px; }
.dash-row { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto auto auto; align-items: center; gap: 18px; padding: 12px 16px 12px 12px; border: 1px solid var(--line); background: #fff; color: var(--text); }
.dash-row[hidden] { display: none; }
.dash-row:hover { border-color: #B3CBF5; background: #FAFCFF; }
.dash-row__thumb { display: grid; place-items: center; width: 96px; height: 64px; overflow: hidden; background: linear-gradient(135deg, #132A4F, #1E4FB0); color: #fff; }
.dash-row__thumb img { width: 100%; height: 100%; object-fit: cover; }
.dash-row__thumb .ico { width: 26px; height: 26px; opacity: .9; }
.dash-row__main b { display: block; font: 600 17px/1.3 var(--font-h); color: var(--navy); }
.dash-row__main small { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 4px; color: var(--muted); font-size: 13px; }
.dash-row__state { display: grid; justify-items: end; gap: 6px; min-width: 150px; grid-template-columns: 1fr auto; align-items: center; }
.dash-row__state .dash-badge { grid-column: 1 / -1; }
.dash-row__state em { font-style: normal; font-size: 12.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.dash-prog { width: 110px; height: 5px; background: #E4E8EF; }
.dash-prog i { display: block; height: 100%; background: var(--blue); }
.dash-row__new { min-width: 22px; height: 22px; padding: 0 6px; background: #E5484D; color: #fff; font: 700 12px/22px var(--font-b); text-align: center; }
.dash-row__go { color: var(--blue); }
.dash-row__go .ico { width: 20px; height: 20px; }
.dash-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.dash-badge::before { content: ""; width: 7px; height: 7px; background: currentColor; }
.dash-badge--request { background: #FFF3E0; color: #B26A00; }
.dash-badge--design, .dash-badge--build { background: #EEF3FE; color: #1E4FB0; }
.dash-badge--review { background: #F3EEFD; color: #6B3FC4; }
.dash-badge--live { background: #E8F6EE; color: #12805C; }
.dash-badge--paused { background: #EEF1F5; color: #5D6063; }

/* recent messages */
.dash-msgs { list-style: none; margin: 0; padding: 0; }
.dash-msgs li + li { border-top: 1px solid var(--hairline); }
.dash-msgs a { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; padding: 12px 0; color: var(--text); position: relative; }
.dash-av { grid-row: span 2; display: grid; place-items: center; width: 40px; height: 40px; background: #EEF1F5; color: var(--navy); font-weight: 700; }
.dash-av--team { background: #1E4FB0; color: #fff; }
.dash-msgs__txt { min-width: 0; }
.dash-msgs__txt b { display: block; color: var(--navy); font-size: 14.5px; }
.dash-msgs__txt span { display: block; color: var(--muted); font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-msgs small { align-self: start; color: var(--muted); font-size: 12px; white-space: nowrap; }
.dash-dot { position: absolute; right: 0; bottom: 18px; width: 8px; height: 8px; background: var(--blue); border-radius: 50% !important; }

/* recent files */
.dash-files { list-style: none; margin: 0; padding: 0; }
.dash-files li { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 0; }
.dash-files li + li { border-top: 1px solid var(--hairline); }
.dash-file__ext { display: grid; place-items: center; width: 40px; height: 40px; font: 800 10px var(--font-b); color: #fff; background: #5D6063; }
.dash-file__ext--pdf { background: #D93025; } .dash-file__ext--img { background: #1E4FB0; } .dash-file__ext--doc { background: #B26A00; }
.dash-file__txt { min-width: 0; }
.dash-file__txt b { display: block; color: var(--navy); font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-file__txt small { color: var(--muted); font-size: 12.5px; }
.dash-file__dl { display: grid; place-items: center; width: 34px; height: 34px; color: var(--blue); }
.dash-file__dl svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.dash-file__dl:hover { background: #EEF3FE; }
.pt-appmode .dash-side .pt-refcard { margin: 0; }

/* other screens inside the app: cards square and white */
.pt-appmode .pt-card { background: #fff; border: 1px solid var(--line); box-shadow: none; }

@media (max-width: 1280px) {
	.dash-grid { grid-template-columns: 1fr; }
	.dash-kpis { grid-template-columns: 1fr 1fr; }
	.app-bar__info li:nth-child(3) { display: none; }
}
@media (max-width: 960px) {
	.pt-appmode { --side-w: 280px; }
	.app-bar { left: 0; padding-left: 0; gap: 10px; }
	.app-bar__menu { display: grid; place-content: center; gap: 5px; width: var(--app-h); height: var(--app-h); border: 0; background: transparent; cursor: pointer; }
	.app-bar__menu span { display: block; width: 20px; height: 2px; background: #fff; }
	.app-bar__info { display: none; }
	.app-bar__me summary b { display: none; }
	.pt-appmode .pt { padding-left: 0; }
	.pt-appmode .pt-nav { transform: translateX(-100%); transition: transform .25s var(--ease); z-index: 70; }
	.pt-appmode.pt-nav-open .pt-nav { transform: none; box-shadow: 20px 0 40px rgba(14, 33, 64, .35); }
	.dash-head { grid-template-columns: 1fr; }
	.dash-row { grid-template-columns: 64px minmax(0, 1fr) auto; }
	.dash-row__thumb { width: 64px; height: 48px; }
	.dash-row__state { grid-column: 2 / -1; justify-items: start; min-width: 0; }
	.dash-row__go { display: none; }
}
@media (max-width: 560px) { .dash-kpis { grid-template-columns: 1fr; } .dash-cta { flex-direction: column; align-items: flex-start; } }
/* portal app: floating helpers go bottom-right so they don't cover the sidebar */
.pt-appmode .a11y { left: auto; right: 18px; }
.pt-appmode .a11y__panel { left: auto; right: 0; }
.pt-appmode .cky-btn-revisit-wrapper, .pt-appmode .cli_settings_button.cli-plugin-button-revisit, .pt-appmode #cookie-law-info-again { left: auto !important; right: 80px !important; }

/* ----- Portal app, ERP finish: logo box level with the top bar, ruler + blueprint lines, even spacing ----- */
.pt-appmode .pt { padding: var(--app-h) 0 0 var(--side-w); }
.pt-appmode .pt-app__main { padding: 36px clamp(24px, 3vw, 44px) 72px; background:
	linear-gradient(rgba(19, 42, 79, .045) 1px, transparent 1px) 0 0 / 24px 24px,
	linear-gradient(90deg, rgba(19, 42, 79, .045) 1px, transparent 1px) 0 0 / 24px 24px; min-height: calc(100vh - var(--app-h)); }
.app-bar { border-bottom: 1px solid rgba(211, 222, 240, .12); }

/* logo box: same height as the top bar, hairline under it (ERP Console header) */
.pt-nav__logo { flex: none; height: var(--app-h); margin: 0 -14px 14px; padding: 0 20px; background: #0B1B35; border-bottom: 1px solid rgba(211, 222, 240, .12); }
.pt-nav__logo svg { width: auto; height: 30px; max-width: 100%; }
.pt-appmode .pt-nav { padding-top: 0; border-right: 1px solid rgba(211, 222, 240, .1); }

/* menu: ERP active state (tint + accent rule on the left), hairline between groups */
.pt-appmode .pt-nav__links a { border-left: 3px solid transparent; padding-left: 13px; }
.pt-appmode .pt-nav__links a.is-on { background: rgba(89, 128, 166, .3); border-left-color: #8DB2F2; color: #fff; }
.pt-appmode .pt-nav__links + .pt-byte { margin-top: auto; }

/* ruler under the greeting */
.dash-head { position: relative; padding-bottom: 26px; margin-bottom: 30px; }
.dash-head::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 9px; border-top: 1px solid var(--line-strong); background:
	repeating-linear-gradient(90deg, var(--line-strong) 0 1px, transparent 1px 12px) top left / 100% 5px no-repeat,
	repeating-linear-gradient(90deg, var(--navy) 0 1px, transparent 1px 120px) top left / 100% 9px no-repeat; opacity: .7; }
.dash-head__hi { align-self: center; }

/* blueprint corners on cards; no decorative shapes */
.dash-kpi { overflow: visible; }
.dash-kpi::after { content: none; }
.dash-kpi, .dash-card, .pt-appmode .st-section.dash-card, .dash-cta { position: relative; }
.dash-kpi::before, .dash-card::before, .dash-cta::before { content: ""; position: absolute; inset: -6px; pointer-events: none; z-index: 2; --m: rgba(29, 31, 32, .5);
	background:
		linear-gradient(var(--m), var(--m)) 5px 0 / 1px 11px no-repeat, linear-gradient(var(--m), var(--m)) 0 5px / 11px 1px no-repeat,
		linear-gradient(var(--m), var(--m)) calc(100% - 5px) 0 / 1px 11px no-repeat, linear-gradient(var(--m), var(--m)) 100% 5px / 11px 1px no-repeat,
		linear-gradient(var(--m), var(--m)) 5px 100% / 1px 11px no-repeat, linear-gradient(var(--m), var(--m)) 0 calc(100% - 5px) / 11px 1px no-repeat,
		linear-gradient(var(--m), var(--m)) calc(100% - 5px) 100% / 1px 11px no-repeat, linear-gradient(var(--m), var(--m)) 100% calc(100% - 5px) / 11px 1px no-repeat; }
.dash-cta { overflow: visible; }
.dash-cta::after { content: none; }
.dash-cta { background: #132A4F; border-left: 4px solid #8DB2F2; }
.dash-kpi__ic { border: 1px solid currentColor; border-color: color-mix(in srgb, currentColor 25%, transparent); }

/* card heads: title, then a hairline with a short accent tick */
.dash-card__head, .pt-appmode .dash-card > .pt-h, .pt-appmode .dash-card > .st-section__head { position: relative; padding-bottom: 12px; margin-bottom: 16px; border-bottom: 1px solid var(--line); }
.dash-card__head::after, .pt-appmode .dash-card > .pt-h::after, .pt-appmode .dash-card > .st-section__head::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 32px; height: 3px; background: var(--blue); }
.pt-appmode .dash-card > .st-section__head .pt-h { margin: 0; }
.dash-card { padding: 24px; }
.dash-kpis { gap: 20px; margin-bottom: 30px; }
.dash-grid, .dash-main, .dash-side { gap: 24px; }

@media (max-width: 960px) {
	.pt-appmode .pt { padding-left: 0; }
	.pt-nav__logo { margin-top: 0; }
	.pt-appmode .pt-nav { top: var(--app-h); }
	.pt-appmode .pt-nav .pt-nav__logo { display: none; }
}

/* Recent messages: 3 visible, the rest behind a fade (portal-dash.php, portal-ux.js) */
.dash-more { position: relative; }
.dash-more.is-clamped .dash-msgs li:nth-child(n+4) { display: none; }
.dash-more.is-clamped::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 56px; background: linear-gradient(rgba(255, 255, 255, 0), #fff 85%); pointer-events: none; }
.dash-more__btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin-top: 4px; padding: 11px; border: 1px solid var(--line); background: #fff; color: var(--blue); font: 700 14px var(--font-b); cursor: pointer; }
.dash-more__btn::after { content: "↓"; }
.dash-more__btn[aria-expanded="true"]::after { content: "↑"; }
.dash-more__btn:hover { border-color: var(--blue); background: #F7F9FD; }

/* Portal menu list never stretches; phone drawer: logo in the bar, compact items, dimmed backdrop */
.pt-appmode .pt-nav__links { flex: none; align-content: start; }
.app-bar__logo { display: none; }
.app-bar__menu:focus:not(:focus-visible) { outline: none; }
@media (max-width: 960px) {
	.app-bar__menu { width: 52px; height: var(--app-h); gap: 4px; border-right: 1px solid rgba(211, 222, 240, .12); }
	.app-bar__menu span { width: 20px; transition: transform .2s, opacity .2s; }
	.pt-nav-open .app-bar__menu span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
	.pt-nav-open .app-bar__menu span:nth-child(2) { opacity: 0; }
	.pt-nav-open .app-bar__menu span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
	.app-bar__logo { display: flex; align-items: center; height: var(--app-h); padding: 0 6px; }
	.app-bar__logo svg { height: 22px; width: auto; }
	.pt-appmode .pt-nav { width: min(300px, 86vw); padding: 12px 12px 16px; }
	.pt-appmode .pt-nav__links { gap: 2px; margin: 0; }
	.pt-appmode .pt-nav__links a { padding: 12px 12px 12px 11px; font-size: 15px; }
	.pt-appmode .pt-byte { margin-top: 18px; }
	.pt-appmode.pt-nav-open::after { content: ""; position: fixed; inset: var(--app-h) 0 0 0; z-index: 65; background: rgba(14, 33, 64, .45); }
}
@media (max-width: 420px) { .app-bar .lang-switch > * { padding: 6px 5px; } .app-bar__presence span { display: none; } }
/* phones: the open menu fills the screen under the app bar */
.pt-appmode .pt-nav { align-items: stretch; }
@media (max-width: 960px) {
	.pt-appmode .pt-nav { left: 0; right: 0; width: 100vw; bottom: 0; padding: 16px 20px 24px; border-right: 0; }
	.pt-appmode.pt-nav-open .pt-nav { box-shadow: none; }
	.pt-appmode.pt-nav-open::after { content: none; }
	.pt-appmode.pt-nav-open { overflow: hidden; }
	.pt-appmode .pt-nav__links a { padding: 15px 14px 15px 13px; font-size: 17px; }
	.pt-appmode .pt-byte { margin-top: auto; }
}
.pt-nav-open .a11y, .pt-nav-open .cky-btn-revisit-wrapper, .pt-nav-open #cookie-law-info-again, .pt-nav-open .cli_settings_button { display: none !important; }
/* bell with nothing new: no link, a small note on hover / focus / tap */
.app-bar__bell.is-quiet { cursor: default; color: #8FA6C8; outline: none; }
.app-bar__tip { position: absolute; top: calc(100% + 10px); right: -8px; z-index: 5; padding: 8px 12px; background: #fff; border: 1px solid var(--line); box-shadow: 0 12px 28px -12px rgba(14, 33, 64, .4); color: var(--navy); font: 600 13px/1.3 var(--font-b); white-space: nowrap; opacity: 0; transform: translateY(-4px); pointer-events: none; transition: opacity .15s, transform .15s; }
.app-bar__tip::before { content: ""; position: absolute; top: -6px; right: 20px; width: 10px; height: 10px; background: #fff; border-left: 1px solid var(--line); border-top: 1px solid var(--line); transform: rotate(45deg); }
.app-bar__bell.is-quiet:hover .app-bar__tip, .app-bar__bell.is-quiet:focus .app-bar__tip { opacity: 1; transform: none; }

/* Onboarding: big plain-language choices (icon, what it means, a short hint) */
.ob__kinds--big { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ob__kinds--big legend { grid-column: 1 / -1; font-size: 15px; }
.ob__kinds--big span { display: grid; grid-template-columns: 26px 1fr; gap: 2px 12px; align-items: center; padding: 16px; height: 100%; font-size: 15.5px; }
.ob__kinds--big span svg { grid-row: span 2; width: 22px; height: 22px; }
.ob__kinds--big b { color: var(--navy); font-size: 15.5px; }
.ob__kinds--big small { color: var(--muted); font-weight: 500; font-size: 13px; }
.ob__kinds--big input:checked + span { box-shadow: inset 0 -3px 0 var(--blue), 0 0 0 1px var(--blue); }
.ob__next { margin: 0; color: var(--muted); font-size: 14px; }
@media (max-width: 640px) { .ob__kinds--big { grid-template-columns: 1fr; } }

/* Description editor: guiding questions + «already have a document?» */
.pt-desc__help { display: grid; gap: 4px; margin-bottom: 12px; padding: 14px 16px; background: #EEF3FE; border-left: 3px solid var(--blue); font-size: 14.5px; color: var(--text); }
.pt-desc__help b { color: var(--navy); font-size: 15.5px; }
.pt-desc__help ul { margin: 4px 0 0; padding-left: 18px; display: grid; gap: 2px; }
.pt-desc__doc { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 14px 0 4px; padding: 14px 16px 16px; border: 1px dashed var(--line-strong); }
.pt-desc__doc legend { padding: 0 6px; font-weight: 700; font-size: 14px; color: var(--navy); }
.pt-desc__doc legend small { font-weight: 500; color: var(--muted); }
.pt-desc__doc label { display: grid; gap: 6px; font-size: 13.5px; font-weight: 600; color: var(--navy); }
.pt-desc__doc label > span { display: inline-flex; align-items: center; gap: 6px; }
.pt-desc__doc .ico { width: 16px; height: 16px; color: var(--blue); }
.pt-desc__doc input[type=url] { min-height: 42px; padding: 0 12px; border: 1px solid var(--line-strong); font: 400 14.5px var(--font-b); }
.pt-desc__doc input[type=file] { font-size: 13.5px; }
@media (max-width: 640px) { .pt-desc__doc { grid-template-columns: 1fr; } }

/* «Έγγραφο / Scope» card, top of the project's right column */
.pt-scope { border-top: 3px solid var(--blue) !important; }
.pt-scope .pt-h { display: flex; align-items: center; gap: 8px; }
.pt-scope .pt-h .ico { width: 18px; height: 18px; color: var(--blue); }
.pt-scope:not(.has-doc) { background: #F7F9FD !important; border-style: dashed !important; }
.pt-scope__empty { margin: 0 0 12px; color: var(--muted); font-size: 14px; }
.pt-scope__list { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; }
.pt-scope__list a { display: grid; grid-template-columns: 38px 1fr; gap: 0 10px; align-items: center; padding: 8px; border: 1px solid var(--line); color: var(--navy); }
.pt-scope__list a:hover { border-color: var(--blue); background: #F7F9FD; }
.pt-scope__ic { grid-row: span 2; display: grid; place-items: center; width: 38px; height: 38px; background: var(--blue); color: #fff; font: 800 11px var(--font-b); }
.pt-scope__list b { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pt-scope__list small { color: var(--muted); font-size: 12.5px; }
.pt-scope__add { width: 100%; padding: 10px; border: 1px solid var(--blue); background: #fff; color: var(--blue); font: 700 14px var(--font-b); cursor: pointer; }
.pt-scope__add:hover { background: #EEF3FE; }

/* Portal pages «Αρχεία» / «Τιμολόγηση» (inc/platform/portal-views.php) */
.pv-head { position: relative; margin-bottom: 28px; padding-bottom: 22px; }
.pv-head::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 9px; border-top: 1px solid var(--line-strong); background: repeating-linear-gradient(90deg, var(--line-strong) 0 1px, transparent 1px 12px) top left / 100% 5px no-repeat, repeating-linear-gradient(90deg, var(--navy) 0 1px, transparent 1px 120px) top left / 100% 9px no-repeat; opacity: .7; }
.pv-head .eyebrow { margin: 0 0 4px; }
.pv-head h1 { margin: 0; font: 700 clamp(28px, 2.8vw, 40px)/1.1 var(--font-h); color: var(--navy); }
.pv-head p:last-child { margin: 8px 0 0; color: var(--muted); }
.pv-count { margin-left: 6px; padding: 2px 8px; background: #EEF1F5; color: var(--muted); font: 700 13px var(--font-b); }
.pv-table-wrap { overflow-x: auto; }
.pv-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.pv-table th { padding: 10px 12px; text-align: left; font-size: 12.5px; font-weight: 700; color: var(--muted); border-bottom: 1px solid var(--line-strong); white-space: nowrap; }
.pv-table td { padding: 10px 12px; border-bottom: 1px solid var(--hairline); vertical-align: middle; }
.pv-table tr[hidden] { display: none; }
.pv-table tbody tr:hover { background: #FAFCFF; }
.pv-table a { color: var(--navy); font-weight: 600; }
.pv-table a:hover { color: var(--blue); }
.pv-file a { display: block; max-width: 320px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-file small { color: var(--muted); font-size: 12px; }
.pv-num { font-variant-numeric: tabular-nums; white-space: nowrap; }
td.pv-num:last-child, th.pv-num { text-align: right; }
.pv-who { display: inline-block; padding: 3px 8px; background: #EEF1F5; color: var(--muted); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.pv-who.is-team { background: #EEF3FE; color: var(--blue); }
.pv-upload { display: grid; gap: 12px; }
.pv-upload label, .pv-billform label:not(.pt-check) { display: grid; gap: 6px; font-weight: 700; font-size: 13.5px; color: var(--navy); }
.pv-upload select, .pv-billform input[type=text] { min-height: 44px; padding: 0 12px; border: 1px solid var(--line-strong); background: #fff; font: 400 15px var(--font-b); color: var(--text); }
.pv-ask { margin-bottom: 24px; border-left: 4px solid #B26A00 !important; background: #FFFBF3 !important; }
.pv-ask p { margin: 0 0 14px; color: var(--text); }
.pv-billform { display: grid; gap: 14px; }
.pv-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pv-billform .btn { justify-self: start; }
.pv-dl { margin: 0; display: grid; gap: 10px; }
.pv-dl div { display: grid; grid-template-columns: 96px 1fr; gap: 10px; font-size: 14px; }
.pv-dl dt { color: var(--muted); }
.pv-dl dd { margin: 0; color: var(--navy); font-weight: 600; }
.pv-none { margin: 0; color: var(--text); }
@media (max-width: 640px) { .pv-row { grid-template-columns: 1fr; } }
/* sidebar: a dot instead of a number when a project has news */
.pt-nav__dot { flex: none; width: 9px; height: 9px; background: #E5484D; border-radius: 50% !important; box-shadow: 0 0 0 3px rgba(229, 72, 77, .25); }

/* Studio: client card on a project (clean ERP-style rows) */
.pt-appmode .st-who { padding: 20px; }
.st-who__top { display: grid; grid-template-columns: 48px 1fr auto; gap: 12px; align-items: center; padding-bottom: 14px; margin-bottom: 4px; border-bottom: 1px solid var(--line); }
.st-who__top img { width: 48px; height: 48px; }
.st-who__top b { display: block; font: 600 19px/1.2 var(--font-h); color: var(--navy); }
.st-who__top small { color: var(--muted); font-size: 13.5px; }
.st-who__all { align-self: start; color: var(--blue); font-weight: 700; font-size: 13px; white-space: nowrap; }
.st-who__dl { margin: 0; }
.st-who__dl > div { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 10px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--hairline); }
.st-who__dl > div:last-child { border-bottom: 0; padding-bottom: 0; }
.st-who__dl dt { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 13px; font-weight: 600; }
.st-who__dl dt .ico { width: 16px; height: 16px; color: var(--blue); }
.st-who__dl dd { margin: 0; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; font-size: 14.5px; color: var(--text); }
.st-who__dl dd a { color: var(--navy); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.st-who__dl dd a:hover { color: var(--blue); }
.st-who__tag { padding: 3px 8px; background: #EEF1F5; color: var(--muted); font-size: 12.5px; font-weight: 700; }
.st-who__tag.is-ok { background: #E8F6EE; color: #12805C; }
.st-who__tag.is-miss { background: #FFF3E0; color: #B26A00; }
.st-who__sub { width: 100%; color: var(--muted); font-size: 13px; }
.st-who__ask { padding: 3px 10px; border: 1px solid var(--blue); background: #fff; color: var(--blue); font: 700 12.5px var(--font-b); cursor: pointer; }
.st-who__ask:hover { background: #EEF3FE; }
.st-who__none { color: var(--muted); }
/* Studio «Πελάτες» table */
.pv-client { display: grid; grid-template-columns: 36px 1fr; gap: 10px; align-items: center; }
.pv-client img { width: 36px; height: 36px; }
.pv-client b { display: block; color: var(--navy); }
.pv-client small, .pv-sub { display: block; color: var(--muted); font-size: 12.5px; }
.pv-table td.is-due { color: #C62828; font-weight: 700; }
.pv-go { color: var(--blue) !important; font-weight: 700; white-space: nowrap; }

/* Free-design form when signed in: a greeting and the way into the portal */
.fdf__hi { display: grid; align-content: center; gap: 12px; padding: clamp(24px, 3vw, 40px); }
.fdf__hi-k { display: flex; align-items: center; gap: 10px; margin: 0; color: var(--muted); font-size: 14px; }
.fdf__hi-k img { width: 40px; height: 40px; }
.fdf__hi-k b { color: var(--navy); }
.fdf__hi h3 { margin: 6px 0 0; font: 700 clamp(28px, 3vw, 40px)/1.1 var(--font-h); color: var(--navy); }
.fdf__hi > p:not(.fdf__hi-k) { margin: 0; max-width: 520px; color: var(--text); font-size: 16.5px; line-height: 1.6; }
.fdf__hi-btns { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 8px; }
.fdf__hi-alt { color: var(--blue); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }