/* ============================================================
   USEPHA — Responsividade (telemóvel, tablet, desktop)
   ============================================================ */

/* Base fluid */
img, video, iframe, svg {
  max-width: 100%;
  height: auto;
}
table { width: 100%; }
.table-responsive {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* —— Desktop large —— */
@media (min-width: 1400px) {
  .p-container,
  .p-nav-inner {
    max-width: 1280px;
  }
}

/* —— Tablet landscape / small desktop —— */
@media (max-width: 1199.98px) {
  .p-areas { grid-template-columns: repeat(2, 1fr) !important; }
  .stat-grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important; }
}

/* —— Tablet portrait —— */
@media (max-width: 991.98px) {
  /* Portal nav */
  .p-nav-toggle { display: block !important; color: #fff; }
  .p-nav-end { margin-left: auto; }
  .p-nav-links {
    display: none !important;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: rgba(47, 26, 20, .97);
    flex-direction: column !important;
    padding: 1rem 1.5rem 1.5rem;
    gap: .85rem !important;
    align-items: stretch !important;
    box-shadow: 0 12px 24px rgba(0,0,0,.25);
    z-index: 1100;
  }
  .p-nav-links.open { display: flex !important; }
  .p-nav-links a {
    padding: .55rem 0;
    border-bottom: 1px solid rgba(255,255,255,.08);
    width: 100%;
  }
  .p-nav-links .p-btn-nav {
    text-align: center;
    margin-top: .35rem;
  }
  .p-logo img { height: 44px; }

  .p-hero-body { padding: 6.5rem 1.25rem 4rem; }
  .p-hero-line { font-size: 1rem; }
  .p-hero-cta { flex-direction: column; align-items: stretch; }
  .p-hero-cta .p-btn { justify-content: center; width: 100%; }

  .p-mission { grid-template-columns: 1fr !important; gap: 1.75rem !important; }
  .p-mission-visual { min-height: 220px; order: -1; }
  .p-news-grid { grid-template-columns: 1fr !important; }
  .p-events { grid-template-columns: 1fr !important; }
  .p-projects { grid-template-columns: 1fr 1fr !important; }
  .p-impact-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 1rem !important; }
  .p-footer-grid { grid-template-columns: 1fr 1fr !important; }
  .p-contact { grid-template-columns: 1fr !important; }
  .p-areas { grid-template-columns: repeat(2, 1fr) !important; }
  .p-participate-banner { grid-template-columns: 1fr !important; }
  .p-gallery { grid-template-columns: repeat(2, 1fr) !important; }
  .p-gallery-item:nth-child(1) {
    grid-column: span 2 !important;
    grid-row: span 1 !important;
    aspect-ratio: 16/9 !important;
  }

  .p-section { padding: 3rem 0 !important; }
  .p-container { padding: 0 1.15rem !important; }

  /* Inner pages */
  .p-page { padding: 2rem 0 3rem !important; }
  .p-interest-layout { grid-template-columns: 1fr !important; gap: 1.75rem !important; }
  .p-form-row,
  .p-form-row-3 { grid-template-columns: 1fr !important; }
  .p-related { grid-template-columns: 1fr !important; }
  .p-article { max-width: 100%; }

  /* Lightbox */
  .p-lightbox { padding: 3.5rem .75rem !important; }
  .p-lightbox-nav { width: 40px; height: 40px; font-size: 1.75rem; }
  .p-lightbox-prev { left: .25rem; }
  .p-lightbox-next { right: .25rem; }

  /* Admin panel */
  .sidebar {
    transform: translateX(-100%);
    width: min(280px, 85vw) !important;
  }
  .sidebar.show { transform: translateX(0); }
  .main-content { margin-left: 0 !important; }
  .content-area { padding: 1rem !important; }
  .topbar { padding: 0 1rem !important; }
  .topbar-title h1 { font-size: 1.05rem !important; }
  .page-actions {
    flex-direction: column;
    align-items: stretch !important;
  }
  .page-actions .search-box {
    max-width: 100% !important;
    width: 100%;
  }
  .stat-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .stat-grid[style*="repeat(3"],
  .stat-grid[style*="repeat(4"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .panel-header {
    flex-wrap: wrap;
    gap: .75rem;
  }
  .panel-body { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .user-info { display: none !important; }
  .filters-bar,
  .page-actions {
    gap: .75rem !important;
  }
  .form-grid,
  .row.g-3 > [class*="col-md-"],
  .row.g-4 > [class*="col-md-"] {
    min-width: 0;
  }
}

/* —— Mobile —— */
@media (max-width: 767.98px) {
  .p-projects { grid-template-columns: 1fr !important; }
  .p-footer-grid { grid-template-columns: 1fr !important; gap: 1.75rem !important; }
  .p-footer-bottom {
    flex-direction: column;
    text-align: center;
    align-items: center;
  }
  .p-impact-num { font-size: 1.75rem !important; }
  .p-news-item.has-thumb a {
    grid-template-columns: 72px 1fr !important;
  }
  .p-news-photo { height: 160px !important; }
  .p-donate-actions { flex-direction: column; }
  .p-donate-actions .p-btn { width: 100%; justify-content: center; }

  .stat-body .stat-value { font-size: 1.25rem !important; }
  .action-btns { flex-wrap: wrap; }
}

/* —— Small phones —— */
@media (max-width: 575.98px) {
  .p-logo img { height: 38px; padding: .25rem .4rem; }
  .p-hero-brand { font-size: 2.4rem !important; }
  .p-hero-tag { letter-spacing: .12em; font-size: .65rem; }
  .p-hero-scroll { display: none; }
  .p-impact-grid { grid-template-columns: 1fr 1fr !important; }
  .p-areas { grid-template-columns: 1fr !important; }
  .p-gallery { grid-template-columns: 1fr !important; }
  .p-gallery-item:nth-child(1) {
    grid-column: span 1 !important;
    aspect-ratio: 4/3 !important;
  }
  .p-list-row { grid-template-columns: 1fr !important; }
  .p-event { grid-template-columns: 64px 1fr !important; gap: .85rem !important; }
  .p-form-card { padding: 1.25rem !important; }
  .p-section-head h2 { font-size: 1.55rem !important; }

  .stat-grid {
    grid-template-columns: 1fr !important;
  }
  .stat-grid[style] {
    grid-template-columns: 1fr !important;
  }
  .topbar-actions .btn-icon { width: 34px; height: 34px; }
  .content-area { padding: .75rem !important; }
  .table { font-size: .8rem; }
  .table thead th,
  .table tbody td { padding: .55rem .65rem !important; }
}

/* —— Very small —— */
@media (max-width: 379.98px) {
  .p-hero-cta .p-btn { font-size: .88rem; padding: .7rem 1rem; }
  .p-impact-label { font-size: .75rem; }
}

/* —— Login —— */
@media (max-width: 575.98px) {
  .login-wrap { padding: 1rem; }
  .login-box { padding: 1.5rem 1.15rem 1.35rem; border-radius: 12px; }
  .login-brand img { height: 64px; }
  .login-box h1 { font-size: 1.35rem; }
}

/* Touch targets */
@media (hover: none) and (pointer: coarse) {
  .p-btn,
  .login-btn,
  .p-area,
  .p-nav-links a {
    min-height: 44px;
  }
  .p-gallery-item figcaption {
    opacity: 1;
    transform: none;
  }
}

/* Print */
@media print {
  .p-nav,
  .p-hero-scroll,
  .p-lightbox,
  .sidebar,
  .topbar,
  .p-donate-actions,
  .sidebar-overlay { display: none !important; }
  .main-content { margin-left: 0 !important; }
  body { background: #fff; color: #000; }
}
