.dapdap-cookie-notice {
position: fixed;
z-index: 10000;
right: 28px;
bottom: 28px;
left: 28px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 28px;
width: calc(100% - 56px);
max-width: 760px;
margin: 0 auto;
padding: 20px 22px;
color: #171717;
background: #fff;
border: 1px solid #e5e5e5;
box-shadow: 0 12px 34px rgba(0, 0, 0, 0.13);
opacity: 0;
transform: translateY(16px);
transition: opacity 180ms ease, transform 180ms ease;
}
.dapdap-cookie-notice,
.dapdap-cookie-notice * {
box-sizing: border-box;
}
.dapdap-cookie-notice.is-visible {
opacity: 1;
transform: translateY(0);
}
.dapdap-cookie-notice__content {
min-width: 0;
}
.dapdap-cookie-notice__text {
margin: 0 0 5px;
color: inherit;
font-size: 14px;
line-height: 1.5;
}
.dapdap-cookie-notice__link {
display: inline-block;
color: inherit;
font-size: 12px;
line-height: 1.4;
text-decoration: underline;
text-underline-offset: 3px;
}
.dapdap-cookie-notice__link:hover {
color: #575757;
}
.dapdap-cookie-notice__link:focus-visible,
.dapdap-cookie-notice__button:focus-visible {
outline: 2px solid currentColor;
outline-offset: 3px;
}
.dapdap-cookie-notice__button {
flex: 0 0 auto;
min-width: 112px;
min-height: 42px;
padding: 10px 18px;
color: #fff;
font: inherit;
font-size: 12px;
font-weight: 600;
line-height: 1;
letter-spacing: 0.08em;
text-transform: uppercase;
background: #171717;
border: 1px solid #171717;
border-radius: 0;
cursor: pointer;
transition: color 150ms ease, background-color 150ms ease;
}
.dapdap-cookie-notice__button:hover {
color: #171717;
background: #fff;
}
@media (max-width: 767px) {
.dapdap-cookie-notice {
right: 14px;
bottom: calc(14px + env(safe-area-inset-bottom, 0px));
left: 14px;
align-items: stretch;
flex-direction: column;
gap: 16px;
width: calc(100% - 28px);
padding: 18px;
}
.dapdap-cookie-notice__button {
width: 100%;
}
}
@media (prefers-reduced-motion: reduce) {
.dapdap-cookie-notice,
.dapdap-cookie-notice__button {
transition: none;
}
}