/* =====================================================
APP WRAPPER
===================================================== */

.smvp-app{
max-width:100%;
margin:0;
padding:0;
overflow-x:hidden;
}


/* =====================================================
TOPBAR
===================================================== */

.smvp-topbar{
background:#fff;
border-bottom:1px solid #e5e5e5;
padding:10px 12px;
margin:0;
width:100%;
box-sizing:border-box;
}

.smvp-topbar-inner{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
}

.smvp-logo{
font-weight:600;
font-size:17px;
white-space:nowrap;
}


/* =====================================================
SEARCH BAR
===================================================== */

.smvp-search-wrapper{
margin-top:6px;
}

#smvp-search{
width:100%;
padding:10px 12px;
border-radius:8px;
border:1px solid #ddd;
font-size:14px;
background:#fff;
}


/* =====================================================
CATEGORY BAR
===================================================== */

.smvp-category-bar{
display:flex;
gap:10px;
overflow-x:auto;
padding:10px 12px;
background:#fff;
border-bottom:1px solid #eee;
scrollbar-width:none;
position:sticky;
top:0;
z-index:50;
}

.smvp-category-bar::-webkit-scrollbar{
display:none;
}

.smvp-cat{
flex:0 0 auto;
padding:7px 14px;
border-radius:20px;
border:1px solid #ddd;
background:#f5f5f5;
font-size:13px;
color:#333;
cursor:pointer;
white-space:nowrap;
}

.smvp-cat.active{
background:#000;
color:#fff;
border-color:#000;
}


/* =====================================================
LAYOUT
===================================================== */

.smvp-layout{
display:flex;
align-items:flex-start;
margin-top:0;
width:100%;
}

.smvp-content{
flex:1;
padding:25px 20px 80px 10px;
margin-left:0;
}


/* =====================================================
SIDEBAR
===================================================== */

.smvp-sidebar{
width:230px;
background:#fff;
border-right:1px solid #e5e5e5;
height:100vh;
padding:20px;

position:fixed;
left:0;
top:0;

transform:translateX(-100%);
transition:transform .3s ease;

z-index:9999;
}

.smvp-sidebar.active{
transform:translateX(0);
}

.smvp-sidebar a{
display:block;
padding:12px 10px;
color:#333;
text-decoration:none;
border-radius:6px;
margin-bottom:5px;
}

.smvp-sidebar a:hover{
background:#f2f2f2;
}


/* =====================================================
VIDEO GRID
===================================================== */

.smvp-video-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
gap:25px;
margin-top:20px;
}

.smvp-video-card{
background:#fff;
border-radius:10px;
overflow:hidden;
box-shadow:0 2px 10px rgba(0,0,0,0.08);
transition:transform .2s ease;
cursor:pointer;
}

.smvp-video-card:hover{
transform:translateY(-3px);
}

.smvp-video-card img{
width:100%;
height:180px;
object-fit:cover;
display:block;
}

.smvp-video-title{
font-size:14px;
padding:10px;
line-height:1.4;
}


/* =====================================================
VIDEO ACTIONS
===================================================== */

.smvp-actions{
display:flex;
gap:15px;
padding:8px 10px 12px;
font-size:14px;
color:#555;

position:relative;
z-index:5;
}

.smvp-like-btn{
cursor:pointer;
position:relative;
z-index:10;
}

.smvp-like-btn:hover{
color:red;
}

.smvp-comment-btn{
cursor:pointer;
}


/* =====================================================
VIDEO PROGRESS BAR
===================================================== */

.smvp-progress-bar{
width:100%;
height:4px;
background:#e5e5e5;
border-radius:3px;
margin-top:6px;
overflow:hidden;
}

.smvp-progress-fill{
height:100%;
background:#ff0000;
transition:width .3s ease;
}


/* =====================================================
SHORT VIDEOS SCROLL
===================================================== */

.smvp-horizontal-scroll{
display:flex;
gap:14px;
overflow-x:auto;
padding-bottom:10px;
margin-top:20px;
scroll-snap-type:x mandatory;
}

.smvp-horizontal-scroll::-webkit-scrollbar{
height:6px;
}

.smvp-horizontal-scroll::-webkit-scrollbar-thumb{
background:#ccc;
border-radius:4px;
}

.smvp-horizontal-scroll .smvp-video-card{
min-width:160px;
max-width:160px;
flex:0 0 auto;
border-radius:12px;
overflow:hidden;
scroll-snap-align:start;
}

.smvp-horizontal-scroll .smvp-video-card img{
width:100%;
height:280px;
object-fit:cover;
}


/* =====================================================
COMMENTS
===================================================== */

.smvp-comments textarea{
width:100%;
height:80px;
margin-top:10px;
padding:10px;
}

.smvp-comment{
background:#f5f5f5;
padding:10px;
margin-top:10px;
border-radius:6px;
}


/* =====================================================
LOGIN PAGE
===================================================== */

.smvp-login-wrapper{
display:flex;
justify-content:center;
align-items:center;
padding:80px 20px;
}

.smvp-login-box{
background:#fff;
padding:40px;
width:420px;
border-radius:10px;
box-shadow:0 10px 25px rgba(0,0,0,0.1);
margin:auto;
}

.smvp-login-box h2{
text-align:center;
margin-bottom:5px;
}

.smvp-login-subtitle{
text-align:center;
margin-bottom:25px;
color:#777;
}

.smvp-login-box input[type="text"],
.smvp-login-box input[type="password"]{
width:100%;
padding:12px;
border:1px solid #ddd;
border-radius:6px;
margin-bottom:15px;
}

.smvp-login-box .login-submit input{
width:100%;
background:#4f46e5;
border:none;
color:#fff;
padding:12px;
border-radius:6px;
cursor:pointer;
}

.smvp-login-box .login-submit input:hover{
background:#4338ca;
}


/* =====================================================
BOTTOM MOBILE NAV
===================================================== */

.smvp-bottom-nav{
position:fixed;
bottom:0;
left:0;
right:0;
height:60px;
background:#fff;
border-top:1px solid #e5e5e5;
display:flex;
justify-content:space-around;
align-items:center;
z-index:99999;
}

.smvp-nav-item{
text-align:center;
font-size:12px;
cursor:pointer;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
}

.smvp-nav-item span:first-child{
font-size:20px;
}

.smvp-nav-item span:last-child{
font-size:11px;
margin-top:2px;
}

@media(min-width:768px){
.smvp-bottom-nav{
display:none;
}
}


/* =====================================================
NO VIDEOS MESSAGE
===================================================== */

#smvp-no-videos{
font-size:16px;
margin-top:40px;
opacity:0.7;
text-align:center;
}


/* =====================================================
THEME OVERRIDE
===================================================== */

.page-header,
.entry-header,
.entry-title,
.ast-page-header,
.site-header{
display:none !important;
}

.site-content,
.entry-content,
.content-area{
margin-top:0 !important;
padding-top:0 !important;
}

.ast-container{
padding-left:5px !important;
padding-right:10px !important;
}

html, body{
overflow-x:hidden;
}

/* REMOVE WORDPRESS ADMIN BAR GAP */

body.admin-bar{
margin-top:0 !important;
}

#wpadminbar{
display:none !important;
}

/* ASTRA ADMIN BAR SPACER FIX */

.ast-above-header-wrap{
display:none !important;
}

.ast-header-break-point{
margin-top:0 !important;
padding-top:0 !important;
}

.ast-container{
padding-top:0 !important;
margin-top:0 !important;
}

/* REMOVE ASTRA PAGE TOP SPACE */

.ast-container{
margin-top:0 !important;
padding-top:0 !important;
}

.ast-plain-container{
margin-top:0 !important;
padding-top:0 !important;
}

.site-content{
margin-top:0 !important;
padding-top:0 !important;
}

.entry-content{
margin-top:0 !important;
padding-top:0 !important;
}

/* =========================================
REMOVE ADMIN BAR OFFSET COMPLETELY
========================================= */

html.admin-bar{
margin-top:0 !important;
}

body.admin-bar{
margin-top:0 !important;
padding-top:0 !important;
}

#wpadminbar{
display:none !important;
}

/* =====================================
FINAL ASTRA GAP FIX
===================================== */

.entry-content > *:first-child{
margin-top:0 !important;
padding-top:0 !important;
}

.entry-content{
margin:0 !important;
padding:0 !important;
}

.site-main{
margin-top:0 !important;
padding-top:0 !important;
}

html{
margin-top:0 !important;
}


.smvp-video-card {
    display: block;
    text-decoration: none;
    color: inherit;
}


.smvp-video-card a{
display:block;
position:relative;
z-index:1;
}

.smvp-video-card{
position:relative;
}

.smvp-watermark {
    position: absolute;
    z-index: 9999;
    color: rgba(255,255,255,0.85);
    font-size: 13px;
    pointer-events: none;
    user-select: none;
    transition: all 1s ease;

    /* 🔥 visibility boost */
    text-shadow: 0 0 6px rgba(0,0,0,0.8);
    background: rgba(0,0,0,0.25);
    padding: 6px 10px;
    border-radius: 6px;
}

.smvp-watermark .wm-line {
    margin-bottom: 2px;
}

.smvp-video-wrapper {
    position: relative;
    width: 100%;
    height: 450px;
    overflow: hidden;
}

body {
    user-select: none;
}

.smvp-click-block {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    z-index: 5;

    pointer-events: none; /* 🔥 initially allow clicks */
}

/* ===============================
SECTION TITLES (FINAL UI POLISH)
================================ */

.smvp-section-title{
    font-size: 22px;              /* 🔥 Reduced from big size */
    font-weight: 600;
    color: #222;
    margin: 25px 0 12px;
    padding-left: 6px;
    letter-spacing: 0.3px;
}

/* Continue Watching special */
.smvp-continue-section .smvp-section-title{
    font-size: 24px;
    font-weight: 700;
    color: #111;
}

/* ===============================
CATEGORY BUTTONS
================================ */

.smvp-category-bar{
    margin: 15px 0 20px;
}

.smvp-cat{
    font-size: 13px;
    padding: 6px 14px;
    border-radius: 20px;
    border: 1px solid #ddd;
    background: #f5f5f5;
    cursor: pointer;
    transition: all 0.2s ease;
}

.smvp-cat.active{
    background: #111;
    color: #fff;
    border-color: #111;
}

/* ===============================
VIDEO TITLE
================================ */

.smvp-video-title{
    font-size: 14px;
    font-weight: 500;
    color: #333;
    line-height: 1.4;
    margin-top: 6px;
}

/* ===============================
GLOBAL SPACING FIX
================================ */

.smvp-content{
    max-width: 1100px;
    margin: auto;
}