/* ============================================================
   Binotel GetCall (theme_5) -> Ideal Sport
   Site: idealsport.mykytka.top
   #845E82 / #AFC36A  ->  #264AFF (--q-primary), font -> Montserrat

   Selectors repeat the widget's own full chains, so specificity is
   equal to theme_5.css. Ties are broken by load order: this file must
   be applied AFTER https://widgets.binotel.com/getcall/css/theme_5.css
   (that <link> is injected by the widget JS at runtime).
   If a rule does not stick, duplicate the widget id in the selector
   (#bingc-active#bingc-active ...) — that outranks the theme regardless
   of order.

   Panel background is the darker brand shade #16309F on purpose:
   the CTA is #264AFF, so a #264AFF panel would swallow the button.
   To go back to a flat bright panel, swap #16309F -> #264AFF in
   sections 2.1 / 2.2 and make the CTA #FFBB00 with color #1A1A1A.
   ============================================================ */

/* ---------- 1. Typography (theme "font:" is not !important -> wins anywhere) ---------- */
#bingc-passive, #bingc-passive *,
#bingc-active, #bingc-active *,
#bingc-phone-button, #bingc-phone-button * {
    font-family: 'Montserrat', sans-serif !important;
}

/* ---------- 2.1 Passive form (modal) ---------- */
#bingc-passive div.bingc-passive-overlay {
    background-color: #16309F !important;
    border-radius: 8px;
    box-shadow: 0 18px 48px rgba(38, 74, 255, .22);
}

#bingc-passive div.bingc-passive-background {
    background: rgba(15, 23, 58, .55) !important;
}

/* ---------- 2.2 Active form (bottom bar) ---------- */
#bingc-active {
    background: #16309F !important;
    box-shadow: 0 -8px 24px rgba(0, 0, 0, .18);
}

/* ---------- 3. CTA button ---------- */
#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form a.bingc-passive-phone-form-button {
    background: #264AFF !important;
    color: #fff !important;
    font-weight: 600;
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .18);
    transition: background .2s ease, transform .2s ease;
}

#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form a.bingc-passive-phone-form-button:hover {
    background: #1D3BD6 !important;
    transform: translateY(-1px);
}

#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form a.bingc-passive-phone-form-button:active {
    background: #16309F !important;
    transform: translateY(0);
}

#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form a.bingc-active-phone-form-button {
    background: #264AFF !important;
    color: #fff !important;
    font-weight: 600;
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .18);
    transition: background .2s ease, transform .2s ease;
}

#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form a.bingc-active-phone-form-button:hover {
    background: #1D3BD6 !important;
    transform: translateY(-1px);
}

#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form a.bingc-active-phone-form-button:active {
    background: #16309F !important;
    transform: translateY(0);
}

/* ---------- 4. Phone input ---------- */
#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form input.bingc-passive-get-phone-form-input,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form input.bingc-active-get-phone-form-input {
    color: #1A1A1A !important;
    background: #fff;
    border: #fff 1px solid;
    border-radius: 8px !important;   /* theme resets inputs with border-radius:0 !important */
    transition: box-shadow .2s ease, border-color .2s ease;
}

#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form input.bingc-passive-get-phone-form-input:focus,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form input.bingc-active-get-phone-form-input:focus {
    outline: none;
    border-color: #264AFF;
    box-shadow: 0 0 0 3px rgba(38, 74, 255, .35) !important;   /* theme: box-shadow:none !important */
}

#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form input.bingc-passive-get-phone-form-input.warning,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form input.bingc-active-get-phone-form-input.warning {
    border: #FF6B6B 1px solid;
    box-shadow: 0 0 0 3px rgba(255, 107, 107, .35) !important;
}

#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form input.bingc-passive-get-phone-form-input::-webkit-input-placeholder,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form input.bingc-active-get-phone-form-input::-webkit-input-placeholder {
    color: #9AA3B2 !important;
    font-family: 'Montserrat', sans-serif !important;
}

#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form input.bingc-passive-get-phone-form-input::-moz-placeholder,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form input.bingc-active-get-phone-form-input::-moz-placeholder {
    color: #9AA3B2 !important;
    font-family: 'Montserrat', sans-serif !important;
}

#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form input.bingc-passive-get-phone-form-input::placeholder,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form input.bingc-active-get-phone-form-input::placeholder {
    color: #9AA3B2 !important;
    font-family: 'Montserrat', sans-serif !important;
}

/* ---------- 5. Floating call button ---------- */
#bingc-phone-button svg.bingc-phone-button-circle circle.bingc-phone-button-circle-inside {
    fill: #264AFF !important;
}

#bingc-phone-button:hover svg.bingc-phone-button-circle circle.bingc-phone-button-circle-inside {
    fill: rgba(38, 74, 255, 0.96) !important;
}

#bingc-phone-button svg.bingc-phone-button-circle circle.bingc-phone-button-circle-outside {
    fill: #264AFF;
    fill-opacity: .16;
}

#bingc-phone-button div.bingc-phone-button-tooltip {
    background: #264AFF !important;
    color: #fff !important;
    font-weight: 500;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
}

#bingc-phone-button div.bingc-phone-button-tooltip svg.bingc-phone-button-arrow polyline {
    fill: #264AFF !important;
}

/* ---------- 6. Close button (desktop: sits on the white page) ---------- */
#bingc-passive div.bingc-passive-overlay a.bingc-passive-close-button svg polygon {
    fill: #264AFF !important;
}

/* ---------- 7. Offline form: date / time pickers (were green) ---------- */
#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection div.bingc-passive-date-selection-select-hour,
#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection div.bingc-passive-date-selection-select-minutes,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form div.bingc-active-get-phone-form-date-selection div.bingc-active-date-selection-select-hour,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form div.bingc-active-get-phone-form-date-selection div.bingc-active-date-selection-select-minutes {
    background: rgba(255, 255, 255, .16) !important;
    border-radius: 6px;
}

#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection div.bingc-passive-date-selection-select-day:hover,
#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection div.bingc-passive-date-selection-select-hour:hover,
#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection div.bingc-passive-date-selection-select-minutes:hover,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-we-will-call-you.bingc-offline-form div.bingc-active-date-selection-select-day:hover,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form div.bingc-active-get-phone-form-date-selection div.bingc-active-date-selection-select-hour:hover,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form div.bingc-active-get-phone-form-date-selection div.bingc-active-date-selection-select-minutes:hover {
    background: rgba(255, 255, 255, .28) !important;
    border-radius: 6px;
}

#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection div.bingc-passive-date-selection-select-day div.bingc-passive-date-selection-select-day-list-of-days-container ul.bingc-passive-date-selection-select-day-list-of-days li,
#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection div.bingc-passive-date-selection-select-hour div.bingc-passive-date-selection-select-hour-list-of-hours-container ul.bingc-passive-date-selection-select-hour-list-of-hours li,
#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection div.bingc-passive-date-selection-select-minutes div.bingc-passive-date-selection-select-minutes-list-of-minutes-container ul.bingc-passive-date-selection-select-minutes-list-of-minutes li,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-we-will-call-you.bingc-offline-form div.bingc-active-date-selection-select-day div.bingc-active-date-selection-select-day-list-of-days-container ul.bingc-active-date-selection-select-day-list-of-days li,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form div.bingc-active-get-phone-form-date-selection div.bingc-active-date-selection-select-hour div.bingc-active-date-selection-select-hour-list-of-hours-container ul.bingc-active-date-selection-select-hour-list-of-hours li,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form div.bingc-active-get-phone-form-date-selection div.bingc-active-date-selection-select-minutes div.bingc-active-date-selection-select-minutes-list-of-minutes-container ul.bingc-active-date-selection-select-minutes-list-of-minutes li {
    color: #264AFF !important;
}

#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection div.bingc-passive-date-selection-select-day div.bingc-passive-date-selection-select-day-list-of-days-container ul.bingc-passive-date-selection-select-day-list-of-days li:hover,
#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection div.bingc-passive-date-selection-select-hour div.bingc-passive-date-selection-select-hour-list-of-hours-container ul.bingc-passive-date-selection-select-hour-list-of-hours li:hover,
#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection div.bingc-passive-date-selection-select-minutes div.bingc-passive-date-selection-select-minutes-list-of-minutes-container ul.bingc-passive-date-selection-select-minutes-list-of-minutes li:hover,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-we-will-call-you.bingc-offline-form div.bingc-active-date-selection-select-day div.bingc-active-date-selection-select-day-list-of-days-container ul.bingc-active-date-selection-select-day-list-of-days li:hover,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form div.bingc-active-get-phone-form-date-selection div.bingc-active-date-selection-select-hour div.bingc-active-date-selection-select-hour-list-of-hours-container ul.bingc-active-date-selection-select-hour-list-of-hours li:hover,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form div.bingc-active-get-phone-form-date-selection div.bingc-active-date-selection-select-minutes div.bingc-active-date-selection-select-minutes-list-of-minutes-container ul.bingc-active-date-selection-select-minutes-list-of-minutes li:hover {
    background: #264AFF !important;
    color: #fff !important;
}

#bingc-passive div.bingc-passive-overlay div.bingc-passive-content div.bingc-passive-get-phone-form form.bingc-passive-get-phone-form div.bingc-passive-get-phone-form-date-selection-tablets-and-mobiles select,
#bingc-active div.bingc-active-overlay div.bingc-active-content div.bingc-active-get-phone-form form.bingc-active-get-phone-form div.bingc-active-get-phone-form-date-selection-tablets-and-mobiles select {
    color: #1A1A1A !important;
    border-radius: 6px !important;
}

/* ---------- 8. Mobile: close button moves inside the panel ---------- */
@media all and (max-width: 979px) {
    #bingc-passive div.bingc-passive-overlay a.bingc-passive-close-button svg polygon {
        fill: #fff !important;
    }
}