/* ============================================================
   UNO DETAILING — PUBLIC GIFT CARD PAGE
   Scope: public/gift-cards.php (embedded at unodetailing.com/gift-cards)
   Everything scoped under #unoGiftCardWrap to avoid clashing with the
   WordPress theme. Soft 1px borders, light weights. Min font 14px.
   Brand: orange #d26e4b, green #7a9c59, blue #446084.
   ============================================================ */

#unoGiftCardWrap{
  --uno-orange:#d26e4b;
  --uno-orange-dk:#bd5d3c;
  --uno-orange-soft:#fbf1ec;
  --uno-green:#7a9c59;
  --uno-blue:#446084;
  --uno-dark:#3a3f45;
  --uno-text:#555555;
  --uno-muted:#8a9099;
  --uno-bg:#f6f7f9;
  --uno-card:#ffffff;
  --uno-border:#e7eaee;
  --uno-radius:14px;

  font-family:'Mulish',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  color:var(--uno-text);
  font-size:16px;
  line-height:1.5;
  box-sizing:border-box;
  overflow:visible;
}
#unoGiftCardWrap .gcp,
#unoGiftCardWrap .gcp-grid,
#unoGiftCardWrap .gcp-left,
#unoGiftCardWrap .gcp-right{ overflow:visible; }
#unoGiftCardWrap *,
#unoGiftCardWrap *::before,
#unoGiftCardWrap *::after{ box-sizing:border-box; }

#unoGiftCardWrap .gcp{ max-width:1020px; margin:0 auto; }
#unoGiftCardWrap .gcp-grid{
  display:grid;
  grid-template-columns:1fr 340px;
  gap:24px;
  align-items:start;
}

/* ---- card ---- */
#unoGiftCardWrap .gcp-card{
  background:var(--uno-card);
  border:1px solid var(--uno-border);
  border-radius:var(--uno-radius);
  box-shadow:0 1px 3px rgba(40,50,65,.04);
  padding:24px 26px;
  margin-bottom:20px;
}
#unoGiftCardWrap .gcp-step-h{
  display:flex;align-items:center;gap:10px;
  font-size:17px;font-weight:600;color:var(--uno-dark);
  margin-bottom:18px;
}
#unoGiftCardWrap .gcp-step-num{
  width:25px;height:25px;border-radius:50%;
  background:var(--uno-orange);color:#fff;
  font-size:14px;font-weight:600;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}

/* ---- compact design preview ---- */
#unoGiftCardWrap .gcp-design-row{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
}
#unoGiftCardWrap .gcp-design{
  border:1px solid var(--uno-border);border-radius:11px;overflow:hidden;
  cursor:pointer;position:relative;background:var(--uno-bg);transition:.15s;
}
#unoGiftCardWrap .gcp-design img{
  width:100%;aspect-ratio:1.6/1;object-fit:cover;display:block;
}
#unoGiftCardWrap .gcp-design:hover{ border-color:#d8c0b4; }
#unoGiftCardWrap .gcp-design.sel{
  border-color:var(--uno-orange);box-shadow:0 0 0 3px var(--uno-orange-soft);
}
#unoGiftCardWrap .gcp-design-name{
  padding:7px 9px;font-size:14px;font-weight:500;color:var(--uno-text);
  text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#unoGiftCardWrap .gcp-viewmore{
  margin-top:12px;width:100%;padding:12px;
  border:1px solid var(--uno-orange);background:#fff;color:var(--uno-orange-dk);
  border-radius:10px;font-size:15px;font-weight:600;cursor:pointer;
  font-family:inherit;transition:.15s;
}
#unoGiftCardWrap .gcp-viewmore:hover{ background:var(--uno-orange-soft); }

/* ---- amount ---- */
#unoGiftCardWrap .gcp-amounts{ display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px; }
#unoGiftCardWrap .gcp-amt{
  flex:1;min-width:80px;padding:14px 8px;
  border:1px solid var(--uno-border);border-radius:10px;background:#fff;cursor:pointer;
  text-align:center;font-size:17px;font-weight:500;color:var(--uno-dark);transition:.15s;
}
#unoGiftCardWrap .gcp-amt:hover{ border-color:var(--uno-orange); }
#unoGiftCardWrap .gcp-amt.sel{
  border-color:var(--uno-orange);background:var(--uno-orange-soft);color:var(--uno-orange-dk);
  box-shadow:0 0 0 3px var(--uno-orange-soft);
}
#unoGiftCardWrap .gcp-custom-wrap{ position:relative;width:180px;margin-left:auto; }
#unoGiftCardWrap .gcp-dollar{
  position:absolute;left:14px;top:12px;
  font-size:16px;font-weight:600;color:var(--uno-muted);z-index:1;pointer-events:none;
  line-height:normal;
}
#unoGiftCardWrap .gcp-custom{
  width:100%;padding:12px 14px 12px 30px;
  border:1px solid var(--uno-border);border-radius:10px;
  font-size:16px;font-weight:500;color:var(--uno-dark);font-family:inherit;
  text-align:right;
  -moz-appearance:textfield;appearance:textfield;
}
#unoGiftCardWrap .gcp-custom::-webkit-outer-spin-button,
#unoGiftCardWrap .gcp-custom::-webkit-inner-spin-button{
  -webkit-appearance:none;margin:0;
}
#unoGiftCardWrap .gcp-custom:focus{ outline:none;border-color:var(--uno-orange); }
#unoGiftCardWrap .gcp-amt-hint{ font-size:14px;color:var(--uno-muted);margin-top:9px;text-align:right; }

/* ---- fields ---- */
#unoGiftCardWrap .gcp-row{ display:grid;grid-template-columns:1fr 1fr;gap:14px; }
#unoGiftCardWrap .gcp-field{ margin-bottom:16px; }
#unoGiftCardWrap .gcp-field:last-child{ margin-bottom:0; }
#unoGiftCardWrap .gcp-field label{
  display:block;font-size:14px;font-weight:600;color:var(--uno-dark);margin-bottom:6px;
}
#unoGiftCardWrap .gcp-opt{ font-weight:400;color:var(--uno-muted); }
#unoGiftCardWrap .gcp-field input,
#unoGiftCardWrap .gcp-field textarea{
  width:100%;padding:12px 14px;
  border:1px solid var(--uno-border);border-radius:10px;
  font-size:16px;color:var(--uno-text);background:#fff;font-family:inherit;
}
#unoGiftCardWrap .gcp-field input:focus,
#unoGiftCardWrap .gcp-field textarea:focus{ outline:none;border-color:var(--uno-orange); }
#unoGiftCardWrap .gcp-field textarea{ resize:vertical;min-height:74px; }
#unoGiftCardWrap .gcp-sub{ font-size:14px;color:var(--uno-muted);margin-bottom:16px;margin-top:-4px; }

/* ---- delivery toggle ---- */
#unoGiftCardWrap .gcp-deliv{ display:flex;gap:10px;margin-bottom:14px; }
#unoGiftCardWrap .gcp-deliv-opt{
  flex:1;padding:13px;border:1px solid var(--uno-border);border-radius:10px;text-align:center;
  cursor:pointer;font-weight:500;font-size:15px;color:var(--uno-dark);transition:.15s;
}
#unoGiftCardWrap .gcp-deliv-opt:hover{ border-color:var(--uno-orange); }
#unoGiftCardWrap .gcp-deliv-opt.sel{
  border-color:var(--uno-orange);background:var(--uno-orange-soft);color:var(--uno-orange-dk);
  box-shadow:0 0 0 3px var(--uno-orange-soft);
}

/* ---- schedule fields ---- */
#unoGiftCardWrap .gcp-sched{ display:none; }
#unoGiftCardWrap .gcp-sched.show{ display:block; }

/* calendar trigger */
#unoGiftCardWrap .gcp-cal-wrap{ position:relative; }
#unoGiftCardWrap .gcp-cal-trigger{
  width:100%;text-align:left;padding:10px 12px;
  border:1px solid var(--uno-border);border-radius:10px;background:#fff;
  color:var(--uno-dark);font-size:14px;cursor:pointer;font-family:inherit;
  display:flex;align-items:center;justify-content:space-between;
}
#unoGiftCardWrap .gcp-cal-trigger.gcp-placeholder{ color:var(--uno-muted); }
#unoGiftCardWrap .gcp-cal-trigger:hover{ border-color:var(--uno-orange); }
#unoGiftCardWrap .gcp-cal-ico{ color:var(--uno-orange); }

/* calendar popup */
#unoGiftCardWrap .gcp-cal-popup{
  display:none;position:absolute;z-index:50;top:calc(100% + 6px);left:0;
  width:300px;max-width:90vw;background:#fff;
  border:1px solid var(--uno-border);border-radius:12px;
  box-shadow:0 12px 32px rgba(40,50,65,.16);padding:14px;
}
#unoGiftCardWrap .gcp-cal-popup.open{ display:block; }
#unoGiftCardWrap .gcp-cal-head{
  display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;
}
#unoGiftCardWrap .gcp-cal-month{ font-size:15px;font-weight:600;color:var(--uno-dark); }
#unoGiftCardWrap .gcp-cal-nav{
  background:none;border:1px solid var(--uno-border);border-radius:7px;
  width:30px;height:30px;cursor:pointer;font-size:16px;color:var(--uno-text);
}
#unoGiftCardWrap .gcp-cal-nav:hover{ border-color:var(--uno-orange);color:var(--uno-orange); }
#unoGiftCardWrap .gcp-cal-grid{ display:grid;grid-template-columns:repeat(7,1fr);gap:2px; }
#unoGiftCardWrap .gcp-cal-dow{
  text-align:center;font-size:14px;font-weight:600;color:var(--uno-muted);padding:4px 0;
}
#unoGiftCardWrap .gcp-cal-empty{ height:34px; }
#unoGiftCardWrap .gcp-cal-day{
  height:34px;display:flex;align-items:center;justify-content:center;
  font-size:14px;border-radius:7px;cursor:pointer;color:var(--uno-dark);
}
#unoGiftCardWrap .gcp-cal-day:hover{ background:var(--uno-orange-soft); }
#unoGiftCardWrap .gcp-cal-day.gcp-cal-sel{ background:var(--uno-orange);color:#fff; }
#unoGiftCardWrap .gcp-cal-disabled{ color:#c7cdd4;cursor:default; }
#unoGiftCardWrap .gcp-cal-disabled:hover{ background:none; }

/* time dropdowns */
#unoGiftCardWrap .gcp-time{ display:flex;gap:6px;align-items:center; }
#unoGiftCardWrap .gcp-dd{ position:relative;flex:1;min-width:0; }
#unoGiftCardWrap .gcp-dd-trigger{
  width:100%;padding:10px 10px;
  border:1px solid var(--uno-border);border-radius:10px;background:#fff;
  color:var(--uno-dark);font-size:14px;cursor:pointer;font-family:inherit;
  display:flex;align-items:center;justify-content:space-between;gap:4px;
}
#unoGiftCardWrap .gcp-dd-trigger:hover{ border-color:var(--uno-orange); }
#unoGiftCardWrap .gcp-arrow{ font-size:22px;color:var(--uno-orange);flex-shrink:0; }
#unoGiftCardWrap .gcp-time-sep{ font-weight:600;color:var(--uno-muted);flex-shrink:0; }
#unoGiftCardWrap .gcp-dd-menu{
  display:none;position:absolute;z-index:50;top:calc(100% + 4px);left:0;right:0;
  background:#fff;border:1px solid var(--uno-border);border-radius:10px;
  box-shadow:0 10px 28px rgba(40,50,65,.14);max-height:200px;overflow-y:auto;padding:4px;
}
#unoGiftCardWrap .gcp-dd.open .gcp-dd-menu{ display:block; }
#unoGiftCardWrap .gcp-dd-item{
  padding:9px 12px;font-size:15px;border-radius:7px;cursor:pointer;color:var(--uno-text);
}
#unoGiftCardWrap .gcp-dd-item:hover{ background:var(--uno-orange-soft); }
#unoGiftCardWrap .gcp-dd-item.gcp-sel{ background:var(--uno-orange-soft);color:var(--uno-orange-dk);font-weight:600; }

/* ---- square card field ---- */
#unoGiftCardWrap .gcp-sqcard{
  border:1px solid var(--uno-border);border-radius:10px;padding:6px 10px;background:#fff;min-height:48px;
}
#unoGiftCardWrap .gcp-card-err{ font-size:14px;color:#d94452;margin-top:8px;min-height:18px; }

/* ---- summary ---- */
#unoGiftCardWrap .gcp-summary{
  background:var(--uno-card);border:1px solid var(--uno-border);border-radius:var(--uno-radius);
  box-shadow:0 1px 3px rgba(40,50,65,.04);padding:22px;
}
#unoGiftCardWrap .gcp-sum-card{
  border-radius:11px;overflow:hidden;margin-bottom:18px;border:1px solid var(--uno-border);
}
#unoGiftCardWrap .gcp-sum-card img{ width:100%;aspect-ratio:1.6/1;object-fit:cover;display:block; }
#unoGiftCardWrap .gcp-sum-h{ font-size:16px;font-weight:600;color:var(--uno-dark);margin-bottom:14px; }
#unoGiftCardWrap .gcp-sum-line{
  display:flex;justify-content:space-between;font-size:15px;padding:8px 0;
  border-bottom:1px solid #f0f2f4;color:var(--uno-text);
}
#unoGiftCardWrap .gcp-lbl{ color:var(--uno-muted); }
#unoGiftCardWrap .gcp-val{ font-weight:600;color:var(--uno-dark);text-align:right;max-width:60%; }
#unoGiftCardWrap .gcp-sum-msg{ padding:10px 0;border-bottom:1px solid #f0f2f4; }
#unoGiftCardWrap .gcp-sum-msg-label{ font-size:15px;color:var(--uno-muted);margin-bottom:4px; }
#unoGiftCardWrap .gcp-sum-msg-text{
  font-size:15px;color:var(--uno-dark);font-style:italic;line-height:1.45;
  word-wrap:break-word;overflow-wrap:break-word;
}
#unoGiftCardWrap .gcp-sum-total{
  display:flex;justify-content:space-between;align-items:baseline;margin:16px 0 18px;
}
#unoGiftCardWrap .gcp-sum-total .gcp-lbl{ font-size:16px;font-weight:600;color:var(--uno-dark); }
#unoGiftCardWrap .gcp-amt-total{ font-size:30px;font-weight:600;color:var(--uno-green); }

/* ---- pay button ---- */
#unoGiftCardWrap .gcp-pay{
  width:100%;padding:6px 16px;border:none;border-radius:10px;
  background:var(--uno-orange);color:#fff;cursor:pointer;
  font-size:16px;font-weight:600;font-family:inherit;transition:.15s;
}
#unoGiftCardWrap .gcp-pay:hover{ background:var(--uno-orange-dk); }
#unoGiftCardWrap .gcp-pay:disabled{ opacity:.65;cursor:default; }
#unoGiftCardWrap .gcp-secure{
  display:block;
  font-size:14px;color:var(--uno-muted);margin-top:12px;text-align:center;line-height:1.4;
}
#unoGiftCardWrap .gcp-secure-2{ display:block; }
#unoGiftCardWrap .gcp-terms{ font-size:14px;color:var(--uno-muted);margin-top:14px;line-height:1.5;text-align:center; }
#unoGiftCardWrap .gcp-terms-2{ display:block; }

/* ---- designs modal (cats left, images right) — no close on outside click ---- */
#unoGiftCardWrap .gcp-modal-backdrop{
  display:none;position:fixed;inset:0;background:rgba(40,50,65,.55);z-index:1000;
  align-items:center;justify-content:center;padding:24px;
}
#unoGiftCardWrap .gcp-modal-backdrop.open{ display:flex; }
#unoGiftCardWrap .gcp-modal{
  background:#fff;border-radius:16px;width:100%;max-width:1020px;max-height:60vh;
  display:flex;flex-direction:column;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.25);
}
#unoGiftCardWrap .gcp-modal-head{
  padding:18px 22px;border-bottom:1px solid var(--uno-border);
  display:flex;justify-content:space-between;align-items:center;flex-shrink:0;
}
#unoGiftCardWrap .gcp-modal-title{ font-size:18px;font-weight:600;color:var(--uno-dark); }
#unoGiftCardWrap .gcp-modal-close{
  background:#f0f2f4;border:none;font-size:22px;line-height:1;color:var(--uno-muted);
  cursor:pointer;width:34px;height:34px;min-width:34px;min-height:34px;
  border-radius:50%;flex:0 0 auto;margin-right:-8px;
  display:flex;align-items:center;justify-content:center;
  padding:0;transition:.15s;
}
#unoGiftCardWrap .gcp-modal-close:hover{ background:#e3e7eb;color:var(--uno-dark); }
#unoGiftCardWrap .gcp-modal-body{ display:grid;grid-template-columns:180px 1fr;min-height:0;flex:1; }
#unoGiftCardWrap .gcp-modal-cats{
  border-right:1px solid var(--uno-border);padding:16px 10px;overflow-y:auto;background:#fafbfc;
}
#unoGiftCardWrap .gcp-cat{
  padding:10px 12px;border-radius:8px;font-size:15px;font-weight:500;color:var(--uno-text);
  cursor:pointer;margin-bottom:3px;transition:.12s;
}
#unoGiftCardWrap .gcp-cat:hover{ background:var(--uno-orange-soft); }
#unoGiftCardWrap .gcp-cat.sel{ background:var(--uno-orange-soft);color:var(--uno-orange-dk);font-weight:600; }
#unoGiftCardWrap .gcp-modal-images{ padding:18px;overflow-y:auto; }
#unoGiftCardWrap .gcp-modal-grid{ display:grid;grid-template-columns:repeat(3,1fr);gap:12px; }

/* ---- thank you ---- */
#unoGiftCardWrap .gcp-thanks{
  display:none;text-align:center;background:var(--uno-card);border:1px solid var(--uno-border);
  border-radius:var(--uno-radius);box-shadow:0 1px 3px rgba(40,50,65,.04);padding:50px 30px;
}
#unoGiftCardWrap .gcp-thanks.show{ display:block; }
#unoGiftCardWrap .gcp-check{
  width:62px;height:62px;border-radius:50%;background:var(--uno-green);color:#fff;
  font-size:32px;display:flex;align-items:center;justify-content:center;margin:0 auto 18px;
}
#unoGiftCardWrap .gcp-thanks h2{ font-size:24px;font-weight:600;color:var(--uno-dark);margin-bottom:10px; }
#unoGiftCardWrap .gcp-thanks p{ font-size:16px;color:var(--uno-muted);max-width:560px;margin:0 auto 6px; }
#unoGiftCardWrap .gcp-thanks-note{ margin-top:14px; }
#unoGiftCardWrap .gcp-thanks-back{
  display:inline-block;margin-top:26px;padding:14px 30px;
  border:1px solid var(--uno-orange);border-radius:10px;
  background:var(--uno-orange);color:#fff;
  font-size:16px;font-weight:600;text-decoration:none;font-family:inherit;transition:.15s;
}
#unoGiftCardWrap .gcp-thanks-back:hover{ background:var(--uno-orange-dk);border-color:var(--uno-orange-dk); }

/* ============================================================
   MOBILE
   ============================================================ */
@media (max-width:768px){

  #unoGiftCardWrap{ font-size:16px; background:#f0f2f4; padding:16px; border-radius:12px; }
  #unoGiftCardWrap .gcp{ max-width:100%; }

  /* Single column */
  #unoGiftCardWrap .gcp-grid{ grid-template-columns:1fr; gap:16px; }
  #unoGiftCardWrap .gcp-row{ grid-template-columns:1fr; }

  /* Cards: roomier vertical, tighter sides so content uses the width */
  #unoGiftCardWrap .gcp-card{ padding:20px 16px; margin-bottom:16px; }
  #unoGiftCardWrap .gcp-step-h{ font-size:18px; }

  /* Design picker: keep 3 across but let names show fully */
  #unoGiftCardWrap .gcp-design-row{ gap:8px; }
  #unoGiftCardWrap .gcp-design-name{
    padding:6px 4px; font-size:16px; white-space:normal; line-height:1.3;
  }
  #unoGiftCardWrap .gcp-viewmore{ font-size:16px; }

  /* Amounts: even 3-up grid, custom amount full width below, hint centered */
  #unoGiftCardWrap .gcp-amounts{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
  #unoGiftCardWrap .gcp-amt{ min-width:0; padding:13px 6px; font-size:17px; }
  #unoGiftCardWrap .gcp-custom-wrap{ width:160px; margin:10px auto 0; }
  #unoGiftCardWrap .gcp-custom{ font-size:16px; }
  #unoGiftCardWrap .gcp-dollar{ font-size:16px; }
  #unoGiftCardWrap .gcp-amt-hint{ text-align:center; font-size:16px; }

  /* Fields / labels / inputs */
  #unoGiftCardWrap .gcp-field label{ font-size:16px; }
  #unoGiftCardWrap .gcp-field input,
  #unoGiftCardWrap .gcp-field textarea{ font-size:16px; }
  #unoGiftCardWrap .gcp-opt{ font-size:16px; }
  #unoGiftCardWrap .gcp-sub{ font-size:16px; }

  /* Delivery toggle + calendar + time dropdowns */
  #unoGiftCardWrap .gcp-deliv-opt{ font-size:16px; }
  #unoGiftCardWrap .gcp-cal-trigger{ font-size:16px; }
  #unoGiftCardWrap .gcp-cal-month{ font-size:16px; }
  #unoGiftCardWrap .gcp-cal-dow{ font-size:16px; }
  #unoGiftCardWrap .gcp-cal-day{ font-size:16px; }
  #unoGiftCardWrap .gcp-dd-trigger{ font-size:16px; }
  #unoGiftCardWrap .gcp-dd-item{ font-size:16px; }

  /* Square card field + error */
  #unoGiftCardWrap .gcp-sqcard{ padding:8px 12px; }
  #unoGiftCardWrap .gcp-card-err{ font-size:16px; }

  /* Summary stacks below the form, full width */
  #unoGiftCardWrap .gcp-summary{ position:static; padding:20px 16px; }
  #unoGiftCardWrap .gcp-sum-h{ font-size:17px; }
  #unoGiftCardWrap .gcp-sum-line{ font-size:16px; }
  #unoGiftCardWrap .gcp-sum-msg-label{ font-size:16px; }
  #unoGiftCardWrap .gcp-sum-msg-text{ font-size:16px; }

  /* Pay button + secure note + terms */
  #unoGiftCardWrap .gcp-pay{ font-size:17px; padding:6px 16px; }
  #unoGiftCardWrap .gcp-secure{ font-size:16px; display:block; }
  #unoGiftCardWrap .gcp-terms{ font-size:16px; text-align:center; }
  #unoGiftCardWrap .gcp-terms-2{ display:inline; }

  /* Designs modal: stack, cats scroll across the top */
  #unoGiftCardWrap .gcp-modal-backdrop{ padding:16px; }
  #unoGiftCardWrap .gcp-modal{ max-height:75vh; }
  /* Push ONLY the close button to the right edge; title stays put */
  #unoGiftCardWrap .gcp-modal-close{ margin-right:-8px; }
  #unoGiftCardWrap .gcp-modal-body{ display:flex; flex-direction:column; min-height:0; overflow:hidden; }
  #unoGiftCardWrap .gcp-modal-title{ font-size:18px; }
  #unoGiftCardWrap .gcp-modal-cats{
    border-right:none; border-bottom:1px solid var(--uno-border);
    display:flex; gap:6px; overflow-x:auto; flex-shrink:0;
  }
  #unoGiftCardWrap .gcp-cat{ white-space:nowrap; margin-bottom:0; font-size:16px; }
  /* Only the image grid scrolls; cats stay pinned, nothing gets cut off */
  #unoGiftCardWrap .gcp-modal-images{ flex:1; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; }
  #unoGiftCardWrap .gcp-modal-grid{ grid-template-columns:repeat(2,1fr); }
}
/* ============================================================
   SCROLL LOCK — applied to <body> while a modal is open
   ============================================================ */
body.gcp-no-scroll{ position:fixed; width:100%; overflow:hidden; }
