@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap');

/* Maratime Journeys EmailMeForm theme with no logo, matched to the Dream Vacations advisor site (mhargarther.dreamvacations.com) so the form reads as part of the page.
Site: white background, Open Sans at 16px, navy #0B2E6A headings, blue #0677BD buttons and accents, body text #212529, pill buttons in bold caps. */

html, body, #emf-container-outer {
background: #FFFFFF !important;
color: #212529 !important;
}
#emf-container-outer { border: 0 !important; padding: 0 !important; margin: 0 auto !important; }

/* One font everywhere, including text pasted into fields with its own font */
#emf-container, #emf-container * { font-family: "Open Sans", Arial, Helvetica, sans-serif !important; }

#emf-container {
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
overflow: visible !important;
font-size: 16px !important;
color: #212529 !important;
}
#emf-form-shadows { display: none !important; }

/* No logo or header art: the page around the form already carries the branding */
#emf-logo, #emf-logo a, #emf-logo img { display: none !important; }

/* Title block */
#emf-form { padding-left: 0 !important; padding-right: 0 !important; }
#emf-form-instruction { padding: 0 0 8px !important; margin: 0 !important; background: transparent !important; border: 0 !important; }
#emf-container #emf-form-title { font-size: 32px !important; font-weight: 700 !important; line-height: 1.25 !important; color: #0B2E6A !important; }
#emf-form-description { font-size: 16px !important; line-height: 1.5 !important; color: #212529 !important; font-style: normal !important; margin-top: 10px !important; }
/* Only real links turn blue; empty link tags the form editor leaves behind stay plain text */
#emf-form-description a[href], .emf-section-text a[href], .emf-div-instruction a[href] { color: #0677BD !important; text-decoration: underline !important; }
#emf-container a:not([href]) { color: inherit !important; text-decoration: none !important; cursor: text !important; }

/* Page steps: lined up with the content, one divider only */
#emf-page-info { padding: 8px 0 4px !important; margin: 0 !important; border: 0 !important; }
.emf-steps { width: 100% !important; }
.emf-steps td { color: #0B2E6A !important; font-size: 13px !important; border: 0 !important; }
.emf-steps .emf-page-number { width: 28px !important; height: 28px !important; line-height: 26px !important; box-sizing: border-box !important; border: 2px solid #0B2E6A !important; border-radius: 50% !important; background: #FFFFFF !important; color: #0B2E6A !important; font-size: 13px !important; font-weight: 700 !important; box-shadow: none !important; }
.emf-steps .emf-page-number.emf-selected { background: #0B2E6A !important; color: #FFFFFF !important; }
.emf-steps .emf-page-label { color: #0B2E6A !important; }

/* Fields */
#emf-form ul, #emf-form ol { padding: 0 0 6px !important; margin: 0 !important; }
li.emf-li-field { padding: 10px 0 !important; }
label.emf-label-desc, .emf-label-desc { font-weight: 600 !important; font-size: 16px !important; line-height: 1.5 !important; color: #0B2E6A !important; margin: 6px 0 8px !important; }
label.emf-label-desc span, .emf-required, .emf-label-desc .emf-required { color: #0677BD !important; }
.emf-div-instruction, p.emf-div-instruction { font-size: 14px !important; line-height: 1.5 !important; color: #5A6270 !important; font-weight: normal !important; margin-top: 4px !important; }
label.emf-block.emf-text-center { font-size: 12px !important; color: #5A6270 !important; font-weight: normal !important; }

input[type=text], input[type=email], input[type=tel], input[type=number], input[type=password], textarea, select,
#emf-form input.validate, #emf-form textarea.validate, #emf-form select.validate {
font-size: 16px !important;
color: #0B2E6A !important;
background: #FFFFFF !important;
border: 1px solid #DBE1EB !important;
border-radius: 4px !important;
padding: 0 12px !important;
height: 48px !important;
line-height: 48px !important;
box-shadow: none !important;
}
textarea, #emf-form textarea.validate { height: auto !important; line-height: 1.5 !important; padding: 10px 12px !important; min-height: 100px !important; }
select, #emf-form select.validate { padding: 0 8px !important; min-width: 200px !important; }
input:focus, textarea:focus, select:focus { border-color: #0677BD !important; outline: none !important; box-shadow: 0 0 0 3px rgba(6,119,189,.18) !important; }

/* Segmented inputs (date, time, phone): EmailMeForm uses narrow emf-input-w20/w30/w40 boxes with bottom labels, so no side padding and fixed widths */
li.emf-field-datetime .emf-div-field > span, li.emf-field-phone .emf-div-field > span, li.emf-field-time .emf-div-field > span { display: inline-block !important; width: auto !important; vertical-align: top !important; }
li.emf-field-datetime .emf-div-field input[type=text], li.emf-field-phone .emf-div-field input[type=text], li.emf-field-time .emf-div-field input[type=text],
#emf-form input.emf-input-w20, #emf-form input.emf-input-w30, #emf-form input.emf-input-w40, #emf-form input.emf-input-w50 { padding: 0 4px !important; text-align: center !important; }
#emf-form input.emf-input-w20 { width: 48px !important; }
#emf-form input.emf-input-w30 { width: 64px !important; }
#emf-form input.emf-input-w40 { width: 80px !important; }
#emf-form input.emf-input-w50 { width: 100px !important; }
li.emf-field-phone .emf-div-field input[type=text]:not(.emf-input-w20):not(.emf-input-w30):not(.emf-input-w40):not(.emf-input-w50) { width: 100% !important; max-width: 320px !important; padding: 0 12px !important; text-align: left !important; }
li.emf-field-datetime .emf-sep, li.emf-field-phone .emf-sep, li.emf-field-time .emf-sep { display: inline-block !important; line-height: 48px !important; width: 14px !important; text-align: center !important; color: #5A6270 !important; }
.emf-bottom-label, label.emf-bottom-label { display: block !important; font-size: 12px !important; color: #5A6270 !important; text-align: center !important; font-weight: normal !important; margin-top: 2px !important; }
li.emf-field-datetime .datepicker, li.emf-field-datetime img.ui-datepicker-trigger { margin-top: 14px !important; vertical-align: top !important; }

/* Section breaks */
.emf-section-separator { border-top: 1px solid #D6E1EE !important; border-bottom: 0 !important; margin: 12px 0 16px !important; }
#emf-container .emf-div-field-section h3 { font-size: 24px !important; font-weight: 700 !important; color: #0B2E6A !important; margin: 4px 0 !important; }
.emf-section-text { font-size: 16px !important; color: #212529 !important; line-height: 1.5 !important; }

/* Radio and checkbox tiles. EmailMeForm wraps each option as div.one_column, .two_column, .three_column or .side_by_side > div > input + label */
li.emf-field-radio .emf-div-field::after, li.emf-field-checkbox .emf-div-field::after,
li.emf-field-radio .emf-div-field > div::after, li.emf-field-checkbox .emf-div-field > div::after { content: ""; display: table; clear: both; }
li.emf-field-radio .emf-div-field .two_column, li.emf-field-radio .emf-div-field .three_column,
li.emf-field-checkbox .emf-div-field .two_column, li.emf-field-checkbox .emf-div-field .three_column { box-sizing: border-box !important; padding-right: 8px !important; }
/* Single column tiles all run the full width so short and long answers line up */
li.emf-field-radio .emf-div-field .one_column > div, li.emf-field-checkbox .emf-div-field .one_column > div { width: 100% !important; box-sizing: border-box !important; }
li.emf-field-radio .emf-div-field .side_by_side, li.emf-field-checkbox .emf-div-field .side_by_side { display: inline-block !important; float: none !important; width: auto !important; margin: 0 8px 0 0 !important; vertical-align: top !important; }
li.emf-field-radio .emf-div-field .one_column > div, li.emf-field-checkbox .emf-div-field .one_column > div,
li.emf-field-radio .emf-div-field .two_column > div, li.emf-field-checkbox .emf-div-field .two_column > div,
li.emf-field-radio .emf-div-field .three_column > div, li.emf-field-checkbox .emf-div-field .three_column > div,
li.emf-field-radio .emf-div-field .side_by_side > div, li.emf-field-checkbox .emf-div-field .side_by_side > div {
display: flex !important; align-items: center !important; gap: 10px !important;
background: #F3F7FB !important; border: 1px solid #D6E1EE !important; border-radius: 8px !important;
padding: 10px 14px !important; margin: 6px 0 !important; cursor: pointer !important;
}
li.emf-field-radio .emf-div-field .side_by_side > div, li.emf-field-checkbox .emf-div-field .side_by_side > div { padding-right: 18px !important; }
li.emf-field-radio .emf-div-field .one_column > div:hover, li.emf-field-checkbox .emf-div-field .one_column > div:hover,
li.emf-field-radio .emf-div-field .two_column > div:hover, li.emf-field-checkbox .emf-div-field .two_column > div:hover,
li.emf-field-radio .emf-div-field .three_column > div:hover, li.emf-field-checkbox .emf-div-field .three_column > div:hover,
li.emf-field-radio .emf-div-field .side_by_side > div:hover, li.emf-field-checkbox .emf-div-field .side_by_side > div:hover { border-color: #0677BD !important; }
li.emf-field-radio .emf-div-field .one_column > div:has(input:checked), li.emf-field-checkbox .emf-div-field .one_column > div:has(input:checked),
li.emf-field-radio .emf-div-field .two_column > div:has(input:checked), li.emf-field-checkbox .emf-div-field .two_column > div:has(input:checked),
li.emf-field-radio .emf-div-field .three_column > div:has(input:checked), li.emf-field-checkbox .emf-div-field .three_column > div:has(input:checked),
li.emf-field-radio .emf-div-field .side_by_side > div:has(input:checked), li.emf-field-checkbox .emf-div-field .side_by_side > div:has(input:checked) { background: #E5F1FA !important; border-color: #0677BD !important; }
li.emf-field-radio .emf-div-field label, li.emf-field-checkbox .emf-div-field label {
font-size: 16px !important; font-weight: normal !important; color: #212529 !important;
padding: 0 !important; margin: 0 !important; flex: 1 !important; cursor: pointer !important;
}
li.emf-field-radio .emf-allow-other input[type=text], li.emf-field-checkbox .emf-allow-other input[type=text] { margin-top: 6px !important; }
input[type=radio], input[type=checkbox] { accent-color: #0B2E6A !important; width: 16px !important; height: 16px !important; margin: 0 !important; flex: none !important; }
/* No block highlight on the active question */
li.highlight-field, li.emf-li-field.highlight-field { background: transparent !important; }

/* Likert / grid */
.emf-field-grid { border-collapse: separate !important; border-spacing: 0 !important; border: 1px solid #DBE1EB !important; border-radius: 8px !important; overflow: hidden !important; }
.emf-field-grid th, .emf-field-grid td { font-size: 14px !important; color: #212529 !important; border-color: #D6E1EE !important; padding: 8px !important; }
.emf-banding-head th, .emf-banding-head td { background: #E5F1FA !important; color: #0B2E6A !important; font-weight: 700 !important; }
.emf-banding-odd th, .emf-banding-odd td { background: #F7FAFD !important; }
.emf-banding-even th, .emf-banding-even td { background: #FFFFFF !important; }

/* Notes: any HTML block using class note */
.note, .emf-field-html .note { background: #E5F1FA !important; border-left: 4px solid #0677BD !important; border-radius: 8px !important; padding: 12px 14px !important; margin: 16px 0 !important; font-size: 14px !important; line-height: 1.55 !important; color: #212529 !important; }

/* Button: matches the site's main blue pill */
#emf-li-post-button, li.emf-li-post-button { padding: 14px 0 28px !important; text-align: left !important; }
#submit_form, #emf-form input[type=submit], #emf-form input[type=button], #emf-form button, .emf-button, #emf-form .emf-btn-next, #emf-form .emf-btn-prev {
display: inline-block !important;
background: #0677BD !important; color: #FFFFFF !important;
font-size: 20px !important; font-weight: 700 !important; text-transform: uppercase !important;
border: 0 !important; border-radius: 100px !important; padding: 12px 24px !important;
height: auto !important; line-height: 1.2 !important; cursor: pointer !important; box-shadow: none !important; text-shadow: none !important;
background-image: none !important;
}
#submit_form:hover, #emf-form input[type=submit]:hover, #emf-form input[type=button]:hover, #emf-form button:hover { background: #0B2E6A !important; }
#emf-form .emf-btn-prev { background: #FFFFFF !important; color: #0677BD !important; border: 3px solid #0677BD !important; padding: 9px 21px !important; }

/* Validation */
.emf-tooltip, .formError, .formErrorContent { font-size: 12px !important; background: #FFF4F4 !important; color: #B3261E !important; border: 1px solid #E5B4B0 !important; border-radius: 8px !important; box-shadow: none !important; }
.formErrorArrow div { background: #FFF4F4 !important; border-color: #E5B4B0 !important; }

/* Footer: EmailMeForm renders its own footer below the form; keep it quiet so it reads as page text */
#emf-footer, .emf-footer, #emf-container-outer > div:last-child:not(#emf-container) {
background: transparent !important; border: 0 !important; color: #8A93A3 !important;
text-align: center !important; padding: 10px 0 !important; font-size: 12px !important; line-height: 1.5 !important;
}
#emf-footer a, .emf-footer a { color: #8A93A3 !important; }
