.rmkn {
  padding-block: var(--spacing-10) var(--spacing-16);
}

.rmkn__kopf {
  max-width: 44rem;
  margin-block-end: var(--spacing-8);
}

.rmkn__auge {
  margin: 0 0 var(--spacing-2);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgb(var(--text-color) / 0.55);
}

.rmkn__kopf .h1 {
  margin: 0;
}

.rmkn__text {
  margin: var(--spacing-3) 0 0;
  font-size: var(--text-base);
  color: rgb(var(--text-color) / 0.75);
}

.rmkn__text a {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.rmkn__klein {
  margin: 0;
  font-size: var(--text-sm);
  line-height: 1.6;
  color: rgb(var(--text-color) / 0.7);
}

.rmkn__vorsatz {
  margin-block-end: var(--spacing-5);
}

.rmkn__karte {
  padding: var(--spacing-6) var(--spacing-5);
  border: 1px solid rgb(133 141 103 / 0.35);
  border-radius: 16px;
  background: rgb(255 255 255 / 0.5);
}

.rmkn__karte + .rmkn__karte {
  margin-block-start: var(--spacing-5);
}

.rmkn__karte--weich {
  background: rgb(133 141 103 / 0.1);
  border-color: rgb(133 141 103 / 0.2);
}

.rmkn__h {
  margin: 0 0 var(--spacing-5);
}

.rmkn__karte--weich .rmkn__h {
  margin-block-end: var(--spacing-3);
}

@media screen and (min-width: 700px) {
  .rmkn__karte {
    padding: var(--spacing-8) var(--spacing-7);
  }
}

.rmkn__gast {
  display: grid;
  gap: var(--spacing-5);
  align-items: stretch;
}

.rmkn__karte--weich {
  display: flex;
  flex-direction: column;
}

.rmkn__karte--weich > .button {
  margin-block-start: auto;
}

@media screen and (min-width: 860px) {
  .rmkn__gast {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--spacing-6);
  }

  .rmkn__gast--eins {
    grid-template-columns: minmax(0, 32rem);
  }
}

.rmkn__gast .rmkn__karte + .rmkn__karte {
  margin-block-start: 0;
}

.rmkn__punkte {
  display: grid;
  gap: var(--spacing-3);
  margin: var(--spacing-5) 0 var(--spacing-7);
  padding: 0;
  list-style: none;
}

.rmkn__punkt {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-2-5);
  font-size: var(--text-sm);
  line-height: 1.5;
}

.rmkn__haken {
  display: inline-flex;
  flex: none;
  margin-block-start: 1px;
  color: rgb(var(--accent));
}

.rmkn__haken svg {
  display: block;
}

.rmkn__formular {
  display: grid;
  gap: var(--spacing-5);
}

.rmkn__feld {
  display: grid;
  gap: var(--spacing-2);
  margin: 0;
}

.rmkn__feld > label,
.rmkn__felder label,
.rmkn__formular .form-row > label {
  font-size: var(--text-sm);
  font-weight: 600;
  color: rgb(var(--text-color) / 0.8);
}

.rmkn__feld .required {
  display: none;
}

.rmkn__hint {
  margin-block-start: calc(var(--spacing-1) * -1);
  font-size: var(--text-xs);
  line-height: 1.4;
  color: rgb(var(--text-color) / 0.6);
}

.rmkn__paar {
  display: grid;
  gap: var(--spacing-4);
}

@media screen and (min-width: 620px) {
  .rmkn__paar {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}

.rmkn__satz {
  display: grid;
  gap: var(--spacing-4);
  margin: 0;
  padding: 0;
  border: 0;
}

.rmkn__pw {
  position: relative;
  display: block;
}

.rmkn__pw input {
  padding-inline-end: var(--spacing-11);
}

.rmkn__sicht {
  position: absolute;
  inset-inline-end: var(--spacing-1);
  top: 50%;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  width: var(--spacing-9);
  height: var(--spacing-9);
  border-radius: var(--rounded-full);
  color: rgb(var(--text-color) / 0.55);
}

.rmkn__sicht:hover {
  color: rgb(var(--text-color));
}

.rmkn__sicht svg {
  display: block;
}

.rmkn__sicht .rmkn__sicht-aus,
.rmkn__sicht[aria-pressed="true"] .rmkn__sicht-an {
  display: none;
}

.rmkn__sicht[aria-pressed="true"] .rmkn__sicht-aus {
  display: block;
}

.rmkn__zeile {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-3);
}

.rmkn__merken {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-2);
  margin: 0;
  font-size: var(--text-sm);
  color: rgb(var(--text-color) / 0.8);
  cursor: pointer;
}

.rmkn__merken input {
  width: 1.05rem;
  height: 1.05rem;
  accent-color: rgb(var(--button-background-primary));
}

.rmkn__vergessen {
  font-size: var(--text-sm);
  color: rgb(var(--text-color) / 0.7);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.rmkn__vergessen:hover {
  color: rgb(var(--text-color));
}

.rmkn__knopf {
  justify-self: stretch;
  width: 100%;
}

.rmkn__knoepfe {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--spacing-4);
  margin-block-start: var(--spacing-6);
}

.rmkn__zurueck {
  font-size: var(--text-sm);
  color: rgb(var(--text-color) / 0.7);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.rmkn__vertrauen {
  margin-block-start: var(--spacing-8);
}

.rmkn__raster {
  display: grid;
  gap: var(--spacing-6);
  align-items: start;
}

@media screen and (min-width: 900px) {
  .rmkn__raster {
    grid-template-columns: 15rem minmax(0, 1fr);
    gap: var(--spacing-10);
  }
}

.rmkn__nav {
  min-width: 0;
}

.rmkn__navliste {
  display: flex;
  gap: var(--spacing-2);
  margin: 0;
  padding: 0 0 var(--spacing-1);
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
}

.rmkn__navliste::-webkit-scrollbar {
  display: none;
}

.rmkn__navpunkt {
  flex: none;
}

.rmkn__navlink {
  display: flex;
  align-items: center;
  gap: var(--spacing-2-5);
  padding: var(--spacing-2-5) var(--spacing-4);
  border-radius: var(--rounded-full);
  font-size: var(--text-sm);
  font-weight: 600;
  white-space: nowrap;
  color: rgb(var(--text-color) / 0.75);
  transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
}

.rmkn__navlink:hover {
  background: rgb(133 141 103 / 0.12);
  color: rgb(var(--text-color));
}

.rmkn__navicon {
  display: inline-flex;
  flex: none;
  opacity: 0.6;
}

.rmkn__navicon svg {
  display: block;
}

.rmkn__navpunkt.is-active > .rmkn__navlink {
  background: rgb(var(--button-background-primary));
  color: rgb(var(--button-text-primary));
}

.rmkn__navpunkt.is-active .rmkn__navicon {
  opacity: 1;
}

@media screen and (min-width: 900px) {
  .rmkn__navliste {
    flex-direction: column;
    gap: var(--spacing-1);
    overflow: visible;
  }

  .rmkn__navpunkt--aus {
    margin-block-start: var(--spacing-3);
    padding-block-start: var(--spacing-3);
    border-block-start: 1px solid rgb(133 141 103 / 0.25);
  }
}

.rmkn__inhalt {
  min-width: 0;
}

.rmkn__kacheln {
  display: grid;
  gap: var(--spacing-4);
}

@media screen and (min-width: 700px) {
  .rmkn__kacheln {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.rmkn__kachel {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  padding: var(--spacing-5);
  border: 1px solid rgb(133 141 103 / 0.3);
  border-radius: 16px;
  background: rgb(255 255 255 / 0.5);
}

.rmkn__kachel-kopf {
  display: flex;
  align-items: center;
  gap: var(--spacing-2-5);
  margin-block-end: var(--spacing-1);
}

.rmkn__kachel-icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 34px;
  height: 34px;
  border-radius: var(--rounded-full);
  background: rgb(133 141 103 / 0.14);
  color: rgb(var(--text-color) / 0.8);
}

.rmkn__kachel-icon svg {
  display: block;
}

.rmkn__kachel-titel {
  margin: 0;
  font-family: var(--text-font-family);
  font-size: var(--text-sm);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgb(var(--text-color) / 0.6);
}

.rmkn__kachel-wert {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--spacing-2);
  margin: 0;
  font-size: var(--text-lg);
  font-weight: 700;
}

.rmkn__kachel-wert--klein {
  font-size: var(--text-base);
}

.rmkn__kachel-zeile {
  margin: 0;
  font-size: var(--text-sm);
  line-height: 1.5;
  color: rgb(var(--text-color) / 0.7);
}

.rmkn__adresse {
  margin: 0;
  font-size: var(--text-sm);
  font-style: normal;
  line-height: 1.6;
  color: rgb(var(--text-color) / 0.85);
}

.rmkn__kachel-link {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-2);
  margin-block-start: auto;
  padding-block-start: var(--spacing-3);
  font-size: var(--text-sm);
  font-weight: 600;
}

.rmkn__kachel-link span {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.rmkn__kachel-link svg {
  display: block;
  opacity: 0.6;
}

.rmkn__kachel-link:hover svg {
  opacity: 1;
}

.rmkn__status {
  display: inline-flex;
  align-items: center;
  flex: none;
  padding: 4px 11px;
  border-radius: var(--rounded-full);
  background: rgb(133 141 103 / 0.16);
  color: rgb(var(--text-color) / 0.85);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.4;
  text-transform: none;
  white-space: nowrap;
}

.rmkn__status--completed,
.rmkn__status--processing {
  background: rgb(var(--success-background));
  color: rgb(28 90 52);
}

.rmkn__status--on-hold,
.rmkn__status--pending {
  background: rgb(var(--warning-background));
  color: rgb(140 90 10);
}

.rmkn__status--cancelled,
.rmkn__status--failed,
.rmkn__status--refunded {
  background: rgb(var(--error-background));
  color: rgb(150 32 32);
}

.rmkn__hilfe {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--spacing-4);
  margin-block-start: var(--spacing-5);
  padding: var(--spacing-5);
  border-radius: 16px;
  background: rgb(133 141 103 / 0.1);
}

.rmkn__hilfe-icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 42px;
  height: 42px;
  border-radius: var(--rounded-full);
  background: rgb(255 255 255 / 0.65);
  color: rgb(var(--text-color) / 0.8);
}

.rmkn__hilfe-icon svg {
  display: block;
}

.rmkn__hilfe-text {
  flex: 1 1 14rem;
  min-width: 0;
}

.rmkn__hilfe-titel {
  margin: 0 0 2px;
  font-size: var(--text-base);
  font-weight: 700;
}

.rmkn__hilfe-knopf {
  flex: none;
}

.rmkn__besten {
  display: grid;
  gap: var(--spacing-4);
}

.rmkn__best {
  display: grid;
  gap: var(--spacing-4);
  padding: var(--spacing-5);
  border: 1px solid rgb(133 141 103 / 0.3);
  border-radius: 16px;
  background: rgb(255 255 255 / 0.5);
}

.rmkn__best-kopf {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--spacing-3);
}

.rmkn__best-nr {
  margin: 0;
  font-size: var(--text-base);
  font-weight: 700;
}

.rmkn__best-datum {
  margin: 2px 0 0;
  font-size: var(--text-sm);
  color: rgb(var(--text-color) / 0.65);
}

.rmkn__best-ware {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--spacing-2);
}

.rmkn__best-bild {
  display: block;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  overflow: hidden;
  background: rgb(133 141 103 / 0.1);
}

.rmkn__best-bild img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rmkn__best-mehr {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: rgb(133 141 103 / 0.14);
  font-size: var(--text-sm);
  font-weight: 700;
  color: rgb(var(--text-color) / 0.75);
}

.rmkn__best-fuss {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-3);
  padding-block-start: var(--spacing-4);
  border-block-start: 1px solid rgb(133 141 103 / 0.22);
}

.rmkn__best-summe {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--spacing-2);
  margin: 0;
  font-size: var(--text-base);
  font-weight: 700;
}

.rmkn__best-zahl {
  font-size: var(--text-sm);
  font-weight: 400;
  color: rgb(var(--text-color) / 0.6);
}

.rmkn__best-knoepfe {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-2);
}

.rmkn__bkopf {
  margin-block-end: var(--spacing-4);
}

.rmkn__blaettern {
  display: flex;
  justify-content: space-between;
  gap: var(--spacing-3);
  margin-block-start: var(--spacing-6);
}

.rmkn__leer {
  display: grid;
  justify-items: center;
  gap: var(--spacing-2);
  padding: var(--spacing-12) var(--spacing-6);
  border: 1px solid rgb(133 141 103 / 0.3);
  border-radius: 16px;
  background: rgb(255 255 255 / 0.5);
  text-align: center;
}

.rmkn__leer-icon {
  display: grid;
  place-items: center;
  width: 60px;
  height: 60px;
  margin-block-end: var(--spacing-2);
  border-radius: var(--rounded-full);
  background: rgb(133 141 103 / 0.14);
  color: rgb(var(--text-color) / 0.7);
}

.rmkn__leer-titel {
  margin: 0;
  font-size: var(--text-lg);
  font-weight: 700;
}

.rmkn__leer .rmkn__klein {
  max-width: 28rem;
}

.rmkn__leer .button {
  margin-block-start: var(--spacing-4);
}

.rmkn__adressen {
  display: grid;
  gap: var(--spacing-4);
}

@media screen and (min-width: 700px) {
  .rmkn__adressen {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.rmkn__felder {
  display: grid;
  gap: var(--spacing-4);
}

@media screen and (min-width: 620px) {
  .rmkn__felder {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .rmkn__felder .form-row-wide,
  .rmkn__felder .form-row-full {
    grid-column: 1 / -1;
  }
}

.rmkn__felder .form-row {
  display: grid;
  gap: var(--spacing-2);
  margin: 0;
  min-width: 0;
}

.rmkn__felder .required,
.rmkn__felder .optional {
  display: none;
}

.rmkn__notizen {
  display: grid;
  gap: var(--spacing-4);
  margin: 0;
  padding: 0;
  list-style: none;
}

.rmkn__notiz {
  padding-inline-start: var(--spacing-4);
  border-inline-start: 2px solid rgb(133 141 103 / 0.3);
}

.rmkn__notiz-datum {
  margin: 0 0 2px;
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgb(var(--text-color) / 0.55);
}

.rmkn__notiz-text p {
  margin: 0;
  font-size: var(--text-sm);
  line-height: 1.6;
}

.rmkn .woocommerce-notices-wrapper:empty {
  display: none;
}

.rmkn .woocommerce-message,
.rmkn .woocommerce-error,
.rmkn .woocommerce-info,
.rmkn .woocommerce-notice {
  display: grid;
  gap: var(--spacing-2);
  margin: 0 0 var(--spacing-5);
  padding: var(--spacing-4) var(--spacing-5);
  border-radius: 14px;
  background: rgb(133 141 103 / 0.12);
  font-size: var(--text-sm);
  line-height: 1.6;
  list-style: none;
}

.rmkn .woocommerce-message {
  background: rgb(var(--success-background));
  color: rgb(28 90 52);
}

.rmkn .woocommerce-error {
  background: rgb(var(--error-background));
  color: rgb(150 32 32);
}

.rmkn .woocommerce-info,
.rmkn .woocommerce-message {
  display: flex;
  flex-direction: row-reverse;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--spacing-3) var(--spacing-5);
}

.rmkn .woocommerce-info .button,
.rmkn .woocommerce-message .button {
  flex: none;
}

.rmkn .woocommerce-message li,
.rmkn .woocommerce-error li,
.rmkn .woocommerce-info li {
  margin: 0;
}

.rmkn .woocommerce-message a,
.rmkn .woocommerce-error a,
.rmkn .woocommerce-info a {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.rmkn .woocommerce-table--order-details,
.rmkn .woocommerce-table--order-downloads,
.rmkn table.shop_table {
  width: 100%;
  margin-block-start: var(--spacing-4);
  border-collapse: collapse;
  font-size: var(--text-sm);
}

.rmkn table.shop_table th,
.rmkn table.shop_table td {
  padding: var(--spacing-3) 0;
  border-block-end: 1px solid rgb(133 141 103 / 0.22);
  text-align: start;
  vertical-align: top;
}

.rmkn table.shop_table th {
  font-weight: 700;
}

.rmkn table.shop_table tfoot th,
.rmkn table.shop_table tfoot td {
  text-align: start;
}

.rmkn table.shop_table .woocommerce-table__product-name a {
  font-weight: 600;
}

.rmkn .woocommerce-column__title,
.rmkn .woocommerce-customer-details h2,
.rmkn .woocommerce-order-details__title {
  margin: var(--spacing-8) 0 var(--spacing-3);
  font-size: var(--text-h4);
}

.rmkn .woocommerce-columns--addresses {
  display: grid;
  gap: var(--spacing-5);
}

@media screen and (min-width: 700px) {
  .rmkn .woocommerce-columns--addresses {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.rmkn .woocommerce-columns--addresses address {
  font-style: normal;
  font-size: var(--text-sm);
  line-height: 1.6;
}

.rmkn .select2-container .select2-selection--single {
  height: var(--input-height);
  border: 1px solid rgb(var(--text-color) / 0.18);
  border-radius: var(--rounded-input);
  background: rgb(255 255 255 / 0.6);
}

.rmkn .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: var(--input-height);
  padding-inline-start: var(--input-padding-inline);
  color: inherit;
}

.rmkn .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: var(--input-height);
}
