/* ============================================================
   Olympus UI — design system 2026
   Όλα τα tokens από /theme.css (OKLCH). Μόνο CSS + jQuery.
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; min-height: 100%; }
body {
  font-family: var(--font-family, 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif);
  font-size: var(--fs);
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { font-weight: 650; letter-spacing: -.015em; margin: 0 0 .6em; }
::selection { background: var(--primary-soft); }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 4px; }

/* ---------- Shell ---------- */
.oly-app { display: flex; min-height: 100vh; }
.oly-sidebar {
  width: 246px; flex-shrink: 0; background: var(--sb-bg); color: var(--sb-text);
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh;
  overflow: hidden; transition: width .18s ease; border-right: 1px solid var(--border);
}
.oly-app.sb-collapsed .oly-sidebar { width: 60px; }
.oly-app.sb-collapsed .oly-sidebar .txt, .oly-app.sb-collapsed .oly-brand .name, .oly-app.sb-collapsed .oly-side-foot { display: none; }
.oly-app.sb-collapsed .oly-nav { padding-left: 8px; padding-right: 8px; }
.oly-app.sb-collapsed .oly-nav .group { display: none; }
.oly-app.sb-collapsed .oly-nav a,
.oly-app.sb-collapsed .oly-nav .sub a {
  justify-content: center; gap: 0; padding-left: 0; padding-right: 0;
}
.oly-app.sb-collapsed .oly-nav a .ico { min-width: 0; width: 100%; }
.oly-brand {
  display: flex; align-items: center; gap: 10px; padding: 16px 16px 12px;
  font-size: 16px; font-weight: 700; color: inherit; letter-spacing: -.02em; white-space: nowrap;
  flex: 0 0 auto; background: var(--sb-bg); position: sticky; top: 0; z-index: 2;
}
.oly-brand .logo {
  width: 30px; height: 30px; min-width: 30px; border-radius: 9px; display: grid; place-items: center;
  background: linear-gradient(135deg, var(--primary), var(--accent)); color: #fff; font-weight: 800; font-size: 15px;
}
.oly-brand .logo .oly-ico svg { width: 18px; height: 18px; }
.oly-brand .logo--img { background: none; padding: 0; overflow: hidden; }
.oly-brand .logo--img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.oly-brand .logo--wordmark { width: 116px; height: 34px; min-width: 116px; border-radius: 0; overflow: visible; }
.oly-brand .logo--wordmark img { object-fit: contain; object-position: left center; }
.logo-bg--primary { background: var(--primary) !important; }
.logo-bg--surface { background: var(--surface) !important; }
.logo-bg--primary.logo--wordmark,
.logo-bg--surface.logo--wordmark { padding: 7px !important; border-radius: 6px; }
.oly-nav { flex: 1 1 auto; min-height: 0; padding: 4px 8px 16px; overflow-y: auto; overflow-x: hidden; }
.oly-nav .group { margin: 14px 10px 4px; font-size: 10.5px; text-transform: uppercase; letter-spacing: .12em; opacity: .5; white-space: nowrap; overflow: hidden; }
.oly-nav a {
  display: flex; align-items: center; gap: 10px; padding: 8px 11px; margin: 1px 0;
  border-radius: calc(var(--radius) * .7); color: inherit; font-weight: 500; min-width: 0;
  transition: background .12s, color .12s; position: relative;
}
.oly-nav a:hover { background: color-mix(in oklab, currentColor 9%, transparent); text-decoration: none; }
.oly-nav a.active { background: var(--sb-active); color: var(--sb-active-text); }
.oly-nav a .ico { width: 20px; min-width: 20px; text-align: center; }
.oly-nav a .txt { min-width: 0; overflow-wrap: anywhere; word-break: break-word; line-height: 1.25; }
.oly-nav-badge { margin-left: auto; min-width: 17px; height: 17px; padding: 0 5px; border-radius: 999px; background: var(--danger); color: #fff; font-size: 10px; font-weight: 800; line-height: 17px; text-align: center; }
.oly-app.sb-collapsed .oly-nav-badge { position: absolute; right: 5px; top: 4px; margin-left: 0; }
.oly-tabs .oly-nav-badge { margin-left: 5px; vertical-align: middle; }
.oly-nav .sub a { padding-left: 30px; font-size: .94em; }
.oly-side-foot {
  flex: 0 0 auto; margin-top: auto; padding: 10px 14px; font-size: 11px;
  background: var(--sb-bg); border-top: 1px solid color-mix(in oklab, var(--border) 70%, transparent);
  position: sticky; bottom: 0; z-index: 2; color: inherit; text-decoration: none;
}
.oly-side-foot:hover { text-decoration: none; background: color-mix(in oklab, currentColor 5%, var(--sb-bg)); }
.oly-iolabs-logo { font-weight: 800; font-size: 17px; letter-spacing: 0; line-height: 1; color: var(--sb-text); }
.oly-iolabs-logo .io { background: none; -webkit-text-fill-color: currentColor; color: inherit; }
.oly-iolabs-sub { margin-top: 4px; color: var(--sb-text); font-size: 10.5px; line-height: 1.35; opacity: .72; }
.logo--img { overflow: hidden; padding: 0 !important; }
.logo--img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.brandrow .logo--wordmark { width: 170px; height: 52px; border-radius: 0; }
.brandrow .logo--wordmark img { object-fit: contain; }
.oly-app.sb-collapsed .oly-brand .logo--wordmark { width: 30px; min-width: 30px; overflow: hidden; }
.oly-app.sb-collapsed .oly-brand .logo--wordmark img { width: 116px; max-width: none; }
.brandrow .logo .oly-ico svg { width: 20px; height: 20px; }
.oly-login-foot { text-align: center; margin-top: 14px; font-size: 11px; color: var(--muted); }
/* topbar icon buttons + notifications */
.oly-iconbtn { background: none; border: 1px solid var(--border); border-radius: 8px; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; color: var(--muted); cursor: pointer; }
.oly-iconbtn:hover { color: var(--text); border-color: var(--primary); }
.oly-iconbtn .oly-ico svg, .oly-bell .oly-ico svg { width: 17px; height: 17px; }
.oly-bell { position: relative; cursor: pointer; color: var(--muted); display: inline-flex; padding: 6px; }
.oly-bell:hover { color: var(--text); }
.oly-bell-badge { position: absolute; top: -2px; right: -2px; min-width: 16px; height: 16px; padding: 0 3px; border-radius: 9px; background: var(--danger); color: #fff; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.oly-bell-panel { display: none; position: fixed; top: 54px; right: 18px; width: 320px; max-height: 60vh; overflow-y: auto; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); z-index: 950; }
.oly-bell-panel.open { display: block; }
.oly-notif-head { display: flex; align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--border); font-size: 13px; }
.oly-notif { padding: 10px 12px; border-bottom: 1px solid var(--border); font-size: 13px; }
.oly-notif.unread { background: var(--primary-soft); }
.oly-notif-link { display: block; width: 100%; border: 0; background: transparent; color: var(--text); padding: 0; text-align: left; cursor: pointer; font: inherit; }
.oly-notif-link:hover { color: var(--primary); }
.oly-notif .t { font-size: 10.5px; color: var(--muted); margin-top: 3px; }
.oly-ai-helper {
  position: fixed;
  top: 0;
  right: 0;
  width: min(420px, calc(100vw - 18px));
  height: 100dvh;
  background: var(--surface);
  border-left: 1px solid var(--border);
  box-shadow: -24px 0 70px -36px rgb(0 0 0 / .55);
  z-index: 980;
  display: grid;
  grid-template-rows: auto auto minmax(0,1fr) auto;
  transform: translateX(105%);
  transition: transform .18s ease;
}
.oly-ai-helper.open { transform: translateX(0); }
.oly-aih-head { display: flex; align-items: center; gap: 12px; padding: 14px 14px 12px; border-bottom: 1px solid var(--border); }
.oly-aih-head div { display: grid; gap: 2px; min-width: 0; flex: 1; }
.oly-aih-head b { font-size: 15px; }
.oly-aih-head span { color: var(--muted); font-size: 12px; }
.oly-aih-quick { display: flex; gap: 6px; flex-wrap: wrap; padding: 10px 14px; border-bottom: 1px solid var(--border); }
.oly-aih-quick button {
  border: 1px solid var(--border);
  background: var(--surface2);
  color: var(--text);
  border-radius: 8px;
  padding: 6px 9px;
  font-size: 12px;
  cursor: pointer;
}
.oly-aih-quick button:hover { border-color: var(--primary); }
.oly-aih-log { min-height: 0; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.oly-aih-msg {
  max-width: 92%;
  padding: 10px 11px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface2);
  line-height: 1.45;
  font-size: 13px;
  overflow-wrap: anywhere;
}
.oly-aih-msg.user { align-self: flex-end; background: var(--primary-soft); border-color: color-mix(in oklab,var(--primary) 24%,var(--border)); }
.oly-aih-msg.assistant { align-self: flex-start; }
.oly-aih-msg.system { max-width: 100%; color: var(--muted); background: transparent; border-style: dashed; }
.oly-aih-msg.loading { color: var(--muted); }
.oly-aih-compose { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; padding: 12px 14px; border-top: 1px solid var(--border); }
.oly-aih-compose textarea { resize: vertical; min-height: 58px; max-height: 160px; }
.oly-aih-compose .oly-btn { align-self: end; min-height: 38px; }

.oly-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.oly-topbar {
  display: flex; align-items: center; gap: 12px; padding: 10px 20px;
  background: color-mix(in oklab, var(--topbar-bg, var(--surface)) 90%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 60;
}
.oly-topbar .burger { cursor: pointer; font-size: 17px; opacity: .7; padding: 4px 8px; border-radius: 8px; }
.oly-topbar .burger:hover { background: var(--primary-soft); opacity: 1; }
.oly-topbar .crumb { font-weight: 650; font-size: 15px; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oly-topbar .crumb .sep { opacity: .35; margin: 0 7px; }
.oly-kbtn {
  display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; font-size: 12.5px;
  border: 1px solid var(--border); border-radius: 9px; color: var(--muted); cursor: pointer;
  background: var(--surface); transition: border-color .12s;
}
.oly-kbtn:hover { border-color: var(--primary); }
.oly-kbd { font-family: ui-monospace, monospace; font-size: 11px; background: var(--surface2); border: 1px solid var(--border); padding: 1px 6px; border-radius: 5px; }
.oly-userchip { display: flex; align-items: center; gap: 9px; font-size: 12.5px; color: var(--muted); }
.oly-avatar {
  width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center;
  background: var(--primary); color: #fff; font-weight: 800; font-size: 12px;
}
.oly-avatar-btn { border: 0; background: transparent; padding: 0; cursor: pointer; border-radius: 50%; }
.oly-avatar-btn:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.oly-userchip { position: relative; }
.oly-user-menu {
  display: none; position: fixed; top: 54px; right: 18px; min-width: 190px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 6px; z-index: 950;
}
.oly-user-menu.open { display: block; }
.oly-user-menu button, .oly-user-menu a {
  width: 100%; display: flex; align-items: center; gap: 8px; padding: 9px 10px;
  border: 0; border-radius: calc(var(--radius) * .55); background: transparent;
  color: var(--text); font: inherit; text-align: left; cursor: pointer;
}
.oly-user-menu button:hover, .oly-user-menu a:hover { background: var(--primary-soft); text-decoration: none; }
.oly-profile-view { display: grid; gap: 8px; }
.oly-profile-row { display: grid; grid-template-columns: 110px 1fr; gap: 10px; align-items: start; }
.oly-profile-row b { color: var(--muted); font-size: 12px; }
.oly-content { padding: var(--gap); flex: 1; max-width: 1640px; width: 100%; margin: 0 auto; }
.oly-content.is-loading { opacity: .55; pointer-events: none; transition: opacity .12s; }
.oly-main--form-fullscreen { height: 100dvh; min-height: 0; overflow: hidden; }
.oly-main--form-fullscreen > .oly-topbar { flex: 0 0 auto; }
.oly-content--form-fullscreen {
  flex: 1 1 auto; min-height: 0; max-width: none; display: flex; flex-direction: column; overflow: hidden;
}
.oly-content--form-fullscreen > .oly-toolbar,
.oly-content--form-fullscreen > #oly-filters { flex: 0 0 auto; }
.oly-content--form-fullscreen > #oly-grid { flex: 1 1 auto; min-height: 0; display: flex; }
.oly-content--form-fullscreen > #oly-grid > .oly-grid-wrap {
  flex: 1 1 auto; min-width: 0; min-height: 0; width: 100%; display: flex; flex-direction: column;
}
.oly-content--form-fullscreen > #oly-grid > .oly-grid-wrap > .oly-grid-scroll,
.oly-content--form-fullscreen > #oly-grid > .oly-grid-wrap > .dv-cards,
.oly-content--form-fullscreen > #oly-grid > .oly-grid-wrap > .dv-gallery,
.oly-content--form-fullscreen > #oly-grid > .oly-grid-wrap > .dv-kanban,
.oly-content--form-fullscreen > #oly-grid > .oly-grid-wrap > .dv-gantt {
  flex: 1 1 auto; min-height: 0; overflow: auto;
}
.oly-content--form-fullscreen .oly-pager { flex: 0 0 auto; }
.oly-content--form-fullscreen .dv-calendar-shell {
  flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column;
}
.oly-content--form-fullscreen .dv-calendar { flex: 1 1 auto; min-height: 0; overflow: auto; }
.oly-content--form-fullscreen .dv-calendar--month { grid-template-rows: auto repeat(6, minmax(0, 1fr)); }
.oly-content--form-fullscreen .dv-calendar--week { grid-template-rows: auto minmax(0, 1fr); }
.oly-content--form-fullscreen .dv-calendar--day { grid-template-rows: minmax(0, 1fr); }
.oly-content--form-fullscreen .dv-calendar .dv-day { min-height: 0; }
.oly-content--form-fullscreen .dv-calendar .dv-day-events { max-height: calc(100% - 34px); overflow: auto; }
.oly-content--form-fullscreen .dv-calendar-unscheduled { flex: 0 0 auto; max-height: 100px; overflow: auto; }
.oly-content--form-fullscreen .dv-map { flex: 1 1 auto; min-height: 0; }
.oly-content--form-fullscreen .dv-map-canvas { height: 100%; min-height: 0; }
.oly-content--form-fullscreen .dv-map-list { height: 100%; max-height: none; min-height: 0; overflow: auto; }

/* ---------- Cards ---------- */
.oly-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow); padding: var(--gap);
}
.oly-card + .oly-card { margin-top: var(--gap); }
.oly-card .card-title { font-size: 13.5px; font-weight: 650; margin: 0 0 12px; display: flex; align-items: center; gap: 8px; }
.oly-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap); }
.oly-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap); }
.oly-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--gap); }
.oly-grid-2 > .oly-card + .oly-card,
.oly-grid-3 > .oly-card + .oly-card,
.oly-grid-4 > .oly-card + .oly-card,
.oly-split2 > .oly-card + .oly-card { margin-top: 0; }
.oly-stat .num { font-size: 26px; font-weight: 750; color: var(--primary); font-variant-numeric: tabular-nums; }
.oly-stat .lbl { font-size: 12px; color: var(--muted); }

/* ---------- Fallback home ---------- */
.oly-eyebrow { color: var(--primary); font-size: 12px; font-weight: 750; letter-spacing: 0; text-transform: uppercase; }
.oly-home-fallback {
  display: grid; gap: 18px; max-width: 980px; margin: 0 auto;
}
.oly-home-fallback__head {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: clamp(18px, 4vw, 34px);
}
.oly-home-fallback h1 { margin: 6px 0 8px; font-size: clamp(26px, 3vw, 38px); line-height: 1.12; letter-spacing: 0; }
.oly-home-fallback p { max-width: 760px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.6; }
.oly-home-fallback__grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px;
}
.oly-home-link {
  display: flex; gap: 12px; align-items: center; min-height: 70px; padding: 12px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  color: var(--text); text-decoration: none; box-shadow: var(--shadow);
}
.oly-home-link:hover { border-color: var(--primary); text-decoration: none; }
.oly-home-link__icon {
  width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: calc(var(--radius) * .7); background: var(--primary-soft); color: var(--primary);
  flex: 0 0 auto;
}
.oly-home-link strong { display: block; margin-bottom: 2px; font-size: 14px; line-height: 1.25; }
.oly-home-link small { display: block; color: var(--muted); font-size: 12px; }
.oly-home-fallback__foot {
  color: var(--muted); font-size: 12px; display: flex; align-items: center; gap: 6px;
}
.oly-home-fallback__foot span { display: inline-flex; align-items: center; gap: 6px; }

/* ---------- Buttons ---------- */
.oly-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: var(--pad);
  border-radius: calc(var(--radius) * .7); border: 1px solid var(--border);
  background: var(--surface); color: var(--text); font: inherit; font-weight: 550; cursor: pointer;
  transition: transform .06s, filter .12s, border-color .12s; white-space: nowrap;
}
.oly-btn:hover { filter: brightness(.965); border-color: color-mix(in oklab, var(--border) 40%, var(--muted)); }
.oly-btn:active { transform: translateY(1px) scale(.99); }
.oly-btn--primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.oly-btn--primary:hover { background: var(--primary-strong); border-color: var(--primary-strong); filter: none; }
.oly-btn--danger { background: var(--danger); border-color: var(--danger); color: #fff; }
.oly-btn--ghost { background: transparent; border-color: transparent; color: var(--primary); }
.oly-btn--icon { padding: 6px 10px; }
.oly-btn--sm { padding: 4px 9px; font-size: 12px; }
.oly-btn:disabled { opacity: .5; cursor: not-allowed; }
.oly-btn .spin { display: inline-block; width: 12px; height: 12px; border: 2px solid #fff5; border-top-color: #fff; border-radius: 50%; animation: olyspin .6s linear infinite; }
@keyframes olyspin { to { transform: rotate(360deg); } }

/* ---------- Field shell (elements) ---------- */
.oly-fields { display: flex; flex-wrap: wrap; gap: 0 14px; }
.oly-shell { width: var(--shell-w, calc(50% - 14px)); margin-bottom: 13px; position: relative; min-width: 120px; }
.oly-shell--rfw { }
.oly-label { display: block; font-size: 12px; font-weight: 600; margin-bottom: 5px; color: var(--text); }
.oly-req { color: var(--danger); }
.oly-help { font-size: 11.5px; color: var(--muted); margin-top: 4px; }
.oly-notice {
  --notice-color: var(--primary);
  display: block; padding: 11px 13px; border: 1px solid color-mix(in oklab, var(--notice-color) 56%, var(--border));
  border-radius: calc(var(--radius) * .75); background: color-mix(in oklab, var(--notice-color) 11%, var(--surface));
  color: var(--text); line-height: 1.45;
}
.oly-notice > .oly-flex { align-items: flex-start; }
.oly-notice b { color: var(--text); }
.oly-notice .oly-help, .oly-notice small { color: color-mix(in oklab, var(--text) 72%, var(--notice-color)); }
.oly-notice .oly-ico { color: var(--notice-color); }
.oly-notice--info { --notice-color: var(--primary); }
.oly-notice--warning { --notice-color: var(--warn); }
.oly-notice--success { --notice-color: var(--ok); }
.oly-notice--danger { --notice-color: var(--danger); }
.oly-error { display: none; font-size: 12px; color: var(--danger); margin-top: 4px; }
.oly-error:not(:empty) { display: block; }
.oly-control { position: relative; }
.oly-clear {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: 15px;
  padding: 2px 6px; border-radius: 6px; opacity: 0; transition: opacity .12s;
}
.oly-control:hover .oly-clear { opacity: .7; }
.oly-clear:hover { opacity: 1 !important; background: var(--primary-soft); }
@media (max-width: 760px) { .oly-shell, .oly-shell--rfw { width: 100% !important; } }

.oly-input, .oly-select, .oly-textarea {
  width: 100%; padding: var(--pad); border: 1px solid var(--border);
  border-radius: calc(var(--radius) * .6); background: var(--surface); color: var(--text);
  font: inherit; line-height: 1.45; outline: none; transition: border-color .12s, box-shadow .12s;
}
.oly-input:focus, .oly-select:focus, .oly-textarea:focus {
  border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft);
}
.oly-input.invalid { border-color: var(--danger); }
.oly-input[readonly], .oly-input:disabled { background: var(--surface2); color: var(--muted); }
.oly-shell--locked .oly-control { opacity: .88; }
.oly-readonly-select { pointer-events: none; background-color: var(--surface2) !important; color: var(--muted) !important; }
.oly-textarea { resize: vertical; }

/* ---------- Rich edit layout (DataForms) ---------- */
.oly-edit-layout { width: 100%; min-width: 0; }
.oly-edit-tabs {
  display: flex; flex-wrap: wrap; gap: 6px; width: 100%;
  margin: 0 0 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border);
}
.oly-edit-tab {
  border: 1px solid transparent; background: transparent; color: var(--muted);
  border-radius: 8px; padding: 7px 11px; font: inherit; font-size: 13px; font-weight: 650;
  cursor: pointer; line-height: 1.2;
}
.oly-edit-tab:hover { background: var(--surface2); color: var(--text); }
.oly-edit-tab.active { background: var(--primary-soft); color: var(--primary); border-color: color-mix(in oklab, var(--primary) 20%, var(--border)); }
.oly-edit-tabpane { display: none; width: 100%; min-width: 0; }
.oly-edit-tabpane.active { display: block; }
.oly-edit-wizard .oly-edit-tabs { align-items: center; gap: 8px; border-bottom: 0; padding-bottom: 4px; }
.oly-edit-wizard .oly-edit-tab { display: inline-flex; align-items: center; gap: 7px; pointer-events: none; }
.oly-edit-wizard .oly-edit-tab:not(.active) { opacity: .72; }
.oly-step-num { display: inline-grid; place-items: center; width: 22px; aspect-ratio: 1; border-radius: 999px; background: var(--surface2); color: var(--muted); font-size: 12px; }
.oly-edit-wizard .oly-edit-tab.active .oly-step-num { background: var(--primary); color: #fff; }
.oly-wizard-foot { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.oly-wizard-count { margin-left: auto; }
.oly-edit-section, .oly-edit-acc {
  width: 100%; min-width: 0; margin: 0 0 14px; padding: 12px 12px 0;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
}
.oly-edit-section-head, .oly-edit-acc > summary {
  display: flex; align-items: center; gap: 8px; margin: 0 0 12px;
  color: var(--text); font-size: 13px; font-weight: 750;
}
.oly-edit-acc > summary { cursor: pointer; list-style: none; }
.oly-edit-acc > summary::-webkit-details-marker { display: none; }
.oly-edit-acc > summary::after {
  content: "⌄"; margin-left: auto; color: var(--muted); transition: transform .12s;
}
.oly-edit-acc:not([open]) > summary::after { transform: rotate(-90deg); }
.oly-edit-section-icon { display: inline-flex; width: 17px; height: 17px; color: var(--primary); }
.oly-edit-section-icon svg { width: 17px; height: 17px; }
.oly-layout-divider { width: 100%; height: 1px; margin: 4px 0 15px; background: var(--border); }
.oly-layout-note {
  width: 100%; margin: 0 0 12px; padding: 9px 11px;
  border-left: 3px solid var(--primary); background: var(--surface2); border-radius: 7px;
}
.oly-layout-note h4 { margin: 0 0 3px; font-size: 13px; line-height: 1.25; }
.oly-layout-note p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.35; }
/* Code editor (syntax highlight overlay) */
.oly-codewrap { position: relative; }
.oly-codewrap .oly-codehl, .oly-codewrap textarea.oly-codeta {
  margin: 0; box-sizing: border-box; padding: 12px; tab-size: 4; -moz-tab-size: 4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-size: 13px; line-height: 1.5; white-space: pre; overflow: auto;
  border-radius: calc(var(--radius) * .6);
}
.oly-codewrap .oly-codehl {
  position: absolute; inset: 0; pointer-events: none;
  border: 1px solid #30363d; background: #0d1117; color: #e6edf3;
}
.oly-codewrap .oly-codehl code { font: inherit; display: block; }
.oly-codewrap textarea.oly-codeta { position: relative; width: 100%; background: transparent; color: transparent; caret-color: #e6edf3; border: 1px solid transparent; resize: vertical; outline: none; }
.oly-codewrap textarea.oly-codeta:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }
.tok-com { color: #9aa7b3; font-style: italic; }
.tok-str { color: #a5d6ff; }
.tok-key { color: #ff7b72; font-weight: 650; }
.tok-num { color: #79c0ff; }
.tok-var { color: #ffa657; }
.tok-tag { color: #7ee787; font-weight: 650; }
.tok-attr { color: #d2a8ff; }
.tok-sel { color: #d2a8ff; }
/* Ίδιο ύψος/εμφάνιση select με τα inputs (αφαίρεση native appearance + custom βελάκι) */
.oly-select, select.oly-input {
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  min-height: 38px; padding-top: 8px; padding-bottom: 8px; padding-right: 32px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23889' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat; background-position: right 11px center;
}
.oly-select[multiple], select.oly-input[multiple] { background-image: none; padding-right: var(--pad); }
.oly-num { font-variant-numeric: tabular-nums; }
.oly-color { height: 38px; padding: 4px; }
.oly-slider { flex: 1; accent-color: var(--primary); }
.oly-slider-wrap--v { flex-direction: column; align-items: flex-start; height: 160px; }
.oly-slider--v { writing-mode: vertical-lr; direction: rtl; width: 8px; height: 150px; flex: 0 0 auto; accent-color: var(--primary); }
.oly-flex { display: flex; align-items: center; gap: 8px; min-height: 38px; }
.oly-range { display: flex; align-items: center; gap: 6px; }

/* switch */
.oly-switch { display: inline-flex; align-items: center; gap: 9px; cursor: pointer; min-height: 38px; }
.oly-switch input { position: absolute; opacity: 0; }
.oly-switch-track {
  width: 38px; height: 21px; min-width: 38px; background: var(--border); border-radius: 21px; position: relative; transition: background .15s;
}
.oly-switch-track::after {
  content: ''; position: absolute; width: 15px; height: 15px; left: 3px; top: 3px;
  background: #fff; border-radius: 50%; transition: transform .15s; box-shadow: 0 1px 3px rgb(0 0 0 / .3);
}
.oly-switch input:checked + .oly-switch-track { background: var(--primary); }
.oly-switch input:checked + .oly-switch-track::after { transform: translateX(17px); }
.oly-switch-text { font-weight: 500; font-size: 13px; }

/* richtext */
.oly-rt-bar { display: flex; gap: 2px; padding: 4px; border: 1px solid var(--border); border-bottom: 0; border-radius: calc(var(--radius) * .6) calc(var(--radius) * .6) 0 0; background: var(--surface2); }
.oly-rt-bar button { border: 0; background: transparent; padding: 4px 9px; cursor: pointer; border-radius: 6px; font-size: 13px; color: var(--text); }
.oly-rt-bar button:hover { background: var(--primary-soft); }
.oly-rt-area { border-radius: 0 0 calc(var(--radius) * .6) calc(var(--radius) * .6) !important; }

/* badges, stars, dots */
.oly-badge { display: inline-block; padding: 2px 9px; border-radius: 99px; font-size: 11.5px; font-weight: 650; background: var(--primary-soft); color: var(--primary); }
.oly-badge--ok { background: color-mix(in oklab, var(--ok) 16%, transparent); color: var(--ok); }
.oly-badge--off { background: var(--border); color: var(--muted); }
.oly-badge--danger { background: color-mix(in oklab, var(--danger) 18%, transparent); color: var(--danger); }
.oly-stars { color: var(--warn); letter-spacing: 2px; font-size: 15px; }
.oly-stars--input { display: inline-flex; align-items: center; min-height: 38px; font-size: 18px; }
.oly-stars--input .oly-star { cursor: pointer; opacity: .45; transition: opacity .1s, transform .1s; display: inline-block; }
.oly-stars--input .oly-star.on { opacity: 1; }
.oly-stars--input .oly-star:hover { transform: scale(1.2); }
.oly-stars--input[aria-disabled="true"] .oly-star { cursor: default; }
.oly-stars--input[aria-disabled="true"] .oly-star:hover { transform: none; }
.oly-combo[aria-disabled="true"] { cursor: default; opacity: .72; }

/* Offline Data status and conflict manager */
.oly-offline-state {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 1300;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow);
  padding: 7px 10px;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.oly-offline-state.is-offline { background: var(--warn); color: #1b1b1b; border-color: transparent; }
.oly-offline-state.has-pending:not(.is-offline) { color: var(--warn); }
.oly-offline-state::after {
  content: attr(data-tooltip);
  position: absolute;
  right: 0;
  bottom: calc(100% + 8px);
  width: min(330px, calc(100vw - 28px));
  padding: 9px 11px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--panel);
  color: var(--text);
  box-shadow: var(--shadow);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  text-align: left;
  white-space: normal;
  opacity: 0;
  visibility: hidden;
  transform: translateY(3px);
  transition: opacity .15s, transform .15s, visibility .15s;
  pointer-events: none;
}
.oly-offline-state:hover::after,
.oly-offline-state:focus-visible::after { opacity: 1; visibility: visible; transform: translateY(0); }
.oly-offline-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.oly-offline-summary > div { border: 1px solid var(--border); border-radius: 6px; padding: 10px; background: var(--surface2); }
.oly-offline-summary b { display: block; font-size: 18px; }
.oly-offline-summary span { color: var(--muted); font-size: 12px; }
.oly-offline-conflict { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; align-items: center; border-top: 1px solid var(--border); padding: 10px 0; }
.oly-offline-conflict small { display: block; color: var(--muted); margin-top: 3px; }
.offline-admin-section { margin-bottom: 22px; }
.offline-admin-card { display: flex; flex-direction: column; min-height: min(760px, calc(100vh - 110px)); }
.offline-admin-intro { margin: -7px 0 12px; }
.offline-admin-card > .oly-tabs { flex: 0 0 auto; }
.offline-pane { flex: 1 1 auto; padding-top: 12px; }
.offline-admin-footer { flex: 0 0 auto; padding-top: 12px; border-top: 1px solid var(--border); }
.offline-master-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  margin-bottom: 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
}
.offline-master-bar b { display: flex; align-items: center; gap: 7px; margin-bottom: 3px; }
.offline-master-bar .oly-switch { flex: 0 0 auto; }
.offline-settings-groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.offline-settings-group { padding: 13px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface2); }
.offline-settings-group > b { display: block; margin-bottom: 3px; }
.offline-settings-group > .oly-muted { min-height: 34px; margin-bottom: 8px; font-size: 12px; }
.offline-settings-group .oly-fields { gap: 8px; }
.offline-settings-group .oly-shell { padding: 0; }
.offline-settings-help { margin-top: 10px; }
.offline-object-grid .oly-switch { justify-content: center; }
.offline-object-grid td { vertical-align: middle; }
.offline-object-grid .oly-muted { font-size: 12px; margin-top: 2px; }
.offline-package-off .offline-dependent-section,
.offline-full-app-on .offline-dependent-section:not(:first-of-type),
.offline-auto-cache-all-on .offline-object-section {
  opacity: .58;
}
.offline-object-grid.is-overridden {
  background: color-mix(in srgb, var(--muted) 7%, transparent);
  border-radius: 8px;
}
.offline-object-grid input:disabled,
.offline-admin-section select:disabled,
.offline-admin-section input:disabled {
  cursor: not-allowed;
}
.saas-settings-tabs { grid-column: 1 / -1; margin-bottom: 12px; }
.saas-settings-subpane { grid-column: 1 / -1; min-width: 0; }
.site-section-custom { width: 100%; min-width: 0; }
.saas-site-sections-editor,
#site-sections,
#site-sections .saas-site-section-row { width: 100%; min-width: 0; box-sizing: border-box; }
.saas-site-sections-editor { flex: 0 0 100%; max-width: 100%; }
.saas-site-sections-editor > .oly-flex { width: 100%; flex-wrap: wrap; gap: 8px; }
.site-section-code-tabs { width: 100%; margin: 2px 0 12px; }
.site-section-custom > .oly-codewrap {
  width: 100%;
  min-width: 0;
  height: min(48vh, 440px);
  min-height: 300px;
  margin: 0;
  overflow: hidden;
}
.site-section-custom > .oly-codewrap .oly-codehl,
.site-section-custom > .oly-codewrap textarea.oly-codeta,
.site-section-custom > textarea.site-section-code {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  resize: none;
}
.site-section-custom > .oly-codewrap .oly-codehl { overflow: hidden; z-index: 0; }
.site-section-custom > .oly-codewrap textarea.oly-codeta { overflow: auto; z-index: 1; }
@media (max-width: 900px) {
  .offline-settings-groups { grid-template-columns: 1fr; }
  .offline-settings-group > .oly-muted { min-height: 0; }
}
.oly-pwa-prompt {
  position: fixed;
  left: max(14px, env(safe-area-inset-left));
  right: max(14px, env(safe-area-inset-right));
  bottom: max(14px, env(safe-area-inset-bottom));
  z-index: 10020;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 12px 36px rgb(12 18 32 / .18);
}
.oly-pwa-prompt > div {
  display: grid;
  gap: 2px;
  min-width: 0;
  flex: 1;
}
.oly-pwa-prompt b { font-size: 13px; }
.oly-pwa-prompt span { color: var(--muted); font-size: 12px; line-height: 1.35; }
.oly-pwa-prompt ul,
.oly-help-steps {
  margin: 6px 0 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.oly-pwa-prompt li + li,
.oly-help-steps li + li { margin-top: 3px; }
.oly-walk-highlight {
  position: fixed;
  z-index: 10040;
  pointer-events: none;
  border: 2px solid var(--primary);
  border-radius: 12px;
  box-shadow:
    0 0 0 9999px rgb(8 13 24 / .38),
    0 0 0 6px var(--primary-soft);
  transition: left .14s ease, top .14s ease, width .14s ease, height .14s ease;
}
.oly-walk-pop {
  position: fixed;
  z-index: 10050;
  width: min(340px, calc(100vw - 20px));
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  color: var(--text);
  box-shadow: 0 18px 56px rgb(8 13 24 / .26);
}
.oly-walk-count {
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 5px;
}
.oly-walk-title {
  font-weight: 750;
  font-size: 15px;
  line-height: 1.25;
  margin-bottom: 6px;
}
.oly-walk-body {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.oly-walk-actions {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  margin-top: 12px;
  flex-wrap: wrap;
}
.oly-help-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface2);
}
.oly-help-actions--stack {
  align-items: stretch;
  flex-direction: column;
}
.oly-help-actions--stack .oly-btn {
  justify-content: center;
}
.walk-editor-head,
.walk-step-row,
.walk-step-grid-head {
  display: grid;
  grid-template-columns: minmax(135px, .8fr) minmax(170px, 1fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(220px, 1.5fr) 110px 38px;
  gap: 8px;
  align-items: start;
}
.walk-editor-head {
  grid-template-columns: 1fr auto auto;
  align-items: center;
  margin-bottom: 8px;
}
.walk-step-grid-head {
  color: var(--muted);
  font-size: 11.5px;
  font-weight: 650;
  margin-bottom: 5px;
}
.walk-step-row { margin-bottom: 7px; }
.walk-selector-wrap {
  display: grid;
  gap: 6px;
}
.walk-step-row .walk-del {
  width: 38px;
  height: 38px;
  padding: 0;
  justify-content: center;
}
@media (min-width: 760px) {
  .oly-pwa-prompt {
    left: auto;
    width: min(480px, calc(100vw - 28px));
  }
}
@media (max-width: 620px) {
  body {
    padding-bottom: env(safe-area-inset-bottom);
  }
  .oly-pwa-prompt {
    align-items: stretch;
    flex-wrap: wrap;
  }
  .oly-pwa-prompt .oly-pwa-install {
    width: calc(100% - 42px);
    justify-content: center;
  }
  .walk-step-grid-head { display: none; }
  .walk-step-row {
    grid-template-columns: 1fr 38px;
    padding: 8px;
    border: 1px solid var(--border);
    border-radius: 10px;
  }
  .walk-step-row .oly-input,
  .walk-step-row .walk-target-wrap,
  .walk-step-row .walk-selector-wrap { grid-column: 1 / -1; }
  .walk-step-row .walk-target-wrap .oly-input { width: 100%; }
  .walk-step-row .walk-del { grid-column: 2; grid-row: 1; }
}
@media (max-width: 700px) {
  .oly-offline-state { right: 10px; bottom: 10px; }
  .oly-offline-summary { grid-template-columns: 1fr; }
  .oly-offline-conflict { grid-template-columns: 1fr 1fr; }
  .oly-offline-conflict > div { grid-column: 1 / -1; }
}
.oly-color-dot { width: 16px; height: 16px; border-radius: 50%; display: inline-block; vertical-align: -3px; border: 1px solid var(--border); }
.oly-map-pin { color: var(--primary); }
.oly-map-field { display: grid; gap: 8px; width: 100%; }
.oly-map-actions { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.oly-map-frame, .cf-vmap-frame {
  width: 100%;
  min-height: 120px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface2);
  display: block;
}
.cf-vmap-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.cf-vmap-head h2 { margin: 0; font-size: 16px; }
.cf-vmap-head a { margin-left: auto; font-size: 12px; }
.cf-vform-map { grid-column: 1 / -1; }
.cf-vform-map .cf-vmap-frame { margin-top: 6px; }
.oly-media-field, .cf-vform-media { display: grid; gap: 8px; width: 100%; }
.oly-media-inputs { display: grid; grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); gap: 8px; }
.cf-vmedia-row { display: grid; grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); gap: 8px; }
.oly-media-line { display: grid; gap: 5px; }
.oly-media-line span { font-size: 12px; color: var(--muted); }
.oly-media-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.oly-media-preview, .cf-vmedia-preview {
  min-height: 46px;
  border: 1px dashed var(--border);
  border-radius: 8px;
  background: var(--surface2);
  padding: 8px;
}
.oly-media-preview:empty, .cf-vmedia-preview:empty { display: none; }
.oly-media-preview img, .cf-vmedia-preview img {
  max-width: 100%;
  max-height: 220px;
  border-radius: 8px;
  display: block;
}
.oly-media-frame, .cf-vmedia-frame {
  width: 100%;
  min-height: 240px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #000;
  display: block;
}
.oly-media-player, .cf-vmedia-player { width: 100%; max-height: 320px; display: block; }
.oly-media-filebox, .cf-vmedia-filebox { display: grid; gap: 3px; color: var(--text); }
.oly-media-filebox span, .cf-vmedia-filebox span { color: var(--muted); font-size: 12px; }
.oly-media-link { display: inline-flex; align-items: center; gap: 5px; }
.oly-media-badge { display: inline-block; padding: 2px 7px; border-radius: 999px; background: var(--surface2); color: var(--muted); border: 1px solid var(--border); font-size: 11px; font-weight: 650; }
.cf-vform-media { grid-column: 1 / -1; }
.cf-vform-media .cf-vmedia-preview { margin-top: 6px; }
.oly-thumb { width: 36px; height: 36px; object-fit: cover; border-radius: 8px; border: 1px solid var(--border); }
.oly-thumb--lg { width: 84px; height: 84px; border-radius: 10px; }

/* bound dropdown */
.oly-bound { position: relative; }
.oly-bound--browse { display: flex; gap: 6px; align-items: stretch; }
.oly-bound--browse .oly-bound-q { flex: 1; }
.oly-bound--browse .oly-bound-browse { flex: 0 0 auto; padding: 0 11px; min-width: 38px; position: relative; z-index: 3; pointer-events: auto; }
.oly-bound-browse svg { pointer-events: none; }
.oly-lookup-manage {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  padding: 4px 8px; min-width: 32px; height: 28px; z-index: 2;
}
.oly-control > .oly-select:has(+ .oly-lookup-manage) { padding-right: 44px; }
.oly-control > .oly-combo:has(+ .oly-lookup-manage) { padding-right: 44px; }
.oly-bound-panel {
  display: none; position: absolute; z-index: 90; left: 0; right: 0; top: calc(100% + 4px);
  background: var(--surface); border: 1px solid var(--border); border-radius: calc(var(--radius) * .6);
  box-shadow: 0 14px 36px -10px rgb(0 0 0 / .3); max-height: 240px; overflow-y: auto;
}
.oly-bound-panel .opt { padding: 8px 12px; cursor: pointer; }
.oly-bound-panel .opt:hover, .oly-bound-panel .opt.sel { background: var(--primary-soft); }
.oly-bound-panel .none { padding: 8px 12px; color: var(--muted); }

/* ---------- DataGrid ---------- */
.oly-toolbar { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; flex-wrap: wrap; }
.oly-toolbar .spacer { flex: 1; }
.oly-grid-wrap { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); overflow: hidden; }
.oly-grid-scroll { overflow-x: auto; background: var(--surface); }
#df-editor .cf-card {
  height: auto;
  min-height: 0;
  max-height: none;
  overflow: visible;
}
#df-editor .df-pane {
  display: none;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 4px;
}
#df-editor .df-pane.active { display: block; }
#df-editor .df-pane[data-p="fields"].active {
  display: block;
  overflow: visible;
}
#df-editor .df-pane[data-p="fields"] > .oly-flex {
  flex: 0 0 auto;
}
#df-editor .df-pane[data-p="fields"] .oly-grid-scroll {
  height: clamp(240px, calc(100dvh - 370px), 520px);
  min-height: 240px;
  max-height: 520px;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
}
#df-editor .df-fields-scroll {
  display: block;
  height: clamp(240px, calc(100dvh - 370px), 520px) !important;
  overflow: auto !important;
}
#df-editor .df-pane[data-p="fields"] .oly-grid {
  --grid-row-min-h: 38px;
}
#df-editor .df-pane[data-p="fields"] .oly-grid th,
#df-editor .df-pane[data-p="fields"] .oly-grid td {
  padding: 6px 9px;
}
#df-editor .df-pane[data-p="fields"] .oly-grid .oly-btn--sm {
  min-height: 28px;
  height: 30px;
  padding: 5px 8px;
}
#df-editor .df-pane[data-p="fields"] .oly-grid th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--surface2);
}
table.oly-grid { width: 100%; border-collapse: separate; border-spacing: 0; }
.oly-grid th {
  text-align: left; padding: var(--row-pad); font-size: 11px; text-transform: uppercase;
  letter-spacing: .07em; color: var(--muted); border-bottom: 1px solid var(--border);
  white-space: nowrap; cursor: pointer; user-select: none; background: var(--surface2);
  position: sticky; top: 0; z-index: 3; background-clip: padding-box;
  box-shadow: 0 1px 0 var(--border), 0 -1px 0 var(--surface2);
}
.oly-grid th .dir { color: var(--primary); }
.oly-grid td { padding: var(--row-pad); border-bottom: 1px solid var(--border); vertical-align: middle; }
.oly-grid tfoot td { position: sticky; bottom: 0; z-index: 2; padding: 9px 11px; border-top: 2px solid var(--border); border-bottom: 0; background: var(--surface2); }
.oly-grid-summary { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; min-width: 90px; }
.oly-grid-summary + .oly-grid-summary { margin-top: 4px; padding-top: 4px; border-top: 1px solid var(--border); }
.oly-grid-summary span { color: var(--muted); font-size: 11px; }
.oly-grid-summary b { font-variant-numeric: tabular-nums; white-space: nowrap; }
/* Ελάχιστο ύψος γραμμής αποτελεσμάτων (μεγαλώνει αν το περιεχόμενο είναι ψηλότερο). */
.oly-grid tbody td { height: var(--grid-row-min-h, 60px); }
.oly-grid .oly-cellw { display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.oly-grid th .oly-cellw { max-width: 100%; }
.admin-menu-scroll { overflow-x: hidden; }
.admin-menu-table { table-layout: fixed; min-width: 0; }
.admin-menu-table th:nth-child(1) { width: 48px; }
.admin-menu-table th:nth-child(2) { width: 24%; }
.admin-menu-table th:nth-child(3) { width: 92px; }
.admin-menu-table th:nth-child(4) { width: 18%; }
.admin-menu-table th:nth-child(5) { width: 126px; }
.admin-menu-table th:nth-child(6) { width: 58px; }
.admin-menu-table th:nth-child(7) { width: 116px; }
.admin-menu-table td { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-menu-table td:nth-child(2),
.admin-menu-table td:nth-child(4) { max-width: 0; }
.admin-menu-table td:nth-child(3),
.admin-menu-table td:nth-child(5),
.admin-menu-table td:nth-child(7) { white-space: nowrap; overflow: hidden; text-overflow: clip; }
.admin-menu-table td:nth-child(7) { padding-left: 4px; padding-right: 4px; }
.admin-menu-table td:nth-child(7) .oly-btn--sm { width: 26px; min-width: 26px; padding: 5px 4px; }
.oly-grid tbody tr { cursor: pointer; transition: background .1s; }
.oly-grid tbody tr:hover { background: var(--primary-soft); }
.oly-grid tbody tr.is-selected { background: color-mix(in srgb, var(--primary) 18%, var(--surface)); }
.oly-grid tbody tr:last-child td { border-bottom: 0; }
.oly-grid .empty { text-align: center; color: var(--muted); padding: 38px !important; cursor: default; }
.oly-grid-actions-th { width: 1%; cursor: default !important; }
.oly-grid-actions { white-space: nowrap; text-align: right; }
.oly-grid-actions .oly-btn { vertical-align: middle; }
/* Τα action buttons μένουν πάντα ορατά (pinned δεξιά) σε ΟΛΕΣ τις αναλύσεις — όχι μόνο σε mobile. */
.oly-grid-actions, .oly-grid-actions-th {
  position: sticky; right: 0; z-index: 2; min-width: 84px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--surface) 80%, transparent), var(--surface) 18px);
  box-shadow: -16px 0 18px -18px rgb(0 0 0 / .55), inset 1px 0 0 var(--border);
}
.oly-grid-actions-th { top: 0; z-index: 4; background: var(--surface2); }
.oly-grid tbody tr:hover .oly-grid-actions,
.oly-grid tbody tr.is-selected .oly-grid-actions {
  background: linear-gradient(90deg, color-mix(in srgb, var(--primary) 10%, transparent), color-mix(in srgb, var(--primary) 14%, var(--surface)) 18px);
}
.oly-pager { display: flex; align-items: center; gap: 10px; padding: 9px 13px; color: var(--muted); font-size: 12.5px; border-top: 1px solid var(--border); }
.oly-pager .spacer { flex: 1; }

/* Data result views */
.dv-wrap { overflow: hidden; }
.dv-cards, .dv-gallery { display: grid; gap: 10px; padding: 12px; }
.dv-cards { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.dv-gallery { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.dv-card, .dv-tile, .dv-kanban-card, .dv-day-item, .dv-map-item, .dv-gantt-row {
  border: 1px solid var(--border); background: var(--surface); border-radius: 8px; cursor: pointer;
  transition: border-color .12s, background .12s, transform .08s;
}
.dv-card:hover, .dv-tile:hover, .dv-kanban-card:hover, .dv-day-item:hover, .dv-map-item:hover, .dv-gantt-row:hover {
  border-color: var(--primary); background: var(--primary-soft);
}
.dv-card { padding: 12px; min-height: 116px; }
.dv-tile { padding: 13px; min-height: 150px; display: flex; flex-direction: column; justify-content: flex-end; background: linear-gradient(180deg, var(--surface2), var(--surface)); }
.dv-title { font-weight: 750; font-size: 14px; margin-bottom: 8px; color: var(--text); }
.dv-meta { display: grid; gap: 4px; color: var(--muted); font-size: 12px; line-height: 1.35; }
.dv-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dv-actions { display: flex; justify-content: flex-end; gap: 6px; margin-top: 10px; }
.dv-actions .oly-btn { padding: 4px 8px; }
.dv-kanban { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 310px); gap: 10px; padding: 12px; overflow-x: auto; }
.dv-kanban-col { background: var(--surface2); border: 1px solid var(--border); border-radius: 8px; padding: 8px; min-height: 260px; }
.dv-kanban-head { display: flex; align-items: center; gap: 8px; font-weight: 750; font-size: 13px; margin-bottom: 8px; }
.dv-kanban-head span { margin-left: auto; color: var(--muted); font-weight: 650; }
.dv-kanban-card { padding: 9px; margin-bottom: 8px; background: var(--surface); }
.dv-calendar-shell { padding: 12px; }
.dv-calendar-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-bottom: 10px; }
.dv-calendar-toolbar > b { margin-left: 5px; text-transform: capitalize; }
.dv-calendar-toolbar .spacer { flex: 1; }
.dv-calendar { display: grid; grid-template-columns: repeat(7, minmax(110px, 1fr)); border: 1px solid var(--border); border-radius: 9px; overflow: auto; background: var(--border); gap: 1px; }
.dv-calendar--day { grid-template-columns: 1fr; }
.dv-calendar-weekday { padding: 7px 9px; background: var(--surface2); color: var(--muted); text-align: center; font-size: 12px; font-weight: 750; }
.dv-day { background: var(--surface2); min-height: 128px; min-width: 110px; transition: background .12s, box-shadow .12s; }
.dv-calendar--week .dv-day { min-height: 360px; }
.dv-calendar--day .dv-day { min-height: 480px; }
.dv-day.is-outside { opacity: .52; }
.dv-day.is-today { box-shadow: inset 0 0 0 2px var(--primary); }
.dv-day.is-drop-target { background: var(--primary-soft); box-shadow: inset 0 0 0 2px var(--primary); }
.dv-day-head { display: flex; align-items: center; gap: 8px; padding: 7px 9px; font-weight: 750; border-bottom: 1px solid var(--border); background: var(--surface); }
.dv-day-head small { margin-left: auto; color: var(--muted); }
.dv-day-events { padding: 5px; }
.dv-day-item { margin: 4px; padding: 7px; background: var(--surface); }
.dv-day-item[draggable="true"] { cursor: grab; }
.dv-day-item[draggable="true"]:active { cursor: grabbing; }
.dv-day-item .dv-title { font-size: 12px; margin-bottom: 2px; }
.dv-calendar-unscheduled { margin-top: 10px; padding: 10px; border: 1px dashed var(--border); border-radius: 8px; display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.dv-calendar-unscheduled .dv-day-item { min-width: 180px; }
.dv-gantt { display: grid; gap: 8px; padding: 12px; }
.dv-gantt-row { display: grid; grid-template-columns: minmax(160px, 260px) 1fr auto; align-items: center; padding: 9px; gap: 10px; }
.dv-gantt-label { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dv-gantt-line { height: 30px; border-radius: 999px; background: var(--surface2); display: flex; align-items: center; padding: 0 10px; color: var(--muted); font-size: 12px; }
.dv-gantt-line span { border-radius: 999px; background: var(--primary-soft); color: var(--primary); padding: 4px 10px; font-weight: 650; }
.dv-map { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(260px, 360px); gap: 12px; padding: 12px; }
.dv-map-canvas { min-height: 330px; border: 1px solid var(--border); border-radius: 8px; background:
  linear-gradient(90deg, color-mix(in oklab, var(--surface2) 75%, transparent) 1px, transparent 1px),
  linear-gradient(color-mix(in oklab, var(--surface2) 75%, transparent) 1px, transparent 1px), var(--surface);
  background-size: 28px 28px; position: relative; overflow: hidden;
}
.dv-map-note { min-height: 330px; display: grid; place-content: center; gap: 6px; justify-items: center; color: var(--muted); text-align: center; }
.dv-map-note .oly-ico svg { width: 30px; height: 30px; color: var(--primary); }
.oly-map-tiles { position: absolute; inset: 0; background: #dce8d7; }
.oly-map-tile { position: absolute; width: 256px; height: 256px; max-width: none; user-select: none; }
.oly-map-route { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2; }
.oly-map-route polyline { fill: none; stroke: var(--primary); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 1px 1px rgb(255 255 255 / .8)); }
.oly-map-marker { position: absolute; z-index: 3; width: 28px; height: 28px; transform: translate(-50%, -100%); border: 2px solid #fff; border-radius: 50% 50% 50% 0; rotate: -45deg; background: var(--primary); color: #fff; box-shadow: 0 2px 7px rgb(0 0 0 / .3); cursor: pointer; }
.oly-map-marker span { display: grid; place-items: center; width: 100%; height: 100%; rotate: 45deg; font-size: 10px; font-weight: 800; }
.oly-map-marker:hover, .oly-map-marker.active { z-index: 5; scale: 1.18; background: var(--danger); }
.oly-map-controls { position: absolute; z-index: 5; top: 8px; left: 8px; display: grid; gap: 3px; }
.oly-map-controls button { width: 30px; height: 30px; border: 1px solid rgb(0 0 0 / .18); background: #fff; color: #222; border-radius: 5px; font-weight: 800; cursor: pointer; box-shadow: 0 1px 4px rgb(0 0 0 / .15); }
.oly-map-controls button.active { background: var(--primary); color: #fff; }
.oly-map-summary { position: absolute; z-index: 4; left: 46px; top: 8px; padding: 5px 8px; border-radius: 5px; background: rgb(255 255 255 / .9); color: #222; font-size: 11px; font-weight: 700; box-shadow: 0 1px 4px rgb(0 0 0 / .15); }
.oly-map-attribution { position: absolute; z-index: 4; right: 3px; bottom: 2px; padding: 1px 4px; border-radius: 3px; background: rgb(255 255 255 / .82); color: #234; font-size: 9px; }
.dv-map-list { display: grid; gap: 8px; align-content: start; max-height: 330px; overflow: auto; }
.dv-map-item { display: grid; gap: 4px; padding: 10px; }
.dv-map-item span { color: var(--muted); font-size: 12px; }
.jd-builder-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.jd-builder-list { display: grid; gap: 10px; }
.jd-builder-row { border: 1px solid var(--border); border-radius: calc(var(--radius) * .75); background: var(--surface2); padding: 12px; }
.jd-row-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.jd-builder-grid { display: grid; grid-template-columns: minmax(160px, 1.2fr) minmax(130px, 1fr) minmax(130px, .8fr); gap: 10px; align-items: end; }
.jd-builder-grid label { display: grid; gap: 5px; font-size: 12px; font-weight: 600; color: var(--text); }
.jd-builder-grid label > span { color: var(--muted); }
.jd-builder-grid .jd-options { grid-column: 1 / -1; }
.obj-map { display: grid; gap: 8px; width: 100%; }
.obj-map-row { display: grid; grid-template-columns: minmax(130px, 1fr) minmax(140px, 1fr) minmax(160px, 1.2fr) minmax(130px, 1fr) auto; gap: 8px; align-items: center; }
.obj-map[data-kind="return"] .obj-map-row { grid-template-columns: minmax(150px, 1fr) minmax(180px, 1.2fr) auto; }
.obj-map .oly-btn { justify-self: start; }
.cu-builder { display: grid; gap: 10px; width: 100%; }
.cu-add-box { display: grid; grid-template-columns: minmax(180px, 1fr) auto; gap: 8px; align-items: center; padding: 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface2); }
.cu-picked { grid-column: 1 / -1; display: flex; gap: 6px; flex-wrap: wrap; min-height: 26px; align-items: center; }
.cu-message { grid-column: 1; }
.cu-add-rule { grid-column: 2; justify-self: start; }
.cu-chip { display: inline-flex; gap: 6px; align-items: center; }
.cu-chip-x { border: 0; background: transparent; color: inherit; cursor: pointer; font: inherit; line-height: 1; padding: 0; opacity: .75; }
.cu-rules { display: grid; gap: 7px; }
.cu-rule-row { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(220px, 1.2fr) auto; gap: 8px; align-items: center; padding: 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); }
.cu-rule-fields { display: flex; gap: 5px; flex-wrap: wrap; min-width: 0; }

/* skeleton */
.oly-skel { border-radius: 8px; background: linear-gradient(100deg, var(--surface2) 40%, color-mix(in oklab, var(--surface2) 60%, var(--border)) 50%, var(--surface2) 60%); background-size: 200% 100%; animation: olyskel 1.2s infinite linear; min-height: 14px; }
@keyframes olyskel { to { background-position: -200% 0; } }

/* ---------- Panels / form circuit ---------- */
.oly-findbar { display: flex; align-items: flex-end; gap: 0 14px; flex-wrap: wrap; }
.oly-only-icons .btn-txt { display: none; }
.oly-grid th.sortable { cursor: pointer; }
.oly-find-en { width: 13px; height: 13px; margin-right: 6px; vertical-align: -1px; cursor: pointer; accent-color: var(--primary); }
.oly-filter-actions { display: flex; gap: 8px; padding: 4px 0 12px; }
.oly-iconpick { position: relative; display: flex; align-items: center; gap: 6px; }
.oly-iconpick-prev { font-size: 20px; line-height: 1; width: 26px; flex: none; text-align: center; }
.oly-iconpick-input { flex: 1 1 auto; min-width: 60px; }
.oly-iconpick-btn { flex: none; }
.oly-iconpick-panel { display: none; position: fixed; z-index: 200; width: 300px; max-width: 92vw; padding: 8px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }
.oly-iconpick-panel.open { display: block; }
.oly-iconpick-search { width: 100%; margin-bottom: 6px; }
.oly-iconpick-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 2px; max-height: 200px; overflow-y: auto; }
.oly-iconpick-opt { display: flex; align-items: center; justify-content: center; padding: 5px 0; background: none; border: 0; border-radius: 6px; cursor: pointer; color: var(--text); }
.oly-iconpick-opt:hover { background: var(--primary-soft); }
.oly-iconpick-opt svg { width: 20px; height: 20px; }
.oly-ico { display: inline-flex; align-items: center; vertical-align: -3px; }
.oly-ico svg { width: 18px; height: 18px; }
.oly-nav .ico .oly-ico svg { width: 17px; height: 17px; }
.oly-btn .oly-ico { vertical-align: middle; }
.oly-btn .oly-ico svg { width: 15px; height: 15px; }
.oly-btn--sm .oly-ico svg { width: 14px; height: 14px; }
.cf-card { position: relative; height: calc(100dvh - 126px); min-height: 560px; max-height: calc(100dvh - 126px); display: flex; flex-direction: column; overflow: hidden; }
.cf-card > .oly-flex.oly-mt { margin-top: auto; }
.cf-card > .oly-stickyfoot { flex: 0 0 auto; }
#cf-visual-pane { flex: 1 1 auto; min-height: 360px; overflow: hidden; }
#cf-print-pane { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; padding-right: 8px; }
#cf-hint { flex: 0 0 auto; min-height: 0; margin: 6px 0 0; padding: 0 2px 8px; font-size: 12px; line-height: 1.35; }
.cf-code-tabs { align-items: flex-end; gap: 2px; border-bottom: 1px solid var(--border); min-height: 38px; }
.cf-code-tabs .tab {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 36px; padding: 8px 14px; border: 1px solid transparent; border-bottom-width: 2px; border-radius: 8px 8px 0 0;
}
.cf-code-tabs .tab.active { background: color-mix(in oklab, var(--primary) 8%, transparent); border-color: color-mix(in oklab, var(--primary) 18%, transparent); border-bottom-color: var(--primary); }
.cf-card > .oly-codewrap { flex: 1 1 auto; min-height: 0; overflow: hidden; }
.cf-card > .oly-codewrap .oly-codehl,
.cf-card > .oly-codewrap textarea.oly-codeta { height: 100%; min-height: 0; max-height: none; white-space: pre-wrap; overflow-wrap: anywhere; }
.cf-card > .oly-codewrap textarea.oly-codeta,
.block-code-modal .oly-codewrap textarea.oly-codeta {
  display: block;
  width: 100%;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: auto !important;
  resize: none !important;
  white-space: pre-wrap !important;
  overflow-wrap: anywhere !important;
  word-break: normal;
  color: transparent !important;
  caret-color: #e6edf3 !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  -webkit-overflow-scrolling: touch;
}
.cf-card > .oly-codewrap textarea.cf-code-editor { height: 100% !important; min-height: 0 !important; }
.admin-code-editor,
.cf-code-editor {
  height: calc(100dvh - 430px);
  min-height: 520px;
  max-height: none;
}
/* pt-card: ίδια συμπεριφορά με τις άλλες φόρμες (cf-card) — η σελίδα κυλάει και το
   save bar (oly-stickyfoot) μένει πάντα κάτω, ορατό σε ΟΛΑ τα tabs. */
.pt-card { height: calc(100dvh - 126px); min-height: 560px; max-height: calc(100dvh - 126px); overflow: hidden; }
.pt-card .pt-pane { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; padding-right: 10px; }
/* Λίστα πεδίων (placeholders) στην καρτέλα Template: δικό της scroll ώστε να μη σπρώχνει
   κάτω τον code editor όταν έχει πολλά πεδία. */
.pt-chips { max-height: 124px; overflow-y: auto; overflow-x: hidden; align-content: flex-start;
  border: 1px solid var(--border); border-radius: var(--radius); padding: 8px; background: var(--surface2); }
/* Print Templates builder: toolbar (layouts + blocks) + split editor/preview */
.pt-design-tools { align-items: center; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
/* Ύψος ώστε ο editor+preview να χωράνε στην οθόνη χωρίς να βγαίνει κάτω το save bar */
.pt-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; align-items: stretch;
  height: calc(100dvh - 390px); min-height: 300px; }
.pt-split.pt-no-preview { grid-template-columns: 1fr; }       /* editor full width */
.pt-split.pt-no-preview .pt-preview-col { display: none; }
.pt-edit-col, .pt-preview-col { min-width: 0; display: flex; flex-direction: column; min-height: 0; }
.pt-edit-col .oly-codewrap { flex: 1 1 auto; min-height: 0; }
.pt-edit-col textarea.pt-code-editor { height: 100%; min-height: 0; max-height: none; resize: none; }
.pt-preview-head { font-size: 12px; font-weight: 650; color: var(--muted); margin-bottom: 6px; align-items: center; }
.pt-preview { flex: 1 1 auto; width: 100%; min-height: 0; border: 1px solid var(--border);
  border-radius: var(--radius); background: #eceef1; display: block; }
@media (max-width: 1100px) {
  .pt-split { grid-template-columns: 1fr; height: auto; }
  .pt-edit-col textarea.pt-code-editor { height: 360px; }
  .pt-preview { height: 420px; flex: none; }
}
.pt-code-editor { height: calc(100dvh - 475px); min-height: 300px; max-height: 470px; }
.rf-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 2px 0 10px; border-bottom: 1px solid var(--border); }
.rf-tab {
  border: 0; background: transparent; color: var(--muted); padding: 8px 10px;
  border-radius: 8px 8px 0 0; font: inherit; font-size: 12.5px; font-weight: 650; cursor: pointer;
}
.rf-tab.active { color: var(--primary); background: var(--primary-soft); }
.rf-pane-wrap { height: calc(100dvh - 365px); min-height: 430px; max-height: none; overflow: hidden; }
.rf-pane { display: none; max-height: 100%; overflow-y: auto; overflow-x: hidden; padding: 0 14px 2px 0; }
.rf-pane.active { display: block; }
.rf-section-title { font-weight: 700; font-size: 12px; margin: 8px 0 8px; color: var(--primary); text-transform: uppercase; letter-spacing: .06em; }
.rf-sql-code { min-height: calc(100dvh - 520px); }
.admin-fill-card { min-height: calc(100dvh - 126px); display: flex; flex-direction: column; }
.admin-scroll { flex: 1 1 auto; min-height: 0; max-height: calc(100dvh - 270px); overflow: auto; }
.platform-readiness {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 14px; border: 1px solid var(--border); border-radius: 8px;
  background: var(--surface2); margin-bottom: 12px;
}
.platform-readiness b { display: block; font-size: 15px; color: var(--text); }
.platform-readiness span { color: var(--muted); }
.platform-readiness-score { font-size: 28px; font-weight: 800; color: var(--primary); white-space: nowrap; }
.platform-readiness-score small { font-size: 12px; color: var(--muted); margin-left: 2px; }
.platform-readiness--ready {
  border-color: #8dd6aa; border-color: light-dark(#8dd6aa, color-mix(in oklab, var(--ok) 58%, var(--border)));
  background: #effaf3; background: light-dark(#effaf3, color-mix(in oklab, var(--ok) 13%, var(--surface)));
}
.platform-readiness--attention {
  border-color: #f3c26b; border-color: light-dark(#f3c26b, color-mix(in oklab, var(--warn) 62%, var(--border)));
  background: #fff8e8; background: light-dark(#fff8e8, color-mix(in oklab, var(--warn) 14%, var(--surface)));
}
.platform-readiness--blocked {
  border-color: #f2a1a8; border-color: light-dark(#f2a1a8, color-mix(in oklab, var(--danger) 58%, var(--border)));
  background: #fff0f1; background: light-dark(#fff0f1, color-mix(in oklab, var(--danger) 13%, var(--surface)));
}
.platform-health-toolbar { margin: 12px 0 2px; gap: 10px; flex-wrap: wrap; }
.platform-health-row td { vertical-align: middle; }
.platform-health-clickable:hover { background: var(--primary-soft); }
.platform-health-actions { white-space: nowrap; }
.platform-health-open { margin-left: 6px; }
.platform-health-run { margin-left: 6px; }
.platform-map-toolbar { margin: 12px 0; gap: 8px; flex-wrap: wrap; }
.platform-map-grid { align-items: start; }
.platform-map-scroll { max-height: 420px; }
.platform-map-node { cursor: pointer; }
.platform-map-node:hover,
.platform-map-edge:hover { background: var(--primary-soft); }
.platform-map-edge td { vertical-align: middle; }
.platform-map-issues {
  border-color: #f3c26b; border-color: light-dark(#f3c26b, color-mix(in oklab, var(--warn) 62%, var(--border)));
  background: #fff8e8; background: light-dark(#fff8e8, color-mix(in oklab, var(--warn) 14%, var(--surface)));
}
.platform-map-issue {
  display: flex; align-items: center; gap: 10px; padding: 8px 0;
  border-top: 1px solid color-mix(in oklab, var(--warn) 24%, transparent);
  color: #60430b; color: light-dark(#60430b, var(--text));
}
.platform-map-issue:first-of-type { border-top: 0; }
.platform-map-issue > div { flex: 1; min-width: 0; }
.platform-apps-layout {
  display: grid; grid-template-columns: minmax(260px, 340px) 1fr;
  gap: 12px; align-items: start;
}
.platform-app-list { display: grid; gap: 8px; margin-top: 10px; }
.platform-app-card {
  display: flex; gap: 10px; align-items: flex-start; padding: 10px;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface2);
  cursor: pointer;
}
.platform-app-card:hover,
.platform-app-card.active { border-color: var(--primary); background: var(--primary-soft); }
.platform-app-dot { width: 12px; height: 12px; border-radius: 50%; flex: 0 0 auto; margin-top: 4px; }
.platform-app-card b { display: block; color: var(--text); }
.platform-app-card small { color: var(--muted); line-height: 1.35; }
.platform-app-picker { display: grid; gap: 12px; margin-top: 12px; }
.platform-app-group {
  border: 1px solid var(--border); border-radius: 8px; padding: 10px; background: var(--surface);
}
.platform-app-group-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.platform-app-objects {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px; max-height: 230px; overflow: auto;
}
@media (max-width: 1100px) {
  .platform-apps-layout { grid-template-columns: 1fr; }
}
.migration-hero {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 16px; border: 1px solid var(--border); border-radius: 8px;
  background: linear-gradient(135deg, var(--surface), var(--surface2));
  margin-bottom: 12px;
}
.migration-kicker { color: var(--primary); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.migration-hero h2 { margin: 3px 0 5px; font-size: 22px; line-height: 1.2; }
.migration-hero p { margin: 0; color: var(--muted); max-width: 760px; }
.migration-stage {
  min-width: 92px; padding: 10px 12px; border: 1px solid var(--border);
  border-radius: 8px; background: var(--surface); text-align: center;
}
.migration-stage b { display: block; font-size: 26px; color: var(--primary); line-height: 1; }
.migration-stage span { color: var(--muted); font-size: 12px; }
.migration-flow {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-bottom: 5px;
  position: sticky; top: 8px; z-index: 20; padding: 5px 0; background: var(--bg);
}
.migration-step {
  display: flex; align-items: center; gap: 9px; padding: 9px 10px;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface2);
  color: var(--muted); min-width: 0;
}
.migration-step b {
  width: 24px; height: 24px; border-radius: 50%; display: inline-flex;
  align-items: center; justify-content: center; background: var(--surface); color: var(--primary);
  border: 1px solid var(--border); flex: 0 0 auto;
}
.migration-step.is-active { border-color: var(--primary); background: var(--primary-soft); color: var(--text); font-weight: 650; }
.migration-step.is-complete { border-color: color-mix(in srgb, var(--primary) 38%, var(--border)); color: var(--text); }
.migration-step.is-complete b { background: var(--primary); color: #fff; border-color: var(--primary); }
.migration-stage-status { margin: 0 0 12px; color: var(--muted); font-size: 12px; font-weight: 650; }
.migration-note {
  display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px;
  border: 1px solid #f3c26b; border-color: light-dark(#f3c26b, color-mix(in oklab, var(--warn) 62%, var(--border)));
  border-radius: 8px; background: #fff8e8; background: light-dark(#fff8e8, color-mix(in oklab, var(--warn) 14%, var(--surface)));
  color: #60430b; color: light-dark(#60430b, var(--text)); margin-bottom: 12px;
}
.migration-note svg { width: 18px; height: 18px; margin-top: 1px; }
.migration-note b { display: block; color: #60430b; color: light-dark(#60430b, var(--text)); }
.migration-note span { display: block; line-height: 1.4; }
.migration-ai-choice {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 14px; align-items: center;
  padding: 12px; border: 1px solid var(--border); border-radius: 8px;
  background: var(--surface); margin-bottom: 12px;
}
.migration-ai-choice.is-on { border-color: var(--primary); background: var(--primary-soft); }
.migration-ai-choice.is-code-on {
  border-color: #f3c26b; border-color: light-dark(#f3c26b, color-mix(in oklab, var(--warn) 62%, var(--border)));
  background: #fff8e8; background: light-dark(#fff8e8, color-mix(in oklab, var(--warn) 14%, var(--surface)));
}
.migration-ai-main { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.migration-ai-main b { display: block; color: var(--text); margin-bottom: 2px; }
.migration-ai-main span { display: block; color: var(--muted); line-height: 1.4; }
.migration-ai-code {
  grid-column: 1 / -1; display: flex; align-items: flex-start; gap: 9px;
  padding: 10px; border: 1px solid var(--border); border-radius: 8px;
  background: var(--surface); cursor: pointer;
}
.migration-ai-code input { margin-top: 3px; }
.migration-ai-code b { display: block; color: var(--text); }
.migration-ai-code small { display: block; color: var(--muted); line-height: 1.35; }
.migration-ai-choice.is-code-on .migration-ai-code {
  border-color: #f3c26b; border-color: light-dark(#f3c26b, color-mix(in oklab, var(--warn) 62%, var(--border)));
  background: #fff8e8; background: light-dark(#fff8e8, color-mix(in oklab, var(--warn) 14%, var(--surface)));
}
.migration-ai-state {
  grid-column: 1 / -1; padding-top: 8px; border-top: 1px solid var(--border);
  color: var(--muted); font-size: 12px; line-height: 1.4;
}
.migration-ai-choice.is-on .migration-ai-state { color: var(--primary); }
.migration-ai-report {
  display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
  margin-bottom: 12px;
}
.migration-ai-report > div { min-width: 0; }
.migration-ai-report b { display: block; color: var(--text); margin-bottom: 2px; }
.migration-ai-report span:not(.oly-badge) { display: block; color: var(--muted); line-height: 1.4; }
.migration-source-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: stretch;
}
.migration-source-grid.is-locked { display: none; }
.migration-source-summary { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface2); }
.migration-source-summary b { margin-right: auto; min-width: 0; overflow-wrap: anywhere; }
.migration-top-action { position: sticky; top: 68px; z-index: 19; display: flex; justify-content: flex-end; min-height: 0; margin: 0 0 10px; padding: 4px 0; background: var(--bg); }
.migration-top-action .oly-btn { box-shadow: 0 3px 10px rgba(15,23,42,.12); }
.migration-source-card {
  position: relative; display: flex; flex-direction: column; gap: 10px;
  padding: 14px; border: 1px solid var(--border); border-radius: 8px;
  background: var(--surface); min-width: 0;
}
.migration-source-card--recommended { border-color: var(--primary); box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 18%, transparent); }
.migration-source-icon {
  width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 8px; background: var(--primary-soft); color: var(--primary);
}
.migration-source-icon svg { width: 20px; height: 20px; }
.migration-source-card h3 { margin: 0 0 4px; font-size: 16px; }
.migration-source-card p { margin: 0; color: var(--muted); line-height: 1.4; }
.migration-source-card .oly-input { width: 100%; }
.migration-source-badge {
  position: absolute; top: 10px; right: 10px; padding: 3px 7px;
  border-radius: 999px; background: var(--primary); color: #fff; font-size: 11px; font-weight: 700;
}
.migration-source-badge--soft { background: var(--surface2); color: var(--muted); border: 1px solid var(--border); }
.migration-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: auto; }
.migration-file-name { min-height: 18px; color: var(--muted); font-size: 12px; }
.migration-result { margin-top: 12px; min-width: 0; max-width: 100%; overflow: hidden; }
.migration-result .oly-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.migration-result .oly-grid-2 > *,
.migration-result .oly-grid-4 > *,
.migration-result .oly-card,
.migration-result table,
.migration-result td { min-width: 0; max-width: 100%; }
.migration-result td { overflow-wrap: anywhere; word-break: break-word; }
.migration-result code { white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word; }
.migration-result #migration-normalize-run,
.migration-result #migration-install-preview,
.migration-result #migration-install-run { display: none !important; }
.migration-detected-grid .migration-confidence { width: 62px; min-width: 62px; white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.migration-detected-grid .migration-confidence b { white-space: nowrap; }
.migration-empty {
  display: flex; align-items: center; gap: 12px; padding: 18px;
  border: 1px dashed var(--border); border-radius: 8px; background: var(--surface2); color: var(--muted);
}
.migration-empty b { display: block; color: var(--text); margin-bottom: 2px; }
.migration-empty span { display: block; line-height: 1.4; }
.migration-empty-icon {
  width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 8px; background: var(--surface); color: var(--primary); border: 1px solid var(--border);
  flex: 0 0 auto;
}
.migration-report-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 14px; border: 1px solid var(--border); border-radius: 8px;
  background: var(--surface2); margin-bottom: 12px;
}
.migration-report-head > div:first-child { min-width: 0; overflow-wrap: anywhere; }
.migration-report-head .platform-readiness-score { flex: 0 0 auto; }
.migration-report-head b { display: block; margin-top: 5px; font-size: 15px; color: var(--text); }
.migration-report-head small { display: block; margin-top: 2px; color: var(--muted); line-height: 1.4; }
.migration-next-list { margin: 0 0 10px 18px; padding: 0; color: var(--muted); line-height: 1.5; }
.migration-object-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 10px 0; }
.migration-object-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.migration-object-group { border: 1px solid var(--border); border-radius: 8px; min-width: 0; overflow: hidden; }
.migration-object-group:first-child { grid-row: span 2; }
.migration-object-group:first-child { display: flex; flex-direction: column; min-height: 0; }
.migration-object-head { display: flex; align-items: center; gap: 6px; padding: 8px 10px; background: var(--surface2); border-bottom: 1px solid var(--border); min-width: 0; flex-wrap: wrap; }
.migration-object-head > b { margin-right: auto; min-width: 120px; overflow-wrap: anywhere; }
.migration-object-list { max-height: 290px; overflow: auto; padding: 5px; }
.migration-object-group:first-child .migration-object-list { max-height: none; flex: 1 1 auto; min-height: 0; }
.migration-object-row { display: flex; align-items: flex-start; gap: 8px; padding: 6px; border-radius: 6px; cursor: pointer; min-width: 0; }
.migration-object-row:hover { background: var(--surface2); }
.migration-object-row input { margin-top: 2px; flex: 0 0 auto; }
.migration-object-row span { min-width: 0; }
.migration-object-row b, .migration-object-row small { display: block; overflow-wrap: anywhere; }
.migration-object-row small { color: var(--muted); margin-top: 1px; }
.migration-form-object { border-bottom: 1px solid var(--border); }
.migration-form-object:last-child { border-bottom: 0; }
.migration-form-object > summary { list-style-position: outside; margin-left: 20px; }
.migration-form-object > summary .migration-object-row { display: inline-flex; width: calc(100% - 10px); vertical-align: middle; }
.migration-field-list { margin-left: 22px; padding: 0 4px 5px; border-left: 2px solid var(--border); }
@media (max-width: 1100px) {
  .migration-source-grid { grid-template-columns: 1fr; }
  .migration-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .migration-result .oly-grid-2 { grid-template-columns: 1fr; }
  .migration-object-grid { grid-template-columns: 1fr; }
  .migration-object-group:first-child { grid-row: auto; }
  .migration-object-group:first-child .migration-object-list { max-height: 290px; }
}
@media (max-width: 720px) {
  .migration-hero { align-items: flex-start; flex-direction: column; }
  .migration-flow { grid-template-columns: 1fr; position: static; }
  .migration-ai-choice { grid-template-columns: 1fr; }
  .migration-report-head { align-items: flex-start; flex-direction: column; }
  .migration-object-head .oly-btn { flex: 1 1 auto; }
}
.platform-package-grid { align-items: start; }
.pkg-presets { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 14px; }
.pkg-choice-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px; }
.pkg-choice {
  display: flex; align-items: flex-start; gap: 10px; padding: 10px;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface2);
  cursor: pointer; min-width: 0;
}
.pkg-choice:hover { border-color: color-mix(in srgb, var(--primary) 45%, var(--border)); background: var(--primary-soft); }
.pkg-choice input { margin-top: 3px; flex: 0 0 auto; }
.pkg-choice-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pkg-choice-body small { color: var(--muted); line-height: 1.35; }
.pkg-choice--compact { padding: 8px 9px; }
.pkg-choice--inline { margin-top: 10px; }
.pkg-choice--disabled { cursor: default; opacity: .74; background: color-mix(in srgb, var(--surface2) 80%, var(--bg)); }
.pkg-choice--disabled:hover { border-color: var(--border); background: color-mix(in srgb, var(--surface2) 80%, var(--bg)); }
.pkg-object-toolbar { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.pkg-object-list {
  max-height: 210px; overflow: auto; border: 1px solid var(--border);
  border-radius: 8px; padding: 8px; background: var(--surface);
}
.pkg-summary {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  margin-top: 12px; padding: 10px 12px; border: 1px solid var(--border);
  border-radius: 8px; background: var(--surface2); color: var(--muted);
}
.pkg-summary b { color: var(--text); }
.pkg-deps { flex: 1 1 100%; display: grid; gap: 6px; padding-top: 8px; border-top: 1px solid var(--border); }
.pkg-deps > div { display: flex; gap: 6px; flex-wrap: wrap; }
.pkg-dep {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  padding: 6px 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
}
.pkg-dep small { color: var(--muted); }
.pkg-dep em { color: var(--muted); font-style: normal; font-size: 12px; }
.pkg-dropzone {
  width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; min-height: 132px; padding: 18px; border: 1px dashed var(--border);
  border-radius: 8px; background: var(--surface2); color: var(--text); cursor: pointer;
}
.pkg-dropzone:hover { border-color: var(--primary); background: var(--primary-soft); }
.pkg-dropzone svg { width: 28px; height: 28px; }
.pkg-dropzone span { color: var(--muted); }
.pkg-preview-card { border: 1px solid var(--border); border-radius: 8px; padding: 12px; background: var(--surface); }
.pkg-analysis {
  margin: 10px 0; padding: 10px 12px; border: 1px solid var(--border);
  border-radius: 8px; background: var(--surface2); color: var(--muted); display: grid; gap: 8px;
}
.pkg-analysis--warn {
  border-color: #f3c26b; border-color: light-dark(#f3c26b, color-mix(in oklab, var(--warn) 62%, var(--border)));
  background: #fff8e8; background: light-dark(#fff8e8, color-mix(in oklab, var(--warn) 14%, var(--surface)));
  color: #60430b; color: light-dark(#60430b, var(--text));
}
.pkg-analysis--bad {
  border-color: #f2a1a8; border-color: light-dark(#f2a1a8, color-mix(in oklab, var(--danger) 58%, var(--border)));
  background: #fff0f1; background: light-dark(#fff0f1, color-mix(in oklab, var(--danger) 13%, var(--surface)));
  color: #6e1722; color: light-dark(#6e1722, var(--text));
}
.pkg-analysis-row { display: grid; gap: 5px; }
.pkg-safety {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  margin-top: 10px; padding: 10px 12px; border: 1px solid var(--border);
  border-radius: 8px; background: var(--surface2); color: var(--muted);
}
.pkg-install-actions { gap: 8px; flex-wrap: wrap; }
.pkg-install-actions .oly-input { max-width: 280px; }
.resources-scroll { position: relative; isolation: isolate; }
.resources-scroll .res-grid thead,
.resources-scroll .res-grid thead tr {
  position: sticky; top: 0; z-index: 8; background: var(--surface2);
}
.resources-scroll .res-grid th {
  z-index: 9; background: var(--surface2); background-clip: border-box;
}
.resources-scroll .res-grid .oly-grid-actions-th { z-index: 10; }
.workflow-card .wf-toolbar { margin: 12px 0; gap: 8px; flex-wrap: wrap; }
.workflow-card .wf-row.is-overdue td {
  background: #fff8e8; background: light-dark(#fff8e8, color-mix(in oklab, var(--warn) 14%, var(--surface)));
}
.workflow-card .wf-row.is-overdue td:first-child {
  border-left: 3px solid #f3c26b; border-left-color: light-dark(#f3c26b, color-mix(in oklab, var(--warn) 62%, var(--border)));
}
.db-card { height: calc(100dvh - 126px); min-height: 560px; max-height: calc(100dvh - 126px); overflow: hidden; }
.db-head, .db-subbar { flex: 0 0 auto; gap: 8px; margin-bottom: 8px; }
.db-pane { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.db-pane[style*="display:none"] { display: none !important; }
.db-empty { flex: 1 1 auto; min-height: 0; padding: 10px; }
.db-scroll { max-height: none; width: 100%; }
.db-cell { min-width: 130px; font-size: 12px; padding: 5px 7px; }
.db-sql-code { min-height: 170px; flex: 0 0 auto; }
.db-sql-out { flex: 1 1 auto; min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
.db-result-scroll { max-height: none; width: 100%; }
.db-col-head { display: flex; align-items: center; gap: 8px; justify-content: space-between; margin: 10px 0; }
.db-col-list { display: flex; flex-direction: column; gap: 8px; }
.db-col-row { display: grid; grid-template-columns: minmax(150px, 1.2fr) minmax(120px, .8fr) 90px auto auto auto minmax(120px, .8fr) auto; gap: 8px; align-items: center; }
@media (max-width: 900px) {
  .db-col-row { grid-template-columns: 1fr 1fr; }
  .db-col-row .oly-btn--danger { justify-self: start; }
}
.audit-card { padding-bottom: 0; }
.audit-scroll { flex: 1 1 auto; min-height: 0; max-height: none; overflow: auto; }
.audit-pager { position: sticky; bottom: 0; z-index: 4; background: var(--surface); border-top: 1px solid var(--border); margin: 0 -18px; padding: 10px 18px; }
.admin-settings .set-pane { flex: 1 1 auto; min-height: 0; max-height: calc(100dvh - 285px); overflow-y: auto; overflow-x: hidden; padding-right: 12px; }
.admin-settings .set-pane > .oly-fields > .oly-help,
.admin-settings .set-pane > .oly-fields > .oly-flex,
.admin-settings .set-pane > .oly-fields > .settings-feature-notice {
  flex: 1 0 100%;
  width: 100%;
  min-width: 0;
}
.startup-box {
  grid-column: 1 / -1; border: 1px solid var(--border); border-radius: var(--radius);
  background: var(--surface2); padding: 12px; margin-bottom: 10px;
}
.startup-box__title { font-weight: 700; margin-bottom: 4px; }
.startup-box__fields { margin-top: 10px; }
.admin-theme-grid { align-items: stretch; }
.admin-theme-grid .th-card {
  margin-top: 0 !important;
  min-height: 104px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
/* Sticky footer κουμπιών σε μεγάλες φόρμες (Save/Delete μένουν πάντα ορατά) */
.oly-stickyfoot { position: sticky; bottom: 0; z-index: 5; margin: 14px -18px -18px; padding: 12px 18px; background: var(--surface); border-top: 1px solid var(--border); border-radius: 0 0 var(--radius) var(--radius); }
.oly-modal .body .oly-stickyfoot, .oly-over .body .oly-stickyfoot { margin-left: -20px; margin-right: -20px; }
.oly-x-btn { position: absolute; top: 9px; right: 12px; z-index: 5; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; line-height: 0; border: 1px solid var(--border); background: var(--surface2); color: var(--muted); border-radius: 9px; cursor: pointer; transition: all .12s; }
.oly-x-btn:hover { color: var(--danger); border-color: var(--danger); background: var(--surface); }
.oly-x-btn .oly-ico svg { width: 16px; height: 16px; }
/* Admin Studio — αριστερό κάθετο μενού */
.oly-admin { display: grid; grid-template-columns: 220px 1fr; gap: var(--gap); align-items: start; }
.oly-admin-nav { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 8px; position: sticky; top: 12px; }
.oly-admin-brand { display: flex; align-items: center; gap: 8px; font-weight: 750; font-size: 13px; padding: 6px 8px 10px; color: var(--text); border-bottom: 1px solid var(--border); margin-bottom: 6px; }
.oly-admin-brand .oly-ico svg { width: 16px; height: 16px; }
.oly-admin-link { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 9px; color: var(--muted); font-size: 13.5px; font-weight: 500; margin-bottom: 2px; transition: background .12s, color .12s; }
.oly-admin-link:hover { background: var(--surface2); color: var(--text); }
.oly-admin-link.active { background: var(--primary-soft); color: var(--primary); font-weight: 650; }
.oly-admin-link .ico { display: inline-flex; width: 18px; justify-content: center; }
.oly-admin-link .ico svg { width: 17px; height: 17px; }
.oly-admin-main { min-width: 0; }
.oly-admin-toggle { margin-left: auto; width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border); background: var(--surface2); border-radius: 7px; color: var(--muted); cursor: pointer; }
.oly-admin-toggle:hover { color: var(--text); }
.oly-admin-toggle .oly-ico svg { width: 15px; height: 15px; }
.oly-field-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 14px 0 10px; border-bottom: 1px solid var(--border); }
.oly-field-tabs button {
  border: 0; background: transparent; color: var(--muted); padding: 8px 10px;
  border-radius: 8px 8px 0 0; font: inherit; font-size: 12.5px; font-weight: 650; cursor: pointer;
}
.oly-field-tabs button.active { color: var(--primary); background: var(--primary-soft); }
.oly-field-pane { display: none; min-height: min(42vh, 430px); max-height: min(42vh, 430px); overflow-y: auto; overflow-x: hidden; padding: 0 14px 2px 0; }
.oly-field-pane.active { display: block; }
.oly-modal.lg .body:has(.oly-field-tabs) { max-height: 78vh; padding-right: 28px; }
.oly-field-basic {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 0 14px;
  align-items: end;
  padding-right: 18px;
}
.oly-field-basic .oly-shell { width: 100% !important; }
.fb-title { grid-column: 1 / span 6; }
.fb-name { grid-column: 7 / span 5; }
.fb-type { grid-column: 1 / span 3; }
.fb-data { grid-column: 4 / span 4; }
.fb-order { grid-column: 8 / span 2; }
.fb-vis { grid-column: 10 / span 2; }
.field-data-box { display: grid; gap: 7px; }
.field-unbound-row { display: flex; justify-content: flex-start; min-height: 24px; align-items: center; }
.field-unbound-switch { min-height: 24px; }
.df-prop-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 2px 0 10px; border-bottom: 1px solid var(--border); }
.df-prop-tab {
  border: 0; background: transparent; color: var(--muted); padding: 8px 10px;
  border-radius: 8px 8px 0 0; font: inherit; font-size: 12.5px; font-weight: 650; cursor: pointer;
}
.df-prop-tab.active { color: var(--primary); background: var(--primary-soft); }
.df-prop-wrap { height: calc(100dvh - 380px); min-height: 430px; max-height: none; overflow: hidden; }
.df-prop-pane { display: none; max-height: 100%; overflow-y: auto; overflow-x: hidden; padding: 0 14px 2px 0; }
.df-prop-pane.active { display: block; }
/* DataForm property tabs: τακτοποιημένο responsive πλέγμα. ΜΟΝΟ εδώ — όχι σε άλλους
   editors (που έχουν δικά τους layouts) ούτε στις φόρμες των χρηστών. */
.df-prop-pane .oly-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px 18px;
  align-items: start;
}
.df-prop-pane .oly-fields > .oly-shell { width: auto !important; margin-bottom: 0; }
.df-prop-pane .oly-fields > .oly-shell--full,
.df-prop-pane .oly-fields > .oly-help { grid-column: 1 / -1; }
/* Μπλε τίτλοι υπο-ενοτήτων μέσα σε panels (επαναχρησιμοποιήσιμο) */
.df-prop-section {
  grid-column: 1 / -1; flex-basis: 100%; width: 100%; box-sizing: border-box;
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: var(--primary); margin: 16px 0 4px; padding-top: 10px;
  border-top: 1px solid var(--border);
}
.df-prop-section:first-child { margin-top: 2px; padding-top: 0; border-top: 0; }
.df-rules-panel {
  display: grid;
  gap: 12px;
  padding: 4px 0 10px;
}
.df-rules-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.df-rule-grid-head,
.df-rule-row {
  display: grid;
  grid-template-columns: minmax(160px, 1.2fr) minmax(145px, 1fr) 44px minmax(160px, 1.2fr) minmax(110px, .8fr) minmax(120px, 1fr) 42px;
  gap: 8px;
  align-items: center;
}
.df-rule-grid-head {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 0 2px;
}
.df-rule-row {
  padding: 8px;
  margin-bottom: 8px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.df-rule-when {
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}
.df-auto-panel { display: grid; gap: 16px; }
.df-auto-band {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface2);
  padding: 10px;
}
.df-action-head,
.df-action-row {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) 120px minmax(100px, .8fr) 135px minmax(140px, 1fr) minmax(150px, 1.2fr) 42px;
  gap: 8px;
  align-items: center;
}
.df-expr-head,
.df-expr-row {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(260px, 2fr) 130px 42px;
  gap: 8px;
  align-items: center;
}
.df-saveaction-head,
.df-saveaction-row {
  display: grid;
  grid-template-columns: 140px minmax(220px, 1.4fr) minmax(190px, 1fr) minmax(150px, 1fr) 42px;
  gap: 8px;
  align-items: center;
}
.df-summary-head,
.df-summary-row {
  display: grid;
  grid-template-columns: minmax(190px, 1.3fr) minmax(150px, 1fr) minmax(170px, 1fr) 72px 42px;
  gap: 8px;
  align-items: center;
}
.df-summary-head { color: var(--muted); font-size: 11px; font-weight: 700; text-transform: uppercase; padding: 8px 2px 6px; }
.df-summary-row { margin-bottom: 8px; }
.df-action-head,
.df-expr-head,
.df-saveaction-head {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 4px 2px 6px;
}
.df-action-row,
.df-expr-row,
.df-saveaction-row {
  padding: 8px;
  margin-bottom: 8px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.df-event-grid { display: grid; gap: 8px; }
.df-event-card {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  padding: 0;
}
.df-event-card summary {
  cursor: pointer;
  padding: 10px 12px;
  font-weight: 700;
}
.df-event-card summary span { display: grid; gap: 2px; }
.df-event-card summary small { color: var(--muted); font-weight: 500; }
.df-event-card > div,
.df-event-card > textarea,
.df-event-card > .oly-codewrap { margin: 0 12px 12px; }
.df-event-specific-help {
  line-height: 1.45;
  margin: 0 12px 10px;
}
.df-event-tools {
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 12px 10px;
}
.df-event-tools .df-event-recipe {
  max-width: 320px;
}
.df-drag-handle { display: inline-flex; width: 22px; height: 24px; align-items: center; justify-content: center; color: var(--muted); vertical-align: middle; cursor: grab; overflow: hidden; }
.df-grip-dot {
  width: 14px; height: 18px; display: inline-block; opacity: .9;
  background-image: radial-gradient(currentColor 1.5px, transparent 1.7px);
  background-size: 7px 6px; background-position: 0 0;
}
.df-row.dragging, .df-layout-row.dragging { opacity: .55; }
.df-layout-tabs { display: flex; gap: 6px; margin: 0 0 12px; border-bottom: 1px solid var(--border); }
.df-layout-tabs button {
  border: 0; background: transparent; color: var(--muted); padding: 8px 10px;
  border-radius: 8px 8px 0 0; font: inherit; font-size: 12.5px; font-weight: 650; cursor: pointer;
}
.df-layout-tabs button.active { color: var(--primary); background: var(--primary-soft); }
.df-layout-pane { display: none; min-height: min(56vh, 560px); }
.df-layout-pane.active { display: block; }
.oly-modal.lg.df-layout-modal { max-width: min(1180px, calc(100vw - 36px)); }
.oly-modal.lg.df-layout-modal .body { max-height: 78vh; }
.df-layout-toolbar { margin: 0 0 10px; }
.df-struct-box { border: 1px solid var(--border); border-radius: 8px; background: var(--surface); padding: 12px; margin-bottom: 12px; }
.df-struct-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.df-struct-head > div { display: flex; gap: 6px; align-items: center; min-width: min(420px, 55%); }
.df-struct-new { min-width: 0; }
.df-struct-list { display: flex; flex-wrap: wrap; gap: 7px; }
.df-struct-item {
  display: inline-flex; align-items: center; gap: 7px; padding: 5px 6px 5px 10px;
  border: 1px solid hsl(var(--df-layout-hue) 84% 50% / .28);
  border-left: 4px solid hsl(var(--df-layout-hue) 72% 52%);
  border-radius: 8px;
  background: linear-gradient(90deg, hsl(var(--df-layout-hue) 80% 52% / .15), var(--surface) 70%);
  font-size: 12.5px;
}
.df-struct-item span { color: hsl(var(--df-layout-hue) 75% 35%); font-weight: 650; }
.df-struct-item .oly-btn { padding: 3px 6px; }
.df-layout-list { display: grid; gap: 7px; max-height: min(64vh, 620px); overflow: auto; padding-right: 8px; }
.df-layout-row {
  display: grid; grid-template-columns: 28px minmax(170px, 1.25fr) minmax(130px, .9fr) minmax(150px, 1fr) 124px 96px 96px minmax(130px, .8fr);
  gap: 8px; align-items: center; padding: 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
  border-left-width: 4px; border-left-color: transparent; transition: background .12s, border-color .12s, box-shadow .12s;
}
.df-layout-row.is-grouped {
  border-left-color: hsl(var(--df-layout-hue) 72% 52%);
  background: linear-gradient(90deg, hsl(var(--df-layout-hue) 80% 52% / .13), var(--surface) 42%);
}
.df-layout-row.is-grouped + .df-layout-row.is-grouped { margin-top: -2px; }
.df-layout-row.dragging { box-shadow: 0 10px 30px -18px hsl(var(--df-layout-hue) 60% 35% / .7); }
.df-layout-handle { display: inline-flex; justify-content: center; color: var(--muted); cursor: grab; overflow: hidden; }
.df-layout-name { min-width: 0; display: grid; gap: 2px; }
.df-layout-name b, .df-layout-name span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.df-layout-name span { color: var(--muted); font-size: 11.5px; }
.df-layout-badges { display: flex; flex-wrap: wrap; gap: 4px; min-height: 18px; }
.df-layout-chip { display: inline-flex; align-items: center; max-width: 100%; padding: 2px 6px; border-radius: 999px; font-size: 10.5px; line-height: 1.25; font-weight: 650; color: hsl(var(--df-layout-hue) 75% 35%); background: hsl(var(--df-layout-hue) 84% 50% / .13); border: 1px solid hsl(var(--df-layout-hue) 84% 50% / .25); }
.df-layout-chip.group { color: var(--text); background: hsl(var(--df-layout-hue) 60% 50% / .08); }
.df-layout-chip.mode { color: var(--muted); background: transparent; border-color: var(--border); }
.df-layout-row .oly-input { padding: 7px 9px; font-size: 13px; }
.df-layout-row .lo-mini { gap: 5px; min-width: 0; }
.df-layout-row .lo-mini .oly-switch-text { font-size: 11.5px; color: var(--muted); }
.field-unbound-switch .oly-switch-text { font-size: 12.5px; color: var(--muted); }
/* collapsed = icon rail (περισσότερος χώρος για editors) */
.oly-admin.collapsed { grid-template-columns: 58px 1fr; }
.oly-admin.collapsed .oly-admin-brand span { display: none; }
.oly-admin.collapsed .oly-admin-brand { justify-content: center; }
.oly-admin.collapsed .oly-admin-toggle { margin: 0; }
.oly-admin.collapsed .oly-admin-link .txt { display: none; }
.oly-admin.collapsed .oly-admin-link { justify-content: center; padding: 9px 0; }
@media (max-width: 820px) { .oly-admin { grid-template-columns: 1fr; } .oly-admin-nav { position: static; } }
/* Admin editors: split «λίστα + editor» — desktop 2 στήλες, mobile στοίβα */
.oly-split2 { display: grid; grid-template-columns: var(--split-w, 260px) minmax(0, 1fr); gap: var(--gap); position: relative; }
/* Collapsible αριστερή στήλη (object list) */
.oly-split-toggle {
  position: absolute; top: 18px; left: calc(var(--split-w, 260px) - 1px); z-index: 6;
  width: 18px; height: 38px; display: inline-flex; align-items: center; justify-content: center;
  padding: 0; border: 1px solid var(--border); border-left: 0; border-radius: 0 10px 10px 0; background: var(--surface);
  color: var(--muted); cursor: pointer; box-shadow: 2px 0 10px rgb(15 23 42 / .06); transition: left .18s, background .15s, color .15s, border-color .15s;
}
.oly-split-toggle:hover { color: var(--primary); background: var(--surface2); border-color: color-mix(in oklab, var(--primary) 35%, var(--border)); }
.oly-split-toggle svg { width: 13px; height: 13px; transition: transform .18s; }
.oly-split2.is-collapsed { grid-template-columns: 0 minmax(0, 1fr); }
.oly-split2.is-collapsed > :first-child:not(.oly-split-toggle) { width: 0; min-width: 0; padding: 0; border: 0; margin: 0; overflow: hidden; opacity: 0; pointer-events: none; }
.oly-split2.is-collapsed .oly-split-toggle {
  left: 0;
  border-left: 1px solid var(--border);
  border-radius: 10px;
}
.oly-split2.is-collapsed .oly-split-toggle svg { transform: rotate(180deg); }
.commtemplates-split .obj-list,
.commtemplates-split .obj-item {
  min-width: 0;
}
.commtemplates-split .comm-head {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.commtemplates-split .comm-head-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}
.commtemplates-split .comm-head-actions .oly-btn {
  white-space: nowrap;
}
.commtemplates-split .obj-item {
  width: 100%;
  overflow: hidden;
  text-align: left;
}
.commtemplates-split .obj-item b,
.commtemplates-split .obj-item small {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.commtemplates-split .obj-item small {
  line-height: 1.35;
}
.stores-page { display: grid; gap: 14px; }
.stores-card { min-width: 0; }
.stores-head { flex-wrap: wrap; gap: 8px; }
.stores-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  gap: 10px;
}
.store-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 12px;
  align-items: start;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface2);
}
.store-row-main {
  min-width: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}
.store-row-main b {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 96px;
}
.store-layout {
  min-width: 220px;
  flex: 1 1 280px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}
.store-row-actions { display: flex; gap: 5px; align-items: center; }
.store-use {
  grid-column: 1 / -1;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.store-used {
  grid-column: 1 / -1;
  font-size: 12px;
}
.store-used summary { cursor: pointer; color: var(--muted); }
.store-used > div { margin-top: 6px; }
.ds-admin-card { min-width: 0; }
.ds-admin-head { flex-wrap: wrap; gap: 8px; }
.ds-source-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 0;
  border-top: 1px solid var(--border);
}
.ds-source-main {
  min-width: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}
.ds-source-main > .oly-muted {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}
.ds-source-main code {
  color: var(--muted);
  background: var(--surface2);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 2px 5px;
  font-size: 11px;
}
.ds-source-actions {
  display: flex;
  align-items: center;
  gap: 5px;
}
@media (max-width: 900px) {
  /* minmax(0,1fr): επιτρέπει στη στήλη να συρρικνωθεί κάτω από το min-content των cards,
     αλλιώς ο editor «ξεχειλίζει» δεξιά και κόβεται (το body κρύβει το οριζόντιο overflow). */
  .oly-split2 {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto minmax(0, 1fr);
    column-gap: 8px;
    row-gap: 0;
  }
  .oly-split-toggle {
    position: static;
    justify-self: center;
    align-self: center;
    left: auto;
    top: auto;
    width: 38px;
    height: 18px;
    border: 1px solid var(--border);
    border-top: 0;
    border-radius: 0 0 10px 10px;
    margin: -1px 0 8px;
    box-shadow: 0 2px 10px rgb(15 23 42 / .06);
    transition: background .15s, color .15s, border-color .15s;
  }
  .oly-split-toggle svg { transform: rotate(90deg); }
  .oly-split2.is-collapsed {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 0 auto minmax(0, 1fr);
  }
  .oly-split2.is-collapsed > :first-child:not(.oly-split-toggle) {
    width: auto;
    height: 0;
    max-height: 0;
    min-height: 0;
  }
  .oly-split2.is-collapsed .oly-split-toggle {
    left: auto;
    border-left: 1px solid var(--border);
    border-top: 1px solid var(--border);
    border-bottom: 0;
    border-radius: 10px 10px 0 0;
    margin: 0 0 -1px;
  }
  .oly-split2.is-collapsed .oly-split-toggle svg { transform: rotate(-90deg); }
  /* Tab bars του admin: οριζόντιο scroll αντί για στρίμωγμα/wrap */
  .df-prop-tabs, .oly-field-tabs, .rf-tabs, .oly-tabs, .pt-tabs, .oly-field-tabs {
    flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: thin;
    touch-action: pan-x; overscroll-behavior-x: contain;
  }
  .df-prop-tabs > *, .oly-field-tabs > *, .rf-tabs > *, .oly-tabs > * { flex: 0 0 auto; white-space: nowrap; }

  /* Σε mobile: οι admin editors ΔΕΝ κλειδώνουν ύψος ούτε κρύβουν περιεχόμενο —
     ρέουν φυσικά και κυλάει η σελίδα (αλλιώς οι καρτέλες κόβονται χωρίς scroll). */
  .cf-card, .pt-card, .admin-fill-card, .df-prop-wrap, .rf-pane-wrap {
    height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important;
  }
  .df-prop-pane, .rf-pane,
  .admin-settings .set-pane, .oly-types-cats #tc-list, .roles-scroll {
    max-height: none !important; height: auto !important; overflow: visible !important;
  }
  /* Πίνακες admin (grids): ύψος ελεύθερο ώστε να κυλάει η σελίδα κάθετα, αλλά ΚΡΑΤΑΜΕ
     οριζόντιο scroll για φαρδιούς πίνακες — αλλιώς ξεχειλίζουν δεξιά και κόβονται χωρίς
     πρόσβαση (το body κρύβει το οριζόντιο overflow). */
  .admin-scroll, .audit-scroll, .users-scroll {
    max-height: none !important; height: auto !important;
    overflow-x: auto !important; overflow-y: visible !important; min-width: 0 !important;
  }
  .pt-split { height: auto !important; }
  .pt-preview { height: 360px; }
  .pt-code-editor, .cf-code-editor, .admin-code-editor { height: 300px; min-height: 220px; max-height: none; }
}
@media (max-width: 900px) {
  .df-layout-row { grid-template-columns: 24px 1fr 1fr; }
  .df-layout-name { grid-column: span 2; }
  .df-layout-row .lo-title { grid-column: 2 / span 2; }
}
.oly-cmdk .item .cmdk-ico { display: inline-flex; width: 18px; justify-content: center; }
.oly-panel { display: none; }
.oly-panel.open { display: block; animation: olyfade .15s ease-out; }
@keyframes olyfade { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }

/* edit slide-over */
.oly-over-back { position: fixed; inset: 0; background: rgb(8 10 25 / .42); z-index: 100; backdrop-filter: blur(2px); animation: olyfade .12s; }
.oly-over {
  position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: min(820px, 96vw); max-height: 92vh; z-index: 101;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); display: flex; flex-direction: column;
  box-shadow: 0 30px 80px -20px rgb(0 0 0 / .5); animation: olyzoom .15s ease-out;
}
@keyframes olyzoom { from { opacity: 0; } to { opacity: 1; } }
/* Custom date picker */
.oly-dp { position: relative; }
.oly-dp-disp { cursor: pointer; }
.oly-dp-pop { background: var(--surface); border: 1px solid var(--border); border-radius: calc(var(--radius) * .7); box-shadow: 0 18px 44px -12px rgb(0 0 0 / .4); padding: 10px; }
.oly-dp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; font-size: 13px; }
.oly-dp-head button { background: none; border: none; color: var(--text); font-size: 20px; cursor: pointer; padding: 0 8px; border-radius: 6px; }
.oly-dp-head button:hover { background: var(--primary-soft); }
.oly-dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.oly-dp-grid .dow { text-align: center; font-size: 10.5px; color: var(--muted); padding: 2px 0; }
/* Σταθερό ύψος (όχι aspect-ratio) ώστε το ύψος του popup να μετριέται σωστά στο 1ο άνοιγμα */
.oly-dp-grid .day { height: 32px; border: none; background: none; color: var(--text); border-radius: 7px; cursor: pointer; font-size: 12.5px; }
.oly-dp-grid .day:hover { background: var(--primary-soft); }
.oly-dp-grid .day.today { outline: 1px solid var(--primary); }
.oly-dp-grid .day.sel { background: var(--primary); color: #fff; }
.oly-dp-foot { display: flex; justify-content: space-between; margin-top: 8px; }
.oly-dp-foot button { background: none; border: 1px solid var(--border); color: var(--text); border-radius: 6px; padding: 4px 10px; cursor: pointer; font-size: 12px; }
.oly-dp-foot button:hover { background: var(--primary-soft); }
@media print { .oly-toolbar, .oly-sidebar, .oly-topbar { display: none !important; } .oly-report th { -webkit-print-color-adjust: exact; } }
.oly-tip-pop { max-width: 280px; background: var(--text); color: var(--bg); padding: 7px 10px; border-radius: 7px; font-size: 12px; line-height: 1.45; box-shadow: 0 10px 28px -8px rgb(0 0 0 / .45); pointer-events: none; }
.oly-tip { display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px; margin-left: 5px; border-radius: 50%; background: var(--primary-soft); color: var(--primary); font-size: 10px; font-weight: 700; cursor: help; vertical-align: middle; }
.oly-over.oly-over--full { width: 100vw; height: 100vh; max-height: 100vh; top: 0; left: 0; transform: none; border: none; border-radius: 0; }
.oly-over.oly-over--full .body { padding: 24px max(24px, calc((100vw - 1100px) / 2)); }
.oly-over .head { display: flex; align-items: center; gap: 10px; padding: 14px 20px; border-bottom: 1px solid var(--border); font-weight: 650; font-size: 15px; }
.oly-over .head .spacer { flex: 1; }
.oly-over .head .x { cursor: pointer; font-size: 20px; color: var(--muted); padding: 2px 8px; border-radius: 7px; }
.oly-over .head .x:hover { background: var(--primary-soft); }
.oly-over .body { padding: 20px; overflow-y: auto; flex: 1; }
.oly-over .foot { display: flex; gap: 9px; padding: 13px 20px; border-top: 1px solid var(--border); background: var(--surface2); }
.oly-over .foot .spacer { flex: 1; }

/* modal */
.oly-modal-back { position: fixed; inset: 0; background: rgb(8 10 25 / .45); z-index: 120; display: grid; place-items: center; padding: 18px; backdrop-filter: blur(2px); }
.oly-modal { position: relative; background: var(--surface); border-radius: var(--radius); width: 100%; max-width: 460px; box-shadow: 0 30px 80px -20px rgb(0 0 0 / .5); animation: olypop .14s ease-out; }
.oly-modal .head { padding-right: 52px; }
.oly-modal .foot .spacer { flex: 1; }
.oly-modal.md { max-width: 680px; }
.oly-modal.lg { max-width: 880px; }
@keyframes olypop { from { transform: scale(.96); opacity: 0; } to { transform: none; opacity: 1; } }
.oly-modal .head { padding: 15px 20px; font-weight: 650; border-bottom: 1px solid var(--border); display: flex; }
.oly-modal .head .spacer { flex: 1; }
.oly-modal .head .x { cursor: pointer; color: var(--muted); }
.oly-modal .body { padding: 18px 20px; max-height: 70vh; overflow-y: auto; overflow-x: hidden; }
.oly-modal .foot { display: flex; flex-wrap: wrap; gap: 9px; justify-content: flex-end; padding: 13px 20px; border-top: 1px solid var(--border); }
.oly-modal .foot .oly-btn { min-width: 0; max-width: 100%; }
.oly-modal.push-settings-modal .foot { align-items: center; }
.oly-modal.push-settings-modal .foot .spacer { min-width: 0; }
.oly-modal.object-modal { max-width: min(1120px, calc(100vw - 36px)); }
.oly-modal.object-modal .body { padding: 0; overflow: hidden; max-height: none; }
.oly-modal.object-modal .oly-object-frame { height: min(76vh, 820px); }
.oly-modal.object-modal--fullscreen {
  width: calc(100vw - 24px);
  height: calc(100vh - 24px);
  max-width: none;
  display: flex;
  flex-direction: column;
}
.oly-modal.object-modal--fullscreen .body { flex: 1; min-height: 0; }
.oly-modal.object-modal--fullscreen .oly-object-frame { height: 100%; }
.oly-object-frame { display: block; width: 100%; border: 0; background: var(--bg); }
.oly-object-fullscreen { position: fixed; inset: 0; z-index: 1100; background: var(--bg); display: flex; flex-direction: column; }
.oly-object-fullbar {
  height: 46px; flex: 0 0 auto; display: flex; align-items: center; gap: 12px;
  padding: 0 12px 0 18px; border-bottom: 1px solid var(--border); background: var(--surface);
}
.oly-object-fullbar strong { min-width: 0; flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.oly-object-fullscreen .oly-object-frame { flex: 1; min-height: 0; height: auto; }
.oly-embed { background: var(--bg); min-height: 100vh; }
.oly-embed-content { padding: 18px; }

/* toast */
.oly-toasts { position: fixed; bottom: 18px; right: 18px; z-index: 10000; display: flex; flex-direction: column; gap: 8px; }
.oly-toast {
  background: var(--text); color: var(--bg); padding: 11px 17px; border-radius: calc(var(--radius) * .8);
  box-shadow: 0 12px 32px -8px rgb(0 0 0 / .4); font-size: 13px; animation: olyslideup .18s ease-out;
  display: flex; align-items: center; gap: 12px;
}
.oly-toast.ok { background: var(--ok); color: #fff; }
.oly-toast.error { background: var(--danger); color: #fff; }
@keyframes olyslideup { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }

/* command palette */
.oly-cmdk-back { position: fixed; inset: 0; background: rgb(8 10 25 / .4); z-index: 300; backdrop-filter: blur(3px); display: none; }
.oly-cmdk { position: fixed; top: 14vh; left: 50%; transform: translateX(-50%); width: min(580px, 94vw); z-index: 301; display: none; }
.oly-cmdk.open, .oly-cmdk-back.open { display: block; }
.oly-cmdk .box { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 30px 90px -20px rgb(0 0 0 / .55); overflow: hidden; animation: olypop .13s; }
.oly-cmdk input { width: 100%; border: 0; outline: none; padding: 16px 18px; font: inherit; font-size: 15px; background: transparent; color: var(--text); }
.oly-cmdk .list { max-height: 320px; overflow-y: auto; border-top: 1px solid var(--border); }
.oly-cmdk .item { padding: 10px 18px; cursor: pointer; display: flex; gap: 10px; align-items: center; }
.oly-cmdk .item:hover, .oly-cmdk .item.sel { background: var(--primary-soft); }
.oly-cmdk .item .k { margin-left: auto; }

/* tabs */
.oly-tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--border); margin-bottom: 14px; overflow-x: auto; overflow-y: hidden; }
.oly-tabs .tab { padding: 9px 15px; cursor: pointer; font-weight: 600; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; text-decoration: none !important; }
.oly-tabs .tab.active { color: var(--primary); border-bottom-color: var(--primary); }
.oly-tabs .tab:hover { color: var(--text); }

/* code editor */
.oly-code {
  width: 100%; min-height: 280px; font-family: 'JetBrains Mono', ui-monospace, Consolas, monospace;
  font-size: 13px; line-height: 1.55; background: #0d1117 !important; color: #e6edf3 !important;
  border: 1px solid #30363d !important; border-radius: calc(var(--radius) * .6); padding: 13px;
  tab-size: 4; white-space: pre; outline: none; resize: vertical;
}
.oly-code:focus { border-color: var(--primary); }
pre.oly-code {
  min-height: auto; overflow: auto; text-shadow: none;
}
.oly-code::selection,
.oly-codewrap .oly-codehl ::selection,
.oly-codewrap textarea.oly-codeta::selection {
  background: rgba(56, 139, 253, .35);
}

/* Custom Form visual builder */
.cf-vb { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 14px; height: 100%; min-height: 0; overflow: hidden; }
.cf-vb-side {
  align-self: stretch; display: grid; gap: 10px; align-content: start; min-height: 0; overflow-y: auto; padding: 12px;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface2);
}
.cf-vb-side .oly-btn { justify-content: flex-start; min-width: 0; }
.cf-vb-side .oly-btn svg { flex: 0 0 auto; }
.cf-vb-group { display: grid; gap: 6px; padding-top: 8px; border-top: 1px solid var(--border); }
.cf-vb-group:first-of-type { border-top: 0; padding-top: 0; }
.cf-vb-group-title { font-size: 11px; font-weight: 750; text-transform: uppercase; color: var(--muted); letter-spacing: .04em; }
.cf-vb-main { min-width: 0; min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 12px; }
.cf-vb-toolbar {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 10px 12px;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
}
.cf-vb-toolbar > div:first-child { flex: 1 1 420px; min-width: 280px; }
.cf-vb-toolbar > span { display: none; }
.cf-vb-toolbar .oly-btn { flex: 0 0 auto; }
.cf-vb-list { min-height: 0; max-height: 100%; overflow-y: auto; overflow-x: hidden; display: flex; flex-direction: column; gap: 10px; padding-right: 8px; }
.cf-vb-row { flex: 0 0 auto; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); overflow: hidden; }
.cf-vb-row.dragging { opacity: .55; }
.cf-vb-row.drop-before { box-shadow: 0 -3px 0 var(--primary); }
.cf-vb-row.drop-after { box-shadow: 0 3px 0 var(--primary); }
.cf-vb-row-head { display: flex; align-items: center; gap: 8px; padding: 9px 10px; border-bottom: 1px solid var(--border); background: var(--surface2); }
.cf-vb-row > .oly-fields { padding: 12px; }
.cf-vb-row.is-collapsed .cf-vb-row-head { border-bottom: 0; }
.cf-vb-row.is-collapsed > .oly-fields { display: none; }
.cf-vb-row.is-collapsed { background: var(--surface2); }
.cf-vb-row select[multiple] { min-height: 96px; padding: 7px; }
.cf-vb-row select[multiple] option { padding: 5px 6px; border-radius: 5px; }
.cf-vb-pick { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 7px; background: var(--surface); cursor: pointer; flex: 0 0 auto; }
.cf-vb-pick input { margin: 0; }
.objtpl-list { display: grid; gap: 8px; }
.objtpl-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; align-items: center; padding: 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface2); }
.cf-vb-freecode { min-height: 180px; font-family: 'JetBrains Mono', ui-monospace, Consolas, monospace; font-size: 12.5px; line-height: 1.5; }
.cf-vb-manual-fields { display: grid; gap: 8px; width: 100%; }
.cf-vb-manual-row { display: grid; gap: 6px; padding: 7px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface2); }
.cf-vb-manual-row.has-source { border-color: var(--primary); }
.cf-vb-mf-main { display: grid; grid-template-columns: minmax(110px, 1fr) minmax(130px, 1.3fr) minmax(150px, 1fr) 34px; gap: 7px; align-items: center; }
.cf-vb-manual-row .cf-vb-mf-del { width: 34px; height: 34px; padding: 0; justify-content: center; }
.cf-vb-mf-source { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding-left: 2px; margin-top: 6px; }
.cf-vb-mf-source .cf-vb-mf-srcsel { min-width: 150px; }
.cf-vb-mf-source .cf-vb-mf-sqlbuild { width: 34px; height: 34px; padding: 0; justify-content: center; flex: 0 0 auto; }
.cf-vb-mf-val { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--border); }
.cf-vb-mf-val .oly-switch { flex: 0 0 auto; }
.cf-vb-mf-val .cf-vb-mf-vparam { max-width: 170px; }
.cf-vb-tabs-editor { display: grid; gap: 8px; width: 100%; }
.cf-vb-tabrow { display: grid; grid-template-columns: minmax(120px, 1fr) minmax(180px, 2fr) 34px; gap: 8px; align-items: start; }
.cf-vb-tabrow .cf-vb-tab-del { height: 34px; }
.oly-input--sm { padding: 5px 8px; font-size: 12.5px; height: 32px; }
.oly-invalid { border-color: var(--danger, #dc2626) !important; box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.15) !important; }
.cf-vform-grid input[type="color"], .cf-vform input[type="color"] { height: 40px; min-height: 40px; padding: 3px; width: 100%; cursor: pointer; }
.cf-vform-grid input[type="range"] { padding: 0; }
.block-code-modal .body { display: flex; flex-direction: column; max-height: min(78vh, 760px); overflow-y: auto; overflow-x: hidden; }
.block-code-modal .body > .oly-help,
.block-code-modal .block-code-tabs { flex: 0 0 auto; }
.block-code-modal .oly-codewrap { flex: 0 0 auto; height: min(54vh, 480px); min-height: 340px; max-height: calc(100vh - 300px); overflow: hidden; }
.block-code-modal .oly-codewrap .oly-codehl,
.block-code-modal .oly-codewrap textarea.oly-codeta,
.block-code-modal .block-code-ta { height: 100%; min-height: 0; max-height: none; resize: none; }
.block-code-modal .oly-codewrap .oly-codehl { overflow: hidden; z-index: 0; }
.block-code-modal .oly-codewrap textarea.oly-codeta { display: block; overflow: auto !important; z-index: 1; -webkit-overflow-scrolling: touch; }
.block-code-modal .oly-codewrap .oly-codehl,
.block-code-modal .oly-codewrap textarea.oly-codeta {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.cf-vb-title { min-width: 0; display: flex; align-items: baseline; gap: 8px; }
.cf-vb-title span { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cf-vb-title em { font-style: normal; font-size: 11px; color: var(--primary); background: var(--primary-soft); border: 1px solid color-mix(in oklab, var(--primary) 22%, var(--border)); border-radius: 999px; padding: 2px 7px; white-space: nowrap; }
.cf-vb-handle, .cf-vb-act {
  width: 30px; height: 30px; padding: 0; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--border); border-radius: 7px; background: transparent; color: var(--muted); cursor: grab;
  touch-action: none; user-select: none;
}
.cf-vb-act { cursor: pointer; }
.cf-vb-handle:hover, .cf-vb-act:hover { background: var(--primary-soft); color: var(--primary); }
.cf-vb-del:hover { background: color-mix(in oklab, var(--danger) 14%, transparent); color: var(--danger); border-color: color-mix(in oklab, var(--danger) 40%, var(--border)); }

@media (max-width: 900px) {
  .cf-vb { grid-template-columns: 1fr; }
  .cf-vb-side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cf-vb-side b, .cf-vb-side .oly-help { grid-column: 1 / -1; }
  .cf-vb-toolbar { align-items: flex-start; flex-wrap: wrap; }
  .cf-vb-mf-main { grid-template-columns: 1fr; }
  .cf-vb-manual-row.has-source .cf-vb-mf-main { grid-template-columns: 1fr; }
  .cf-vb-manual-row .oly-btn { width: 100%; }
}

/* details grid, folder, login, empty, misc */
.oly-details .oly-toolbar { margin-top: 4px; }
.oly-folder .item { display: flex; align-items: center; gap: 9px; padding: 6px 0; border-bottom: 1px dashed var(--border); }
.oly-empty { text-align: center; color: var(--muted); padding: 40px 16px; }
.oly-empty--inline { padding: 12px; background: var(--surface2); border-radius: calc(var(--radius) * .6); text-align: left; font-size: 12.5px; }
.oly-empty .big { font-size: 36px; margin-bottom: 8px; }
.oly-login {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px 14px;
  background:
    radial-gradient(900px 430px at 50% -20%, color-mix(in oklab, var(--primary-soft) 80%, transparent), transparent),
    var(--bg);
}
.oly-login .box { width: min(420px, 94vw); }
.oly-login-box {
  padding: 28px;
  border-radius: calc(var(--radius) * 1.1);
  box-shadow: 0 24px 80px -46px rgb(0 0 0 / .7);
}
.oly-login .brandrow {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: center;
  margin-bottom: 18px;
}
.oly-login .brandrow .logo {
  width: 46px;
  height: 46px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  font-size: 22px;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  color: #fff;
  font-weight: 800;
}
.oly-login .brandrow .logo.logo--wordmark {
  width: 190px;
  height: 64px;
  border-radius: 6px;
  background: transparent;
}
.oly-login .brandrow .logo.logo--wordmark.logo-bg--primary { background: var(--primary); }
.oly-login .brandrow .logo.logo--wordmark.logo-bg--surface { background: var(--surface); }
.oly-login .brandrow .logo.logo--wordmark img { object-fit: contain; }
.oly-login .brandrow .nm {
  font-size: 22px;
  font-weight: 750;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}
.oly-login-title {
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  margin: 0 0 6px;
}
.oly-login-sub {
  color: var(--muted);
  text-align: center;
  font-size: 13px;
  line-height: 1.45;
  margin: 0 0 16px;
}
.oly-login-submit {
  width: 100%;
  justify-content: center;
  margin-top: 4px;
}
.oly-login-submit.is-loading { opacity: .82; cursor: progress; }
.oly-login-msg {
  display: none;
  min-height: 20px;
  margin: 0 0 10px;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.35;
}
.oly-login-msg.show { display: block; }
.oly-login-msg.is-error {
  color: var(--danger);
  background: color-mix(in oklab, var(--danger) 12%, transparent);
  border: 1px solid color-mix(in oklab, var(--danger) 30%, transparent);
}
.oly-login-msg.is-ok {
  color: var(--ok, #16a34a);
  background: color-mix(in oklab, var(--ok, #16a34a) 12%, transparent);
  border: 1px solid color-mix(in oklab, var(--ok, #16a34a) 30%, transparent);
}
.oly-login-link {
  text-align: center;
  margin-top: 13px;
  font-size: 13px;
}
.oly-login-langs {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}
.oly-login-langs a {
  min-width: 34px;
  text-align: center;
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid var(--border);
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
}
.oly-login-langs a:hover, .oly-login-langs a.active {
  text-decoration: none;
  color: var(--primary);
  border-color: color-mix(in oklab, var(--primary) 60%, var(--border));
  background: var(--primary-soft);
}
.oly-muted { color: var(--muted); }
.oly-right { text-align: right; }
.oly-mt { margin-top: var(--gap); }
hr.oly-sep { border: 0; border-top: 1px solid var(--border); margin: 14px 0; }
.oly-chip-row { display: flex; flex-wrap: wrap; gap: 7px; }
.oly-ghost { background: var(--surface2) !important; }

@media (max-width: 900px) {
  .oly-sidebar {
    position: fixed;
    left: -260px;
    z-index: 150;
    transition: left .2s;
    height: 100dvh;
    padding-top: calc(48px + env(safe-area-inset-top, 0px));
  }
  .oly-sidebar .oly-brand { top: 0; }
  .oly-app.sb-open .oly-sidebar { left: 0; box-shadow: 20px 0 60px -20px rgb(0 0 0 / .5); }
  .oly-grid-2, .oly-grid-3, .oly-grid-4 { grid-template-columns: 1fr; }
  .dv-map { grid-template-columns: 1fr; }
  .oly-content--form-fullscreen .dv-map { overflow: auto; }
  .oly-content--form-fullscreen .dv-map-canvas { height: min(52dvh, 430px); min-height: 300px; }
  .oly-content--form-fullscreen .dv-map-list { height: auto; max-height: 38dvh; }
  .dv-gantt-row { grid-template-columns: 1fr; }
  .dv-kanban { grid-auto-columns: minmax(230px, 84vw); }
}
@media print {
  .oly-sidebar, .oly-topbar, .oly-toolbar, .oly-pager, .oly-over .foot { display: none !important; }
  .oly-card, .oly-grid-wrap { box-shadow: none; border: 0; }
}

/* ============ Fixes: clear-× overlap, number spinners, combo, time picker ============ */
/* Native number spinners πέφτουν πάνω στο clear-× → τα κρύβουμε (μένει το ×) */
.oly-num::-webkit-outer-spin-button, .oly-num::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.oly-num[type="number"] { -moz-appearance: textfield; appearance: textfield; }
/* Όταν υπάρχει κουμπί δεξιά (DataBound browse / DataList «όλα»), μετακίνησε το × αριστερά
   ώστε να μην καλύπτει το κουμπί (αλλιώς τα κλικ έπεφταν πάνω στο αόρατο ×). */
.oly-control:has(.oly-bound--browse) > .oly-clear,
.oly-bound--browse ~ .oly-clear { right: 52px; }
.oly-bound--browse .oly-bound-q { padding-right: 36px; }
/* το input να μην περνά κάτω από το × */
.oly-num, .oly-dp-disp { padding-right: 30px; }

/* Combo (custom dropdown: πολλαπλή επιλογή / live search) */
.oly-combo { display: flex; align-items: center; gap: 6px; min-height: 38px; width: 100%;
  padding: 4px 30px 4px 10px; border: 1px solid var(--border); border-radius: calc(var(--radius) * .6);
  background: var(--surface); color: var(--text); cursor: pointer; position: relative; }
.oly-combo:focus, .oly-combo:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); outline: none; }
.oly-combo-val { flex: 1; display: flex; flex-wrap: wrap; gap: 5px; align-items: center; min-width: 0; }
.oly-combo-ph { color: var(--muted); }
.oly-combo-caret { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: 12px; pointer-events: none; }
.oly-chip { display: inline-flex; align-items: center; gap: 4px; background: var(--primary-soft); color: var(--text);
  border-radius: 6px; padding: 2px 6px; font-size: 12.5px; line-height: 1.4; }
.oly-chip .x { cursor: pointer; font-style: normal; opacity: .6; }
.oly-chip .x:hover { opacity: 1; }
.oly-combo-pop { padding: 6px; }
.oly-combo-search { margin-bottom: 6px; }
.oly-combo-list { max-height: 260px; overflow: auto; }
.oly-combo-grp { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; padding: 6px 8px 2px; }
.oly-combo-opt { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 7px; cursor: pointer; font-size: 13px; }
.oly-combo-opt:hover { background: var(--primary-soft); }
.oly-combo-opt.sel { background: var(--primary-soft); font-weight: 600; }
.oly-combo-chk { width: 16px; text-align: center; color: var(--primary); }
.oly-combo-none { padding: 8px 10px; color: var(--muted); }

/* DateTime: γραμμή ώρας μέσα στο ημερολόγιο */
.oly-dp-time { display: flex; align-items: center; gap: 6px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border); font-size: 13px; }
.oly-dp-time span:first-child { color: var(--muted); margin-right: auto; }
.oly-dp-time select { width: auto; padding: 4px 6px; }

/* ===== Types editor (ανασχεδιασμένο) ===== */
.oly-types { display: grid; grid-template-columns: 300px 1fr; gap: var(--gap); align-items: start; }
.oly-types-cats #tc-list { display: flex; flex-direction: column; gap: 3px; flex: 1 1 auto; min-height: 0; overflow-y: auto; padding-right: 4px; }
.roles-scroll { flex: 0 0 auto; max-height: 220px; overflow: auto; }
.security-roles-scroll { flex: 1 1 auto; min-height: 0; max-height: none; overflow: auto; }
.users-scroll { max-height: calc(100dvh - 405px); }
.tc-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 9px; cursor: pointer; border: 1px solid transparent; }
.tc-item:hover { background: var(--surface2); }
.tc-item.active { background: var(--primary-soft); border-color: var(--primary); }
.tc-item .tc-name { flex: 1; font-weight: 600; }
.tc-item .oly-badge { background: var(--surface2); color: var(--muted); }
.tc-item.active .oly-badge { background: var(--primary); color: #fff; }
.oly-btn--xs { padding: 3px 6px; font-size: 12px; opacity: 0; transition: opacity .12s; }
.tc-item:hover .oly-btn--xs, .tc-item.active .oly-btn--xs { opacity: .85; }
.oly-types-tbl th { font-size: 12px; color: var(--muted); text-align: left; font-weight: 600; }
.oly-types-tbl td { vertical-align: middle; padding: 5px 6px; }
.oly-types-tbl .oly-input { padding: 7px 9px; }
.oly-color-cell { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
.oly-color-cell .ty-color { width: 42px; height: 32px; padding: 2px; }
.ty-iconcell .oly-iconpick { min-width: 180px; }
@media (max-width: 900px) { .oly-types { grid-template-columns: minmax(0, 1fr); } }

/* Time picker (popup ωρών/λεπτών) */
.oly-tp-pop { padding: 8px; }
.oly-tp { display: flex; gap: 8px; }
.oly-tp-col { flex: 1; max-height: 200px; overflow: auto; display: flex; flex-direction: column; gap: 2px; }
.oly-tp-i { border: none; background: none; color: var(--text); border-radius: 6px; padding: 6px; cursor: pointer; font-size: 13px; font-variant-numeric: tabular-nums; }
.oly-tp-i:hover { background: var(--primary-soft); }
.oly-tp-i.sel { background: var(--primary); color: #fff; }

/* Mobile readiness */
@media (max-width: 760px) {
  .migration-object-grid { grid-template-columns: 1fr; }
  .migration-object-group:first-child { grid-row: auto; }
  html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
  .oly-app, .oly-main, .oly-content, .oly-card, .oly-modal, .oly-over { min-width: 0; max-width: 100%; }
  .oly-content { padding: 10px; }
  .oly-card { padding: 12px; border-radius: 10px; }
  input, select, textarea, .oly-input, .oly-select, .oly-textarea { font-size: 16px !important; }

  .oly-topbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    gap: 6px;
    padding: 7px 9px;
    min-height: 48px;
    max-width: 100vw;
    overflow: hidden;
    z-index: 900;
  }
  .oly-main { padding-top: 48px; }
  .oly-topbar .burger { padding: 5px 7px; flex: 0 0 auto; }
  .oly-topbar .crumb { font-size: 13px; flex: 1 1 auto; min-width: 20px; }
  .oly-kbtn { width: 34px; height: 34px; padding: 0; flex: 0 0 auto; font-size: 0; gap: 0; }
  .oly-kbtn .oly-ico svg { width: 17px; height: 17px; }
  .oly-kbd { display: none; }
  .oly-userchip { gap: 0; flex: 0 0 auto; max-width: 34px; overflow: hidden; }
  .oly-userchip > :not(.oly-avatar-btn) { display: none; }
  .oly-avatar, .oly-iconbtn { width: 32px; height: 32px; min-width: 32px; }
  .oly-bell { padding: 5px; flex: 0 0 auto; }
  .oly-bell-panel, .oly-user-menu { left: 10px; right: 10px; top: 50px; width: auto; max-height: calc(100vh - 70px); }
  .oly-user-name { display: none; }

  .oly-toolbar, .oly-flex, .oly-pager, .oly-modal .foot, .oly-over .foot, .oly-stickyfoot {
    flex-wrap: wrap;
    align-items: stretch;
  }
  .oly-toolbar .spacer, .oly-pager .spacer, .oly-modal .foot .spacer, .oly-over .foot .spacer, .oly-stickyfoot .spacer {
    display: none;
  }
  .oly-toolbar .oly-input, .oly-toolbar .oly-select {
    flex: 1 1 auto;
    min-width: 120px;
  }
  .oly-toolbar .oly-btn {
    flex: 0 0 auto;
    min-width: 0;
  }
  .oly-content > .oly-toolbar {
    position: sticky;
    top: 48px;
    z-index: 70;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    margin: -10px -10px 12px;
    padding: 10px;
    background: color-mix(in oklab, var(--bg) 92%, transparent);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--border);
  }
  .oly-content > .oly-toolbar .btn-txt {
    display: none;
  }
  .oly-toolbar #oly-globalfind {
    order: 1;
    grid-column: 1 / 6;
    grid-row: 1;
    width: 100%;
    flex: none;
    max-width: none !important;
    min-width: 0;
  }
  .oly-toolbar #oly-btn-search {
    order: 2;
    grid-column: 6 / 7;
    grid-row: 1;
    width: 100%;
    flex: none;
    padding-left: 0;
    padding-right: 0;
  }
  .oly-toolbar #oly-btn-filters {
    order: 3;
    width: 100%;
    flex: none;
    padding-left: 0;
    padding-right: 0;
  }
  .oly-toolbar #oly-btn-clear {
    order: 4;
    width: 100%;
    flex: none;
    padding-left: 0;
    padding-right: 0;
  }
  .oly-toolbar #oly-btn-print {
    order: 5;
    width: 100%;
    flex: none;
    padding-left: 0;
    padding-right: 0;
  }
  .oly-toolbar #oly-btn-export {
    order: 6;
    width: 100%;
    flex: none;
    padding-left: 0;
    padding-right: 0;
  }
  .oly-toolbar #oly-btn-new {
    order: 7;
    width: 100%;
    flex: none;
    padding-left: 0;
    padding-right: 0;
  }
  .oly-stickyfoot .oly-btn, .oly-modal .foot .oly-btn, .oly-over .foot .oly-btn {
    flex: 1 1 auto;
    min-width: 120px;
  }
  .oly-btn { min-height: 36px; }
  .oly-btn--sm { min-height: 30px; }
  .oly-shell, .oly-shell--rfw { width: 100% !important; min-width: 0; }
  .oly-fields { gap: 0; }
  .oly-range { flex-wrap: wrap; }
  .oly-range .oly-input { min-width: 120px; flex: 1 1 120px; }

  .oly-over {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    top: 0;
    left: 0;
    transform: none;
    border-radius: 0;
  }
  .oly-over .head { padding: 11px 12px; }
  .oly-over .body { padding: 12px; min-height: 0; }
  .oly-over .foot { padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); }

  .oly-modal-back { padding: 8px; align-items: stretch; place-items: stretch; }
  .oly-modal, .oly-modal.md, .oly-modal.lg {
    width: 100%;
    max-width: 100%;
    max-height: calc(100dvh - 16px);
    display: flex;
    flex-direction: column;
  }
  .oly-modal .head { padding: 12px 48px 12px 14px; }
  .oly-modal > .oly-x-btn, .cf-card > .oly-x-btn { top: 8px; right: 10px; }
  .oly-modal .body { padding: 12px 14px; max-height: none; flex: 1; min-height: 0; }
  .oly-modal.lg .body:has(.oly-field-tabs) { max-height: none; padding-right: 14px; }
  .oly-field-pane { min-height: 46dvh; max-height: 46dvh; padding-right: 8px; }
  .oly-field-basic {
    grid-template-columns: 1fr;
    padding-right: 0;
  }
  .fb-title, .fb-name, .fb-type, .fb-data, .fb-order, .fb-vis { grid-column: 1; }
  .oly-modal .foot { padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); justify-content: stretch; }

  .oly-stickyfoot {
    margin: 12px -12px -12px;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    gap: 8px;
  }
  .oly-modal .body .oly-stickyfoot, .oly-over .body .oly-stickyfoot {
    margin-left: -14px;
    margin-right: -14px;
  }

  .oly-grid-wrap, .oly-grid-scroll { max-width: 100%; }
  .oly-grid-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .oly-pager { gap: 7px; justify-content: center; }
.oly-grid th, .oly-grid td { padding: 8px 10px; }
  /* Το pinned action column ορίζεται πλέον στο base CSS (ισχύει παντού). */

  .jd-builder-head { align-items: stretch; flex-direction: column; }
  .jd-builder-grid { grid-template-columns: 1fr; }
  .obj-map-row,
  .obj-map[data-kind="return"] .obj-map-row { grid-template-columns: 1fr auto; }
  .obj-map-row .oly-input { grid-column: 1 / -1; }
  .obj-map-row .obj-map-del { grid-column: 2; }
  .cu-add-box, .cu-rule-row { grid-template-columns: 1fr auto; }
  .cu-add-box .cu-field-select, .cu-picked, .cu-message, .cu-rule-fields, .cu-rule-msg { grid-column: 1 / -1; }
  .cu-add-rule, .cu-rule-del { grid-column: 2; }
  .df-rule-grid-head { display: none; }
  .df-rule-row { grid-template-columns: 1fr auto; }
  .df-rule-row .oly-input { grid-column: 1 / -1; }
  .df-rule-when { grid-column: 1 / -1; text-align: left; }
  .df-rule-del { grid-column: 2; }
  .df-action-head, .df-expr-head, .df-saveaction-head, .df-summary-head { display: none; }
  .df-action-row, .df-expr-row, .df-saveaction-row, .df-summary-row { grid-template-columns: 1fr auto; }
  .df-action-row .oly-input, .df-expr-row .oly-input, .df-expr-row .oly-switch, .df-saveaction-row .oly-input, .df-summary-row .oly-input { grid-column: 1 / -1; }
  .df-action-del, .df-expr-del, .df-saveaction-del, .df-summary-del { grid-column: 2; }
  .oly-code { min-height: 180px; }
  .oly-codewrap .oly-codehl, .oly-codewrap textarea.oly-codeta { font-size: 12px; }
}

/* ---------------- Help bot (βοηθός υποστήριξης κάτω δεξιά) ---------------- */
.oly-helpbot-launcher {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: var(--primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 10px 30px -12px rgb(0 0 0 / .5);
  z-index: 975;
  transition: transform .15s ease;
}
.oly-helpbot-launcher:hover { transform: scale(1.06); }
.oly-helpbot-launcher .oly-ico svg { width: 24px; height: 24px; }
.oly-hb-launcher-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 10px;
  border: 2px solid var(--surface);
  background: var(--danger);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 14px;
  text-align: center;
}
.oly-helpbot-launcher.is-open { display: none; }
.oly-helpbot {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: min(380px, calc(100vw - 24px));
  height: min(560px, calc(100dvh - 40px));
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius, 12px);
  box-shadow: 0 24px 70px -30px rgb(0 0 0 / .55);
  z-index: 976;
  display: none;
  grid-template-rows: auto minmax(0,1fr) auto auto auto;
  overflow: hidden;
}
.oly-helpbot.open { display: grid; }
.oly-hb-head { display: flex; align-items: center; gap: 12px; padding: 12px 14px 10px; border-bottom: 1px solid var(--border); background: var(--surface); }
.oly-hb-head div { display: grid; gap: 2px; min-width: 0; flex: 1; }
.oly-hb-head b { display: flex; align-items: center; gap: 7px; font-size: 15px; }
.oly-hb-head span { color: var(--muted); font-size: 12px; }
.oly-hb-head-badge {
  display: inline-flex;
  align-items: center;
  height: 18px;
  padding: 0 7px;
  border-radius: 999px;
  background: var(--danger);
  color: #fff !important;
  font-size: 10.5px !important;
  font-weight: 800;
  white-space: nowrap;
}
.oly-hb-tix-btn { position: relative; }
.oly-hb-tix-badge {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 9px;
  background: var(--danger);
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
}
.oly-hb-log { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; overflow: auto; }
.oly-hb-msg {
  max-width: 88%;
  border: 1px solid var(--border);
  background: var(--surface2, var(--bg));
  border-radius: 10px;
  padding: 8px 10px;
  font-size: 13px;
  line-height: 1.55;
  white-space: normal;
}
.oly-hb-msg.user { align-self: flex-end; background: var(--primary-soft); border-color: color-mix(in oklab,var(--primary) 24%,var(--border)); }
.oly-hb-msg.assistant { align-self: flex-start; }
.oly-hb-msg.loading { color: var(--muted); }
.oly-hb-arts { max-width: 100%; display: grid; gap: 6px; }
.oly-hb-arts-label { color: var(--muted); font-size: 12px; }
.oly-hb-art {
  text-align: left;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  border-radius: 8px;
  padding: 7px 9px;
  font-size: 12.5px;
  cursor: pointer;
  display: grid;
  gap: 2px;
}
.oly-hb-art:hover { border-color: var(--primary); }
.oly-hb-art.unread { border-color: var(--danger); background: color-mix(in oklab, var(--danger) 8%, var(--surface)); }
.oly-hb-art small { color: var(--muted); }
.oly-hb-suggest { display: grid; gap: 4px; padding: 6px 14px; border-top: 1px dashed var(--border); max-height: 130px; overflow: auto; }
.oly-hb-compose { display: flex; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--border); align-items: flex-end; }
.oly-hb-compose textarea { flex: 1; resize: none; }
.oly-hb-foot { padding: 6px 14px 10px; text-align: center; }
.oly-hb-report {
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  cursor: pointer;
}
.oly-hb-report:hover { color: var(--primary); }
.oly-hb-article { font-size: 13.5px; line-height: 1.6; }
.oly-hb-article img { max-width: 100%; }
@media (max-width: 640px) {
  .oly-helpbot { right: 10px; left: 10px; bottom: 10px; width: auto; height: min(75dvh, 560px); }
}

/* Help bot — tickets */
.oly-hb-tix { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; overflow: auto; min-height: 0; }
.oly-hb-tix-head { display: flex; align-items: center; gap: 8px; }
.oly-hb-linkbtn { border: 0; background: transparent; color: var(--muted); font-size: 12.5px; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; padding: 4px 2px; }
.oly-hb-linkbtn:hover { color: var(--primary); }
.oly-hb-linkbtn .oly-ico svg { width: 15px; height: 15px; }
.oly-hb-status { font-size: 11px; border-radius: 20px; padding: 2px 8px; border: 1px solid var(--border); color: var(--muted); background: var(--surface2, var(--bg)); }
.oly-hb-status.s-new { color: var(--warn); border-color: color-mix(in oklab, var(--warn) 58%, var(--border)); background: color-mix(in oklab, var(--warn) 12%, var(--surface)); }
.oly-hb-status.s-open { color: var(--primary); border-color: color-mix(in oklab,var(--primary) 40%,var(--border)); background: var(--primary-soft); }
.oly-hb-status.s-answered { color: var(--ok, #2e7d32); border-color: color-mix(in oklab,var(--ok, #2e7d32) 40%,var(--border)); }
.oly-hb-status.s-closed { opacity: .7; }
.oly-hb-tix-subject { padding: 0 2px; font-size: 13.5px; }
.oly-hb-thread { display: flex; flex-direction: column; gap: 8px; overflow: auto; flex: 1; min-height: 120px; padding: 4px 2px; }
.oly-hb-msg-time { margin-top: 4px; font-size: 10.5px; color: var(--muted); }
.oly-hb-tix-compose { display: flex; gap: 8px; align-items: flex-end; padding: 0; border-top: 0; }
.oly-hb-tix-compose textarea { flex: 1; resize: none; }
.oly-hb-newtix { display: grid; gap: 8px; }
.oly-hb-newtix b { font-size: 14px; }

/* Help Center admin — ίδιο design concept με Offline Data */
.helpcenter-card {
  min-height: min(650px, calc(100dvh - 126px));
  max-height: calc(100dvh - 126px);
  overflow: hidden;
}
.helpcenter-card.offline-package-off .hb-dependent-section { opacity: .58; }
.hb-dependent-section input:disabled,
.hb-dependent-section select:disabled,
.hb-dependent-section textarea:disabled,
.hb-dependent-section button:disabled { cursor: not-allowed; }
.hb-footer { margin-top: auto; }

/* Help Center: τα tabs Άρθρα/Αιτήματα γεμίζουν το ύψος της κάρτας (όπως το Γενικά)
   και οι εσωτερικές στήλες κάνουν internal scroll — το footer Αποθήκευση μένει πάντα ορατό */
.helpcenter-card > .hb-pane { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding-top: 12px; }
.hb-pane > .oly-split2 { flex: 1 1 auto; min-height: 0; grid-template-rows: minmax(0, 1fr); }
.hb-pane .oly-split2 > .oly-card.admin-fill-card { min-height: 0; max-height: 100%; overflow: auto; }
.helpcenter-tix-split { --split-w: 340px; }
.hbt-filter { width: 180px; min-width: 180px; }
#hbt-thread { overflow: hidden; }
.hbt-thread-shell { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; height: 100%; }
.hbt-thread-head { flex: 0 0 auto; gap: 8px; margin-bottom: 8px; }
.hbt-thread-head h3 { min-width: 0; overflow-wrap: anywhere; }
.hbt-thread-meta { flex: 0 0 auto; margin-bottom: 8px; }
.hbt-msgs { flex: 1 1 auto; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 8px; padding: 4px 2px; margin-bottom: 10px; }
.hbt-composer { flex: 0 0 auto; display: flex; gap: 8px; align-items: flex-end; padding-top: 10px; border-top: 1px solid var(--border); background: var(--surface); }
.hbt-composer textarea { flex: 1; resize: none; }
.hbt-thread-footnote { flex: 0 0 auto; padding: 8px 2px; }
#hbt-list { display: flex; flex-direction: column; gap: 6px; }
#hbt-list .obj-item { box-sizing: border-box; min-height: 70px; height: 70px; width: 100%; padding: 9px 10px; display: flex; flex-direction: column; justify-content: center; gap: 5px; overflow: hidden; }
#hbt-list .obj-item b { display: flex; align-items: center; gap: 6px; min-width: 0; width: 100%; line-height: 1.2; }
#hbt-list .obj-item small { display: block; min-width: 0; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.25; }
.hbt-row-title { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hbt-row-badge { flex: 0 0 auto; white-space: nowrap; padding: 2px 7px; }
.oly-qr-code{display:flex;align-items:center;min-height:48px}
.oly-qr-code img{display:block;max-width:100%;height:auto;border:1px solid var(--border);background:#fff;padding:4px}