/**
 * Footer Layout Styles
 * Professional fixed footer at bottom of screen
 * Clean, minimal design with essential information
 */

/* Fixed footer at bottom - PROFESSIONAL MINIMAL DESIGN */
.app-footer {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 100 !important; /* Below sidebar (sidebar is 1030) */
  background: #f8f9fa !important;
  box-shadow: 0 -3px 15px rgba(0,0,0,0.15) !important;
  border-top: 1px solid rgba(0,0,0,0.08) !important;
  padding: 5px 0 !important; /* Tight padding */
  font-size: 1.1rem !important; /* Version 1.0.3 */
  min-height: 35px !important; /* Compact height */
  line-height: 1.2 !important;
}

/* Desktop - Footer aligned with main content (not under sidebar) */
@media (min-width: 992px) {
  .app-footer {
    left: 250px !important; /* Offset by sidebar width */
  }
  
  /* Add padding to main content so footer doesn't cover it */
  .app-content {
    padding-bottom: 65px !important; /* Space for professional footer */
  }
}

/* Tablet - Collapsed sidebar */
@media (min-width: 768px) and (max-width: 991.98px) {
  .app-footer {
    left: 70px !important; /* Offset by collapsed sidebar width */
  }
  
  .app-content {
    padding-bottom: 65px !important;
  }
}

/* Mobile - Full width footer */
@media (max-width: 767.98px) {
  .app-footer {
    left: 0 !important;
  }
  
  .app-content {
    padding-bottom: 65px !important;
  }
}
