/* Amplify Floating CTA - Frontend Styles */
/* High specificity selectors to prevent theme overrides */

/* Reset and base wrapper */
#amplify-floating-cta.afcta-wrapper {
    position: fixed !important;
    z-index: var(--afcta-z-index, 9999) !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    transition: opacity 0.3s ease, transform 0.3s ease !important;
    opacity: 0 !important;
    pointer-events: none !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    float: none !important;
    clear: none !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    line-height: normal !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-decoration: none !important;
    text-align: left !important;
    vertical-align: baseline !important;
    overflow: visible !important;
}

#amplify-floating-cta.afcta-wrapper *,
#amplify-floating-cta.afcta-wrapper *::before,
#amplify-floating-cta.afcta-wrapper *::after {
    box-sizing: border-box !important;
}

#amplify-floating-cta.afcta-wrapper.afcta-visible {
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* Position Classes */
#amplify-floating-cta.afcta-wrapper.afcta-bottom-right {
    bottom: 24px !important;
    right: 24px !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
}

#amplify-floating-cta.afcta-wrapper.afcta-bottom-left {
    bottom: 24px !important;
    left: 24px !important;
    top: auto !important;
    right: auto !important;
    transform: none !important;
}

#amplify-floating-cta.afcta-wrapper.afcta-middle-right {
    top: 50% !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;
    transform: translateY(-50%) !important;
}

#amplify-floating-cta.afcta-wrapper.afcta-middle-right.afcta-visible {
    transform: translateY(-50%) !important;
}

#amplify-floating-cta.afcta-wrapper.afcta-middle-left {
    top: 50% !important;
    left: 0 !important;
    bottom: auto !important;
    right: auto !important;
    transform: translateY(-50%) !important;
}

#amplify-floating-cta.afcta-wrapper.afcta-middle-left.afcta-visible {
    transform: translateY(-50%) !important;
}

/* Top Position (for bar style) */
#amplify-floating-cta.afcta-wrapper.afcta-top {
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    transform: none !important;
    width: 100% !important;
}

/* Bottom Position (for bar style) */
#amplify-floating-cta.afcta-wrapper.afcta-bottom {
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
}

/* Bar style wrapper override */
#amplify-floating-cta.afcta-wrapper.afcta-style-bar {
    width: 100% !important;
}

/* Base Button Reset and Styles */
#amplify-floating-cta.afcta-wrapper .afcta-button {
    /* Complete reset */
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    cursor: pointer !important;
    border: none !important;
    outline: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    color: inherit !important;
    text-align: inherit !important;
    text-decoration: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    word-spacing: normal !important;
    white-space: normal !important;
    vertical-align: baseline !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    transition: all 0.3s ease !important;
    -webkit-tap-highlight-color: transparent !important;
    display: inline-flex !important;
    float: none !important;
    clear: none !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-button:hover,
#amplify-floating-cta.afcta-wrapper .afcta-button:focus,
#amplify-floating-cta.afcta-wrapper .afcta-button:active {
    outline: none !important;
    text-decoration: none !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-button:focus-visible {
    outline: 2px solid var(--afcta-primary) !important;
    outline-offset: 2px !important;
}

/* ==================== */
/* PILL STYLE           */
/* ==================== */
#amplify-floating-cta.afcta-wrapper .afcta-button.afcta-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 14px 24px !important;
    border-radius: 50px !important;
    background-color: var(--afcta-primary) !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
    position: relative !important;
    overflow: visible !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-button.afcta-pill:hover {
    transform: scale(1.05) !important;
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.3) !important;
    background-color: var(--afcta-primary) !important;
    color: #fff !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-pill .afcta-content {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    position: relative !important;
    z-index: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-pill .afcta-icon {
    width: 20px !important;
    height: 20px !important;
    flex-shrink: 0 !important;
    display: block !important;
    fill: none !important;
    stroke: currentColor !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-pill .afcta-text {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    line-height: inherit !important;
}

/* ==================== */
/* CARD STYLE           */
/* ==================== */
#amplify-floating-cta.afcta-wrapper .afcta-button.afcta-card {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    border-radius: 16px !important;
    background: var(--afcta-card-bg, #1a1a2e) !important;
    border: 1px solid var(--afcta-card-border, #2a2a3e) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
    position: relative !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-button.afcta-card:hover {
    transform: scale(1.03) !important;
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.4) !important;
    background: var(--afcta-card-bg, #1a1a2e) !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-card .afcta-icon-box {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    border-radius: 12px !important;
    background-color: var(--afcta-primary) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #fff !important;
    flex-shrink: 0 !important;
    transition: transform 0.3s ease !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-card:hover .afcta-icon-box {
    transform: scale(1.1) !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-card .afcta-icon {
    width: 22px !important;
    height: 22px !important;
    display: block !important;
    fill: none !important;
    stroke: currentColor !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-card .afcta-card-text {
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    display: block !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-card .afcta-title {
    display: block !important;
    color: var(--afcta-card-title, #ffffff) !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    margin: 0 0 2px 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-card .afcta-subtitle {
    display: block !important;
    color: var(--afcta-card-subtitle, var(--afcta-primary)) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.3 !important;
    opacity: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-card .afcta-pulse-dot {
    position: absolute !important;
    top: -4px !important;
    right: -4px !important;
    left: auto !important;
    bottom: auto !important;
    width: 14px !important;
    height: 14px !important;
    border-radius: 50% !important;
    background-color: var(--afcta-primary) !important;
    animation: afcta-pulse-dot 2s ease-in-out infinite !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* ==================== */
/* SIDE TAB STYLE       */
/* ==================== */
#amplify-floating-cta.afcta-wrapper .afcta-button.afcta-side-tab {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 16px 12px !important;
    background-color: var(--afcta-primary) !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
    writing-mode: vertical-rl !important;
    text-orientation: mixed !important;
    position: relative !important;
    overflow: hidden !important;
    border-radius: 0 !important;
}

#amplify-floating-cta.afcta-wrapper.afcta-middle-right .afcta-button.afcta-side-tab,
#amplify-floating-cta.afcta-wrapper.afcta-bottom-right .afcta-button.afcta-side-tab {
    border-radius: 12px 0 0 12px !important;
    transform: rotate(180deg) !important;
}

#amplify-floating-cta.afcta-wrapper.afcta-middle-left .afcta-button.afcta-side-tab,
#amplify-floating-cta.afcta-wrapper.afcta-bottom-left .afcta-button.afcta-side-tab {
    border-radius: 0 12px 12px 0 !important;
    transform: none !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-button.afcta-side-tab:hover {
    padding-right: 16px !important;
    background-color: var(--afcta-primary) !important;
    color: #fff !important;
}

#amplify-floating-cta.afcta-wrapper.afcta-middle-right .afcta-button.afcta-side-tab:hover,
#amplify-floating-cta.afcta-wrapper.afcta-bottom-right .afcta-button.afcta-side-tab:hover {
    padding-left: 16px !important;
    padding-right: 12px !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-side-tab .afcta-content {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    position: relative !important;
    z-index: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-side-tab .afcta-icon {
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0 !important;
    display: block !important;
    fill: none !important;
    stroke: currentColor !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-side-tab .afcta-text {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    line-height: inherit !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-side-tab .afcta-pulse-bg {
    position: absolute !important;
    inset: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    background-color: var(--afcta-primary) !important;
    animation: afcta-pulse-bg 2s ease-in-out infinite !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: inherit !important;
}

/* ==================== */
/* ICON ONLY STYLE      */
/* ==================== */
#amplify-floating-cta.afcta-wrapper .afcta-button.afcta-icon-only {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    border-radius: 50% !important;
    background-color: var(--afcta-primary) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #fff !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
    position: relative !important;
    overflow: visible !important;
    padding: 0 !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-button.afcta-icon-only:hover {
    transform: scale(1.1) !important;
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.3) !important;
    background-color: var(--afcta-primary) !important;
    color: #fff !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-icon-only .afcta-content {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-icon-only .afcta-icon {
    width: 24px !important;
    height: 24px !important;
    display: block !important;
    fill: none !important;
    stroke: currentColor !important;
}

/* ==================== */
/* PULSE ANIMATIONS     */
/* ==================== */

/* ==================== */
/* BAR STYLE            */
/* ==================== */
#amplify-floating-cta.afcta-wrapper .afcta-bar {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 14px 24px !important;
    background-color: var(--afcta-primary) !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15) !important;
    cursor: pointer !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-bar .afcta-bar-content {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-bar .afcta-icon {
    width: 20px !important;
    height: 20px !important;
    flex-shrink: 0 !important;
    display: block !important;
    fill: none !important;
    stroke: currentColor !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-bar .afcta-text {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    line-height: inherit !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-bar .afcta-bar-btn {
    appearance: none !important;
    -webkit-appearance: none !important;
    margin-left: 12px !important;
    padding: 8px 16px !important;
    background: rgba(255, 255, 255, 0.2) !important;
    border: none !important;
    border-radius: 6px !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
}

#amplify-floating-cta.afcta-wrapper .afcta-bar .afcta-bar-btn:hover {
    background: rgba(255, 255, 255, 0.3) !important;
}
#amplify-floating-cta.afcta-wrapper .afcta-ping {
    position: absolute !important;
    inset: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    border-radius: inherit !important;
    background-color: var(--afcta-primary) !important;
    animation: afcta-ping 1.5s cubic-bezier(0, 0, 0.2, 1) infinite !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    pointer-events: none !important;
}

@keyframes afcta-ping {
    0% {
        transform: scale(1);
        opacity: 0.4;
    }
    75%, 100% {
        transform: scale(1.6);
        opacity: 0;
    }
}

@keyframes afcta-pulse-bg {
    0%, 100% {
        opacity: 0.4;
    }
    50% {
        opacity: 0.7;
    }
}

@keyframes afcta-pulse-dot {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.3);
        opacity: 0.7;
    }
}

/* ==================== */
/* SVG ICON RESET       */
/* ==================== */
#amplify-floating-cta.afcta-wrapper svg.afcta-icon {
    display: block !important;
    width: inherit !important;
    height: inherit !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
    overflow: visible !important;
    vertical-align: middle !important;
    margin: 0 !important;
    padding: 0 !important;
}

#amplify-floating-cta.afcta-wrapper svg.afcta-icon * {
    fill: inherit !important;
    stroke: inherit !important;
    stroke-width: inherit !important;
}

/* ==================== */
/* MOBILE STYLES        */
/* ==================== */
@media (max-width: 768px) {
    #amplify-floating-cta.afcta-wrapper.afcta-bottom-right,
    #amplify-floating-cta.afcta-wrapper.afcta-bottom-left {
        bottom: 16px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper.afcta-bottom-right {
        right: 16px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper.afcta-bottom-left {
        left: 16px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-button.afcta-pill {
        padding: 12px 18px !important;
        font-size: 14px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-pill .afcta-icon {
        width: 18px !important;
        height: 18px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-button.afcta-card {
        padding: 12px 14px !important;
        gap: 10px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-card .afcta-icon-box {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        min-height: 38px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-card .afcta-title {
        font-size: 13px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-card .afcta-subtitle {
        font-size: 11px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-button.afcta-side-tab {
        padding: 14px 10px !important;
        font-size: 13px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-button.afcta-icon-only {
        width: 50px !important;
        height: 50px !important;
        min-width: 50px !important;
        min-height: 50px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-icon-only .afcta-icon {
        width: 22px !important;
        height: 22px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-bar {
        padding: 12px 16px !important;
        font-size: 13px !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-bar .afcta-bar-content {
        gap: 8px !important;
        flex-wrap: wrap !important;
    }
    
    #amplify-floating-cta.afcta-wrapper .afcta-bar .afcta-bar-btn {
        padding: 6px 12px !important;
        font-size: 12px !important;
        margin-left: 8px !important;
    }
}

/* Hide on mobile class */
#amplify-floating-cta.afcta-wrapper.afcta-hide-mobile {
    display: block !important;
}

/* Desktop/Mobile style visibility - only applies when has-mobile-style class is present */
#amplify-floating-cta.afcta-wrapper.afcta-has-mobile-style .afcta-mobile-only {
    display: none !important;
}

@media (max-width: 768px) {
    #amplify-floating-cta.afcta-wrapper.afcta-hide-mobile {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
    
    /* Show mobile element, hide desktop element when different mobile style set */
    #amplify-floating-cta.afcta-wrapper.afcta-has-mobile-style .afcta-desktop-only {
        display: none !important;
    }
    
    #amplify-floating-cta.afcta-wrapper.afcta-has-mobile-style .afcta-mobile-only {
        display: inline-flex !important;
    }
    
    #amplify-floating-cta.afcta-wrapper.afcta-has-mobile-style .afcta-mobile-only.afcta-bar {
        display: flex !important;
    }
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    #amplify-floating-cta.afcta-wrapper,
    #amplify-floating-cta.afcta-wrapper .afcta-button,
    #amplify-floating-cta.afcta-wrapper .afcta-ping,
    #amplify-floating-cta.afcta-wrapper .afcta-pulse-bg,
    #amplify-floating-cta.afcta-wrapper .afcta-pulse-dot,
    #amplify-floating-cta.afcta-wrapper .afcta-icon-box {
        animation: none !important;
        transition: none !important;
    }
}