/* Custom CSS for EU Popup Mobile Fix */
/* Prevents logos from stacking on mobile - makes them shrink instead */

@media (max-width: 768px) {
  /* Prevent wrapping on mobile */
  .logos-row[data-astro-cid-aiigpwod] {
    flex-wrap: nowrap !important;
    gap: 0.75rem !important;
  }

  /* Allow logo groups to shrink and set max width */
  .eu-logo-group[data-astro-cid-aiigpwod],
  .hr-logo-group[data-astro-cid-aiigpwod] {
    flex-shrink: 1 !important;
    min-width: 0 !important;
    max-width: 48% !important;
  }

  /* Shrink EU flag more */
  .eu-flag[data-astro-cid-aiigpwod] {
    width: 45px !important;
    height: auto !important;
    flex-shrink: 0 !important;
  }

  /* Shrink Croatian coat of arms more */
  .hr-shield[data-astro-cid-aiigpwod] {
    max-height: 40px !important;
    width: auto !important;
    flex-shrink: 0 !important;
  }

  /* Reduce text size on mobile and allow wrapping */
  .eu-text[data-astro-cid-aiigpwod],
  .hr-text[data-astro-cid-aiigpwod] {
    font-size: 0.6rem !important;
    line-height: 1.15 !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
  }

  .eu-label[data-astro-cid-aiigpwod],
  .hr-country[data-astro-cid-aiigpwod] {
    font-size: 0.55rem !important;
  }

  .eu-name[data-astro-cid-aiigpwod],
  .eu-program[data-astro-cid-aiigpwod],
  .hr-ministry[data-astro-cid-aiigpwod] {
    font-size: 0.65rem !important;
  }

  /* Reduce popup padding on very small screens */
  @media (max-width: 480px) {
    .eu-popup-card[data-astro-cid-aiigpwod] {
      padding: 1rem !important;
      max-width: 95% !important;
    }

    .logos-row[data-astro-cid-aiigpwod] {
      gap: 0.5rem !important;
    }

    .eu-logo-group[data-astro-cid-aiigpwod],
    .hr-logo-group[data-astro-cid-aiigpwod] {
      max-width: 48% !important;
    }

    .eu-flag[data-astro-cid-aiigpwod] {
      width: 35px !important;
    }

    .hr-shield[data-astro-cid-aiigpwod] {
      max-height: 32px !important;
    }

    .eu-text[data-astro-cid-aiigpwod],
    .hr-text[data-astro-cid-aiigpwod] {
      font-size: 0.5rem !important;
    }

    .eu-label[data-astro-cid-aiigpwod],
    .hr-country[data-astro-cid-aiigpwod] {
      font-size: 0.45rem !important;
    }

    .eu-name[data-astro-cid-aiigpwod],
    .eu-program[data-astro-cid-aiigpwod],
    .hr-ministry[data-astro-cid-aiigpwod] {
      font-size: 0.55rem !important;
    }
  }
}