/**
 * Package Card V5 (bám Figma 21:662). card_style="v5" cho [pdh_grid_t1]/[pdh_grid_v2_t1].
 *
 * Kích thước (font/padding/icon) theo CONTAINER QUERY (cqw) tính trên bề rộng card:
 * card = 255px → đúng tỉ lệ Figma; card rộng/hẹp hơn → scale theo, không lệch.
 * (1cqw = 1% bề rộng card. Figma px → cqw = px / 2.55.)
 */
.pdh-card-v5{
  container-type:inline-size;
  width:100%;flex:1 1 100%;             /* fill slide: container-type triệt tiêu content-width nên PHẢI set width */
  display:flex;flex-direction:column;background:#fff;border:.75px solid #e3e3e3;border-radius:16px;
  box-shadow:0 4px 6px rgba(0,0,0,.15);overflow:hidden;height:100%;box-sizing:border-box;
}
.pdh-card-v5__banner{position:relative;aspect-ratio:255/149;background:#eef3fb;overflow:hidden;}
.pdh-card-v5__banner-link{display:block;height:100%;}
.pdh-card-v5__banner-img{width:100%;height:100%;object-fit:cover;display:block;}

.pdh-card-v5__body{display:flex;flex-direction:column;gap:3.5cqw;padding:5cqw;flex:1;}
.pdh-card-v5__name{margin:0;font-weight:600;font-size:clamp(16px,7.2cqw,22px);line-height:1.2;color:#1e1e1e;}
.pdh-card-v5__name a{color:inherit;text-decoration:none;}
.pdh-card-v5__price{margin:0;display:flex;align-items:baseline;gap:1.5cqw;}
.pdh-card-v5__price-value{font-weight:700;font-size:clamp(20px,8.8cqw,28px);line-height:1.2;
  background:linear-gradient(175deg,#3272ff,#155dfc);-webkit-background-clip:text;background-clip:text;color:transparent;}
.pdh-card-v5__price-currency{font-size:.8em;}
.pdh-card-v5__price-period{font-weight:400;font-size:clamp(12px,4.9cqw,15px);color:#848484;}

/* Box chung (nền xám nhạt) */
.pdh-card-v5__box{background:#f4f5f7;border-radius:clamp(10px,4.7cqw,16px);box-sizing:border-box;}

.pdh-card-v5__box--speed{display:flex;align-items:center;justify-content:space-between;gap:3cqw;padding:3.4cqw 3.4cqw;}
.pdh-card-v5__speed-label{display:block;font-size:clamp(10px,4.2cqw,13px);line-height:1.2;color:#848484;}
.pdh-card-v5__speed-vals{display:block;margin-top:1.2cqw;font-size:clamp(13px,5.3cqw,16px);line-height:1.3;color:#1e1e1e;font-weight:500;white-space:nowrap;}
.pdh-card-v5__speed-up{margin-left:3.9cqw;}
.pdh-card-v5__arrow{color:#00c85a;font-weight:800;margin-right:.8cqw;}
.pdh-card-v5__gauge{flex:none;width:clamp(32px,14cqw,46px);height:auto;}

.pdh-card-v5__box--feats{list-style:none;margin:0;padding:4cqw 3.4cqw;display:flex;flex-direction:column;gap:2cqw;}
/* override Flatsome `.col-inner ul li{margin-left:1.3em}` */
.pdh-card-v5__box--feats li{margin:0!important;padding:0!important;list-style:none!important;}
.pdh-card-v5__feat{display:flex;align-items:center;gap:2.4cqw;font-size:clamp(12px,4.2cqw,14px);line-height:1.3;color:#1e1e1e;}
.pdh-card-v5__feat-ic{flex:none;width:clamp(16px,6.3cqw,20px);height:clamp(16px,6.3cqw,20px);}

.pdh-card-v5__area{display:flex;align-items:center;gap:2.4cqw;padding:4cqw 3.4cqw;margin-top:auto;cursor:pointer;}
.pdh-card-v5__area-ic{flex:none;width:clamp(14px,5.6cqw,18px);height:clamp(14px,5.6cqw,18px);}
.pdh-card-v5__area-text{min-width:0;flex:1;font-weight:700;font-size:clamp(12px,4.5cqw,15px);line-height:1.3;color:#1e1e1e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* Skeleton */
.pdh-card-v5__sk{display:block;border-radius:2cqw;background:linear-gradient(90deg,#eee 25%,#f5f5f5 37%,#eee 63%);background-size:400% 100%;animation:pdhV5Sh 1.2s ease-in-out infinite;}
.pdh-card-v5__sk--img{width:100%;height:100%;border-radius:0;}
.pdh-card-v5__sk--name{width:60%;height:6.3cqw;}
.pdh-card-v5__sk--price{width:40%;height:7.85cqw;}
.pdh-card-v5__sk--box{width:100%;height:20cqw;}
.pdh-card-v5__sk--box-lg{height:27cqw;}
.pdh-card-v5__sk--box-sm{height:17cqw;margin-top:auto;}
@keyframes pdhV5Sh{0%{background-position:100% 0}100%{background-position:-100% 0}}