/* Data Requests page */
#pandectes-dsr-container,
#pandectes-ccpa-container {
  h1, h2, h3, h4, h5, h6 {
    text-transform: capitalize;
  }

  .pd-horizontal-menu button,
  #ccpa-optout-container button {
    text-transform: capitalize;
    font-family: var(--font-heading-family);
    font-style: italic;
  }

  #ccpa-current-status {
    text-transform: capitalize;
  }

  .pd-request-form-container {
    @media (min-width: 768px) {
      width: 75%;
    }

    input {
      border: 0;
      padding: 1.5rem 0;
    }

    textarea {
      padding: 8px 15px;
      border: 1px solid var(--color-subdued);
      min-height: 10rem;
      resize: none;
    }

    & > div {
      flex-direction: row-reverse;

      /* selecting the element that contains the loading spinner and error text */
      div:has(.pd-loader:first-child) {
        flex-direction: column;
      }

      /* selecting the element that contains the cancel and submit buttons */
      div:has(.pd-hide-form-btn + .pd-submit-request-btn) {
        display: flex;
        gap: 1rem;
      }
    }

    button {
      font-size: 1.4rem;
      min-width: 90px;
    }

    .pd-input-field {
      display: block;
      font-family: var(--font-body-family);
      -webkit-appearance: none;
      appearance: none;
      background-color: transparent;
      border-bottom: 1px solid var(--color-subdued);
      color: var(--color-ink);
      font-size: 1.2rem;
      width: 100%;
      height: 4.5rem;
      box-sizing: border-box;
      transition: box-shadow var(--duration-short) ease;
      line-height: 1.5;
      letter-spacing: .04rem;
      margin-bottom: 20px;
    }

    .pd-loader > :first-child {
      align-items: center !important;
    }

    .pd-validation-error {
      color: var(--color-error);
      margin-left: 0 !important;
    }
  }
}