/* Forms, cart and checkout rules that were Automatic.css custom CSS (its tokens are defined in base.css). */
.wsf-form input[type=radio].wsf-field.wsf-color:checked + label.wsf-label > span {
  border-color: unset !important;
}
.playcase-form input[type="checkbox"]:checked {
  background-color: var(--secondary) !important;
  border: 1px solid var(--secondary) !important;
}
.playcase-form input[type="checkbox"].wsf-field:checked::after {
  border-color: black !important;
}
.playcase-cart-total input {
  background-color: black !important;
  color: white !important;
  font-size: var(--text-xxl) !important;
  font-weight: 500 !important;
  pointer-events: none;
}
.wsf-form select.wsf-field:not([multiple]):not([size]):not([data-wsf-select2]) + span.wsf-select-arrow {
  border-color: var(--secondary) transparent transparent transparent !important;
}
.product-details-and-cart select {
  background-color: black !important;
  color: white !important;
  border: 1px solid var(--secondary) !important;
  font-size: var(--text-xs) !important;
}
.product-details-and-cart select {
  font-size: var(--text-xs) !important;
}
.playcase-form .wsf-form {
  --wsf-field-label-color: var(--secondary);
}
.playcase-form .wsf-label-wrapper .wsf-label, .faceplate-form .wsf-label-wrapper .wsf-label {
  font-family: var(--text-font-family, Inter), sans-serif !important;
  font-weight: 700;
  font-size: var(--text-s) !important;
  text-transform: uppercase;
  color: var(--secondary);
}
/* Black colorway: ring so it reads against the dark background */
.playcase-form .color-radio[style*="#000000"] {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}
/* Drop the ring once selected — the green fill carries it */
.playcase-form .wsf-color:checked + .wsf-label .color-radio[style*="#000000"] {
  box-shadow: none;
}
/* Unchecked checkbox: resting, hover, focus, active */
.playcase-form .wsf-form input[type="checkbox"]:not(:checked) {
  background-color: var(--white);
  border: 1px solid transparent;
  transition: background-color 0.1s, border-color 0.1s;
}
.playcase-form .wsf-form input[type="checkbox"]:not(:checked):hover, .playcase-form .wsf-form input[type="checkbox"]:not(:checked):focus-visible, .playcase-form .wsf-form input[type="checkbox"]:not(:checked):active {
  background-color: #e6e6e6 !important;
  /* light grey, reads as "live" on white */
  border-color: var(--secondary) !important;
  /* green edge ties it to the checked state */
  box-shadow: none !important;
}
.playcase-form .wsf-label-wrapper .wsf-label, .faceplate-form .wsf-label-wrapper .wsf-label, .pc-add-to-cart .wsf-label-wrapper .wsf-label {
  font-family: var(--text-font-family, Inter), sans-serif !important;
  font-weight: 700;
  font-size: var(--text-s) !important;
  text-transform: uppercase;
  color: var(--secondary);
}
.playcase-form .color-radio[style*="#000000"], .faceplate-form .color-radio[style*="#000000"], .pc-add-to-cart .color-radio[style*="#000000"] {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}
.playcase-form .wsf-color:checked + .wsf-label .color-radio[style*="#000000"], .faceplate-form .wsf-color:checked + .wsf-label .color-radio[style*="#000000"], .pc-add-to-cart .wsf-color:checked + .wsf-label .color-radio[style*="#000000"] {
  box-shadow: none;
}
.playcase-form .wsf-form input[type="checkbox"]:not(:checked), .faceplate-form .wsf-form input[type="checkbox"]:not(:checked), .pc-add-to-cart .wsf-form input[type="checkbox"]:not(:checked) {
  background-color: var(--white);
  border: 1px solid transparent;
  transition: background-color 0.1s, border-color 0.1s;
}
.playcase-form .wsf-form input[type="checkbox"]:not(:checked):hover, .playcase-form .wsf-form input[type="checkbox"]:not(:checked):focus-visible, .playcase-form .wsf-form input[type="checkbox"]:not(:checked):active, .faceplate-form .wsf-form input[type="checkbox"]:not(:checked):hover, .faceplate-form .wsf-form input[type="checkbox"]:not(:checked):focus-visible, .faceplate-form .wsf-form input[type="checkbox"]:not(:checked):active, .pc-add-to-cart .wsf-form input[type="checkbox"]:not(:checked):hover, .pc-add-to-cart .wsf-form input[type="checkbox"]:not(:checked):focus-visible, .pc-add-to-cart .wsf-form input[type="checkbox"]:not(:checked):active {
  background-color: #e6e6e6 !important;
  border-color: var(--secondary) !important;
  box-shadow: none !important;
}
.playcase-form .wsf-color[value="#000000"] + .wsf-label > span, .faceplate-form .wsf-color[value="#000000"] + .wsf-label > span, .pc-add-to-cart .wsf-color[value="#000000"] + .wsf-label > span {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}
.playcase-form .wsf-color[value="#000000"]:checked + .wsf-label > span, .faceplate-form .wsf-color[value="#000000"]:checked + .wsf-label > span, .pc-add-to-cart .wsf-color[value="#000000"]:checked + .wsf-label > span {
  box-shadow: none;
}
.playcase-form .wsf-form [data-row-checkbox], .playcase-form .wsf-form .wsf-inline:has(> input[type="checkbox"]), .faceplate-form .wsf-form [data-row-checkbox], .faceplate-form .wsf-form .wsf-inline:has(> input[type="checkbox"]), .pc-add-to-cart .wsf-form [data-row-checkbox], .pc-add-to-cart .wsf-form .wsf-inline:has(> input[type="checkbox"]) {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  padding-block: 8px;
}
.playcase-form .wsf-form input[type="checkbox"] + .wsf-label, .faceplate-form .wsf-form input[type="checkbox"] + .wsf-label, .pc-add-to-cart .wsf-form input[type="checkbox"] + .wsf-label {
  margin-left: 35px !important;
  flex: 1 1 auto;
}
/* WS Form rules that were Advanced Scripts' SCSS (197), compiled; its rules for the old Bricks cart are left out. */
.newsletter-form .wsf-field-wrapper{margin:0 !important}
.newsletter-form .wsf-sections{gap:var(--space-xs) !important}
.playcase-form,.faceplate-form{background-color:transparent}
.playcase-form .wsf-section,.faceplate-form .wsf-section{padding-top:var(--space-s) !important;padding-bottom:var(--space-s) !important;padding-left:0 !important;padding-right:0 !important}
.playcase-form h2,.faceplate-form h2{color:var(--secondary) !important;font-family:"Oxanium", sans-serif !important;font-weight:700 !important;text-transform:uppercase !important}
.playcase-form label,.playcase-form legend,.faceplate-form label,.faceplate-form legend{color:var(--white) !important;font-family:"Inter", Arial, sans-serif !important;font-weight:800;font-size:var(--text-s) !important}
.playcase-form button,.faceplate-form button{padding:var(--space-s) !important;border:0;border-radius:var(--radius-xl) !important;background-color:var(--black) !important;color:var(--white) !important;font-family:"Inter", Arial, sans-serif !important;font-weight:700 !important;text-transform:uppercase !important}
.playcase-form .wsf-label-wrapper,.faceplate-form .wsf-label-wrapper{display:flex;align-items:center}
.playcase-form .wsf-label-wrapper label,.faceplate-form .wsf-label-wrapper label{color:var(--secondary) !important;font-family:"Oxanium", sans-serif !important;text-transform:uppercase}
.playcase-form .wsf-field-wrapper,.faceplate-form .wsf-field-wrapper{margin:0 !important}
.faceplate-form button,.playcase-form button{border:1px solid var(--secondary) !important;background-color:var(--black) !important;color:var(--white) !important;font-weight:800 !important}
.faceplate-form .wsf-section,.playcase-form .wsf-section{padding:var(--space-xs) 0}
.faceplate-form .wsf-section:nth-child(-n+3),.playcase-form .wsf-section:nth-child(-n+3){border-bottom:1px solid var(--base-trans-20)}
.faceplate-form .wsf-inline,.playcase-form .wsf-inline{margin-bottom:0 !important}
.playcase-form .wsf-section{padding-block:var(--space-m)}
.playcase-form .wsf-section:nth-child(-n+4){border-bottom:1px solid var(--base-trans-20)}
.playcase-form .wsf-inline{margin-right:15px;margin-bottom:0}
.color-options{justify-content:center;align-items:center}
.color-options div[role="radiogroup"]{display:flex !important;justify-content:center !important;align-items:center !important}
.playcase-shop-selection-wrapper legend{color:var(--secondary) !important;font-family:"Oxanium", sans-serif !important;text-transform:uppercase !important}
.addons label{width:93% !important}
.addons .wsf-tile>div>div{margin:0 !important;padding:10px 0}
.item-total{color:var(--white);font-size:30px;font-weight:600;text-align:right}
.inline-row{display:flex;width:100%;align-items:baseline}
.inline-row::before{content:"";order:1;flex:1;margin-inline:0.5em;border-bottom:2px dotted currentColor}
.inline-row .right{order:2;margin-left:auto}
table{border-collapse:separate !important}
