/* Native contact: scoped geometry and palette roles, independent from form builders. */
html body #tm-content .rhc.rhc--contact {
  max-width: none;
  padding-bottom: 0;
}

.rhc-contact-form,
.rhc-contact-form__summary,
.rhc-contact-form__success {
  max-width: none;
  width: 100%;
}

.rhc--contact > .rhc-contact {
  border: 0;
  margin-top: 1.5rem;
  margin-bottom: 0;
  padding: 0;
}

/* The anchor moves keyboard navigation into the form; controls and feedback retain their own focus rings. */
.rhc.rhc--contact > .rhc-contact:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

/* Keep practical guidance alongside the form only when both columns have room. */
.rhc-contact-layout {
  align-items: start;
  display: grid;
  gap: clamp(1.5rem, 2.5vw, 2.5rem);
  grid-template-columns: minmax(0, 1fr);
}

.rhc-contact-layout__main { min-width: 0; }

.rhc-contact-guidance {
  border-inline-start: 2px solid var(--riko-action-line);
  color: var(--riko-text);
  min-width: 0;
  padding: .25rem 0 .25rem 1.5rem;
}

#tm-content .rhc .rhc-contact-guidance h2 {
  color: var(--riko-ink);
  font-size: 1.3rem;
  line-height: 1.35;
  margin: 0 0 .65rem;
}

.rhc-contact-guidance__intro {
  color: var(--riko-muted);
  line-height: 1.6;
  margin: 0 0 1.5rem;
}

.rhc-contact-guidance__topic + .rhc-contact-guidance__topic {
  border-top: 1px solid var(--riko-line);
  margin-top: 1.25rem;
  padding-top: 1.25rem;
}

#tm-content .rhc .rhc-contact-guidance h3 {
  color: var(--riko-ink);
  font-size: 1rem;
  line-height: 1.4;
  margin: 0 0 .4rem;
}

.rhc-contact-guidance__topic p {
  line-height: 1.65;
  margin: 0;
  overflow-wrap: anywhere;
}

@media (min-width: 68rem) {
  .rhc-contact-layout { grid-template-columns: minmax(0, 2.3fr) minmax(17rem, 1fr); }
  .rhc-contact-guidance { padding-block: 1.5rem; }
}

.rhc-contact-form__required,
.rhc-contact-form__hint {
  color: var(--riko-muted);
  font-size: .9rem;
  line-height: 1.5;
  margin: .4rem 0 0;
}

.rhc-contact-form__required { margin: 0 0 1.2rem; }

.rhc-contact-form__grid {
  display: grid;
  gap: 1.5rem 2rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.rhc-contact-form__field { min-width: 0; }
.rhc-contact-form__field--wide { grid-column: 1 / -1; }

.rhc-contact-form__field > label {
  color: var(--riko-ink);
  display: block;
  font-weight: 650;
  line-height: 1.4;
  margin-bottom: .4rem;
}

.rhc-contact-form__field > label > span {
  color: var(--riko-muted);
  font-size: .85rem;
  font-weight: 400;
}

.rhc .rhc-contact-form :is(input:not([type="checkbox"]):not([type="hidden"]), select, textarea) {
  background: var(--riko-surface);
  border: 1px solid var(--riko-line-strong);
  border-radius: .45rem;
  box-shadow: none;
  color: var(--riko-ink);
  display: block;
  font: inherit;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  margin: 0;
  max-width: 100%;
  min-height: 46px;
  min-width: 0;
  padding: .65rem .8rem;
  width: 100%;
}

.rhc .rhc-contact-form select { padding-inline-end: 2rem; }
.rhc .rhc-contact-form textarea { min-height: 11rem; resize: vertical; }
.rhc-contact-form__field > .rhc-contact-form__hint { margin: -.05rem 0 .45rem; }

.rhc .rhc-contact-form [aria-invalid="true"] {
  border-color: var(--riko-danger);
}

.rhc-contact-form__error {
  color: var(--riko-danger);
  font-size: .9rem;
  font-weight: 600;
  margin: .4rem 0 0;
}

.rhc-contact-form__summary,
.rhc-contact-form__success {
  border: 1px solid var(--riko-danger);
  border-radius: .5rem;
  background: var(--riko-danger-surface);
  color: var(--riko-ink);
  margin: 0 0 1.5rem;
  padding: 1rem 1.2rem;
  scroll-margin-top: 1.5rem;
}

.rhc-contact-form__success {
  background: var(--riko-success-surface);
  border-color: var(--riko-success);
}

.rhc .rhc-contact-form__summary h2,
.rhc .rhc-contact-form__success h2 {
  color: var(--riko-ink);
  font-size: 1.1rem;
  margin: 0 0 .5rem;
}

.rhc-contact-form__summary ul { margin: 0; padding-inline-start: 1.3rem; }
.rhc-contact-form__summary li + li { margin-top: .3rem; }
.rhc-contact-form__summary a { color: var(--riko-link); }
.rhc-contact-form__success p { color: var(--riko-text); margin: 0; }
.rhc-contact-form__reference { color: var(--riko-text); font-size: .9rem; margin: .75rem 0 0; overflow-wrap: anywhere; }
.rhc-contact-form__reference > span { font-weight: 650; }
.rhc-contact-form__success .rhc-contact-form__reference { margin-top: .75rem; }
.rhc-contact-form__privacy { margin-top: 1.2rem; }
.rhc-contact-form__privacy a { color: var(--riko-link); }

.rhc-contact-form__consent {
  align-items: start;
  color: var(--riko-text);
  display: flex;
  gap: .65rem;
  line-height: 1.55;
  min-height: 44px;
}

.rhc .rhc-contact-form__consent > input[type="checkbox"] {
  accent-color: var(--riko-action);
  flex: 0 0 20px;
  height: 20px;
  margin: .2rem 0 0;
  padding: 0;
  width: 20px;
}

.rhc-contact-form__protection { margin-top: 1rem; min-width: 0; }
/* Reserve the chosen native widget height, rather than a square in every layout. */
.rhc-contact-form__protection .cf-turnstile { min-height: 65px; }
.rhc-contact-form__protection .cf-turnstile[data-size="compact"] { min-height: 140px; }
.rhc-contact-form__actions { align-items: center; display: flex; flex-wrap: wrap; gap: .6rem 1rem; margin-top: 1.1rem; }
.rhc-contact-form__actions .rhc-contact-form__hint { margin: 0; }
.rhc-contact-form [data-rhc-contact-submit] { min-height: 46px; padding-inline: 1.4rem; }

@media (max-width: 42rem) {
  .rhc-contact-form__grid { grid-template-columns: minmax(0, 1fr); }
  .rhc-contact-form__field--wide { grid-column: auto; }
  .rhc-contact-form__actions { align-items: stretch; flex-direction: column; }
  .rhc-contact-form [data-rhc-contact-submit] { width: 100%; }
}

/* Contact-specific illustration. Keep this after the native contact geometry. */
@media screen and (forced-colors: none) {
  :root body #tm-content .rhc.rhc--contact > header.rhc__intro {
    --ambience-photo: url("/media/com_rikoooo_helpcenter/images/contact-aviation.webp?v=0c3b227dea41");
    --ambience-photo-position: right center;
    background-color: var(--riko-brand-deep);
    background-image: linear-gradient(90deg,
      color-mix(in srgb, var(--riko-brand-deep) 99%, transparent) 0%,
      color-mix(in srgb, var(--riko-brand-deep) 97%, transparent) 42%,
      color-mix(in srgb, var(--riko-brand-deep) 90%, transparent) 62%,
      color-mix(in srgb, var(--riko-brand-deep) 35%, transparent) 80%,
      color-mix(in srgb, var(--riko-brand-deep) 10%, transparent) 100%),
      var(--ambience-photo) !important;
    background-size: cover, cover !important;
    background-position: center, var(--ambience-photo-position) !important;
    background-repeat: no-repeat !important;
    border: 1px solid color-mix(in srgb, var(--riko-inverse) 20%, transparent);
    border-radius: 14px;
    color: var(--riko-inverse);
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 240px;
    overflow: hidden;
    padding: clamp(24px, 2.5vw, 38px);
  }

  :root[data-riko-palette="forest"] body #tm-content .rhc.rhc--contact > header.rhc__intro {
    --ambience-photo: url("/media/com_rikoooo_helpcenter/images/contact-astra.webp?v=f8a8ef7bc5e1");
  }

  :root body #tm-content .rhc.rhc--contact > header.rhc__intro::before {
    content: none !important;
    display: none !important;
  }

  :root body #tm-content .rhc.rhc--contact > header.rhc__intro > h1 {
    color: var(--riko-inverse) !important;
    font-size: clamp(28px, 2.5vw, 38px) !important;
    font-weight: 750 !important;
    line-height: 1.18;
    margin: 0 0 .65rem;
    max-width: 54%;
    text-shadow: none;
  }

  :root body #tm-content .rhc.rhc--contact > header.rhc__intro > p:not(.rhc__eyebrow) {
    color: color-mix(in srgb, var(--riko-inverse) 94%, transparent) !important;
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
    max-width: 54%;
  }

  @media (max-width: 56rem) {
    :root body #tm-content .rhc.rhc--contact > header.rhc__intro {
      --ambience-photo-position: 75% center;
    }
    :root body #tm-content .rhc.rhc--contact > header.rhc__intro > :is(h1, p:not(.rhc__eyebrow)) {
      max-width: 62%;
    }
  }

  @media (max-width: 42rem) {
    :root body #tm-content .rhc.rhc--contact > header.rhc__intro {
      --ambience-photo-position: right top;
      background-size: cover, auto 220px !important;
      background-image: linear-gradient(0deg,
        var(--riko-brand-deep) 0%,
        color-mix(in srgb, var(--riko-brand-deep) 98%, transparent) 52%,
        color-mix(in srgb, var(--riko-brand-deep) 50%, transparent) 76%,
        color-mix(in srgb, var(--riko-brand-deep) 8%, transparent) 100%),
        var(--ambience-photo) !important;
      border-radius: 10px;
      min-height: 0;
      padding: 9rem 1.2rem 1.3rem;
    }
    :root body #tm-content .rhc.rhc--contact > header.rhc__intro > :is(h1, p:not(.rhc__eyebrow)) {
      max-width: none;
    }
    :root body #tm-content .rhc.rhc--contact > header.rhc__intro > h1 {
      font-size: clamp(26px, 7vw, 32px) !important;
    }
  }
}

/* One reading surface groups the actual request, acknowledgement and send action. */
.rhc.rhc--contact .rhc-contact-form {
  background: var(--riko-surface);
  border: 1px solid var(--riko-line);
  border-radius: 12px;
  padding: clamp(20px, 2.3vw, 32px);
}

.rhc.rhc--contact .rhc-contact-form__required {
  margin-bottom: 1.4rem;
}

.rhc.rhc--contact .rhc-contact-form__privacy {
  border-top: 1px solid var(--riko-line);
  margin-top: 1.5rem;
  padding-top: 1.25rem;
}

.rhc.rhc--contact .rhc-contact-form__actions {
  margin-top: 1.3rem;
}

.rhc.rhc--contact .rhc-back {
  margin-bottom: 1rem;
}

@media (max-width: 42rem) {
  .rhc.rhc--contact .rhc-contact-form {
    border-radius: 10px;
    padding: 1.1rem;
  }
  .rhc.rhc--contact .rhc-contact-form__grid {
    gap: 1.25rem;
  }
}

@media (forced-colors: active) {
  html body #tm-content .rhc.rhc--contact > header.rhc__intro {
    background: Canvas !important;
    border: 1px solid CanvasText;
    color: CanvasText;
    padding: 1.25rem;
  }
  html body #tm-content .rhc.rhc--contact > header.rhc__intro > :is(h1, p:not(.rhc__eyebrow)) {
    color: CanvasText !important;
  }
}

/* Form values remain reading text rather than the site-wide bold navigation treatment. */
#tm-content .rhc.rhc--contact .rhc-contact-form :is(input:not([type="checkbox"]):not([type="hidden"]), select, textarea) { font-size: 1rem; font-weight: 400; }

/* The central dark role owns both night sizes; daylight and Astra retain their scenes. */
@media screen and (forced-colors: none) {
  :root[data-riko-mode="dark"]:is(:not([data-riko-palette]), [data-riko-palette="default"]) body #tm-content .rhc.rhc--contact > header.rhc__intro {
    --ambience-photo: var(--riko-ambience-contact-image);
  }
}
