/* v1.1.40: clear, tappable checkboxes and radios on the light cart / checkout / account pages (Daniel's iPhone test:
   the native iOS boxes were nearly invisible on white). Drawn with appearance:none so iOS and desktop match.
   Payment fields inside Stripe/PayPal iframes are not affected. */
body.woocommerce-cart input[type=checkbox], body.woocommerce-checkout input[type=checkbox], body.woocommerce-account input[type=checkbox],
body.woocommerce-cart input[type=radio], body.woocommerce-checkout input[type=radio], body.woocommerce-account input[type=radio] {
  -webkit-appearance: none; appearance: none;
  box-sizing: border-box; flex: 0 0 auto;
  width: 20px; height: 20px; min-width: 20px; margin: 0 .6em 0 0; padding: 0;
  display: inline-block; vertical-align: -4px; position: relative; top: 0;
  background: #fff center / 14px 14px no-repeat; border: 2px solid #222; border-radius: 4px;
  cursor: pointer; opacity: 1 !important; visibility: visible !important;
  transition: background-color .12s ease, border-color .12s ease, box-shadow .12s ease;
}
body.woocommerce-cart input[type=radio], body.woocommerce-checkout input[type=radio], body.woocommerce-account input[type=radio] { border-radius: 50%; }
body.woocommerce-cart input[type=checkbox]:checked, body.woocommerce-checkout input[type=checkbox]:checked, body.woocommerce-account input[type=checkbox]:checked {
  background-color: #111; border-color: #111;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3.2L13 4.8' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
body.woocommerce-cart input[type=radio]:checked, body.woocommerce-checkout input[type=radio]:checked, body.woocommerce-account input[type=radio]:checked {
  border-color: #111; background-image: radial-gradient(circle, #111 0 4.5px, transparent 5px); background-size: 100% 100%;
}
body.woocommerce-cart input[type=checkbox]:focus-visible, body.woocommerce-checkout input[type=checkbox]:focus-visible, body.woocommerce-account input[type=checkbox]:focus-visible,
body.woocommerce-cart input[type=radio]:focus-visible, body.woocommerce-checkout input[type=radio]:focus-visible, body.woocommerce-account input[type=radio]:focus-visible {
  outline: none; box-shadow: 0 0 0 3px rgba(46,160,28,.45);
}
@media (max-width: 768px) {
  body.woocommerce-cart input[type=checkbox], body.woocommerce-checkout input[type=checkbox], body.woocommerce-account input[type=checkbox],
  body.woocommerce-cart input[type=radio], body.woocommerce-checkout input[type=radio], body.woocommerce-account input[type=radio] {
    width: 22px; height: 22px; min-width: 22px; background-size: 16px 16px;
  }
}
/* Theme pseudo-element ticks would draw over ours. */
body.woocommerce-cart input[type=checkbox]::before, body.woocommerce-cart input[type=checkbox]::after,
body.woocommerce-checkout input[type=checkbox]::before, body.woocommerce-checkout input[type=checkbox]::after,
body.woocommerce-account input[type=checkbox]::before, body.woocommerce-account input[type=checkbox]::after,
body.woocommerce-cart input[type=radio]::before, body.woocommerce-cart input[type=radio]::after,
body.woocommerce-checkout input[type=radio]::before, body.woocommerce-checkout input[type=radio]::after,
body.woocommerce-account input[type=radio]::before, body.woocommerce-account input[type=radio]::after { content: none !important; display: none !important; }

/* Checkbox rows: the box hangs left of the text (text keeps its normal spacing); the whole label is the tap target. */
.woocommerce-checkout .form-row label.checkbox, .woocommerce-checkout label.woocommerce-form__label-for-checkbox, .woocommerce-account label.woocommerce-form__label-for-checkbox {
  position: relative; display: block; padding-left: calc(20px + .65em); line-height: 1.45; cursor: pointer;
}
.woocommerce-checkout .form-row label.checkbox > input[type=checkbox], .woocommerce-checkout label.woocommerce-form__label-for-checkbox > input[type=checkbox], .woocommerce-account label.woocommerce-form__label-for-checkbox > input[type=checkbox] {
  position: absolute; left: 0; top: .1em; margin: 0;
}
@media (max-width: 768px) {
  .woocommerce-checkout .form-row label.checkbox, .woocommerce-checkout label.woocommerce-form__label-for-checkbox, .woocommerce-account label.woocommerce-form__label-for-checkbox { padding-left: calc(22px + .65em); }
}
.woocommerce-checkout .ut-atelier-check { padding: .45rem .55rem; margin: 0 -.55rem .35rem; border-radius: 6px; border: 2px solid transparent; }

/* Missing required box: red outline on the row, red box, short message under it. */
.woocommerce-checkout .ut-missing { border-color: #d0021b !important; background: rgba(208,2,27,.06); }
.woocommerce-checkout .ut-missing input[type=checkbox], .woocommerce-checkout .ut-missing input[type=radio] { border-color: #d0021b !important; box-shadow: 0 0 0 3px rgba(208,2,27,.22); }
.woocommerce-checkout .ut-missing label, .woocommerce-checkout .ut-missing label a { color: #b00018 !important; }
.ut-missing-msg { display: block; margin: .35rem 0 0 calc(20px + .65em); font-size: .88em; font-weight: 600; color: #b00018; }
@keyframes ut-nudge { 0%,100% { transform: none; } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
.woocommerce-checkout .ut-missing.ut-nudge { animation: ut-nudge .35s ease 2; }
@media (prefers-reduced-motion: reduce) { .woocommerce-checkout .ut-missing.ut-nudge { animation: none; } }

/* v1.1.41: payment method boxes (Stripe saved cards / new card, PayPal) light like the page, so their text is readable.
   Stripe's card form takes its colours from this box. */
body.woocommerce-checkout #payment div.payment_box, body.woocommerce-account #payment div.payment_box {
  background: #f6f6f6 !important; color: #222 !important; border: 1px solid #d4d4d4; border-radius: 6px;
}
body.woocommerce-checkout #payment div.payment_box::before, body.woocommerce-account #payment div.payment_box::before { border-bottom-color: #f6f6f6 !important; }
body.woocommerce-checkout #payment div.payment_box :is(p, span, label, li, legend, small, strong, div, fieldset), body.woocommerce-account #payment div.payment_box :is(p, span, label, li, legend, small, strong, div, fieldset) { color: #222 !important; }
body.woocommerce-checkout #payment div.payment_box a, body.woocommerce-account #payment div.payment_box a { color: #136c2e !important; text-decoration: underline; }

/* v1.1.61: Kalium white-on-#74d6f6 info notices — readable on light account pages.
   v1.1.63: cart excluded. v1.1.64: dark checkout/order pages use checkout-shell.css notices instead;
   these pale rules still apply on account; shell beats them on checkout via higher specificity. */
body.woocommerce-checkout .woocommerce-info,
body.woocommerce-account .woocommerce-info,
body.woocommerce-order-received .woocommerce-info,
body.woocommerce-order-pay .woocommerce-info,
body.woocommerce-checkout .woocommerce-Message--info,
body.woocommerce-account .woocommerce-Message--info,
body.woocommerce-order-received .woocommerce-Message--info,
body.woocommerce-order-pay .woocommerce-Message--info {
  background: #e7f1f6 !important;
  color: #1a1a1a !important;
  border-top: 3px solid #2a6f8f !important;
  font-weight: 500;
}
body.woocommerce-checkout .woocommerce-info a,
body.woocommerce-account .woocommerce-info a,
body.woocommerce-order-received .woocommerce-info a,
body.woocommerce-order-pay .woocommerce-info a,
body.woocommerce-checkout .woocommerce-Message--info a,
body.woocommerce-account .woocommerce-Message--info a,
body.woocommerce-order-received .woocommerce-Message--info a,
body.woocommerce-order-pay .woocommerce-Message--info a {
  color: #136c2e !important;
}
body.woocommerce-checkout .woocommerce-info :is(li, p, span, strong),
body.woocommerce-account .woocommerce-info :is(li, p, span, strong),
body.woocommerce-order-received .woocommerce-info :is(li, p, span, strong),
body.woocommerce-order-pay .woocommerce-info :is(li, p, span, strong) {
  color: #1a1a1a !important;
}
body.woocommerce-checkout .woocommerce-info a:after,
body.woocommerce-account .woocommerce-info a:after,
body.woocommerce-order-received .woocommerce-info a:after,
body.woocommerce-order-pay .woocommerce-info a:after {
  background-color: #136c2e !important;
}


/* v1.1.64: dark checkout checkboxes — white face, light border, visible on #101014 panels */
body.woocommerce-checkout.ut-chrome input[type=checkbox],
body.woocommerce-checkout.ut-chrome input[type=radio],
body.woocommerce-order-pay.ut-chrome input[type=checkbox],
body.woocommerce-order-pay.ut-chrome input[type=radio] {
  background-color: #fff !important;
  border-color: #f2efe8 !important;
}
body.woocommerce-checkout.ut-chrome input[type=checkbox]:checked,
body.woocommerce-checkout.ut-chrome input[type=radio]:checked {
  background-color: #111 !important;
  border-color: #2ee21c !important;
}