/* ============================================================================
   ICON SYSTEM — unified sizing & optical alignment across the app
   Loaded LAST — wins over legacy rules in styles.css
   ============================================================================ */

:root {
  --icon-size-xs: 16px;
  --icon-size-sm: 18px;
  --icon-size-md: 20px;
  --icon-size-lg: 22px;
  --icon-stroke: 1.9;
  --icon-pad: 0;
}

/* Shared icon container */
.sidenav__icon,
.drawer__icon,
.tab__icon,
.stat__icon,
.ministat__icon,
.sa-dash__kpi-icon,
.sa-dash__link-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  line-height: 0 !important;
}

.sidenav__icon {
  width: var(--icon-size-lg) !important;
  height: var(--icon-size-lg) !important;
}
.sidenav__icon svg {
  width: var(--icon-size-lg) !important;
  height: var(--icon-size-lg) !important;
  display: block !important;
}

.drawer__icon {
  flex: 0 0 var(--icon-size-lg) !important;
  width: var(--icon-size-lg) !important;
  height: var(--icon-size-lg) !important;
}
.drawer__icon svg {
  width: var(--icon-size-lg) !important;
  height: var(--icon-size-lg) !important;
  display: block !important;
}

.tab__icon {
  width: var(--icon-size-md) !important;
  height: var(--icon-size-md) !important;
  font-size: var(--icon-size-md) !important;
}
.tab__icon svg {
  width: var(--icon-size-md) !important;
  height: var(--icon-size-md) !important;
  display: block !important;
}

.iconbtn {
  display: inline-grid !important;
  place-items: center !important;
  width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
}
.iconbtn svg {
  width: var(--icon-size-md) !important;
  height: var(--icon-size-md) !important;
  display: block !important;
}
.iconbtn--sm {
  width: 32px !important;
  height: 32px !important;
}

.appbar__logo svg {
  width: 28px !important;
  height: 28px !important;
  display: block !important;
}

/* Dashboard stat icons — visible & aligned (NOT hidden like landing) */
.view .stat__icon,
.sa-dash .stat__icon,
.stats:not(.lp--v3 .stats) .stat__icon {
  display: grid !important;
  place-items: center !important;
  width: 40px !important;
  height: 40px !important;
  font-size: 18px !important;
  border-radius: 11px !important;
}
.view .stat__icon svg,
.sa-dash .stat__icon svg {
  width: var(--icon-size-md) !important;
  height: var(--icon-size-md) !important;
  display: block !important;
}

.ministat__icon {
  font-size: var(--icon-size-md) !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 9px !important;
  background: var(--primary-soft) !important;
  color: var(--primary) !important;
}
.view .ministat__icon svg {
  width: var(--icon-size-sm) !important;
  height: var(--icon-size-sm) !important;
  display: block !important;
}

/* Changelog timeline — emoji/icon container alignment */
.release-items li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 0 !important;
  padding-left: 0 !important;
  line-height: 1.55;
  min-height: 36px;
}
.release-items li::before { display: none !important; }
.release-item__icon {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  line-height: 1;
  margin-top: 1px;
}
.release-item__text { flex: 1; min-width: 0; }

/* Settings control center timeline */
.sc-timeline__list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 6px !important;
  line-height: 1.5;
  list-style: none;
  padding-left: 0;
}
.sc-timeline__item-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  line-height: 1;
  margin-top: 1px;
}
.sc-timeline__item-text { flex: 1; }

/* Buttons with icons */
.btn .btn__icon,
.ep-btn .ep-btn__icon {
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
  display: inline-flex;
  align-items: center;
  margin-right: 6px;
}
.btn .btn__icon svg,
.ep-btn .ep-btn__icon svg {
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
  display: block;
}

/* Super Admin dashboard KPI icons */
.sa-dash__kpi-icon,
.sa-dash__link-icon {
  width: var(--icon-size-lg) !important;
  height: var(--icon-size-lg) !important;
}
.sa-dash__kpi-icon svg,
.sa-dash__link-icon svg {
  width: var(--icon-size-lg) !important;
  height: var(--icon-size-lg) !important;
  display: block !important;
}

/* ============================================================================
   MENUS & DASHBOARD — text-first (χωρίς μεγάλα εικονίδια)
   ============================================================================ */
.sidenav__icon,
.drawer__icon,
.tab__icon,
.portal-link__ic,
.ipanel__ic,
.quick__icon,
.ep-kpi__icon,
.ep-quick__ic,
.re-kpi__ic,
.re-quick__ic,
.today__icon {
  display: none !important;
}

.ihero__badge {
  display: none !important;
}

.ministat__icon,
.view .stat__icon,
.sa-dash .stat__icon {
  display: none !important;
}

.sidenav__item,
.drawer__item {
  gap: 0 !important;
}

.tab {
  gap: 0 !important;
}

.portal-link {
  padding: 12px 8px !important;
  gap: 0 !important;
}

.ipanel__chip {
  gap: 0 !important;
}

.ministat,
.stat {
  gap: 2px !important;
  padding: 10px 8px !important;
}

.ihero {
  gap: 0 !important;
}

/* Φίλτρα / tabs — σαφές active state (ειδικά dark mode) */
.tabs__tab.is-active {
  background: var(--primary-soft) !important;
  color: var(--primary) !important;
  box-shadow: none !important;
}

.crumbs__ico,
.empty__icon,
.more-sheet__item__icon,
.persona-chip__icon {
  display: none !important;
}

.crumbs__home,
.more-sheet__item,
.persona-chip {
  gap: 0 !important;
}

.more-sheet__item {
  padding: 12px 8px !important;
}