/* style_user.css */
main.contents.product {
  .product__item {
     height: 100%;
  }
}
.pdetails_tab1 {
  > details[open] {
    > summary {
      color: #fff;
      background: #2b73cd;
    }
    &::details-content {
      flex: 0 0 100%;
      border-top: 1px solid #333;
      position: relative;
      top: -1px;
    }
  }
}

[lang="ja"] {
  form {
    .row.form-group:has(:is([for="user_country"])) {
      display: none;
    }
    &.debug {
      .row.form-group:has(:is([for="user_country"])) {
        display: grid;
        background: #ffd;
      }
    }
  }
}
[lang="en"] {
  form {
    .row.form-group:has(:is([for="user_name_kana"], [for="user_address1"])) {
      display: none;
    }
    &.debug {
      .row.form-group:has(:is([for="user_name_kana"], [for="user_address1"])) {
        display: grid;
        background: #ffd;
      }
    }
  }
}

form {
  input[type=hidden] ~ div.text-muted {
    display: none;
  }
  .fa.fa-asterisk:before {
    content: "※";
    color: #da212f;
  }
  .fa.fa-question-circle-o:before {
    /*content: none;*/
  }

  &:has(input[type="hidden"][name="__mode"][value="sign_up"]) {
    .row.form-group:has(:is([for="name"], [for="language"])) {
      display: none;
    }
    &:has(:is(input[type="hidden"][name="_type"][value="sign_up"], input[type="hidden"][name="re_edit"][value="1"])) {
      .hint-block {
        display: none;
      }
    }
  }
  &:has(input[type="hidden"][name="__mode"][value="edit_profile"]) {
    .row.form-group:has(:is([for="name"], [for="language"])) {
      display: none;
    }
  }
  &.debug {
    &:has(input[type="hidden"][name="__mode"][value="sign_up"]) {
      .row.form-group:has(:is([for="name"], [for="language"])) {
        display: grid;
        background: #eee;
      }
    }
    &:has(input[type="hidden"][name="__mode"][value="edit_profile"]) {
      .row.form-group:has(:is([for="name"], [for="language"])) {
        display: grid;
        background: #eee;
      }
    }
  }

  .row.form-group {
    @media (min-width: 768px) {
      display: grid;
      grid-template-columns: 240px 1fr;
      > div {
        width: 100%;
      }
    }

    border-top: 1px solid #d3d3d3;
    padding-block: 20px;
    input[type="text"],
    input[type="password"] {
      width: 70%;
      padding: 1rem 2rem;
      border-radius: 32px;
      &.short,
      &[type="password"] {
        width: 70%;
      }
      @media (max-width: 767.99px) {
        width: 100% !important;
      }
    }
    label {
      word-break: auto-phrase;
    }
    select,
    input[type="date"] {
      padding: 1rem 2rem;
      border-radius: 32px;
      width: 10em;
      min-width: auto;
    }
    .custom-checkbox {
      display: block;
    }
    &:has(button[type="submit"]) {
      display: flex;
      justify-content: center;
      gap: 20px;
    }
    button[type="submit"] {
      width: 260px;
      padding: 15px 20px;
      border: 1px solid transparent;
      border-radius: 60px;
      font-size: 1.4rem;
      font-weight: bold;
      color: #fff;
      background: #2b73cd;
      text-align: center;
      text-decoration: none;
      &.btn-outline-primary {
        background-color: #efefef;
        color: #333;
      }
    }
  }
}