/*
Theme Name: VideoTube Child
Description: VideoTube - Dark Mode Edition
Author: Toan Nguyen
Theme URI: http://themeforest.net/item/videotube-a-responsive-video-wordpress-theme/7214445?ref=phpface
Author URI: http://themeforest.net/user/phpface
Version: 3.0
Template: videotube
License: Themeforest Licence
License URI: http://themeforest.net/licenses
Text Domain: mars
Tags: dark, video, responsive, two-columns, right-sidebar
*/

body { background: #121212; color: #e0e0e0; }
a { color: #bb86fc; }
a:hover { color: #dbbaff; }

#header { background: #000 !important; border-bottom: 1px solid #222 !important; }
#logo { border-right: 1px solid #222 !important; box-shadow: none !important; }
#header-social { border-left: 1px solid #222 !important; box-shadow: none !important; }
#header-search input { color: #ccc; }
#header-social a { color: #666 !important; }
#header-social a:hover { color: #bb86fc !important; }
#navigation-wrapper { background: #1a1a1a !important; }
.dropdown-menu { background: #1a1a1a !important; }
.section-header h3, .section-header .page-title { color: #aaa; }
.featured-wrapper { background: #1a1a1a; }

.item {
    background: #1e1e1e;
    border: 1px solid #333;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 20px;
    transition: all 0.3s ease;
}
.item:hover {
    border-color: #bb86fc;
    box-shadow: 0 6px 20px rgba(187,134,252,0.15);
    background: #252525;
    transform: translateY(-2px);
}
.item h3 { margin-top: 8px !important; }
.item h3 a { color: #fff !important; font-size: 14px !important; text-decoration: none; }
.item h3 a:hover { color: #bb86fc !important; }
.item .meta { color: #888 !important; }
.item-img { border-radius: 6px; overflow: hidden; }

.widget h4.widget-title, .sidebar .widget .widgettitle { background: #bb86fc !important; }
.widget ul li a { color: #ccc !important; }
.widget select { background: #333; color: #ccc; border-color: #444; }
.tag-cloud-link, a.tag { background: #333 !important; color: #aaa !important; }
.tagcloud a { background: #333 !important; }
.tagcloud a:hover { background: #bb86fc !important; color: #fff !important; }
#footer { background: #0a0a0a !important; }
#footer .widget p { color: #666; }
#footer .widget a.tag { background: #222 !important; color: #888 !important; }
#footer .mars-keycloud-widgets a { background: #222 !important; color: #888 !important; }
#footer .mars-keycloud-widgets a:hover { background: #bb86fc !important; color: #fff !important; }
.video-wrapper { background: #0a0a0a !important; }
.video-info h1 { color: #fff; }
#breadcrumbs, #breadcrumbs a { color: #888; }
.video-options .option { border: 1px solid #333 !important; background: #1e1e1e; color: #888; }
.video-options .option:hover { border-color: #bb86fc !important; color: #fff; }
.post .post-header h2 a { color: #fff !important; }
.post .post-header .post-meta { color: #888 !important; }
a.viewmore { background: #bb86fc !important; }
.post-entry a.readmore { background: #bb86fc !important; }
.sorting li.active a, .sorting li:hover > a { background: #bb86fc !important; }
.pagination span.current, .pagination>.active>a { background: #bb86fc !important; border-color: #bb86fc !important; }
input, textarea, select { background: #333; color: #ccc; border: 1px solid #444; }
.social-counter-item i { background: #333 !important; color: #888 !important; }
.channel-header, .profile-widget-header { border: 1px solid #333 !important; background: #1e1e1e; }
.wp-caption { background: #1e1e1e !important; border-color: #333 !important; }

/* ===== Change H1 Video title ===== */
.video-info.small h1 {color: #f9f9f9;}

/* ===== PAGINATION ===== */
.pagination-wrap { margin: 30px 0; text-align: center; }
.pagination-wrap ul.page-numbers { list-style: none; margin: 0; padding: 0; display: inline-flex; gap: 6px; flex-wrap: wrap; justify-content: center; }
.pagination-wrap ul.page-numbers li { display: inline-block; margin: 0; }
.pagination-wrap .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 12px; background: #1e1e1e; color: #ccc; border: 1px solid #333; border-radius: 8px; font-size: 14px; font-weight: 600; transition: all .25s ease; text-decoration: none; line-height: 40px; }
.pagination-wrap .page-numbers:hover { background: #bb86fc; color: #fff; border-color: #bb86fc; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(187,134,252,0.3); }
.pagination-wrap .page-numbers.current { background: #bb86fc; color: #fff; border-color: #bb86fc; cursor: default; box-shadow: 0 4px 12px rgba(187,134,252,0.3); }
.pagination-wrap .page-numbers.dots { background: transparent; border: none; color: #666; min-width: 24px; }
.pagination-wrap .page-numbers.prev,
.pagination-wrap .page-numbers.next { font-size: 13px; padding: 0 16px; }