/**
 * @package     Phoca Premiere Template
 * @copyright   Copyright (C) Jan Pavelka www.phoca.cz
 * @license     http://www.gnu.org/copyleft/gpl.html GNU/GPL
 * 
 * Exit-Intent / End-of-Content CTA Slide-in Widget
 * Professional slide-in CTA that appears after user scrolls through content
 */

/* Bottom Slide-in CTA Container */
#ph-exit-cta {
    position: fixed;
    bottom: -100%; /* Hidden by default */
    right: 20px;
    width: 350px;
    max-width: calc(100vw - 40px);
    background: var(--phoca-body-bg, #ffffff);
    border-top: 5px solid var(--phoca-primary, #0d6efd);
    box-shadow: 0 -5px 25px rgba(0,0,0,0.15);
    padding: 20px;
    z-index: 1000;
    transition: bottom 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    border-radius: 8px 8px 0 0;
}

#ph-exit-cta.active {
    bottom: 0;
}

/* CTA Header */
.ph-cta-header {
    font-weight: 700;
    font-size: 1.2rem;
    color: var(--phoca-body-color, #212529);
    margin-bottom: 10px;
    padding-right: 25px;
}

/* CTA Body Text */
.ph-cta-body {
    font-size: 0.9rem;
    color: var(--phoca-gray-600, #6c757d);
    margin-bottom: 15px;
    line-height: 1.5;
}

.ph-cta-body strong {
    color: var(--phoca-body-color, #212529);
}

/* CTA Button */
.ph-btn-consult {
    background: var(--phoca-primary, #0d6efd);
    color: #fff !important;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 0.85rem;
    padding: 12px 20px;
    border-radius: 4px;
    display: inline-block;
    text-decoration: none;
    width: 100%;
    text-align: center;
    transition: background-color 0.2s ease, transform 0.1s ease;
    border: none;
    cursor: pointer;
}

.ph-btn-consult:hover {
    background: var(--phoca-primary, #0a58ca);
    transform: translateY(-1px);
    color: #fff !important;
    text-decoration: none;
}

.ph-btn-consult:active {
    transform: translateY(0);
}

/* Close Button */
.ph-cta-close {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    color: var(--phoca-gray-500, #adb5bd);
    font-size: 1.5rem;
    line-height: 1;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.ph-cta-close:hover {
    background-color: var(--phoca-gray-200, #e9ecef);
    color: var(--phoca-body-color, #212529);
}

/* CTA Icon */
.ph-cta-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    background: var(--phoca-primary, #0d6efd);
    border-radius: 50%;
    margin-bottom: 15px;
    color: #fff;
    font-size: 1.5rem;
}

/* Mobile Responsive Styles */
@media (max-width: 767.98px) {
    #ph-exit-cta {
        right: 10px;
        left: 10px;
        width: auto;
        max-width: none;
        padding: 15px;
    }

    .ph-cta-header {
        font-size: 1.1rem;
    }

    .ph-cta-body {
        font-size: 0.85rem;
    }

    .ph-btn-consult {
        padding: 10px 15px;
        font-size: 0.8rem;
    }
}

/* Dark Mode Support */
[data-bs-theme="dark"] #ph-exit-cta {
    background: var(--phoca-gray-800, #2c3136);
    border-top-color: var(--phoca-primary, #6c757d);
    box-shadow: 0 -5px 25px rgba(0,0,0,0.4);
}

[data-bs-theme="dark"] .ph-cta-header {
    color: var(--phoca-gray-100, #f8f9fa);
}

[data-bs-theme="dark"] .ph-cta-body {
    color: var(--phoca-gray-400, #adb5bd);
}

[data-bs-theme="dark"] .ph-cta-body strong {
    color: var(--phoca-gray-100, #f8f9fa);
}

[data-bs-theme="dark"] .ph-cta-close {
    color: var(--phoca-gray-500, #6c757d);
}

[data-bs-theme="dark"] .ph-cta-close:hover {
    background-color: var(--phoca-gray-700, #3a3f45);
    color: var(--phoca-gray-100, #f8f9fa);
}

/* Animation for entrance */
@keyframes slideInUp {
    from {
        bottom: -100%;
        opacity: 0;
    }
    to {
        bottom: 0;
        opacity: 1;
    }
}

#ph-exit-cta.active {
    animation: slideInUp 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

/* Pulse animation for button attention */
@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(13, 110, 253, 0.4);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(13, 110, 253, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(13, 110, 253, 0);
    }
}

.ph-btn-consult.pulse {
    animation: pulse 2s infinite;
}

/* RTL Support */
[dir="rtl"] #ph-exit-cta {
    right: auto;
    left: 20px;
}

[dir="rtl"] .ph-cta-close {
    right: auto;
    left: 10px;
}

[dir="rtl"] .ph-cta-header {
    padding-right: 0;
    padding-left: 25px;
}

@media (max-width: 767.98px) {
    [dir="rtl"] #ph-exit-cta {
        left: 10px;
        right: 10px;
    }
}