/**
 * Freeio Child – Frontend-Anpassungen
 * ====================================
 */

/* ============================================================
 * Theme-Popups verstecken — ABER den Contact-Me-Button sichtbar lassen!
 * ============================================================ */
body.freeio-child-active #apus-contact-form-wrapper.apus-popup-form,
body.freeio-child-active [id^="apus-contact-form-wrapper"].apus-popup-form,
body.freeio-child-active [id^="contact-form-wrapper-"].apus-popup-form,
body.freeio-child-active [id^="apus-hire-form-wrapper"].apus-popup-form,
body.freeio-child-active [id^="hire-form-wrapper-"].apus-popup-form,
body.freeio-child-active .apus-contact-form > .apus-popup-form,
body.freeio-child-active .apus-contact-form .mfp-hide {
    display: none !important;
}

/* Legacy-Popup aus früheren Versionen (v2.14 und früher) */
body #freeio-chat-popup {
    display: none !important;
}

/* "Send message"-Panel des Plugins ausblenden (auf Freelancer/Employer-Profilen)
 * Das ist der Block "Please login to send a private message" direkt unter dem
 * Chat-Button. Wir haben unseren eigenen Chat-Flow, das native Formular stört nur.
 */
body.freeio-child-active [id^="send-private-message-wrapper-"],
body.freeio-child-active .apus-send-private-message,
body.freeio-child-active .send-private-message-wrapper,
body.freeio-child-active .private-message-form-wrapper {
    display: none !important;
}

/* ============================================================
 * About-Me-Widget auf Employer-Profilen ausblenden
 * ============================================================ */
body.single-employer .employer-detail-overview,
body.single-employer .widget-detail-overview,
body .employer-detail-overview {
    display: none !important;
}

body.single-employer .employer-content-wrapper .row > [class*="col-"]:first-child {
    flex: 1 1 100%;
    max-width: 100%;
}

/* ============================================================
 * Dashboard-Menü-Badge (Unread-Zähler)
 * Rot, WhatsApp-Style – wird per JS an den Messages-Menüpunkt gehängt
 * ============================================================ */
.freeio-child-menu-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    margin-left: 8px;
    border-radius: 10px;
    background: #e53935;
    color: #fff !important;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    vertical-align: middle;
    box-shadow: 0 1px 2px rgba(229, 57, 53, .3);
    animation: fcm-badge-pop .25s ease-out;
}
@keyframes fcm-badge-pop {
    0%   { transform: scale(0); opacity: 0; }
    60%  { transform: scale(1.15); }
    100% { transform: scale(1); opacity: 1; }
}

/* ============================================================
 * Sticky-Chat-Button: NUR auf Mobile sichtbar
 * ============================================================ */
.freeio-child-sticky-chat {
    /* Default: Desktop versteckt */
    display: none;

    position: fixed;
    bottom: 16px;
    right: 16px;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1a52c4, #1543a6);
    color: #fff !important;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(26, 82, 196, .4);
    text-decoration: none;
    z-index: 9998;
    transition: transform .2s ease, box-shadow .2s ease;
    cursor: pointer;
}
.freeio-child-sticky-chat:hover {
    transform: translateY(-2px) scale(1.06);
    box-shadow: 0 10px 26px rgba(26, 82, 196, .55);
    color: #fff !important;
    text-decoration: none;
}
.freeio-child-sticky-chat:active {
    transform: scale(.96);
}
.freeio-child-sticky-chat .fcsc-icon {
    width: 26px;
    height: 26px;
}

/* Badge mit Ungelesen-Zähler */
.freeio-child-sticky-badge {
    position: absolute;
    top: -2px;
    right: -2px;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 10px;
    background: #e53935;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 20px;
    text-align: center;
    border: 2px solid #fff;
}

/* Mobile: sichtbar machen */
@media (max-width: 860px) {
    .freeio-child-sticky-chat {
        display: flex;
    }
}

/* ============================================================
 * Contact-Me-Buttons: als Buttons stylen
 * ============================================================ */
.btn-freelancer-contact-form,
.btn-service-contact-form,
.btn-employer-contact-form,
.btn-job-contact-form,
.btn-project-contact-form,
.btn-hire-freelancer {
    cursor: pointer;
}