/* Taller de Talavera — custom cart/checkout (PT-BR, R$) layered over the Shopify theme */
:root{
  --ci-accent:#810f0f;
  --ci-accent-dark:#5e0a0a;
  --ci-green:#1f8f4e;
  --ci-ink:#1a1a1a;
  --ci-muted:#6b6b6b;
  --ci-line:#e6e6e6;
  --ci-bg:#ffffff;
  --ci-radius:10px;
  --ci-font:"Work Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

/* ---------- cart count badge ---------- */
.ci-cart-badge{
  position:absolute; top:-6px; right:-8px; min-width:18px; height:18px; padding:0 5px;
  background:#000; color:#fff; border-radius:999px; font:600 11px/18px var(--ci-font);
  text-align:center; box-shadow:0 0 0 2px #fff;
}
.ci-cart-anchor{position:relative;}
.cart-count-bubble,
#cart-icon-bubble .cart-count-bubble{
  background:#000 !important;
  color:#fff !important;
}
cart-drawer.drawer,
#shopify-section-cart-drawer cart-drawer,
#CartDrawer{
  display:none !important;
  visibility:hidden !important;
}

/* ---------- drawer ---------- */
.ci-overlay{position:fixed; inset:0; background:rgba(0,0,0,.50); opacity:0; visibility:hidden;
  transition:opacity .25s ease; z-index:99998;}
.ci-overlay.open{opacity:1; visibility:visible;}
.ci-drawer{position:fixed; top:0; right:0; height:100%; width:560px; max-width:96vw; background:#fff;
  transform:translateX(100%); transition:transform .3s cubic-bezier(.4,0,.2,1); z-index:99999;
  display:flex; flex-direction:column; font-family:var(--ci-font); box-shadow:-8px 0 40px rgba(0,0,0,.22); color:#111;}
.ci-drawer.open{transform:translateX(0);}
.ci-drawer__head{display:flex; align-items:center; justify-content:space-between; padding:26px 32px 24px;
  border-bottom:0;}
.ci-drawer__head h2{margin:0; font:800 40px/1 var(--ci-font); letter-spacing:0; color:#000; text-transform:none;}
.ci-x{position:relative; width:42px; height:42px; background:none; border:0; cursor:pointer; color:#000; padding:0; flex:none;}
.ci-x span{position:absolute; left:4px; right:4px; top:20px; height:3px; background:#000; transform:rotate(45deg);}
.ci-x span+span{transform:rotate(-45deg);}
.ci-reserve{background:#000; color:#fff; text-align:center; margin:0 0 18px; padding:19px 18px;
  font:800 22px/1 var(--ci-font); letter-spacing:.01em;}
.ci-drawer__body{flex:1 1 auto; min-height:0; overflow-y:auto; padding:0 32px 10px;}
.ci-empty{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px;
  min-height:220px; color:var(--ci-muted); text-align:center;}
.ci-empty a{color:var(--ci-accent); font-weight:600; text-decoration:none;}
.ci-rewards{padding:10px 0 30px;}
.ci-rewards__msg{text-align:center; font:800 22px/1.2 var(--ci-font); letter-spacing:.02em; margin-bottom:18px;}
.ci-rewards__bar{position:relative; height:50px; margin:0 30px;
  background:repeating-linear-gradient(135deg,#000 0,#000 7px,#9b9b9b 7px,#9b9b9b 14px);
  background-size:28px 12px; background-repeat:repeat-x; background-position:left 10px; border-radius:999px;
  animation:ciStripeMove .65s linear infinite;}
.ci-rewards__fill{position:absolute; left:0; top:10px; height:12px; border-radius:999px; background:#000; transition:width .35s ease;}
.ci-rewards__tier{position:absolute; top:0; transform:translateX(-50%); display:grid; justify-items:center; gap:5px; min-width:92px;}
.ci-rewards__tier b{display:grid; place-items:center; width:34px; height:34px; border:3px solid #000; border-radius:999px; background:#fff;}
.ci-rewards__tier svg{width:20px; height:20px; fill:#000;}
.ci-rewards__tier small{font:500 18px/1 var(--ci-font); white-space:nowrap; color:#111;}
.ci-line{display:flex; gap:18px; padding:18px 0 22px; border-bottom:0;}
.ci-line__img{width:104px; height:104px; object-fit:cover; border-radius:0; background:#f3f3f3; flex:none;}
.ci-line__info{flex:1; min-width:0;}
.ci-line__title{font:800 24px/1.12 var(--ci-font); color:#000; margin:0 0 10px; text-decoration:none; display:block; letter-spacing:.01em;}
.ci-line__var{font:500 18px/1.2 var(--ci-font); color:#333; margin-bottom:16px;}
.ci-qty{display:inline-grid; grid-template-columns:48px 58px 48px; align-items:center; border:1px solid #888; border-radius:8px; overflow:hidden; background:#f7f7f7;}
.ci-qty button{width:48px; height:36px; background:none; border:0; cursor:pointer; font:600 22px/1 var(--ci-font); color:#222;}
.ci-qty button+span,.ci-qty span+button{border-left:1px solid #bbb;}
.ci-qty span{min-width:58px; text-align:center; font:800 20px/36px var(--ci-font); color:#000;}
.ci-line__side{display:flex; flex-direction:column; align-items:flex-end; justify-content:space-between; min-width:162px;}
.ci-line__price{text-align:right; color:#000; white-space:normal; max-width:170px;}
.ci-line__price strong{display:block; font:800 24px/1 var(--ci-font);}
.ci-line__price small{display:block; margin-top:4px; font:800 16px/1.12 var(--ci-font);}
.ci-line__compare{font:500 20px/1 var(--ci-font); color:#777; text-decoration:line-through; margin-right:6px;}
.ci-line__remove{display:grid; place-items:center; width:28px; height:28px; background:none; border:0; cursor:pointer; color:#000; padding:0; margin:0;}
.ci-line__remove svg{width:22px; height:22px; fill:#000;}
.ci-drawer__foot{flex:none; padding:18px 32px 22px; border-top:1px solid #cfcfcf; background:#fff;}
.ci-savings,.ci-total,.ci-mini-row{display:flex; justify-content:space-between; align-items:baseline; gap:12px;}
.ci-savings span,.ci-total span{font:800 26px/1.1 var(--ci-font); color:#000;}
.ci-savings strong,.ci-total strong{font:800 26px/1.1 var(--ci-font); color:#000; white-space:nowrap;}
.ci-mini-row{margin:6px 0 12px; color:#444;}
.ci-mini-row span,.ci-mini-row strong{font:700 14px/1.2 var(--ci-font);}
.ci-total{margin-top:12px; margin-bottom:18px;}
.ci-note{font:500 14px/1.35 var(--ci-font); color:#666; margin:10px 0 16px;}
.ci-btn{display:flex; align-items:center; justify-content:center; gap:8px; width:100%; padding:15px 18px;
  background:#000; color:#fff; border:0; border-radius:8px; cursor:pointer; text-decoration:none;
  font:800 24px/1 var(--ci-font); letter-spacing:0; text-transform:none; transition:background .15s;}
.ci-btn:hover{background:#000;}
.ci-btn--accent{background:#000;} .ci-btn--accent:hover{background:#111;}
.ci-btn--green{background:var(--ci-green);} .ci-btn--green:hover{filter:brightness(.93);}
.ci-btn[disabled]{opacity:.5; cursor:not-allowed;}
.ci-btn--ghost{background:#fff; color:#000; border:2px solid #000; margin-top:10px; font-size:17px; padding:13px 16px;}
.ci-btn--ghost:hover{background:#f6f6f6;}
@keyframes ciStripeMove{to{background-position:28px 10px;}}

/* Product-page combo add buttons: replace the original grey toggle with a clear + action. */
product-info-upsell .upsell-toggle-btn.toggle-switch,
.upsell .upsell-toggle-btn.toggle-switch,
product-info-upsell .upsell__toggle-switch,
.upsell .upsell__toggle-switch{
  position:relative !important;
  display:grid !important;
  place-items:center !important;
  width:42px !important;
  min-width:42px !important;
  height:42px !important;
  padding:0 !important;
  border:2px solid #000 !important;
  border-radius:999px !important;
  background:#fff !important;
  box-shadow:none !important;
  cursor:pointer !important;
}
product-info-upsell .upsell-toggle-btn.toggle-switch::before,
product-info-upsell .upsell-toggle-btn.toggle-switch::after,
.upsell .upsell-toggle-btn.toggle-switch::before,
.upsell .upsell-toggle-btn.toggle-switch::after,
product-info-upsell .upsell__toggle-switch::before,
product-info-upsell .upsell__toggle-switch::after,
.upsell .upsell__toggle-switch::before,
.upsell .upsell__toggle-switch::after{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  width:18px !important;
  height:3px !important;
  border-radius:999px !important;
  background:#000 !important;
  transform:translate(-50%,-50%) !important;
}
product-info-upsell .upsell-toggle-btn.toggle-switch::after,
.upsell .upsell-toggle-btn.toggle-switch::after,
product-info-upsell .upsell__toggle-switch::after,
.upsell .upsell__toggle-switch::after{
  transform:translate(-50%,-50%) rotate(90deg) !important;
}
product-info-upsell .upsell-toggle-btn .toggle-switch__slider,
.upsell .upsell-toggle-btn .toggle-switch__slider{
  display:none !important;
}
product-info-upsell .upsell-toggle-btn.toggle-switch:hover,
.upsell .upsell-toggle-btn.toggle-switch:hover,
product-info-upsell .upsell__toggle-switch:hover,
.upsell .upsell__toggle-switch:hover{
  background:#f4f4f4 !important;
}
@media(max-width:600px){
  .ci-drawer{width:100vw; max-width:100vw;}
  .ci-drawer__head{padding:22px 22px 18px;}
  .ci-drawer__head h2{font-size:34px;}
  .ci-drawer__body{padding:0 22px 10px;}
  .ci-drawer__foot{padding:18px 22px 24px;}
  .ci-rewards__msg{font-size:19px;}
  .ci-rewards__bar{margin:0 24px;}
  .ci-rewards__tier small{font-size:15px;}
  .ci-line{gap:14px;}
  .ci-line__img{width:86px; height:86px;}
  .ci-line__title{font-size:20px;}
  .ci-line__var{font-size:16px;}
  .ci-line__side{min-width:118px;}
  .ci-line__price strong{font-size:20px;}
  .ci-line__price small{font-size:13px;}
  .ci-line__compare{font-size:16px;}
  .ci-savings span,.ci-total span,.ci-savings strong,.ci-total strong{font-size:23px;}
}
@media(prefers-reduced-motion:reduce){
  .ci-rewards__bar{animation:none;}
  .ci-rewards__fill{transition:none;}
}

/* ---------- product page variant select (injected) ---------- */
.ci-variant{margin:14px 0;}
.ci-variant label{display:block; font:600 12px var(--ci-font); text-transform:uppercase; letter-spacing:.03em; margin-bottom:6px; color:var(--ci-ink);}
.ci-variant select{width:100%; padding:12px 14px; border:1px solid #cfcfcf; border-radius:6px; font:400 14px var(--ci-font); background:#fff;}

/* ---------- checkout & cart pages ---------- */
.ci-page{font-family:var(--ci-font); color:var(--ci-ink); background:#fafafa; min-height:100vh;}
.ci-topbar{background:#fff; border-bottom:1px solid var(--ci-line);}
.ci-topbar__in{max-width:1100px; margin:0 auto; padding:20px 24px; display:flex; align-items:center; justify-content:space-between;}
.ci-logo{font:600 24px var(--ci-font); letter-spacing:.18em; color:var(--ci-ink); text-decoration:none;}
.ci-logo small{display:block; font:400 9px var(--ci-font); letter-spacing:.22em; color:var(--ci-muted); text-align:center; margin-top:2px;}
.ci-logo img{display:block; height:54px; width:auto; max-width:178px; object-fit:contain;}
.ci-logo--img{display:inline-flex; align-items:center; line-height:0;}
.ci-logo--img img{display:block; height:52px; width:auto;}
@media (max-width:600px){.ci-logo--img img{height:40px;}}
.ci-secure{font:500 12px var(--ci-font); color:var(--ci-muted); display:flex; align-items:center; gap:6px;}
.ci-topbar--center .ci-topbar__in{display:grid; grid-template-columns:1fr auto 1fr; align-items:center;}
.ci-topbar--center .ci-logo{justify-self:center;}
.ci-bag{justify-self:end; display:inline-flex; padding:6px; color:var(--ci-ink); text-decoration:none;}
.ci-bag:hover{color:var(--ci-accent);}
.ci-wrap{max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr; gap:0; align-items:start;}
.ci-col-main{order:1; padding:26px 22px 70px;}
.ci-col-side{order:0; background:#f6f6f7; border-bottom:1px solid var(--ci-line);}
@media(min-width:881px){
  .ci-wrap{grid-template-columns:1.35fr 1fr;}
  .ci-col-main{order:0; padding:44px 52px 90px;}
  .ci-col-side{order:1; border-bottom:0; border-left:1px solid var(--ci-line); align-self:stretch;}
}
.ci-h{font:600 18px var(--ci-font); margin:0 0 16px; color:var(--ci-ink);}
.ci-h2{font:600 14px var(--ci-font); text-transform:uppercase; letter-spacing:.04em; margin:28px 0 12px; color:var(--ci-ink);}
.ci-field{margin-bottom:14px;}
.ci-field label{display:block; font:500 12px var(--ci-font); color:var(--ci-muted); margin-bottom:6px;}
.ci-field input,.ci-field select,.ci-field textarea{width:100%; padding:13px 14px; border:1px solid #cfcfcf; border-radius:6px;
  font:400 14px var(--ci-font); background:#fff; box-sizing:border-box;}
.ci-field input:focus,.ci-field select:focus{outline:none; border-color:var(--ci-accent); box-shadow:0 0 0 2px rgba(129,15,15,.12);}
.ci-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.ci-row-3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px;}
.ci-err{color:#c0392b; font:500 12px var(--ci-font); margin-top:4px; display:none;}
.ci-field.invalid input,.ci-field.invalid select{border-color:#c0392b;}
.ci-field.invalid .ci-err{display:block;}

/* payment methods */
.ci-pay{border:1px solid var(--ci-line); border-radius:8px; overflow:hidden; margin-bottom:24px;}
.ci-pay__opt{display:flex; align-items:center; gap:12px; padding:16px 16px; border-bottom:1px solid var(--ci-line); cursor:pointer;}
.ci-pay__opt:last-child{border-bottom:0;}
.ci-pay__opt input{accent-color:var(--ci-accent); width:18px; height:18px;}
.ci-pay__opt.disabled{cursor:not-allowed; color:var(--ci-muted); background:#fafafa;}
.ci-pay__name{font:600 14px var(--ci-font); display:flex; align-items:center; gap:8px;}
.ci-pay__tag{font:600 11px var(--ci-font); color:#fff; background:var(--ci-green); padding:2px 8px; border-radius:999px;}
.ci-pay__sub{font:400 12px var(--ci-muted); margin-top:2px;}
.ci-pay__body{padding:0 16px 16px; display:none;}
.ci-pay__opt.active + .ci-pay__body{display:block;}
.ci-badge-soon{font:600 11px var(--ci-font); color:#9a6a00; background:#fdf3d6; padding:2px 8px; border-radius:999px;}

/* order summary */
.ci-sum-line{display:flex; gap:14px; align-items:center; padding:14px 0; border-bottom:1px solid var(--ci-line);}
.ci-sum-thumb{position:relative; flex:none;}
.ci-sum-thumb img{width:62px; height:62px; object-fit:cover; border-radius:10px; background:#f3f3f3; border:1px solid var(--ci-line);}
.ci-sum-qty{position:absolute; top:-8px; right:-8px; min-width:21px; height:21px; padding:0 5px;
  background:#5b5b5b; color:#fff; border-radius:999px; font:600 11px/21px var(--ci-font); text-align:center; box-shadow:0 0 0 2px #f6f6f7;}
.ci-sum-line .t{flex:1; font:500 13px/1.35 var(--ci-font);}
.ci-sum-line .v{font:400 12px var(--ci-muted); margin-top:3px;}
.ci-sum-line .p{font:600 13px var(--ci-font); white-space:nowrap;}
.ci-sum-tot{margin-top:18px;}
.ci-sum-tot .r{display:flex; justify-content:space-between; align-items:baseline; padding:6px 0; font:400 14px var(--ci-font); color:var(--ci-muted);}
.ci-sum-tot .r.total{font:700 22px var(--ci-font); color:var(--ci-ink); border-top:1px solid var(--ci-line); padding-top:14px; margin-top:6px;}
.ci-cur{font:600 11px var(--ci-font); color:var(--ci-muted); vertical-align:2px; margin-right:3px; text-transform:uppercase; letter-spacing:.04em;}
.ci-pixoff{background:#eafaf0; border:1px solid #bfe8cf; border-radius:8px; padding:12px 14px; font:500 13px var(--ci-font); color:#176b3a; margin-top:14px;}

/* collapsible order-summary bar (Shopify style) */
.ci-osum__bar{width:100%; display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:16px 22px; background:transparent; border:0; cursor:pointer; font-family:var(--ci-font); color:var(--ci-ink);}
.ci-osum__label{display:inline-flex; align-items:center; gap:8px; font:600 15px var(--ci-font);}
.ci-osum__chev{transition:transform .2s ease;}
.ci-osum.open .ci-osum__chev{transform:rotate(180deg);}
.ci-osum__total{font:700 17px var(--ci-font); color:var(--ci-ink);}
.ci-osum__panel{display:none; padding:0 22px 20px;}
.ci-osum.open .ci-osum__panel{display:block;}
@media(min-width:881px){
  .ci-osum__bar{cursor:default; padding:40px 40px 6px;}
  .ci-osum__chev,.ci-osum__total{display:none;}
  .ci-osum__panel{display:block !important; padding:4px 40px 40px;}
}

/* discount code */
.ci-discount{display:flex; gap:8px; margin:18px 0 4px;}
.ci-discount input{flex:1; min-width:0; padding:12px 14px; border:1px solid #cfcfcf; border-radius:8px; font:400 14px var(--ci-font); background:#fff; box-sizing:border-box;}
.ci-discount input:focus{outline:none; border-color:var(--ci-accent); box-shadow:0 0 0 2px rgba(129,15,15,.12);}
.ci-discount button{flex:none; padding:0 20px; border:1px solid #cfcfcf; background:#ececed; color:var(--ci-ink); border-radius:8px; cursor:pointer; font:600 13px var(--ci-font);}
.ci-discount button:hover{background:#e2e2e3;}
.ci-disc-msg{display:none; font:500 12px var(--ci-font); margin:2px 0 6px;}
.ci-disc-msg.ok{color:#176b3a;} .ci-disc-msg.err{color:#c0392b;}

/* trust badge + section header extras */
.ci-trust{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0 0 22px; font:500 13px var(--ci-font); color:var(--ci-muted);}
.ci-trust b{color:var(--ci-ink);}
.ci-stars{color:#e8a400; letter-spacing:2px; font-size:15px;}
.ci-h2row{display:flex; align-items:baseline; justify-content:space-between; gap:12px;}
.ci-login{font:500 13px var(--ci-font); color:var(--ci-accent); text-decoration:none; white-space:nowrap;}
.ci-login:hover{text-decoration:underline;}
.ci-btn--pay{margin-top:10px; padding:17px 18px; font-size:15px; border-radius:10px; text-transform:none; letter-spacing:.01em;}
.ci-secure-note{text-align:center; font:500 12px var(--ci-font); color:var(--ci-muted); margin:12px 0 0;}
.ci-deliver-note{text-align:center; font:500 12px var(--ci-font); color:var(--ci-muted); margin:6px 0 0;}
.ci-deliver{margin:14px 0 0; padding:11px 13px; background:#f3f6fb; border:1px solid #dbe6f2; border-radius:8px;
  font:500 13px var(--ci-font); color:#2b4a6b; display:flex; align-items:center; gap:8px;}

/* iOS não dá zoom no foco quando o campo tem fonte >= 16px */
@media (max-width:768px){
  .ci-field input, .ci-field select, .ci-field textarea,
  .ci-discount input, .ci-copy input, .ci-variant select { font-size:16px; }
}

/* pix result */
.ci-pix-box{text-align:center;}
.ci-pix-box img{width:230px; height:230px; border:1px solid var(--ci-line); border-radius:8px; padding:8px; background:#fff;}
.ci-copy{display:flex; gap:8px; margin-top:14px;}
.ci-copy input{flex:1; padding:11px; border:1px solid #cfcfcf; border-radius:6px; font:400 12px monospace;}
.ci-copy button{padding:0 16px; border:0; background:var(--ci-ink); color:#fff; border-radius:6px; cursor:pointer; font:600 12px var(--ci-font);}
.ci-status{margin-top:16px; font:600 13px var(--ci-font);}
.ci-spinner{display:inline-block;width:16px;height:16px;border:2px solid #ccc;border-top-color:var(--ci-accent);border-radius:50%;animation:cispin .8s linear infinite;vertical-align:-3px;margin-right:6px;}
@keyframes cispin{to{transform:rotate(360deg)}}
.ci-back{display:inline-block; margin-top:18px; color:var(--ci-muted); font:500 13px var(--ci-font); text-decoration:none;}
.ci-back:hover{color:var(--ci-ink);}

.jm-logo-img{display:block; width:auto; height:auto; max-width:178px; max-height:72px; object-fit:contain;}
.header__heading-link .jm-logo-img,.header__logo__link .jm-logo-img{margin:0 auto;}
@media(max-width:768px){
  .jm-logo-img{max-width:142px; max-height:58px;}
  .ci-logo img{height:42px; max-width:140px;}
}

.jm-collection-hero{display:block;background:none;color:#fff;padding:0;box-sizing:border-box;overflow:hidden;}
.jm-collection-hero img{display:block;width:100%;height:auto;}