/* VidShare — Premium theme */
:root{
  --bg:#0b0d12; --bg-2:#11141b; --surface:rgba(255,255,255,.04);
  --text:#e9ecf2; --muted:#9aa3b2; --border:rgba(255,255,255,.08);
  --primary:#7c5cff; --primary-2:#22d3ee; --accent:#ff4d8d;
  --grad: linear-gradient(135deg,#7c5cff 0%,#22d3ee 100%);
  --grad-hero: radial-gradient(1200px 600px at 10% 0%,rgba(124,92,255,.35),transparent 60%),
               radial-gradient(900px 500px at 90% 10%,rgba(34,211,238,.25),transparent 60%),
               radial-gradient(700px 400px at 50% 100%,rgba(255,77,141,.25),transparent 60%);
}
[data-bs-theme="light"]{
  --bg:#f7f8fb; --bg-2:#ffffff; --surface:rgba(0,0,0,.03);
  --text:#0f1220; --muted:#5b6472; --border:rgba(0,0,0,.08);
}
html,body{background:var(--bg);color:var(--text);font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;}
body{min-height:100vh;background-image:var(--grad-hero);background-attachment:fixed;background-repeat:no-repeat}
a{color:inherit;text-decoration:none;transition:.2s}
a:hover{color:var(--primary-2)}
.text-muted-2{color:var(--muted)!important}

/* Nav */
.glass-nav{backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);background:rgba(11,13,18,.55);border-bottom:1px solid var(--border)}
[data-bs-theme="light"] .glass-nav{background:rgba(255,255,255,.7)}
.navbar-brand{font-size:1.25rem}
.brand-mark{width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:var(--grad);color:#fff;font-size:1.1rem;box-shadow:0 8px 24px rgba(124,92,255,.35)}
.nav-link{color:var(--text)!important;opacity:.85;font-weight:500}
.nav-link:hover{opacity:1}
.glass-dd{backdrop-filter:blur(18px);background:rgba(17,20,27,.85);border:1px solid var(--border)}
[data-bs-theme="light"] .glass-dd{background:rgba(255,255,255,.95)}
.dropdown-item{color:var(--text)}
.dropdown-item:hover{background:var(--surface);color:var(--primary-2)}

/* Hero */
.hero{padding:5rem 0 3rem;position:relative}
.hero h1{font-size:clamp(2rem,5vw,3.6rem);font-weight:800;letter-spacing:-.02em;line-height:1.05}
.hero .grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{font-size:1.1rem;color:var(--muted);max-width:640px}
.search-wrap{max-width:680px}
.search-wrap .form-control{background:rgba(255,255,255,.06);border:1px solid var(--border);color:var(--text);height:56px;border-radius:16px;padding-left:3rem}
.search-wrap .form-control:focus{background:rgba(255,255,255,.09);border-color:var(--primary);box-shadow:0 0 0 4px rgba(124,92,255,.15);color:var(--text)}
.search-wrap .bi-search{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--muted)}
.search-results{position:absolute;top:calc(100% + 6px);left:0;right:0;background:rgba(17,20,27,.95);backdrop-filter:blur(14px);border:1px solid var(--border);border-radius:14px;overflow:hidden;max-height:60vh;overflow-y:auto;z-index:50;display:none}
[data-bs-theme="light"] .search-results{background:rgba(255,255,255,.98)}
.search-results a{display:flex;gap:.75rem;padding:.6rem .8rem;border-bottom:1px solid var(--border)}
.search-results a:hover{background:var(--surface)}
.search-results img{width:80px;height:48px;object-fit:cover;border-radius:8px}

/* Section */
.section{padding:3rem 0}
.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem}
.section-title h2{font-size:1.5rem;font-weight:700;margin:0}
.section-title a{color:var(--primary-2);font-weight:600;font-size:.9rem}

/* Category chips */
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{display:inline-flex;padding:.5rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:999px;font-weight:500;font-size:.85rem;transition:.2s}
.chip:hover{background:var(--grad);color:#fff;border-color:transparent;transform:translateY(-2px)}

/* Video card */
.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.25rem}
.video-card{background:var(--bg-2);border:1px solid var(--border);border-radius:18px;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease;position:relative}
.video-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(0,0,0,.35)}
.video-thumb{position:relative;aspect-ratio:16/10;overflow:hidden;background:#000}
.video-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.video-card:hover .video-thumb img{transform:scale(1.06)}
.video-thumb .duration{position:absolute;bottom:8px;right:8px;background:rgba(0,0,0,.75);color:#fff;padding:.15rem .5rem;border-radius:6px;font-size:.75rem;font-weight:600}
.video-thumb .play-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:.25s;background:linear-gradient(180deg,transparent,rgba(0,0,0,.4))}
.video-card:hover .play-overlay{opacity:1}
.play-overlay i{font-size:3rem;color:#fff;filter:drop-shadow(0 4px 12px rgba(0,0,0,.5))}
.video-body{padding:.9rem 1rem 1rem}
.video-body h3{font-size:1rem;font-weight:600;margin:0 0 .35rem;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.video-body h3 a{color:var(--text)}
.video-meta{display:flex;flex-wrap:wrap;gap:.5rem .75rem;color:var(--muted);font-size:.8rem;margin-bottom:.5rem}
.video-meta .badge-cat{background:var(--surface);border:1px solid var(--border);padding:.2rem .5rem;border-radius:6px}
.video-actions{display:flex;justify-content:space-between;align-items:center;padding-top:.5rem;border-top:1px dashed var(--border)}
.video-actions .btn{border-radius:10px;font-weight:600;font-size:.8rem;padding:.35rem .75rem}
.btn-grad{background:var(--grad);color:#fff!important;border:none}
.btn-grad:hover{filter:brightness(1.1);color:#fff}

/* Player page */
.player-wrap{background:#000;border-radius:18px;overflow:hidden;border:1px solid var(--border);box-shadow:0 30px 60px rgba(0,0,0,.5)}
.player-wrap video{width:100%;display:block;max-height:75vh}
.video-info{background:var(--bg-2);border:1px solid var(--border);border-radius:18px;padding:1.5rem;margin-top:1rem}
.video-info h1{font-size:1.5rem;font-weight:700;margin-bottom:.75rem}
.meta-row{display:flex;flex-wrap:wrap;gap:1rem;color:var(--muted);font-size:.9rem;margin-bottom:1rem}
.meta-row span i{color:var(--primary-2)}
.share-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
.share-row a{display:inline-flex;align-items:center;gap:.35rem;padding:.5rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:10px;font-size:.85rem}
.share-row a:hover{background:var(--grad);color:#fff;border-color:transparent}

/* Sidebar related */
.related-list{display:flex;flex-direction:column;gap:.75rem}
.related-item{display:flex;gap:.75rem;padding:.5rem;border-radius:12px;border:1px solid var(--border);background:var(--bg-2);transition:.2s}
.related-item:hover{background:var(--surface)}
.related-item img{width:130px;height:76px;object-fit:cover;border-radius:8px;flex-shrink:0}
.related-item h4{font-size:.9rem;font-weight:600;margin:0 0 .25rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.related-item .meta{color:var(--muted);font-size:.75rem}

/* Footer */
.site-footer{background:var(--bg-2);border-top:1px solid var(--border);margin-top:4rem}
.site-footer a{color:var(--muted)}
.site-footer a:hover{color:var(--primary-2)}
.social a{width:36px;height:36px;border-radius:10px;background:var(--surface);border:1px solid var(--border);display:inline-flex;align-items:center;justify-content:center}
.social a:hover{background:var(--grad);color:#fff!important;border-color:transparent}

/* Admin */
.admin-shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}
.admin-side{background:var(--bg-2);border-right:1px solid var(--border);padding:1.25rem}
.admin-side .brand{font-weight:800;font-size:1.2rem;display:flex;align-items:center;gap:.5rem;padding-bottom:1.25rem;border-bottom:1px solid var(--border);margin-bottom:1rem}
.admin-side nav a{display:flex;align-items:center;gap:.6rem;padding:.65rem .85rem;border-radius:10px;color:var(--text);opacity:.85;margin-bottom:.15rem;font-weight:500;font-size:.9rem}
.admin-side nav a:hover,.admin-side nav a.active{background:var(--surface);opacity:1;color:var(--primary-2)}
.admin-main{padding:1.5rem 2rem}
.admin-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}
.card-stat{background:var(--bg-2);border:1px solid var(--border);border-radius:16px;padding:1.25rem}
.card-stat .label{color:var(--muted);font-size:.85rem;font-weight:500}
.card-stat .value{font-size:1.75rem;font-weight:700;margin-top:.25rem}
.admin-panel{background:var(--bg-2);border:1px solid var(--border);border-radius:16px;padding:1.5rem}
.form-control,.form-select{background:var(--surface);border:1px solid var(--border);color:var(--text)}
.form-control:focus,.form-select:focus{background:var(--surface);color:var(--text);border-color:var(--primary);box-shadow:0 0 0 4px rgba(124,92,255,.15)}
.form-label{font-weight:600;font-size:.9rem;margin-bottom:.35rem}
.table{color:var(--text)}
.table > :not(caption) > * > *{background:transparent;border-bottom-color:var(--border)}
.btn-primary{background:var(--grad);border:none}
.btn-primary:hover{filter:brightness(1.1)}
@media (max-width: 900px){.admin-shell{grid-template-columns:1fr}.admin-side{position:sticky;top:0;z-index:10;border-right:none;border-bottom:1px solid var(--border)}}

/* Auth */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem}
.auth-card{background:var(--bg-2);border:1px solid var(--border);border-radius:20px;padding:2.25rem;max-width:420px;width:100%;box-shadow:0 30px 60px rgba(0,0,0,.4)}
.auth-card h1{font-size:1.5rem;font-weight:700;margin-bottom:.35rem}

/* Utilities */
.spin-load{display:inline-block;width:22px;height:22px;border:3px solid var(--surface);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.fade-in{animation:fade .4s ease both}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
