/* Dark theme overlay — auto-generated from the former hype-blog-dark
   template's css/styles.css + css/engine.css by diffing them rule-by-rule
   against hype-blog-light's own stylesheets and rescoping every selector
   that actually differed under html[data-theme="dark"]. Faithful to the
   original dark palette (not hand-reinterpreted) — rules identical between
   the two source themes were dropped since they need no override, and
   font-face/keyframes blocks were skipped as theme-irrelevant.
   Toggled by js/theme-toggle.js. Regenerate instead of hand-editing if the
   source dark theme ever changes again. */

/* ---- theme-toggle button (new element, not part of the original
   themes — colored to match the dark palette's own circular icon
   buttons, e.g. #gotop/.owl-prev) ---- */
html[data-theme="dark"] .theme-toggle {background-color: #1c272d; color: #eee;}
html[data-theme="dark"] .theme-toggle:hover {background-color: #eb4d4b; color: #fff;}

/* ---- from styles.css ---- */

html[data-theme="dark"] body {font: 15px 'Montserrat', sans-serif; line-height: normal; padding: 0; margin: 0;        
color: #eee; background: #060606; min-height: 100%; width: 100%; font-weight: 400;}
html[data-theme="dark"] a {color: #eee; text-decoration: none;}
html[data-theme="dark"] a:hover, html[data-theme="dark"] a:focus {color: #e056fd; text-decoration: none;}
html[data-theme="dark"] .button, html[data-theme="dark"] .btn, html[data-theme="dark"] .pagi-load a, html[data-theme="dark"] .up-second li a, html[data-theme="dark"] .usp-edit a, html[data-theme="dark"] .qq-upload-button, html[data-theme="dark"] button:not(.color-btn):not([class*=fr]):not(.search-btn):not([class*=owl-]), html[data-theme="dark"] input[type="button"], html[data-theme="dark"] input[type="reset"], html[data-theme="dark"] input[type="submit"], html[data-theme="dark"] .meta-fav a, html[data-theme="dark"] .usp-btn a {display: inline-block; text-align: center; padding: 0 20px; height: 40px; line-height: 40px;
border-radius: 20px; cursor: pointer; font-weight: 600; box-shadow: 0 23px 57px rgba(0,0,0,0.1);
background-color: #eb4d4b; color:#fff; font-size: 15px;}
html[data-theme="dark"] .button:hover, html[data-theme="dark"] .btn:hover, html[data-theme="dark"] .up-second li a:hover, html[data-theme="dark"] .usp-edit a:hover, html[data-theme="dark"] .qq-upload-button:hover, html[data-theme="dark"] .pagi-load a:hover, html[data-theme="dark"] .usp-btn a:hover, html[data-theme="dark"] button:not(.color-btn):not([class*=fr]):not(.search-btn):not([class*=owl-]):hover, html[data-theme="dark"] input[type="button"]:hover, html[data-theme="dark"] input[type="reset"]:hover, html[data-theme="dark"] input[type="submit"]:hover, html[data-theme="dark"] .meta-fav a:hover {background-color: #ff7979; color: #fff; border-color: #eb4d4b; box-shadow: 0 10px 20px 0 rgba(0,0,0,0);}
html[data-theme="dark"] input[type="text"], html[data-theme="dark"] input[type="password"], html[data-theme="dark"] select, html[data-theme="dark"] textarea {width: 100%; background-color: #2e3e4b; color: #eee; 
box-shadow: inset 0 0 0 1px #000, inset 1px 2px 5px rgba(0,0,0,0.6);}
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder {color: #eee; opacity: 0.8; font-size: 14px;}
html[data-theme="dark"] .wrap-main {background-color: #141319; border-radius: 20px; padding: 0 60px;}
html[data-theme="dark"] #gotop {position:fixed; width:60px; height:60px; line-height:60px; right:10px; bottom:10px;
z-index:990; display:none; background-color:#1c272d; color:#ccc; cursor:pointer; font-size:24px; 
border-radius:50%; text-align:center; box-shadow: 0 23px 57px rgba(0,0,0,0.1);}
html[data-theme="dark"] .logo {display: block; height: 40px; line-height: 40px; color: #eee !important; font-weight: 800; 
	font-size: 24px; text-transform: uppercase; margin-right: 15px;}
html[data-theme="dark"] .logo span {color: #eb4d4b;}
html[data-theme="dark"] .logo span.logo-domain {color: #ccc; font-weight: 500;}
html[data-theme="dark"] .header-menu > li > a:hover, html[data-theme="dark"] .header-menu > li:hover > a {color: #e056fd;}
html[data-theme="dark"] .header-menu li [class*=fa-] {color: #e056fd; margin-right: 10px;}
html[data-theme="dark"] .hidden-menu {background-color: #1c272d; box-shadow: 0 23px 57px rgba(0,0,0,0.2); z-index: 100;
position: absolute; left: -10%; top: 100%; width: 240px; border-radius: 10px;
pointer-events: none; opacity: 0; transform: translateY(30px);}
html[data-theme="dark"] .hidden-menu li a {display: block; padding: 15px 30px; border-bottom: 1px solid rgba(0,0,0,0.8);}
html[data-theme="dark"] .search-box input:not(:focus)::placeholder {color: #eee; opacity: 0.8; font-size: 12px;}
html[data-theme="dark"] .search-box button {position:absolute; right:0px; top:0px; z-index:10; width: 50px; cursor: pointer; 
background: none; color: #eee; line-height: 40px; text-align: center; border-radius: 0 20px 20px 0;}
html[data-theme="dark"] .side-nav > li > a {display: block; border-bottom: 1px solid rgba(0,0,0,0.8); padding: 15px 30px; font-weight: 500;}
html[data-theme="dark"] .side-nav li span {font-size: 13px; opacity: 0.8; 
position: absolute; right: 30px; top: 16px; pointer-events: none;}
html[data-theme="dark"] .side-nav > li > a:hover, html[data-theme="dark"] .side-nav > li:hover > a {background-color: #e056fd; color: #fff;}
html[data-theme="dark"] .lcomm {margin: -0 -30px; padding: 15px 30px; border-bottom: 1px solid rgba(0,0,0,0.8);}
html[data-theme="dark"] .ltext {line-height: 1.3; color: #ccc; font-size: 14px;}
html[data-theme="dark"] .side-subscribe {background-color: #1c272d !important; color: #eee;}
html[data-theme="dark"] .sect-title [class*=fa-], html[data-theme="dark"] .side-bt [class*=fa-], html[data-theme="dark"] .speedbar [class*=fa-] {color: #e056fd; margin-right: 15px;}
html[data-theme="dark"] .sorter, html[data-theme="dark"] .sect-link {position:relative; cursor:pointer; height: 40px; line-height: 40px; margin-left: 15px;
    padding: 0 20px; background-color: #1c272d; border-radius: 20px; font-size: 14px; display: block;}
html[data-theme="dark"] .sorter form {display:none; background-color:#1c272d; padding:10px; line-height:26px; box-shadow:0 0 15px 0 rgba(0,0,0,0.1); 
position:absolute; right:0; top:100%; width:160px; z-index:999; border-radius: 4px;}
html[data-theme="dark"] .sorter:hover, html[data-theme="dark"] .sect-link:hover {background-color: #e056fd; color: #fff;}
html[data-theme="dark"] .tile-img::before {content: ''; position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; 
height: 70%; background: linear-gradient(to top, #000 0%,transparent 100%);}
html[data-theme="dark"] .tile-meta {font-size: 13px; color: #999; margin-top: 17px;}
html[data-theme="dark"] .short-item, html[data-theme="dark"] .sect-bg, html[data-theme="dark"] .side-box, html[data-theme="dark"] .short-thumb, html[data-theme="dark"] .comm-item {box-shadow: 0 23px 57px rgba(0,0,0,0.03); 
	background-color: #1c272d; border-radius: 10px; margin-bottom: 30px; padding: 30px;}
html[data-theme="dark"] .short-text {font-size: 14px; line-height: 1.7; color: #ccc;}
html[data-theme="dark"] .short-tags a {display: inline-block; color: #eee; background: #141319; 
	padding: 0px 10px; border-radius: 15px; margin-right: 3px;}
html[data-theme="dark"] .short-tags a:hover {background-color: #e056fd; color: #fff;}
html[data-theme="dark"] .short-meta {margin: 30px -30px -15px -30px; padding: 15px 15px 0 30px; 
	border-top: 1px solid rgba(0,0,0,0.8); font-size: 13px; color: #999;}
html[data-theme="dark"] .nav-load a {display: block; padding: 0 20px; max-width: 300px; margin: 0 auto;  
	background-color: #eb4d4b; text-align: center; font-size: 17px; font-weight: 500; 
height: 60px; line-height: 60px; border-radius: 30px; margin-top: -30px;}
html[data-theme="dark"] .nav-load a:hover {background-color: #ff7979; color: #fff;}
html[data-theme="dark"] .navigation a, html[data-theme="dark"] .navigation span, html[data-theme="dark"] .pnext a, html[data-theme="dark"] .pprev a, html[data-theme="dark"] .pprev > span, html[data-theme="dark"] .pnext > span {display:inline-block; padding:0 10px; 
margin:0 3px 10px 3px; line-height: 40px; min-width: 40px; background-color: #1c272d; 
box-shadow: 0 23px 57px rgba(0,0,0,0.03); border-radius: 10px; font-weight: 500; font-size: 17px;}
html[data-theme="dark"] .navigation span:not(.nav_ext), html[data-theme="dark"] .pagi-nav a:hover {background-color:#eb4d4b; color: #fff;}
html[data-theme="dark"] .fcat {padding: 0 20px; background-color: #e056fd; color: #fff; border-radius: 20px;
position: absolute; z-index: 10; left: 30px; top: 30px; height: 40px; line-height: 40px;}
html[data-theme="dark"] .fimg::before {content: ''; position: absolute; left: 0; right: 0; bottom: 0; z-index: 5; 
height: 70%; background: linear-gradient(to top, #000 0%,rgba(0,0,0,0) 100%);}
html[data-theme="dark"] .fauthor .short-author {width: 30px; height: 30px; line-height: 30px; font-size: 14px; margin-right: 10px; 
background-color: #141319; border-radius: 50%; color: #ccc; text-align: center;}
html[data-theme="dark"] .fmeta {font-size: 14px; position: absolute; z-index: 10; left: 0; right: 0; bottom: 0; 
	padding: 30px; padding-right: 20px; margin: 0; border: 0; color: #999;}
html[data-theme="dark"] .fmeta a:not(:hover) {color: #999;}
html[data-theme="dark"] .fbtm-one {border-top: 1px solid rgba(0,0,0,0.8); margin: 30px -30px; padding: 30px 30px 0 30px;}
html[data-theme="dark"] .ferror-btns div, html[data-theme="dark"] .faddcomms {margin-right: 6px; background-color: #999; color: #fff; 
	padding: 8px 15px; border-radius: 3px; font-weight: 600;}
html[data-theme="dark"] .ferror-text div span {color: #eb4d4b;}
html[data-theme="dark"] .ffav a {margin: 0 15px; padding-left: 50px; position: relative; display: block; 
	font-size: 13px; color: #999; line-height: 1.3;}
html[data-theme="dark"] .ffav .fal {width: 40px; height: 40px; text-align: center; line-height: 40px !important; cursor: pointer; 
	box-shadow: inset 0 0 0 1px rgba(0,0,0,0.8); border-radius: 50%; font-size: 14px; 
	background: transparent !important; position: absolute; left: 0; top: -2px;}
html[data-theme="dark"] .frating a {margin-left: 15px; display: block; height: 36px; line-height: 36px; padding: 0 10px; 
border: 1px solid rgba(0,0,0,1); border-radius: 1px; box-shadow: 0 1px 3px 0 rgba(0,0,0,.06); font-size: 13px; 
color: #eee; font-weight: 600; background: linear-gradient(to bottom, #444 0%, #444 30%, #111 100%);}
html[data-theme="dark"] .frating-counter {display: inline-block; border-left: 1px solid rgba(0,0,0,1); padding-left: 10px; margin-left: 10px;}
html[data-theme="dark"] .frating a:hover {background: linear-gradient(to top, #444 0%, #444 30%, #111 100%);}
html[data-theme="dark"] .fyadzen-label::after {content: ''; border: 15px solid transparent; border-left-color: #1c272d; 
position: absolute; left: 52px; top: 0px; z-index: 5; transform: scale(0.8,1); transform-origin: left center;}
html[data-theme="dark"] .full-text a {text-decoration:underline; color:#e056fd;}
html[data-theme="dark"] .comm-one > span {margin-right: 15px; color: #ccc;}
html[data-theme="dark"] .comm-one > span.comm-author, html[data-theme="dark"] .comm-one > span.comm-author a {color: #eee; opacity: 1;}
html[data-theme="dark"] .comm-rate3 a {display: inline-block; vertical-align: middle; position: relative; opacity: 0.6;}
html[data-theme="dark"] .login-box {position: fixed; z-index: 999; left: 50%; top: 50%; transform: translate(-50%,-50%); 
background-color: #192229; padding: 30px 60px 40px 60px; border-top: 5px solid #e056fd; width: 400px; 
box-shadow: 0 20px 60px rgba(0,0,0,0.5);}
html[data-theme="dark"] .login-title {font-size: 22px; font-weight: 500; margin-bottom: 15px; text-align: center;}
html[data-theme="dark"] .login-avatar {width: 60px; height: 60px; border-radius: 50%; margin: 0 auto 15px auto; 
text-align: center; line-height: 60px; font-size: 24px; background-color: #111; color: #939393;}
html[data-theme="dark"] .login-btm a {border-bottom: 1px dotted #e056fd; color: #e056fd; font-size: 13px;}
html[data-theme="dark"] .login-check span:before {left: 0; height: 10px; margin-top: -5px; width: 26px; border-radius: 5px; 
	background: #111; box-shadow: inset 0 1px 4px rgba(0,0,0,0.3);}
html[data-theme="dark"] .login-check input:checked + span:before {background-color: #111;}
html[data-theme="dark"] .login-check input:checked + span:after {left: 13px; background-color: #eb4d4b; box-shadow: 0 1px 4px rgba(0,0,0,0.3);}
html[data-theme="dark"] .login-menu {border-top: 1px solid #111; border-left: 1px solid #111;}
html[data-theme="dark"] .login-menu li {text-align: center; border-right: 1px solid #111; border-bottom: 1px solid #111; width: 50%;}
html[data-theme="dark"] .login-soc-title:before, html[data-theme="dark"] .login-soc-title:after {content: ''; height: 1px; background-color: #111; flex: 1;}
html[data-theme="dark"] .owl-prev, html[data-theme="dark"] .owl-next {display: block; cursor: pointer; background-color: #1c272d; color: #eee; box-shadow: none; 
width: 40px; height: 40px; line-height: 40px; border-radius: 50%; text-align: center; 
position: absolute; top: -70px; box-shadow: 0 23px 57px rgba(0,0,0,0.1);}
html[data-theme="dark"] .owl-next {right:0px; background-color: #eb4d4b; color: #fff;}
html[data-theme="dark"] .owl-prev:hover, html[data-theme="dark"] .owl-next:hover {color:#fff; background-color: #eb4d4b !important;}
html[data-theme="dark"] .side-panel {width:280px; height:100%; overflow-x:hidden; overflow-y:auto; background-color:#1c272d;
padding:15px 30px; z-index:9999; position:fixed; left:-320px; top:0; transition:left .4s;}
html[data-theme="dark"] .side-panel .hidden-menu {box-shadow: none; position: static; width: calc(100% + 60px); background-color: #111;
pointer-events: auto; opacity: 1; transform: translateY(0); margin: 15px -30px; border-radius: 0;}
html[data-theme="dark"] .side-panel .side-nav .hidden-menu {width: 100%; margin: 0; background-color: #111;}

@media screen and (max-width: 1220px) {
  html[data-theme="dark"] .btn-menu {display: block; font-size: 28px; margin-left: 30px; cursor: pointer; color: #eee;}
  html[data-theme="dark"] .header-btn {background-color: #1c272d; color: #ccc; font-weight: 400; box-shadow: none;}
}

/* ---- from engine.css ---- */

html[data-theme="dark"] .vote-title {margin: 0 -30px; margin-bottom: 15px; padding: 15px 30px; 
	background-color: #111; color: #eee; line-height: 1.3;}
html[data-theme="dark"] .vote label:before {content:""; margin:0 10px 0 0; cursor:pointer; position:relative; top:-1px;
width:10px; height:10px; border-radius:5px; background-color:#999; display:inline-block; vertical-align:middle;}
html[data-theme="dark"] .vote input:checked + label:before {box-shadow:inset 0 0 0 4px #e056fd; background-color:#e056fd;}
html[data-theme="dark"] .vote label:hover {cursor:pointer; color:#e056fd;}
html[data-theme="dark"] .up-img {width:100px; height:100px; border-radius:3px; border:5px solid #111; box-shadow:2px 2px 5px 0 rgba(0,0,0,0.2); 
position:absolute; left:30px; bottom:-30px;}
html[data-theme="dark"] .us-prof {border:0px solid #ebeef3; background-color:#111; margin-bottom:20px; box-shadow: 0 1px 4px rgba(0,0,0,0.2);}
html[data-theme="dark"] .usp-av {width:100px; height:100px; border:5px solid #111; margin:0 auto;}
html[data-theme="dark"] .usp-activ {margin:10px -20px 0 -20px; background-color:#111; color:#fff;}
html[data-theme="dark"] .usp-name {margin:-20px -20px 10px -20px; padding:20px; border-bottom:1px solid #111; background-color:#222;}
html[data-theme="dark"] .usp-meta li:nth-child(2n+1) {background-color:#111;}
html[data-theme="dark"] .pm-menu a {padding:0 15px; background:#222; line-height: 40px; display:block;}
html[data-theme="dark"] .pm-menu a:hover {background:#111; color:#fff;}
html[data-theme="dark"] .pm_progress_bar {border-radius:4px; background-color:#222; margin:10px 0; overflow:hidden;}
html[data-theme="dark"] .pm tr td, html[data-theme="dark"] .userstop tr td {padding:10px; border:1px solid #111; font-size:12px;}
html[data-theme="dark"] .pm tr:nth-child(1) {background-color:#111; color:#FFF;}
html[data-theme="dark"] .pm tr:nth-child(2n+2), html[data-theme="dark"] .userstop tr:nth-child(2n+2) {background-color:#222;}
html[data-theme="dark"] .scriptcode, html[data-theme="dark"] .title_spoiler, html[data-theme="dark"] .text_spoiler {padding: 3px 5px; background: #111; border: 1px solid #000;}
html[data-theme="dark"] .quote {margin:15px 0 5px 50px; padding: 15px 20px; position:relative; font: italic 16px/1.6 Georgia;
background-color:#111; border-left: 3px solid #ea172a;}
html[data-theme="dark"] .hide {background-color: #111; padding: 5px; color: #ccc; margin: 0 0 1em 0}
html[data-theme="dark"] .calendar {font-size:12px; width: 100%; color:#eee;}
html[data-theme="dark"] .calendar td.day, html[data-theme="dark"] .calendar td.day-active-v, html[data-theme="dark"] .calendar th.workday {border: 1px solid #000; background-color: #111;}
html[data-theme="dark"] .calendar td.weekday, html[data-theme="dark"] .calendar td.day-active, html[data-theme="dark"] .calendar th.weekday {border: 1px solid #111; background-color: #e056fd;}
html[data-theme="dark"] .day-active a, html[data-theme="dark"] .day-active-v a {color:#eee;}
html[data-theme="dark"] .calendar td.day-current {background: #e056fd;}
html[data-theme="dark"] .archives {display:block; color:#eee; margin-bottom:7px; padding-left:15px; font-size:14px;}
html[data-theme="dark"] .bb-pane {height:1%;overflow:hidden;padding:0 0 5px 5px;margin:0;height:auto !important;text-decoration:none;
background:linear-gradient(to bottom, #444 0%, #222 100%);border-radius:0px;border:1px solid #111;box-shadow:none !important;}
html[data-theme="dark"] .bb-btn {display:inline-block;overflow:hidden;float:left;padding:4px 10px;border:1px solid #111;
box-shadow:inset 0 1px 2px white;background:linear-gradient(to bottom, #444 0%, #111 100%)}
html[data-theme="dark"] .bb-btn:hover {background-color:#111;background:linear-gradient(to bottom, #000 0%, #222 100%)}
html[data-theme="dark"] .bb-btn:active {background:#000;border-color:#000;box-shadow:0 0 5px #000 inset}
html[data-theme="dark"] #dropmenudiv {font: 12px Arial; padding: 10px; display: none; background: #000; 
border-radius: 8px;  box-shadow: 0 0 50px 0 rgba(0,0,0,0.22); z-index:200 !important;}
html[data-theme="dark"] .ui-dialog {background-color: #27323b; position: absolute; width: 500px; 
box-shadow: 0 20px 60px rgba(0,0,0,0.3);}
html[data-theme="dark"] .ui-dialog-titlebar {background-color:#111;}
html[data-theme="dark"] .ui-dialog-title {display: block; font-size: 16px; padding: 15px 60px 15px 30px;}
html[data-theme="dark"] .ui-dialog .ui-dialog-buttonpane {padding: 10px 15px; text-align: center; background-color:#111;}
html[data-theme="dark"] .ui-icon-closethick:before {content:"\f00d"; width:40px; height:40px; line-height:40px; text-align:center; color:#fff; 
position:absolute; right:0; top:0px; text-indent:0; font-size:18px; 
/*background-color:#d91e18;*/ display:block; font-family:'Font Awesome 5 Pro';}