#alkor-cookie {
position: fixed;
left: 18px;
bottom: 18px;
z-index: 999999;
width: min(430px, calc(100vw - 36px));
font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
color: #1f1f1f;
}
#alkor-cookie[hidden] {
display: none !important;
}
.cc-card {
position: relative;
background: rgba(255, 255, 255, 0.97);
border: 1px solid #e3e6ea;
border-top: 4px solid #ff5a0a;
border-radius: 16px;
box-shadow: 0 14px 34px rgba(0, 0, 0, 0.12);
padding: 16px 16px 14px;
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(6px);
}
.cc-title {
margin: 0 34px 8px 0;
font-size: 17px;
line-height: 1.2;
font-weight: 800;
color: #222;
}
.cc-text {
margin: 0;
font-size: 13px;
line-height: 1.45;
color: #6f7480;
}
.cc-text a {
color: #ff5a0a;
text-decoration: none;
border-bottom: 1px solid rgba(255, 90, 10, 0.35);
transition: border-color 0.18s ease, color 0.18s ease;
}
.cc-text a:hover {
color: #d44a08;
border-bottom-color: #d44a08;
}
.cc-close {
position: absolute;
top: 10px;
right: 10px;
width: 28px;
height: 28px;
border: 1px solid #dde1e6;
background: #fff;
border-radius: 50%;
cursor: pointer;
font-size: 18px;
line-height: 24px;
color: #222;
transition: 0.18s ease;
display: flex;
align-items: center;
justify-content: center;
}
.cc-close:hover {
color: #ff5a0a;
border-color: #ff5a0a;
background: #fff5ef;
transform: rotate(90deg);
}
.cc-actions {
display: flex;
gap: 8px;
margin-top: 14px;
flex-wrap: wrap;
}
.cc-btn {
min-height: 38px;
border-radius: 10px;
padding: 0 14px;
border: 1px solid #e3e6ea;
background: #fff;
color: #2a2f36;
font-size: 12px;
font-weight: 800;
cursor: pointer;
transition: 0.18s ease;
}
.cc-btn:hover {
transform: translateY(-1px);
border-color: #cfd4da;
}
.cc-btn-primary {
background: #ff5a0a;
border-color: #ff5a0a;
color: #fff;
box-shadow: 0 8px 18px rgba(255, 90, 10, 0.24);
}
.cc-btn-primary:hover {
background: #d44a08;
border-color: #d44a08;
box-shadow: 0 8px 18px rgba(255, 90, 10, 0.35);
}
.cc-btn-soft {
background: #f5f6f8;
}
.cc-settings {
display: none;
margin-top: 13px;
padding-top: 12px;
border-top: 1px solid #eceff2;
}
.cc-settings.is-open {
display: block;
}
.cc-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
min-height: 36px;
padding: 4px 0;
font-size: 13px;
color: #2a2f36;
}
.cc-row + .cc-row {
border-top: 1px solid #f1f3f5;
}
.cc-switch {
position: relative;
width: 40px;
height: 22px;
flex: 0 0 40px;
}
.cc-switch input {
position: absolute;
opacity: 0;
pointer-events: none;
}
.cc-slider {
position: absolute;
inset: 0;
border-radius: 99px;
background: #d6dbe0;
cursor: pointer;
transition: 0.2s;
}
.cc-slider:before {
content: "";
position: absolute;
width: 16px;
height: 16px;
left: 3px;
top: 3px;
border-radius: 50%;
background: #fff;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
transition: 0.2s;
}
.cc-switch input:checked + .cc-slider {
background: #ff5a0a;
}
.cc-switch input:checked + .cc-slider:before {
transform: translateX(18px);
}
.cc-switch input:disabled + .cc-slider {
opacity: 0.6;
cursor: not-allowed;
}
.cc-settings-actions {
display: flex;
gap: 8px;
margin-top: 10px;
}
@media (max-width: 560px) {
#alkor-cookie {
left: 10px;
bottom: 10px;
width: calc(100vw - 20px);
}
.cc-card {
padding: 14px 14px 13px;
border-radius: 14px;
}
.cc-title {
font-size: 16px;
margin-right: 32px;
}
.cc-text {
font-size: 12.5px;
}
.cc-actions .cc-btn,
.cc-settings-actions .cc-btn {
flex: 1 1 auto;
}
}