@import url(./poppins.css);

:root {
    --main-background: rgba(243, 243, 243, 0.90);
    --card-background: #FFFFFF !important;
    --title-color: #494949;
    --spinner-background: #E8E8E8;
    --spinner-thumb: #CFCFCF;
}

[data-theme="dark"] {
    --main-background: rgba(36, 36, 36, 0.9);
    --card-background: rgb(42, 42, 42) !important;
    --title-color: #FFFFFF;
    --spinner-background: #2A2A2A;
    --spinner-thumb: #373737;
}

@media (prefers-color-scheme: dark) {
    [data-theme="system"] {
        --main-background: rgba(36, 36, 36, 0.9);
        --card-background: rgb(42, 42, 42) !important;
        --title-color: #FFFFFF;
        --spinner-background: #2A2A2A;
        --spinner-thumb: #373737;
    }
}

.loading {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100vw;
    height: 100vh;
}

html {
    overflow: scroll;
    overflow-x: hidden;
}

::-webkit-scrollbar {
    width: 0; /* Remove scrollbar space */
    background: transparent; /* Optional: just make scrollbar invisible */
}

body {
    margin: 0;
    padding: 0;

    background: var(--main-background);
    backdrop-filter: blur(7.5px);
}

.thumbBlock_holder {
    background-color: var(--card-background);
    border-top-left-radius: 10px !important;
    border-top-right-radius: 10px !important;
}

.syndicatedItem .video-title {
    font-size: 16px !important;
}

.video-label-box {
    background-color: var(--card-background);

    margin-top: 0 !important;
    padding: 12px 15px 15px 15px !important;
}
.video-label,
.video-title {
    color: var(--title-color) !important;
}