/* SPDX-License-Identifier: AGPL-3.0-or-later */

.wolfree-pods {
  display: flex;
  width: 100%;
  justify-content: center;
  /* padding: 26px 0 20px; */
  padding: 26px 0 0;
}

.wolfree-pods>div {
  position: relative;
}

.wolfree-pods>div {
  max-width: 780px;
  width: 100%;
}

.wolfree-pods>div>div {
  position: relative;
}

.wolfree-pods>div>div>section {
  box-shadow: 0 0 10px 0 hsla(0, 0%, 80%, 0.5), 0 0 1px 0 hsla(0, 0%, 80%, 0.5);
  border-radius: 5px;
  /* margin-bottom: 20px; */
  margin-bottom: 0;
}

.wolfree-pods>div>div>section>section {
  border-top-color: transparent;
}

.wolfree-pods>div>div>section>section {
  display: flex;
  flex-direction: column;
  position: relative;
  background: #f5f5f5;
  outline: none;
  border-color: #fff transparent;
  border-style: solid;
  border-width: 1px;
}

.wolfree-pods>div>div>section>section:first-child {
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}

.wolfree-pods>div>div>section>section>div:is(:first-child) {
  min-height: 30px;
  font-size: 13px;
  font-family: WebRoboto, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ ProN, Meiryo,
    メイリオ, Arial, Helvetica, sans-serif;
  background: #f5f5f5;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 20px;
}

.wolfree-pods>div>div>section>section>div:is(:first-child)>h2 {
  color: #678e9c;
  margin-right: 20px;
}

.wolfree-pods>div>div>section>section>div:is(:first-child)>select {
  /* We style this element manually. */
  border-radius: 4px;
  border-style: solid;
  border-width: thin;
  min-height: 20px;
  cursor: pointer;
  color: #ff6c00;
  background-color: #fff;
  border-color: #ec561a;
  touch-action: manipulation;
}

.wolfree-pods>div>div>section>section>div:not(:first-child) {
  display: flex;
  align-items: flex-end;
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: inherit;
  padding: 6px 20px;
}

.wolfree-pods>div>div>section>section>div:not(:first-child)>div {
  position: relative;
  flex: 1 1 auto;
}

.wolfree-pods>div>div>section>section>div:not(:first-child)>div>img {
  max-width: 100%;
  /* width: 100%; */
  width: auto;
}

.wolfree-pods>div>div>section>section>div:not(:first-child)>div>div>details>summary {
  /* We style this element manually. */
  cursor: pointer;
  touch-action: manipulation;
}

.wolfree-pods>div>div>section>section>div:not(:first-child)>div>div>details>div {
  /* We style this element manually. */
  padding: 1rem;
  line-height: 2;
  touch-action: manipulation;
}

.wolfree-pods>div>div>section>section>div:not(:first-child)>div>div>details>textarea {
  /* We style this element manually. */
  width: 99%;
  height: 50vh;
  touch-action: manipulation;
}