/* Styles for wrapping the search box */

.main {
    width: 50%;
    margin: 50px auto;
}

/* Bootstrap 5 text input with search icon */

.has-search .form-control {
    padding-left: 2.375rem;
}

.has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
    color: #aaa;
}

.fixed-top {
    right: auto;
    left: auto;
}

#video-iframe {
    visibility: hidden;
    /* Make iframe invisible initially */
    opacity: 0;
    /* Fully transparent */
    position: absolute;
    z-index: 1000;
    /* Ensure it appears above all other elements */
    border: none;
    background-color: black;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    transition: opacity 0.3s ease;
    /* Smooth transition when shown */
    /*pointer-events: none;  Prevent interaction until visible */
}

.card-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

.expanded {
    white-space: normal;
}
.header-button{
    height: 40px;
    text-align: center;
    padding: 10px;
}
.bgbody{
    background-color: rgb(33, 37, 41);
}
.hand{
    cursor:pointer;
}
.fa{
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
.card-body{
    margin-top: -112px;
    text-shadow: 0 0 2px black;
    color:rgb(235,235,235);
    background-color: transparent;
    z-index:1001;
}
@media (min-width:992px) {
    .card-img-top{
        width: 416px;
        height: 312px;    
    }    
}

@media (max-width:992px) and (min-width:576px) {
    .card-img-top{
        min-width: 336px;
        min-height: 252px;    
    }    
}
@media (min-width:1200px) {
    .card-img-top{
        min-width: 356px;
        min-height:267px;    
    }    
}
@media (min-width:375px){
    .card-img-top{
        min-width: 225px;
        min-height: 168.75px;    
    } 
}

.card-img-top{
    border-radius: var(--bs-card-inner-border-radius);
    background-color:rgb(33, 37, 41);
}

.card{
    margin-bottom: 20px;
    border: none;
    border-radius: 6px;
}