#web-irc-client { 
    --bg-main: #1e1e1e; --text-main: #e0e0e0; 
    --bg-chat: #121212; --bg-sidebar: #1a1a1a; --bg-sidebar-header: #222222;
    --bg-tabs: #181818; --bg-tab: #222222; --bg-tab-hover: #2a2a2a; --bg-tab-active: #121212;
    --bg-input: #252526; --text-input: #e0e0e0;
    --text-chat: #d4d4d4; --text-sidebar: #9e9e9e; --text-tab: #888888;
    --text-tab-active: #ffffff; --color-time: #6b6b6b; --color-sender: #569cd6; --color-system: #4ec9b0;
    --color-error: #f44336; --color-action: #c586c0; --color-notice: #ce9178; --color-link: #3794ff;
    --color-mention-bg: rgba(200, 150, 0, 0.15); --color-mention-border: #d7ba7d;
    --color-op: #f48771; --color-halfop: #d7ba7d; --color-voice: #4ec9b0;
    --border-main: #333333; --border-dark: #111111;
    border: 1px solid var(--border-main); border-radius: 6px; background: var(--bg-main); 
    width: 100%; margin: 20px auto; font-family: monospace; position: relative; color: var(--text-main);
}

#web-irc-client.theme-light {
    --bg-chat: #ffffff; --bg-sidebar: #f5f5f5; --bg-sidebar-header: #e0e0e0;
    --bg-tabs: #d0d0d0; --bg-tab: #e0e0e0; --bg-tab-hover: #ebebeb; --bg-tab-active: #ffffff;
    --bg-input: #ffffff; --text-input: #333333; --text-main: #333333; --bg-main: #f9f9f9;
    --text-chat: #333333; --text-sidebar: #333333; --text-tab: #555555;
    --text-tab-active: #000000; --color-time: #999999; --color-sender: #0056b3; 
    --color-system: #008000; --color-action: #800080; --color-notice: #8b4513; 
    --border-main: #cccccc; --border-dark: #cccccc; --color-mention-bg: rgba(255, 235, 150, 0.3);
}

#web-irc-client.theme-solarized {
    --bg-chat: #002b36; --bg-sidebar: #073642; --bg-sidebar-header: #002b36;
    --bg-tabs: #002b36; --bg-tab: #073642; --bg-tab-hover: #586e75; --bg-tab-active: #002b36;
    --bg-input: #073642; --text-input: #93a1a1; --text-main: #839496;
    --text-chat: #839496; --text-sidebar: #839496; --text-tab: #586e75;
    --text-tab-active: #93a1a1; --color-time: #586e75; --color-sender: #268bd2; 
    --color-system: #859900; --color-action: #d33682; --color-notice: #cb4b16; 
    --border-main: #073642; --border-dark: #002b36; --bg-main: #002b36;
    --color-link: #2aa198; --color-mention-bg: rgba(181, 137, 0, 0.15); --color-mention-border: #b58900;
}

.irc-panel { padding: 20px; display: flex; flex-direction: column; gap: 15px; }
.irc-login-form { display: flex; flex-direction: column; gap: 10px; max-width: 300px; margin: auto; }
.irc-login-form input { padding: 8px; border: 1px solid var(--border-main); border-radius: 4px; background: var(--bg-input); color: var(--text-input); }
.irc-login-remember { font-size: 0.9em; display: flex; align-items: center; gap: 5px; cursor: pointer; color: var(--text-main); }
#irc-chat-view { height: 75vh; min-height: 600px; padding: 0; }
#irc-tabs-bar { display: flex; background: var(--bg-tabs); overflow-x: auto; border-top-left-radius: 6px; border-top-right-radius: 6px; flex-shrink: 0; }
.irc-tab { padding: 10px 15px; color: var(--text-tab); background: var(--bg-tab); cursor: pointer; border-right: 1px solid var(--border-dark); user-select: none; display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.irc-tab.active { background: var(--bg-tab-active); color: var(--text-tab-active); font-weight: bold; }
.irc-tab.unread { color: var(--color-system); }
.irc-tab.mention-alert { color: var(--color-op); }
.irc-tab-close { font-size: 1.2em; line-height: 1; color: #666; }
.irc-tab-close:hover { color: var(--color-error); }

#irc-chat-layout { display: flex; flex-grow: 1; overflow: hidden; min-height: 0; }
#irc-buffers-container { flex-grow: 1; background: var(--bg-chat); position: relative; }
.irc-messages { position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding: 15px; overflow-y: auto; color: var(--text-chat); }

#irc-sidebar { width: 200px; background: var(--bg-sidebar); color: var(--text-sidebar); display: flex; flex-direction: column; border-left: 1px solid var(--border-dark); transition: width 0.2s ease; }
#irc-sidebar.collapsed { width: 40px; }
#irc-sidebar.collapsed ul, #irc-sidebar.collapsed #irc-sidebar-header { overflow: hidden; white-space: nowrap; }

#irc-sidebar-header { padding: 10px; background: var(--bg-sidebar-header); font-weight: bold; text-align: center; cursor: pointer; color: var(--text-tab-active); border-bottom: 1px solid var(--border-dark); display: flex; flex-direction: column; gap: 2px; }
#irc-user-counts { font-size: 0.75em; color: var(--text-tab); font-weight: normal; }
#irc-sidebar.collapsed #irc-user-counts { display: none; }

#irc-nicklist { list-style: none; margin: 0; padding: 10px; overflow-y: auto; flex-grow: 1; }
#irc-nicklist li { padding: 4px 0; font-size: 0.95em; cursor: pointer; }

#irc-input-area { padding: 10px; background: var(--bg-main); border-top: 1px solid var(--border-main); display: flex; gap: 10px; align-items: center; position: relative; flex-shrink: 0; }
#irc-user-nick-display { font-weight: bold; font-size: 0.9em; white-space: nowrap; padding: 8px 5px; color: var(--color-sender); }
#irc-input-area input { flex-grow: 1; padding: 8px; border: 1px solid var(--border-main); border-radius: 4px; background: var(--bg-input); color: var(--text-input); }
#irc-search-container { position: absolute; bottom: 60px; left: 20px; right: 20px; background: var(--bg-main); border: 1px solid var(--border-main); padding: 5px; border-radius: 4px; display: flex; gap: 5px; box-shadow: 0 -2px 5px rgba(0,0,0,0.3); z-index: 10; }
#irc-search-input { flex-grow: 1; border: none !important; outline: none; background: transparent; color: var(--text-main); }
#irc-search-close { background: none; border: none; font-size: 1.5em; cursor: pointer; color: var(--text-main); }

/* Emoji Picker */
#irc-emoji-picker { position: absolute; bottom: 60px; right: 80px; width: 260px; max-height: 200px; overflow-y: auto; background: var(--bg-main); border: 1px solid var(--border-main); border-radius: 4px; display: flex; flex-wrap: wrap; gap: 5px; padding: 10px; z-index: 20; box-shadow: 0 -2px 10px rgba(0,0,0,0.3); }
.irc-emoji-item { font-size: 1.5em; cursor: pointer; user-select: none; padding: 4px; border-radius: 4px; }
.irc-emoji-item:hover { background: var(--bg-input); }
#irc-emoji-btn, #irc-search-btn, #irc-settings-btn, #irc-send-btn { cursor: pointer; background: var(--bg-input); color: var(--text-input); border: 1px solid var(--border-main); padding: 8px; border-radius: 4px; }
#irc-emoji-btn:hover, #irc-search-btn:hover, #irc-settings-btn:hover, #irc-send-btn:hover { filter: brightness(1.2); }

/* Settings Modal */
#irc-settings-modal { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.7); display: flex; justify-content: center; align-items: center; z-index: 100; border-radius: 6px; }
.irc-settings-content { background: var(--bg-main); padding: 20px; border-radius: 6px; display: flex; flex-direction: column; gap: 15px; min-width: 280px; position: relative; color: var(--text-main); border: 1px solid var(--border-main); }
#irc-settings-close { position: absolute; top: 10px; right: 15px; font-size: 1.5em; cursor: pointer; color: var(--text-main); }
.irc-setting-row { display: flex; align-items: center; gap: 10px; }
.irc-setting-col { display: flex; flex-direction: column; gap: 5px; }
.irc-setting-col input, .irc-setting-row select, .irc-setting-row input[type="number"] { padding: 6px; border: 1px solid var(--border-main); border-radius: 4px; font-family: monospace; width: 100%; box-sizing: border-box; background: var(--bg-input); color: var(--text-input); }
.irc-setting-row select { width: auto; }
#irc-pref-reconnect-delay { width: 80px; }

.irc-prefix { font-weight: bold; margin-right: 2px; }
.irc-op { color: var(--color-op); }
.irc-halfop { color: var(--color-halfop); }
.irc-voice { color: var(--color-voice); }

.irc-time { color: var(--color-time); font-size: 0.9em; }
.irc-sender { color: var(--color-sender); margin-right: 5px; }
.irc-system .irc-text, .irc-event .irc-text { color: var(--color-system); }
.irc-error .irc-text { color: var(--color-error); font-weight: bold; }
.irc-action .irc-text { color: var(--color-action); font-style: italic; }
.irc-notice .irc-text { color: var(--color-notice); }

.irc-channel-link { color: var(--color-link); cursor: pointer; text-decoration: none; }
.irc-channel-link:hover { text-decoration: underline; }
.irc-link { color: var(--color-link); text-decoration: none; }

/* Inline Images */
.irc-inline-image { display: none; max-width: 250px; max-height: 250px; margin-top: 5px; border-radius: 4px; cursor: zoom-in; border: 1px solid var(--border-dark); object-fit: contain; }
#web-irc-client.show-inline-images .irc-inline-image { display: block; }

.irc-msg { margin-bottom: 4px; padding-left: 5px; border-left: 3px solid transparent; word-wrap: break-word; }
.irc-mention { background-color: var(--color-mention-bg); border-left: 3px solid var(--color-mention-border); }

/* Dynamic Nick Colors */
#web-irc-client.show-nick-colors .irc-sender[style*="--nick-hue"], 
#web-irc-client.show-nick-colors #irc-user-nick-display[style*="--nick-hue"] { color: hsl(var(--nick-hue), 75%, 65%); }

#web-irc-client.theme-light.show-nick-colors .irc-sender[style*="--nick-hue"],
#web-irc-client.theme-light.show-nick-colors #irc-user-nick-display[style*="--nick-hue"] { color: hsl(var(--nick-hue), 85%, 40%); }

#web-irc-client.theme-solarized.show-nick-colors .irc-sender[style*="--nick-hue"],
#web-irc-client.theme-solarized.show-nick-colors #irc-user-nick-display[style*="--nick-hue"] { color: hsl(var(--nick-hue), 70%, 60%); }

#web-irc-client.show-nick-colors #irc-nicklist li[style*="--nick-hue"] { color: hsl(var(--nick-hue), 75%, 65%); }
#web-irc-client.theme-light.show-nick-colors #irc-nicklist li[style*="--nick-hue"] { color: hsl(var(--nick-hue), 85%, 40%); }
#web-irc-client.theme-solarized.show-nick-colors #irc-nicklist li[style*="--nick-hue"] { color: hsl(var(--nick-hue), 70%, 60%); }

/* Hide Preferences */
#web-irc-client.hide-jpq .irc-join,
#web-irc-client.hide-jpq .irc-part,
#web-irc-client.hide-jpq .irc-quit { display: none !important; }
#web-irc-client.hide-nick .irc-nickchange { display: none !important; }