/**
 * April Leads — the small amount of CSS the plugin needs of its own.
 *
 * Deliberately minimal: the form reproduces Contact Form 7's class names, so the theme's
 * own stylesheet does all the visual work. Only behaviour the theme has no rules for
 * lives here.
 */

/* Honeypot. Must be invisible to people but still present and fillable by bots.
   `display:none` is avoided on purpose — some bots skip display:none fields, and those
   bots are exactly the population this is meant to catch.
   Clipped in place rather than pushed off-canvas with left:-9999px: the site is RTL, and
   an element parked beyond the left edge can extend the scrollable area and reintroduce
   the horizontal scroll on mobile that the theme went to some trouble to eliminate.
   Clipping keeps it at 1x1 inside the layout, where it cannot affect scroll width. */
.april-leads .al-hp {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

/* Inline response message. The theme already styles div.wpcf7-response-output, which this
   also carries, so this only adds the colours for the two states. */
.april-leads .al-response {
    display: none;
    margin-top: 14px;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 16px;
    line-height: 1.5;
}
.april-leads .al-response.al-success {
    border: 1px solid #b7dfc2;
    background: #f2fbf5;
    color: #1a7f37;
}
.april-leads .al-response.al-error {
    border: 1px solid #f0c2c2;
    background: #fdf5f5;
    color: #b32d2e;
}

/* Branch field. The theme draws a white "בחר סניף" overlay (.select-label) over the
   whole <select> and only ever removed it for Contact Form 7's field, so on this form it
   stayed on top of the visitor's choice. april-leads.js marks the wrap once a branch is
   chosen; hiding the overlay then reveals the real select with its value.
   !important because the theme's own rule is as specific as this one
   (`.product-form .product-form-row .select-wrap .select-label`) and stylesheet order
   between a plugin and a theme is not something to rely on. */
.april-leads .select-wrap.al-has-value .select-label {
    display: none !important;
}

/* "You must choose" is drawn on the overlay because the overlay is the only part of the
   field the visitor can see — the select's own red border sits underneath it. The ring
   is a box-shadow on the overlay: it is inset 1px from the field, so a 1px outer shadow
   lands exactly on the field's border, whatever colour the theme gave that border. */
.april-leads .select-wrap.al-branch-invalid .select-label {
    color: #b32d2e !important;
    box-shadow: 0 0 0 1px #b32d2e;
}

/* The branch field shares a flex row with the phone field. When the phone shows its
   "נא למלא טלפון" tip that column gets taller, the row stretches the branch wrap to
   match, and the overlay — sized to the wrap — became a tall red box. Pinning the wrap
   to its own height changes nothing when both fields are the usual 40px. */
.april-leads .select-wrap {
    align-self: flex-start;
}

/* Field-level errors. The tip itself reuses the theme's .wpcf7-not-valid-tip styling. */
.april-leads .al-invalid {
    border-color: #b32d2e !important;
}
.april-leads .al-field-error {
    display: block;
}

/* Submit button while the request is in flight — prevents a double submission creating
   two leads, and shows the visitor that something is happening. */
.april-leads .al-busy,
.april-leads input[type="submit"]:disabled {
    opacity: .6;
    cursor: progress;
}
