/*================================================================================
	Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
	Version: 2.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */

/* ============================================
   TOGGLE BUTON - HER ZAMAN GÖRÜNSÜN
   ============================================ */

/* Toggle buton her zaman görünsün - Sidebar açık ve kapalı */
.main-menu .navbar-header .nav-item.nav-toggle,
.main-menu .navbar-header .modern-nav-toggle,
.main-menu .navbar-header .collapse-toggle-icon,
.vertical-layout.vertical-menu-modern .main-menu .navbar-header .modern-nav-toggle,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-header .modern-nav-toggle,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .modern-nav-toggle {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Toggle icon her zaman görünsün */
.main-menu .navbar-header .collapse-toggle-icon,
.vertical-layout.vertical-menu-modern .main-menu .navbar-header .collapse-toggle-icon,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-header .collapse-toggle-icon {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Fix for sidebar collapsed mode - show menu item texts when expanded (hover) */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navigation li > a > span.menu-title,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navigation li > a > span.menu-item {
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navigation li > a > span {
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Ensure submenu items are visible when parent is open in collapsed+expanded mode */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navigation li.has-sub.open ul li > a > span {
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Fix for navigation header text visibility */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navigation-header span {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Navbar Brand Logo Styles */
.header-navbar .brand-logo {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0.5rem 0;
  line-height: 1;
}

.header-navbar .brand-logo img {
  max-height: 45px;
  max-width: 180px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
  transition: all 0.3s ease;
}

/* Navbar brand container alignment */
.header-navbar .navbar-brand {
  display: flex;
  align-items: center;
  padding: 0.5rem 1rem;
  text-decoration: none;
}

.header-navbar .navbar-brand:hover,
.header-navbar .navbar-brand:focus {
  text-decoration: none;
}

/* Horizontal menu logo */
.horizontal-menu .header-navbar.navbar-brand-center .navbar-header .navbar-brand .brand-logo img {
  max-height: 45px;
  max-width: 180px;
  width: auto;
  height: auto;
  object-fit: contain;
}

/* Responsive logo sizing */
@media (max-width: 991.98px) {
  .header-navbar .brand-logo img {
    max-height: 35px;
    max-width: 140px;
  }
}

/* ============================================
   SIDEBAR LOGO STYLES - BASİT
   ============================================ */

/* VARSAYILAN: Sidebar açık - sportifApp-Logo-renkli.png göster */
.sidebar-logo-full {
  display: block !important;
  max-width: 180px;
  max-height: 50px;
}

/* Icon logo VARSAYILAN olarak GİZLİ */
.sidebar-logo-icon,
.main-menu .sidebar-logo-icon,
.main-menu .navbar-brand .sidebar-logo-icon,
.main-menu .navbar-header .sidebar-logo-icon,
.main-menu .navbar-header .navbar-brand .sidebar-logo-icon,
.main-menu .navbar-header .navbar-brand img.sidebar-logo-icon {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  max-width: 52px;
  max-height: 52px;
}

/* KAPATILDIĞINDA: Full logo GİZLE */
body.vertical-layout.vertical-menu-modern.menu-collapsed .sidebar-logo-full,
.vertical-layout.vertical-menu-modern.menu-collapsed .sidebar-logo-full,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .sidebar-logo-full,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-brand .sidebar-logo-full,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-header .navbar-brand .sidebar-logo-full {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

body.vertical-layout.vertical-menu-modern.menu-collapsed .sidebar-logo-icon,
.vertical-layout.vertical-menu-modern.menu-collapsed .sidebar-logo-icon,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .sidebar-logo-icon,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-brand .sidebar-logo-icon,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-header .navbar-brand .sidebar-logo-icon,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-header .navbar-brand img.sidebar-logo-icon {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-width: 52px !important;
  max-height: 52px !important;
  margin: 0 auto !important;
}

/* ============================================
   NAVBAR HEADER - GENEL YAPILANDIRMA
   ============================================ */

/* Navbar header container - Her zaman aynı */
.main-menu .navbar-header {
  min-height: 70px;
  display: flex;
  align-items: center;
}

/* Navbar nav - Logo ve toggle yan yana */
.main-menu .navbar-header .navbar-nav {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  flex-wrap: nowrap !important;
}

/* Logo item - Sol tarafta */
.main-menu .navbar-header .nav-item.me-auto {
  flex: 0 0 auto !important;
  margin-right: auto !important;
}

/* Toggle button item - Sağ tarafta */
.main-menu .navbar-header .nav-item.nav-toggle {
  flex: 0 0 auto !important;
  margin-left: auto !important;
}

/* Navbar brand - Her iki modda da aynı padding (kayma olmasın) */
.main-menu .navbar-header .navbar-brand {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 0.75rem 0 0.75rem 1.64rem !important;
  margin: 0 !important;
  transition: none !important;
  min-height: 60px !important;
}

/* Navbar brand img - genel */
.main-menu .navbar-header .navbar-brand img {
  display: block !important;
}

/* Main menu content spacing */
.main-menu .main-menu-content {
  padding-top: 1rem;
}


/* Collapsed modda navbar header - 80px içinde düzenle */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-header {
  width: 80px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  position: relative !important;
  padding: 1rem 0 !important;
}

/* Collapsed modda navbar nav - 80px içinde ortala */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-header .navbar-nav {
  justify-content: center !important;
  align-items: center !important;
  width: 80px !important;
  max-width: 80px !important;
}

/* Collapsed modda logo item - 80px içinde ortala */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-header .nav-item.me-auto {
  flex: 1 1 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  margin: 0 !important;
  width: 100% !important;
}

/* Collapsed modda navbar brand - 80px içinde ortala */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-header .navbar-brand {
  justify-content: center !important;
  align-items: center !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  display: flex !important;
  text-align: center !important;
}

/* Collapsed modda icon logo - 80px içinde ortada */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu .navbar-header .sidebar-logo-icon {
  margin: 0 auto !important;
  display: block !important;
  width: 52px !important;
  height: 52px !important;
}

/* Collapsed modda toggle buton - GİZLE (anlamsız) */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu:not(.expanded) .navbar-header .nav-item.nav-toggle {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

/* Hover (expanded) durumunda toggle göster */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navbar-header .nav-item.nav-toggle {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: absolute !important;
  right: 0.5rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}

/* ============================================
   HOVER DURUMU - Collapsed modda hover (expanded)
   ============================================ */

/* Hover (expanded) - navbar header genişle */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navbar-header {
  width: 260px !important;
}

/* Hover (expanded) - navbar nav genişle */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navbar-header .navbar-nav {
  width: 100% !important;
  max-width: 260px !important;
  justify-content: space-between !important;
}

/* Hover (expanded) - logo item sola */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navbar-header .nav-item.me-auto {
  justify-content: flex-start !important;
  margin-right: auto !important;
}

/* Hover (expanded) - navbar brand sola */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navbar-header .navbar-brand {
  justify-content: flex-start !important;
  padding-left: 1.64rem !important;
  width: auto !important;
  text-align: left !important;
}

/* Hover (expanded) - Full logo GÖSTER (güçlü selector) */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .sidebar-logo-full,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navbar-brand .sidebar-logo-full,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navbar-header .navbar-brand .sidebar-logo-full,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navbar-header .navbar-brand img.sidebar-logo-full {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-width: 180px !important;
  max-height: 50px !important;
}

/* Hover (expanded) - Icon logo GİZLE (güçlü selector) */
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .sidebar-logo-icon,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navbar-brand .sidebar-logo-icon,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navbar-header .navbar-brand .sidebar-logo-icon,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navbar-header .navbar-brand img.sidebar-logo-icon {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
}

/* Collapsed mode - content shifts left (sidebar 80px) */
.vertical-layout.vertical-menu-modern.menu-collapsed .app-content {
  margin-left: 80px !important;
  transition: margin-left 0.3s ease;
}

.vertical-layout.vertical-menu-modern.menu-collapsed .navbar.fixed-top,
.vertical-layout.vertical-menu-modern.menu-collapsed .navbar.floating-nav {
  left: 80px !important;
  transition: left 0.3s ease;
}

.vertical-layout.vertical-menu-modern.menu-collapsed .footer {
  margin-left: 80px !important;
  transition: margin-left 0.3s ease;
}

/* Hover on collapsed sidebar - content shifts back right temporarily */
.vertical-layout.vertical-menu-modern.menu-collapsed.sidebar-hover-active .app-content,
.vertical-layout.vertical-menu-modern.menu-collapsed:has(.main-menu.expanded) .app-content {
  margin-left: 260px !important;
}

.vertical-layout.vertical-menu-modern.menu-collapsed.sidebar-hover-active .navbar.fixed-top,
.vertical-layout.vertical-menu-modern.menu-collapsed.sidebar-hover-active .navbar.floating-nav,
.vertical-layout.vertical-menu-modern.menu-collapsed:has(.main-menu.expanded) .navbar.fixed-top,
.vertical-layout.vertical-menu-modern.menu-collapsed:has(.main-menu.expanded) .navbar.floating-nav {
  left: 260px !important;
}

.vertical-layout.vertical-menu-modern.menu-collapsed.sidebar-hover-active .footer,
.vertical-layout.vertical-menu-modern.menu-collapsed:has(.main-menu.expanded) .footer {
  margin-left: 260px !important;
}

/* Expanded mode (toggle button) - content stays fixed at 260px */
.vertical-layout.vertical-menu-modern.menu-expanded .app-content {
  margin-left: 260px !important;
}

.vertical-layout.vertical-menu-modern.menu-expanded .navbar.fixed-top,
.vertical-layout.vertical-menu-modern.menu-expanded .navbar.floating-nav {
  left: 260px !important;
}

.vertical-layout.vertical-menu-modern.menu-expanded .footer {
  margin-left: 260px !important;
}
