﻿
html, body {
    height: 100%;
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column; /* navbar on top, rest below */
}

/* Middle area: sidebar + content */
#wrapper {
    flex: 1 0 auto; /* fill remaining height */
    display: flex; /* row: sidebar + content */
    min-height: 0;
}

/* Make the content area a column so the footer can push down */
#content-wrapper {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

    /* Let the page content grow; footer sits after it */
    #content-wrapper > .container-fluid {
        flex: 1 1 auto; /* KEY: content takes available space */
    }

/* Footer is placed at the end of the column */
footer.sticky-footer {
    margin-top: auto; /* KEY: pushes footer to bottom */
    flex-shrink: 0;
    width: 100%;
}
.video-card {
    border-radius: 12px; /* smooth rounded corners */
    overflow: hidden; /* clip inner img/video */
    box-shadow: 0 4px 12px rgba(0,0,0,0.1); /* soft shadow */
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .video-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    }

    .video-card img {
        border-radius: 12px 12px 0 0; /* round top corners */
    }

.osahan-navbar-search {
    width: 100%;
    max-width: 500px; /* keep it neat */
    margin: auto; /* center it */
}

    .osahan-navbar-search .form-control {
        border-radius: 25px 0 0 25px;
        border: 1px solid #ddd;
        padding-left: 15px;
    }

    .osahan-navbar-search .btn {
        border-radius: 0 25px 25px 0;
        border: 1px solid #ddd;
        border-left: 0;
    }

.video-title a {
    font-size: 15px;
    font-weight: 600;
    /* color: #212529; */
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

    .video-title a:hover {
        color: #007bff;
        text-decoration: none;
    }

.video-view, .video-page {
    font-size: 13px;
    color: #6c757d;
}

.main-title h6 {
    font-size: 18px;
    font-weight: 700;
    border-left: 4px solid #007bff;
    padding-left: 10px;
}