:root{
    --bg:#080d18;
    --panel:#111827;
    --panel2:#172033;
    --line:#26334a;
    --text:#eef2ff;
    --muted:#94a3b8;
    --blue:#3b82f6;
    --blue2:#2563eb;
    --green:#22c55e;
    --red:#ef4444;
    --yellow:#f59e0b;
}

*{box-sizing:border-box}

body{
    margin:0!important;
    background:
      radial-gradient(circle at 20% 0%,#13203b 0,transparent 35%),
      var(--bg)!important;
    color:var(--text)!important;
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}

header{
    background:rgba(17,24,39,.93)!important;
    border-bottom:1px solid var(--line)!important;
    backdrop-filter:blur(10px);
}

main{
    max-width:1380px!important;
}

.card,.tablewrap{
    background:rgba(17,24,39,.96)!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
}

.card{
    padding:24px!important;
}

a{
    color:#93c5fd!important;
}

.btn,button{
    border:0!important;
    border-radius:9px!important;
    padding:11px 16px!important;
    font-weight:600!important;
    transition:.15s ease!important;
}

button:hover,.btn:hover{
    filter:brightness(1.12);
}

.publish{
    background:var(--blue2)!important;
    color:white!important;
}

.secondary{
    background:#263247!important;
    color:#f8fafc!important;
}

input,select{
    background:#0b1220!important;
    color:white!important;
    border:1px solid #334155!important;
    border-radius:9px!important;
    padding:12px 13px!important;
}

table{
    border-collapse:collapse;
}

th{
    color:#94a3b8!important;
    font-size:12px!important;
    text-transform:uppercase;
    letter-spacing:.05em;
}

td,th{
    border-bottom:1px solid #26334a!important;
}

.progress-bar{
    background:#263247!important;
    height:18px!important;
    border-radius:20px!important;
}

.progress-fill{
    background:linear-gradient(90deg,#2563eb,#60a5fa)!important;
}

.ready{color:#4ade80!important}
.processing{color:#fbbf24!important}
.error{color:#f87171!important}

.tmdb-box{
    margin:20px 0;
    border:1px solid var(--line);
    border-radius:12px;
    padding:18px;
    background:#0c1424;
}

.tmdb-search{
    display:flex;
    gap:10px;
    margin-top:12px;
}

.tmdb-results{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
    gap:12px;
    margin-top:16px;
}

.tmdb-item{
    display:flex;
    gap:14px;
    padding:13px;
    border:1px solid var(--line);
    background:#111827;
    border-radius:11px;
}

.tmdb-poster{
    width:82px;
    height:123px;
    object-fit:cover;
    border-radius:7px;
    background:#263247;
    flex:none;
}

.tmdb-info{
    min-width:0;
    flex:1;
}

.tmdb-title{
    font-weight:700;
    font-size:15px;
}

.tmdb-meta{
    color:var(--muted);
    font-size:13px;
    margin:5px 0;
}

.tmdb-overview{
    color:#cbd5e1;
    font-size:12px;
    line-height:1.4;
    max-height:52px;
    overflow:hidden;
}

.copy-btn{
    background:#2563eb!important;
    color:white!important;
    margin-left:10px;
}

@media(max-width:700px){
    .tmdb-search{flex-direction:column}
    .tmdb-results{grid-template-columns:1fr}
}

/* =========================================================
   VOD PANEL - COMPACT UI
   ========================================================= */

html{
    font-size:14px;
}

body{
    line-height:1.35;
}

header{
    min-height:48px !important;
    padding:10px 22px !important;
}

header strong,
header .brand{
    font-size:16px !important;
}

main{
    max-width:1500px !important;
    padding:18px 20px !important;
}

/* Genel kartlar */
.card{
    padding:16px !important;
    border-radius:11px !important;
}

.tablewrap{
    border-radius:11px !important;
}

/* Başlık boşlukları */
h1{
    font-size:24px !important;
    margin:0 0 3px !important;
}

h2{
    font-size:18px !important;
}

p{
    margin-top:5px;
}

/* Form elemanları */
input,
select{
    min-height:36px !important;
    padding:8px 10px !important;
}

button,
.btn{
    padding:8px 12px !important;
    border-radius:7px !important;
}

/* Tablolar */
th{
    font-size:10px !important;
}

td,
th{
    padding-top:8px !important;
    padding-bottom:8px !important;
}

.dashboard-table td{
    font-size:12.5px !important;
}

/* Detay sayfası */
.note{
    padding:12px 14px !important;
    margin-top:12px !important;
}

.tmdb-box{
    margin:12px 0 !important;
    padding:14px !important;
}

/* Sunucu dosya gezgini */
.vod-explorer-card{
    padding:14px !important;
}

.explorer-head{
    margin-bottom:8px !important;
}

.explorer-scroll{
    height:300px !important;
}

.explorer-row{
    min-height:34px !important;
    padding:5px 9px !important;
}

/* Mobil */
@media(max-width:900px){
    main{
        padding:12px !important;
    }

    header{
        padding:9px 12px !important;
    }

    .card{
        padding:13px !important;
    }
}



/* ============================================================
   VOD PANEL UNIFIED UI v2
   ============================================================ */

:root{
    --page-width:1180px;
    --bg:#080d18;
    --panel:#111827;
    --panel-soft:#0d1626;
    --border:#27364d;
    --text:#f1f5f9;
    --muted:#94a3b8;
    --accent:#3b82f6;
}

html{
    font-size:14px;
}

body{
    background:var(--bg) !important;
    color:var(--text) !important;
    line-height:1.4 !important;
}

/* ---------- HEADER ---------- */

header{
    min-height:52px !important;
    padding:10px 20px !important;
    border-bottom:1px solid var(--border) !important;
}

header > *{
    max-width:var(--page-width);
}

header strong,
header .brand{
    font-size:16px !important;
}

/* ---------- SAYFA ALANI ---------- */

main{
    width:100% !important;
    max-width:var(--page-width) !important;
    margin:0 auto !important;
    padding:20px 16px 30px !important;
}

/* ---------- TYPOGRAPHY ---------- */

h1{
    font-size:24px !important;
    line-height:1.15 !important;
    margin:0 0 4px !important;
}

h2{
    font-size:19px !important;
    line-height:1.25 !important;
}

.small{
    font-size:12px !important;
    color:var(--muted) !important;
}

/* ---------- CARD ---------- */

.card,
.tablewrap{
    background:var(--panel) !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
}

.card{
    padding:15px !important;
}

/* ---------- BUTTON ---------- */

button,
.btn{
    min-height:36px !important;
    padding:8px 12px !important;
    border-radius:7px !important;
    font-size:13px !important;
    font-weight:600 !important;
}

.secondary{
    background:#243147 !important;
}

/* ---------- INPUT ---------- */

input,
select{
    min-height:36px !important;
    padding:8px 11px !important;
    font-size:13px !important;
    border-radius:7px !important;
    background:#0b1220 !important;
    border:1px solid #334155 !important;
}

/* ---------- TABLE ---------- */

table{
    width:100%;
}

th{
    font-size:11px !important;
    padding:8px 10px !important;
}

td{
    font-size:13px !important;
    padding:8px 10px !important;
}

/* ---------- TMDB ---------- */

.tmdb-box{
    margin:14px 0 !important;
    padding:15px !important;
}

/* ---------- FILE EXPLORER ---------- */

.vod-explorer-card{
    padding:15px !important;
}

.explorer-scroll{
    height:320px !important;
}

.explorer-row{
    min-height:36px !important;
    padding:6px 10px !important;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:900px){

    main{
        padding:12px 10px 22px !important;
    }

    header{
        padding:9px 12px !important;
    }

    .card{
        padding:12px !important;
    }

    h1{
        font-size:21px !important;
    }
}


/* ============================================================
   SEARCH BAR FINAL FIX
   ============================================================ */

.movie-toolbar{
    max-width:1050px !important;
    width:100% !important;
    margin:10px auto 7px !important;
}

.movie-search-form{
    display:flex !important;
    align-items:center !important;
    gap:7px !important;
    width:100% !important;
    max-width:800px !important;
}

.search-wrap{
    position:relative !important;
    flex:1 !important;
}

.search-wrap .search-icon{
    position:absolute !important;
    left:12px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    z-index:2 !important;
    color:#64748b !important;
    font-size:15px !important;
    line-height:1 !important;
    pointer-events:none !important;
}

.search-wrap input{
    width:100% !important;
    height:38px !important;
    padding-left:36px !important;
    background:#0b1220 !important;
    color:#f1f5f9 !important;
    border:1px solid #334155 !important;
}

.toolbar-btn{
    height:38px !important;
    min-height:38px !important;
    padding:0 14px !important;

    background:#243247 !important;
    color:#f8fafc !important;

    border:1px solid #334155 !important;
    border-radius:7px !important;

    font-size:13px !important;
    font-weight:600 !important;
}

.toolbar-btn:hover{
    background:#30415d !important;
}

.movie-list-meta{
    margin-left:auto !important;
    display:flex !important;
    align-items:center !important;
    gap:9px !important;
}

/* Tablo ve toolbar aynı genişlik */
.tablewrap,
.movie-toolbar,
.pagination{
    max-width:1050px !important;
}

/* Mobil */
@media(max-width:900px){
    .movie-toolbar{
        max-width:none !important;
    }

    .movie-search-form{
        max-width:none !important;
    }
}

