/* ============================================================
 * couponCard.css — 优惠券卡片公共样式
 * 提取自 couponCard.js 内联样式
 * ============================================================ */

/* ---- radio 选择框 ---- */
.cp-radio {
    -webkit-appearance: none; appearance: none;
    width: 0.38rem; height: 0.38rem;
    border: 0.04rem solid var(--rc);
    border-radius: 50%;
    background: #fff;
    margin: 0;
    flex-shrink: 0;
    cursor: pointer;
    outline: none;
    padding: 0;
}
.cp-radio:checked { background: var(--rc); box-shadow: inset 0 0 0 0.05rem #fff; }
.cp-radio:disabled { opacity: 0.4; }

/* ---- 滑动卡片容器 ---- */
.cp-swipe-wrap {
    width: 100%;
    position: relative;
    overflow: hidden;
    border-radius: 0.20rem;
    margin-bottom: 0.30rem;
    transition: height 0.28s cubic-bezier(.22,.61,.36,1);
    isolation: isolate;
}
.cp-swipe-track {
    display: flex;
    align-items: stretch;
    width: 200%;
    transform: translateX(0);
    transition: transform 0.28s cubic-bezier(.22,.61,.36,1);
    will-change: transform;
}

/* ---- 第一页（正面）---- */
.cp-page-front {
    flex: 0 0 50%;
    width: 50%;
    box-sizing: border-box;
    display: block;
    background: #fff;
    border-radius: 0.20rem;
    padding: 0.80rem 0.28rem 0.50rem;
    box-shadow: 0 0.04rem 0.10rem rgba(0,0,0,0.04);
    position: relative;
}

/* ---- 第二页（背面）---- */
.cp-page-back {
    flex: 0 0 calc(50% + 0.20rem);
    width: calc(50% + 0.20rem);
    box-sizing: border-box;
    margin-left: -0.20rem;
    border-radius: 0 0.20rem 0.20rem 0;
    padding: 0.50rem 0.20rem 0.50rem 0.40rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    font-size: 0.29rem;
    line-height: 1.6;
    min-width: 0;
}

/* ---- 类型标签 ---- */
.cp-type-tag {
    position: absolute;
    top: 0;
    left: 0;
    color: #fff;
    font-size: 0.24rem;
    font-weight: 600;
    padding: 0.06rem 0.44rem 0.10rem 0.24rem;
    line-height: 1.3;
    white-space: nowrap;
    clip-path: polygon(0 0, 100% 0, 88% 65%, 82% 85%, 75% 96%, 66% 100%, 0 100%);
    z-index: 2;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* ---- 券 ID 标签（右上角） ---- */
.cp-id-tag {
    position: absolute;
    top: 0.16rem;
    right: 0.20rem;
    color: #bbb;
    font-size: 0.26rem;
    font-weight: 400;
    line-height: 1.3;
    white-space: nowrap;
    z-index: 2;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* ---- 去使用按钮 ---- */
.cp-card-header .cp-use-btn {
    margin-left: auto;
    margin-right: 0.16rem;
    color: #fff;
    font-size: 0.26rem;
    font-weight: 600;
    border-radius: 1rem;
    padding: 0.14rem 0.32rem;
    display: inline-flex;
    align-items: center;
    line-height: 1;
    cursor: pointer;
    white-space: nowrap;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}
.cp-use-btn:active { box-shadow: inset 0 0 0 10rem rgba(255,255,255,0.35); }

/* ---- 金额文本 ---- */
.cp-discount {
    font-size: 0.48rem;
    font-weight: 700;
}

/* ---- 门槛文本 ---- */
.cp-threshold {
    color: #666;
    font-size: 0.28rem;
}

/* ---- 有效期/关联订单等元信息 ---- */
.cp-meta-text {
    color: #999;
    font-size: 0.28rem;
    margin-top: 0.08rem;
}
.cp-dashed-sep {
    border-top: 1px dashed #ddd;
    margin: 0.16rem 0;
    height: 0;
}
/* ---- 卡片行容器 ---- */
.cp-card-row {
    display: flex;
    align-items: center;
}/* ---- 卡片信息区 ---- */
.cp-card-info {flex: 1;
    display: flex;
    flex-direction: column;

}/* ---- 卡片信息区 ---- */
.cp-card-info > * + * { margin-left: 0; }/* ---- 卡片头部行 ---- */
.cp-card-header {display: flex;
    align-items: baseline;

    margin-bottom: 0.12rem;
}/* ---- 卡片头部行 ---- */
.cp-card-header > * + * { margin-left: 0.14rem; }

/* ---- 左滑看说明提示 ---- */
.cp-swipe-hint {
    display: inline-flex;
    align-items: center;
    color: #666;
    font-size: 0.28rem;
    line-height: 1;
    white-space: nowrap;
    pointer-events: none;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* ---- 券说明 ---- */
.cp-desc-title {
    font-weight: 600;
    font-size: 0.27rem;
    line-height: 1.6;
}
.cp-desc-text {
    width: 100%;
    min-width: 0;
    color: #333;
    font-size: 0.27rem;
    white-space: normal;
    line-height: 1.6;
}