/* JH Courses (Catalog + Detail) - lightweight layer on top of template */

.jh-filter-card{border:1px solid rgba(0,0,0,.08);border-radius:14px;padding:18px;background:#fff;}
.jh-filter-card .filter-title{font-weight:700;margin-bottom:12px;}

.jh-filter-group{margin-bottom:18px;}
.jh-filter-group:last-child{margin-bottom:0;}
.jh-filter-group .group-title{font-size:14px;font-weight:700;margin-bottom:10px;}

.jh-chip-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.jh-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(0,0,0,.12);border-radius:999px;padding:6px 10px;font-size:13px;background:#fff;}
.jh-chip button{border:0;background:transparent;line-height:1;padding:0 0 0 4px;opacity:.7;}
.jh-chip button:hover{opacity:1;}

.jh-catalog-topbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:18px;}
.jh-catalog-topbar .left{display:flex;flex-wrap:wrap;gap:12px;align-items:center;}
.jh-catalog-topbar .right{display:flex;gap:12px;align-items:center;}

.jh-search{position:relative;min-width:260px;max-width:420px;flex:1 1 260px;}
.jh-search input{width:100%;border-radius:999px;padding:12px 42px 12px 16px;border:1px solid rgba(0,0,0,.12);}
.jh-search i{position:absolute;right:16px;top:50%;transform:translateY(-50%);opacity:.55;}

.jh-course-card{border:1px solid rgba(0,0,0,.08);border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.04);height:100%;display:flex;flex-direction:column;}
.jh-course-thumb{position:relative;aspect-ratio: 16/9;overflow:hidden;background:linear-gradient(135deg, rgba(0,0,0,.04), rgba(0,0,0,.02));}
.jh-course-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.jh-course-badge{position:absolute;left:12px;top:12px;background:#fff;border:1px solid rgba(0,0,0,.10);border-radius:999px;padding:6px 10px;font-size:12px;font-weight:700;}
.jh-course-body{padding:16px;display:flex;flex-direction:column;gap:10px;flex:1 1 auto;}
.jh-course-title{font-size:18px;font-weight:800;line-height:1.25;margin:0;}
.jh-course-meta{display:flex;flex-wrap:wrap;gap:10px;font-size:13px;opacity:.8;}
.jh-course-meta span{display:inline-flex;gap:6px;align-items:center;}
.jh-course-desc{font-size:14px;opacity:.85;margin:0;}
.jh-course-actions{display:flex;gap:10px;margin-top:auto;}
.jh-course-actions a,.jh-course-actions button{flex:1 1 0;}

.jh-rating{display:inline-flex;gap:6px;align-items:center;font-weight:700;font-size:13px;}
.jh-rating .stars{letter-spacing:1px;}

.jh-sticky{position:sticky;top:110px;}
.jh-side-card{border:1px solid rgba(0,0,0,.08);border-radius:16px;padding:18px;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.04);}
.jh-side-card .price{font-size:28px;font-weight:900;margin:0;}
.jh-side-card .small{opacity:.8;font-size:13px;}

.jh-module{border:1px solid rgba(0,0,0,.08);border-radius:14px;overflow:hidden;}
.jh-module .jh-module-btn{width:100%;text-align:left;border:0;background:#fff;padding:14px 16px;font-weight:800;display:flex;justify-content:space-between;align-items:center;}
.jh-module .jh-module-body{padding:0 16px 16px 16px;}
.jh-lesson{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px dashed rgba(0,0,0,.10);font-size:14px;}
.jh-lesson:last-child{border-bottom:0;}

@media (max-width: 991.98px){
  .jh-sticky{position:static;top:auto;}
}


/* Checkout */
.jh-checkout-note{border:1px solid rgba(0,0,0,.08);border-radius:16px;padding:18px;background:linear-gradient(135deg, rgba(0,0,0,.03), rgba(0,0,0,.015));}
.jh-pay-options{display:flex;flex-direction:column;gap:10px;}
.jh-pay-option{width:100%;text-align:left;border:1px solid rgba(0,0,0,.10);background:#fff;border-radius:14px;padding:12px 12px;transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;}
.jh-pay-option:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(0,0,0,.06);}
.jh-pay-option.active{border-color:rgba(0,0,0,.28);box-shadow:0 10px 24px rgba(0,0,0,.08);}
.jh-pay-option .title{font-weight:900;font-size:14px;}
.jh-pay-option .desc{font-size:13px;opacity:.8;margin-top:2px;}
.jh-pay-option .tag{font-size:11px;font-weight:800;border-radius:999px;padding:6px 10px;border:1px solid rgba(0,0,0,.12);white-space:nowrap;}
.jh-pay-option .tag.ok{opacity:.9;}
.jh-pay-option .tag.warn{opacity:.75;}