.kk-theme-toggle {
display: inline-flex;
align-items: center;
gap: 1px;
padding: 3px;
border: 1px solid var(--wp--preset--color--line-bright, #272E33);
border-radius: 999px;
background: var(--wp--preset--color--surface, #0C0F12);
line-height: 0;
}
.kk-tt-btn {
display: inline-flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
margin: 0;
padding: 0;
border: 0;
border-radius: 999px;
background: transparent;
color: var(--wp--preset--color--faint, #828F99);
cursor: pointer;
-webkit-appearance: none;
appearance: none;
transition: color .15s ease, background-color .15s ease;
}
.kk-tt-btn:hover {
color: var(--wp--preset--color--muted, #8B9AA3);
}
.kk-tt-btn.is-active {
color: var(--wp--preset--color--accent, #2DD4BF);
background: var(--wp--preset--color--surface-2, #12161A);
}
.kk-tt-btn svg {
width: 15px;
height: 15px;
display: block;
}
.kk-tt-btn:focus-visible {
outline: 2px solid var(--wp--preset--color--accent, #2DD4BF);
outline-offset: 1px;
}