form.solo-search-block-form {
  position: relative;
}

.solo-search-block-form input {
  width: 100%;
}

/* Default layout: two columns side-by-side */
.solo-search-block-form {
  display: grid;
  grid-template-columns: minmax(12.5rem, auto) minmax(4rem, 7rem);
  grid-template-areas: "form-item form-actions";
}

/* Regions (no change here) */
.solo-search-block-form .form-item {
  grid-area: form-item;
}

.solo-search-block-form .form-actions {
  grid-area: form-actions;
}

/* 260px – stack on two rows */
.region-inner.region-max-260.region-xxs .solo-search-block-form {
  grid-template-columns: 1fr;
  grid-auto-flow: row;
  grid-template-areas:
    "form-item"
    "form-actions";
}

/* 320px – 2 columns again */
.region-inner.region-max-320.region-xs .solo-search-block-form {
  grid-template-columns: minmax(70%, auto) minmax(22%, 30%);
  grid-template-areas: "form-item form-actions";
}

.solo-search-block-form>* {
  width: 100%;
}

.solo-search-block-form .form-type-search input {
  background-color: transparent;
  padding-inline-start: var(--solo-px34);
}

.solo-search-block-form .form-item,
.solo-search-block-form .form-actions {
  margin-block: var(--solo-px6) !important;
  margin-inline: auto !important;
  display: inline-block;
}

input.search-button-block {
  margin: 0 !important;
  padding-inline-start: var(--solo-px3) !important;
  padding-inline-end: var(--solo-px3) !important;
}

.solo-search-block-form .form-type-search::before {
  position: absolute;
  opacity: 0.5;
  inset-block-start: 20px;
  inset-inline-start: 6px; /* This will be updated for RTL */
  display: inline-block;
  width: 24px;
  height: 24px;
  content: "";
  font-size: 16px;
  line-height: 16px;
  background-color: var(--r-tx);
  background-repeat: no-repeat;
  background-size: 24px 24px;
  -webkit-mask: var(--solo-search-icon);
  mask: var(--solo-search-icon);
}