/* Mobile responsiveness hotfixes (non-breaking overrides) */

/* 1) Utility bar translate trigger should not force overflow */
#google_translate_element {
  inline-size: clamp(96px, 28vw, 140px);
  min-inline-size: 0;
}

/* 2) Reduce nav crowding on 1024-ish widths without changing menu mode */
@media (max-width: 1200px) {
  .header-nav > a,
  .header-nav .has-mega-trigger {
    padding-inline: clamp(8px, 1vw, 12px);
    font-size: clamp(12px, 1.05vw, 13.5px);
  }

  .header-main-row {
    gap: 8px;
  }

  .logo {
    margin-right: 12px;
  }
}

/* 3) Drawer sizing for small phones and tablets */
.ti-drawer {
  width: clamp(280px, 82vw, 380px);
  max-width: 100vw;
}

@media (max-width: 390px) {
  .ti-drawer {
    width: 92vw;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .ti-drawer {
    width: 360px;
  }
}

/* 4) Keep CPV popup within viewport on narrow screens */
.search-page #divcpv {
  left: 0;
  right: 0;
  width: min(100vw - 24px, 620px);
  min-width: 0;
  max-width: 100%;
  margin-inline: auto;
  box-sizing: border-box;
}

/* 5) Better tablet form layout */
@media (max-width: 900px) {
  .search-page .form-grid.cols-3 {
    grid-template-columns: 1fr 1fr;
  }
}

/* 6) Prevent overflow in location cells under card layout */
@media (max-width: 768px) {
  table.tender-table td.td-location {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    display: block;
  }
}

/* 7) Promote tender table card mode earlier for tablet portrait */
@media (max-width: 768px) {
  table.tender-table thead {
    display: none;
  }

  table.tender-table tbody tr {
    display: block;
    padding: 14px 16px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  table.tender-table td {
    display: block;
    padding: 2px 0 !important;
    border: 0;
  }
}

/* 8) Phone input/dropdown width safety on details-like pages */
.iti__dropdown-content {
  width: min(92vw, 360px) !important;
  max-width: 100% !important;
  left: 0 !important;
}

.ph-in {
  width: 100% !important;
  min-width: 0;
  box-sizing: border-box;
}

/* 9) Hero search scaling on larger screens */
.hero-search-wrap {
  width: min(100%, 760px);
  max-width: 100%;
}

/* 10) Guard legacy live-search overflow */
#livesearch {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  box-sizing: border-box;
}