.customProductKreatorCta {
position: relative;
z-index: 100;
isolation: isolate;
margin: 20px 0 16px;
padding: 0;
max-width: 550px;
width: 100%;
box-sizing: border-box;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif;
color: #333;
line-height: 1.5;
background: transparent;
border: none;
align-self: flex-start;
overflow: visible;
}
@media (max-width: 950px) {
.customProductKreatorCta {
max-width: 100%;
}
}
.customProductKreatorCta__wrap {
position: relative;
width: 100%;
overflow: visible;
} .customProductKreatorCta__btn {
position: relative;
z-index: 0;
display: inline-flex !important;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: center;
gap: 10px;
width: 100%;
max-width: 100%;
margin: 0;
padding: 7px 16px !important;
background: #a8762a !important;
color: #fff !important;
border: 2px solid #a8762a !important;
border-radius: 10px !important;
font-family: inherit !important;
font-size: 14px !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: 0.06em !important;
text-align: center !important;
text-decoration: none !important;
box-sizing: border-box !important;
cursor: pointer;
transition: background 0.2s, border-color 0.2s, transform 0.1s !important;
box-shadow: none !important;
}
.customProductKreatorCta__btn:hover {
background: #8f6321 !important;
border-color: #8f6321 !important;
color: #fff !important;
}
.customProductKreatorCta__btn:active {
transform: scale(0.99);
}
.customProductKreatorCta__btn::before {
display: none !important;
}
.customProductKreatorCta__label {
flex: 0 1 auto;
color: inherit;
pointer-events: none;
} .customProductKreatorCta__info {
position: relative;
flex-shrink: 0;
width: 22px;
height: 22px;
margin: 0;
padding: 0;
border-radius: 50%;
border: 1px solid #c8c8c8;
background: #fff !important;
color: #727272 !important;
font-size: 12px !important;
font-style: italic;
font-weight: 600;
font-family: inherit;
line-height: 1;
display: flex !important;
align-items: center;
justify-content: center;
cursor: pointer;
box-sizing: border-box;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
user-select: none;
transition: border-color 0.2s, background 0.2s, color 0.2s, box-shadow 0.2s;
}
.customProductKreatorCta__info:hover,
.customProductKreatorCta__info:focus {
outline: none;
border-color: #a6a6a6;
color: #535353 !important;
}
.customProductKreatorCta__info:focus-visible {
box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.5), 0 1px 3px rgba(0, 0, 0, 0.18);
}
.customProductKreatorCta__info:active {
transform: scale(0.96);
}
.customProductKreatorCta__tooltip {
position: absolute;
top: calc(100% + 8px);
right: 12px;
left: auto;
width: min(340px, calc(100vw - 40px));
padding: 14px 16px;
background: #fff;
border: 1px solid #dadada;
border-radius: 10px;
box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
font-size: 14px;
line-height: 1.5;
font-weight: 400;
text-transform: none;
letter-spacing: normal;
text-align: left;
color: #444;
opacity: 0;
visibility: hidden;
transform: translateY(-4px);
transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
pointer-events: none;
z-index: 200;
}
.customProductKreatorCta__tooltip::before {
content: "";
position: absolute;
top: -7px;
right: 18px;
width: 12px;
height: 12px;
background: #fff;
border-left: 1px solid #dadada;
border-top: 1px solid #dadada;
transform: rotate(45deg);
}
.customProductKreatorCta__info:hover + .customProductKreatorCta__tooltip,
.customProductKreatorCta__info:focus + .customProductKreatorCta__tooltip {
opacity: 1;
visibility: visible;
transform: translateY(0);
}