/* chlak-faq-v2.css */
#faq.chfaq-section {
width: min(1040px, calc(100% - 48px)) !important;
margin: 0 auto !important;
padding: 76px 0 90px !important;
box-sizing: border-box !important;
}
#faq .chfaq-head {
display: grid !important;
grid-template-columns:
minmax(0,1fr)
minmax(320px,.8fr)
!important;
align-items: end !important;
gap: 54px !important;
margin-bottom:
32px
!important;
}
#faq .chfaq-eyebrow {
margin:
0 0 13px
!important;
color:
#5367ff
!important;
font-size:
11px
!important;
font-weight:
800
!important;
line-height:
1
!important;
letter-spacing:
.13em
!important;
text-transform:
uppercase
!important;
}
#faq .chfaq-eyebrow::before {
content: "" !important;
display:
inline-block
!important;
width:
18px
!important;
height:
1px
!important;
margin:
0 9px 3px 0
!important;
background:
#5367ff
!important;
}
#faq .chfaq-head h2 {
margin:
0
!important;
color:
#111827
!important;
font-size:
clamp(42px,4.3vw,57px)
!important;
font-weight:
900
!important;
line-height:
.98
!important;
letter-spacing:
-.048em
!important;
}
#faq .chfaq-head-side {
padding-bottom:
5px
!important;
}
#faq .chfaq-head-side p {
margin:
11px 0 0
!important;
color:
#71809a
!important;
font-size:
14px
!important;
line-height:
1.68
!important;
}
#faq .chfaq-badge {
display:
inline-flex
!important;
align-items:
center
!important;
padding:
6px 10px
!important;
border:
1px solid rgba(99,102,241,.16)
!important;
border-radius:
999px
!important;
background:
#f5f6ff
!important;
color:
#5968d6
!important;
font-size:
9px
!important;
font-weight:
900
!important;
line-height:
1
!important;
letter-spacing:
.055em
!important;
text-transform:
uppercase
!important;
}
#faq .chfaq-list {
display:
grid
!important;
gap:
10px
!important;
}
#faq .chfaq-item {
overflow:
hidden
!important;
margin:
0
!important;
border:
1px solid rgba(148,163,184,.22)
!important;
border-radius:
15px
!important;
background:
rgba(255,255,255,.96)
!important;
box-shadow:
0 6px 20px rgba(15,23,42,.035)
!important;
}
#faq .chfaq-item summary {
display:
grid
!important;
grid-template-columns:
36px minmax(0,1fr) 26px
!important;
align-items:
center
!important;
gap:
14px
!important;
min-height:
68px
!important;
padding:
14px 18px
!important;
cursor:
pointer
!important;
list-style:
none
!important;
user-select:
none
!important;
}
#faq .chfaq-item summary::-webkit-details-marker {
display:
none
!important;
}
#faq .chfaq-number {
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
width:
34px
!important;
height:
34px
!important;
border:
1px solid rgba(99,102,241,.15)
!important;
border-radius:
10px
!important;
background:
#f5f6ff
!important;
color:
#5968d6
!important;
font-family:
ui-monospace,
SFMono-Regular,
Menlo,
monospace
!important;
font-size:
10px
!important;
font-weight:
800
!important;
}
#faq .chfaq-question {
color:
#1e293b
!important;
font-size:
14px
!important;
font-weight:
800
!important;
line-height:
1.4
!important;
}
#faq .chfaq-plus {
position:
relative
!important;
display:
block
!important;
width:
22px
!important;
height:
22px
!important;
border-radius:
50%
!important;
background:
#f8fafc
!important;
}
#faq .chfaq-plus::before,
#faq .chfaq-plus::after {
content:
""
!important;
position:
absolute
!important;
top:
50%
!important;
left:
50%
!important;
width:
9px
!important;
height:
1.5px
!important;
border-radius:
2px
!important;
background:
#64748b
!important;
transform:
translate(-50%,-50%)
!important;
transition:
transform .18s ease
!important;
}
#faq .chfaq-plus::after {
transform:
translate(-50%,-50%)
rotate(90deg)
!important;
}
#faq .chfaq-item[open] .chfaq-plus::after {
transform:
translate(-50%,-50%)
rotate(0deg)
!important;
}
#faq .chfaq-item[open] {
border-color:
rgba(99,102,241,.24)
!important;
box-shadow:
0 10px 30px rgba(15,23,42,.055)
!important;
}
#faq .chfaq-item[open] summary {
background:
#fbfcff
!important;
}
#faq .chfaq-answer {
padding:
0 58px 19px 68px
!important;
}
#faq .chfaq-answer p {
margin:
0
!important;
max-width:
820px
!important;
color:
#71809a
!important;
font-size:
13px
!important;
line-height:
1.7
!important;
}
@media (max-width: 900px) {
#faq.chfaq-section {
width:
min(100% - 36px,760px)
!important;
padding:
58px 0 72px
!important;
}
#faq .chfaq-head {
grid-template-columns:
1fr
!important;
gap:
18px
!important;
}
}
@media (max-width: 650px) {
#faq.chfaq-section {
width:
calc(100% - 28px)
!important;
padding:
46px 0 60px
!important;
}
#faq .chfaq-head h2 {
font-size:
38px
!important;
line-height:
1
!important;
}
#faq .chfaq-item summary {
grid-template-columns:
30px minmax(0,1fr) 24px
!important;
gap:
10px
!important;
padding:
13px
!important;
}
#faq .chfaq-number {
width:
30px
!important;
height:
30px
!important;
}
#faq .chfaq-question {
font-size:
13px
!important;
}
#faq .chfaq-answer {
padding:
0 46px 17px 53px
!important;
}
}
/* chlak-home-faq-plus-v2.css */
#faq .chfaq-plus {
position: relative !important;
display: grid !important;
place-items: center !important;
width: 22px !important;
min-width: 22px !important;
max-width: 22px !important;
height: 22px !important;
min-height: 22px !important;
max-height: 22px !important;
flex: 0 0 22px !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-radius: 50% !important;
background: #f8fafc !important;
overflow: hidden !important;
transform: none !important;
}
#faq .chfaq-plus::after {
content: none !important;
display: none !important;
}
#faq .chfaq-plus::before {
content: "+" !important;
position: static !important;
display: block !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
color: #64748b !important;
font-family:
Arial,
Helvetica,
sans-serif !important;
font-size: 14px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 1 !important;
text-align: center !important;
transform: none !important;
transition: none !important;
}
#faq .chfaq-item[open] .chfaq-plus::before {
content: "−" !important;
}
html[data-theme="dark"] #faq .chfaq-plus {
background: #172033 !important;
}
html[data-theme="dark"] #faq .chfaq-plus::before {
color: #94a3b8 !important;
}
/* chlak-footer-classic-v3.css */
.chf3 {
margin-top:
72px
!important;
border-top:
1px solid #e8edf4
!important;
background:
#ffffff
!important;
}
.chf3-inner {
width:
min(1180px, calc(100% - 48px))
!important;
margin:
0 auto
!important;
padding:
48px 0 22px
!important;
}
.chf3-main {
display:
grid
!important;
grid-template-columns:
minmax(250px,1.4fr)
repeat(4,minmax(125px,.72fr))
!important;
gap:
44px
!important;
align-items:
start
!important;
}
.chf3-brand {
max-width:
290px
!important;
}
.chf3-logo {
display:
inline-flex
!important;
align-items:
center
!important;
gap:
11px
!important;
margin-bottom:
14px
!important;
color:
#111827
!important;
font-size:
19px
!important;
font-weight:
850
!important;
letter-spacing:
-.02em
!important;
text-decoration:
none
!important;
}
.chf3-logo-mark {
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
width:
40px
!important;
height:
40px
!important;
border-radius:
11px
!important;
background:
linear-gradient(
135deg,
#f43f5e,
#a855f7 58%,
#4f46e5
)
!important;
color:
#fff
!important;
font-size:
14px
!important;
font-weight:
900
!important;
box-shadow:
0 8px 20px rgba(124,58,237,.15)
!important;
}
.chf3-brand > p {
margin:
0 0 17px
!important;
color:
#75839a
!important;
font-size:
12px
!important;
line-height:
1.65
!important;
}
.chf3-socials {
display:
flex
!important;
gap:
8px
!important;
}
.chf3-social {
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
width:
31px
!important;
height:
31px
!important;
border-radius:
9px
!important;
}
.chf3-social img {
display:
block
!important;
width:
15px
!important;
height:
15px
!important;
filter:
brightness(0) invert(1)
!important;
}
.chf3-ig {
background:
linear-gradient(
135deg,
#833ab4,
#e1306c 63%,
#fcaf45
)
!important;
}
.chf3-fb {
background:
#1877f2
!important;
}
.chf3-pin {
background:
#e60023
!important;
}
.chf3-col {
display:
flex
!important;
flex-direction:
column
!important;
align-items:
flex-start
!important;
gap:
9px
!important;
}
.chf3-col h3 {
margin:
0 0 6px
!important;
color:
#172033
!important;
font-size:
11px
!important;
font-weight:
850
!important;
letter-spacing:
.035em
!important;
}
.chf3-col a {
color:
#71809a
!important;
font-size:
11px
!important;
font-weight:
500
!important;
line-height:
1.42
!important;
text-decoration:
none
!important;
transition:
color .16s ease,
transform .16s ease
!important;
}
.chf3-col a:hover {
color:
#4f46e5
!important;
transform:
translateX(2px)
!important;
}
.chf3-soon {
color:
#a98a55
!important;
font-size:
9px
!important;
font-weight:
700
!important;
line-height:
1.4
!important;
}
.chf3-bottom {
display:
flex
!important;
align-items:
center
!important;
justify-content:
space-between
!important;
gap:
20px
!important;
margin-top:
38px
!important;
padding-top:
18px
!important;
border-top:
1px solid #edf0f5
!important;
color:
#94a3b8
!important;
font-size:
10px
!important;
}
.chf3-bottom-right {
display:
flex
!important;
align-items:
center
!important;
gap:
15px
!important;
}
.chf3-bottom-right a {
color:
#7b899e
!important;
font-size:
10px
!important;
text-decoration:
none
!important;
}
.chf3-bottom-right a:hover {
color:
#4f46e5
!important;
}
.chf3-independent {
display:
inline-flex
!important;
align-items:
center
!important;
gap:
5px
!important;
color:
#94a3b8
!important;
font-size:
9px
!important;
}
.chf3-independent::before {
content:
""
!important;
width:
5px
!important;
height:
5px
!important;
border-radius:
50%
!important;
background:
#34d399
!important;
}
.chf3-language {
padding:
6px 9px
!important;
border:
1px solid #e2e8f0
!important;
border-radius:
8px
!important;
background:
#fafbfc
!important;
color:
#64748b
!important;
font-size:
9px
!important;
font-weight:
650
!important;
}
@media (max-width: 1050px) {
.chf3-inner {
width:
min(100% - 36px,850px)
!important;
}
.chf3-main {
grid-template-columns:
repeat(2,minmax(0,1fr))
!important;
gap:
34px
!important;
}
.chf3-brand {
grid-column:
1 / -1
!important;
max-width:
520px
!important;
}
}
@media (max-width: 650px) {
.chf3 {
margin-top:
52px
!important;
}
.chf3-inner {
width:
calc(100% - 28px)
!important;
padding:
38px 0 20px
!important;
}
.chf3-main {
grid-template-columns:
1fr 1fr
!important;
gap:
30px 22px
!important;
}
.chf3-brand {
grid-column:
1 / -1
!important;
}
.chf3-bottom {
align-items:
flex-start
!important;
flex-direction:
column
!important;
}
.chf3-bottom-right {
flex-wrap:
wrap
!important;
}
}
@media (max-width: 430px) {
.chf3-main {
grid-template-columns:
1fr
!important;
}
.chf3-brand {
grid-column:
auto
!important;
}
}
/* chlak-dark-mode-v1.css */
:root {
color-scheme: light;
}
html[data-theme="dark"] {
color-scheme: dark;
}
.chf3-theme-toggle {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 32px !important;
height: 32px !important;
padding: 0 !important;
border: 1px solid #e2e8f0 !important;
border-radius: 8px !important;
background: #fafbfc !important;
color: #526176 !important;
cursor: pointer !important;
transition:
background .16s ease,
border-color .16s ease,
color .16s ease,
transform .16s ease
!important;
}
.chf3-theme-toggle:hover {
border-color: #cbd5e1 !important;
background: #f1f5f9 !important;
color: #111827 !important;
transform: translateY(-1px) !important;
}
.chf3-theme-toggle:focus-visible {
outline: 2px solid #818cf8 !important;
outline-offset: 2px !important;
}
.chf3-theme-toggle svg {
display: block !important;
width: 15px !important;
height: 15px !important;
}
.chf3-theme-sun {
display: none !important;
}
html[data-theme="dark"] .chf3-theme-moon {
display: none !important;
}
html[data-theme="dark"] .chf3-theme-sun {
display: block !important;
}
html[data-theme="dark"],
html[data-theme="dark"] body {
background: #0b1120 !important;
color: #e5e7eb !important;
}
html[data-theme="dark"] body {
transition:
background-color .18s ease,
color .18s ease
!important;
}
html[data-theme="dark"] main {
background: #0b1120 !important;
}
html[data-theme="dark"] header,
html[data-theme="dark"] .site-header,
html[data-theme="dark"] .header,
html[data-theme="dark"] .topbar {
background: rgba(11,17,32,.96) !important;
border-color: #1e293b !important;
color: #e5e7eb !important;
}
html[data-theme="dark"] header a,
html[data-theme="dark"] header button,
html[data-theme="dark"] .site-header a,
html[data-theme="dark"] .header a {
color: #cbd5e1 !important;
}
html[data-theme="dark"] #video-platforms,
html[data-theme="dark"] #broad-search-intent,
html[data-theme="dark"] #source-matching,
html[data-theme="dark"] #planned-workflow,
html[data-theme="dark"] #limits,
html[data-theme="dark"] #other-media,
html[data-theme="dark"] #faq {
color: #e5e7eb !important;
}
html[data-theme="dark"] #video-platforms h2,
html[data-theme="dark"] #video-platforms h3,
html[data-theme="dark"] #broad-search-intent h2,
html[data-theme="dark"] #broad-search-intent h3,
html[data-theme="dark"] #source-matching h2,
html[data-theme="dark"] #source-matching h3,
html[data-theme="dark"] #planned-workflow h2,
html[data-theme="dark"] #planned-workflow h3,
html[data-theme="dark"] #limits h2,
html[data-theme="dark"] #limits h3,
html[data-theme="dark"] #other-media h2,
html[data-theme="dark"] #other-media h3,
html[data-theme="dark"] #faq h2,
html[data-theme="dark"] #faq h3 {
color: #f8fafc !important;
}
html[data-theme="dark"] #video-platforms p,
html[data-theme="dark"] #broad-search-intent p,
html[data-theme="dark"] #source-matching p,
html[data-theme="dark"] #planned-workflow p,
html[data-theme="dark"] #limits p,
html[data-theme="dark"] #other-media p,
html[data-theme="dark"] #faq p {
color: #94a3b8 !important;
}
html[data-theme="dark"] #video-platforms .ch-route-card {
background: #111827 !important;
border-color: #263244 !important;
box-shadow: 0 14px 34px rgba(0,0,0,.16) !important;
}
html[data-theme="dark"] #video-platforms .ch-route-card.is-planned {
background: #0f172a !important;
}
html[data-theme="dark"] #video-platforms .ch-route-body h3 {
color: #f1f5f9 !important;
}
html[data-theme="dark"] #video-platforms .ch-route-body p {
color: #94a3b8 !important;
}
html[data-theme="dark"] #video-platforms .ch-route-tag {
background: #172033 !important;
border-color: #2b374c !important;
color: #94a3b8 !important;
}
html[data-theme="dark"] #broad-search-intent > div,
html[data-theme="dark"] #broad-search-intent article {
border-color: #263244 !important;
}
html[data-theme="dark"] #broad-search-intent > div > div:first-child,
html[data-theme="dark"] #broad-search-intent article:first-child {
background: #111827 !important;
}
html[data-theme="dark"] #source-matching .chsm-info,
html[data-theme="dark"] #source-matching .chsm-router {
background: #111827 !important;
border-color: #263244 !important;
box-shadow: 0 14px 34px rgba(0,0,0,.15) !important;
}
html[data-theme="dark"] #source-matching .chsm-router-head {
background: #0f172a !important;
border-color: #263244 !important;
}
html[data-theme="dark"] #source-matching .chsm-row {
background: #111827 !important;
border-color: #263244 !important;
}
html[data-theme="dark"] #source-matching a.chsm-row:hover {
background: #162033 !important;
}
html[data-theme="dark"] #source-matching .chsm-row.is-planned {
background: #0f172a !important;
}
html[data-theme="dark"] #source-matching .chsm-url strong,
html[data-theme="dark"] #source-matching .chsm-action,
html[data-theme="dark"] #source-matching .chsm-router-head span {
color: #e2e8f0 !important;
}
html[data-theme="dark"] #source-matching .chsm-url small,
html[data-theme="dark"] #source-matching .chsm-router-head small {
color: #8493a9 !important;
}
html[data-theme="dark"] #source-matching .chsm-trust span {
background: #0f172a !important;
border-color: #263244 !important;
color: #cbd5e1 !important;
}
html[data-theme="dark"] #planned-workflow .chpw-step {
background: #111827 !important;
border-color: #263244 !important;
box-shadow: 0 14px 34px rgba(0,0,0,.15) !important;
}
html[data-theme="dark"] #planned-workflow .chpw-number,
html[data-theme="dark"] #planned-workflow .chpw-foot {
background: #172033 !important;
border-color: #2b374c !important;
}
html[data-theme="dark"] #limits .chlim-shell,
html[data-theme="dark"] #limits .chlim-main {
background: #111827 !important;
border-color: #263244 !important;
}
html[data-theme="dark"] #limits .chlim-rule {
background: #0f172a !important;
border-color: #263244 !important;
}
html[data-theme="dark"] #limits .chlim-rule strong {
color: #e2e8f0 !important;
}
html[data-theme="dark"] #limits .chlim-rule small {
color: #8493a9 !important;
}
html[data-theme="dark"] #limits .chlim-responsible {
background: #080e1b !important;
}
html[data-theme="dark"] #other-media .chom-card {
background: #111827 !important;
border-color: #263244 !important;
box-shadow: 0 14px 34px rgba(0,0,0,.15) !important;
}
html[data-theme="dark"] #other-media .chom-body h3 {
color: #f1f5f9 !important;
}
html[data-theme="dark"] #other-media .chom-badge {
background: #172033 !important;
border-color: #2b374c !important;
color: #a5b4fc !important;
}
html[data-theme="dark"] #other-media .chom-open {
color: #a5b4fc !important;
}
html[data-theme="dark"] #faq .chfaq-item {
background: #111827 !important;
border-color: #263244 !important;
box-shadow: 0 8px 22px rgba(0,0,0,.15) !important;
}
html[data-theme="dark"] #faq .chfaq-item[open] summary {
background: #0f172a !important;
}
html[data-theme="dark"] #faq .chfaq-question {
color: #e5e7eb !important;
}
html[data-theme="dark"] #faq .chfaq-number,
html[data-theme="dark"] #faq .chfaq-plus {
background: #172033 !important;
border-color: #2b374c !important;
}
html[data-theme="dark"] #faq .chfaq-plus::before,
html[data-theme="dark"] #faq .chfaq-plus::after {
background: #94a3b8 !important;
}
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
background: #111827 !important;
border-color: #263244 !important;
color: #e5e7eb !important;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
color: #64748b !important;
}
html[data-theme="dark"] .ch3-platform,
html[data-theme="dark"] .ch3-platform-card,
html[data-theme="dark"] .ch3-card {
background: #111827 !important;
border-color: #263244 !important;
color: #e5e7eb !important;
}
html[data-theme="dark"] .chf3 {
background: #0b1120 !important;
border-color: #1e293b !important;
}
html[data-theme="dark"] .chf3-logo {
color: #f8fafc !important;
}
html[data-theme="dark"] .chf3-brand > p {
color: #94a3b8 !important;
}
html[data-theme="dark"] .chf3-col h3 {
color: #e5e7eb !important;
}
html[data-theme="dark"] .chf3-col a {
color: #94a3b8 !important;
}
html[data-theme="dark"] .chf3-col a:hover {
color: #c7d2fe !important;
}
html[data-theme="dark"] .chf3-bottom {
border-color: #1e293b !important;
color: #64748b !important;
}
html[data-theme="dark"] .chf3-bottom-right a {
color: #94a3b8 !important;
}
html[data-theme="dark"] .chf3-language,
html[data-theme="dark"] .chf3-theme-toggle {
background: #111827 !important;
border-color: #263244 !important;
color: #cbd5e1 !important;
}
html[data-theme="dark"] .chf3-theme-toggle:hover {
background: #172033 !important;
border-color: #34445c !important;
color: #ffffff !important;
}
@media (prefers-reduced-motion: no-preference) {
body,
header,
main,
footer,
section,
article,
details,
input {
transition:
background-color .18s ease,
border-color .18s ease,
color .18s ease
!important;
}
}
.chf3-theme-toggle {
position: relative !important;
width: 34px !important;
height: 34px !important;
flex: 0 0 34px !important;
padding: 0 !important;
border:
1px solid #dfe5ee
!important;
border-radius:
9px
!important;
background:
linear-gradient(
180deg,
#ffffff 0%,
#f8fafc 100%
)
!important;
color:
#526176
!important;
box-shadow:
0 1px 2px rgba(15,23,42,.04),
0 4px 10px rgba(15,23,42,.035)
!important;
cursor:
pointer
!important;
overflow:
hidden
!important;
}
.chf3-theme-toggle .chf3-theme-moon {
display:
block
!important;
}
.chf3-theme-toggle .chf3-theme-sun {
display:
none
!important;
}
html[data-theme="dark"]
.chf3-theme-toggle
.chf3-theme-moon {
display:
none
!important;
}
html[data-theme="dark"]
.chf3-theme-toggle
.chf3-theme-sun {
display:
block
!important;
}
.chf3-theme-toggle .chf3-theme-moon,
.chf3-theme-toggle .chf3-theme-sun {
width:
15px
!important;
height:
15px
!important;
flex:
0 0 15px
!important;
color:
currentColor
!important;
}
.chf3-theme-toggle:hover {
background:
#f4f6fa
!important;
border-color:
#cbd5e1
!important;
color:
#111827
!important;
box-shadow:
0 2px 5px rgba(15,23,42,.07),
0 6px 14px rgba(15,23,42,.05)
!important;
transform:
translateY(-1px)
!important;
}
html[data-theme="dark"] .chf3-theme-toggle {
background:
#111827
!important;
border-color:
#2b3749
!important;
color:
#e2e8f0
!important;
box-shadow:
0 1px 2px rgba(0,0,0,.18)
!important;
}
html[data-theme="dark"] .chf3-theme-toggle:hover {
background:
#172033
!important;
border-color:
#3b4b63
!important;
color:
#ffffff
!important;
}
.chf3-bottom-right {
align-items:
center
!important;
}
.chf3-language {
min-height:
34px
!important;
box-sizing:
border-box
!important;
}
.chf3-theme-toggle {
position: relative !important;
display: inline-flex !important;
align-items: center !important;
width: 44px !important;
height: 26px !important;
min-width: 44px !important;
min-height: 26px !important;
flex: 0 0 44px !important;
padding: 0 !important;
margin: 0 !important;
border:
1px solid #dce3ec
!important;
border-radius:
999px
!important;
background:
#edf1f6
!important;
color:
#526176
!important;
box-shadow:
inset 0 1px 2px rgba(15,23,42,.035)
!important;
cursor:
pointer
!important;
overflow:
hidden
!important;
transform:
none
!important;
transition:
background .2s ease,
border-color .2s ease
!important;
}
.chf3-theme-toggle::before {
content: "" !important;
position: absolute !important;
top: 3px !important;
left: 3px !important;
width: 18px !important;
height: 18px !important;
border-radius:
50%
!important;
background:
#ffffff
!important;
box-shadow:
0 1px 3px rgba(15,23,42,.18),
0 1px 1px rgba(15,23,42,.08)
!important;
transition:
transform .2s ease
!important;
z-index:
1
!important;
}
.chf3-theme-toggle .chf3-theme-moon,
.chf3-theme-toggle .chf3-theme-sun {
position: absolute !important;
top: 50% !important;
left: 6px !important;
width: 12px !important;
height: 12px !important;
margin: 0 !important;
transform:
translateY(-50%)
!important;
z-index:
2
!important;
pointer-events:
none
!important;
transition:
opacity .15s ease
!important;
}
.chf3-theme-toggle .chf3-theme-moon {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
color:
#475569
!important;
}
.chf3-theme-toggle .chf3-theme-sun {
display: block !important;
visibility: hidden !important;
opacity: 0 !important;
}
html[data-theme="dark"] .chf3-theme-toggle {
background:
#4f46e5
!important;
border-color:
#4f46e5
!important;
color:
#ffffff
!important;
box-shadow:
inset 0 1px 2px rgba(0,0,0,.12)
!important;
}
html[data-theme="dark"] .chf3-theme-toggle::before {
transform:
translateX(18px)
!important;
}
html[data-theme="dark"]
.chf3-theme-toggle
.chf3-theme-moon {
display: block !important;
visibility: hidden !important;
opacity: 0 !important;
}
html[data-theme="dark"]
.chf3-theme-toggle
.chf3-theme-sun {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
left:
24px
!important;
color:
#4f46e5
!important;
}
.chf3-theme-toggle:hover {
transform:
none
!important;
border-color:
#c9d2df
!important;
box-shadow:
inset 0 1px 2px rgba(15,23,42,.04)
!important;
}
html[data-theme="dark"] .chf3-theme-toggle:hover {
background:
#4338ca
!important;
border-color:
#4338ca
!important;
}
.chf3-theme-toggle:focus-visible {
outline:
2px solid #818cf8
!important;
outline-offset:
2px
!important;
}
.chf3-bottom-right {
display: flex !important;
align-items: center !important;
}
.chf3-language {
height: 26px !important;
min-height: 26px !important;
display: inline-flex !important;
align-items: center !important;
padding:
0 9px
!important;
box-sizing:
border-box
!important;
}