/* Monday CRM shared form styles — include on any page using .monday-form */
.contact-form { max-width: 100%; width: 480px; }
.contact-form .cf-field { margin-bottom: 8px; }
.contact-form label { display: block; font-size: 13px; margin-bottom: 2px;  }
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form select,
.contact-form textarea {
    width: 100%; padding: 4px 12px; border: 1px solid #bbb; border-radius: 8px;
    box-shadow:none;
    margin-bottom:4px;
    font-size: 13px; height:38px; color: #000; background: #fff; 
    transition: border-color 0.2s; font-family: inherit;
}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus { outline: none; border:2px solid #0a2cc9;}
.contact-form input.cf-error,
.contact-form select.cf-error,
.contact-form textarea.cf-error { border:1px solid #C93737; }
.cf-field-error { display: none; font-size: 12px; color: #C93737;}
.cf-field-error.visible { display: block; }
.contact-form select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23666' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    cursor: pointer;
}
.contact-form textarea {resize: vertical;}
.contact-form input[type="text"]::placeholder,
.contact-form input[type="email"]::placeholder,
.contact-form input[type="tel"]::placeholder,
.contact-form textarea::placeholder  {
    color:#8e8e8e;
}


.contact-form .cf-phone-row { display: flex; gap: 8px; }
.contact-form .cf-phone-row .cf-dial-code-widget { width: 150px; flex-shrink: 0; }
.contact-form .cf-phone-row input  { flex: 1; }
.cf-dial-code-widget,
.cf-country-widget { position: relative; }
.cf-dial-code-input,
.cf-country-input {
    width: 100%; padding: 0 12px; border: 1px solid #ddd; border-radius: 8px;
    font-size: 15px; height: 40px; color: #000; background: #fff;
    transition: border-color 0.2s; font-family: inherit; box-sizing: border-box; cursor: pointer;
}
.cf-dial-code-input:focus,
.cf-country-input:focus { outline: none; border-color: #C93737; }
.cf-dial-code-input.cf-error,
.cf-country-input.cf-error { border-color: #C93737; }
.cf-dial-code-dropdown,
.cf-country-dropdown {
    position: absolute; top: calc(100% + 4px); left: 0;
    background: #fff; border: 1px solid #ddd; border-radius: 8px;
    max-height: 220px; overflow-y: auto; overflow-x:hidden; z-index: 200;
    list-style: none; margin: 0; padding: 4px 0;
    box-shadow: 0 4px 14px rgba(0,0,0,0.13);
    min-width:320px;
    width: 100%;max-width: 100%; display: none;
}
.cf-dial-code-dropdown.open,
.cf-country-dropdown.open { display: block; }
.cf-dial-code-dropdown li,
.cf-country-dropdown li {
    padding: 8px 12px; font-size: 15px; cursor: pointer;
    white-space: nowrap; text-overflow: ellipsis; color: #333;
}
.cf-dial-code-dropdown li:hover, .cf-dial-code-dropdown li.active,
.cf-country-dropdown li:hover,   .cf-country-dropdown li.active { background: rgba(26,115,232,.08); color: #0a2cc9; }
.cf-radio-group { display: flex; flex-direction: column; gap: 8px; }
.cf-radio-group label { display: flex; align-items: center; gap: 10px; font-weight: 400; cursor: pointer; }
.cf-radio-group input[type="radio"] { width: 18px; height: 18px; accent-color: #C93737; flex-shrink: 0; }
.cf-radio-group.cf-error-group { outline: 2px solid #C93737; border-radius: 8px; padding: 8px; }
.contact-form .cf-submit {display: inline-block;background: var(--clr-primary);color: #fff;padding: 13px 36px;width: 100%;border: none;border-radius: 24px;font-size: 15px;font-weight: bold;cursor: pointer;transition: opacity 0.2s;margin-top: 16px;}
.contact-form .cf-submit:hover   { opacity: 0.88; }
.contact-form .cf-submit:disabled { opacity: 0.5; cursor: default; }
.cf-msg { font-size: 15px; display: none; margin-bottom: 12px; }
.cf-msg.cf-success {display: block; background: #e4eedc; color: #527449;padding: 12px 16px; border-radius: 8px;}
.cf-msg.cf-fail    { color: #C93737; display: block; }
.cf-deck-success {
    background: #e4eedc; color: #527449;
    padding: 20px 24px; border-radius: 8px;
    font-size: 15px; line-height: 1.7; max-width: 460px;
}
.cf-deck-success a {
    display: inline-block; margin-top: 8px;
    color: #527449; font-weight: 700; text-decoration: underline;
}
.cf-deck-success a:hover { opacity: 0.75; }
.dark-md-form label {color:#fff;}

.form-demo-request h2 {width:100%;max-width:480px;margin:0 auto var(--24px) auto; font-family:var(--font-bold);} 
.contact-form.monday-form { margin:0 auto; width:100%; max-width:480px;}
.tab-panel h2 {margin-bottom:10px;margin-top:30px; font-family:var(--font-bold); }
.tab-panel.form-general-enquiry {display:flex;flex-flow:row wrap;}

.tab-panel.form-general-enquiry h2 {

       font-family: var(--font-bold);
    font-size: var(--40px);
    line-height: 1.2;
    margin: 0 auto 10px auto;
    max-width:100%;
    width:480px;
}



@media only screen and (max-width: 640px) {
    .new-contact-container-inner-right {padding: var(--36px)!important;}
    .contact-form.monday-form {max-width:100%;}
    .tab-panel h2 {max-width:100%;}
    .tab-panel.form-demo-request h2 {margin-top:0;}
    .tab-panel.form-general-enquiry h2 {width:100%;}
    .new-contact-container-inner-right {padding:var(--36px)!important;}

}