{
  "format": 1,
  "slug": "form-contact-split-details",
  "title": "Contact form with office details",
  "description": "An 820px contact modal split in two: a dark teal panel with your address, phone, email and opening hours on the left, the message form (name, email, phone, subject, message) on the right. Opens from any element with the class wdpop-contact-us; edit the details in the popup body. Needs Pro for the contact form type.",
  "type": "form",
  "categories": [
    "engagement",
    "lead-capture"
  ],
  "season": "",
  "requires": {
    "pro": false,
    "plugins": []
  },
  "preview": "preview.webp",
  "images": [],
  "form": {
    "form_name": "Contact us",
    "form_type": "contact",
    "form_tab": {
      "contact_fields": [
        "name",
        "phone",
        "subject"
      ],
      "contact_required": [
        "name",
        "subject"
      ],
      "contact_message_label": "Message",
      "contact_submit_text": "Send message",
      "notify_enabled": "1",
      "notify_to": "",
      "notify_subject": "New message from {{site_name}}",
      "autoreply_enabled": "0",
      "also_subscribe": "0",
      "store_submissions": "1",
      "msg_success": "Thanks - your message is on its way. We reply within one business day.",
      "msg_fail": "Sorry, something went wrong. Please try again or email us directly.",
      "hide_form": "1",
      "style": "custom",
      "primary_color": "#0f3d3e",
      "button_text_color": "#ffffff",
      "input_bg": "#ffffff",
      "input_text": "#111827",
      "input_border": "#d1d5db",
      "label_color": "#374151",
      "input_radius": "8",
      "field_gap": "0"
    }
  },
  "popup": {
    "popup_name": "Contact form with office details",
    "wdpop_item_tab": {
      "popup_type": "form",
      "popup_title": "Send us a message<small class=\"wdpop-sub\">All fields except phone are required.</small>",
      "Popup_content": "<p class=\"wdpop-side-title\">Let’s talk</p><p class=\"wdpop-side-lead\">Tell us what you need and we’ll get back within one business day.</p><p class=\"wdpop-row wdpop-row--visit\"><b>Visit</b>14 Harbour Lane, Suite 3<br>Bristol BS1 4QD</p><p class=\"wdpop-row wdpop-row--call\"><b>Call</b>+44 117 456 0230</p><p class=\"wdpop-row wdpop-row--email\"><b>Email</b>hello@harbourstudio.co.uk</p><p class=\"wdpop-hours\"><b>Mon–Fri</b> 9:00–17:30 · <b>Sat</b> by appointment</p><p class=\"wdpop-privacy\">We never share your details.</p>",
      "ct_form_after_action": "none",
      "popup_display_mode": "modal",
      "popup_width": "modal-custom-width",
      "popup_custom_width": {
        "width": "820",
        "unit": "px"
      },
      "popup_position": "wdpop_core_middle_center",
      "popup_style_accordions": {
        "style_bg": "#ffffff",
        "style_text": "#374151",
        "style_radius": "18",
        "style_padding": {
          "top": "0",
          "right": "0",
          "bottom": "0",
          "left": "0",
          "unit": "px"
        },
        "style_shadow": "large",
        "style_overlay_color": "#111827",
        "style_overlay_opacity": "55",
        "style_heading_size": "20",
        "style_heading_weight": "800",
        "style_heading_color": "#111827",
        "style_body_size": "14",
        "style_align": "left",
        "close_btn_color": {
          "color": "#111111",
          "hover": "#0f3d3e"
        },
        "close_btn_bg_color": {
          "color": "#f3f4f6",
          "hover": "#e5e7eb"
        },
        "close_btn_border_color": {
          "color": "transparent",
          "hover": "transparent"
        },
        "anim_in": "zoom",
        "anim_out": "fade",
        "anim_duration": "300",
        "custom_css": "/* Two panels in one modal: the body copy is the dark teal side panel (title, lead, contact rows with icon tiles, hours pinned to the foot), the heading and the form make the white panel, and the privacy note is pinned into the form's footer beside the button. Selectors carry .wdpop-root so they outrank Pro's stylesheet, which loads after this CSS. */\n{{POPUP}}.wdpop-root .modal-content{overflow:hidden;font-family:'Segoe UI',Roboto,Helvetica,Arial,sans-serif}\n{{POPUP}}.wdpop-root .wing--popup-wrapper,{{POPUP}}.wdpop-root .wing--popup-content-wrap{padding:0;text-align:var(--wdpop-align,left)}\n{{POPUP}}.wdpop-root [data-wdpop-step-main]{display:grid;grid-template-columns:290px minmax(0,1fr);grid-template-rows:auto 1fr}\n{{POPUP}}.wdpop-root .wing--popup-content{grid-column:1;grid-row:1/3;display:flex;flex-direction:column;margin:0;padding:36px 30px;background:#0f3d3e;color:#b9d6d3;line-height:1.5}\n{{POPUP}}.wdpop-root .wing--popup-content p{margin:0}\n{{POPUP}}.wdpop-root .wing--popup-content .wdpop-side-title{margin:0 0 8px;font-family:Georgia,'Times New Roman',Times,serif;font-size:30px;line-height:1.1;color:#fff}\n{{POPUP}}.wdpop-root .wing--popup-content .wdpop-side-lead{margin:0 0 26px}\n{{POPUP}}.wdpop-root .wing--popup-content .wdpop-row{position:relative;min-height:32px;margin:0 0 18px;padding-left:44px;color:#fff;line-height:1.45}\n{{POPUP}}.wdpop-root .wdpop-row::before{content:'';position:absolute;left:0;top:0;width:32px;height:32px;border-radius:8px;background:rgba(255,255,255,.1) center/16px 16px no-repeat}\n{{POPUP}}.wdpop-root .wdpop-row--visit::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237fc4bf' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s7-6.2 7-12a7 7 0 0 0-14 0c0 5.8 7 12 7 12z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E\")}\n{{POPUP}}.wdpop-root .wdpop-row--call::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237fc4bf' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2'/%3E%3C/svg%3E\")}\n{{POPUP}}.wdpop-root .wdpop-row--email::before{background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237fc4bf' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E\")}\n{{POPUP}}.wdpop-root .wdpop-row b{display:block;margin:0 0 2px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#7fc4bf}\n{{POPUP}}.wdpop-root .wing--popup-content .wdpop-hours{margin-top:auto;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);font-size:12.5px}\n{{POPUP}}.wdpop-root .wdpop-hours b{color:#fff}\n{{POPUP}}.wdpop-root .wing--popup-content .wdpop-privacy{position:absolute;left:326px;bottom:45px;margin:0;font-size:12px;line-height:1.2;color:#6b7280;pointer-events:none}\n{{POPUP}}.wdpop-root .wing--popup-title{grid-column:2;grid-row:1;margin:36px 36px 20px;line-height:1.2;letter-spacing:-.01em}\n{{POPUP}}.wdpop-root .wing--popup-title .wdpop-sub{display:block;margin:4px 0 0;font-size:13.5px;font-weight:400;letter-spacing:0;color:#6b7280}\n{{POPUP}}.wdpop-root .wdpop-form{grid-column:2;grid-row:2;align-self:start;display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:none;margin:0 36px 32px}\n{{POPUP}}.wdpop-root .wdpop-form .wdpop-field{margin:0;min-width:0}\n{{POPUP}}.wdpop-root .wdpop-form .wdpop-field--message,{{POPUP}}.wdpop-root .wdpop-form .wdpop-form__message,{{POPUP}}.wdpop-root .wdpop-form .wdpop-form__done{grid-column:1/-1}\n{{POPUP}}.wdpop-root .wdpop-form .wdpop-label{margin:0 0 5px;font-size:12px;font-weight:600}\n{{POPUP}}.wdpop-root .wdpop-form .wdpop-required{color:#9ca3af;font-weight:400}\n{{POPUP}}.wdpop-root .wdpop-form .wdpop-field input.wdpop-input,{{POPUP}}.wdpop-root .wdpop-form .wdpop-field textarea.wdpop-input{margin:0;padding:10px 12px;font:inherit;font-size:14px;line-height:1.4}\n{{POPUP}}.wdpop-root .wdpop-form .wdpop-field textarea.wdpop-input{height:84px;resize:none}\n{{POPUP}}.wdpop-root .wdpop-form .wdpop-form__submit{grid-column:1/-1;justify-self:end;margin:4px 0 0;padding:13px 24px;font:inherit;font-size:14px;font-weight:700;line-height:1;border-radius:9px}\n{{POPUP}}.wdpop-root .wdpop-form .wdpop-form__message{margin:0}\n{{POPUP}}.wdpop-root .wing--popup-close-btn{top:14px;right:14px;width:30px;height:30px;padding:0;border:0;line-height:30px;font-size:18px;text-align:center}\n@media (max-width:767.98px){{{POPUP}}.wdpop-root [data-wdpop-step-main]{grid-template-columns:1fr;grid-template-rows:auto}{{POPUP}}.wdpop-root .wing--popup-content{grid-column:1;grid-row:1;padding:28px 24px}{{POPUP}}.wdpop-root .wing--popup-content .wdpop-hours{margin-top:8px}{{POPUP}}.wdpop-root .wing--popup-content .wdpop-privacy{display:none}{{POPUP}}.wdpop-root .wing--popup-title{grid-column:1;grid-row:2;margin:28px 24px 16px}{{POPUP}}.wdpop-root .wdpop-form{grid-column:1;grid-row:3;grid-template-columns:1fr;margin:0 24px 28px}{{POPUP}}.wdpop-root .wdpop-form .wdpop-form__submit{justify-self:stretch}}"
      },
      "on_click_events": {
        "on_click_status": "1",
        "popup_css_selectors": ".wdpop-contact-us",
        "prevent_default": "1"
      },
      "page_load_events": {
        "page_load_status": "0",
        "popup_delay": "0"
      },
      "frequency_events": {
        "freq_mode": "always"
      }
    }
  }
}