/* Partner portal mobile/tablet responsiveness fixes — loaded AFTER partner-portal.css.
   Keeping these as a separate, readable file (partner-portal.css is minified/fragile). */

/* BUG FIX: the product name/description wrapper had no flex-grow, so it stayed as
   narrow as its own text and left a large dead gap inside the card (all breakpoints). */
.partner-product-info { flex: 1 1 auto; min-width: 0; }
.partner-product-head h2 { overflow-wrap: anywhere; }

/* Let product/admin grids reflow by available width instead of a hard 2-up split that
   only ever drops to 1 column below 720px — this keeps tablets from feeling cramped
   and avoids a lone card stretching oddly next to an empty column. */
.partner-product-grid,
.partner-admin-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.partner-admin-product {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

/* Header actions: keep them tidy on phones instead of one lone button stranded with
   a big empty gap next to it when the row wraps. */
@media (max-width: 560px) {
  .partner-header-actions {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    gap: 8px;
  }
  .partner-header-actions > a {
    flex: 1 1 calc(50% - 8px);
    justify-content: center;
  }
  .partner-header-actions form {
    flex: 1 1 100%;
  }
  .partner-header-actions .partner-logout {
    width: 100%;
    justify-content: center;
  }
}

/* Tablet portrait: a touch more breathing room than the phone breakpoint gives. */
@media (min-width: 561px) and (max-width: 1024px) {
  .partner-catalog { padding: 0 28px; }
  .partner-header { padding: 24px 28px; }
  .partner-invoice { padding: 14px 28px; }
}

/* Orders list cards: avoid an overly wide single column on tablets. */
@media (min-width: 561px) {
  .partner-orders-grid { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
}

/* Small phones: tighten card/section padding so more content fits without feeling cramped. */
@media (max-width: 420px) {
  .partner-product-head { padding: 12px; gap: 10px; }
  .partner-units { padding: 4px 12px; }
  .partner-order-note { padding: 12px; }
}