/* カート(/cart)。数值源:analysis/08 CART CSS(照抄)。空车态为默认;?demo=1 显示商品行。 */

.page-cart .breadcrumb { background: var(--color-white); }
.section--cart-heading { padding: 90px 0 40px; background: var(--color-white); }
.section--cart-heading .section-title { margin-top: -80px; margin-bottom: 0; }
@media (max-width: 768px) { .section--cart-heading .section-title { margin-top: -40px; } }

/* 商品区 */
.con-cart-top { background: var(--color-white); padding-bottom: 70px; }
@media (max-width: 767px) { .con-cart-top { padding-bottom: 60px; } }
.box-cart { margin: 0 auto; max-width: 940px; }
@media (max-width: 940px) { .box-cart { margin: 0 1.25rem; } }

.tbl-cart { border-collapse: collapse; margin-bottom: 45px; width: 100%; }
@media (max-width: 767px) { .tbl-cart { margin-bottom: 30px; } }
.tbl-cart tbody tr th, .tbl-cart tbody tr td {
  border-top: 1px solid #999; border-bottom: 1px solid #999;
  padding: 20px 5px; vertical-align: middle;
}
@media (max-width: 767px) { .tbl-cart tbody tr th, .tbl-cart tbody tr td { padding: 20px 3px; } }
.tbl-cart tbody tr th { width: 126px; }
@media (max-width: 767px) { .tbl-cart tbody tr th { width: 114px; } }
.tbl-cart tbody tr td { padding-left: 15px; }
@media (max-width: 767px) { .tbl-cart tbody tr td { padding-left: 10px; } }
.tbl-cart .photo { border-radius: 8px; line-height: 0; margin: 0; overflow: hidden; }
.tbl-cart .photo img { border-radius: 8px; max-width: 100%; width: 100%; }

.box-control { display: flex; flex-wrap: wrap; align-content: space-between; min-height: 116px; padding: 5px 0; }
@media (max-width: 767px) { .box-control { min-height: 108px; } }
.box-control .box-top { display: flex; align-items: flex-start; justify-content: space-between; width: 100%; }
.box-control .box-top .caption { line-height: 1.5; width: calc(100% - 35px); font-size: 15px; font-weight: 500; }
@media (max-width: 767px) { .box-control .box-top .caption { font-size: 14px; } }
.box-control .box-top .control { display: flex; align-items: center; justify-content: flex-end; width: 35px; }
.box-control .box-bottom { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.box-control .box-bottom .money { width: calc(100% - 100px); font-size: 23px; font-weight: 500; }
@media (max-width: 767px) { .box-control .box-bottom .money { font-size: 21px; } }
.box-control .box-bottom .control { display: flex; align-items: center; justify-content: flex-end; width: 100px; }

/* Remove/±:文字缩进隐藏,SVG 图标背景 */
.btn-remove {
  display: block; width: 25px; height: 25px; text-indent: -9999px; overflow: hidden;
  background: transparent url(/assets/common/ic_close.svg) no-repeat 50% / contain;
}
.btn-remove:hover { background-image: url(/assets/common/ic_close_hover.svg); }
.btn-minus, .btn-plus {
  display: block; width: 22px; height: 22px; text-indent: -9999px; overflow: hidden;
  background-repeat: no-repeat; background-position: 50%; background-size: contain;
}
.btn-minus { background-image: url(/assets/common/ic_minus.svg); }
.btn-minus:hover { background-image: url(/assets/common/ic_minus_hover.svg); }
.btn-plus { background-image: url(/assets/common/ic_plus.svg); }
.btn-plus:hover { background-image: url(/assets/common/ic_plus_hover.svg); }
.quality { padding: 0 15px; font-size: 18px; }
@media (max-width: 767px) { .quality { padding: 0 10px; font-size: 16px; } }

/* 小计 */
.box-summary { text-align: right; }
.box-summary p.line1 { display: flex; align-items: baseline; justify-content: flex-end; margin: 0 0 10px; }
.box-summary p.line1 .txt1 { margin-right: 30px; }
.box-summary p.line1 .txt2 em { font-style: normal; font-weight: 500; }
.box-summary .txt2-1 { font-size: 29px; }
.box-summary .txt2-2 { font-size: 36px; }
@media (max-width: 767px) { .box-summary .txt2-1 { font-size: 25px; } .box-summary .txt2-2 { font-size: 32px; } }
.box-summary .line2 { font-size: 12px; }
@media (max-width: 767px) { .box-summary .line2 { font-size: 11px; } }

/* 结算 <button>(demo 填充态)才带硬阴影;空车 CTA 是 <a>,线上无阴影 */
.box-action .btns button.btn-black-border { box-shadow: 6px 6px #b1b1a8; }

/* 空车态 / 结算区 */
.con-cart-bottom { margin: 0 1.25rem; padding: 0 0 160px; }
@media (max-width: 767px) { .con-cart-bottom { padding: 0 0 70px; } }
.con-cart-bottom.bg-white { margin: 0; background: var(--color-white); padding-top: 40px; }
.box-cart-bottom { margin: 0 auto; max-width: 940px; }
.box-action .txt { font-size: 13px; line-height: 1.5; margin: 0 0 30px; text-align: center; }
.box-action .btns { text-align: center; }

.btn-black-border {
  display: inline-block; width: 100%; max-width: 400px; height: 55px; line-height: 55px;
  font-size: 16px; font-weight: 700; text-align: center; color: var(--color-white); background: var(--color-ink-soft);
  border: 0; border-radius: 60px; transition: background .3s;
}
.btn-black-border:hover { background: var(--color-muted); }
@media (max-width: 767px) { .btn-black-border { max-width: 300px; font-size: 15px; } }
