.gw-form .gw-field {
    margin-bottom: 24px;
}
.gw-form label {
    display: block;
    margin-bottom: 10px;
    color: var(--white80);
    font-weight: 400;
}
input[type='text']:not([data-powerout-widget] *),
input[type='email']:not([data-powerout-widget] *),
.gw-input,
.gw-textarea {
    width: 100%;
    background: transparent;
    color: var(--white);
    border: 1px solid var(--white50);
    border-radius: 3.5px;
    padding: 8px 18px;
}
.gw-textarea {
    resize: vertical;
}
.gw-input::placeholder,
.gw-textarea::placeholder {
    color: var(--white50);
}
input.text:focus,
input.title:focus,
input[type='text']:focus:not([data-powerout-widget] *),
select:focus:not([data-powerout-widget] *),
textarea:focus:not([data-powerout-widget] *),
.gw-input:focus,
.gw-textarea:focus {
    outline: none;
    border-color: var(--inchWorm);
    box-shadow: none;
    color: var(--white);
}
.gw-file-trigger {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    text-align: left;
    background: transparent;
    border: 0;
    padding: 0;
    color: #e8e8e8;
    cursor: pointer;
}
.gw-file-trigger svg {
    opacity: .7;
}
.gw-file-text .title {
    display: block;
    font-weight: 400;
    font-size: 14px;
}
.gw-file-text .hint {
    display: block;
    margin-top: 6px;
    color: var(--white50);
    font-size: 12px;
}
.gw-file-input {
    position: absolute;
    left: -9999px;
}
.gw-file-name {
    margin-top: 10px;
    font-size: 14px;
    color: #d9d9d9;
}
.gw-submit {
    background: var(--inchWorm);
    color: var(--black);
    border: 0;
    border-radius: 3.5px;
    padding: 8px 21px;
    font-weight: 400;
    font-size: 14px;
    cursor: pointer;
}
.gw-submit:hover {
    filter: brightness(.95);
}
.gw-submit:focus {
    outline: 2px solid var(--inchWorm);
    outline-offset: 3px;
}
.wpcf7 form.sent .wpcf7-response-output {
    border-color: var(--inchWorm);
}
.wpcf7-form {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    max-width: 600px;
    margin: 0 auto;
    position: relative;
}
.wpcf7-form-control-wrap {
    flex: 1 1 auto;
    min-width: 200px;
    display: flex;
    flex-direction: column;
}
.wpcf7-form-control.wpcf7-email {
    width: 100%;
    background: #fff;
    color: #000;
    border: 1px solid rgba(0,0,0,.1);
    border-radius: 4px;
    padding: 12px 18px;
    font-size: 14px;
    font-weight: 400;
}
.wpcf7-form-control.wpcf7-email::placeholder {
    color: #999;
}
.wpcf7-form-control.wpcf7-email:focus {
    outline: none;
    border-color: rgba(0,0,0,.2);
    box-shadow: none;
    color: #000;
}
.wpcf7-submit-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    margin-right: -48px;
}
.wpcf7-form-control.wpcf7-submit {
    background: #b3f07a;
    color: #000;
    border: 0;
    border-radius: 4px;
    padding: 12px 24px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: filter 0.2s ease;
    margin-top: 0;
}
.wpcf7-form-control.wpcf7-submit:hover {
    filter: brightness(.95);
}
.wpcf7-form-control.wpcf7-submit:focus {
    outline: 2px solid #b3f07a;
    outline-offset: 3px;
}
@media screen and (max-width: 767px) {
    .wpcf7-submit-wrapper {
        flex-direction: column;
        margin-right: 0;
    }
    .wpcf7-submit-wrapper .wpcf7-spinner {
        margin-top: 15px;
    }
}
.wpcf7-not-valid-tip {
    color: #ea4335 !important;
    font-size: 12px;
    margin-top: 6px;
    display: block;
    order: 2;
}
.wpcf7-form-control.wpcf7-email.wpcf7-not-valid {
    border-color: #ea4335 !important;
}
.wpcf7-response-output {
    position: static !important;
    width: 100%;
    margin-top: 16px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    background: #000000 !important;
    border: 1px solid #ffd700 !important;
    border-radius: 4px;
    padding: 12px 16px;
    color: #ffffff !important;
    font-size: 13px;
    line-height: 1.4;
    text-align: left;
    order: 999;
}
.wpcf7-mail-sent-ok .wpcf7-response-output {
    border-color: var(--inchWorm) !important;
    background: #000000 !important;
    color: var(--inchWorm) !important;
}
.wpcf7-validation-errors .wpcf7-response-output,
.wpcf7-mail-sent-ng .wpcf7-response-output {
    border-color: #ffd700 !important;
    background: #000000 !important;
    color: #ffffff !important;
}
.wpcf7-spam .wpcf7-response-output {
    border-color: #ffd700 !important;
    background: #000000 !important;
    color: #ffffff !important;
}
.wpcf7 .screen-reader-response {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* The embedded PowerOut widget (React + MUI) owns its own styling entirely —
   the :not([data-powerout-widget] *) guards above keep this file's own
   global input/select/textarea rules from ever touching it. MUI's
   Modal/Autocomplete popups now render inside [data-powerout-widget] too
   (disablePortal, set app-side) instead of portaling to <body>, so this
   reaches the "Report an outage"/alerts modals as well as the search bar.
   This fallback only exists for Divi core's own (not ours, not in this
   repo) global form-field defaults, which aren't scoped away above. It's
   deliberately narrow: no fieldset here, since MUI's own outlined-variant
   border IS a fieldset border (the "notched outline") — zeroing that would
   break MUI's own look, not just Divi's leak. If Divi core is still
   visibly leaking through after this, that needs a wider net here — check
   the live site first. */
[data-powerout-widget] input,
[data-powerout-widget] select,
[data-powerout-widget] textarea,
[data-powerout-widget] input:focus,
[data-powerout-widget] select:focus,
[data-powerout-widget] textarea:focus {
    background: transparent !important;
    border: 0 !important;
    color: inherit !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Same problem, different tag: Divi core's global typography defaults (e.g.
   "#left-area ul, .entry-content ul, .et-l--body ul { list-style-type: disc;
   padding: 0 0 23px 1em; line-height: 26px; }") use an ID in the selector,
   so they out-specificity the widget's own MUI list styles no matter what
   class/attribute selector we throw at them here — same reason the input
   fix above needs !important instead of relying on specificity.
   Only list-style/padding/line-height are reset (not margin, font, etc.)
   because those are the exact properties Divi's core rules set; MUI's own
   List/Menu/Autocomplete components apply their own padding via ordinary
   (non-!important) class rules, so this WILL zero those out too — if a
   dropdown/menu inside the widget looks cramped after this, that's why;
   check the live site and narrow this rule rather than widening it. */
[data-powerout-widget] ul,
[data-powerout-widget] ol,
[data-powerout-widget] li {
    list-style: none !important;
    padding: 0 !important;
    line-height: unset !important;
}

/* Divi core also sets padding-bottom on <p> as part of the same global
   content-area typography defaults — unset it specifically rather than
   `all: unset` (which also killed display/color/font on paragraphs, see
   git history) so MUI's own paragraph styling stays intact. */
[data-powerout-widget] p {
    padding-bottom: unset !important;
}
