/* ═══════════════════════════════════════════════════════════
   Universal
   ═══════════════════════════════════════════════════════════ */

/* ---------- 1 · Constrain any profile/photo preview ---------- */
.form-photo-frame,
#profileImage,
.job-photo-preview {
    display: block;
    width: 140px !important;              
    height: 140px;
    max-width: 140px;
    max-height: 140px !important;
    border-radius: 14px;
    object-fit: cover;           
    object-position: center;
    background: #f7f9fc;
    border: 2px dashed #cfd6e6;
    overflow: hidden;
}

.form-photo-frame {
    position: relative;
    padding: 0;
}

.form-photo-frame img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: 12px;
}

/* Once an image is chosen, solid border instead of dashed */
.job-photo-preview.has-image,
.form-photo-frame:has(img[src]:not([src*="default-profile"])) {
    border-style: solid;
    border-color: #4e73df;
}

/* ---------- 2 · Disabled submit-button state ---------- */
form[data-ajax-form] button[type="submit"]:disabled,
form[data-ajax-form] button[type="submit"].is-submitting {
    opacity: .7;
    cursor: not-allowed !important;
    pointer-events: none;
    transform: none !important;
    box-shadow: none !important;
    position: relative;
}

/* spinner shown while the request is in flight */
form[data-ajax-form] button[type="submit"].is-submitting::before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 8px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: formSpin .7s linear infinite;
    vertical-align: -2px;
}

@keyframes formSpin {
    to { transform: rotate(360deg); }
}

/* keep the arrow icon from shifting when the spinner appears */
form[data-ajax-form] button[type="submit"].is-submitting > i {
    display: none;
}