@charset "utf-8";
/* --------------------------------------------------------------------------
   Modern HiTEL Master - Nostalgic Blue Experience (Zero-White Policy)
   Core Theme: 90s HiTEL Identity reimagined for modern layout
   Philosophy: Stability, Contrast, and Nostalgia (Grid & Blue Screen)
   Colors: HiTEL Navy (#1E3A8A) & Silver Gray (#F8F9FA)
   Designed by: Antigravity
   -------------------------------------------------------------------------- */

/* [1] MASTER INHERITANCE RESET (Force Consistency Across All Pages) */
html, 
body {
    background-color: var(--layout-body) !important;
    color: var(--layout-gray-900) !important;
}

:root {
    /* === [2] HiTEL BLUE PALETTE (Refined Aqua Identity) === */
    --color-prime: #1E40AF !important;
    --hitel-gold: #3B82F6 !important;
    --hitel-cream: #F0F7FF !important;
    --hitel-charcoal: #0F172A !important;

    /* === [3] LIGHT MODE MASTER (The Aqua Era Aesthetics - Brown Master Parity) === */
    --layout-body: #F0F7FF !important;
    --layout-header: #F0F7FF !important;
    --layout-gnb-bg: #BFDBFE !important;
    --layout-tnb: #1E3A8A !important;       
    --layout-header-border: #BFDBFE !important; 
    --layout-gnb-border: #93C5FD !important; 
    
    --layout-container-bg: #F8FAFF !important;
    --layout-sidebar-bg: #E0F2FE !important;
    --layout-sidebar-border: #BAE6FD !important;
    --layout-sidebar-active-bg: #93C5FD !important;
    --layout-sidebar-active-color: #0F172A !important;
    
    --layout-footer-bg: #1E3A8A !important;   
    --layout-footer-border: #1E40AF !important;
    
    --layout-dropdown-bg: #E0F2FE !important;
    --layout-dropdown-hover-bg: #BFDBFE !important;
    
    --layout-board-bg: #F0F9FF !important; 
    --layout-board-border: #BFDBFE !important;
    
    --layout-radius: 2px; 
    --layout-radius-lg: 4px;
    --hitel-border: #93C5FD !important;
    
    --layout-kvWrap-bg: #BFDBFE !important;

    /* === [4] GRAY SCALE REMAPPING (Anti-Conflict Guard) === */
    --layout-white: #F8F9FA !important; 
    --layout-gray-50: #F1F5F9 !important;
    --layout-gray-100: #BFDBFE !important;
    --layout-gray-200: #93C5FD !important;
    --layout-gray-300: #60A5FA !important;
    --layout-gray-900: var(--hitel-charcoal) !important; 
    --layout-black: #E0F2FE !important; 
}

/* === [5] DARK MODE MASTER (Blue Screen Nostalgia) === */
:root.darkMode, html.darkMode, body.darkMode, .darkMode {
    --layout-body: #000033 !important;
    --layout-header: #000033 !important;
    --layout-gnb-bg: #000033 !important; 
    --layout-tnb: #000066 !important;
    --layout-sidebar-bg: #000066 !important;
    --layout-container-bg: #000044 !important;
    
    --layout-footer-bg: #000066 !important;
    --layout-footer-border: #000088 !important;
    
    --layout-dropdown-bg: #000088 !important;
    --layout-dropdown-hover-bg: #1E40AF !important; 
    
    --layout-board-bg: #000044 !important;
    --layout-board-border: #0000AA !important;
    
    --color-prime: #60A5FA !important;
    --hitel-border: #000088 !important;
    --layout-gray-300: #000088 !important;
    
    --layout-white: #000044 !important;      
    --layout-gray-900: #FAF9F6 !important;   
    --layout-black: #000011 !important;
    
    --layout-gray-100: #000066 !important;
    --layout-gray-200: #000088 !important;
    --layout-header-border: #000088 !important;
    
    --layout-kvWrap-bg: #000044 !important;   
    --layout-gray-50: #000000 !important;

    --layout-sidebar-active-bg: #0000BB !important;
    --layout-sidebar-active-color: #FAF9F6 !important;
}

/* === [6] GLOBAL TYPOGRAPHY MASTER === */
body, a, h1, h2, h3, h4, h5, p, span, li, strong, dt, dd, i, b, em {
    color: var(--layout-gray-900);
}

:root.darkMode body, :root.darkMode a, :root.darkMode p, :root.darkMode span, 
:root.darkMode h1, :root.darkMode h2, :root.darkMode h3, :root.darkMode h4,
.darkMode body, .darkMode a, .darkMode p, .darkMode span, 
.darkMode h1, .darkMode h2, .darkMode h3, .darkMode h4 {
    color: #FAF9F6 !important;
}

/* === [7] ARCHITECTURE PROTECTION (Cloned Parity) === */
/* White Mode Only: Stepped Header/GNB Hierarchy */
html:not(.darkMode) .gnbWrap {
    background: var(--layout-header) !important;
    border-bottom: 1px solid var(--layout-gnb-border) !important;
}

html:not(.darkMode) .gnbWrap .gnb {
    background: transparent !important; 
    height: 100%; 
}

html:not(.darkMode) .gnbWrap .gnb nav {
    background: var(--layout-gnb-bg) !important;
    width: fit-content; 
}

/* Force transparency for top-level bar only, keeping pulldowns white */
html:not(.darkMode) .gnbWrap .gnb nav > ul,
html:not(.darkMode) .gnbWrap .gnb nav > ul > li {
    background: transparent !important;
}

/* Restore color for GNB pulldown/dropdown menus */
html:not(.darkMode) .gnb-menu ul,
html:not(.darkMode) .dropdown-menu {
    background: var(--layout-dropdown-bg) !important;
}

html:not(.darkMode) .gnb-menu ul li a,
html:not(.darkMode) .dropdown-menu a {
    color: var(--layout-gray-900) !important;
}

html:not(.darkMode) .gnbWrap .gnb nav ul li a {
    color: var(--layout-gray-900) !important;
}

.sideWrap, .sidebar, .snb, .gnb-menu, .dropdown-menu, .sub-menu, .container {
    background: var(--layout-sidebar-bg) !important;
    border-color: var(--hitel-border) !important;
}

.mainContainer, .container {
    background: var(--layout-body) !important;
}

/* Sidebar Nav Hover Effect */
.sideWrap .sideGnb .nav ul > li > a {
    color: var(--layout-gray-900) !important;
    transition: all 0.1s ease;
    padding: 6px 12px !important; 
    border-radius: 0 !important;
    margin-right: 14px; 
}

.sideWrap .sideGnb .nav ul > li > a:hover {
    background: var(--layout-dropdown-hover-bg) !important;
    color: var(--color-prime) !important;
    border-left: 4px solid var(--color-prime) !important;
}

/* Dark Mode Swap: Blue screen highlight */
.darkMode .sideWrap .sideGnb .nav ul > li > a:hover {
    background: var(--color-prime) !important;
    color: #ffffff !important;
}

/* Ensure active state color is enforced */
.sideWrap .sideGnb .nav ul > li > a.active {
    background: var(--layout-sidebar-active-bg) !important;
    color: var(--layout-sidebar-active-color) !important;
}

/* === [8] UI COMPONENTS MASTER === */
input, select, textarea {
    background: #F8F9FA !important;
    color: var(--hitel-charcoal) !important;
    border-color: var(--hitel-border) !important;
}
:root.darkMode input, :root.darkMode select, :root.darkMode textarea {
    background: #000066 !important; 
    color: #FAF9F6 !important;
    border-color: #0000AA !important;
}

/* Retro pagination */
.pg_wrap .pg .pg_page, .pg_wrap .pg .pg_current {
    background: var(--layout-gray-100) !important;
    color: var(--layout-gray-900) !important;
}
.pg_wrap .pg .pg_current {
    background: var(--color-prime) !important;
    color: #ffffff !important;
}

/* === [9] SPECIFIC PAGE GUARD (Image 2 Logic Cloned) === */
/* Board content transparency for cleaner dark mode blue screen */
html.darkMode body .loginBox,
html.darkMode body .memberWrap,
html.darkMode body .boardListWrap,
html.darkMode body .boardViewWrap,
body.darkMode .loginBox,
body.darkMode .memberWrap,
body.darkMode .boardListWrap,
body.darkMode .boardViewWrap,
.darkMode .loginBox,
.darkMode .memberWrap,
.darkMode .boardListWrap,
.darkMode .boardViewWrap {
    background: transparent !important; 
    color: var(--layout-gray-900) !important;
    border-color: var(--hitel-border) !important;
}

/* === [10] UNITY FILTER (Navy Tone) === */
.logo img, .icon img, .header .icon i, .header-wrap .icon i {
    filter: invert(19%) sepia(85%) saturate(3088%) hue-rotate(227deg) brightness(91%) contrast(100%);
}

footer, .footerWrap, .footer {
    background: var(--layout-footer-bg) !important;
    border-top: 2px solid var(--layout-footer-border) !important;
    color: #FAF9F6 !important; 
}

/* General Footer Icons/Text */
footer *, .footerWrap *, .footer * {
    color: #FAF9F6 !important;
}

/* === [11] REMAINING BACKGROUND GUARD (TNB) === */
.tnb, .topWrap, .header-top {
    background: var(--layout-tnb) !important;
    color: #FAF9F6 !important; 
}

.tnb *, .topWrap *, .header-top * {
    color: #FAF9F6 !important;
}

/* [12] DROPDOWN READABILITY FIX (TNB Children Override) */
/* Ensure dropdowns inside .tnb regain correct text colors despite the global .tnb * rule */
.tnb .translateDropdown,
.tnb .translateDropdown *,
.tnb .outloginUserMenu,
.tnb .outloginUserMenu * {
    color: var(--layout-gray-900) !important;
}

/* Ensure icons/checks in dropdowns use the prime color for Hitel accent */
.tnb .translateDropdown .bx-globe,
.tnb .translateDropdown .bx-check,
.tnb .outloginUserMenu i {
    color: var(--color-prime) !important;
}

/* Hover & Active States for Dropdowns (Hitel Aqua Palette) */
.tnb .translateItem:hover,
.tnb .translateItem:hover *,
.tnb .outloginUserMenu a:hover,
.tnb .outloginUserMenu a:hover * {
    background-color: var(--layout-dropdown-hover-bg) !important;
    color: var(--color-prime) !important;
}

.tnb .translateItem.active,
.tnb .translateItem.active * {
    background-color: var(--layout-gray-100) !important;
    color: var(--color-prime) !important;
    font-weight: 700 !important;
}

/* Google Translate Powered By text fix */
.tnb .translateFooter small {
    color: var(--layout-gray-900) !important;
    opacity: 0.5;
}