.video-item{display:flex;gap:1rem;padding:1rem;margin-bottom:.75rem;border-radius:12px;cursor:pointer;transition:all .3s ease;border:2px solid transparent;box-shadow:0 2px 6px rgba(0,0,0,.05)}.video-item:hover{transform:translateX(8px);border-color:#f93825;box-shadow:0 6px 20px rgba(249,56,37,.15)}.video-item.active{border-color:#f93825;background:linear-gradient(135deg,#fff5f5 0%,#ffe5e5 100%);box-shadow:0 6px 20px rgba(249,56,37,.2);position:relative}.video-item.active::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#f93825;border-radius:12px 0 0 12px}.video-thumbnail{width:120px;height:80px;border-radius:8px;overflow:hidden;flex-shrink:0;position:relative}.video-thumbnail img{width:100%;height:100%;object-fit:cover}.video-thumbnail::after{content:"";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:white;font-size:1.5rem;text-shadow:0 2px 8px rgba(0,0,0,.5);opacity:.9}.video-info{flex:1;display:flex;flex-direction:column;justify-content:center}.video-title{font-size:.95rem;font-weight:600;color:white;margin-bottom:.25rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.video-item.active .video-title{color:#f93825;font-weight:700}.video-duration{font-size:.85rem;color:#6c757d;display:flex;align-items:center;gap:.25rem}.video-duration i{color:#f93825}@media (max-width:768px){.video-item{padding:.75rem}.video-thumbnail{width:100px;height:60px}.video-title{font-size:.875rem}}@media (max-width:576px){.video-item{padding:.5rem}.video-thumbnail{width:80px;height:50px}}