/**
 * WPG · Parceiros
 * public/partners/styles.css
 *
 * Classes prefixadas com "pt-" (partners) pra não colidir com o
 * resto do site. Compartilhado entre loader.js (página completa) e
 * ad-banner.js (banner reutilizável).
 */

/* ---------- Página completa (loader.js) ---------- */

.pt-page {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 56px 24px 80px;
  color: #e7ebf1;
  font-family: 'Work Sans', system-ui, -apple-system, sans-serif;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 28px;
  box-sizing: border-box;
}
.pt-page * { box-sizing: border-box; }

.pt-breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #64748b;
  flex-wrap: wrap;
}
.pt-breadcrumb-current { color: #c7ced9; }

.pt-hero { position: relative; width: 100%; }
.pt-hero-img { width: 100%; border-radius: 16px; display: block; }
.pt-hero-cta {
  position: absolute;
  border-radius: 999px;
  transition: box-shadow 0.2s ease;
}
.pt-hero-cta:hover,
.pt-hero-cta:focus-visible {
  box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.6);
  outline: none;
}

.pt-packages { width: 100%; text-align: left; }
.pt-packages-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 14px;
}
.pt-packages-title { font-size: 15px; font-weight: 700; color: #e7ebf1; }
.pt-see-all { font-size: 13px; color: #2dd4bf; text-decoration: none; }
.pt-packages-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
@media (max-width: 720px) {
  .pt-packages-grid { grid-template-columns: repeat(2, 1fr); }
}

.pt-pkg-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: #12181f;
  border: 1px solid #1e2530;
  border-radius: 14px;
  padding: 16px;
  text-decoration: none;
  transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.pt-pkg-card:hover {
  border-color: rgba(234, 179, 8, 0.6);
  box-shadow: 0 0 0 1px rgba(234, 179, 8, 0.35), 0 0 28px rgba(234, 179, 8, 0.25);
  transform: translateY(-2px);
}
.pt-pkg-img { width: 100%; height: 118px; object-fit: cover; border-radius: 10px; display: block; }
.pt-pkg-name { font-size: 13px; font-weight: 600; color: #e7ebf1; }
.pt-pkg-price-row { display: flex; align-items: baseline; gap: 6px; }
.pt-pkg-price { font-size: 15px; font-weight: 700; color: #f4f6f9; }
.pt-pkg-orig { font-size: 12px; color: #55606f; text-decoration: line-through; }
.pt-pkg-buy {
  text-align: center;
  background: #2dd4bf;
  color: #0b0f16;
  font-size: 12px;
  font-weight: 700;
  padding: 8px;
  border-radius: 8px;
  transition: background 0.2s ease;
}
.pt-pkg-card:hover .pt-pkg-buy { background: #5eead4; }

.pt-empty { padding: 40px; text-align: center; color: #64748b; }

/* ---------- Banner de anúncio (ad-banner.js) ---------- */

.pt-ad {
  text-decoration: none;
  font-family: 'Work Sans', system-ui, -apple-system, sans-serif;
  background: #12181f;
  border: 1px solid #1e2530;
  border-radius: 14px;
  transition: border-color 0.2s ease;
  box-sizing: border-box;
}
.pt-ad:hover { border-color: rgba(45, 212, 191, 0.35); }
.pt-ad-icon {
  flex: none;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: #0d9488;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pt-ad-title { font-size: 15px; font-weight: 700; color: #f4f6f9; display: block; }
.pt-ad-desc { font-size: 13px; color: #8a94a6; display: block; margin-top: 2px; }
.pt-ad-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #2dd4bf;
  color: #0b0f16;
  font-size: 13px;
  font-weight: 700;
  padding: 10px 18px;
  border-radius: 10px;
  white-space: nowrap;
  transition: background 0.2s ease;
}
.pt-ad:hover .pt-ad-cta { background: #5eead4; }

/* wide: ícone + texto à esquerda, CTA à direita */
.pt-ad-wide {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 22px;
}
.pt-ad-wide .pt-ad-text { display: flex; flex-direction: column; gap: 0; }

/* compact: empilhado, largura fixa pra sidebar */
.pt-ad-compact {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 260px;
  padding: 18px;
}
.pt-ad-compact .pt-ad-icon { width: 36px; height: 36px; border-radius: 9px; }
.pt-ad-compact .pt-ad-title { font-size: 14px; line-height: 1.3; }
.pt-ad-compact .pt-ad-desc { font-size: 12px; line-height: 1.4; margin-top: 0; }
.pt-ad-compact .pt-ad-cta { align-self: flex-start; font-size: 12px; padding: 8px 14px; border-radius: 8px; }

@media (max-width: 600px) {
  .pt-ad-wide { flex-direction: column; align-items: flex-start; }
  .pt-ad-wide .pt-ad-cta { align-self: stretch; justify-content: center; }
}