/* ═══════════════════════════════════════════════════════════════════════ INTRANET THEME — Modern SaaS look (Linear/Stripe light) Κοινό εικαστικό layer για όλες τις σελίδες. Override-only & συντηρητικό: fonts, χρώματα, radius, σκιές, focus rings — ΚΑΜΙΑ αλλαγή layout/display. Φορτώνεται ΤΕΛΕΥΤΑΙΟ στο ώστε να νικά τα inline styles σε ισοπαλία. (Τα pricing.html / itemorg.html έχουν δικό τους ενσωματωμένο layer.) ═══════════════════════════════════════════════════════════════════════ */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap'); :root { --accent: #7366ff; --accent-600: #5b4ee6; --accent-50: #f2f0ff; --ink: #1b1f2a; --ink-2: #5a6478; --ink-3: #8b93a4; --line: #e9ebf1; --line-2: #f0f2f6; --surface: #ffffff; --canvas: #f6f7fb; --ok: #16a34a; --ok-bg: #eafaf0; --bad: #e5484d; --bad-bg: #fdecec; --amber: #f59e0b; --amber-bg: #fef4e2; --sh-sm: 0 1px 2px rgba(20,28,48,.06); --sh-md: 0 6px 20px rgba(20,28,48,.08); --sh-lg: 0 16px 40px rgba(20,28,48,.14); --gray-bg: var(--canvas); } body { background: var(--canvas); font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; color: var(--ink); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; letter-spacing: -.01em; } ::selection { background: rgba(115,102,255,.22); } /* ── Sticky headers (topbar / intra-header / hdr) — glassy ─────────────── */ .topbar, .intra-header, .hdr { background: rgba(255,255,255,.88); -webkit-backdrop-filter: saturate(180%) blur(12px); backdrop-filter: saturate(180%) blur(12px); border-bottom: 1px solid var(--line); box-shadow: none; } .brand-name { font-weight: 800; letter-spacing: -.02em; } .user-pill { background: var(--accent-50); color: var(--accent-600); font-weight: 600; border: 1px solid #e6e2ff; } /* ── Επιφάνειες / κάρτες ───────────────────────────────────────────────── */ .section, .card, .unit-card, .kpi-card, .item-card, .prod-card, .p-section { border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--sh-sm); background: var(--surface); } .app-card { border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--sh-sm); transition: transform .16s cubic-bezier(.2,.7,.3,1), box-shadow .16s, border-color .16s; } .app-card:hover { transform: translateY(-3px); box-shadow: var(--sh-md); border-color: #d7dbe8; } /* ── Κουμπιά ───────────────────────────────────────────────────────────── */ button { font-family: inherit; } .btn, .btn-clear, .btn-ghost, .btn-go, .btn-cfg, .btn-bulk-action, .sup-btn, .p-btn, .btn-primary-sm { border-radius: 10px; font-weight: 600; transition: box-shadow .14s, transform .12s, border-color .14s, background .14s; } .btn:hover, .btn-clear:hover, .btn-ghost:hover, .btn-cfg:hover { box-shadow: var(--sh-sm); } .btn-primary, .btn-go, .btn-primary-sm, button.save { background-image: linear-gradient(180deg, #7d71ff, #6a5cf0) !important; border-color: transparent !important; box-shadow: 0 2px 8px rgba(106,92,240,.32); color: #fff; } .btn-primary:hover, .btn-go:hover, .btn-primary-sm:hover { background-image: linear-gradient(180deg, #8a7fff, #5f51ec) !important; } /* ── Inputs / selects — μαλακά, με accent focus ring ───────────────────── */ input[type="text"], input[type="number"], input[type="search"], input[type="password"], input[type="date"], input[type="tel"], input[type="email"], input[type="time"], select, textarea { border: 1px solid var(--line); border-radius: 10px; background-color: #fbfcfe; color: var(--ink); transition: border-color .15s, box-shadow .15s, background .15s; outline: none; } input[type="text"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="tel"]:focus, input[type="email"]:focus, input[type="time"]:focus, select:focus, textarea:focus { border-color: var(--accent); background-color: #fff; box-shadow: 0 0 0 3px rgba(115,102,255,.16); } input::placeholder, textarea::placeholder { color: var(--ink-3); } input[type="checkbox"], input[type="radio"] { accent-color: var(--accent); } /* ── Πίνακες ───────────────────────────────────────────────────────────── */ .tbl th, table thead th { background: #fafbfd; color: var(--ink-2); border-bottom: 1px solid var(--line); font-weight: 700; } .tbl td, table tbody td { border-bottom: 1px solid var(--line-2); } .tbl tr:hover td { background: var(--line-2); } /* ── Modals ────────────────────────────────────────────────────────────── */ .modal-card, .modal-box, .nfd { border-radius: 18px; box-shadow: var(--sh-lg); } .modal-card .mh, .modal-hdr { border-bottom: 1px solid var(--line); background: #fff; } .modal-card .ma, .modal-ftr { border-top: 1px solid var(--line); background: #fff; } /* ── Labels / hints ───────────────────────────────────────────────────── */ .fld label, .field label, .lbl, .flt-label { color: var(--ink-3); } .hint, .desc { color: var(--ink-2); } /* ── Scrollbar (WebKit) — διακριτικό ──────────────────────────────────── */ ::-webkit-scrollbar { width: 10px; height: 10px; } ::-webkit-scrollbar-track { background: transparent; } ::-webkit-scrollbar-thumb { background: #cdd3e1; border-radius: 8px; border: 2px solid var(--canvas); } ::-webkit-scrollbar-thumb:hover { background: #b4bccf; }