/**
 * Skin: Glassmorphism
 * Location: /assets/css/skin-glass.css
 * Version: 1.0.3
 */

/*==============================
=        Global Variables      =
==============================*/

:root {
    --card-padding: 20px;
    --glass-bg: rgba(85, 85, 85, 0.25);
    --glass-z-bg: rgba(12, 12, 12, 0.85);
    --glass-radius: 22px;
    --glass-blur: 4px;
    --glass-shadow: 0 12px 28px rgba(0,0,0,0.35);
    --glass-border: rgba(255,255,255,0.06);
    --glass-z-border: rgba(255,255,255,0.10);
    --glass-transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

/*==============================
=          Base Styles         =
==============================*/

body {
    background-color: #000022;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2000' height='2000' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke-opacity='0.15'%3E%3Cg stroke='%23026' stroke-width='17'%3E%3Cline x1='-8' y1='-8' x2='808' y2='808'/%3E%3Cline x1='-8' y1='792' x2='808' y2='1608'/%3E%3Cline x1='-8' y1='-808' x2='808' y2='8'/%3E%3C/g%3E%3Cg stroke='%23002163' stroke-width='16'%3E%3Cline x1='-8' y1='767' x2='808' y2='1583'/%3E%3Cline x1='-8' y1='17' x2='808' y2='833'/%3E%3Cline x1='-8' y1='-33' x2='808' y2='783'/%3E%3Cline x1='-8' y1='-783' x2='808' y2='33'/%3E%3C/g%3E%3Cg stroke='%23002060' stroke-width='15'%3E%3Cline x1='-8' y1='742' x2='808' y2='1558'/%3E%3Cline x1='-8' y1='42' x2='808' y2='858'/%3E%3Cline x1='-8' y1='-58' x2='808' y2='758'/%3E%3Cline x1='-8' y1='-758' x2='808' y2='58'/%3E%3C/g%3E%3Cg stroke='%23001f5c' stroke-width='14'%3E%3Cline x1='-8' y1='67' x2='808' y2='883'/%3E%3Cline x1='-8' y1='717' x2='808' y2='1533'/%3E%3Cline x1='-8' y1='-733' x2='808' y2='83'/%3E%3Cline x1='-8' y1='-83' x2='808' y2='733'/%3E%3C/g%3E%3Cg stroke='%23001e59' stroke-width='13'%3E%3Cline x1='-8' y1='92' x2='808' y2='908'/%3E%3Cline x1='-8' y1='692' x2='808' y2='1508'/%3E%3Cline x1='-8' y1='-108' x2='808' y2='708'/%3E%3Cline x1='-8' y1='-708' x2='808' y2='108'/%3E%3C/g%3E%3Cg stroke='%23001d56' stroke-width='12'%3E%3Cline x1='-8' y1='667' x2='808' y2='1483'/%3E%3Cline x1='-8' y1='117' x2='808' y2='933'/%3E%3Cline x1='-8' y1='-133' x2='808' y2='683'/%3E%3Cline x1='-8' y1='-683' x2='808' y2='133'/%3E%3C/g%3E%3Cg stroke='%23001c53' stroke-width='11'%3E%3Cline x1='-8' y1='642' x2='808' y2='1458'/%3E%3Cline x1='-8' y1='142' x2='808' y2='958'/%3E%3Cline x1='-8' y1='-158' x2='808' y2='658'/%3E%3Cline x1='-8' y1='-658' x2='808' y2='158'/%3E%3C/g%3E%3Cg stroke='%23001b4f' stroke-width='10'%3E%3Cline x1='-8' y1='167' x2='808' y2='983'/%3E%3Cline x1='-8' y1='617' x2='808' y2='1433'/%3E%3Cline x1='-8' y1='-633' x2='808' y2='183'/%3E%3Cline x1='-8' y1='-183' x2='808' y2='633'/%3E%3C/g%3E%3Cg stroke='%23001a4c' stroke-width='9'%3E%3Cline x1='-8' y1='592' x2='808' y2='1408'/%3E%3Cline x1='-8' y1='192' x2='808' y2='1008'/%3E%3Cline x1='-8' y1='-608' x2='808' y2='208'/%3E%3Cline x1='-8' y1='-208' x2='808' y2='608'/%3E%3C/g%3E%3Cg stroke='%23001949' stroke-width='8'%3E%3Cline x1='-8' y1='567' x2='808' y2='1383'/%3E%3Cline x1='-8' y1='217' x2='808' y2='1033'/%3E%3Cline x1='-8' y1='-233' x2='808' y2='583'/%3E%3Cline x1='-8' y1='-583' x2='808' y2='233'/%3E%3C/g%3E%3Cg stroke='%23001846' stroke-width='7'%3E%3Cline x1='-8' y1='242' x2='808' y2='1058'/%3E%3Cline x1='-8' y1='542' x2='808' y2='1358'/%3E%3Cline x1='-8' y1='-558' x2='808' y2='258'/%3E%3Cline x1='-8' y1='-258' x2='808' y2='558'/%3E%3C/g%3E%3Cg stroke='%23001743' stroke-width='6'%3E%3Cline x1='-8' y1='267' x2='808' y2='1083'/%3E%3Cline x1='-8' y1='517' x2='808' y2='1333'/%3E%3Cline x1='-8' y1='-533' x2='808' y2='283'/%3E%3Cline x1='-8' y1='-283' x2='808' y2='533'/%3E%3C/g%3E%3Cg stroke='%2300163f' stroke-width='5'%3E%3Cline x1='-8' y1='292' x2='808' y2='1108'/%3E%3Cline x1='-8' y1='492' x2='808' y2='1308'/%3E%3Cline x1='-8' y1='-308' x2='808' y2='508'/%3E%3Cline x1='-8' y1='-508' x2='808' y2='308'/%3E%3C/g%3E%3Cg stroke='%2300153c' stroke-width='4'%3E%3Cline x1='-8' y1='467' x2='808' y2='1283'/%3E%3Cline x1='-8' y1='317' x2='808' y2='1133'/%3E%3Cline x1='-8' y1='-333' x2='808' y2='483'/%3E%3Cline x1='-8' y1='-483' x2='808' y2='333'/%3E%3C/g%3E%3Cg stroke='%23001439' stroke-width='3'%3E%3Cline x1='-8' y1='342' x2='808' y2='1158'/%3E%3Cline x1='-8' y1='442' x2='808' y2='1258'/%3E%3Cline x1='-8' y1='-458' x2='808' y2='358'/%3E%3Cline x1='-8' y1='-358' x2='808' y2='458'/%3E%3C/g%3E%3Cg stroke='%23001336' stroke-width='2'%3E%3Cline x1='-8' y1='367' x2='808' y2='1183'/%3E%3Cline x1='-8' y1='417' x2='808' y2='1233'/%3E%3Cline x1='-8' y1='-433' x2='808' y2='383'/%3E%3Cline x1='-8' y1='-383' x2='808' y2='433'/%3E%3C/g%3E%3Cg stroke='%23013' stroke-width='1'%3E%3Cline x1='-8' y1='392' x2='808' y2='1208'/%3E%3Cline x1='-8' y1='-408' x2='808' y2='408'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-repeat: repeat-y;
}

#im-header nav,
#im-footer,
.manga-block,
.blog-block,
.comment-block,
.sticker-block,
.author-block,
.publisher-block,
.team-block,
.sticker-card,
.loot-box-card,
.frame-card,
.effect-card,
.uk-card-default.uk-card-hover,
.init-chatbox-wrapper,
.uk-light #im-slider .uk-alert,
.uk-light #signup-notice-bar .uk-card-default,
#iue-modal.dark .iue-inbox-item,
.story-cover-wrap,
.sidebar-widget {
    padding: var(--card-padding);
    background: var(--glass-bg);
    border-radius: var(--glass-radius);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
}

.uk-light .uk-alert,
.uk-light .uk-section-default,
.uk-light .uk-section-muted,
.uk-light .uk-comment-primary,
.uk-light .uk-card-default,
.uk-light .uk-navbar-container:not(.uk-navbar-transparent),
.uk-light .uk-background-muted,
.uk-light .uk-card-secondary,
.uk-light .uk-card-secondary.uk-card-hover:hover,
.uk-light .uk-modal-header,
.uk-light .uk-modal-footer {
    background: var(--glass-bg);
}

.uk-light .init-chatbox-message-body,
.uk-light #init-manga-assistant-messages .uk-background-muted,
.uk-light .init-2048__score,
.uk-light .init-2048__best,
#iep-modal.iep-dark #iep-code,
#iue-modal.dark .iue-referral-benefits,
#iue-modal.dark .iue-vip-current,
#iue-modal.dark .iue-vip-card,
#iue-modal.dark #iue-referral-link {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
}

.uk-label-contest,
.badge-age.badge-novel,
.badge-age.badge-completed {
    background: var(--im-theme-glass);
}

.uk-light .uk-progress,
.uk-light .init-2048__score,
.uk-light .init-2048__best,
.uk-light #chapter-search-input {
    background: var(--glass-bg) !important;
}

.uk-offcanvas-bar,
#ils-modal .ils-content,
.uk-light .uk-navbar-dropdown,
.uk-light .uk-dropdown,
.uk-light .uk-drop.uk-card-default,
.uk-light .uk-modal-dialog,
.uk-light .continue-reading.uk-alert,
#iue-modal.dark .iue-modal-content,
#iep-modal.iep-dark .iep-modal-content,
#init-review-modal.dark .init-review-modal-content,
.imc-sticky.uk-background-muted,
#init-user-engine-login-modal.dark .iue-content,
.iue-dashboard.dark {
    background: var(--glass-z-bg);
    border-radius: var(--glass-radius);
    border: 1px solid var(--glass-z-border);
    box-shadow: var(--glass-shadow);
}

.uk-light .uk-navbar-dropdown,
.uk-light .uk-dropdown,
.uk-light .uk-drop.uk-card-default,
.uk-light .continue-reading.uk-alert,
.imc-sticky.uk-background-muted,
.iue-dashboard.dark {
    backdrop-filter: blur(var(--glass-blur));
}

.uk-light .continue-reading.uk-alert {
    background: var(--glass-z-bg) !important;
}

.inline-comment-block,
#ils-modal.dark .ils-suggestions .ils-suggest-pill,
#init-review-modal.dark button[type="submit"],
#iep-modal.iep-dark button[type="button"]:not(.iep-modal-close),
.uk-light .uk-button-primary,
.uk-light .uk-button-secondary,
.uk-light .uk-button-danger,
.uk-light .uk-button-default {
    background: var(--glass-bg);
    color: #fff;
    border-radius: 500px;
    border: 1px solid var(--glass-border);
    transition: var(--glass-transition);
}

.uk-card-default.uk-card-hover {
    transition: var(--glass-transition);
}

/* Hiệu ứng hover riêng */
.inline-comment-block:hover,
.uk-card-default.uk-card-hover:hover,
#ils-modal.dark .ils-suggestions .ils-suggest-pill:hover,
#init-review-modal.dark button[type="submit"]:hover,
#iep-modal.iep-dark button[type="button"]:not(.iep-modal-close):hover,
.uk-light .uk-button-primary:hover,
.uk-light .uk-button-secondary:hover,
.uk-light .uk-button-danger:hover,
.uk-light .uk-button-default:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.25);
}

.uk-light .cover-bottom {
    background: linear-gradient(transparent 0%, rgba(12, 12, 12, 0.05) 15%, rgba(12, 12, 12, 0.55) 80%, var(--glass-z-bg) 100%);
}

.uk-blur-background {
    opacity: .8;
}

/*==============================
=          Reset Styles        =
==============================*/

#im-header nav,
.uk-card-default.uk-card-hover,
.story-cover-wrap {
    padding: 0;
}

.uk-card-default .uk-card-title {
    color: #fff;
}

.imc-sticky.uk-background-muted,
#im-header nav,
#im-footer {
    border-radius: 0;
}

#iue-modal.dark .iue-modal-header {
    border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 0;
}

.story-cover-wrap {
    box-shadow: none;
}

.uk-alert {
    padding: 15px 29px 15px 15px !important;
}

#announcement-bar .uk-alert {
    background: none !important;
}

#init-user-engine-login-modal.dark .iue-header,
#iue-modal.dark .iue-referral-container,
#iue-modal.dark .iue-modal-header,
#ils-modal.dark .ils-results {
    background: none;
}

#im-main .latest-updated .uk-text-center.uk-margin-medium-top {
    margin-top: 20px !important;
}
