/* ========================================
   GLASS EFFECTS CSS - SIMPLIFIED
   Adds blur and hover effects only
   Background colors handled by darkmode.css variables
   ======================================== */

/* === GLASS EFFECT FOR MAIN PANELS ONLY (performance optimized) === */
.panel,
.ak-panel,
.hero-content,
.ak-main-aside,
.rightPane,
.status-section {
    background: rgba(15, 25, 45, 0.65) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: none !important;
}

/* === SIMPLE TRANSPARENT BACKGROUND (no blur for performance) === */
.panel-body,
.well,
.box,
.sidebar,
.ak-panel-content,
.ak-item,
.item-box,
.item-card,
.news-item,
.news-box,
.inner-box,
.box-content,
.ak-container.ak-main-center,
.ak-block-shop {
    background: rgba(15, 25, 45, 0.70) !important;
    border: none !important;
}

/* === REMOVE ALL VERTICAL BLUE LINES === */
.main,
.col-md-9,
.col-md-3,
.ak-main-container,
.ak-main-content,
.ak-main-page,
aside,
.container,
.row {
    border-left: none !important;
    border-right: none !important;
}

/* === HOVER EFFECT (simplified) === */
.panel:hover,
.ak-panel:hover,
.hero-content:hover,
.status-section:hover {
    background: rgba(20, 35, 60, 0.80) !important;
}

/* === NAVBAR === */
.navbar,
.navbar.navbar-default {
    background: linear-gradient(180deg, rgba(15, 15, 15, 0.75), rgba(10, 10, 10, 0.65)) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    border-bottom: 1px solid rgba(52, 152, 219, 0.3) !important;
    border-top: none !important;
}

/* === FIXED/STICKY NAVBAR - Same glass effect when scrolling === */
.ak-navbar-fixed .navbar,
.ak-navbar-fixed .navbar.navbar-default,
header.ak-navbar-fixed .navbar {
    background: linear-gradient(180deg, rgba(15, 15, 15, 0.75), rgba(10, 10, 10, 0.65)) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    border-bottom: 1px solid rgba(52, 152, 219, 0.3) !important;
    border-top: none !important;
}

/* Header element - fully transparent */
header,
header.ak-navbar-fixed {
    background: transparent !important;
    border: none !important;
}

/* Sticky wrapper created by sticky plugin - MUST be transparent */
.sticky-wrapper,
[id$="-sticky-wrapper"],
.sticky-wrapper.is-sticky {
    background: transparent !important;
}

/* Ensure sticky header has same visual effect */
.is-sticky header,
.is-sticky header.ak-navbar-fixed {
    background: transparent !important;
}

/* ID bar - same style as navbar for consistency */
.ak-idbar {
    background: linear-gradient(180deg, rgba(10, 10, 10, 0.8), rgba(15, 15, 15, 0.75)) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    border: none !important;
}

.table > tbody > tr:hover {
    background: rgba(60, 100, 160, 0.25) !important;
}

/* === BUTTONS === */
.btn:hover,
.button:hover {
    box-shadow: 0 0 15px rgba(100, 150, 255, 0.25);
}

/* === SCROLLBAR === */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: rgba(15, 20, 35, 0.5);
}

::-webkit-scrollbar-thumb {
    background: rgba(60, 100, 160, 0.5);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(80, 130, 200, 0.7);
}

/* Dropdown styles moved to header.php for unified styling */

/* Keep solid for form elements */
select,
.select2-dropdown,
.select2-results,
.autocomplete-suggestions,
.ui-menu,
.ui-autocomplete {
    background: #1a1f2e !important;
}

/* === STATUS COLORS === */
.status_online,
font.status_online {
    color: #27ae60 !important;
    font-weight: bold;
}

.status_offline,
font.status_offline {
    color: #e74c3c !important;
}

/* Visibility status */
.char_visible {
    color: #27ae60 !important;
}

.char_hidden {
    color: #f39c12 !important;
}