m-border-radius) !important; color: var(--color-text-2); position: relative; background-color: transparent !important; } li[class^="MenuItem-"].active, #content-container [class^="ListItemContainer-"].active, .ant-segmented-group .ant-segmented-item-label[aria-selected="true"] { box-shadow: var(--chat-customize-box-shadow4) !important; background: var(--color-background-soft) !important; color: var(--color-text-1); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); will-change: backdrop-filter; border-left: 2px solid var(--color-cyber-accent) !important; } li[class^="MenuItem-"].active::after, #content-container [class^="ListItemContainer-"].active::after { content: ""; position: absolute; right: 0; top: 5px; width: 5px; height: 5px; background-color: var(--color-cyber-accent); } li[class^="MenuItem-"]:hover, #content-container [class^="ListItemContainer-"]:hover, .ant-segmented-group .ant-segmented-item-label:hover { box-shadow: var(--chat-customize-box-shadow4) !important; background: var(--color-background-soft) !important; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); will-change: backdrop-filter; color: var(--color-text-1); } /* Sidebar Icons */ #app-sidebar [class^="Icon-"].active, #app-sidebar [class^="Icon-"]:hover { box-shadow: var(--chat-customize-box-shadow3) !important; background: transparent !important; transition: all 0.2s ease; border: none !important; color: var(--color-cyber-accent-bright) !important; position: relative; } #app-sidebar [class^="Icon-"].active::before { content: ""; position: absolute; top: -2px; right: -2px; width: 6px; height: 6px; border-top: 2px solid var(--color-cyber-accent); border-right: 2px solid var(--color-cyber-accent); } #app-sidebar [class^="Icon-"].active::after { content: ""; position: absolute; bottom: -2px; left: -2px; width: 6px; height: 6px; border-bottom: 2px solid var(--color-cyber-accent); border-left: 2px solid var(--color-cyber-accent); } /* Setting Group / Segmented Control */ div[class^="SettingGroup-"] .ant-segmented, div[class^="SettingContainer-"] div[class^="SettingGroup-"], .ant-segmented.ant-segmented-shape-round { border-radius: var(--list-item-border-radius) !important; background-color: var(--color-background-opacity) !important; box-shadow: var(--chat-customize-box-shadow) !important; backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); will-change: backdrop-filter; clip-path: polygon(0 var(--cyber-angle-size), var(--cyber-angle-size) 0, calc(100% - var(--cyber-angle-size)) 0, 100% var(--cyber-angle-size), 100% calc(100% - var(--cyber-angle-size)), calc(100% - var(--cyber-angle-size)) 100%, var(--cyber-angle-size) 100%, 0 calc(100% - var(--cyber-angle-size))); border: var(--cyber-line-width) solid var(--color-cyber-line-dim); } .ant-segmented-thumb, label.ant-segmented-item.ant-segmented-item-selected { background-color: transparent !important; border: transparent !important; } .ant-segmented-thumb-motion-appear-active { display: none !important; } /* Collapse Panel */ .ant-collapse-item { border-radius: var(--list-item-border-radius) !important; box-shadow: var(--chat-customize-box-shadow) !important; overflow: hidden; background-color: transparent !important; margin-bottom: 1rem; clip-path: polygon(0 var(--cyber-angle-size), var(--cyber-angle-size) 0, calc(100% - var(--cyber-angle-size)) 0, 100% var(--cyber-angle-size), 100% calc(100% - var(--cyber-angle-size)), calc(100% - var(--cyber-angle-size)) 100%, var(--cyber-angle-size) 100%, 0 calc(100% - var(--cyber-angle-size))); border: var(--cyber-line-width) solid var(--color-cyber-line-dim); position: relative; } .ant-collapse-item::before { content: ""; position: absolute; top: 0; left: 0; width: 10px; height: 10px; border-top: 2px solid var(--color-cyber-accent); border-left: 2px solid var(--color-cyber-accent); z-index: 1; } .ant-collapse-header { background-color: var(--color-background-soft) !important; border-radius: 0 !important; backdrop-filter: blur(10px)