/* ================================================================
   Wedding Photo Upload — Front-end styles
   ================================================================ */

.wpu-widget {
  --wpu-rose:   #8B6F5E;
  --wpu-gold:   #C4A882;
  --wpu-dark:   #2C1F18;
  --wpu-cream:  #FAF7F4;
  --wpu-text:   #3d2e26;
  --wpu-muted:  #7a6560;
  --wpu-border: rgba(139,111,94,.22);
  font-family: -apple-system, 'Helvetica Neue', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  color: var(--wpu-text);
}

/* ── Admin notice ── */
.wpu-admin-notice {
  background: #fff8e1; border: 1px solid #ffe082;
  border-radius: 10px; padding: 12px 16px;
  font-size: 13px; color: #5c4a00; margin-bottom: 16px;
}
.wpu-admin-notice a { color: #8B6F5E; font-weight: 600; }

/* ── HERO ── */
.wpu-hero {
  background: linear-gradient(160deg, #1e1209 0%, #4a2e1c 50%, #2e1c0f 100%);
  padding: 52px 24px 44px;
  text-align: center;
  position: relative;
  overflow: hidden;
  border-radius: 0;
}
.wpu-hero::after {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 90% 70% at 50% 110%, rgba(196,168,130,.13), transparent);
  pointer-events: none;
}
.wpu-eyebrow {
  font-size: 10px; letter-spacing: .24em; text-transform: uppercase;
  color: var(--wpu-gold); opacity: .8; margin-bottom: 16px; position: relative;
}
.wpu-couple {
  font-size: clamp(42px, 10vw, 76px);
  font-weight: 300; color: #FAF7F4; line-height: 1;
  position: relative; margin: 0; letter-spacing: -.01em;
}
.wpu-rule {
  width: 40px; height: 1px; background: var(--wpu-gold);
  opacity: .55; margin: 20px auto; position: relative;
}
.wpu-heart { font-size: 22px; display: block; margin-bottom: 12px; position: relative; }
.wpu-hero-msg {
  font-size: 15px; color: rgba(250,247,244,.65); line-height: 1.75;
  max-width: 320px; margin: 0 auto; font-weight: 300; position: relative;
}

/* ── ENGAGEMENT PHOTOS ── */
.wpu-photos {
  display: grid;
  grid-template-columns: repeat(var(--wpu-cols, 4), 1fr);
  gap: 2px;
  background: rgba(196,168,130,.15);
}
.wpu-photos img {
  width: 100%; aspect-ratio: 3/4; object-fit: cover; display: block;
}
@media (max-width: 420px) {
  .wpu-photos { grid-template-columns: repeat(2, 1fr); }
}

/* ── STEPS ── */
.wpu-steps {
  display: flex; justify-content: center;
  padding: 28px 20px 20px; max-width: 480px; margin: 0 auto;
}
.wpu-step { flex: 1; text-align: center; position: relative; }
.wpu-step:not(:last-child)::after {
  content: ''; position: absolute; top: 18px;
  left: 50%; right: 0; height: 1px; background: var(--wpu-border);
}
.wpu-step-n {
  width: 36px; height: 36px; border-radius: 50%;
  border: 1.5px solid var(--wpu-gold);
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 500; color: var(--wpu-gold);
  margin: 0 auto 8px; background: #fff; position: relative; z-index: 1;
}
.wpu-step-l { font-size: 11px; color: var(--wpu-muted); line-height: 1.4; }

/* ── FORM WRAP ── */
.wpu-form-wrap { padding: 8px 16px 40px; }

/* ── CARD ── */
.wpu-card {
  background: #fff; border-radius: 18px;
  border: 1px solid var(--wpu-border);
  padding: 24px 22px;
  max-width: 480px; margin: 0 auto 12px;
}
.wpu-card-title {
  font-size: 20px; color: var(--wpu-rose);
  margin-bottom: 18px; font-weight: 400;
  letter-spacing: -.01em;
}

/* ── FIELDS ── */
.wpu-field { margin-bottom: 14px; }
.wpu-field:last-child { margin-bottom: 0; }
.wpu-field label {
  display: block; font-size: 11px; letter-spacing: .07em;
  text-transform: uppercase; color: var(--wpu-muted);
  margin-bottom: 6px; font-weight: 500;
}
.wpu-field input[type=text],
.wpu-field input[type=tel],
.wpu-field input[type=email],
.wpu-field select {
  width: 100%; padding: 13px 15px;
  border: 1.5px solid var(--wpu-border); border-radius: 12px;
  font-size: 16px; font-family: inherit; color: var(--wpu-text);
  background: #FDFCFB; outline: none;
  transition: border-color .2s, box-shadow .2s;
  -webkit-appearance: none; appearance: none;
}
.wpu-field input::placeholder { color: #c0b0a8; }
.wpu-field input:focus, .wpu-field select:focus {
  border-color: var(--wpu-gold);
  box-shadow: 0 0 0 3px rgba(196,168,130,.14);
}
.wpu-field input.wpu-err-field { border-color: #e07070; }
.wpu-field-hint { font-size: 11px; color: var(--wpu-muted); margin-top: 5px; line-height: 1.4; }
.wpu-opt { font-weight: 300; font-size: 10px; }

/* ── DROP ZONE ── */
.wpu-dropzone {
  border: 2px dashed rgba(196,168,130,.5); border-radius: 16px;
  padding: 36px 20px; text-align: center; cursor: pointer;
  background: #FDFCFB; position: relative;
  transition: border-color .2s, background .2s;
}
.wpu-dropzone.wpu-over { border-color: var(--wpu-gold); background: rgba(196,168,130,.06); }
.wpu-file-input {
  position: absolute; inset: 0; opacity: 0;
  cursor: pointer; width: 100%; height: 100%;
}
.wpu-dz-emoji { font-size: 40px; display: block; margin-bottom: 12px; pointer-events: none; }
.wpu-dz-title {
  font-size: 16px; font-weight: 500; color: var(--wpu-rose);
  margin-bottom: 4px; pointer-events: none;
}
.wpu-dz-sub { font-size: 12px; color: var(--wpu-muted); line-height: 1.5; pointer-events: none; }

/* ── THUMBNAILS ── */
.wpu-thumbs {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(68px,1fr));
  gap: 6px; margin-top: 14px;
}
.wpu-thumb {
  position: relative; border-radius: 10px;
  overflow: hidden; aspect-ratio: 1; background: #f0ebe7;
}
.wpu-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wpu-thumb-rm {
  position: absolute; top: 4px; right: 4px;
  background: rgba(0,0,0,.5); color: #fff; border: none;
  border-radius: 50%; width: 22px; height: 22px; font-size: 13px;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.wpu-thumb-count {
  font-size: 12px; color: var(--wpu-muted);
  text-align: center; margin-top: 10px;
}

/* ── UPLOAD BUTTON ── */
.wpu-btn {
  display: block; width: 100%; max-width: 480px;
  margin: 4px auto 0; padding: 17px;
  background: var(--wpu-rose); color: #fff; border: none;
  border-radius: 14px; font-size: 15px; font-weight: 500;
  cursor: pointer; letter-spacing: .02em;
  box-shadow: 0 4px 16px rgba(139,111,94,.3);
  transition: background .2s, transform .15s, box-shadow .2s;
}
.wpu-btn:hover:not(:disabled) {
  background: #7a5f50; transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(139,111,94,.4);
}
.wpu-btn:disabled { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }

/* ── PROGRESS ── */
.wpu-prog { max-width: 480px; margin: 14px auto 0; }
.wpu-prog-track {
  height: 5px; background: rgba(196,168,130,.2);
  border-radius: 99px; overflow: hidden;
}
.wpu-prog-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--wpu-rose), var(--wpu-gold));
  border-radius: 99px; transition: width .3s ease; width: 0%;
}
.wpu-prog-label { font-size: 12px; color: var(--wpu-muted); text-align: center; margin-top: 6px; }

/* ── ERROR TOAST ── */
.wpu-err {
  max-width: 480px; margin: 12px auto 0;
  background: #fdf0f0; border: 1px solid #f0b8b8;
  border-radius: 12px; padding: 13px 16px;
  font-size: 13px; color: #8b2020; line-height: 1.5;
}

/* ── SUCCESS ── */
.wpu-success {
  max-width: 480px; margin: 8px auto 0;
  background: #fff; border: 1px solid var(--wpu-border);
  border-radius: 18px; padding: 32px 24px;
  text-align: center;
}
.wpu-success-emoji { font-size: 52px; display: block; margin-bottom: 14px; }
.wpu-success-title {
  font-size: 26px; color: var(--wpu-rose);
  margin-bottom: 10px; font-weight: 300;
}
.wpu-success-msg { font-size: 14px; color: var(--wpu-muted); line-height: 1.7; }
.wpu-more-btn {
  margin-top: 20px; padding: 12px 26px;
  background: transparent; border: 1.5px solid var(--wpu-border);
  border-radius: 12px; font-size: 14px; color: var(--wpu-rose);
  cursor: pointer; transition: background .2s;
}
.wpu-more-btn:hover { background: rgba(139,111,94,.06); }

/* ================================================================
   v1.0.3 — Per-photo progress bars + My Photos gallery
   ================================================================ */

/* ── Per-photo progress bar ── */
.wpu-thumb {
  border-radius: 10px;
  background: #f0ebe7;
  /* Change to column so bar sits below image */
  display: flex;
  flex-direction: column;
  aspect-ratio: unset;          /* override old square constraint */
  overflow: visible;            /* let bar show below */
  position: relative;
}
.wpu-thumb-img-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  border-radius: 10px 10px 0 0;
  overflow: hidden;
  flex-shrink: 0;
}
.wpu-thumb-img-wrap img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}
/* Status icon overlay */
.wpu-thumb-status {
  position: absolute;
  inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  background: rgba(0,0,0,0);
  border-radius: 10px 10px 0 0;
  transition: background .2s;
  pointer-events: none;
  opacity: 0;
}
.wpu-thumb.is-uploading .wpu-thumb-status { opacity: 1; background: rgba(44,31,24,.3); }
.wpu-thumb.is-done     .wpu-thumb-status { opacity: 1; background: rgba(45,106,64,.25); }
.wpu-thumb.is-error    .wpu-thumb-status { opacity: 1; background: rgba(139,32,32,.25); }

/* Per-photo bar */
.wpu-thumb-bar {
  width: 100%;
  height: 5px;
  background: rgba(196,168,130,.2);
  border-radius: 0 0 10px 10px;
  overflow: hidden;
  flex-shrink: 0;
}
.wpu-thumb-bar-fill {
  height: 100%;
  width: 0%;
  border-radius: 0 0 10px 10px;
  transition: width .25s ease;
}
.wpu-thumb.is-waiting  .wpu-thumb-bar-fill { background: rgba(196,168,130,.4); }
.wpu-thumb.is-uploading .wpu-thumb-bar-fill {
  background: linear-gradient(90deg, var(--wpu-rose), var(--wpu-gold));
  animation: wpu-bar-shimmer 1.2s linear infinite;
  background-size: 200% 100%;
}
@keyframes wpu-bar-shimmer {
  0%   { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}
.wpu-thumb.is-done  .wpu-thumb-bar-fill { background: #4caf50; width: 100% !important; }
.wpu-thumb.is-error .wpu-thumb-bar-fill { background: #e07070; width: 100% !important; }

/* Tiny label under bar */
.wpu-thumb-label {
  font-size: 10px;
  color: var(--wpu-muted);
  text-align: center;
  padding: 3px 4px 4px;
  line-height: 1.2;
  border-radius: 0 0 10px 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.wpu-thumb.is-uploading .wpu-thumb-label { color: var(--wpu-rose); }
.wpu-thumb.is-done      .wpu-thumb-label { color: #2d7a40; }
.wpu-thumb.is-error     .wpu-thumb-label { color: #8b2020; }

/* Remove button stays top-right of the image wrap */
.wpu-thumb-rm {
  position: absolute;
  top: 4px; right: 4px;
  z-index: 2;
}

/* ── "Remember me" cookie notice ── */
.wpu-remember {
  display: flex; align-items: center; gap: 10px;
  background: rgba(196,168,130,.1);
  border: 1px solid var(--wpu-border);
  border-radius: 10px;
  padding: 10px 14px;
  margin-top: 14px;
  font-size: 12px; color: var(--wpu-muted);
}
.wpu-remember input[type=checkbox] { accent-color: var(--wpu-gold); width:16px; height:16px; flex-shrink:0; cursor:pointer; }
.wpu-remember label { cursor: pointer; line-height: 1.4; }

/* ── My Photos link/button ── */
.wpu-my-photos-link {
  display: block;
  text-align: center;
  margin-top: 10px;
  font-size: 13px;
  color: var(--wpu-rose);
  cursor: pointer;
  background: none;
  border: none;
  padding: 6px;
  text-decoration: underline;
  text-underline-offset: 3px;
  font-family: inherit;
}
.wpu-my-photos-link:hover { color: #7a5f50; }

/* ── My Photos gallery modal ── */
.wpu-gallery-overlay {
  display: none;
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(44,31,24,.88);
  backdrop-filter: blur(6px);
  overflow-y: auto;
  padding: 20px 16px 40px;
}
.wpu-gallery-overlay.open { display: block; }

.wpu-gallery-box {
  background: var(--wpu-cream);
  border-radius: 20px;
  max-width: 640px;
  margin: 0 auto;
  padding: 28px 20px 32px;
}
.wpu-gallery-header {
  display: flex; align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}
.wpu-gallery-title {
  font-size: 20px; color: var(--wpu-rose);
  font-weight: 400;
}
.wpu-gallery-close {
  background: none; border: none;
  font-size: 26px; color: var(--wpu-muted);
  cursor: pointer; line-height: 1; padding: 4px 8px;
  border-radius: 8px; transition: background .2s;
}
.wpu-gallery-close:hover { background: rgba(139,111,94,.12); }

.wpu-gallery-notice {
  font-size: 12px; color: var(--wpu-muted);
  text-align: center; margin-bottom: 16px;
  padding: 8px 12px;
  background: rgba(196,168,130,.12);
  border-radius: 8px;
}

.wpu-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px,1fr));
  gap: 8px;
}
.wpu-gallery-item {
  border-radius: 10px; overflow: hidden;
  aspect-ratio: 1; position: relative;
  background: rgba(196,168,130,.15);
  cursor: pointer;
}
.wpu-gallery-item img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform .3s;
}
.wpu-gallery-item:hover img { transform: scale(1.04); }
.wpu-gallery-item-label {
  position: absolute; bottom: 0; left: 0; right: 0;
  font-size: 10px; color: rgba(255,255,255,.85);
  padding: 16px 6px 5px;
  background: linear-gradient(transparent, rgba(0,0,0,.45));
  text-align: center;
}

/* Lightbox inside gallery */
.wpu-lightbox {
  display: none; position: fixed; inset: 0;
  z-index: 100001; background: rgba(0,0,0,.92);
  align-items: center; justify-content: center;
}
.wpu-lightbox.open { display: flex; }
.wpu-lightbox img {
  max-width: 94vw; max-height: 88vh;
  border-radius: 10px; object-fit: contain;
}
.wpu-lightbox-close {
  position: absolute; top: 16px; right: 18px;
  font-size: 30px; color: rgba(255,255,255,.7);
  background: none; border: none; cursor: pointer;
  line-height: 1;
}
.wpu-lb-prev, .wpu-lb-next {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(255,255,255,.1); border: none;
  color: rgba(255,255,255,.7); font-size: 28px;
  width: 48px; height: 48px; border-radius: 50%;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background .2s;
}
.wpu-lb-prev { left: 12px; }
.wpu-lb-next { right: 12px; }
.wpu-lb-prev:hover, .wpu-lb-next:hover { background: rgba(255,255,255,.22); }
.wpu-lb-info {
  position: absolute; bottom: 16px; left: 50%;
  transform: translateX(-50%);
  font-size: 12px; color: rgba(255,255,255,.6);
  white-space: nowrap;
}

.wpu-gallery-empty {
  text-align: center; padding: 40px 20px;
  color: var(--wpu-muted); font-size: 14px; line-height: 1.7;
}
.wpu-gallery-loading {
  text-align: center; padding: 40px;
  color: var(--wpu-muted); font-size: 14px;
}

/* ================================================================
   v1.0.8 additions
   ================================================================ */

/* ── Cancel button ── */
.wpu-cancel-btn {
  display: block;
  width: 100%; max-width: 480px;
  margin: 10px auto 0;
  padding: 12px;
  background: transparent;
  border: 1.5px solid rgba(139,111,94,.35);
  border-radius: 12px;
  font-size: 13px; font-weight: 500;
  color: var(--wpu-muted);
  font-family: inherit;
  cursor: pointer;
  transition: background .2s, color .2s;
}
.wpu-cancel-btn:hover { background: rgba(139,111,94,.08); color: var(--wpu-rose); }

/* ── Tip banner (large batch warning) ── */
.wpu-tip-banner {
  max-width: 480px; margin: 12px auto 0;
  background: rgba(196,168,130,.15);
  border: 1px solid rgba(196,168,130,.4);
  border-radius: 12px;
  padding: 12px 16px;
  font-size: 13px; color: var(--wpu-text);
  line-height: 1.55;
}

/* ── Message colour variants ── */
.wpu-err.wpu-msg-info {
  background: rgba(196,168,130,.1);
  border-color: rgba(196,168,130,.45);
  color: var(--wpu-text);
}
.wpu-err.wpu-msg-warn {
  background: #fff8e1;
  border-color: #ffe082;
  color: #5c4000;
}
.wpu-err.wpu-msg-error {
  background: #fdf0f0;
  border-color: #f0b8b8;
  color: #8b2020;
}

/* ── Tips section ── */
.wpu-tips {
  max-width: 480px; margin: 20px auto 0;
  background: #fff;
  border: 1px solid var(--wpu-border);
  border-radius: 16px;
  padding: 18px 20px;
}
.wpu-tip-item {
  display: flex; gap: 10px; align-items: flex-start;
  font-size: 13px; color: var(--wpu-muted);
  line-height: 1.6; padding: 6px 0;
  border-bottom: 1px solid rgba(196,168,130,.12);
}
.wpu-tip-item:last-child { border-bottom: none; padding-bottom: 0; }
.wpu-tip-item span { flex: 1; }

/* ── Cancelled thumb state ── */
.wpu-thumb.is-cancelled .wpu-thumb-bar-fill {
  background: #b0b0b0;
  width: 100% !important;
}
.wpu-thumb.is-cancelled .wpu-thumb-label { color: var(--wpu-muted); }

/* ================================================================
   v1.0.9 — Percentage on thumbnail, larger status overlay
   ================================================================ */

/* Percentage display — bigger, bold, always visible while uploading */
.wpu-thumb.is-uploading .wpu-thumb-status {
  font-size: 18px !important;
  font-weight: 700 !important;
  font-family: -apple-system, sans-serif !important;
  color: #fff !important;
  background: rgba(44,31,24,.55) !important;
  opacity: 1 !important;
  letter-spacing: -.5px;
  /* Ensure it's always visible */
  display: flex !important;
  align-items: center;
  justify-content: center;
}

/* Shimmer bar gets a speed indicator via animation */
.wpu-thumb.is-uploading .wpu-thumb-bar-fill {
  background: linear-gradient(90deg,
    var(--wpu-rose) 0%, var(--wpu-gold) 50%, var(--wpu-rose) 100%) !important;
  background-size: 200% 100% !important;
  animation: wpu-bar-shimmer .9s linear infinite !important;
}

/* Thumb count line — clearer */
.wpu-thumb-count {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--wpu-rose) !important;
}

/* v1.4.0 gallery improvements */
.wpu-gallery-found{
  margin:10px auto 16px;
  max-width:720px;
  padding:12px 14px;
  border-radius:14px;
  background:#f3fff2;
  border:1px solid #bde7bd;
  color:#375d37;
  text-align:center;
  font-weight:700;
}
.wpu-gallery-loading small{display:block;margin-top:8px;font-size:13px;opacity:.72;font-weight:400;}
.wpu-thumb.is-done .wpu-thumb-label{font-weight:700;}

/* ================================================================
   v1.5.0 — Professional gallery redesign + readable text
   ================================================================ */

/* ── GALLERY OVERLAY ── */
.wpu-gallery-overlay {
  position: fixed !important; inset: 0 !important; z-index: 999999 !important;
  background: rgba(20,14,10,.92) !important;
  backdrop-filter: blur(8px) !important;
  display: none; overflow-y: auto; padding: 24px 16px 48px;
}
.wpu-gallery-overlay.open { display: block !important; }

.wpu-gallery-box {
  background: #FAF7F4 !important;
  border-radius: 20px !important;
  max-width: 680px !important;
  margin: 0 auto !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.45) !important;
  overflow: hidden !important;
}

/* ── GALLERY HEADER ── */
.wpu-gallery-header {
  background: linear-gradient(135deg, #2C1F18 0%, #5C3D2E 100%) !important;
  padding: 20px 24px !important;
  display: flex !important; align-items: center !important;
  justify-content: space-between !important;
}
.wpu-gallery-title {
  font-size: 20px !important; font-weight: 600 !important;
  color: #FAF7F4 !important; letter-spacing: .01em !important;
}
.wpu-gallery-close {
  width: 38px !important; height: 38px !important;
  background: rgba(255,255,255,.15) !important;
  border: 1.5px solid rgba(255,255,255,.3) !important;
  border-radius: 50% !important; color: #fff !important;
  font-size: 22px !important; cursor: pointer !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  line-height: 1 !important; transition: background .2s !important;
  font-family: -apple-system, sans-serif !important;
}
.wpu-gallery-close:hover { background: rgba(255,255,255,.3) !important; }

/* ── GALLERY NOTICE ── */
.wpu-gallery-notice {
  background: #fff8f0 !important;
  border-bottom: 1px solid rgba(196,168,130,.25) !important;
  padding: 10px 24px !important;
  font-size: 13px !important; color: #7a5a40 !important;
  font-weight: 500 !important;
}

/* ── COUNT BADGE ── */
.wpu-gallery-found {
  background: #f0faf2 !important;
  border-bottom: 1px solid rgba(76,175,80,.2) !important;
  padding: 12px 24px !important;
  font-size: 14px !important; font-weight: 600 !important;
  color: #2d6b40 !important;
}

/* ── LOADING STATE ── */
.wpu-gallery-loading {
  padding: 40px 24px !important;
  text-align: center !important;
  font-size: 15px !important; font-weight: 500 !important;
  color: var(--wpu-rose) !important; line-height: 1.7 !important;
}
.wpu-gallery-loading small {
  display: block !important; margin-top: 8px !important;
  font-size: 13px !important; color: var(--wpu-muted) !important;
  font-weight: 400 !important;
}
/* Loading spinner */
.wpu-gallery-loading::before {
  content: '' !important;
  display: block !important;
  width: 36px !important; height: 36px !important;
  border: 3px solid rgba(139,111,94,.2) !important;
  border-top-color: var(--wpu-rose) !important;
  border-radius: 50% !important;
  margin: 0 auto 16px !important;
  animation: wpu-spin .8s linear infinite !important;
}
@keyframes wpu-spin { to { transform: rotate(360deg); } }

/* Individual photo appearing animation */
.wpu-gallery-item {
  opacity: 0;
  transform: scale(.92);
  animation: wpu-pop .3s ease forwards !important;
}
@keyframes wpu-pop {
  to { opacity: 1; transform: scale(1); }
}

/* ── GALLERY GRID ── */
.wpu-gallery-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(150px,1fr)) !important;
  gap: 8px !important;
  padding: 16px !important;
}
.wpu-gallery-item {
  border-radius: 12px !important; overflow: hidden !important;
  aspect-ratio: 1 !important; position: relative !important;
  background: rgba(196,168,130,.15) !important;
  cursor: pointer !important; box-shadow: 0 2px 8px rgba(0,0,0,.1) !important;
  transition: transform .2s, box-shadow .2s !important;
}
.wpu-gallery-item:hover { transform: scale(1.04) !important; box-shadow: 0 6px 20px rgba(0,0,0,.2) !important; }
.wpu-gallery-item img {
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; display: block !important;
}
.wpu-gallery-item-label {
  position: absolute !important; bottom: 0 !important; left: 0 !important; right: 0 !important;
  padding: 18px 8px 7px !important;
  background: linear-gradient(transparent, rgba(0,0,0,.55)) !important;
  font-size: 11px !important; color: rgba(255,255,255,.9) !important;
  text-align: center !important; font-weight: 500 !important;
}

/* ── GALLERY EMPTY ── */
.wpu-gallery-empty {
  padding: 48px 24px !important; text-align: center !important;
  font-size: 15px !important; color: var(--wpu-muted) !important;
  line-height: 1.75 !important;
}

/* ── LIGHTBOX ── */
.wpu-lightbox {
  position: fixed !important; inset: 0 !important; z-index: 1000001 !important;
  background: rgba(0,0,0,.95) !important;
  display: none; align-items: center; justify-content: center;
}
.wpu-lightbox.open { display: flex !important; }
.wpu-lightbox img {
  max-width: 94vw !important; max-height: 88vh !important;
  border-radius: 10px !important; object-fit: contain !important;
  box-shadow: 0 8px 40px rgba(0,0,0,.6) !important;
}
.wpu-lightbox-close {
  position: absolute !important; top: 16px !important; right: 18px !important;
  width: 44px !important; height: 44px !important;
  background: rgba(255,255,255,.15) !important;
  border: 1.5px solid rgba(255,255,255,.3) !important;
  border-radius: 50% !important; color: #fff !important;
  font-size: 24px !important; cursor: pointer !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  transition: background .2s !important;
}
.wpu-lightbox-close:hover { background: rgba(255,255,255,.28) !important; }
.wpu-lb-prev, .wpu-lb-next {
  position: absolute !important; top: 50% !important; transform: translateY(-50%) !important;
  background: rgba(255,255,255,.12) !important;
  border: 1.5px solid rgba(255,255,255,.2) !important;
  color: rgba(255,255,255,.85) !important; font-size: 28px !important;
  width: 52px !important; height: 52px !important; border-radius: 50% !important;
  cursor: pointer !important; display: flex !important;
  align-items: center !important; justify-content: center !important;
  transition: background .2s !important;
}
.wpu-lb-prev { left: 14px !important; }
.wpu-lb-next { right: 14px !important; }
.wpu-lb-prev:hover, .wpu-lb-next:hover { background: rgba(255,255,255,.25) !important; }
.wpu-lb-info {
  position: absolute !important; bottom: 18px !important; left: 50% !important;
  transform: translateX(-50%) !important;
  font-size: 13px !important; color: rgba(255,255,255,.65) !important;
  background: rgba(0,0,0,.4) !important;
  padding: 5px 14px !important; border-radius: 99px !important;
  white-space: nowrap !important;
}

/* ── UPLOAD FORM — PHOTO ONLY hint ── */
.wpu-dz-sub { font-size: 12px !important; color: var(--wpu-muted) !important; line-height: 1.6 !important; pointer-events: none !important; }

/* ── DUPLICATE badge on thumb ── */
.wpu-thumb.is-duplicate .wpu-thumb-bar-fill { background: #C4A882 !important; width: 100% !important; }
.wpu-thumb.is-duplicate .wpu-thumb-label { color: #8B6F5E !important; font-weight: 500 !important; }
.wpu-thumb.is-duplicate .wpu-thumb-status { font-size: 18px !important; }

/* ================================================================
   v1.5.2 — 3-col gallery grid, success card z-index, view button
   ================================================================ */

/* ── SUCCESS CARD — must be above any overlay ── */
.wpu-success {
  position: relative !important;
  z-index: 99 !important;
}

/* ── "View my photos" button — big, tappable, clearly clickable ── */
.wpu-my-photos-link {
  display: block !important;
  width: 100% !important;
  max-width: 480px !important;
  margin: 14px auto 0 !important;
  padding: 15px 20px !important;
  background: var(--wpu-rose) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 14px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  font-family: inherit !important;
  text-align: center !important;
  cursor: pointer !important;
  text-decoration: none !important;
  letter-spacing: .02em !important;
  box-shadow: 0 4px 16px rgba(139,111,94,.3) !important;
  transition: background .2s, transform .15s !important;
  position: relative !important;
  z-index: 100 !important;
  pointer-events: auto !important;
  -webkit-appearance: none !important;
}
.wpu-my-photos-link:hover {
  background: #7a5f50 !important;
  transform: translateY(-1px) !important;
  color: #fff !important;
  text-decoration: none !important;
}
.wpu-my-photos-link:active {
  transform: translateY(0) !important;
}

/* Override any inherited underline styles from theme */
.wpu-form-wrap .wpu-my-photos-link,
.wpu-success .wpu-my-photos-link {
  text-decoration: none !important;
  color: #fff !important;
}

/* ── GALLERY GRID — always 3 columns, no exceptions ── */
.wpu-gallery-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 6px !important;
  padding: 12px !important;
}
/* Override any media queries that might change column count */
@media (max-width: 9999px) {
  .wpu-gallery-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

.wpu-gallery-item {
  border-radius: 8px !important;
  aspect-ratio: 1 !important;
  overflow: hidden !important;
  position: relative !important;
  background: rgba(196,168,130,.15) !important;
  cursor: pointer !important;
}
.wpu-gallery-item img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* ── GALLERY LOADING — show count instantly with spinner ── */
.wpu-gallery-loading-bar {
  height: 3px;
  background: rgba(196,168,130,.2);
  border-radius: 99px;
  overflow: hidden;
  margin: 0 24px 16px;
}
.wpu-gallery-loading-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--wpu-rose), var(--wpu-gold));
  border-radius: 99px;
  transition: width .3s ease;
}

/* ================================================================
   v1.5.3 — Smaller hero, phone confirm, placeholder pulse
   ================================================================ */

/* ── Smaller, tighter hero ── */
.wpu-hero {
  padding: 32px 24px 28px !important;
}
.wpu-couple {
  font-size: clamp(34px, 8vw, 60px) !important;
}
.wpu-hero-msg {
  font-size: 14px !important;
  max-width: 300px !important;
}
.wpu-rule { margin: 14px auto !important; }
.wpu-heart { font-size: 18px !important; margin-bottom: 10px !important; }

/* ── Phone confirm box ── */
.wpu-phone-confirm {
  font-size: 13px !important;
  line-height: 1.5 !important;
}

/* ── Phone field confirmed state ── */
.wpu-phone[readonly] {
  background: #f0faf2 !important;
  border-color: #4caf50 !important;
  color: var(--wpu-text) !important;
}

/* ── Gallery placeholder shimmer ── */
@keyframes wpu-ph-pulse {
  0%, 100% { opacity: .6; }
  50%       { opacity: 1; }
}
.wpu-gallery-ph {
  animation: wpu-ph-pulse 1.4s ease-in-out infinite;
}

/* ── Gallery grid — always 3 cols, square items ── */
.wpu-gallery-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 6px !important;
  padding: 10px 12px 0 !important;
}
.wpu-gallery-item {
  aspect-ratio: 1 !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  position: relative !important;
  min-height: 80px !important;
  background: rgba(196,168,130,.12) !important;
}

/* ── Gallery privacy note ── */
.wpu-gallery-notice {
  font-size: 12px !important;
  padding: 8px 16px !important;
  color: var(--wpu-muted) !important;
}

/* ── Gallery footer counter ── */
#wpu-gallery-footer {
  font-size: 12px !important;
  color: var(--wpu-muted) !important;
  text-align: center !important;
  padding: 10px 16px 16px !important;
  border-top: 1px solid rgba(196,168,130,.15) !important;
  margin-top: 4px !important;
}

/* ================================================================
   v1.5.4 — Wedding-site style hero + language-first flow
   ================================================================ */
.wpu-widget.wpu-language-pending > *:not(.wpu-language-gate) { display: none !important; }
.wpu-language-gate {
  max-width: 520px; margin: 0 auto 18px; padding: 42px 24px;
  text-align: center; border-radius: 24px;
  background: radial-gradient(circle at top, rgba(196,168,130,.22), transparent 45%), linear-gradient(160deg,#24160f,#5c3d2e 55%,#2c1f18);
  color: #faf7f4; box-shadow: 0 18px 50px rgba(44,31,24,.18); position: relative; overflow: hidden;
}
.wpu-language-gate:before { content:'G & E'; position:absolute; inset:auto 0 16px; font-family: Georgia,serif; font-size: 72px; opacity:.045; letter-spacing:.08em; }
.wpu-lang-kicker { color: var(--wpu-gold); letter-spacing:.18em; text-transform:uppercase; font-size:11px; margin:0 0 16px; }
.wpu-language-gate h2 { font-family: Georgia, 'Times New Roman', serif; font-weight:400; line-height:1.1; font-size:clamp(34px,8vw,54px); margin:0 0 24px; }
.wpu-language-gate h2 span { font-size:.58em; opacity:.78; }
.wpu-lang-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; position:relative; z-index:1; }
.wpu-lang-btn { min-width:135px; border:1px solid rgba(250,247,244,.45); background:rgba(250,247,244,.94); color:#3d2e26; border-radius:999px; padding:14px 22px; font-size:16px; font-weight:700; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,.18); }
.wpu-lang-switch { max-width:520px; margin:0 auto 10px; justify-content:flex-end; align-items:center; gap:7px; font-size:12px; color:var(--wpu-muted); }
.wpu-lang-switch button { border:0; background:transparent; color:var(--wpu-rose); font-weight:700; cursor:pointer; padding:4px; }
.wpu-hero {
  max-width: 720px; margin: 0 auto 0; border-radius: 26px 26px 0 0;
  background: radial-gradient(ellipse at top, rgba(196,168,130,.22), transparent 48%), linear-gradient(160deg,#21140d 0%,#5b3b2b 54%,#2c1f18 100%);
  box-shadow: 0 18px 55px rgba(44,31,24,.18);
}
.wpu-hero:before { content:'G & E'; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-family:Georgia,serif; font-size:clamp(90px,22vw,180px); letter-spacing:.06em; color:#fff; opacity:.035; white-space:nowrap; pointer-events:none; }
.wpu-eyebrow { font-size: 11px; letter-spacing:.22em; color:#d8c09b; }
.wpu-couple { font-family: Georgia, 'Times New Roman', serif; font-size:clamp(48px,11vw,86px); text-shadow:0 4px 24px rgba(0,0,0,.18); }
.wpu-date { color:#f8efe5; font-size:18px; letter-spacing:.16em; margin:4px 0 5px; position:relative; }
.wpu-place { color:rgba(250,247,244,.72); font-size:14px; margin:0 0 16px; position:relative; }
.wpu-heart { width:42px; height:42px; display:flex; align-items:center; justify-content:center; margin:0 auto 12px; background:rgba(250,247,244,.12); border:1px solid rgba(250,247,244,.28); border-radius:50%; }
.wpu-hero-msg { max-width:410px; color:rgba(250,247,244,.78); font-size:16px; }
.wpu-phone-confirm { font-size:13px; line-height:1.45; color:#2d6840; }
.wpu-phone-confirm .wpu-phone-change { margin-left:6px; font-size:12px; color:var(--wpu-rose); background:transparent; border:0; text-decoration:underline; cursor:pointer; padding:0; }
.wpu-gallery-item.is-error { display:flex; align-items:center; justify-content:center; padding:8px; text-align:center; font-size:11px; color:var(--wpu-muted); background:#f7f1ec; }
@media (max-width:520px){ .wpu-hero{ border-radius:0; } .wpu-language-gate{ border-radius:0; margin-left:-1px; margin-right:-1px; } }

/* ================================================================
   v1.5.7 — Phone-first responsive refinements
   ================================================================ */
.wpu-widget {
  background: #faf7f1;
  padding: 0 0 28px;
}

.wpu-hero,
.wpu-photos,
.wpu-steps,
.wpu-form-wrap {
  box-sizing: border-box;
}

/* Keep the engagement photos elegant on tablets/computers instead of full-browser wide. */
.wpu-photos {
  max-width: 720px !important;
  margin: 0 auto 0 !important;
  border-radius: 0 0 22px 22px !important;
  overflow: hidden !important;
  box-shadow: 0 18px 55px rgba(44,31,24,.12) !important;
}
.wpu-photos img {
  aspect-ratio: 4 / 5 !important;
}

/* Make the actual upload area the main focus, especially on phones. */
.wpu-form-wrap {
  max-width: 560px !important;
  margin: 0 auto !important;
  padding: 10px 18px 44px !important;
}
.wpu-card,
.wpu-btn,
.wpu-cancel-btn,
.wpu-prog,
.wpu-err,
.wpu-success,
.wpu-tips,
.wpu-my-photos-link {
  max-width: 520px !important;
}

.wpu-card {
  box-shadow: 0 8px 28px rgba(44,31,24,.045) !important;
}

.wpu-field input[type=text],
.wpu-field input[type=tel],
.wpu-field input[type=email],
.wpu-field select {
  min-height: 50px !important;
}

.wpu-phone {
  font-size: 18px !important;
  font-weight: 650 !important;
  letter-spacing: .01em !important;
}
.wpu-field:has(.wpu-phone) label::after {
  content: '  · importante';
  color: var(--wpu-rose);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.wpu-field:has(.wpu-phone) .wpu-field-hint {
  background: #fff8f0 !important;
  border: 1px solid rgba(196,168,130,.32) !important;
  border-radius: 10px !important;
  padding: 9px 11px !important;
  color: #6d574b !important;
  font-size: 12px !important;
}
.wpu-phone-confirm {
  padding: 10px 12px !important;
  border-radius: 11px !important;
  font-weight: 650 !important;
}

.wpu-dropzone {
  min-height: 178px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}
.wpu-dz-title { font-size: 17px !important; font-weight: 700 !important; }
.wpu-btn,
.wpu-my-photos-link {
  min-height: 52px !important;
}

/* Tablet/computer: centered wedding-card composition. */
@media (min-width: 768px) {
  .wpu-widget { padding-top: 28px; }
  .wpu-language-gate { margin-top: 18px !important; }
  .wpu-hero { max-width: 740px !important; border-radius: 28px 28px 0 0 !important; }
  .wpu-photos { max-width: 740px !important; grid-template-columns: repeat(var(--wpu-cols, 4), 1fr) !important; }
  .wpu-steps { max-width: 560px !important; padding-top: 30px !important; }
}

/* Phone: this page is mainly for guests uploading from their phones. */
@media (max-width: 767px) {
  .wpu-widget { padding-bottom: 18px !important; }
  .wpu-lang-switch {
    position: sticky !important;
    top: 0 !important;
    z-index: 20 !important;
    background: rgba(250,247,244,.94) !important;
    backdrop-filter: blur(8px) !important;
    padding: 6px 14px !important;
    margin-bottom: 0 !important;
  }
  .wpu-hero {
    margin: 0 -1px !important;
    padding: 26px 18px 24px !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  .wpu-couple { font-size: clamp(40px, 13vw, 58px) !important; }
  .wpu-date { font-size: 15px !important; }
  .wpu-hero-msg { font-size: 14px !important; line-height: 1.55 !important; }
  .wpu-photos {
    max-width: none !important;
    margin: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .wpu-photos img { aspect-ratio: 1 / 1 !important; }
  .wpu-steps {
    padding: 18px 12px 12px !important;
  }
  .wpu-step-l { font-size: 10px !important; }
  .wpu-form-wrap {
    padding: 8px 12px 32px !important;
  }
  .wpu-card {
    border-radius: 16px !important;
    padding: 20px 16px !important;
    margin-bottom: 10px !important;
  }
  .wpu-card-title { font-size: 19px !important; margin-bottom: 14px !important; }
  .wpu-field label { font-size: 10.5px !important; }
  .wpu-thumbs { grid-template-columns: repeat(3, 1fr) !important; gap: 7px !important; }
  .wpu-tips { padding: 14px 15px !important; }
  .wpu-tip-item { font-size: 12px !important; }
}

/* Small phones */
@media (max-width: 380px) {
  .wpu-form-wrap { padding-left: 9px !important; padding-right: 9px !important; }
  .wpu-card { padding-left: 13px !important; padding-right: 13px !important; }
  .wpu-photos img { aspect-ratio: 4 / 5 !important; }
}

/* v1.5.7 — phone-first gallery overlay + retry button */
.wpu-gallery-overlay.open { z-index: 999999 !important; }
.wpu-gallery-box { width: min(94vw, 760px) !important; max-height: 88vh !important; }
.wpu-gallery-retry {
  margin-top:10px; padding:12px 18px; border:0; border-radius:12px; cursor:pointer;
  background:var(--wpu-rose); color:#fff; font-weight:700; font-family:inherit;
}
@media (max-width: 767px) {
  .wpu-form-wrap { max-width: 100% !important; padding: 0 14px 28px !important; }
  .wpu-card { border-radius: 18px !important; }
  .wpu-phone { font-size: 20px !important; font-weight: 800 !important; }
  .wpu-btn, .wpu-my-photos-link { min-height: 52px !important; font-size: 16px !important; }
  .wpu-gallery-box { width: 100vw !important; max-height: 100vh !important; border-radius: 0 !important; }
  .wpu-gallery-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 4px !important; padding: 8px !important; }
  .wpu-gallery-item { border-radius: 8px !important; }
}
@media (min-width: 768px) and (max-width: 1100px) {
  .wpu-form-wrap { max-width: 620px !important; }
  .wpu-gallery-grid { grid-template-columns: repeat(4, 1fr) !important; }
}
@media (min-width: 1101px) {
  .wpu-form-wrap { max-width: 620px !important; }
  .wpu-gallery-grid { grid-template-columns: repeat(5, 1fr) !important; }
}

/* v1.5.8 gallery progressive loading */
.wpu-gallery-more{
  display:block;margin:14px auto 10px;padding:11px 18px;border:0;border-radius:12px;
  background:var(--wpu-brown,#8b6b5a);color:#fff;font-weight:800;cursor:pointer;
  box-shadow:0 8px 20px rgba(0,0,0,.12);
}
.wpu-gallery-more:active{transform:translateY(1px)}
.wpu-gallery-loading-bar{height:6px;border-radius:999px;background:rgba(139,107,90,.14);overflow:hidden;margin:14px 24px 18px}
.wpu-gallery-loading-bar-fill{height:100%;background:rgba(139,107,90,.65);transition:width .25s ease}
@keyframes wpu-ph-pulse{0%,100%{opacity:.65}50%{opacity:1}}


/* v1.5.9 true lazy gallery paging */
.wpu-gallery-more{
  display:block;margin:14px auto 6px;padding:12px 22px;border-radius:12px;border:0;
  background:var(--wpu-brown,#8b6f5e);color:#fff;font-weight:800;cursor:pointer;
  box-shadow:0 8px 18px rgba(44,31,24,.14);
}
.wpu-gallery-more:disabled{opacity:.62;cursor:wait;}
.wpu-gallery-ph{overflow:hidden;}
.wpu-gallery-ph:after{content:'Loading…';position:absolute;left:0;right:0;bottom:10px;text-align:center;font-size:11px;color:rgba(44,31,24,.55);font-weight:700;}


/* v1.6.0 — better gallery system: scrollable modal, sticky top loader, real lazy thumbnails */
.wpu-gallery-overlay.open{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
  padding:18px 10px 34px !important;
}
.wpu-gallery-box{
  width:min(96vw, 760px) !important;
  max-height:calc(100vh - 36px) !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
.wpu-gallery-header{
  position:sticky !important;
  top:0 !important;
  z-index:5 !important;
}
.wpu-gallery-notice,.wpu-gallery-found{
  text-align:center !important;
}
.wpu-gallery-more-top{
  position:sticky !important;
  top:80px !important;
  z-index:4 !important;
  margin:10px auto 4px !important;
  width:calc(100% - 32px) !important;
  max-width:360px !important;
}
.wpu-gallery-grid{
  grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  gap:8px !important;
  padding:12px !important;
}
.wpu-gallery-item{
  min-height:135px !important;
  background:#f4eee8 !important;
}
.wpu-gallery-ph:after{content:'Loading photo…' !important;}
@media (min-width:640px){ .wpu-gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;} }
@media (min-width:900px){ .wpu-gallery-grid{grid-template-columns:repeat(4,minmax(0,1fr)) !important;} }
@media (max-width:767px){
  .wpu-gallery-overlay.open{padding:0 !important;}
  .wpu-gallery-box{width:100vw !important;max-height:100vh !important;border-radius:0 !important;}
  .wpu-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:7px !important;padding:10px !important;}
  .wpu-gallery-item{min-height:160px !important;}
  .wpu-gallery-more-top{top:72px !important;}
}


/* v1.6.1 — clearer gallery thumbnail loading states */
.wpu-gallery-ph{display:flex !important;align-items:center !important;justify-content:center !important;text-align:center !important;color:#7f675a !important;font-size:12px !important;font-weight:700 !important;padding:10px !important;}
.wpu-gallery-ph:after{content:attr(data-status) !important;}
.wpu-gallery-item.is-error{display:flex !important;align-items:center !important;justify-content:center !important;text-align:center !important;color:#6d5548 !important;background:#fbf6ef !important;border:1px dashed rgba(151,111,90,.35) !important;}
.wpu-gallery-item.is-error small{display:block;margin-top:4px;color:#9a8175;font-size:11px;}

/* v1.8.6 upload-focus UX: keep the current upload visible for older guests */
.wpu-upload-focus-box{display:none;margin:12px 0 14px;padding:12px 14px;border:1px solid #cdb7a4;background:#fff8ef;border-radius:14px;box-shadow:0 8px 24px rgba(70,43,31,.08);font-weight:700;color:#6b4b3d;text-align:center}.wpu-upload-focus-title{font-size:16px;line-height:1.25}.wpu-upload-focus-sub{font-size:12px;font-weight:600;opacity:.82;margin-top:4px}.wpu-upload-focus-meter{height:10px;background:#eadfd6;border-radius:999px;overflow:hidden;margin-top:9px}.wpu-upload-focus-meter span{display:block;height:100%;width:0;background:#8f6f5f;border-radius:999px;transition:width .25s ease}.wpu-thumb.wpu-current-upload{outline:4px solid rgba(143,111,95,.35);box-shadow:0 0 0 6px rgba(143,111,95,.12),0 12px 28px rgba(70,43,31,.22);transform:scale(1.03);z-index:3}.wpu-thumb.is-uploading .wpu-thumb-status{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;border-radius:999px}
@media(max-width:640px){.wpu-upload-focus-box{position:sticky;top:8px;z-index:20;margin-left:-2px;margin-right:-2px}.wpu-upload-focus-title{font-size:15px}.wpu-thumb.wpu-current-upload{transform:scale(1.02)}}


/* v1.8.8 — visible upload progress even if the phone/browser refuses to scroll */
.wpu-upload-focus-box{
  position:sticky !important;
  top:12px !important;
  z-index:9999 !important;
  scroll-margin-top:90px !important;
}
body.wpu-uploading-now .wpu-upload-focus-box{
  display:block !important;
  position:fixed !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  top:12px !important;
  width:min(520px, calc(100vw - 24px)) !important;
  margin:0 !important;
  border:2px solid #8f6f5f !important;
}
body.wpu-uploading-now .wpu-card:has(.wpu-upload-focus-box){
  scroll-margin-top:110px !important;
}
.wpu-thumb.wpu-current-upload{scroll-margin-top:130px !important;}
@media(max-width:640px){
  body.wpu-uploading-now .wpu-upload-focus-box{top:8px !important;width:calc(100vw - 18px) !important;}
}

/* v1.8.9 — make upload button easy to find when many photos are selected */
.wpu-btn-top{
  margin:14px 0 8px !important;
  width:100% !important;
  display:block !important;
  position:sticky !important;
  top:8px !important;
  z-index:30 !important;
  box-shadow:0 10px 22px rgba(70,43,31,.16) !important;
}
.wpu-upload-top-hint{
  display:none;
  text-align:center;
  font-size:12px;
  color:#7c6255;
  margin:0 0 10px;
  font-weight:700;
}
.wpu-thumbs:not(:empty) ~ .wpu-thumb-count + .wpu-upload-top-hint,
.wpu-btn-top:not(:disabled) + .wpu-upload-top-hint{display:block;}
.wpu-btn-bottom{margin-top:16px !important;}
@media(max-width:640px){
  .wpu-btn-top{top:6px !important; min-height:54px !important; font-size:17px !important;}
  .wpu-upload-top-hint{font-size:11px;}
}

/* v1.9.1 — keep the page simple: show upload area only after guest info is complete */
.wpu-after-info.wpu-hidden-before-info,
.wpu-btn-bottom.wpu-hidden-before-info,
.wpu-my-photos-link.wpu-hidden-before-info,
.wpu-cancel-btn.wpu-hidden-before-info,
.wpu-tip-banner.wpu-hidden-before-info,
.wpu-prog.wpu-hidden-before-info,
.wpu-err.wpu-hidden-before-info,
.wpu-success.wpu-hidden-before-info,
.wpu-tips.wpu-hidden-before-info{
  display:none !important;
}
.wpu-info-next-note{
  margin-top:12px;
  padding:10px 12px;
  border:1px solid #ead8c7;
  border-radius:12px;
  background:#fff9f2;
  color:#7a5c49;
  font-size:13px;
  font-weight:700;
  text-align:center;
}
.wpu-info-complete-note{
  margin:0 auto 12px;
  max-width:520px;
  padding:10px 12px;
  border:1px solid #a9deb7;
  border-radius:12px;
  background:#f0fbf3;
  color:#2e7d3d;
  font-size:13px;
  font-weight:800;
  text-align:center;
}


/* v1.9.2 — My Photos uses a clear 4-across thumbnail grid, then tap opens full photo */
.wpu-gallery-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:10px !important;
  padding:14px !important;
}
.wpu-gallery-item{
  min-height:0 !important;
  aspect-ratio:1/1 !important;
  border-radius:12px !important;
  overflow:hidden !important;
  cursor:pointer !important;
}
.wpu-gallery-item img{width:100% !important;height:100% !important;object-fit:cover !important;}
.wpu-gallery-item-label{font-size:10px !important;line-height:1.1 !important;padding:4px 3px !important;}
.wpu-gallery-ph{font-size:10px !important;}
@media (max-width:767px){
  .wpu-gallery-grid{grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:6px !important;padding:10px !important;}
  .wpu-gallery-item{aspect-ratio:1/1 !important;min-height:0 !important;border-radius:9px !important;}
  .wpu-gallery-item-label{font-size:9px !important;}
}
.wpu-lb-info a{color:#fff !important;text-decoration:underline !important;font-weight:700 !important;}


/* v1.9.4 — clearer gallery preview message and same-page lightbox behavior */
.wpu-gallery-preview-note{
  margin:10px 0 14px;
  padding:10px 12px;
  border:1px solid rgba(196,168,130,.45);
  background:#fffaf3;
  color:#6b4b3d;
  border-radius:12px;
  font-size:13px;
  font-weight:600;
  text-align:center;
  line-height:1.35;
}
.wpu-gallery-item.has-open-fallback span{font-size:13px;line-height:1.25;color:#6b4b3d;font-weight:700;text-align:center;display:flex;align-items:center;justify-content:center;height:100%;}

/* v1.9.8 — force local thumbnail rendering controls */
.wpu-gallery-render-thumbs{
  display:block;margin:12px auto 14px;padding:11px 18px;border:0;border-radius:14px;
  background:#6f4b3d;color:#fff;font-weight:800;box-shadow:0 8px 18px rgba(70,43,31,.16);cursor:pointer
}
.wpu-gallery-render-thumbs:disabled{opacity:.65;cursor:wait}

.wpu-thumb.is-duplicate img{opacity:.45}.wpu-thumb.is-duplicate .wpu-thumb-status{font-weight:700}.wpu-thumb.is-duplicate{max-height:180px;overflow:hidden}

/* v2.1.7 — language gate click fix */
.wpu-language-gate:before { pointer-events: none !important; z-index: 0 !important; }
.wpu-language-gate .wpu-lang-kicker,
.wpu-language-gate h2,
.wpu-language-gate .wpu-lang-actions,
.wpu-language-gate .wpu-lang-btn { position: relative !important; z-index: 5 !important; }
.wpu-language-gate .wpu-lang-btn { pointer-events: auto !important; touch-action: manipulation !important; -webkit-tap-highlight-color: rgba(255,255,255,.25) !important; }


/* v2.1.8 — language gate hard click layer fix */
.wpu-widget.wpu-language-pending { position: relative !important; z-index: 2147483000 !important; isolation: isolate !important; pointer-events: auto !important; }
.wpu-widget.wpu-language-pending .wpu-language-gate { position: relative !important; z-index: 2147483001 !important; pointer-events: auto !important; transform: translateZ(0); }
.wpu-widget.wpu-language-pending .wpu-lang-actions { position: relative !important; z-index: 2147483002 !important; pointer-events: auto !important; }
.wpu-widget.wpu-language-pending .wpu-lang-btn { position: relative !important; z-index: 2147483003 !important; pointer-events: auto !important; touch-action: manipulation !important; user-select: none !important; }
.wpu-widget.wpu-language-pending .wpu-language-gate::before,
.wpu-widget.wpu-language-pending .wpu-language-gate::after { pointer-events: none !important; }


/* v2.1.9 — language switch hard click fix */
.wpu-lang-switch {
  position: relative !important;
  z-index: 2147483640 !important;
  pointer-events: auto !important;
  isolation: isolate !important;
}
.wpu-lang-switch button,
.wpu-lang-switch .wpu-lang-switch-btn,
.wpu-lang-actions .wpu-lang-btn {
  position: relative !important;
  z-index: 2147483641 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}
.wpu-lang-switch:before,
.wpu-lang-switch:after { content: none !important; display: none !important; pointer-events: none !important; }

/* v2.2.2: make language gate the first clickable layer */
.wpu-language-pending .wpu-language-gate{
  position:relative!important;
  z-index:999999!important;
  pointer-events:auto!important;
}
.wpu-language-pending .wpu-language-gate *{
  pointer-events:auto!important;
}
.wpu-language-pending .wpu-lang-btn{
  position:relative!important;
  z-index:1000000!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
}


/* v2.2.3 — mobile lightbox navigation fix */
#wpu-lightbox { touch-action: pan-y !important; }
#wpu-lightbox #wpu-lb-img {
  position: relative !important;
  z-index: 1 !important;
  pointer-events: none !important;
}
#wpu-lightbox .wpu-lb-prev,
#wpu-lightbox .wpu-lb-next,
#wpu-lightbox .wpu-lightbox-close,
#wpu-lightbox .wpu-lb-info {
  z-index: 5 !important;
  pointer-events: auto !important;
}
#wpu-lightbox .wpu-lb-prev,
#wpu-lightbox .wpu-lb-next {
  width: 64px !important;
  height: 64px !important;
  font-size: 42px !important;
  background: rgba(255,255,255,.20) !important;
  border: 2px solid rgba(255,255,255,.35) !important;
  color: #fff !important;
  -webkit-tap-highlight-color: transparent !important;
}
#wpu-lightbox .wpu-lb-prev:active,
#wpu-lightbox .wpu-lb-next:active {
  background: rgba(255,255,255,.34) !important;
}
@media (max-width: 700px) {
  #wpu-lightbox .wpu-lb-prev { left: 10px !important; }
  #wpu-lightbox .wpu-lb-next { right: 10px !important; }
  #wpu-lightbox .wpu-lightbox-close { z-index: 6 !important; }
}