#inp-consent-root {
position: fixed;
left: var(--content-margin-x, 1rem);
right: var(--content-margin-x, 1rem);
bottom: var(--content-margin-y, 1rem);
z-index: 2147483647;
font-family: var(--tcb-typography-font-family, Urbanist), system-ui, -apple-system, "Segoe UI", Roboto, Inter, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
text-rendering: auto !important;
color: #ffffff;
}
#inp-consent-root .inp-banner {
background: linear-gradient(135deg, rgba(47,75,177,0.95) 0%, rgba(26,61,92,0.95) 100%);
border-radius: 18px;
box-shadow: 0 10px 25px rgba(0,0,0,0.25);
padding: var(--wp--preset--spacing--60, 2.25rem);
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
max-width: min(1080px, 96vw);
margin: 0 auto;
color: #ffffff;
animation: inpFadeUp 0.5s ease both;
}
#inp-consent-root .inp-text {
flex: 1 1 65%;
font-size: 18px;
line-height: 1.5;
color: #ffffff;
}
#inp-consent-root .inp-text a {
color: #fcb900;
font-weight: 600;
text-decoration: underline;
transition: color 0.25s ease;
}
#inp-consent-root .inp-text a:hover {
color: #ffd84a;
}
#inp-consent-root .inp-actions {
display: flex;
flex-wrap: wrap;
gap: 1rem;
align-items: center;
} #inp-consent-root .inp-btn {
border: none;
border-radius: 8px;
padding: 0.8rem 1.6rem;
font-weight: 700;
font-size: 1rem;
cursor: pointer;
transition: all 0.25s ease;
box-shadow: 0 4px 10px rgba(0,0,0,0.2);
letter-spacing: 0.4px;
} #inp-consent-root .inp-btn.inp-accept {
background: var(--wp--preset--color--luminous-vivid-amber, #fcb900);
color: var(--wp--preset--color--black, #000);
}
#inp-consent-root .inp-btn.inp-accept:hover {
background: var(--wp--preset--color--luminous-vivid-orange, #ff6900);
color: #ffffff;
transform: translateY(-2px);
} #inp-consent-root .inp-btn.inp-reject {
background: rgba(255,255,255,0.15);
color: #ffffff;
border: 1px solid rgba(255,255,255,0.3);
}
#inp-consent-root .inp-btn.inp-reject:hover {
background: rgba(255,255,255,0.25);
transform: translateY(-2px);
} @media (max-width: 768px) {
#inp-consent-root .inp-banner {
flex-direction: column;
text-align: left;
gap: 1.2rem;
}
#inp-consent-root .inp-text {
flex: 1 1 100%;
}
#inp-consent-root .inp-actions {
justify-content: flex-start;
}
} @keyframes inpFadeUp {
from { opacity: 0; transform: translateY(16px); }
to { opacity: 1; transform: translateY(0); }
}