.choice-help {
  color: var(--muted);
  margin-top: -.5rem;
}

.choice-group {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 1rem;
  display: grid;
  gap: .55rem;
}

.choice-group legend {
  padding: 0 .4rem;
  font-weight: 800;
}

.choice-group legend span {
  color: var(--accent);
  font-size: .85rem;
}

.choice-card {
  display: flex !important;
  grid-template-columns: auto 1fr !important;
  align-items: center;
  gap: .7rem !important;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: .7rem .8rem;
  cursor: pointer;
  background: #fff;
}

.choice-card:has(input:checked) {
  border-color: var(--accent);
  background: #eaf6f2;
  box-shadow: inset 0 0 0 1px var(--accent);
}

.choice-card input {
  width: auto;
  margin: 0;
}

.choice-card span {
  font-weight: 700;
}

.selection-manager {
  align-content: start;
}

.selection-block {
  display: grid;
  gap: .45rem;
}

.selection-block + .selection-block {
  margin-top: .6rem;
  padding-top: .8rem;
  border-top: 1px dashed var(--line);
}

.selection-block h3 {
  margin: 0;
  font-size: .9rem;
  color: var(--ink);
}

.selection-block.available h3 {
  color: var(--muted);
}

.selection-list {
  display: grid;
  gap: .45rem;
}

.selection-card {
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  align-items: center;
  gap: .65rem !important;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: .65rem .75rem;
  cursor: pointer;
  background: #fff;
}

.selection-card:has(input:checked) {
  border-color: var(--accent);
  background: #eaf6f2;
}

.selection-card input {
  width: auto;
  margin: 0;
}

.selection-name {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  font-weight: 700;
}

.selection-name small {
  color: #956b00;
  font-size: .72rem;
}

.selection-action {
  min-width: 3.5rem;
  border-radius: 99px;
  padding: .25rem .55rem;
  background: var(--accent);
  color: #fff;
  text-align: center;
  font-size: .82rem;
  font-weight: 800;
}

.selection-card:has(input:checked) .selection-action {
  background: #fff;
  color: var(--danger);
  border: 1px solid #e7bcbc;
}

.selection-card.archived-selection,
.selection-card.archived-selection:has(input:checked) {
  border-color: #cbd1d5;
  background: #f3f4f5;
  color: #59636b;
}

.selection-card.archived-selection .selection-name small {
  color: #69747c;
}

.selection-empty {
  margin: 0;
  padding: .5rem;
  color: var(--muted);
  font-size: .85rem;
}

.favorite-manage-list form {
  grid-template-columns: 1fr 1fr auto auto auto;
}

.favorite-button.active {
  border-color: #d4a62d;
  background: #fffae8;
  color: #795900;
}

.guest-block {
  margin-top: .7rem;
  padding-top: .9rem;
  border-top: 1px dashed var(--line);
}

.guest-add {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: .45rem;
}

.guest-add label {
  display: grid;
  gap: .25rem;
  font-weight: 700;
}

.guest-add-with-member {
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: stretch;
}

.guest-add-with-member [data-add-guest] {
  align-self: end;
  justify-self: end;
  white-space: nowrap;
}

.guest-member-error {
  position: relative;
  grid-column: 1;
  justify-self: end;
  max-width: 22rem;
  margin: .35rem 0 0;
  padding: .65rem .8rem;
  border: 1px solid #e7bcbc;
  border-radius: 12px;
  background: #fff0f0;
  color: #7c2929;
  font-size: .88rem;
  font-weight: 700;
}

.guest-member-error::before {
  content: "";
  position: absolute;
  top: -.45rem;
  right: 1.2rem;
  width: .75rem;
  height: .75rem;
  border-top: 1px solid #e7bcbc;
  border-left: 1px solid #e7bcbc;
  background: #fff0f0;
  transform: rotate(45deg);
}

.guest-member-error[hidden] {
  display: none;
}

.guest-card {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: .5rem;
  border: 1px solid var(--accent);
  border-radius: 10px;
  padding: .55rem .7rem;
  background: #eaf6f2;
}

.guest-card button {
  padding: .3rem .55rem;
  color: var(--danger);
}

.guest-entry-copy {
  display: grid;
  gap: .1rem;
}

.guest-entry-copy small {
  color: var(--muted);
}

@media (max-width: 760px) {
  .guest-add:not(.guest-add-with-member) {
    grid-template-columns: 1fr;
  }

  .guest-add:not(.guest-add-with-member) button {
    width: 100%;
  }
}

.location-choice {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 1rem;
}

.location-choice legend {
  padding: 0 .4rem;
  font-weight: 800;
}

.location-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .55rem;
}

.location-options label {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: .55rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: .7rem;
  cursor: pointer;
}

.location-options label:has(input:checked) {
  border-color: var(--accent);
  background: #eaf6f2;
}

.location-options label.disabled {
  opacity: .5;
  cursor: not-allowed;
}

.location-options input {
  width: auto;
  margin-top: .35rem;
}

.location-options span {
  display: grid;
  font-weight: 800;
}

.location-options small {
  color: var(--muted);
  font-weight: 500;
}

.manual-location {
  margin-top: .75rem;
}

@media (max-width: 760px) {
  .location-options {
    grid-template-columns: 1fr 1fr;
  }
}

.fallback-setting {
  margin: 1rem 0 1.4rem;
}

.fallback-setting fieldset {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: .55rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 1rem;
}

.fallback-setting legend {
  padding: 0 .4rem;
  font-weight: 800;
}

.fallback-setting legend small {
  color: var(--muted);
  font-weight: 500;
}

.fallback-setting label {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .5rem;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: .65rem;
  cursor: pointer;
}

.fallback-setting label:has(input:checked) {
  border-color: var(--accent);
  background: #eaf6f2;
}

.fallback-setting label.disabled {
  opacity: .5;
  cursor: not-allowed;
}

.fallback-setting input {
  width: auto;
  margin-top: .35rem;
}

.fallback-setting span {
  display: grid;
  font-weight: 800;
}

.fallback-setting small {
  color: var(--muted);
  font-weight: 500;
}

@media (max-width: 900px) {
  .fallback-setting fieldset {
    grid-template-columns: 1fr;
  }
}