/**
 * Verktygsväskan Mobile Fixes
 * CSS-fixes för mobilvyn på Verktygsväskan
 */

:root {
  --ios-safari-vv-gap: 0px;
}

/* Notification Dropdown - Fullscreen på mobil */
@media (max-width: 1024px) {
  #notificationDropdown.open,
  body.notifications-panel-open #notificationDropdown.open {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    max-height: 100vh !important;
    border-radius: 0 !important;
    transform: none !important;
    z-index: 100010 !important;
    margin: 0 !important;
    box-shadow: none !important;
  }

  body.notifications-panel-open .project-info-fab {
    display: none !important;
  }
  
  #notificationDropdown.open .notification-header {
    position: sticky;
    top: 0;
    background: white;
    z-index: 1;
    padding: 1rem !important;
    border-bottom: 2px solid #e5e7eb;
  }
  
  #notificationDropdown.open .notification-body {
    max-height: calc(100vh - 120px) !important;
    overflow-y: auto;
  }
}

@media (max-width: 768px) {
  /* Varukorg-FAB ovanför bottennav (ingen dubbel-FAB under) */
  .project-info-fab {
    bottom: calc(
      80px + env(safe-area-inset-bottom, 0px) + var(--ios-safari-vv-gap, 0px)
    ) !important;
    right: max(16px, env(safe-area-inset-right, 0px)) !important;
    z-index: 100003 !important;
  }

  /* Drawer full höjd på mobil */
  .project-info-drawer.open .drawer-content {
    max-height: calc(100dvh - env(safe-area-inset-top, 0px));
  }
}

@media (max-width: 768px) and (orientation: landscape) {
  .project-info-fab {
    bottom: calc(
      120px + env(safe-area-inset-bottom, 0px) + var(--ios-safari-vv-gap, 0px)
    ) !important;
  }
}