/**
 * EcomPro Plugin – Frontend CSS v1.0.0
 * Author: dev.com.vn
 * Scoped .ecp-* classes only. NO body/html/*/:root global resets.
 */

/* ── Grid ── */
/* Mobile: 1 col → Tablet: 2 col → Desktop: N cols */
.ecp-grid{display:grid;grid-template-columns:1fr;gap:16px;}

/* 2 cols from 576px */
@media(min-width:576px){
  .ecp-grid.ecp-cols-2{grid-template-columns:repeat(2,1fr);}
  .ecp-grid.ecp-cols-3{grid-template-columns:repeat(2,1fr);}
  .ecp-grid.ecp-cols-4{grid-template-columns:repeat(2,1fr);}
}

/* Desktop: full columns from 900px */
@media(min-width:900px){
  .ecp-grid.ecp-cols-2{grid-template-columns:repeat(2,1fr);}
  .ecp-grid.ecp-cols-3{grid-template-columns:repeat(3,1fr);}
  .ecp-grid.ecp-cols-4{grid-template-columns:repeat(3,1fr);}
}
@media(min-width:1100px){
  .ecp-grid.ecp-cols-4{grid-template-columns:repeat(4,1fr);}
}

/* ── Card ── */
.ecp-card{background:#fff;border:2px solid #f0ede9;border-radius:22px;overflow:hidden;box-shadow:0 2px 12px rgba(238,77,45,.06);transition:transform .25s,box-shadow .25s,border-color .25s;display:flex;flex-direction:column;}
.ecp-card:hover{transform:translateY(-4px);box-shadow:0 6px 28px rgba(238,77,45,.12);border-color:#ffc4b8;}
.ecp-card__thumb{position:relative;display:block;overflow:hidden;aspect-ratio:4/3;background:#fafafa;text-decoration:none;}
.ecp-card--case_study .ecp-card__thumb{aspect-ratio:16/9;background:#1a1a1a;}
.ecp-card--goi_dv .ecp-card__thumb{aspect-ratio:3/2;}
.ecp-card__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .35s;display:block;}
.ecp-card:hover .ecp-card__thumb img{transform:scale(1.05);}
.ecp-card__ico{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:3rem;}
.ecp-card__badge{position:absolute;top:10px;left:10px;background:linear-gradient(135deg,#ee4d2d,#ff9500);color:#fff;padding:3px 10px;border-radius:5px;font-size:.7rem;font-weight:800;box-shadow:0 3px 10px rgba(238,77,45,.3);}
.ecp-card__body{padding:16px;flex:1;display:flex;flex-direction:column;gap:8px;}
.ecp-card__tags{display:flex;flex-wrap:wrap;gap:5px;}

/* ── Tags ── */
.ecp-tag{display:inline-flex;align-items:center;padding:3px 9px;border-radius:5px;font-size:.72rem;font-weight:700;transition:all .15s;text-decoration:none;}
.ecp-tag--nhom{background:#fff3f0;color:#ee4d2d;border:1px solid #ffc4b8;}
.ecp-tag--nhom:hover{background:#ee4d2d;color:#fff;}
.ecp-tag--san{background:#f0fdf4;color:#16a34a;border:1px solid #bbf7d0;}
.ecp-tag--san:hover{background:#16a34a;color:#fff;}

.ecp-card__title{font-size:.94rem;font-weight:800;line-height:1.3;margin:0;}
.ecp-card__title a{color:#1a1a1a;text-decoration:none;}
.ecp-card__title a:hover{color:#ee4d2d;}
.ecp-card__excerpt{font-size:.81rem;color:#666;line-height:1.6;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ecp-card__meta{display:flex;flex-wrap:wrap;gap:10px;}
.ecp-card__meta-item{display:flex;align-items:center;gap:5px;font-size:.78rem;color:#666;}
.ecp-card__meta-item i{color:#ee4d2d;font-size:.72rem;}
.ecp-card__footer{margin-top:auto;padding-top:10px;border-top:1px solid #f0ede9;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;}
.ecp-card__price{font-size:.9rem;font-weight:800;color:#ee4d2d;}

/* ── Buttons ── */
.ecp-btn-primary{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;background:linear-gradient(135deg,#ee4d2d,#ff9500);color:#fff;border:none;border-radius:40px;font-weight:700;font-size:.82rem;cursor:pointer;font-family:inherit;box-shadow:0 6px 24px rgba(238,77,45,.28);transition:all .22s;text-decoration:none;}
.ecp-btn-primary:hover{transform:translateY(-2px);color:#fff;}
.ecp-btn-sm{padding:7px 14px !important;font-size:.78rem !important;}
.ecp-btn-outline{display:inline-flex;align-items:center;gap:7px;padding:10px 20px;background:#fff;color:#333;border:1.5px solid #f0ede9;border-radius:40px;font-weight:600;font-size:.88rem;cursor:pointer;font-family:inherit;transition:all .22s;text-decoration:none;}
.ecp-btn-outline:hover{border-color:#ee4d2d;color:#ee4d2d;}

/* ── States ── */
.ecp-no-results{grid-column:1/-1;text-align:center;padding:60px 20px;color:#666;}
.ecp-no-results i{font-size:3rem;margin-bottom:16px;display:block;opacity:.3;}
.ecp-load-more-wrap{text-align:center;margin-top:32px;}

/* ── Related ── */
.ecp-related-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
@media(min-width:768px){.ecp-related-grid{grid-template-columns:repeat(3,1fr)}}

/* ── Breadcrumb ── */
.ecp-breadcrumb{padding:12px 0;font-size:.82rem;}
.ecp-breadcrumb__list{display:flex;align-items:center;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0;}
.ecp-breadcrumb__item{display:flex;align-items:center;gap:6px;color:#666;}
.ecp-breadcrumb__item a{color:#333;font-weight:500;text-decoration:none;}
.ecp-breadcrumb__item a:hover{color:#ee4d2d;}
.ecp-breadcrumb__item i{font-size:.65rem;color:#ddd;}
.ecp-breadcrumb__item--active{color:#1a1a1a;font-weight:600;}

/* ── Pagination ── */
.ecp-pagination{margin-top:40px;display:flex;justify-content:center;gap:8px;flex-wrap:wrap;}
.ecp-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;border:1.5px solid #f0ede9;font-size:.88rem;font-weight:600;color:#333;text-decoration:none;transition:all .18s;}
.ecp-pagination .page-numbers.current{background:linear-gradient(135deg,#ee4d2d,#ff9500);color:#fff;border-color:transparent;}
.ecp-pagination .page-numbers:hover:not(.current){border-color:#ee4d2d;color:#ee4d2d;}

/* ── Search filter ── */
.ecp-search-filter-wrap{margin-bottom:24px;}