diff --git a/src/web/index.html b/src/web/index.html index dc400fe..47261d5 100644 --- a/src/web/index.html +++ b/src/web/index.html @@ -73,13 +73,21 @@ .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } /* TomSelect dark theme */ - .ts-wrapper .ts-control { background: var(--bg); border-color: var(--border); color: var(--text); min-height: 34px; padding: 4px 10px; border-radius: 5px; } - .ts-wrapper.focus .ts-control { border-color: var(--accent); box-shadow: none; } - .ts-dropdown { background: var(--surface); border-color: var(--border); color: var(--text); z-index: 150; } - .ts-dropdown .option { padding: 7px 12px; } - .ts-dropdown .option.active { background: rgba(108,99,255,0.2); color: var(--text); } - .ts-wrapper .ts-control .item { color: var(--text); background: rgba(108,99,255,0.15); border-radius: 3px; padding: 1px 6px; } - .ts-control input { color: var(--text) !important; } + .ts-wrapper .ts-control, + .ts-wrapper.multi .ts-control, + .ts-wrapper.single .ts-control { background: var(--bg) !important; border-color: var(--border) !important; color: var(--text) !important; min-height: 34px; padding: 4px 10px; border-radius: 5px; box-shadow: none !important; } + .ts-wrapper.focus .ts-control, + .ts-wrapper.single.focus .ts-control { border-color: var(--accent) !important; box-shadow: none !important; } + .ts-wrapper .ts-control input, + .ts-wrapper .ts-control input:focus { background: transparent !important; color: var(--text) !important; outline: none !important; } + .ts-dropdown, + .ts-dropdown.single, + .ts-dropdown.multi { background: var(--surface) !important; border-color: var(--border) !important; color: var(--text) !important; z-index: 150; } + .ts-dropdown .option { padding: 7px 12px; color: var(--text) !important; background: transparent !important; } + .ts-dropdown .option:hover, + .ts-dropdown .option.active { background: rgba(108,99,255,0.2) !important; color: var(--text) !important; } + .ts-dropdown .option.selected { background: rgba(108,99,255,0.1) !important; } + .ts-wrapper .ts-control .item { color: var(--text) !important; background: rgba(108,99,255,0.15) !important; border-radius: 3px; padding: 1px 6px; border: none !important; }