/* ================================================
   Custom Button Block — Frontend CSS v1.0
   ================================================ */

.cbb-wrapper {
    display: block;
    margin: 0;
    padding: 0;
}

/* Base button reset */
.cbb-button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    position: relative;
    overflow: hidden;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    outline: none;
    box-sizing: border-box;
    vertical-align: middle;
    line-height: 1.4;
}

/* ── Icons ───────────────────────────────────── */
.cbb-icon-before,
.cbb-icon-after {
    display: inline-flex;
    align-items: center;
    line-height: 1;
    flex-shrink: 0;
}

/* ── Link style override ─────────────────────── */
.cbb-button.cbb-style-link {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    text-decoration: underline !important;
}

/* ── Full width ──────────────────────────────── */
.cbb-wrapper:has(.cbb-button[style*="width: 100%"]) {
    display: block;
}
.cbb-button[style*="width: 100%"] {
    display: flex !important;
}

.cbb-button-text,
.cbb-split-circle {
	position: relative;
	z-index: 1;
}

.cbb-button-text {
	transition: all .3s ease-in-out;
}

/* ================================================
   SPLIT BUTTON STYLE
   ================================================ */
.cbb-button.cbb-style-split {
	display: inline-flex;
	position: relative;
    overflow: visible !important;
	border: 1px solid #1D272C !important;
}
.cbb-button.cbb-style-split .cbb-split-circle {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.cbb-button.cbb-style-split:hover .cbb-button-text {
	color: #1D272C;
}

/* ================================================
   HOVER EFFECTS
   ================================================ */

/* Lift */
.cbb-button.cbb-hover-lift:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 32px rgba(0,0,0,0.22) !important;
}
.cbb-button.cbb-hover-lift:active {
    transform: translateY(-1px) !important;
}

/* Scale */
.cbb-button.cbb-hover-scale:hover {
    transform: scale(1.07) !important;
}
.cbb-button.cbb-hover-scale:active {
    transform: scale(0.98) !important;
}

/* Glow */
.cbb-button.cbb-hover-glow:hover {
    filter: brightness(1.12) drop-shadow(0 0 10px currentColor);
}

/* Slide Fill — light sheen sweeps across */
.cbb-button.cbb-hover-slide::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.20);
    transform: translateX(-110%) skewX(-15deg);
    transition: transform 0.4s ease;
    border-radius: inherit;
    pointer-events: none;
}
.cbb-button.cbb-hover-slide:hover::before {
    transform: translateX(110%) skewX(-15deg);
}

/* Shake */
@keyframes cbb-shake {
    0%, 100% { transform: translateX(0) rotate(0); }
    15%       { transform: translateX(-5px) rotate(-1deg); }
    30%       { transform: translateX(5px)  rotate(1deg); }
    45%       { transform: translateX(-4px) rotate(-0.5deg); }
    60%       { transform: translateX(4px)  rotate(0.5deg); }
    75%       { transform: translateX(-2px); }
    90%       { transform: translateX(2px); }
}
.cbb-button.cbb-hover-shake:hover {
    animation: cbb-shake 0.5s ease;
}

/* Pulse */
@keyframes cbb-pulse-ring {
    0%   { box-shadow: 0 0 0 0 rgba(currentColor, 0.5); }
    70%  { box-shadow: 0 0 0 14px rgba(0,0,0,0); }
    100% { box-shadow: 0 0 0 0 rgba(0,0,0,0); }
}
.cbb-button.cbb-hover-pulse:hover {
    animation: cbb-pulse-ring 0.8s ease infinite;
}

/* ================================================
   ACCESSIBILITY
   ================================================ */
.cbb-button:focus-visible {
    outline: 3px solid #005fcc;
    outline-offset: 3px;
}
