/* CMG Panel Light/Dark Theme Layer */
html[data-theme="light"] {
    --bg:#f5f7fb;
    --sidebar:#ffffff;
    --card:#ffffff;
    --card2:#f8fafc;
    --border:#d8e2f0;
    --text:#0f172a;
    --muted:#52657f;
    --shadow:0 14px 30px rgba(15,23,42,.08);
}

html[data-theme="light"] body{
    background:#f5f7fb !important;
    color:#0f172a !important;
}

html[data-theme="light"] .sidebar{
    background:#ffffff !important;
    border-right:1px solid #d8e2f0 !important;
}

html[data-theme="light"] .brand-box{
    background:#f8fafc !important;
    border:1px solid #d8e2f0 !important;
}

html[data-theme="light"] .topbar,
html[data-theme="light"] .card,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .section-card,
html[data-theme="light"] .stream-card{
    background:#ffffff !important;
    border:1px solid #d8e2f0 !important;
    box-shadow:0 14px 30px rgba(15,23,42,.08) !important;
}

html[data-theme="light"] .field-box,
html[data-theme="light"] .health-item,
html[data-theme="light"] .health-summary-card,
html[data-theme="light"] .empty-box,
html[data-theme="light"] .preview-box{
    background:#f8fafc !important;
    border:1px solid #d8e2f0 !important;
}

html[data-theme="light"] .nav a{
    color:#0f172a !important;
}

html[data-theme="light"] .nav a.active,
html[data-theme="light"] .nav a:hover{
    background:#eaf2ff !important;
    border-color:#bfdbfe !important;
}

html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea{
    background:#ffffff !important;
    color:#0f172a !important;
    border-color:#cbd5e1 !important;
}

html[data-theme="light"] code{
    background:#f1f5f9 !important;
    color:#0f172a !important;
    border-color:#cbd5e1 !important;
}

html[data-theme="light"] .brand-sub,
html[data-theme="light"] .stat-sub,
html[data-theme="light"] .section-head p,
html[data-theme="light"] .field-label,
html[data-theme="light"] .health-label,
html[data-theme="light"] .health-summary-label,
html[data-theme="light"] .side-footer,
html[data-theme="light"] .muted,
html[data-theme="light"] label,
html[data-theme="light"] .monitor-note{
    color:#52657f !important;
}

html[data-theme="light"] .badge,
html[data-theme="light"] .mini-badge,
html[data-theme="light"] .pill{
    background:#eef6ff !important;
    border-color:#bfdbfe !important;
    color:#1e3a8a !important;
}

html[data-theme="light"] table th,
html[data-theme="light"] table td{
    border-bottom-color:#e2e8f0 !important;
}

html[data-theme="light"] table th{
    color:#52657f !important;
}

.theme-toggle-btn{
    border:none;
    border-radius:12px;
    padding:10px 13px;
    color:#fff;
    font-weight:800;
    cursor:pointer;
    background:linear-gradient(180deg,#334155,#1e293b);
    font-size:13px;
}

html[data-theme="light"] .theme-toggle-btn{
    background:linear-gradient(180deg,#0f172a,#1e293b);
}

html[data-theme="dark"] .theme-toggle-btn{
    background:linear-gradient(180deg,#f59e0b,#d97706);
}

.theme-select-row{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
    align-items:end;
}

@media(max-width:700px){
    .theme-select-row{
        grid-template-columns:1fr;
    }
}

/* CMG_LIGHT_MODE_POLISH_LOGO_CARD_REMOVE_START */


/* Logo should appear clean without a card/border */
.brand-box{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    padding:0 !important;
}

.brand-title{
    margin:0 !important;
}

.brand-logo{
    width:100% !important;
    max-width:175px !important;
    max-height:88px !important;
    object-fit:contain !important;
    display:block !important;
    margin:0 auto !important;
    border:none !important;
    background:transparent !important;
    box-shadow:none !important;
}

/* Light mode professional contrast */
html[data-theme="light"]{
    --bg:#f4f7fb;
    --sidebar:#ffffff;
    --card:#ffffff;
    --card2:#f8fafc;
    --border:#c9d8ea;
    --text:#0f172a;
    --muted:#334155;
    --shadow:0 12px 28px rgba(15,23,42,.10);
}

html[data-theme="light"] body{
    background:#f4f7fb !important;
    color:#0f172a !important;
}

html[data-theme="light"] .main{
    background:#f4f7fb !important;
}

html[data-theme="light"] .sidebar{
    background:#ffffff !important;
    border-right:1px solid #d6e3f3 !important;
}

html[data-theme="light"] .topbar,
html[data-theme="light"] .card,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .section-card,
html[data-theme="light"] .stream-card{
    background:#ffffff !important;
    color:#0f172a !important;
    border:1px solid #cbdced !important;
    box-shadow:0 12px 28px rgba(15,23,42,.08) !important;
}

html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] .stream-title,
html[data-theme="light"] .stat-value{
    color:#0f172a !important;
}

html[data-theme="light"] .brand-sub,
html[data-theme="light"] .stat-sub,
html[data-theme="light"] .section-head p,
html[data-theme="light"] .topbar p,
html[data-theme="light"] .field-label,
html[data-theme="light"] .health-label,
html[data-theme="light"] .health-summary-label,
html[data-theme="light"] .side-footer,
html[data-theme="light"] .muted,
html[data-theme="light"] label,
html[data-theme="light"] .monitor-note{
    color:#334155 !important;
}

html[data-theme="light"] .field-box,
html[data-theme="light"] .health-item,
html[data-theme="light"] .health-summary-card,
html[data-theme="light"] .empty-box,
html[data-theme="light"] .preview-box{
    background:#f8fafc !important;
    color:#0f172a !important;
    border:1px solid #cbdced !important;
}

html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea{
    background:#ffffff !important;
    color:#0f172a !important;
    border:1px solid #b8cbe1 !important;
}

html[data-theme="light"] input::placeholder{
    color:#64748b !important;
}

html[data-theme="light"] code{
    background:#f8fafc !important;
    color:#0f172a !important;
    border:1px solid #b8cbe1 !important;
    font-weight:700 !important;
}

html[data-theme="light"] .copy-btn{
    background:#2563eb !important;
    border:1px solid #1d4ed8 !important;
    color:#ffffff !important;
    opacity:1 !important;
    font-weight:800 !important;
}

html[data-theme="light"] .copy-btn:hover{
    background:#1d4ed8 !important;
}

html[data-theme="light"] .nav a{
    color:#0f172a !important;
    font-weight:700 !important;
}

html[data-theme="light"] .nav a.active,
html[data-theme="light"] .nav a:hover{
    background:#eaf2ff !important;
    border-color:#93c5fd !important;
    color:#0f172a !important;
}

html[data-theme="light"] .badge,
html[data-theme="light"] .mini-badge,
html[data-theme="light"] .pill{
    background:#eff6ff !important;
    border:1px solid #93c5fd !important;
    color:#1e3a8a !important;
    font-weight:800 !important;
}

html[data-theme="light"] .status-badge{
    background:#dcfce7 !important;
    border:1px solid #86efac !important;
    color:#166534 !important;
    font-weight:900 !important;
}

html[data-theme="light"] .status-badge.warn{
    background:#ffedd5 !important;
    border:1px solid #fdba74 !important;
    color:#9a3412 !important;
}

html[data-theme="light"] .health-value{
    color:#0f172a !important;
    font-weight:900 !important;
}

html[data-theme="light"] .health-ok,
html[data-theme="light"] .ok{
    color:#15803d !important;
    font-weight:900 !important;
}

html[data-theme="light"] .health-bad{
    color:#dc2626 !important;
    font-weight:900 !important;
}

html[data-theme="light"] .health-warn,
html[data-theme="light"] .warn{
    color:#b45309 !important;
    font-weight:900 !important;
}

html[data-theme="light"] .flash-ok{
    background:#dcfce7 !important;
    border-color:#86efac !important;
    color:#166534 !important;
}

html[data-theme="light"] .flash-error{
    background:#fee2e2 !important;
    border-color:#fca5a5 !important;
    color:#991b1b !important;
}

html[data-theme="light"] table th,
html[data-theme="light"] table td{
    border-bottom-color:#e2e8f0 !important;
    color:#0f172a !important;
}

html[data-theme="light"] table th{
    color:#334155 !important;
}

/* Keep action buttons clear in both modes */
.btn-start,
.btn-restart,
.btn-stop,
.btn-delete,
.link-edit,
.link-logs,
.monitor-btn,
.logout-btn,
.btn{
    color:#ffffff !important;
    opacity:1 !important;
}

/* CMG_LIGHT_MODE_POLISH_LOGO_CARD_REMOVE_END */

/* CMG_PROFESSIONAL_SIDEBAR_LOGO_ONLY_START */

/* Clean sidebar logo: no card, no border, no background */
.sidebar .brand-box,
html[data-theme="light"] .sidebar .brand-box,
html[data-theme="dark"] .sidebar .brand-box{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    padding:8px 8px 22px !important;
    margin:0 0 10px !important;
    border-radius:0 !important;
    display:block !important;
}

.sidebar .brand-title,
html[data-theme="light"] .sidebar .brand-title,
html[data-theme="dark"] .sidebar .brand-title{
    margin:0 !important;
    padding:0 !important;
    display:block !important;
    line-height:1 !important;
}

.sidebar .brand-logo,
html[data-theme="light"] .sidebar .brand-logo,
html[data-theme="dark"] .sidebar .brand-logo{
    width:100% !important;
    max-width:180px !important;
    max-height:76px !important;
    object-fit:contain !important;
    display:block !important;
    margin:0 auto !important;
    padding:0 !important;
    border:none !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

/* Hide subtitle under logo when logo exists */
.sidebar .brand-box .brand-sub{
    display:none !important;
}

/* Sidebar layout closer to professional SaaS panels */
.sidebar,
html[data-theme="light"] .sidebar,
html[data-theme="dark"] .sidebar{
    padding:18px 14px !important;
}

.nav{
    display:flex !important;
    flex-direction:column !important;
    gap:6px !important;
}

.nav-section-title{
    margin:18px 10px 6px !important;
    color:#94a3b8 !important;
    font-size:12px !important;
    font-weight:900 !important;
    letter-spacing:.9px !important;
    text-transform:uppercase !important;
}

html[data-theme="light"] .nav-section-title{
    color:#94a3b8 !important;
}

.nav a,
html[data-theme="light"] .nav a,
html[data-theme="dark"] .nav a{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    min-height:46px !important;
    padding:8px 11px !important;
    margin:0 !important;
    border-radius:13px !important;
    font-size:15px !important;
    font-weight:800 !important;
    text-decoration:none !important;
    border:1px solid transparent !important;
    transition:all .16s ease !important;
}

/* Icon block */
.nav a::before{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    border-radius:11px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:16px !important;
    font-weight:900 !important;
    background:#eef2ff !important;
    color:#2563eb !important;
    border:1px solid rgba(37,99,235,.12) !important;
}

/* Icons per menu */
.nav a[href="/dashboard.php"]::before{content:"?";}
.nav a[href="/stream-create.php"]::before{content:"+";}
.nav a[href="/dashboard.php#streams"]::before,
.nav a[href="#streams"]::before{content:"?";}
.nav a[href="/users.php"]::before{content:"?";}
.nav a[href="/settings.php"]::before{content:"?";}
.nav a[href="/logout.php"]::before{content:"?";}

/* Light mode menu */
html[data-theme="light"] .nav a{
    color:#0f172a !important;
    background:transparent !important;
}

html[data-theme="light"] .nav a:hover,
html[data-theme="light"] .nav a.active{
    background:#edf4ff !important;
    border-color:#bfdbfe !important;
    color:#0f172a !important;
}

html[data-theme="light"] .nav a.active::before{
    background:#dbeafe !important;
    color:#1d4ed8 !important;
    border-color:#93c5fd !important;
}

/* Dark mode menu */
html[data-theme="dark"] .nav a{
    color:#dbeafe !important;
    background:transparent !important;
}

html[data-theme="dark"] .nav a:hover,
html[data-theme="dark"] .nav a.active{
    background:rgba(59,130,246,.14) !important;
    border-color:rgba(59,130,246,.25) !important;
    color:#ffffff !important;
}

html[data-theme="dark"] .nav a::before{
    background:rgba(59,130,246,.14) !important;
    color:#93c5fd !important;
    border-color:rgba(59,130,246,.22) !important;
}

html[data-theme="dark"] .nav a.active::before{
    background:rgba(37,99,235,.28) !important;
    color:#bfdbfe !important;
    border-color:rgba(147,197,253,.35) !important;
}

/* Sidebar footer should stay clean */
.side-footer{
    font-size:12px !important;
    line-height:1.5 !important;
}

/* CMG_PROFESSIONAL_SIDEBAR_LOGO_ONLY_END */

/* CMG_SIDEBAR_SVG_ICONS_FIX_START */

/* Remove old unicode/question-mark icons and use real SVG icons */
.nav a::before{
    content:"" !important;
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    border-radius:11px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    background-color:#eef2ff !important;
    background-repeat:no-repeat !important;
    background-position:center !important;
    background-size:18px 18px !important;
    border:1px solid rgba(37,99,235,.14) !important;
}

/* Dashboard icon */
.nav a[href="/dashboard.php"]::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='2'/%3E%3Crect x='14' y='3' width='7' height='7' rx='2'/%3E%3Crect x='3' y='14' width='7' height='7' rx='2'/%3E%3Crect x='14' y='14' width='7' height='7' rx='2'/%3E%3C/svg%3E") !important;
}

/* Add Restream icon */
.nav a[href="/stream-create.php"]::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14'/%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E") !important;
}

/* Streams icon */
.nav a[href="/dashboard.php#streams"]::before,
.nav a[href="#streams"]::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16'/%3E%3Cpath d='M4 12h16'/%3E%3Cpath d='M4 17h16'/%3E%3Ccircle cx='6' cy='7' r='1' fill='%232563eb'/%3E%3Ccircle cx='6' cy='12' r='1' fill='%232563eb'/%3E%3Ccircle cx='6' cy='17' r='1' fill='%232563eb'/%3E%3C/svg%3E") !important;
}

/* Users icon */
.nav a[href="/users.php"]::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") !important;
}

/* Settings icon */
.nav a[href="/settings.php"]::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15.5a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7Z'/%3E%3Cpath d='M19.4 15a1.8 1.8 0 0 0 .36 1.98l.04.04a2.1 2.1 0 0 1-2.97 2.97l-.04-.04a1.8 1.8 0 0 0-1.98-.36 1.8 1.8 0 0 0-1.1 1.66V21a2.1 2.1 0 0 1-4.2 0v-.06a1.8 1.8 0 0 0-1.1-1.66 1.8 1.8 0 0 0-1.98.36l-.04.04a2.1 2.1 0 0 1-2.97-2.97l.04-.04A1.8 1.8 0 0 0 3.6 15a1.8 1.8 0 0 0-1.66-1.1H2a2.1 2.1 0 0 1 0-4.2h.06A1.8 1.8 0 0 0 3.72 8.6a1.8 1.8 0 0 0-.36-1.98l-.04-.04a2.1 2.1 0 0 1 2.97-2.97l.04.04A1.8 1.8 0 0 0 8.3 4a1.8 1.8 0 0 0 1.1-1.66V2a2.1 2.1 0 0 1 4.2 0v.06A1.8 1.8 0 0 0 14.7 3.72a1.8 1.8 0 0 0 1.98-.36l.04-.04a2.1 2.1 0 0 1 2.97 2.97l-.04.04A1.8 1.8 0 0 0 20 8.3a1.8 1.8 0 0 0 1.66 1.1H22a2.1 2.1 0 0 1 0 4.2h-.06A1.8 1.8 0 0 0 19.4 15Z'/%3E%3C/svg%3E") !important;
}

/* Logout icon */
.nav a[href="/logout.php"]::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E") !important;
}

/* Active / hover icon style */
html[data-theme="light"] .nav a.active::before,
html[data-theme="light"] .nav a:hover::before{
    background-color:#dbeafe !important;
    border-color:#93c5fd !important;
}

html[data-theme="dark"] .nav a::before{
    background-color:rgba(59,130,246,.14) !important;
    border-color:rgba(59,130,246,.25) !important;
}

html[data-theme="dark"] .nav a.active::before,
html[data-theme="dark"] .nav a:hover::before{
    background-color:rgba(37,99,235,.30) !important;
    border-color:rgba(147,197,253,.40) !important;
}

/* CMG_SIDEBAR_SVG_ICONS_FIX_END */

/* CMG_DASHBOARD_ICON_FINAL_FIX_START */

/*
   Dashboard icon final fix:
   Avoid SVG rendering issue. Draw a clean 4-tile dashboard icon with CSS backgrounds.
*/
.nav a[href="/dashboard.php"]::before,
.nav a.active[href="/dashboard.php"]::before{
    content:"" !important;
    background-color:#eef2ff !important;
    background-image:
        linear-gradient(#2563eb 0 0),
        linear-gradient(#2563eb 0 0),
        linear-gradient(#2563eb 0 0),
        linear-gradient(#2563eb 0 0) !important;
    background-repeat:no-repeat !important;
    background-size:6px 6px, 6px 6px, 6px 6px, 6px 6px !important;
    background-position:9px 9px, 19px 9px, 9px 19px, 19px 19px !important;
    border:1px solid rgba(37,99,235,.18) !important;
}

html[data-theme="light"] .nav a[href="/dashboard.php"]::before,
html[data-theme="light"] .nav a.active[href="/dashboard.php"]::before{
    background-color:#dbeafe !important;
    background-image:
        linear-gradient(#1d4ed8 0 0),
        linear-gradient(#1d4ed8 0 0),
        linear-gradient(#1d4ed8 0 0),
        linear-gradient(#1d4ed8 0 0) !important;
    border-color:#93c5fd !important;
}

html[data-theme="dark"] .nav a[href="/dashboard.php"]::before,
html[data-theme="dark"] .nav a.active[href="/dashboard.php"]::before{
    background-color:rgba(59,130,246,.18) !important;
    background-image:
        linear-gradient(#93c5fd 0 0),
        linear-gradient(#93c5fd 0 0),
        linear-gradient(#93c5fd 0 0),
        linear-gradient(#93c5fd 0 0) !important;
    border-color:rgba(147,197,253,.35) !important;
}

/* CMG_DASHBOARD_ICON_FINAL_FIX_END */

/* CMG_DASHBOARD_SVG_FILE_ICON_FIX_START */

/* Final dashboard icon fix: use external SVG file, no solid blue block */
.nav a[href="/dashboard.php"]::before,
.nav a.active[href="/dashboard.php"]::before,
html[data-theme="light"] .nav a[href="/dashboard.php"]::before,
html[data-theme="light"] .nav a.active[href="/dashboard.php"]::before,
html[data-theme="dark"] .nav a[href="/dashboard.php"]::before,
html[data-theme="dark"] .nav a.active[href="/dashboard.php"]::before{
    content:"" !important;
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    border-radius:11px !important;
    display:inline-flex !important;
    background-color:#eef2ff !important;
    background-image:url("/assets/icons/dashboard.svg?v=1") !important;
    background-repeat:no-repeat !important;
    background-position:center center !important;
    background-size:19px 19px !important;
    border:1px solid rgba(37,99,235,.18) !important;
}

html[data-theme="light"] .nav a[href="/dashboard.php"]::before,
html[data-theme="light"] .nav a.active[href="/dashboard.php"]::before{
    background-color:#dbeafe !important;
    border-color:#93c5fd !important;
}

html[data-theme="dark"] .nav a[href="/dashboard.php"]::before,
html[data-theme="dark"] .nav a.active[href="/dashboard.php"]::before{
    background-color:rgba(59,130,246,.18) !important;
    border-color:rgba(147,197,253,.35) !important;
}

/* CMG_DASHBOARD_SVG_FILE_ICON_FIX_END */

/* CMG_ALL_SIDEBAR_EXTERNAL_ICONS_FINAL_START */

/* Final icon rendering: use external SVG files for all sidebar icons */
.nav a::before,
html[data-theme="light"] .nav a::before,
html[data-theme="dark"] .nav a::before{
    content:"" !important;
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    border-radius:12px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    background-repeat:no-repeat !important;
    background-position:center center !important;
    background-size:20px 20px !important;
    background-color:rgba(37,99,235,.10) !important;
    border:1px solid rgba(96,165,250,.30) !important;
    box-shadow:none !important;
}

.nav a[href="/dashboard.php"]::before,
html[data-theme="light"] .nav a[href="/dashboard.php"]::before,
html[data-theme="dark"] .nav a[href="/dashboard.php"]::before{
    background-image:url("/assets/icons/dashboard.svg?v=2") !important;
}

.nav a[href="/stream-create.php"]::before,
html[data-theme="light"] .nav a[href="/stream-create.php"]::before,
html[data-theme="dark"] .nav a[href="/stream-create.php"]::before{
    background-image:url("/assets/icons/add.svg?v=1") !important;
}

.nav a[href="/dashboard.php#streams"]::before,
.nav a[href="#streams"]::before,
html[data-theme="light"] .nav a[href="/dashboard.php#streams"]::before,
html[data-theme="light"] .nav a[href="#streams"]::before,
html[data-theme="dark"] .nav a[href="/dashboard.php#streams"]::before,
html[data-theme="dark"] .nav a[href="#streams"]::before{
    background-image:url("/assets/icons/streams.svg?v=1") !important;
}

.nav a[href="/users.php"]::before,
html[data-theme="light"] .nav a[href="/users.php"]::before,
html[data-theme="dark"] .nav a[href="/users.php"]::before{
    background-image:url("/assets/icons/users.svg?v=1") !important;
}

.nav a[href="/settings.php"]::before,
html[data-theme="light"] .nav a[href="/settings.php"]::before,
html[data-theme="dark"] .nav a[href="/settings.php"]::before{
    background-image:url("/assets/icons/settings.svg?v=1") !important;
}

.nav a[href="/logout.php"]::before,
html[data-theme="light"] .nav a[href="/logout.php"]::before,
html[data-theme="dark"] .nav a[href="/logout.php"]::before{
    background-image:url("/assets/icons/logout.svg?v=1") !important;
}

/* Dark mode icon boxes should be visible */
html[data-theme="dark"] .nav a::before{
    background-color:rgba(37,99,235,.16) !important;
    border-color:rgba(96,165,250,.38) !important;
}

html[data-theme="dark"] .nav a.active::before,
html[data-theme="dark"] .nav a:hover::before{
    background-color:rgba(37,99,235,.26) !important;
    border-color:rgba(147,197,253,.55) !important;
}

/* Light mode icon boxes should be clear */
html[data-theme="light"] .nav a::before{
    background-color:#eef6ff !important;
    border-color:#bfdbfe !important;
}

html[data-theme="light"] .nav a.active::before,
html[data-theme="light"] .nav a:hover::before{
    background-color:#dbeafe !important;
    border-color:#93c5fd !important;
}

/* CMG_ALL_SIDEBAR_EXTERNAL_ICONS_FINAL_END */