/* ═══════════════════════════════════════════════════════════════════════
 * PASKAMER PRAAT — Mobile polish + Uitgelicht intro-title remover (v1.1.0)
 * ═══════════════════════════════════════════════════════════════════════
 *
 * CSS-only additive override. Raakt géén JS/logica aan.
 *
 * v1.1.0 (2 juli 2026):
 *   - Alleen de H3-TITEL "Ontdek exclusieve merken, collecties en aan-
 *     biedingen" verwijderen. Subtitel-tekst BLIJFT staan.
 *   - A-Z + 0-9 dropdown functionaliteit onaangetast.
 *   - GESPONSORD-tag overlap op mobile opgelost: merknaam wraps nu
 *     naast een gereserveerde 92 px tag-kolom.
 *
 * ═══════════════════════════════════════════════════════════════════════ */

/* ─── 1: Alleen H3-titel verbergen, subtitel BLIJFT staan ────────────── */
#pp-uitg-teaser .pp-merken-teaser-titel {
  display: none !important;
}
/* Subtitel-tekst blijft standaard styling behouden */

/* ─── 2: Kleine layout-tweak: tekst en toggle netjes uitgelijnd ──────── */
#pp-uitg-teaser .pp-merken-teaser-head {
  align-items: center !important;
}
#pp-uitg-teaser .pp-merken-teaser-text {
  margin-top: 0 !important;
}

/* ─── 3: GESPONSORD tag overlap fix op mobile ────────────────────────── */
@media (max-width: 640px) {
  /* Sponsored partnerkaart: compacter, betere logo-verhouding */
  .pp-uitg-kaart {
    padding: 12px 14px !important;
    gap: 10px !important;
    min-height: 84px !important;
    border-radius: 12px !important;
  }
  .pp-uitg-logo {
    width: 52px !important;
    height: 52px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
  }
  /* Gereserveerde ruimte voor GESPONSORD-tag rechtsboven (92 px) */
  .pp-uitg-info {
    padding-right: 92px !important;
    min-width: 0 !important;
  }
  .pp-uitg-merk {
    font-size: 0.95rem !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    word-break: break-word !important;
    text-overflow: ellipsis !important;
  }
  .pp-uitg-msg,
  .pp-uitg-kaart-desc {
    font-size: 0.78rem !important;
    line-height: 1.4 !important;
    -webkit-line-clamp: 2 !important;
    padding-right: 0 !important;
  }
  /* Tag zelf: iets kleiner + strak in de rechterbovenhoek */
  .pp-uitg-tag {
    top: 12px !important;
    right: 12px !important;
    font-size: 8.5px !important;
    padding: 4px 7px !important;
    max-width: 84px !important;
    white-space: nowrap !important;
  }
  .pp-uitg-cta {
    font-size: 0.75rem !important;
    margin-top: 6px !important;
  }
  .pp-uitg-kaart-meta {
    gap: 4px 8px !important;
    margin-top: 4px !important;
  }
  .pp-uitg-kaart-categorie {
    font-size: 9px !important;
  }
  .pp-uitg-kaart-productcount {
    font-size: 10.5px !important;
  }
  .pp-uitg-badge-populair {
    font-size: 8.5px !important;
    padding: 4px 7px !important;
    bottom: 10px !important;
    right: 10px !important;
  }

  /* Sectie header */
  .pp-uitg-header {
    padding: 6px 2px 12px !important;
    margin-bottom: 12px !important;
  }
  .pp-uitg-eyebrow {
    font-size: 10px !important;
    letter-spacing: 0.12em !important;
    margin-bottom: 4px !important;
  }
  .pp-uitg-titel {
    font-size: 1.25rem !important;
    line-height: 1.2 !important;
  }

  /* Product-overview grid */
  .pp-uitg-feed-grid {
    gap: 8px !important;
  }
  .pp-uitg-feed-header {
    padding: 20px 2px 10px !important;
    margin-top: 16px !important;
    margin-bottom: 12px !important;
  }

  /* Intro-blok (algemene fallback) */
  .pp-uitg-intro {
    padding: 12px 14px !important;
    margin-bottom: 16px !important;
  }
  .pp-uitg-intro-titel {
    font-size: 1.02rem !important;
  }
  .pp-uitg-intro-tekst {
    font-size: 0.8rem !important;
  }

  /* Teaser subtitel-tekst iets compacter op mobile */
  #pp-uitg-teaser {
    padding: 12px 14px !important;
  }
  #pp-uitg-teaser .pp-merken-teaser-text {
    font-size: 0.85rem !important;
    line-height: 1.5 !important;
  }

  /* Feed tabs balk: iets kleiner op mobile zodat "Onze merkpartners" past */
  #dy-filterbar .dy-filter,
  .dy-filterbar .dy-filter {
    font-size: 12.5px !important;
    padding: 7px 12px !important;
  }
}

/* Extra small screens (≤ 380 px) */
@media (max-width: 380px) {
  .pp-uitg-kaart {
    padding: 10px 12px !important;
    gap: 9px !important;
  }
  .pp-uitg-logo {
    width: 48px !important;
    height: 48px !important;
  }
  .pp-uitg-info {
    padding-right: 82px !important;
  }
  .pp-uitg-merk {
    font-size: 0.88rem !important;
  }
  .pp-uitg-tag {
    max-width: 76px !important;
    font-size: 8px !important;
  }
  .pp-uitg-titel {
    font-size: 1.15rem !important;
  }
}