/**
 * Omnex Layout — layouts/sidebar.css
 * Daraltılmış mod: .ox-shell[data-collapsed="yes"] altında etiketler gizlenir.
 */

.ox-sidebar {
  display: flex;
  flex-direction: column;
  width: var(--ox-sidebar-w);
  background: var(--ox-sidebar-bg, var(--ox-surface));
  color: var(--ox-sidebar-fg, var(--ox-fg));
  border-right: var(--ox-sidebar-border-w, 1px) solid var(--ox-sidebar-border-c, var(--ox-border));
  overflow: hidden;
  /* Daralt/genişlet: kayarak (grid değil width animasyonu) */
  transition: width var(--ox-transition-slow);
}
.ox-shell[data-collapsed="yes"] .ox-sidebar { width: var(--ox-sidebar-w-collapsed); }
:root[data-side="right"] .ox-sidebar {
  border-right: 0;
  border-left: var(--ox-sidebar-border-w, 1px) solid var(--ox-sidebar-border-c, var(--ox-border));
}

.ox-sidebar__brand {
  display: flex;
  align-items: center;
  gap: var(--ox-space-2);
  height: var(--ox-topbar-h);
  padding: 0 var(--ox-space-4);
  border-bottom: 1px solid var(--ox-sidebar-divider, var(--ox-border));
  flex-shrink: 0;
  white-space: nowrap;
}
.ox-sidebar__mark {
  width: 24px; height: 24px;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--ox-primary), var(--ox-primary-active));
  flex-shrink: 0;
}
.ox-sidebar__name {
  font-weight: var(--ox-weight-bold);
  letter-spacing: var(--ox-tracking-tight);
}

.ox-sidebar__nav {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden; /* dar modda gizli etiketler yatay scroll üretmesin */
  padding: var(--ox-space-3) var(--ox-space-2);
  /* İnce, zemine UYUMLU scrollbar: renk sidebar chrome'undan türer;
     özel arka planda da otomatik uyum sağlar (market-etiket deseni) */
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--ox-sidebar-fg, var(--ox-fg)) 20%, transparent) transparent;
}
.ox-sidebar__nav:hover {
  scrollbar-color: color-mix(in srgb, var(--ox-sidebar-fg, var(--ox-fg)) 34%, transparent) transparent;
}
.ox-sidebar__loading { display: grid; place-items: center; padding: var(--ox-space-6); }

.ox-sidebar__section {
  padding: var(--ox-space-4) var(--ox-space-3) var(--ox-space-1);
  font-size: var(--ox-text-xs);
  font-weight: var(--ox-weight-semibold);
  letter-spacing: var(--ox-tracking-label);
  text-transform: uppercase;
  color: var(--ox-sidebar-fg-muted, var(--ox-fg-faint));
  white-space: nowrap;
}

.ox-sidebar__item {
  display: flex;
  align-items: center;
  gap: var(--ox-space-3);
  padding: 9px var(--ox-space-3);
  margin: 1px 0;
  border-radius: var(--ox-radius-md);
  color: var(--ox-sidebar-fg-muted, var(--ox-fg-muted));
  text-decoration: none;
  font-size: var(--ox-text-base);
  font-weight: var(--ox-weight-medium);
  white-space: nowrap;
  transition: background-color var(--ox-transition-fast), color var(--ox-transition-fast);
}
.ox-sidebar__item:hover {
  background: var(--ox-sidebar-hover, var(--ox-surface-2));
  color: var(--ox-sidebar-fg, var(--ox-fg));
}
.ox-sidebar__item:focus-visible { outline: none; box-shadow: var(--ox-focus-ring); }
.ox-sidebar__item.is-active {
  background: var(--ox-sidebar-active-bg, var(--ox-primary-subtle));
  color: var(--ox-sidebar-active-fg, var(--ox-accent));
}
.ox-sidebar__item .ox-icon { flex-shrink: 0; }

.ox-sidebar__foot {
  padding: var(--ox-space-2);
  border-top: 1px solid var(--ox-sidebar-divider, var(--ox-border));
  flex-shrink: 0;
  white-space: nowrap;
}

/* Alt kullanıcı bloğu (market-etiket deseni, chrome'a adaptif) */
.ox-sidebar__user-wrap { display: block; }
.ox-sidebar__user {
  display: flex;
  align-items: center;
  gap: var(--ox-space-3);
  width: 100%;
  padding: var(--ox-space-2);
  border: 0;
  border-radius: var(--ox-radius-md);
  background: transparent;
  font-family: var(--ox-font-sans);
  text-align: left;
  cursor: pointer;
  transition: background-color var(--ox-transition-fast);
}
.ox-sidebar__user:hover { background: var(--ox-sidebar-hover, var(--ox-surface-2)); }
.ox-sidebar__user:focus-visible { outline: none; box-shadow: var(--ox-focus-ring); }

.ox-sidebar__avatar {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: var(--ox-radius-full);
  background: linear-gradient(135deg, var(--ox-primary), var(--ox-primary-active));
  color: var(--ox-primary-fg);
  font-size: var(--ox-text-sm);
  font-weight: var(--ox-weight-semibold);
  flex-shrink: 0;
}

.ox-sidebar__user-meta {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.2;
  transition: opacity var(--ox-dur) var(--ox-ease);
}
.ox-sidebar__user-meta strong {
  font-size: var(--ox-text-sm);
  font-weight: var(--ox-weight-medium);
  color: var(--ox-sidebar-fg, var(--ox-fg));
  overflow: hidden;
  text-overflow: ellipsis;
}
.ox-sidebar__user-meta small {
  font-size: var(--ox-text-xs);
  color: var(--ox-sidebar-fg-muted, var(--ox-fg-muted));
}

/* Sidebar içindeki açılır menüler de chrome'u devralır (topbar ile aynı yapı) */
.ox-sidebar .ox-dropdown__menu {
  background: var(--ox-sidebar-bg, var(--ox-surface));
  border-color: var(--ox-sidebar-divider, var(--ox-border));
}
.ox-sidebar .ox-dropdown__item { color: var(--ox-sidebar-fg, var(--ox-fg)); }
.ox-sidebar .ox-dropdown__item:hover,
.ox-sidebar .ox-dropdown__item:focus-visible { background: var(--ox-sidebar-hover, var(--ox-surface-2)); }
.ox-sidebar .ox-dropdown__item .ox-icon { color: var(--ox-sidebar-fg-muted, var(--ox-fg-muted)); }
.ox-sidebar .ox-dropdown__sep { background: var(--ox-sidebar-divider, var(--ox-border)); }

/* --- Alt menü (iç içe; her seviye aynı sınıfları kullanır) --- */
.ox-sidebar__group { position: relative; }
.ox-sidebar__item--parent { width: 100%; border: 0; background: transparent; font-family: var(--ox-font-sans); cursor: pointer; text-align: left; }
.ox-sidebar__caret { margin-left: auto; transition: transform var(--ox-transition-fast); flex-shrink: 0; }
.ox-sidebar__group.is-open > .ox-sidebar__item--parent .ox-sidebar__caret { transform: rotate(180deg); }

.ox-sidebar__sub {
  max-height: 0;
  overflow: hidden;
  transition: max-height var(--ox-transition-slow);
  margin-left: 14px;
  padding-left: 8px;
  border-left: 1px solid var(--ox-sidebar-divider, var(--ox-border));
}
.ox-sidebar__group.is-open > .ox-sidebar__sub { max-height: 480px; }
/* Hover açılımı (tema panelinden: data-menu-sb="hover") */
:root[data-menu-sb="hover"] .ox-sidebar__group:hover > .ox-sidebar__sub { max-height: 480px; }
:root[data-menu-sb="hover"] .ox-sidebar__group:hover > .ox-sidebar__item--parent .ox-sidebar__caret { transform: rotate(180deg); }

/* --- Daraltılmış mod: kayan genişlik; metinler solarak kaybolur --- */
.ox-sidebar__name, .ox-sidebar__label { transition: opacity var(--ox-dur) var(--ox-ease); }
.ox-shell[data-collapsed="yes"] .ox-sidebar__name,
.ox-shell[data-collapsed="yes"] .ox-sidebar__label { opacity: 0; }
.ox-shell[data-collapsed="yes"] .ox-sidebar__section,
.ox-shell[data-collapsed="yes"] .ox-sidebar__caret,
.ox-shell[data-collapsed="yes"] .ox-sidebar__sub { display: none; }

/* Daraltılmış mod: kullanıcı bloğunda yalnız ORTALANMIŞ avatar kalır */
.ox-shell[data-collapsed="yes"] .ox-sidebar__user-meta { opacity: 0; width: 0; }
.ox-shell[data-collapsed="yes"] .ox-sidebar__user { justify-content: center; gap: 0; padding: var(--ox-space-2) 0; }

@media (max-width: 900px) {
  .ox-sidebar__name, .ox-sidebar__label { opacity: 0; }
  .ox-sidebar__section, .ox-sidebar__caret, .ox-sidebar__sub { display: none; }
  .ox-sidebar__user-meta { opacity: 0; width: 0; }
  .ox-sidebar__user { justify-content: center; gap: 0; padding: var(--ox-space-2) 0; }
}