/**
 * Gap between Ask / My Questions and About.
 * Match the air above the button row (title → buttons) — modest, not a void.
 * Single gap source only (no padding + spacer + margin stacked).
 */

/* Hide the rail spacer — gap lives on compose-stack only */
.gmail-shell .col-nav > .nav-rail-spacer,
.gmail-shell .nav-rail-spacer {
  display: block !important;
  width: 100% !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  flex: 0 0 0 !important;
  overflow: hidden !important;
  visibility: hidden !important;
  pointer-events: none !important;
  line-height: 0 !important;
  font-size: 0 !important;
}

/* One non-collapsing gap under the buttons — same scale as title→buttons (~20px) */
.gmail-shell .col-nav > .nav-compose-stack,
.gmail-shell .nav-compose-stack {
  margin-bottom: 0 !important;
  padding-bottom: 20px !important;
}

.gmail-shell .nav-compose-stack:has(.nav-my-q-panel) {
  padding-bottom: 20px !important;
}

.gmail-shell .col-nav > .nav-about,
.gmail-shell .nav-about {
  display: block !important;
  margin-top: 0 !important;
  margin-bottom: 24px !important;
  position: relative !important;
  top: auto !important;
  transform: none !important;
  float: none !important;
  clear: both !important;
}

.gmail-shell .col-nav {
  row-gap: 0 !important;
  gap: 0 !important;
}

@media (max-width: 860px) {
  .gmail-shell .col-nav {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
  }

  .gmail-shell .col-nav > .nav-compose-stack,
  .gmail-shell .nav-compose-stack,
  .gmail-shell .nav-compose-stack:has(.nav-my-q-panel) {
    /* Match title → button air on mobile */
    padding-bottom: 20px !important;
  }

  .gmail-shell .col-nav > .nav-about,
  .gmail-shell .nav-about {
    margin-top: 0 !important;
  }

  .gmail-shell .col-nav > .nav-rail-spacer,
  .gmail-shell .nav-rail-spacer {
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    flex: 0 0 0 !important;
  }
}