/* single-shop-new.css
   Change colors and spacing here.
*/

.mr-shop{
  max-width: 980px;
  margin: 0 auto;
  padding: 24px 16px 64px;
}

.mr-shop__card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
}

.mr-shop__header{
  padding: 20px 20px 16px;
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.mr-shop__badge{
  display:inline-block;
  font-size: 12px;
  letter-spacing: .08em;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.06);
}

.mr-shop__title{
  margin: 10px 0 0;
  font-size: 26px;
  line-height: 1.25;
}

.mr-shop__meta{
  margin-top: 14px;
  display: grid;
  gap: 8px;
}

.mr-shop__metaRow{
  display:flex;
  gap: 10px;
  align-items:flex-start;
}

.mr-shop__metaLabel{
  width: 72px;
  flex: 0 0 72px;
  font-size: 12px;
  opacity: .7;
  padding-top: 2px;
}

.mr-shop__metaValue{
  flex: 1 1 auto;
  font-size: 14px;
}

.mr-shop__actions{
  margin-top: 16px;
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
}

.mr-btn{
  display:flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  text-decoration: none;
}

.mr-btn__label{
  font-weight: 700;
  font-size: 14px;
}

.mr-btn__sub{
  font-size: 12px;
  opacity: .7;
}

.mr-btn--primary{
  background: #111;
  color: #fff;
}

/* Body */
.mr-shop__body{ padding: 18px 20px 6px; }
.mr-shop__content{ font-size: 15px; line-height: 1.8; }

/* Review */
.mr-shop__review{ padding: 8px 20px 24px; }
.mr-shop__h2{ margin: 18px 0 8px; font-size: 18px; }
.mr-shop__note{ margin: 0 0 16px; font-size: 13px; opacity: .75; }
.mr-shop__muted{ font-size: 13px; opacity: .75; }

/* Comments */
.commentlist, .comment-list{ margin: 0; padding: 0; list-style: none; }
.comment-body{ padding: 14px 12px; border: 1px solid rgba(0,0,0,.08); border-radius: 12px; margin-bottom: 10px; }
.comment-meta{ font-size: 12px; opacity: .75; }
.comment-content{ font-size: 14px; line-height: 1.7; margin-top: 8px; }
.comment-respond{ margin-top: 14px; }
.comment-form input[type="text"], .comment-form textarea{
  width: 100%;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
}
.comment-form textarea{ min-height: 120px; }
.comment-form .submit{
  display:inline-block;
  padding: 10px 14px;
  border-radius: 12px;
  border: 0;
  background: #111;
  color: #fff;
  cursor: pointer;
}
.mr-cmeta{ font-size: 12px; opacity: .85; margin: 0 0 6px; }