/* Overlay & Popup */
.woogift-overlay{
  position: fixed; inset: 0; background: rgba(0,0,0,0.6);
  display:flex; align-items:center; justify-content:center;
  z-index: 999999;
}
.woogift-popup{
  position: relative; border-radius: 12px; padding: 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25); text-align: center;
  display:flex; flex-direction: column; gap: 8px;
}
.woogift-close{
  position:absolute; top:8px; right:12px; background:transparent; border:none;
  font-size:24px; line-height:1; cursor:pointer; color:#6b7280;
}
.woogift-title{ font-size: 22px; font-weight: 700; margin: 0; }
.woogift-subtitle{ color:#6b7280; margin: 0 0 10px; }

.woogift-gifts{ display:flex; flex-direction: column; gap: 6px; overflow:auto; }
.woogift-gift-row{
  display:grid; grid-template-columns: 1fr auto; align-items:center;
  border:2px solid #e5e7eb; border-radius:10px; padding:6px 8px; cursor:pointer; background:#fff;
}
.woogift-gift-row.selected{ box-shadow: 0 0 0 2px rgba(59,130,246,.5); }
.woogift-gift-name{ font-weight:600; text-align:left; }
.woogift-gift-image{ border-radius:8px; object-fit:cover; }

.woogift-phone{
  width: 80%; margin: 6px auto; padding: 10px; border:1px solid #d1d5db; border-radius: 6px;
}
.woogift-error{ color:#dc2626; font-size: 13px; min-height: 18px; }

.woogift-btn{
  margin: 6px auto 0; border:none; border-radius:10px; cursor:pointer; font-weight:600;
}

/* Success Popup */
.woogift-success{
  position: relative; border-radius: 12px; padding: 18px; text-align:center;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
  max-width: 95vw;
}
.woogift-success-topbar{
  padding: 6px 10px; font-weight: 600;
}
.woogift-success-image{
  width: 128px; height: 128px; border-radius: 999px; object-fit:cover; margin: 14px auto;
  box-shadow: 0 8px 20px rgba(0,0,0,.2);
}
.woogift-success-title{ font-size: 22px; font-weight: 800; margin: 6px 0; }
.woogift-success-message{ font-size: 16px; }
.woogift-success-hint{ font-size: 12px; color:#9ca3af; margin-top: 6px; }
.woogift-ok{
  margin-top: 12px; background:#16a34a; color:#fff; border:none; border-radius: 8px; padding:10px 16px; cursor:pointer;
}

/* Top Bar Countdown */
.woogift-topbar{
  position: fixed; top: 0; left: 0; right: 0; z-index: 999998; display:flex; align-items:center; justify-content:center;
  box-shadow: 0 2px 10px rgba(0,0,0,.2);
}
.woogift-topbar-inner{ font-weight: 700; }
.woogift-topbar-text{ margin-right: 6px; }

/* Animation */
@keyframes pop-in{0%{opacity:0;transform:scale(.6)}100%{opacity:1;transform:scale(1)}}
.pop-in{ animation: pop-in .5s cubic-bezier(.25,.46,.45,.94) both; }


/* === WooGift: Show all products without internal scroll & button size vars === */
.woogift-gifts{
  max-height: none !important;
  overflow: visible !important;
}
.woogift-popup{
  height: auto !important;
  max-height: calc(100vh - 80px) !important;
}

/* Optional: wrap rows nicely if theme constrains width */
.woogift-gifts > .woogift-gift-row{
  /* ensures rows don't overflow horizontally in tight containers */
  width: 100%;
}

/* Button size via existing settings */
.woogift-btn{
  width: var(--wg-btn-w, auto);
  height: var(--wg-btn-h, auto);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
}

/* --- Custom adjustments per user requests (2025-10-02) --- */

/* Keep popup within viewport and allow scrolling if content overflows */
.woogift-popup{
  max-width: calc(100vw - 32px);
  max-height: calc(100vh - 80px);
  overflow: auto;
  box-sizing: border-box;
}

/* Make products closer to each other */
.woogift-gifts{
  gap: 6px;            /* was 10px */
  margin: 0;
  padding: 0;
}
.woogift-gifts > .woogift-gift-row{
  padding: 8px 10px;   /* was 10px 12px */
}

/* Tighter internal grid spacing */
.woogift-gift-row{
  column-gap: 8px;     /* was 12px */
}

/* Phone input directly under the products and full width */
.woogift-phone{
  width: 100%;
  margin-top: 4px;
  margin-bottom: 0;
  box-sizing: border-box;
}

/* Place the button at the bottom inside the popup */
.woogift-btn{
  align-self: stretch;     /* full width inside container */
  margin-top: auto;        /* push to bottom of flex column */
}

/* Ensure nothing bleeds outside the popup on narrow screens */
@media (max-width: 480px){
  .woogift-popup{
    width: 92vw !important;    /* responsive width override */
    padding: 14px;
  }
  .woogift-title{ font-size: 18px; }
  .woogift-subtitle{ font-size: 13px; }
  .woogift-gift-name{ font-size: 13px; }
  .woogift-gift-image{ max-width: 72px; max-height: 72px; }
  .woogift-gift-row{
    grid-template-columns: 1fr auto; /* stack name + small image */
  }
  .woogift-btn{
    height: var(--wg-btn-h, 48px);
  }
}

/* Success overlay above popup */
#woogift-success-overlay { z-index: 1000001; background: transparent; }

/* Success box image full width */
.woogift-success img.woogift-success-image { width: 100%; height: auto; display:block; }

/* Topbar spacer to prevent overlap */
#woogift-topbar-spacer { width: 100%; display:block; }
