Provides CSS styles for the Google Search Custom Sidebar script.
此腳本不應該直接安裝，它是一個供其他腳本使用的函式庫。欲使用本函式庫，請在腳本 metadata 寫上： // @require https://update.cn-greasyfork.org/scripts/535625/1589134/Google%20Search%20Custom%20Sidebar%20-%20Styles.js
// ==UserScript==
// @name Google Search Custom Sidebar - Styles
// @namespace https://greasyfork.org/en/users/1467948-stonedkhajiit
// @version 0.0.5-styles
// @description Provides CSS styles for the Google Search Custom Sidebar script.
// @author StonedKhajiit
// @license MIT
// @grant none
// ==/UserScript==
(function() {
'use strict';
if (typeof window.GSCS_Namespace === 'undefined') {
window.GSCS_Namespace = {};
}
window.GSCS_Namespace.stylesText = `
/* --- START OF GSCS CSS --- */
:root {
--sidebar-bg-color: #ffffff;
--sidebar-text-color: #3c4043;
--sidebar-border-color: #dadce0;
--sidebar-link-color: #1a0dab;
--sidebar-link-hover-color: #1a0dab;
--sidebar-selected-color: #000000;
--sidebar-section-border-color: #eeeeee;
--sidebar-tool-btn-bg: #f8f9fa;
--sidebar-tool-btn-border: #dadce0;
--sidebar-tool-btn-text: #3c4043;
--sidebar-tool-btn-hover-bg: #e8eaed;
--sidebar-tool-btn-hover-border: #bdbdbd;
--sidebar-tool-btn-hover-text: #3c4043;
--sidebar-tool-btn-active-bg: #e8f0fe;
--sidebar-tool-btn-active-text: #1967d2;
--sidebar-tool-btn-active-border: #aecbfa;
--sidebar-header-btn-color: #5f6368;
--sidebar-header-btn-hover-color: #1a0dab;
--sidebar-header-btn-active-bg: #e8f0fe;
--sidebar-header-btn-active-color: #1967d2;
--sidebar-input-bg: #ffffff;
--sidebar-input-text: #202124;
--sidebar-input-border: #ccc;
--sidebar-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
/* Scrollbar Colors - Light Theme Defaults */
--sidebar-scrollbar-thumb-color: #a0a0a0;
--sidebar-scrollbar-track-color: #f0f0f0;
--sidebar-scrollbar-thumb-hover-color: #777777;
--settings-bg-color: #ffffff;
--settings-text-color: #3c4043;
--settings-border-color: #eeeeee;
--settings-header-text-color: #3c4043;
--settings-close-btn-color: #777777;
--settings-close-btn-hover-color: #333333;
--settings-tab-color: #5f6368;
--settings-tab-active-color: #1a0dab;
--settings-tab-active-border: #1a0dab;
--settings-input-bg: #ffffff;
--settings-input-text: #202124;
--settings-input-border: #ccc;
--settings-list-border: #eeeeee;
--settings-list-item-border: #e0e0e0;
--settings-list-btn-bg: #f8f8f8;
--settings-list-btn-hover-bg: #eeeeee;
--settings-add-btn-bg: #4285f4;
--settings-add-btn-text: white;
--settings-add-btn-hover-bg: #3367d6;
--settings-save-btn-bg: #1a73e8;
--settings-save-btn-text: white;
--settings-save-btn-border: #1a73e8;
--settings-save-btn-hover-bg: #1565c0;
--settings-cancel-btn-bg: #ffffff;
--settings-cancel-btn-text: #3c4043;
--settings-cancel-btn-hover-bg: #f8f9fa;
--settings-reset-btn-bg: #f8d7da;
--settings-reset-btn-text: #721c24;
--settings-reset-btn-border: #f5c6cb;
--settings-reset-btn-hover-bg: #f5c6cb;
--settings-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
--gscs-msg-info-bg: #e7f3fe; --gscs-msg-info-text: #004085; --gscs-msg-info-border: #b8daff;
--gscs-msg-success-bg: #d4edda; --gscs-msg-success-text: #155724; --gscs-msg-success-border: #c3e6cb;
--gscs-msg-warning-bg: #fff3cd; --gscs-msg-warning-text: #856404; --gscs-msg-warning-border: #ffeeba;
--gscs-msg-error-bg: #f8d7da; --gscs-msg-error-text: #721c24; --gscs-msg-error-border: #f5c6cb;
--gscs-ntf-info-bg: var(--gscs-msg-info-bg); --gscs-ntf-info-text: var(--gscs-msg-info-text); --gscs-ntf-info-border: var(--gscs-msg-info-border);
--gscs-ntf-success-bg: var(--gscs-msg-success-bg); --gscs-ntf-success-text: var(--gscs-msg-success-text); --gscs-ntf-success-border: var(--gscs-msg-success-border);
--gscs-ntf-warning-bg: var(--gscs-msg-warning-bg); --gscs-ntf-warning-text: var(--gscs-msg-warning-text); --gscs-ntf-warning-border: var(--gscs-msg-warning-border);
--gscs-ntf-error-bg: var(--gscs-msg-error-bg); --gscs-ntf-error-text: var(--gscs-msg-error-text); --gscs-ntf-error-border: var(--gscs-msg-error-border);
}
:root .dark-theme {
--sidebar-bg-color: #202124;
--sidebar-text-color: #bdc1c6;
--sidebar-border-color: #5f6368;
--sidebar-link-color: #8ab4f8;
--sidebar-link-hover-color: #8ab4f8;
--sidebar-selected-color: #e8eaed;
--sidebar-section-border-color: #3c4043;
--sidebar-tool-btn-bg: #303134;
--sidebar-tool-btn-border: #5f6368;
--sidebar-tool-btn-text: #8ab4f8;
--sidebar-tool-btn-hover-bg: #3c4043;
--sidebar-tool-btn-hover-border: #5f6368;
--sidebar-tool-btn-hover-text: #bdc1c6;
--sidebar-tool-btn-active-bg: #8ab4f8;
--sidebar-tool-btn-active-text: #202124;
--sidebar-tool-btn-active-border: #8ab4f8;
--sidebar-header-btn-color: #bdc1c6;
--sidebar-header-btn-hover-color: #8ab4f8;
--sidebar-header-btn-active-bg: #8ab4f8;
--sidebar-header-btn-active-color: #202124;
--sidebar-input-bg: #303134;
--sidebar-input-text: #e8eaed;
--sidebar-input-border: #5f6368;
--sidebar-shadow: 0 2px 5px 0 rgba(0,0,0,0.3), 0 2px 10px 0 rgba(0,0,0,0.24);
/* Scrollbar Colors - Dark Theme Defaults */
--sidebar-scrollbar-thumb-color: #5f6368;
--sidebar-scrollbar-track-color: var(--sidebar-bg-color);
--sidebar-scrollbar-thumb-hover-color: #7a7f83;
--settings-bg-color: #202124;
--settings-text-color: #bdc1c6;
--settings-border-color: #3c4043;
--settings-header-text-color: #e8eaed;
--settings-close-btn-color: #bdc1c6;
--settings-close-btn-hover-color: #e8eaed;
--settings-tab-color: #bdc1c6;
--settings-tab-active-color: #8ab4f8;
--settings-tab-active-border: #8ab4f8;
--settings-input-bg: #303134;
--settings-input-text: #e8eaed;
--settings-input-border: #5f6368;
--settings-list-border: #3c4043;
--settings-list-item-border: #4a4e52;
--settings-list-btn-bg: #303134;
--settings-list-btn-hover-bg: #5f6368;
--settings-add-btn-bg: #8ab4f8;
--settings-add-btn-text: #202124;
--settings-add-btn-hover-bg: #669df6;
--settings-save-btn-bg: #8ab4f8;
--settings-save-btn-text: #202124;
--settings-save-btn-border: #8ab4f8;
--settings-save-btn-hover-bg: #669df6;
--settings-cancel-btn-bg: #303134;
--settings-cancel-btn-text: #e8eaed;
--settings-cancel-btn-hover-bg: #5f6368;
--settings-reset-btn-bg: #f28b82;
--settings-reset-btn-text: #202124;
--settings-reset-btn-border: #f28b82;
--settings-reset-btn-hover-bg: #e66a61;
--settings-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
--gscs-msg-info-bg: #2c3e50; --gscs-msg-info-text: #8ab4f8; --gscs-msg-info-border: #34495e;
--gscs-msg-success-bg: #274b34; --gscs-msg-success-text: #a8dba8; --gscs-msg-success-border: #2e7d32;
--gscs-msg-warning-bg: #533f03; --gscs-msg-warning-text: #fdd835; --gscs-msg-warning-border: #7b5e03;
--gscs-msg-error-bg: #5f2120; --gscs-msg-error-text: #f5c6cb; --gscs-msg-error-border: #8d2626;
--gscs-ntf-info-bg: var(--gscs-msg-info-bg); --gscs-ntf-info-text: var(--gscs-msg-info-text); --gscs-ntf-info-border: var(--gscs-msg-info-border);
--gscs-ntf-success-bg: var(--gscs-msg-success-bg); --gscs-ntf-success-text: var(--gscs-msg-success-text); --gscs-ntf-success-border: var(--gscs-msg-success-border);
--gscs-ntf-warning-bg: var(--gscs-msg-warning-bg); --gscs-ntf-warning-text: var(--gscs-msg-warning-text); --gscs-ntf-warning-border: var(--gscs-msg-warning-border);
--gscs-ntf-error-bg: var(--gscs-msg-error-bg); --gscs-ntf-error-text: var(--gscs-msg-error-text); --gscs-ntf-error-border: var(--gscs-msg-error-border);
}
#customizable-search-sidebar.minimal-theme { background-color: transparent !important; border: none !important; box-shadow: none !important; border-radius: 0 !important; padding: 5px 10px !important; }
#customizable-search-sidebar.minimal-theme.minimal-light { --sidebar-text-color: #3c4043; --sidebar-link-color: #1a0dab; --sidebar-link-hover-color: #1a0dab; --sidebar-selected-color: #000000; --sidebar-section-border-color: #ebebeb; --sidebar-header-btn-color: #5f6368; --sidebar-header-btn-hover-color: #1a0dab; --sidebar-input-bg: rgba(255, 255, 255, 0.8); --sidebar-input-text: #202124; --sidebar-input-border: #dadce0; --sidebar-tool-btn-bg: transparent; --sidebar-tool-btn-border: #dadce0; --sidebar-tool-btn-text: #1a0dab; --sidebar-tool-btn-hover-bg: rgba(0, 0, 0, 0.05); --sidebar-tool-btn-hover-border: #dadce0; --sidebar-tool-btn-hover-text: #1a0dab; --sidebar-tool-btn-active-bg: rgba(26, 115, 232, 0.1); --sidebar-tool-btn-active-text: #1967d2; --sidebar-tool-btn-active-border: #aecbfa; --sidebar-scrollbar-thumb-color: #bababa; --sidebar-scrollbar-track-color: rgba(0,0,0,0.05); --sidebar-scrollbar-thumb-hover-color: #888888;}
#customizable-search-sidebar.minimal-theme.minimal-light .section-title { color: var(--sidebar-link-color); }
#customizable-search-sidebar.minimal-theme.minimal-light .date-input::-webkit-calendar-picker-indicator { filter: none; }
#customizable-search-sidebar.minimal-theme.minimal-dark { --sidebar-text-color: #bdc1c6; --sidebar-link-color: #8ab4f8; --sidebar-link-hover-color: #8ab4f8; --sidebar-selected-color: #e8eaed; --sidebar-section-border-color: #4a4a4a; --sidebar-header-btn-color: #bdc1c6; --sidebar-header-btn-hover-color: #8ab4f8; --sidebar-input-bg: rgba(48, 49, 52, 0.8); --sidebar-input-text: #e8eaed; --sidebar-input-border: #5f6368; --sidebar-tool-btn-bg: transparent; --sidebar-tool-btn-border: #5f6368; --sidebar-tool-btn-text: #8ab4f8; --sidebar-tool-btn-hover-bg: rgba(255, 255, 255, 0.08); --sidebar-tool-btn-hover-border: #5f6368; --sidebar-tool-btn-hover-text: #8ab4f8; --sidebar-tool-btn-active-bg: rgba(138, 180, 248, 0.15); --sidebar-tool-btn-active-text: #8ab4f8; --sidebar-tool-btn-active-border: #8ab4f8; --sidebar-scrollbar-thumb-color: #55595d; --sidebar-scrollbar-track-color: rgba(255,255,255,0.08); --sidebar-scrollbar-thumb-hover-color: #6b6f73;}
#customizable-search-sidebar.minimal-theme.minimal-dark .section-title { color: var(--sidebar-link-color); }
#customizable-search-sidebar.minimal-theme.minimal-dark .date-input::-webkit-calendar-picker-indicator { filter: invert(1) brightness(0.9); }
#customizable-search-sidebar.minimal-theme .sidebar-header { border-bottom-color: transparent !important; }
#customizable-search-sidebar.minimal-theme #sidebar-fixed-top-buttons { background-color: transparent !important; border-bottom-color: var(--sidebar-section-border-color) !important; }
#customizable-search-sidebar.minimal-theme .section-title::before { color: var(--sidebar-text-color); }
#customizable-search-sidebar.minimal-theme .date-input { background-color: var(--sidebar-input-bg) !important; border: 1px solid var(--sidebar-input-border) !important; color: var(--sidebar-input-text) !important; }
#customizable-search-sidebar { position: fixed; background-color: var(--sidebar-bg-color); border: 1px solid var(--sidebar-border-color); padding: 0 10px 0; z-index: 1001; color: var(--sidebar-text-color); box-shadow: var(--sidebar-shadow); border-radius: 8px; overflow: hidden; max-height: 85vh; cursor: default; display: flex; flex-direction: column; opacity: 1; transition: opacity 0.3s ease, width 0.3s ease, transform 0.3s ease, padding 0.3s ease; font-size: var(--sidebar-font-base-size); }
#customizable-search-sidebar *, #settings-window *, .settings-modal-content * { box-sizing: border-box; }
#customizable-search-sidebar .sidebar-header { display: flex; justify-content: space-between; align-items: center; min-height: calc(var(--sidebar-header-icon-base-size) * 1.15 + 10px); height: auto; margin: 0 -10px; padding: 5px 5px; flex-shrink: 0; user-select: none; border-bottom: 1px solid var(--sidebar-section-border-color); flex-wrap: wrap; }
#customizable-search-sidebar #sidebar-collapse-button, #customizable-search-sidebar .sidebar-settings-button, #customizable-search-sidebar .sidebar-header-button { background: none; border: none; cursor: pointer; padding: 0; color: var(--sidebar-header-btn-color); font-size: var(--sidebar-header-icon-base-size); width: calc(var(--sidebar-header-icon-base-size) * 1.15); height: calc(var(--sidebar-header-icon-base-size) * 1.15); line-height: calc(var(--sidebar-header-icon-base-size) * 1.15); flex-shrink: 0; text-align: center; margin: 0 0.2em; display: inline-flex; align-items: center; justify-content: center; box-sizing: content-box; }
#customizable-search-sidebar .sidebar-header a.sidebar-header-button { text-decoration: none; display: inline-flex; align-items: center; justify-content: center; padding: 0; width: calc(var(--sidebar-header-icon-base-size) * 1.15); height: calc(var(--sidebar-header-icon-base-size) * 1.15); color: var(--sidebar-header-btn-color); box-sizing: content-box; margin: 0 0.2em; }
#customizable-search-sidebar .sidebar-header a.sidebar-header-button svg { width: var(--sidebar-header-icon-base-size); height: var(--sidebar-header-icon-base-size); flex-shrink: 0; }
#customizable-search-sidebar #sidebar-collapse-button { order: -1; margin-right: 0.3em;}
#customizable-search-sidebar .sidebar-settings-button { margin-left: 0.3em; }
#customizable-search-sidebar #sidebar-collapse-button:hover, #customizable-search-sidebar .sidebar-settings-button:hover, #customizable-search-sidebar .sidebar-header-button:hover, #customizable-search-sidebar .sidebar-header a.sidebar-header-button:hover { color: var(--sidebar-header-btn-hover-color); }
#customizable-search-sidebar .sidebar-header-button#tool-verbatim.active,
#customizable-search-sidebar .sidebar-header-button#tool-personalize-search.active {
background-color: var(--sidebar-header-btn-active-bg);
color: var(--sidebar-header-btn-active-color);
border-radius: 3px;
}
#customizable-search-sidebar .sidebar-header-button#tool-personalize-search.active svg {
stroke: var(--sidebar-header-btn-active-color);
}
#customizable-search-sidebar .sidebar-drag-handle { flex-grow: 1; height: 100%; min-height: calc(var(--sidebar-header-icon-base-size) * 1.15); cursor: move; min-width: 20px; }
#customizable-search-sidebar .sidebar-drag-handle:active { cursor: grabbing; }
#customizable-search-sidebar #sidebar-fixed-top-buttons { padding: calc(10px * var(--sidebar-spacing-multiplier)) 10px calc(5px * var(--sidebar-spacing-multiplier)) 10px; border-bottom: 1px solid var(--sidebar-section-border-color); flex-shrink: 0; background-color: var(--sidebar-bg-color); margin: 0 -10px calc(5px * var(--sidebar-spacing-multiplier)) -10px; }
#customizable-search-sidebar #sidebar-fixed-top-buttons:empty { display: none; padding: 0; border: none; margin: 0; }
#customizable-search-sidebar .fixed-top-button-item { margin-bottom: calc(5px * var(--sidebar-spacing-multiplier)); }
#customizable-search-sidebar .fixed-top-button-item:last-child { margin-bottom: 0; }
#customizable-search-sidebar .sidebar-content-wrapper { flex-grow: 1; overflow-y: auto; overflow-x: hidden; position: relative; padding: calc(5px * var(--sidebar-spacing-multiplier)) 5px calc(10px * var(--sidebar-spacing-multiplier)) 0; scrollbar-gutter: stable; }
#customizable-search-sidebar .sidebar-section { margin-bottom: calc(15px * var(--sidebar-spacing-multiplier)); padding-bottom: calc(10px * var(--sidebar-spacing-multiplier)); border-bottom: 1px solid var(--sidebar-section-border-color); display: flex; flex-direction: column; }
#customizable-search-sidebar .sidebar-section:last-child { border-bottom: none; padding-bottom: 0; margin-bottom: 0; }
#customizable-search-sidebar .section-title { font-weight: bold; margin-bottom: calc(8px * var(--sidebar-spacing-multiplier)); cursor: pointer; color: var(--sidebar-link-color); white-space: nowrap; user-select: none; display: flex; align-items: center; position: relative; }
#customizable-search-sidebar .section-title::before { content: '▼'; font-size: 0.7em; margin-right: 4px; display: inline-block; transition: transform 0.2s ease-in-out; }
#customizable-search-sidebar .section-title.collapsed::before { transform: rotate(-90deg); }
#customizable-search-sidebar .section-content { margin-left: 5px; overflow: hidden; transition: max-height 0.3s ease-out, visibility 0.3s ease-out, opacity 0.3s ease-in-out; max-height: 1000px; visibility: visible; opacity: 1; }
#customizable-search-sidebar .section-content.collapsed { max-height: 0; visibility: hidden; opacity: 0; margin-top: calc(-8px * var(--sidebar-spacing-multiplier)); padding-bottom: 0; }
#customizable-search-sidebar .filter-option { display: block; margin-bottom: calc(5px * var(--sidebar-spacing-multiplier)); color: var(--sidebar-text-color); text-decoration: none; cursor: pointer; padding: calc(2px * var(--sidebar-spacing-multiplier)) 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1em; }
#customizable-search-sidebar .filter-option:hover { text-decoration: underline; color: var(--sidebar-link-hover-color); }
#customizable-search-sidebar .filter-option.selected { font-weight: bold; color: var(--sidebar-selected-color); }
#customizable-search-sidebar .date-input-label { display: block; margin-bottom: calc(2px * var(--sidebar-spacing-multiplier)); font-size: 0.85em; }
#customizable-search-sidebar .date-input { display: block; margin-bottom: calc(5px * var(--sidebar-spacing-multiplier)); width: calc(100% - 10px); padding: 0.3em; font-size: 0.9em; border: 1px solid var(--sidebar-input-border); background-color: var(--sidebar-input-bg); color: var(--sidebar-input-text); border-radius: 4px; }
#customizable-search-sidebar .tool-button { display: inline-flex; align-items: center; justify-content: center; width: 100%; padding: 0.4em 0.6em; margin-bottom: calc(5px * var(--sidebar-spacing-multiplier)); text-align: center; cursor: pointer; font-size: 0.9em; text-decoration: none; border-radius: 4px; background-color: var(--sidebar-tool-btn-bg); border: 1px solid var(--sidebar-tool-btn-border); color: var(--sidebar-tool-btn-text); line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; box-sizing: border-box; }
#customizable-search-sidebar .tool-button:hover { background-color: var(--sidebar-tool-btn-hover-bg); border-color: var(--sidebar-tool-btn-hover-border); color: var(--sidebar-tool-btn-hover-text, var(--sidebar-tool-btn-text)); }
#customizable-search-sidebar .tool-button.active { background-color: var(--sidebar-tool-btn-active-bg); color: var(--sidebar-tool-btn-active-text); border-color: var(--sidebar-tool-btn-active-border); font-weight: bold; }
#customizable-search-sidebar .tool-button#tool-personalize-search.active svg { stroke: var(--sidebar-tool-btn-active-text); }
#customizable-search-sidebar .tool-button svg { flex-shrink: 0; margin-right: 0.4em; width: 0.9em; height: 0.9em; vertical-align: middle; }
#customizable-search-sidebar .tool-button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
#customizable-search-sidebar .custom-list { list-style: none; padding: 0; margin: 0; }
#customizable-search-sidebar #sidebar-section-site-search .custom-list li { padding: 0; margin: 0; }
#customizable-search-sidebar #sidebar-section-site-search .filter-option { margin-bottom: calc(3px * var(--sidebar-spacing-multiplier)); }
#customizable-search-sidebar.sidebar-collapsed { width: 40px !important; padding: 5px !important; overflow: hidden; }
#customizable-search-sidebar.sidebar-collapsed .sidebar-header { margin-bottom: 0; padding: 0; justify-content: center; height: 100%; flex-direction: column; align-items: center; border-bottom: none; gap: 0.5em; }
#customizable-search-sidebar.sidebar-collapsed #sidebar-fixed-top-buttons, #customizable-search-sidebar.sidebar-collapsed .sidebar-content-wrapper, #customizable-search-sidebar.sidebar-collapsed .sidebar-drag-handle { display: none !important; }
#customizable-search-sidebar.sidebar-collapsed .sidebar-header > * { margin: 0 !important; }
#customizable-search-sidebar.sidebar-collapsed #sidebar-collapse-button { order: 0; }
#customizable-search-sidebar .filter-option .country-icon-container { display: inline-block; width: 1.8em; text-align: center; margin-right: 0.4em; vertical-align: text-bottom; }
#customizable-search-sidebar .filter-option .country-icon-container > svg { vertical-align: middle; max-height: 1em; }
#customizable-search-sidebar .date-range-error-message { display: none; font-size: 0.85em; color: #dc3545; margin-top: 0.3em; margin-bottom: 0.5em; text-align: left; }
#customizable-search-sidebar .date-range-error-message.error-visible { display: block; }
/* Scrollbar Styling */
#customizable-search-sidebar .sidebar-content-wrapper { scrollbar-width: thin; scrollbar-color: var(--sidebar-scrollbar-thumb-color) var(--sidebar-scrollbar-track-color); }
#customizable-search-sidebar .sidebar-content-wrapper::-webkit-scrollbar { width: 6px; height: 6px; }
#customizable-search-sidebar .sidebar-content-wrapper::-webkit-scrollbar-track { background: var(--sidebar-scrollbar-track-color); border-radius: 3px; }
#customizable-search-sidebar .sidebar-content-wrapper::-webkit-scrollbar-thumb { background-color: var(--sidebar-scrollbar-thumb-color); border-radius: 3px; }
#customizable-search-sidebar .sidebar-content-wrapper::-webkit-scrollbar-thumb:hover { background-color: var(--sidebar-scrollbar-thumb-hover-color); }
#settings-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: none; justify-content: center; align-items: center; background-color: rgba(0,0,0,0.4); z-index: 1000; pointer-events: auto; }
#settings-window { background-color: var(--settings-bg-color); border: 1px solid var(--settings-border-color); padding: 20px; border-radius: 8px; box-shadow: var(--settings-shadow); width: 450px; max-width: 90%; max-height: 80vh; overflow-y: auto; font-size: 14px; color: var(--settings-text-color); position: relative; z-index: 2000; pointer-events: auto; display: flex; flex-direction: column; }
#settings-window .gscs-message-bar { padding: 10px; margin-bottom: 15px; border: 1px solid transparent; border-radius: 4px; text-align: center; font-size: 0.95em; }
#settings-window .gscs-message-bar.gscs-msg-info { color: var(--gscs-msg-info-text); background-color: var(--gscs-msg-info-bg); border-color: var(--gscs-msg-info-border); }
#settings-window .gscs-message-bar.gscs-msg-success { color: var(--gscs-msg-success-text); background-color: var(--gscs-msg-success-bg); border-color: var(--gscs-msg-success-border); }
#settings-window .gscs-message-bar.gscs-msg-warning { color: var(--gscs-msg-warning-text); background-color: var(--gscs-msg-warning-bg); border-color: var(--gscs-msg-warning-border); }
#settings-window .gscs-message-bar.gscs-msg-error { color: var(--gscs-msg-error-text); background-color: var(--gscs-msg-error-bg); border-color: var(--gscs-msg-error-border); }
#settings-window .settings-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; padding-bottom: 10px; border-bottom: 1px solid var(--settings-border-color); flex-shrink: 0; }
#settings-window .settings-header h3 { margin: 0; font-size: 1.2em; font-weight: bold; color: var(--settings-header-text-color); }
#settings-window .settings-close-button { font-size: 1.5em; cursor: pointer; border: none; background: none; padding: 0; color: var(--settings-close-btn-color); line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
#settings-window .settings-close-button svg { width: 1.1em; height: 1.1em; }
#settings-window .settings-close-button:hover { color: var(--settings-close-btn-hover-color); }
#settings-window .settings-tabs { display: flex; border-bottom: 1px solid var(--settings-border-color); margin-bottom: 15px; flex-wrap: wrap; flex-shrink: 0; }
#settings-window .tab-button { padding: 0.7em 1em; cursor: pointer; border: none; background: none; font-size: 1em; color: var(--settings-tab-color); border-bottom: 2px solid transparent; margin-right: 10px; margin-bottom: -1px; white-space: nowrap; }
#settings-window .tab-button.active { color: var(--settings-tab-active-color); font-weight: bold; border-bottom-color: var(--settings-tab-active-border); }
#settings-window .settings-tab-content { flex-grow: 1; overflow-y: auto; }
#settings-window .settings-tab-content .tab-pane { display: none; animation: fadeIn 0.3s ease-in-out; }
#settings-window .settings-tab-content .tab-pane.active { display: block; }
#settings-window .setting-item { margin-bottom: 1em; padding-bottom: 1em; border-bottom: 1px solid var(--settings-border-color); }
#settings-window .setting-item:last-child { border-bottom: none; padding-bottom: 0; }
#settings-window .setting-item label:not(.inline) { display: block; font-weight: bold; margin-bottom: 0.4em; }
#settings-window .setting-item label.inline { display: inline-block; margin-bottom: 0; margin-left: 0.4em; font-weight: normal; vertical-align: middle; }
#settings-window #tab-pane-appearance .setting-item { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 0.5em; }
#settings-window #tab-pane-appearance .setting-item > label:first-child { width: 100%; }
#settings-window #tab-pane-appearance .setting-item .setting-range-hint { width: 100%; order: 1; font-size: 0.85em; color: var(--settings-tab-color); font-weight: normal; margin-left: 0; }
#settings-window #tab-pane-appearance .setting-item input[type="range"] { flex-grow: 1; order: 2; padding: 0; height: auto; cursor: pointer; vertical-align: middle; min-width: 150px; margin-top: 0.2em; }
#settings-window #tab-pane-appearance .setting-item .range-value { order: 3; margin-left: 0.5em; font-size: 0.9em; color: var(--settings-tab-color); min-width: 3em; text-align: right; flex-shrink: 0; vertical-align: middle; line-height: 1.8; }
#settings-window #tab-pane-appearance .setting-item > div { transition: opacity 0.3s ease; }
#settings-window .setting-item input[type="text"]:not(#new-site-name):not(#new-site-url):not(#new-lang-text):not(#new-lang-value):not(#new-time-text):not(#new-timerange-value):not(#new-ft-text):not(#new-ft-value):not(#new-country-text):not(#new-country-value), #settings-window .setting-item select { width: 100%; padding: 0.6em; border: 1px solid var(--settings-input-border); border-radius: 4px; font-size: 0.9em; background-color: var(--settings-input-bg); color: var(--settings-input-text); margin-top: 0.2em; }
#settings-window .setting-item input[type="checkbox"] { margin-right: 0.4em; vertical-align: middle; }
#settings-window .settings-footer { display: flex; justify-content: flex-end; align-items: center; padding-top: 1em; border-top: 1px solid var(--settings-border-color); margin-top: 1.2em; gap: 0.7em; flex-shrink: 0; }
#settings-window .settings-footer button { padding: 0.6em 1em; border-radius: 4px; cursor: pointer; font-size: 1em; }
#settings-window .settings-footer .save-button { background-color: var(--settings-save-btn-bg); color: var(--settings-save-btn-text); border: 1px solid var(--settings-save-btn-border); }
#settings-window .settings-footer .save-button:hover { background-color: var(--settings-save-btn-hover-bg); }
#settings-window .settings-footer .cancel-button { background-color: var(--settings-cancel-btn-bg); color: var(--settings-cancel-btn-text); border: 1px solid var(--settings-input-border); }
#settings-window .settings-footer .cancel-button:hover { background-color: var(--settings-cancel-btn-hover-bg); }
#settings-window .settings-footer .reset-button { background-color: var(--settings-reset-btn-bg); color: var(--settings-reset-btn-text); border: 1px solid var(--settings-reset-btn-border); margin-right: auto; }
#settings-window .settings-footer .reset-button:hover { background-color: var(--settings-reset-btn-hover-bg); }
#settings-window .setting-item.simple { margin-bottom: 0.4em; padding-bottom: 0.4em; border-bottom: none; }
.gscs-drag-icon { display: inline-flex; align-items: center; justify-content: center; width: 1.5em; height: 1.5em; margin-right: 0.5em; color: var(--settings-tab-color); cursor: grab; flex-shrink: 0; }
.gscs-drag-icon svg { width: 1em; height: 1em; }
.section-order-list { list-style: none; padding: 0; margin-top: 0.5em; border: 1px solid var(--settings-border-color); border-radius: 4px; max-height: 250px; overflow-y: auto; }
.section-order-list li { display: flex; align-items: center; padding: 0.6em 0.8em; border-bottom: 1px dashed var(--settings-list-item-border); background-color: var(--settings-input-bg); }
.section-order-list li:last-child { border-bottom: none; }
.section-order-list li .gscs-drag-icon { margin-right: 0.6em; }
.section-order-list li span:not(.gscs-drag-icon) { flex-grow: 1; color: var(--settings-text-color); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.section-order-list li[draggable="true"] { cursor: grab; user-select: none; }
.section-order-list li[draggable="true"]:active { cursor: grabbing; }
li.gscs-dragging-item { opacity: 0.4 !important; background: var(--settings-list-btn-hover-bg) !important; border-style: dashed !important; }
li.gscs-drag-over-highlight { border-top: 2px solid var(--settings-tab-active-border) !important; margin-top: -2px !important; }
.section-order-list li.gscs-drag-over-highlight { padding-top: calc(0.6em + 2px) !important; }
.settings-modal-content .custom-list li.gscs-drag-over-highlight { padding-top: calc(0.5em + 2px) !important; }
#tab-pane-custom .manage-custom-button { padding: 0.6em 1em; font-size: 0.95em; }
#tab-pane-custom .manage-custom-button:hover { background-color: var(--settings-list-btn-hover-bg); }
#tab-pane-custom .setting-item { padding-bottom: 0.8em; margin-bottom: 0.8em; border-bottom: 1px dashed var(--settings-border-color); }
#tab-pane-custom .setting-item:last-child { border-bottom: none; }
.settings-modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); z-index: 2050; display: flex; justify-content: center; align-items: center; animation: fadeIn 0.2s ease-out; pointer-events: auto; }
.settings-modal-content { background-color: var(--settings-bg-color); color: var(--settings-text-color); padding: 20px 25px; border-radius: 8px; box-shadow: var(--settings-shadow); width: 550px; max-width: 95%; max-height: 90vh; display: flex; flex-direction: column; position: relative; z-index: 2100; pointer-events: auto; }
.settings-modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; padding-bottom: 10px; border-bottom: 1px solid var(--settings-border-color); }
.settings-modal-header h4 { margin: 0; font-size: 1.15em; font-weight: bold; color: var(--settings-header-text-color); }
.settings-modal-close-btn { font-size: 1.5em; cursor: pointer; border: none; background: none; padding: 0; color: var(--settings-close-btn-color); line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
.settings-modal-close-btn svg { width: 1em; height: 1em; }
.settings-modal-close-btn:hover { color: var(--settings-close-btn-hover-color); }
.settings-modal-body { flex-grow: 1; overflow-y: auto; margin-bottom: 15px; padding-right: 5px; }
.settings-modal-body hr { border: none; border-top: 1px dashed var(--settings-border-color); margin: 1em 0; }
.settings-modal-footer { display: flex; justify-content: flex-end; padding-top: 15px; border-top: 1px solid var(--settings-border-color); }
.settings-modal-footer button { padding: 0.6em 1.2em; border-radius: 4px; cursor: pointer; font-size: 1em; background-color: var(--settings-save-btn-bg); color: var(--settings-save-btn-text); border: 1px solid var(--settings-save-btn-border); }
.settings-modal-footer button:hover { background-color: var(--settings-save-btn-hover-bg); }
.settings-modal-body .predefined-options-list { list-style: none; padding: 0; margin: 0.5em 0 1em 0; max-height: 150px; overflow-y: auto; border: 1px solid var(--settings-list-border); border-radius: 4px; width: 100%; }
.settings-modal-body .predefined-options-list li { padding: 0.4em 0.7em; border-bottom: 1px dashed var(--settings-list-item-border); }
.settings-modal-body .predefined-options-list li:last-child { border-bottom: none; }
.settings-modal-body .predefined-options-list label { font-weight: normal; margin-left: 0.5em; vertical-align: middle; }
.settings-modal-body .predefined-options-list input[type="checkbox"] { vertical-align: middle; margin-right: 0.3em;}
.settings-modal-content .custom-list { list-style: none; padding: 0; margin: 0.5em 0 1em 0; border: 1px solid var(--settings-list-border); border-radius: 4px; max-height: 200px; overflow-y: auto; }
.settings-modal-content .custom-list li { display: flex; align-items: center; padding: 0.5em 0.7em; border-bottom: 1px dashed var(--settings-list-item-border); background-color: var(--settings-input-bg); position: relative; }
.settings-modal-content .custom-list li:last-child { border-bottom: none; }
.settings-modal-content .custom-list li .gscs-drag-icon { margin-right: 0.5em; }
.settings-modal-content .custom-list li > span:not(.gscs-drag-icon):not(.item-controls) { flex-grow: 1; margin-right: 0.5em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--settings-text-color); }
.settings-modal-content .custom-list li .item-controls { margin-left: auto; flex-shrink: 0; display: inline-flex; gap: 0.3em; }
.settings-modal-content .item-controls button { display: inline-flex; align-items: center; justify-content: center; line-height: 1; padding: 0.2em; width: 1.8em; height: 1.8em; background-color: var(--settings-list-btn-bg); border: 1px solid var(--settings-input-border); border-radius: 3px; color: var(--settings-text-color); }
.settings-modal-content .item-controls button:hover { background-color: var(--settings-list-btn-hover-bg); }
.settings-modal-content .item-controls button svg { width: 1em; height: 1em; }
.settings-modal-content .custom-list li[draggable="true"] { cursor: grab; user-select: none; }
.settings-modal-content .custom-list li[draggable="true"]:active { cursor: grabbing; }
/* Predefined Chooser styles */
.gscs-modal-add-new-option-button-class { /* Matches .tool-button */
display: inline-flex; align-items: center; justify-content: center; width: auto; /* Auto width */
padding: 0.4em 0.8em; /* More padding for text */ margin-bottom: 0.8em; /* Space below button */
text-align: center; cursor: pointer; font-size: 0.9em; text-decoration: none;
border-radius: 4px; background-color: var(--sidebar-tool-btn-bg);
border: 1px solid var(--sidebar-tool-btn-border); color: var(--sidebar-tool-btn-text);
line-height: 1.4;
}
.gscs-modal-add-new-option-button-class:hover { background-color: var(--sidebar-tool-btn-hover-bg); border-color: var(--sidebar-tool-btn-hover-border); color: var(--sidebar-tool-btn-hover-text); }
.gscs-modal-predefined-chooser {
border: 1px solid var(--settings-border-color);
border-radius: 4px;
padding: 10px;
margin-top: 5px; /* Space below the "Add New Option" button */
margin-bottom: 10px; /* Space before the main list */
background-color: var(--settings-input-bg);
max-height: 150px; /* Limit height */
overflow-y: auto; /* Add scroll for many items */
}
.gscs-modal-predefined-chooser ul { list-style: none; padding: 0; margin: 0; }
.gscs-modal-predefined-chooser li.gscs-modal-predefined-chooser-item {
padding: 0.3em 0.5em;
cursor: default; /* Items themselves are not draggable */
}
.gscs-modal-predefined-chooser li.gscs-modal-predefined-chooser-item:hover {
background-color: var(--settings-list-btn-hover-bg);
}
.gscs-modal-predefined-chooser li.gscs-modal-predefined-chooser-item input[type="checkbox"] {
margin-right: 0.5em;
vertical-align: middle;
}
.gscs-modal-predefined-chooser li.gscs-modal-predefined-chooser-item label {
font-weight: normal;
vertical-align: middle;
color: var(--settings-text-color);
}
.gscs-modal-predefined-chooser .chooser-buttons {
text-align: right;
margin-top: 10px;
padding-top: 10px;
border-top: 1px solid var(--settings-border-color);
}
.gscs-modal-predefined-chooser .chooser-buttons button {
margin-left: 5px;
padding: 0.4em 0.8em; /* Make buttons a bit smaller than main modal buttons */
}
.settings-modal-content .custom-list-input-group { display: flex; align-items: flex-start; gap: 0.5em; margin-bottom: 0.3em; flex-wrap: wrap; }
.settings-modal-content .custom-list-input-group > div { display: flex; flex-direction: column; flex-grow: 1; min-width: 80px; }
.settings-modal-content .custom-list-input-group input[type="text"] { width: 100%; }
.settings-modal-content .custom-list-input-group button { flex-shrink: 0; align-self: flex-end; margin-bottom: calc(0.2em + 0.85em * 1.2); }
.settings-modal-content .custom-list-input-group .add-custom-button svg, .settings-modal-content .custom-list-input-group .cancel-edit-button svg { width: 1.2em; height: 1.2em; margin:0; }
.input-error-message { display: none; width: 100%; font-size: 0.85em; color: #dc3545; margin-top: 0.2em; line-height:1.2; }
.input-error-message.error-visible { display: block; }
input.input-has-error { border-color: #dc3545 !important; }
.settings-modal-content input.input-valid { border-color: #28a745 !important; }
.settings-modal-content .custom-list-input-group + .setting-value-hint { display: block; margin-top: 0.5em; font-size: 0.9em; white-space: normal; color: var(--settings-tab-color); }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
#customizable-search-sidebar button svg,
#settings-window button:not(.settings-modal-close-btn) svg,
.settings-modal-content button:not(.settings-modal-close-btn):not(.gscs-modal-add-new-option-button-class) svg { /* Exclude new button if it doesn't have icon */
display: inline-block;
vertical-align: middle;
width: 1em;
height: 1em;
pointer-events: none;
}
#customizable-search-sidebar .sidebar-header-button svg,
#customizable-search-sidebar #sidebar-collapse-button svg,
#customizable-search-sidebar .sidebar-settings-button svg {
width: var(--sidebar-header-icon-base-size);
height: var(--sidebar-header-icon-base-size);
}
#customizable-search-sidebar .tool-button svg {
width: 0.9em;
height: 0.9em;
}
#gscs-notification-container { position: fixed; bottom: 20px; right: 20px; z-index: 9999; display: flex; flex-direction: column-reverse; align-items: flex-end; gap: 10px; }
.gscs-notification { background-color: var(--settings-input-bg); color: var(--settings-text-color); padding: 12px 18px; border-radius: 6px; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2); min-width: 250px; max-width: 400px; font-size: 0.95em; border: 1px solid var(--settings-border-color); opacity: 1; transition: opacity 0.5s ease-out, transform 0.3s ease-out; transform: translateX(0); }
.gscs-notification:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3); }
.gscs-notification.gscs-ntf-info { background-color: var(--gscs-ntf-info-bg); color: var(--gscs-ntf-info-text); border-color: var(--gscs-ntf-info-border); }
.gscs-notification.gscs-ntf-success { background-color: var(--gscs-msg-success-bg); color: var(--gscs-msg-success-text); border-color: var(--gscs-msg-success-border); }
.gscs-notification.gscs-ntf-warning { background-color: var(--gscs-msg-warning-bg); color: var(--gscs-msg-warning-text); border-color: var(--gscs-msg-warning-border); }
.gscs-notification.gscs-ntf-error { background-color: var(--gscs-msg-error-bg); color: var(--gscs-msg-error-text); border-color: var(--gscs-msg-error-border); }
.gscs-notification span[style*="cursor: pointer"] { font-weight: bold; opacity: 0.7; }
.gscs-notification span[style*="cursor: pointer"]:hover { opacity: 1; }
/* --- END OF GSCS CSS --- */
`;
if (typeof GM_info !== 'undefined' && GM_info.script && GM_info.script.version) {
console.log(`[GSCS StylesProvider v${GM_info.script.version.replace('-styles','-styles-final')}] CSS loaded into window.GSCS_Namespace.stylesText`);
} else {
console.log(`[GSCS StylesProvider v0.0.5-styles] CSS loaded into window.GSCS_Namespace.stylesText`);
}
})();