:root {
    --mtv-bg: #0b0d12;
    --mtv-surface: #151823;
    --mtv-surface-2: #1d2130;
    --mtv-border: #262b3a;
    --mtv-primary: #6c5ce7;
    --mtv-accent: #00d1b2;
    --bs-primary: #6c5ce7;
}

body {
    background: var(--mtv-bg);
    color: #e6e8ee;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

main { flex: 1 0 auto; }

/* Navbar */
.mtv-navbar {
    background: rgba(13, 15, 22, 0.92);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--mtv-border);
}
.navbar-brand { letter-spacing: .5px; }
/* Flag chips in the language switch */
.navbar .fi, .dropdown-menu .fi { border-radius: 3px; box-shadow: 0 0 0 1px rgba(255,255,255,.12); }
.navbar-toggler:focus { box-shadow: none; }

/* Homepage search bar */
.mtv-home-search {
    display: flex; align-items: center; gap: .5rem;
    max-width: 760px; margin: 0 auto;
    background: var(--mtv-surface);
    border: 1px solid var(--mtv-border);
    border-radius: 999px;
    padding: .4rem .4rem .4rem 1.1rem;
    transition: border-color .2s, box-shadow .2s;
}
.mtv-home-search:focus-within {
    border-color: var(--mtv-primary);
    box-shadow: 0 0 0 .2rem rgba(108, 92, 231, .25);
}
.mtv-home-search > .bi { color: #8b90a0; font-size: 1.15rem; }
.mtv-home-search input {
    flex: 1; min-width: 0; background: transparent; border: 0; outline: none;
    color: #e6e8ee; font-size: 1rem; padding: .3rem 0;
}
.mtv-home-search input::placeholder { color: #8b90a0; }
.mtv-home-search .btn { border-radius: 999px; padding-inline: 1.25rem; white-space: nowrap; }

/* Category mega dropdown */
.mtv-mega {
    min-width: min(94vw, 680px);
    background: var(--mtv-surface);
    border: 1px solid var(--mtv-border);
    border-radius: .9rem;
}
/* Desktop: widen the dropdown so the category grid fits 6 columns per row
   (col-lg-2). Mobile/tablet keep the narrower, fewer-per-row layout. */
@media (min-width: 992px) {
    .mtv-mega { min-width: min(96vw, 1000px); }
}
.mtv-mega .mega-head {
    display: block; font-weight: 600; color: #fff;
    padding-bottom: .35rem; margin-bottom: .4rem;
    border-bottom: 1px solid var(--mtv-border);
}
.mtv-mega .mega-head:hover { color: var(--mtv-accent); }
.mtv-mega .mega-list { list-style: none; padding: 0; margin: 0; }
.mtv-mega .mega-list a { display: block; color: #c7cbd6; padding: .2rem 0; font-size: .9rem; }
.mtv-mega .mega-list a:hover { color: var(--mtv-accent); }

/* Buttons / primary accent */
.btn-primary {
    --bs-btn-bg: var(--mtv-primary);
    --bs-btn-border-color: var(--mtv-primary);
    --bs-btn-hover-bg: #5a4bd6;
    --bs-btn-hover-border-color: #5a4bd6;
    --bs-btn-active-bg: #5a4bd6;
}
.text-primary { color: var(--mtv-primary) !important; }

/* Cards / surfaces */
.card {
    background: var(--mtv-surface);
    border: 1px solid var(--mtv-border);
    border-radius: .9rem;
}
.mtv-surface-2 { background: var(--mtv-surface-2); border: 1px solid var(--mtv-border); }
.form-control, .form-select {
    background: var(--mtv-surface-2);
    border-color: var(--mtv-border);
    color: #e6e8ee;
}
.form-control:focus, .form-select:focus {
    background: var(--mtv-surface-2);
    color: #fff;
    border-color: var(--mtv-primary);
    box-shadow: 0 0 0 .2rem rgba(108, 92, 231, .25);
}
.table { --bs-table-bg: transparent; --bs-table-color: #e6e8ee; }

/* Hero */
.mtv-hero {
    background: radial-gradient(1200px 400px at 20% -10%, rgba(108,92,231,.35), transparent),
                radial-gradient(900px 400px at 90% 0%, rgba(0,209,178,.18), transparent),
                var(--mtv-surface);
    border: 1px solid var(--mtv-border);
    border-radius: 1.25rem;
    padding: 3rem 2rem;
}

/* Video card */
.video-card { transition: transform .15s ease, box-shadow .15s ease; overflow: hidden; }
.video-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(0,0,0,.45); }
.video-thumb { position: relative; aspect-ratio: 16/9; background: #000; overflow: hidden; }
.video-thumb img { width: 100%; height: 100%; object-fit: cover; }
.video-thumb .play-ico {
    position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
    font-size: 2.5rem; color: #fff; opacity: 0; transition: opacity .2s; background: rgba(0,0,0,.25);
}
.video-card:hover .play-ico { opacity: 1; }

/* Rating badge (admin-set score) + duration chip on thumbnails */
.mtv-rating {
    display: inline-flex; align-items: center; gap: .2rem;
    background: rgba(0,0,0,.65); color: #f1c40f;
    padding: .12rem .45rem; border-radius: 6px; font-size: .78rem; font-weight: 700;
}
.mtv-duration {
    position: absolute; right: .5rem; bottom: .5rem;
    display: inline-flex; align-items: center; gap: .2rem;
    background: rgba(0,0,0,.65); color: #fff;
    padding: .1rem .4rem; border-radius: 6px; font-size: .72rem;
}

/* Designed confirmation modal */
.mtv-confirm {
    background: var(--mtv-surface);
    border: 1px solid var(--mtv-border);
    border-radius: 1rem;
}
.mtv-confirm-icon {
    width: 64px; height: 64px; margin: 0 auto;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%; font-size: 1.6rem; color: #fff;
    background: linear-gradient(135deg, var(--mtv-primary), var(--mtv-accent));
}
.mtv-confirm-icon-warn { background: linear-gradient(135deg, #f0883e, #e0566f); }
.mtv-confirm-amount {
    font-size: 1.9rem; font-weight: 700; color: var(--mtv-accent);
}

/* Ad slots */
.mtv-ad-slot { display: flex; flex-direction: column; gap: .75rem; }
.mtv-ad {
    position: relative; border-radius: 12px; overflow: hidden;
    border: 1px solid var(--mtv-border); background: var(--mtv-surface-2);
}
.mtv-ad img { display: block; width: 100%; height: auto; }
.mtv-ad-tag {
    position: absolute; top: .4rem; right: .4rem;
    background: rgba(0,0,0,.6); color: #cbd0da;
    font-size: .65rem; line-height: 1; padding: .2rem .4rem; border-radius: 4px;
}

/* Type badges */
.badge-free    { background: #2ecc71; }
.badge-normal  { background: #3498db; }
.badge-premium { background: linear-gradient(90deg, #f1c40f, #e67e22); color:#111; }

/* Star level pill */
.star-pill {
    display: inline-flex; align-items: center; gap:.25rem;
    background: linear-gradient(90deg, #6c5ce7, #00d1b2);
    color: #fff; padding: .25rem .7rem; border-radius: 999px; font-weight: 600;
}

/* Player overlay */
.player-wrap { position: relative; background:#000; border-radius:.75rem; overflow:hidden; }
.player-wrap video { width: 100%; display:block; }
.player-lock {
    position:absolute; inset:0; display:none; flex-direction:column; gap:1rem;
    align-items:center; justify-content:center; text-align:center; padding:2rem;
    background: rgba(8,10,15,.92); backdrop-filter: blur(6px); z-index: 5;
}
.player-lock.show { display:flex; }

/* Plan card */
.plan-card.featured { border-color: var(--mtv-primary); box-shadow: 0 0 0 1px var(--mtv-primary) inset; }
.plan-price { font-size: 2rem; font-weight: 700; }

/* Stat tiles */
.stat-tile { background: var(--mtv-surface-2); border:1px solid var(--mtv-border); border-radius:.9rem; padding:1.1rem 1.25rem; }
.stat-tile .label { color:#8b90a0; font-size:.8rem; text-transform:uppercase; letter-spacing:.5px; }
.stat-tile .value { font-size:1.5rem; font-weight:700; }

.mtv-footer { border-top:1px solid var(--mtv-border); background: var(--mtv-surface); }

a { text-decoration: none; }
a:hover { color: var(--mtv-accent); }

.progress { background: var(--mtv-surface-2); }

/* Team tree */
.team-tree { list-style: none; margin: 0; padding-left: 1.25rem; }
.team-tree .team-tree { border-left: 1px dashed var(--mtv-border); margin-left: .5rem; }
.team-tree li { position: relative; padding: .25rem 0; }
.team-tree .tree-node {
    display: inline-flex; align-items: center; gap: .35rem;
    background: var(--mtv-surface-2); border: 1px solid var(--mtv-border);
    border-radius: .6rem; padding: .35rem .65rem;
}
.team-tree li::before {
    content: ""; position: absolute; left: -.78rem; top: 1.1rem;
    width: .7rem; height: 1px; background: var(--mtv-border);
}