/* ============================================================
   VELMORA — Product detail page
   ============================================================ */
.pdp{padding:20px 0 78px;}
.back{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-70);
  padding:14px 0 20px;transition:color .26s var(--ease),gap .26s var(--ease);}
.back:hover{color:var(--gold-deep);gap:12px;}
.back svg{width:12px;height:12px;stroke-width:2;}

.pdp__grid{display:grid;grid-template-columns:1fr 1.03fr;gap:52px;align-items:start;}
/* CRITICAL mobile fix: a grid item's default min-width:auto equals the
   content width — the 600px product photo stretched the stage past the
   viewport on small phones and the price/details went off-screen.
   (17 Aug 2026) */
.pdp__grid > *{min-width:0;}


/* ---------- Left: media ---------- */
.pmedia{position:relative;}
.pmedia__stage{position:relative;aspect-ratio:1;background:#161618;overflow:hidden;
  display:grid;place-items:center;cursor:zoom-in;
  /* Let vertical page scrolling win, but hand horizontal drags to the
     spin viewer. Without this a touch on the stage was treated as a
     scroll gesture, so the finger-drag 360 rotation on phones silently
     died even though the pointer handlers were in place. (15 Aug 2026) */
  touch-action:pan-y;}
/* When the supplier viewer is showing, the stage grows so the viewer's own
   two control rows sit inside the frame instead of being clipped. */
.pmedia__stage.is-360{aspect-ratio:1/1;background:#c9c9c9;overflow:hidden;
  /* ROUND 4 (18 Aug 2026): 360 mode mein stage ek PLAIN BLOCK hai —
     Base44 ke specimen-frame jaisa. display:block (grid nahi, koi
     place-items nahi), touch-action:auto, koi cursor magic. Supplier
     viewer ke iframe ka ancestor isse zyada simple nahi ho sakta. */
  display:block;touch-action:auto;cursor:default;}
/* --crop sizing retired (18 Aug 2026): the supplier viewer is shown at
   FULL SIZE — same as Base44's w-full h-full border-0. */

.pmedia__stage img{width:100%;height:100%;object-fit:contain;
  transition:transform .5s var(--ease);will-change:transform;
  /* iOS Safari: stop the browser grabbing the photo for its own drag /
     long-press callout, which swallowed our touch rotation. (16 Aug 2026) */
  -webkit-user-drag:none;user-select:none;-webkit-touch-callout:none;pointer-events:none;}
.pmedia__stage.is-zoom{cursor:grab;}
.pmedia__stage.is-zoom.is-dragging{cursor:grabbing;}
.pmedia__stage.is-spin{cursor:grab;background:#161618;}
.pmedia__stage.is-spin:active{cursor:grabbing;}

.p360{position:absolute;left:12px;bottom:12px;z-index:4;width:38px;height:38px;border-radius:50%;
  background:rgba(255,255,255,.94);display:grid;place-items:center;font-size:8.5px;font-weight:700;
  letter-spacing:.04em;color:var(--ink);box-shadow:0 2px 10px rgba(0,0,0,.18);
  transition:all .3s var(--ease);}
.p360:hover{transform:scale(1.08);}
.p360.is-on{background:var(--gold);color:#fff;}

.pmedia__hint{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:4;
  background:rgba(26,26,26,.74);color:#fff;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;
  padding:6px 13px;border-radius:20px;pointer-events:none;opacity:0;transition:opacity .3s;}
.pmedia__stage.is-spin .pmedia__hint{opacity:1;}
.pmedia__badges{position:absolute;right:12px;top:12px;z-index:4;display:flex;flex-direction:column;gap:6px;
  align-items:flex-end;}
.pmedia__badge{background:rgba(255,255,255,.95);font-size:8.5px;font-weight:700;letter-spacing:.11em;
  text-transform:uppercase;padding:5px 10px;color:var(--ink-70);box-shadow:0 1px 5px rgba(0,0,0,.1);}

.pthumbs{display:flex;gap:9px;margin-top:12px;}
.pthumb{width:64px;height:64px;border:1px solid var(--line);background:#161618;overflow:hidden;
  transition:border-color .26s var(--ease);flex-shrink:0;position:relative;}
.pthumb img{width:100%;height:100%;object-fit:cover;}
.pthumb.is-on{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold);}
.pthumb__tag{position:absolute;left:0;right:0;bottom:0;background:rgba(26,26,26,.72);color:#fff;
  font-size:7px;letter-spacing:.09em;text-transform:uppercase;text-align:center;padding:2px 0;}

/* certificate block (left column) */
.certbox{display:flex;align-items:center;gap:16px;border:1px solid var(--line);padding:16px 18px;
  margin-top:16px;background:#fff;}
.certbox__logo{width:56px;height:56px;flex-shrink:0;display:grid;place-items:center;
  border:1px solid var(--line-soft);background:var(--gold-wash);}
.certbox__logo svg{width:38px;height:38px;}
.certbox__t{font-size:15.5px;font-weight:800;margin-bottom:6px;color:var(--ink);}
.certbox__n{font-size:12.5px;font-weight:600;color:var(--ink-70);letter-spacing:.03em;display:flex;
  align-items:center;gap:8px;flex-wrap:wrap;}
.certbox__n b{color:var(--ink);font-weight:800;font-size:15px;letter-spacing:.02em;text-decoration:underline;text-underline-offset:3px;}
.copybtn{display:inline-grid;place-items:center;width:24px;height:24px;color:var(--ink-55);
  transition:color .24s,transform .24s;}
.copybtn:hover{color:var(--gold-deep);transform:scale(1.12);}
.copybtn svg{width:15px;height:15px;stroke-width:2;}
.certbox__link{display:block;font-size:12.5px;font-weight:700;color:var(--gold-deep);text-decoration:underline;
  text-underline-offset:3px;margin-top:7px;transition:color .24s;}
.certbox__link:hover{color:var(--gold-dark);}

/* ---------- Right: info ---------- */
.pinfo{background:var(--bg-soft);padding:30px 32px 34px;}
.pinfo__title{font-size:clamp(23px,2.6vw,31px);line-height:1.22;font-weight:400;margin-bottom:12px;}
.pinfo__strip{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:13px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink-70);margin-bottom:18px;}
.pinfo__strip svg{width:15px;height:15px;color:var(--gold);flex-shrink:0;}
.pinfo__strip b{color:var(--ink);font-weight:800;}
.pinfo__strip i{font-style:normal;opacity:.45;}

.sharebtn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;
  padding:9px 17px;font-size:12.5px;font-weight:600;color:var(--ink-70);transition:all .28s var(--ease);margin-bottom:20px;}
.sharebtn:hover{border-color:var(--gold);color:var(--gold-deep);}
.sharebtn svg{width:13px;height:13px;stroke-width:1.7;}

.pricebox{background:#fff;border:1px solid var(--line);padding:20px 22px;margin-bottom:14px;}
.pricebox__row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.pricebox__lab{font-size:15px;font-weight:600;color:var(--ink);display:block;margin-bottom:3px;
  font-family:var(--serif);}
.pricebox__sub{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-55);}
.pricebox__v{font-size:clamp(22px,2.5vw,28px);font-weight:800;color:var(--ink);letter-spacing:-.015em;
  white-space:nowrap;font-variant-numeric:tabular-nums lining-nums;}
.pricebox__v span{font-size:.62em;font-weight:600;color:var(--ink-55);margin-left:3px;}
.pricebox__note{font-size:11.5px;color:var(--ink-55);margin-top:12px;line-height:1.65;}

/* ═══ (ZIP BF) SHIPPING ROW — "Shipping" label BOLD (Price label jaisa),
   value GREEN "FREE" (checkout sum-row jaisa #2E7D5B). Owner ka hukum. ═══ */
.pricebox__ship{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line);
  display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.pricebox__shiplab{font-size:20px;font-weight:800;color:var(--ink);display:block;margin-bottom:3px;
  letter-spacing:-.01em;font-family:var(--serif);}
.pricebox__shipsub{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-55);}
.pricebox__shipval{font-size:20px;font-weight:800;color:#2E7D5B;letter-spacing:-.015em;}

.pactions{display:grid;gap:9px;margin-bottom:12px;}
.plocked{font-size:11.5px;color:var(--ink-55);line-height:1.7;margin-bottom:22px;}

/* details table */
.dtable{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);}
.dtable caption{font-family:var(--serif);font-size:23px;text-align:left;padding:0 0 15px;color:var(--ink);}
.dtable th,.dtable td{padding:11px 16px;font-size:14px;text-align:left;
  border-bottom:1px solid var(--line-soft);}
.dtable tr:last-child th,.dtable tr:last-child td{border-bottom:0;}
.dtable th{font-weight:600;color:var(--ink-70);width:48%;}
.dtable td{text-align:right;font-weight:700;color:var(--ink);
  font-variant-numeric:tabular-nums lining-nums;}
.dtable tr:nth-child(even){background:#FBF7F1;}   /* (ZIP DB) grey → gold-wash */
.dtable tr.is-hl th{color:var(--gold-deep);}
.dtable tr.is-hl td{color:var(--gold-dark);font-weight:600;}

.trustrow{display:flex;gap:20px;flex-wrap:wrap;margin-top:20px;padding-top:18px;
  border-top:1px solid var(--line);}
.trustrow div{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--ink-70);}
.trustrow svg{width:15px;height:15px;color:var(--gold);stroke-width:1.6;flex-shrink:0;}

/* ---------- Related ---------- */
.related{padding:56px 0 0;border-top:1px solid var(--line-soft);margin-top:60px;}
.related h2{font-size:26px;text-align:center;margin-bottom:8px;}
.related__sub{text-align:center;font-size:12px;color:var(--ink-55);margin-bottom:32px;}

@media (max-width:1000px){
  .pdp__grid{grid-template-columns:1fr;gap:30px;}
  .pinfo{padding:24px 22px 28px;}
  /* (The left-column certificate box was removed from the markup on
     15 Aug 2026 — the certificate now appears once, beside the price.) */
}
@media (max-width:600px){
  .pdp{padding:8px 0 50px;}
  .pinfo__strip{font-size:10px;gap:6px;}
  .dtable th,.dtable td{padding:8px 12px;font-size:11.5px;}
}

/* ---- Supplier-hosted 360° viewer (loads only when the 360 button is pressed) ---- */
.pmedia__iframe{display:block;width:100%;height:100%;border:0;background:#161618;
  /* Base44-pure (18 Aug 2026): the frame is STATIC, in normal flow, and
     VISIBLE from the moment it exists — no opacity/visibility hide-reveal,
     no transition, no absolute+z-index. Base44, where the same viewer drags
     fine on iPhone Safari, uses exactly w-full h-full border-0 static.
     iOS Safari ignores touch-drag inside cross-origin iframes that were
     hidden at creation (opacity/visibility) or absolutely positioned —
     buttons (clicks) still work, which is exactly the owner's symptom:
     buttons OK, diamond drag dead. */}
.pmedia__stage:not(.is-360):not(.is-dealer) .pmedia__iframe{display:none;}
.pmedia__stage.is-360 .pmedia__iframe{opacity:1;visibility:visible;}
.pmedia__stage.is-360{cursor:default;}
.pmedia__stage.is-360 > picture,
.pmedia__stage.is-360 > img{display:none;}
.pmedia__stage.is-360 .pmedia__hint{opacity:0;}
.pmedia__stage.is-360 .pmedia__iframe:not(#v360frame){display:none;}
/* ---- (9 Sep 2026, ZIP L) DDPL dealer videos: Carbon / On Hand / Tweezer ----
   BUG FIX: purhi line :not(.is-360) in teenon video frames ko HAMESHA
   chhupa rahi thi, kyunki dealer video kholte waqt 360 mode band ho jata
   tha. Video andar load hoti thi par kabhi screen par nahi dikhti thi.
   Ab naya is-dealer mode: photo + 360 frame chhupao, sirf ACTIVE dealer
   frame dikhao (is-on class). Owner ne 3 din wait kiya tha — fix yahi hai. */
.pmedia__stage.is-dealer > picture,
.pmedia__stage.is-dealer > img{display:none;}
.pmedia__stage.is-dealer #v360frame{display:none;}
.pmedia__stage.is-dealer .p360{display:none;}
.pmedia__stage.is-dealer .pmedia__hint{opacity:0;}
.pmedia__stage.is-dealer .pmedia__iframe:not(.is-on){display:none;}
.pmedia__stage.is-dealer .pmedia__iframe.is-on{display:block;opacity:1;visibility:visible;}
.pmedia__stage.is-dealer{cursor:default;}
.pthumb--live::after{content:'';position:absolute;top:5px;right:5px;width:7px;height:7px;
  border-radius:50%;background:#5FD08A;box-shadow:0 0 0 2px rgba(255,255,255,.9);z-index:2;}

/* ---- Share + Wishlist row ---- */
.pinfo__acts{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:20px;}
.pinfo__acts .sharebtn{margin-bottom:0;}
.wishbtn.is-on{border-color:var(--gold);background:var(--gold-wash);color:var(--gold-deep);}
.wishbtn.is-on svg{fill:var(--gold);stroke:var(--gold);}
.sharebox{display:flex;gap:7px;flex-wrap:wrap;margin:-12px 0 20px;}
.sharebox a,.sharebox button{border:1px solid var(--line);background:#fff;padding:7px 13px;
  font-size:11.5px;font-weight:600;color:var(--ink-70);transition:all .26s var(--ease);}
.sharebox a:hover,.sharebox button:hover{border-color:var(--gold);color:var(--gold-deep);
  background:var(--gold-wash);}

/* ---- 360 loading state ---- */
/* (ZIP CW) "Loading 360° view…" ka plain ::after text HATA diya — ab
   gold dots + text wala overlay JS se aata hai (showSupplier me
   #vd360Ld) — video tabs jaisa hi look (owner ne pakda: sirf likha
   aata tha, dots nahi). Rule yahan sirf isliye rakha hai ki koi purana
   cache isse dikhane ki koshish na kare. */
.pmedia__stage.is-loading::after{content:none;}

/* ---- 360 blocked fallback (file:// only) ---- */
.pmedia__blocked{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:14px;text-align:center;padding:30px;
  background:rgba(22,22,24,.95);}
.pmedia__blocked p{color:rgba(255,255,255,.9);font-size:13px;line-height:1.7;max-width:280px;margin:0;}
.pmedia__blocked span{color:rgba(255,255,255,.5);font-size:10.5px;letter-spacing:.05em;}
.pmedia__stage.is-blocked > picture,.pmedia__stage.is-blocked > img{opacity:.25;}
.sharebox__note{width:100%;font-size:11.5px;color:var(--ink-55);line-height:1.7;margin:0 0 4px;}
.sharebox__row{display:flex;gap:7px;width:100%;}
.sharebox__row input{flex:1;border:1px solid var(--line);padding:7px 11px;font-size:11.5px;
  background:var(--bg-soft);color:var(--ink-70);}

/* ---- Built-in 360 control bar ---- */
.v360bar{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:6;
  display:flex;align-items:center;gap:3px;padding:5px 7px;border-radius:30px;
  background:rgba(20,20,22,.82);backdrop-filter:blur(8px);
  box-shadow:0 4px 18px rgba(0,0,0,.32);}
.v360bar[hidden]{display:none!important;}
.v360bar button{display:grid;place-items:center;min-width:28px;height:28px;padding:0 8px;
  border-radius:20px;color:rgba(255,255,255,.82);font-size:8.5px;font-weight:800;
  letter-spacing:.08em;transition:all .2s var(--ease);}
.v360bar button:hover{background:rgba(255,255,255,.16);color:#fff;}
.v360bar button.is-on{background:var(--gold);color:#fff;}
.v360bar svg{width:14px;height:14px;stroke-width:2;}
.v360bar__sep{width:1px;height:16px;background:rgba(255,255,255,.2);margin:0 3px;}
.v360bar .ic-play{display:none;}
.v360bar [data-v="play"]:not(.is-on) .ic-pause{display:none;}
.v360bar [data-v="play"]:not(.is-on) .ic-play{display:block;}
.pmedia__stage.is-spin .pmedia__hint{bottom:52px;}
@media (max-width:600px){
  .v360bar{gap:1px;padding:4px 5px;bottom:10px;}
  .v360bar button{min-width:24px;height:24px;padding:0 6px;font-size:7.5px;}
  .v360bar svg{width:12px;height:12px;}
}
.sharebox{flex-direction:column;align-items:stretch;gap:9px;}
.sharebox__links{display:flex;gap:7px;flex-wrap:wrap;}
.sharebox__row input{font-family:var(--sans);}

/* Vision360 renders its own share strip (link / Facebook / mail / QR /
   WhatsApp) under the controls. The client doesn't want it, so the frame is
   given extra height and the stage clips the surplus off the bottom.
   The frame keeps 100% width so the stone stays centred. */
.pmedia__stage{overflow:hidden;}
/* Keep the viewer's own two control rows visible but crop everything below
   them — the share strip (link / Facebook / mail / QR / WhatsApp) and the
   "© Vision360 · Terms of Use" credit. The frame is taller than the stage and
   anchored to the top, so the surplus falls outside and is clipped. */
/* The viewer re-fits its whole layout to any height it is given, so resizing
   the frame can never push the share row out — it just moves with everything
   else. Instead the frame fills the stage normally and the share row plus the
   Vision360 credit are covered by an opaque mask in the viewer's own grey. */
.pmedia__iframe--crop{width:100%;height:100%;border:0;} /* sizing retired 18 Aug 2026 */
/* A slim hint strip tells the buyer the controls are one hover/tap away. */


/* ---- Availability notice ---- */
.prenote{display:block;padding:14px 16px;margin-bottom:14px;border-left:3px solid var(--gold);
  background:var(--gold-wash);font-size:12.5px;line-height:1.7;}
.prenote b{display:block;color:var(--gold-deep);margin-bottom:3px;font-size:13px;}
.prenote span{color:var(--ink-70);}
.prenote--ok{border-left-color:var(--ok);background:rgba(46,125,91,.06);}
.prenote--ok b{color:var(--ok);}

/* Lab marks are wordmarks, so the badge box is wider than tall */
.certbox__logo{width:auto;min-width:0;height:auto;padding:0;border:none;background:transparent;}
.certbox__logo svg{width:100%;height:100%;}

/* ══════════════════════════════════════════════════════════════════
   CERTIFICATE BOX — MOBILE  (fixed 30 Jul 2026)
   The lab wordmark is min-width:104px, which on a 390px screen left so
   little room that "CERTIFICATE NUMBER" wrapped onto two lines and the
   whole block grew to 185px tall. Below 700px the logo sits on its own
   row at a sane size and the text gets the full width.
   ══════════════════════════════════════════════════════════════════ */
@media (max-width:700px){
  .certbox{gap:11px;padding:13px 14px;align-items:flex-start;}
  .certbox__logo{min-width:0;width:auto;height:auto;padding:0;border:none;background:transparent;}
  .certbox .certbox__logo .lablogo{max-width:200px;max-height:64px;}
  .certbox__logo svg{width:100%;height:100%;}
  .certbox__t{font-size:14px;margin-bottom:4px;}
  /* Stack the label above the number instead of fighting for one line.
     "CERTIFICATE NUMBER" is 18 characters — it will never sit beside a
     10-digit number at a readable size on a 390px screen. */
  /* Grid, not flex: label spans the full first row, then the number and the
     copy button share the second row. flex-basis:100% pushed the button onto
     a third row of its own. */
  .certbox__n{display:grid;grid-template-columns:auto auto;justify-content:start;
    align-items:center;gap:1px 7px;font-size:9.5px;letter-spacing:.06em;
    line-height:1.35;color:var(--ink-55);}
  .certbox__n::first-line{}
  .certbox__n b{grid-column:1;font-size:14px;white-space:nowrap;}
  .certbox__n .copybtn{grid-column:2;grid-row:2;}
  .copybtn{width:20px;height:20px;flex-shrink:0;}
  .copybtn svg{width:13px;height:13px;}
  .certbox__link{font-size:11.5px;margin-top:5px;}
}

/* Real lab marks (GIA / IGI / HRD) supplied by the owner — replaces the
   hand-drawn SVG approximations. Contained, never stretched. */
.lablogo{width:100%;height:100%;object-fit:contain;display:block;}
/* (ZIP AQ) certbox me BADA clean wordmark — 80px (pehle 56px badge box).
   Owner: "product page ka logo bahut chhota hai, jagah hai, bada karo". */
.certbox__logo .lablogo{width:auto;height:auto;max-width:242px;max-height:80px;}
.pthumb .lablogo{max-width:70%;max-height:70%;margin:auto;}

/* ---------- SALE on the product page ---------- */
.pricebox.is-sale{border-color:var(--danger);}
.pricebox__tag{display:inline-block;font-style:normal;background:var(--danger);color:#fff;
  font-size:9px;font-weight:800;letter-spacing:.1em;padding:2px 7px;border-radius:2px;
  margin-left:7px;vertical-align:2px;}
.pricebox__was{color:var(--ink-40);font-weight:500;font-size:.62em;margin-right:6px;}
.pricebox.is-sale .pricebox__v{color:var(--danger);}

/* GIA's report-check page needs a second visit before it shows the stone —
   see the note in product.js. Warn up front and offer the number. */
.certbox__hint{margin-top:9px;padding:9px 11px;background:#FFF8F0;
  border:1px solid #E8D5BC;font-size:11.5px;line-height:1.6;color:var(--ink-70);
  border-radius:3px;}
.copybtn--wide{display:inline-flex;align-items:center;gap:6px;margin-top:7px;
  padding:5px 11px;border:1px solid var(--gold);background:#fff;
  color:var(--gold-deep);font-size:11.5px;font-weight:600;border-radius:3px;
  cursor:pointer;width:auto;height:auto;}
.copybtn--wide svg{width:13px;height:13px;stroke-width:1.7;}
.copybtn--wide:hover{background:var(--gold-wash);}





/* ---- (v11) DDPL dealer video tabs — Real View / On Hand / Detail ---- */
.pthumb[data-view="carbon"],
.pthumb[data-view="hand"],
.pthumb[data-view="tweezer"] {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .3px;
  color: var(--gold-deep, #8a6d1a);
  background: var(--gold-wash, #FBF7F1);
  border: 1px solid rgba(201,151,63,.25);
}
.pthumb[data-view="carbon"]:hover,
.pthumb[data-view="hand"]:hover,
.pthumb[data-view="tweezer"]:hover {
  background: rgba(201,151,63,.12);
  border-color: var(--gold, #C9973F);
}
.pthumb[data-view="carbon"].is-on,
.pthumb[data-view="hand"].is-on,
.pthumb[data-view="tweezer"].is-on {
  background: var(--gold, #C9973F);
  color: #fff;
  border-color: var(--gold-deep, #8a6d1a);
}


/* (ZIP K) 360 / dealer-video / built-in spin mode me +/− zoom buttons
   CHHUPE — wahan photo hidden hoti hai, zoom lagta nahi (button "mar
   gaya" lagta tha). Photo par wapas aate hi buttons wapas. */
.pmedia__stage.is-360 .pzoom,
.pmedia__stage.is-dealer .pzoom,
.pmedia__stage.is-spin .pzoom { display: none !important; }   /* (ZIP K) !important — inline display:flex ko beat kare */
.pzoom { display: flex; flex-direction: column; gap: 6px; }

/* ═══ (ZIP DC) ROUNDED CORNERS PASS (owner, 3 Oct) ═══ */
.pricebox,.certbox{border-radius:14px;}
.pthumb,.sharebtn,.sharebox a,.sharebox button{border-radius:8px;}
.sharebox__row input{border-radius:10px;}
