.order-field {
  display:grid;
  gap:6px
}
.order-field[hidden] {
  display:none
}
.order-field>span {
  color:rgba(17,17,17,.52);
  font-size:12px;
  letter-spacing:.08em
}
.order-required {
  display:none;
  margin-left:8px;
  padding:2px 7px;
  border:1px solid rgba(17,17,17,.12);
  border-radius:999px;
  color:rgba(17,17,17,.54);
  font-size:10px;
  font-style:normal;
  font-weight:600;
  letter-spacing:.08em;
  vertical-align:middle
}
.order-required.is-visible {
  display:inline-block
}
.order-required-name::after {
  content:"*";
  display:inline-block;
  margin-left:2px;
  color:#d64b4b;
  font-size:.9em;
  font-weight:700;
  line-height:1;
  vertical-align:super
}
.order-field input,.order-field textarea,.order-field select {
  display:block;
  width:100%;
  min-width:0;
  box-sizing:border-box;
  padding:15px 18px;
  border:1px solid rgba(17,17,17,.12);
  border-radius:18px;
  background:#fff;
  color:#111;
  font:inherit;
  -webkit-appearance:none;
  appearance:none
}
.order-field input {
  height:52px;
  min-height:52px;
  line-height:1.2
}
.order-field textarea {
  min-height:124px;
  resize:vertical;
  line-height:1.65
}
.order-field-hint {
  color:rgba(17,17,17,.5);
  font-size:12px;
  line-height:1.65
}
.order-field select {
  min-height:52px;
  padding-right:44px;
  background-color:#fff;
  background-image:linear-gradient(45deg,transparent 50%,rgba(17,17,17,.56) 50%),linear-gradient(135deg,rgba(17,17,17,.56) 50%,transparent 50%),linear-gradient(to right,transparent,transparent);
  background-position:calc(100% - 22px) 22px,calc(100% - 16px) 22px,0 0;
  background-size:6px 6px,6px 6px,100% 100%;
  background-repeat:no-repeat
}
.order-field--compact input,.order-field--compact textarea {
  padding:12px 14px;
  border-radius:16px
}
.order-summary-label {
  margin:0;
  color:rgba(17,17,17,.42);
  font-size:11px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase
}
