/* =========================================================
   MyLiveChat Mobile Responsive Fix
   Add this AFTER the MyLiveChat embed code
   ========================================================= */

   @media (max-width: 767px) {

    /* Main floating live chat wrapper */
    .mylivechat_inline.mylivechat_template1 {
        left: 12px !important;
        right: 12px !important;
        bottom: 12px !important;
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        z-index: 99999999 !important;
        font-family: Poppins, Arial, sans-serif !important;
        box-sizing: border-box !important;
    }
    
    /* Open chat outer box */
    .mylivechat_expanded_outer {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        border-radius: 14px !important;
        overflow: hidden !important;
        box-shadow: 0 14px 40px rgba(0, 0, 0, 0.22) !important;
        background: #ffffff !important;
    }
    
    /* Open chat box */
    .mylivechat_expanded {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        max-height: calc(100dvh - 95px) !important;
        height: auto !important;
        overflow: hidden !important;
        border-radius: 14px !important;
        background: #ffffff !important;
        box-sizing: border-box !important;
    }
    
    /* Chat title/header */
    .mylivechat_expanded_title {
        height: 42px !important;
        min-height: 42px !important;
        display: flex !important;
        align-items: center !important;
        padding: 0 10px !important;
        box-sizing: border-box !important;
        background: #002e5b !important;
    }
    
    .mylivechat_expanded_text {
        font-size: 14px !important;
        font-weight: 600 !important;
        text-indent: 0 !important;
        line-height: 42px !important;
        flex: 1 !important;
        color: #ffffff !important;
    }
    
    .mylivechat_sprite {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    /* Main content area */
    .mylivechat_container,
    .mylivechat_main {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }
    
    .mylivechat_offline_wrapper,
    .mylivechat_prechat_wrapper,
    .mylivechat_support_wrapper {
        width: 100% !important;
        max-width: 100% !important;
        overflow-y: auto !important;
        max-height: calc(100dvh - 145px) !important;
        box-sizing: border-box !important;
        background: #ffffff !important;
    }
    
    .mylivechat_offline,
    .mylivechat_prechat {
        width: 100% !important;
        box-sizing: border-box !important;
        background: #ffffff !important;
    }
    
    .mylivechat_offline_content,
    .mylivechat_prechat_content {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 16px 16px 10px !important;
        overflow: visible !important;
    }
    
    /* Logo */
    .mylivechat_offline_logo,
    .mylivechat_prechat_logo {
        text-align: center !important;
        margin-bottom: 10px !important;
    }
    
    .mylivechat_offline_logo_img,
    .mylivechat_prechat_logo_img {
        max-width: 220px !important;
        width: 70% !important;
        height: auto !important;
        display: inline-block !important;
    }
    
    /* Text */
    .mylivechat_offline_text,
    .mylivechat_prechat_text {
        font-size: 13px !important;
        line-height: 1.45 !important;
        color: #111827 !important;
        margin-bottom: 12px !important;
        text-align: left !important;
    }
    
    /* Turn horizontal fields into vertical fields */
    .mylivechat_inputgroup_horizental,
    .mylivechat_offline_name,
    .mylivechat_offline_email,
    .mylivechat_offline_enquiry,
    .mylivechat_prechat_name,
    .mylivechat_prechat_email,
    .mylivechat_prechat_question {
        display: block !important;
        width: 100% !important;
        margin: 0 0 12px !important;
        box-sizing: border-box !important;
    }
    
    /* Labels */
    .mylivechat_offline_lbl,
    .mylivechat_prechat_lbl,
    .mylivechat_offline_name_lbl,
    .mylivechat_offline_email_lbl,
    .mylivechat_offline_enquiry_lbl,
    .mylivechat_prechat_name_lbl,
    .mylivechat_prechat_email_lbl,
    .mylivechat_prechat_question_lbl {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 0 6px !important;
        padding: 0 !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        color: #1f2937 !important;
        line-height: 1.2 !important;
        text-align: left !important;
    }
    
    /* Inputs and textareas */
    .mylivechat_offline_box,
    .mylivechat_prechat_box,
    .mylivechat_offline_name_box,
    .mylivechat_offline_email_box,
    .mylivechat_offline_question_box,
    .mylivechat_prechat_name_box,
    .mylivechat_prechat_email_box,
    .mylivechat_prechat_question_box {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 42px !important;
        padding: 9px 12px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 8px !important;
        background: #ffffff !important;
        color: #111827 !important;
        font-size: 14px !important;
        line-height: 1.3 !important;
        outline: none !important;
        box-shadow: none !important;
    }
    
    .mylivechat_offline_question_box,
    .mylivechat_prechat_question_box {
        min-height: 82px !important;
        height: 82px !important;
        resize: vertical !important;
    }
    
    .mylivechat_offline_box:focus,
    .mylivechat_prechat_box:focus {
        border-color: #3823dd !important;
        box-shadow: 0 0 0 3px rgba(56, 35, 221, 0.12) !important;
    }
    
    /* Validation warning */
    .mylivechat_error,
    .mylivechat_errorpanel,
    .mylivechat_warning,
    .mylivechat_notice {
        width: 100% !important;
        box-sizing: border-box !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
        margin: 0 0 10px !important;
    }
    
    /* Submit area */
    .mylivechat_offline_submit,
    .mylivechat_prechat_submit {
        width: 100% !important;
        text-align: right !important;
        margin-top: 8px !important;
        box-sizing: border-box !important;
    }
    
    .mylivechat_offline_submit_button,
    .mylivechat_prechat_submit_button {
        width: 100% !important;
        height: 44px !important;
        border-radius: 9px !important;
        border: 0 !important;
        background: #3823dd !important;
        color: #ffffff !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        cursor: pointer !important;
    }
    
    /* Powered by iframe spacing */
    .mylivechat_offline iframe,
    .mylivechat_prechat iframe {
        margin: 8px auto 4px !important;
        max-width: 140px !important;
    }
    
    /* Close floating button */
    .mylivechat_closediv {
        right: 10px !important;
        bottom: 10px !important;
        z-index: 999999999 !important;
    }
    
    .mylivechat_closebtn {
        width: 46px !important;
        height: 46px !important;
        border-radius: 50% !important;
        background: #002e5b !important;
        box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25) !important;
    }
    
    /* Collapsed bar on mobile */
    @media (max-width: 767px) {
        .mylivechat_collapsed {
            width: 190px !important;
            min-width: 190px !important;
            max-width: 190px !important;
            border-radius: 10px !important;
        }
    
        .mylivechat_collapsed_text {
            font-size: 14px !important;
            line-height: 40px !important;
            text-indent: 12px !important;
        }
    }
    
    .mylivechat_collapsed_text {
        font-size: 14px !important;
        font-weight: 600 !important;
        text-indent: 10px !important;
    }
    }
    
    
    /* Extra small screens */
    @media (max-width: 420px) {
    .mylivechat_inline.mylivechat_template1 {
        left: 8px !important;
        right: 8px !important;
        bottom: 8px !important;
    }
    
    .mylivechat_expanded {
        max-height: calc(100dvh - 80px) !important;
    }
    
    .mylivechat_offline_wrapper,
    .mylivechat_prechat_wrapper {
        max-height: calc(100dvh - 125px) !important;
    }
    
    .mylivechat_offline_content,
    .mylivechat_prechat_content {
        padding: 14px 12px 8px !important;
    }
    
    .mylivechat_offline_logo_img,
    .mylivechat_prechat_logo_img {
        max-width: 190px !important;
    }
    }