/* Video thumbnail styles */
.video-thumbnail-container {
    transition: all 0.3s ease;
}

.video-thumbnail-container:hover {
    transform: scale(1.02);
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}

.video-overlay {
    transition: transform 0.3s ease;
}

.video-overlay:hover {
    transform: translate(-50%, -50%) scale(1.1) !important;
}

.video-info {
    transition: opacity 0.3s ease;
}

.video-thumbnail-container:hover .video-info {
    opacity: 0.9;
}

/* Modal video styles */
#videoModal .modal-content {
    border-radius: 10px;
    overflow: hidden;
}

#videoModal video {
    border-radius: 8px;
}

/* ------------------------------ */
/* Global header alignment tweaks */
/* Ensure icons and titles in card headers are vertically centered, with consistent spacing */
.card-header h1,
.card-header h2,
.card-header h3,
.card-header h4,

.card-header h5,
.card-header h6,
.card-header .card-title {
    display: flex;
    align-items: center; /* vertical centering */
    gap: .5rem;          /* space between icon and text/badges */
    margin: 0;           /* remove default heading margins to center within header */
}

.card-header h1 i,
.card-header h2 i,
.card-header h3 i,
.card-header h4 i,
.card-header h5 i,
.card-header h6 i,
.card-header .card-title i {
    line-height: 1;      /* keep icon height tight */
    vertical-align: middle;
}

/* Optional: tighten default card-header padding slightly for balance */
.card > .card-header,
div.card > div.card-header,
.card .card-header {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
}

/* ===== FORCE CARD HEADER PADDING - MAXIMUM PRIORITY ===== */
html body .card .card-header,
html body div.card div.card-header,
html body .card > .card-header {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
}

/* --- Standard DM blue card header utility --- */
.dm-card-header-blue,
.dm-card-header-blue .card-title,
.dm-card-header-blue h1,
.dm-card-header-blue h2,
.dm-card-header-blue h3,
.dm-card-header-blue h4,
.dm-card-header-blue h5,
.dm-card-header-blue h6,
.dm-card-header-blue i {
    background: #667eea !important;
    color: #fff !important;
    border: 0 !important;
}