/* Kad2U V82 - Live Card Smart Spacing + Theme Button Polish
   Scope: live/public card sahaja.
   Tujuan:
   1) Susunan bubble/section lebih konsisten ikut lebar design card.
   2) Kurangkan gap bawah sebelum menu fixed.
   3) Semua button utama ikut warna yang user set dalam editor (--button).
   4) Kekalkan artwork/background/layout asal. Tiada perubahan pada image sizing. */

.ewc-public-page{
  --ewc-v82-shell-x: 16px;
  --ewc-v82-section-w: min(340px, calc(100% - (var(--ewc-v82-shell-x) * 2)));
  --ewc-v82-gap: 12px;
  --ewc-v82-button: var(--button, var(--primary, #B76E8A));
  --ewc-v82-button-rgb: var(--button-rgb, var(--primary-rgb, 183,110,138));
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

/* Safety: buang shadow/outline font sahaja. */
.ewc-public-page,
.ewc-public-page *{
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
}

/* Jangan kacau image/artwork. Hanya kemaskan ruang vertical content. */
.ewc-public-page.ewc-opened .ewc-card-main{
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
}

.ewc-public-page.ewc-opened .ewc-hero{
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Semua bubble/section bawah guna width yang sama supaya nampak aligned dengan kad. */
.ewc-public-page.ewc-opened .ewc-quick-panel-v52,
.ewc-public-page.ewc-opened .ewc-section,
.ewc-public-page.ewc-opened .ewc-countdown-card{
  width: var(--ewc-v82-section-w) !important;
  max-width: 340px !important;
  box-sizing: border-box !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-bottom: var(--ewc-v82-gap) !important;
}

.ewc-public-page.ewc-opened .ewc-quick-panel-v52{
  margin-top: var(--ewc-v82-gap) !important;
}

.ewc-public-page.ewc-opened .ewc-countdown-card{
  margin-top: var(--ewc-v82-gap) !important;
}

.ewc-public-page.ewc-opened .ewc-glass{
  padding: 18px !important;
}

.ewc-public-page.ewc-opened .ewc-info-section h2,
.ewc-public-page.ewc-opened .ewc-section h2{
  margin-bottom: 12px !important;
}

.ewc-public-page.ewc-opened .ewc-invite-wording,
.ewc-public-page.ewc-opened .ewc-location-card,
.ewc-public-page.ewc-opened .ewc-contact-card,
.ewc-public-page.ewc-opened .ewc-prayer-text{
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.ewc-public-page.ewc-opened .ewc-detail-grid,
.ewc-public-page.ewc-opened .ewc-contact-list,
.ewc-public-page.ewc-opened .ewc-itinerary-list,
.ewc-public-page.ewc-opened .ewc-form{
  gap: 10px !important;
}

.ewc-public-page.ewc-opened .ewc-actions,
.ewc-public-page.ewc-opened .ewc-contact-actions,
.ewc-public-page.ewc-opened .ewc-quick-actions-v52,
.ewc-public-page.ewc-opened .ewc-success-actions{
  gap: 8px !important;
}

/* Last section jangan tinggalkan ruang besar sebelum footer/menu. */
.ewc-public-page.ewc-opened .ewc-card-main > .ewc-section:last-of-type{
  margin-bottom: 8px !important;
}

.ewc-public-page.ewc-opened .ewc-footer{
  width: var(--ewc-v82-section-w) !important;
  max-width: 340px !important;
  margin: 0 auto !important;
  padding: 6px 0 calc(72px + env(safe-area-inset-bottom)) !important;
  color: rgba(52,41,54,.42) !important;
}

/* Button utama ikut warna yang user pilih. */
.ewc-public-page .ewc-btn-primary,
.ewc-public-page .ewc-open-btn,
.ewc-public-page .ewc-quick-actions-v52 a,
.ewc-public-page .ewc-success-actions a,
.ewc-public-page .ewc-gallery-more-btn,
.ewc-public-page .ewc-form button[type="submit"],
.ewc-public-page .ewc-floating-cta-v71 a,
.ewc-public-page .ewc-floating-cta-v71 button{
  color: #fff !important;
  border-color: rgba(var(--ewc-v82-button-rgb), .18) !important;
  background: linear-gradient(135deg, var(--ewc-v82-button), color-mix(in srgb, var(--ewc-v82-button) 78%, #000 22%)) !important;
  box-shadow: 0 12px 26px rgba(var(--ewc-v82-button-rgb), .20), inset 0 1px 0 rgba(255,255,255,.24) !important;
}

/* Soft button masih ikut theme, tapi lebih ringan. */
.ewc-public-page .ewc-btn-soft,
.ewc-public-page .ewc-contact-actions .ewc-btn-soft{
  color: var(--ewc-v82-button) !important;
  border-color: rgba(var(--ewc-v82-button-rgb), .22) !important;
  background: rgba(255,255,255,.66) !important;
  box-shadow: 0 10px 20px rgba(var(--ewc-v82-button-rgb), .08), inset 0 1px 0 rgba(255,255,255,.74) !important;
}

.ewc-public-page .ewc-bottom-nav a.active,
.ewc-public-page .ewc-bottom-nav.has-gallery-nav a.active{
  color: var(--ewc-v82-button) !important;
}

.ewc-public-page .ewc-bottom-nav a.active .ewc-nav-icon,
.ewc-public-page .ewc-bottom-nav.has-gallery-nav a.active .ewc-nav-icon{
  background: linear-gradient(135deg, var(--ewc-v82-button), color-mix(in srgb, var(--ewc-v82-button) 78%, #000 22%)) !important;
  box-shadow: 0 8px 18px rgba(var(--ewc-v82-button-rgb), .20), inset 0 1px 0 rgba(255,255,255,.26) !important;
}

.ewc-public-page .ewc-date-card b,
.ewc-public-page .ewc-section-label,
.ewc-public-page .ewc-small-title,
.ewc-public-page .ewc-itinerary-list span,
.ewc-public-page .ewc-detail-item i,
.ewc-public-page .ewc-wish strong{
  color: var(--ewc-v82-button) !important;
}

.ewc-public-page .ewc-detail-item i,
.ewc-public-page .ewc-itinerary-list span{
  background: rgba(var(--ewc-v82-button-rgb), .10) !important;
}

@supports not (color: color-mix(in srgb, #000 50%, #fff 50%)){
  .ewc-public-page .ewc-btn-primary,
  .ewc-public-page .ewc-open-btn,
  .ewc-public-page .ewc-quick-actions-v52 a,
  .ewc-public-page .ewc-success-actions a,
  .ewc-public-page .ewc-gallery-more-btn,
  .ewc-public-page .ewc-form button[type="submit"],
  .ewc-public-page .ewc-floating-cta-v71 a,
  .ewc-public-page .ewc-floating-cta-v71 button,
  .ewc-public-page .ewc-bottom-nav a.active .ewc-nav-icon,
  .ewc-public-page .ewc-bottom-nav.has-gallery-nav a.active .ewc-nav-icon{
    background: var(--ewc-v82-button) !important;
  }
}

@media (max-width:420px){
  .ewc-public-page{
    --ewc-v82-shell-x: 12px;
    --ewc-v82-gap: 10px;
  }
  .ewc-public-page.ewc-opened .ewc-glass{
    padding: 16px !important;
  }
  .ewc-public-page.ewc-opened .ewc-footer{
    padding-bottom: calc(70px + env(safe-area-inset-bottom)) !important;
  }
}
