/*
 * Helpy Projects — Project Form Redesign
 * Version: 1.20c
 * Brand colour: #6f2dbd
 *
 * ROLLBACK: comment out the block in Enqueue.php that loads
 * project-form-redesign.css and project-form-patch-c.js
 */

/* Anti-FOUC: guard set in wp_head is overridden as soon as this file loads */
.helpy-project-form-page {
    visibility: visible !important;
}

/* ─── 1. Page header — show title, hide subtitle ──────────── */

/* Show the title so user knows where they are */
.helpy-project-form-page .helpy-project-form-head {
    display: block !important;
    max-width: 760px;
    margin: 0 auto 12px;
}

@media (min-width: 992px) {
    .helpy-project-form-page .helpy-project-form-head {
        display: block !important;
    }
}

/* Hide only the subtitle below the title */
.helpy-project-form-page .helpy-project-form-subtitle {
    display: none !important;
}

/* ─── 2. Form card ───────────────────────────────────────── */

.helpy-project-form-page .helpy-project-form-card {
    border: 1px solid #e4e1ea;
    border-radius: 16px;
    box-shadow: none;
    padding: 32px 36px 28px;
}

@media (min-width: 992px) {
    .helpy-project-form-page .helpy-project-form-card--smart {
        padding: 32px 36px 28px !important;
    }
}

/* ─── 3. Progress steps — 5 nodes in one row ─────────────── */

.helpy-project-form-page .helpy-project-form-progress {
    border: none;
    background: transparent;
    box-shadow: none;
    padding: 0 4px;
    margin-bottom: 24px;
    max-width: 760px;
}

/* Override hard-coded repeat(4) from project-form.css */
.helpy-project-form-page .helpy-project-form-progress__steps {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 4px;
}

.helpy-project-form-page .helpy-project-form-progress__track {
    left: 32px;
    right: 32px;
    top: 13px;
    height: 1px;
    border-radius: 1px;
    background: #e0dcea;
}

/* completed segment */
.helpy-project-form-page .helpy-project-form-progress__track span {
    background: #6f2dbd;
}

/* circle */
.helpy-project-form-page .helpy-project-form-progress__steps span {
    width: 24px;
    height: 24px;
    font-size: 11px;
    font-weight: 500;
    border: 1px solid #d8d4e4;
    background: #ffffff;
    color: #8a8499;
    box-shadow: none;
}

/* step label */
.helpy-project-form-page .helpy-project-form-progress__steps li {
    font-size: 10px;
    font-weight: 500;
    color: #a09aad;
    gap: 4px;
}

/* active / complete circle */
.helpy-project-form-page .helpy-project-form-progress__steps li.is-active span,
.helpy-project-form-page .helpy-project-form-progress__steps li.is-complete span {
    border-color: #6f2dbd;
    background: #6f2dbd;
    color: #ffffff;
    box-shadow: none;
}

/* active / complete label */
.helpy-project-form-page .helpy-project-form-progress__steps li.is-active,
.helpy-project-form-page .helpy-project-form-progress__steps li.is-complete {
    color: #6f2dbd;
}

.helpy-project-form-page .helpy-project-form-progress__steps strong {
    font-size: 12px;
    font-weight: 500;
}

@media (max-width: 767.98px) {
    .helpy-project-form-page .helpy-project-form-progress {
        padding: 0 4px;
        margin-bottom: 16px;
    }
    .helpy-project-form-page .helpy-project-form-progress__track {
        left: 22px;
        right: 22px;
    }
}

/* ─── 4. Section header ──────────────────────────────────── */

.helpy-project-form-page .helpy-project-form-section__eyebrow {
    background: #f3eaff;
    color: #6f2dbd;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.06em;
    padding: 3px 9px;
    border-radius: 999px;
}

.helpy-project-form-page .helpy-project-form-section__head h3 {
    font-size: 20px;
    font-weight: 700;
    color: #1a1730;
    margin-top: 4px;
}

.helpy-project-form-page .helpy-project-form-section__head p {
    font-size: 13px;
    color: #7a7490;
    line-height: 1.5;
}

/* ─── 5. Popular service chips (Step 1) ──────────────────── */

.helpy-project-form-page .helpy-popular-services__title {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: #9e98ae;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.helpy-project-form-page .helpy-popular-services__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.helpy-project-form-page .helpy-popular-service {
    min-height: 44px;
    padding: 10px 14px;
    border-radius: 999px;
    border: 1px solid #ddd9e8;
    background: #ffffff;
    color: #4a4560;
    font-size: 13px;
    font-weight: 500;
    gap: 7px;
    box-shadow: none;
    justify-content: center;
    transition: border-color 0.14s, background-color 0.14s, color 0.14s;
}

.helpy-project-form-page .helpy-popular-service:hover,
.helpy-project-form-page .helpy-popular-service:focus {
    border-color: #b388e8;
    background: #f3eaff;
    color: #6f2dbd;
    transform: none;
    box-shadow: none;
    outline: none;
}

.helpy-project-form-page .helpy-popular-service.is-selected {
    border-color: #6f2dbd;
    background: #6f2dbd;
    color: #ffffff;
    box-shadow: none;
}

.helpy-project-form-page .helpy-popular-service__dot {
    display: none;
}

@media (max-width: 767.98px) {
    .helpy-project-form-page .helpy-popular-services__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }
    .helpy-project-form-page .helpy-popular-service {
        font-size: 13px;
        min-height: 42px;
        justify-content: center;
    }
}

/* ─── 6. Separator ───────────────────────────────────────── */

.helpy-project-form-page .helpy-project-form-separator {
    margin: 8px 0 18px;
    color: #a09aad;
    font-size: 12px;
    font-weight: 500;
    gap: 12px;
}

.helpy-project-form-page .helpy-project-form-separator span {
    background: #ede9f4;
    height: 1px;
}

/* ─── 7. Service select ──────────────────────────────────── */

.helpy-project-form-page .helpy-project-form-control--select {
    border-radius: 10px;
    border-color: #ddd9e8;
    font-size: 13px;
    color: #2e2a40;
}

.helpy-project-form-page .helpy-project-form-control--select:focus {
    border-color: #6f2dbd;
    box-shadow: 0 0 0 3px rgba(111, 45, 189, 0.10);
    outline: none;
}

/* ─── 8. Smart question groups — NO card boxes ───────────── */

/* Remove the card-style wrapper from each question group */
.helpy-project-form-page .helpy-project-smart-field {
    border: none;
    background: transparent;
    border-radius: 0;
    padding: 0;
}

/* Thin divider between groups instead */
.helpy-project-form-page .helpy-project-smart-field + .helpy-project-smart-field {
    border-top: 1px solid #f0ecf8;
    padding-top: 16px;
    margin-top: 4px;
}

/* ─── 9. Choice chips (Step 2 smart questions) ───────────── */

.helpy-project-form-page .helpy-choice-chip span {
    font-size: 13px;
    font-weight: 500;
    border-radius: 999px;
    border-color: #ddd9e8;
    color: #4a4560;
    box-shadow: none;
    min-height: 34px;
    padding: 6px 14px;
}

.helpy-project-form-page .helpy-choice-chip:hover span {
    border-color: #b388e8;
    background: #f3eaff;
    color: #6f2dbd;
}

.helpy-project-form-page .helpy-choice-chip.is-selected span,
.helpy-project-form-page .helpy-choice-chip input:checked + span {
    border-color: #6f2dbd;
    background: #6f2dbd;
    color: #ffffff;
    box-shadow: none;
}

/* Question group label */
.helpy-project-form-page [data-helpy-smart-label],
.helpy-project-form-page .helpy-project-form-label[data-helpy-smart-label] {
    font-size: 13px;
    font-weight: 500;
    color: #2e2a40;
    margin-bottom: 8px;
}

/* ─── 10. Form labels & help ─────────────────────────────── */

.helpy-project-form-page .helpy-project-form-label {
    font-size: 13px;
    font-weight: 600;
    color: #2e2a40;
}

.helpy-project-form-page .helpy-project-form-help {
    font-size: 12px;
    color: #9491a1;
}

/* Hide the "Minimum N characters" hint line — counter handles it */
.helpy-project-form-page .helpy-project-form-counter__hint {
    display: none;
}

/* Counter row: align right only */
.helpy-project-form-page .helpy-project-form-counter {
    justify-content: flex-end;
}

/* ─── 11. Text inputs & textarea ─────────────────────────── */

.helpy-project-form-page .helpy-project-form-control:focus {
    border-color: #6f2dbd;
    box-shadow: 0 0 0 3px rgba(111, 45, 189, 0.10);
    outline: none;
}

/* ─── 12. AI helper banner (hidden when inline triggers active) */

.helpy-project-form-page .helpy-project-form .helpy-project-ai-helper {
    position: static;
    z-index: auto;
    box-shadow: none;
    margin: 0 auto 14px;
}

.helpy-project-form-page .helpy-project-form-card--smart > .helpy-project-ai-helper {
    margin: 20px 0 0 !important;
    padding: 14px 18px;
    background: #f3eaff;
    border: 1px solid #c9a0e8;
    border-radius: 12px;
    box-shadow: none !important;
}

.helpy-project-form-page .helpy-project-form-card--smart > .helpy-project-ai-helper .helpy-project-ai-helper__body strong {
    font-size: 13px;
    font-weight: 600;
    color: #4a1a7a;
}

.helpy-project-form-page .helpy-project-form-card--smart > .helpy-project-ai-helper .helpy-project-ai-helper__body span {
    font-size: 12px;
    color: #6b4e8c;
}

.helpy-project-form-page .helpy-project-form-card--smart > .helpy-project-ai-helper .helpybot-panel__button,
.helpy-project-form-page .helpy-project-form-card--smart > .helpy-project-ai-helper .helpy-project-ai-helper__button {
    min-height: 36px;
    padding: 0 16px;
    border-radius: 999px;
    font-size: 13px;
    background: #6f2dbd;
    box-shadow: none;
    border: none;
    color: #ffffff;
}

.helpy-project-form-page .helpy-project-form-card--smart > .helpy-project-ai-helper .helpybot-panel__button:hover,
.helpy-project-form-page .helpy-project-form-card--smart > .helpy-project-ai-helper .helpy-project-ai-helper__button:hover {
    background: #5a2298;
}

/* hidden when inline triggers are injected */
.helpy-project-form-page .helpy-project-form-card--smart.has-inline-ai > .helpy-project-ai-helper {
    display: none;
}

@media (max-width: 767.98px) {
    .helpy-project-form-page .helpy-project-form-card--smart > .helpy-project-ai-helper {
        flex-direction: column;
        align-items: flex-start;
    }
    .helpy-project-form-page .helpy-project-form-card--smart > .helpy-project-ai-helper .helpy-project-ai-helper__actions {
        width: 100%;
        margin-left: 0;
    }
    .helpy-project-form-page .helpy-project-form-card--smart > .helpy-project-ai-helper .helpybot-panel__button,
    .helpy-project-form-page .helpy-project-form-card--smart > .helpy-project-ai-helper .helpy-project-ai-helper__button {
        width: 100%;
        justify-content: center;
    }
}

/* ─── 13. Wizard nav (Back / Continue) ───────────────────── */

.helpy-project-form-page .helpy-project-form-card--smart .helpy-project-wizard-nav {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #ede9f4;
}

.helpy-project-form-page .helpy-project-form-card--smart .helpy-project-wizard-back {
    min-height: 44px;
    padding: 0 20px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    background: #ffffff;
    border: 1px solid #d9d4ea;
    color: #6f2dbd;
    box-shadow: none;
}

.helpy-project-form-page .helpy-project-form-card--smart .helpy-project-wizard-back:hover,
.helpy-project-form-page .helpy-project-form-card--smart .helpy-project-wizard-back:focus {
    background: #f3eaff;
    border-color: #b388e8;
    color: #5a2298;
    transform: none;
    box-shadow: none;
}

.helpy-project-form-page .helpy-project-form-card--smart .helpy-project-wizard-continue,
.helpy-project-form-page .helpy-project-form-card--smart .helpy-project-form-submit[data-helpy-wizard-submit] {
    min-height: 44px;
    padding: 0 22px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    background: #6f2dbd;
    border-color: #6f2dbd;
    color: #ffffff;
    box-shadow: none;
}

.helpy-project-form-page .helpy-project-form-card--smart .helpy-project-wizard-continue:hover,
.helpy-project-form-page .helpy-project-form-card--smart .helpy-project-form-submit[data-helpy-wizard-submit]:hover {
    background: #5a2298;
    border-color: #5a2298;
    transform: none;
    box-shadow: none;
}

/* ─── 14. Inline AI trigger button ──────────────────────── */

/* Sits inline with the counter row, right-aligned */
.helpy-project-form-page .hpf-counter-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 4px;
}

.helpy-project-form-page .hpf-ai-trigger-wrap {
    display: flex;
    justify-content: flex-end;
    margin-top: 4px;
}

/* When counter row wraps the trigger, no extra margin needed */
.helpy-project-form-page .hpf-counter-row .hpf-ai-trigger-wrap {
    margin-top: 0;
}

.helpy-project-form-page .hpf-ai-trigger {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border: 1px solid #c9a0e8;
    border-radius: 999px;
    background: #f3eaff;
    color: #6f2dbd;
    font-size: 11px;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    line-height: 1.5;
    transition: background 0.13s, border-color 0.13s, color 0.13s;
    white-space: nowrap;
}

.helpy-project-form-page .hpf-ai-trigger:hover {
    background: #e6d0f8;
    border-color: #a06cc8;
    color: #5a2298;
}

.helpy-project-form-page .hpf-ai-trigger:active {
    transform: scale(0.97);
}

/* ─── 15. Photo thumbnails ───────────────────────────────── */

.helpy-project-form-page .hpf-thumb-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.helpy-project-form-page .hpf-thumb {
    position: relative;
    width: 72px;
    height: 72px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #ddd9e8;
    background: #f5f3fb;
    flex-shrink: 0;
}

.helpy-project-form-page .hpf-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.helpy-project-form-page .hpf-thumb__remove {
    position: absolute;
    top: 3px;
    right: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(26, 23, 48, 0.72);
    color: #fff;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    padding: 0;
    opacity: 0;
    transition: opacity 0.13s;
}

.helpy-project-form-page .hpf-thumb:hover .hpf-thumb__remove {
    opacity: 1;
}

.helpy-project-form-page .hpf-thumb__name {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 2px 4px;
    background: rgba(26, 23, 48, 0.55);
    color: #fff;
    font-size: 9px;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.helpy-project-form-page .hpf-thumb--file {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    background: #f0eafd;
}

.helpy-project-form-page .hpf-thumb--file .hpf-thumb__file-icon {
    font-size: 24px;
    line-height: 1;
    color: #6f2dbd;
}

.helpy-project-form-page .hpf-thumb--file .hpf-thumb__name {
    position: static;
    background: none;
    color: #6f2dbd;
    font-size: 9px;
    text-align: center;
    padding: 0 4px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.helpy-project-form-page .hpf-has-files .helpy-project-form-upload__hint strong {
    display: none;
}

.helpy-project-form-page .hpf-has-files .helpy-project-form-upload__hint > span:first-of-type {
    display: none;
}

.helpy-project-form-page .helpy-project-form-upload {
    transition: border-color 0.13s;
}

.helpy-project-form-page .hpf-has-files .helpy-project-form-upload {
    padding: 10px 14px;
    border-style: dashed;
}

@media (max-width: 767.98px) {
    .helpy-project-form-page .helpy-project-form-card {
        padding: 20px 18px 18px;
    }
    .helpy-project-form-page .hpf-thumb {
        width: 60px;
        height: 60px;
    }
    .helpy-project-form-page .hpf-thumb__remove {
        opacity: 1;
    }
}

/* ─── v1.15c additions ───────────────────────────────────── */

/* Hide "No files selected" — empty zone speaks for itself */
.helpy-project-form-page .helpy-project-form-upload__count:empty,
.helpy-project-form-page .helpy-project-form-upload__count {
    display: none;
}
/* Show count only when files are selected (JS adds hpf-has-files) */
.helpy-project-form-page .hpf-has-files .helpy-project-form-upload__count {
    display: block;
}

/* Materials field: hidden by default, shown by JS for relevant categories */
.helpy-project-form-page .hpf-materials-field[hidden] {
    display: none !important;
}
.helpy-project-form-page .hpf-materials-field {
    display: block;
}

/* "Short and specific" help text under title — removed from PHP,
   but guard against it appearing if old template is cached */
.helpy-project-form-page .helpy-project-form-section--details
    .helpy-project-form-field:first-of-type
    .helpy-project-form-help {
    display: none;
}

/* ─── v1.16c additions ───────────────────────────────────── */

/* Fix yellow focus border on postal code (browser/theme override) */
.helpy-project-form-page #helpy_project_postal_code:focus,
.helpy-project-form-page #helpy_project_postal_code:focus-visible {
    border-color: #6f2dbd !important;
    box-shadow: 0 0 0 3px rgba(111, 45, 189, 0.10) !important;
    outline: none !important;
}

/* (optional) label — force brand-neutral grey, override WC/theme orange */
.helpy-project-form-page .helpy-project-form-label__muted {
    color: #9491a1 !important;
    font-weight: 400;
}

/* Location grid: equalise row height so postal + property type align */
.helpy-project-form-page .helpy-project-form-grid--compact {
    align-items: start;
}

/* Postal help text: keep one line, don't push property-type field down */
.helpy-project-form-page #helpy_project_postal_feedback {
    font-size: 11px;
    margin-top: 3px;
    min-height: 0;
    line-height: 1.3;
}

/* ─── v1.18c: Step 5 Review section ─────────────────────── */

/* Review sections container */
.helpy-project-form-page .hpf-review-sections {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.helpy-project-form-page .hpf-review-section {
    padding: 16px 0;
    border-bottom: 1px solid #f0ecf8;
}

.helpy-project-form-page .hpf-review-section:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.helpy-project-form-page .hpf-review-section__title {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #9491a1;
    margin-bottom: 10px;
}

/* Individual review row */
.helpy-project-form-page .hpf-review-row {
    display: grid;
    grid-template-columns: 120px 1fr auto;
    align-items: baseline;
    gap: 8px 12px;
    padding: 5px 0;
}

.helpy-project-form-page .hpf-review-row__label {
    font-size: 13px;
    color: #9491a1;
    font-weight: 400;
    white-space: nowrap;
}

.helpy-project-form-page .hpf-review-row__value {
    font-size: 13px;
    color: #1a1730;
    font-weight: 500;
    line-height: 1.4;
}

.helpy-project-form-page .hpf-review-row__value--desc {
    font-weight: 400;
    color: #4a4560;
    line-height: 1.55;
    white-space: pre-wrap;
    word-break: break-word;
}

/* Edit button */
.helpy-project-form-page .hpf-review-edit {
    font-size: 12px;
    font-weight: 500;
    color: #6f2dbd;
    background: none;
    border: none;
    cursor: pointer;
    padding: 2px 0;
    font-family: inherit;
    white-space: nowrap;
    text-decoration: underline;
    text-underline-offset: 2px;
    opacity: 0.7;
    transition: opacity 0.12s;
}

.helpy-project-form-page .hpf-review-edit:hover {
    opacity: 1;
}

/* Active step circle: outline only (distinct from completed) */
.helpy-project-form-page .helpy-project-form-progress__steps li.is-active span {
    background: #ffffff;
    border: 2px solid #6f2dbd;
    color: #6f2dbd;
    box-shadow: none;
    width: 24px;
    height: 24px;
}

/* Completed step circle: filled */
.helpy-project-form-page .helpy-project-form-progress__steps li.is-complete span {
    background: #6f2dbd;
    border-color: #6f2dbd;
    color: #ffffff;
}

@media (max-width: 767.98px) {
    .helpy-project-form-page .hpf-review-row {
        grid-template-columns: 100px 1fr auto;
        gap: 6px 8px;
    }
    .helpy-project-form-page .helpy-project-form-progress__track {
        left: 22px;
        right: 22px;
    }
}

/* ─── v1.21c: Details-first Step 2 ─────────────────────── */

.helpy-project-form-page .hpf-details-first .helpy-project-form-section__head {
    margin-bottom: 18px;
}

.helpy-project-form-page .hpf-details-primary {
    margin-bottom: 12px;
}

.helpy-project-form-page .hpf-details-textarea {
    min-height: 104px;
    resize: none;
    overflow: hidden;
    line-height: 1.55;
}

.helpy-project-form-page .hpf-title-suggestion {
    margin: 12px 0 14px;
    padding: 12px 14px;
    border: 1px solid #ede9f4;
    border-radius: 14px;
    background: #fbfaff;
}

.helpy-project-form-page .hpf-title-suggestion__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.helpy-project-form-page .hpf-title-suggestion__head > span {
    color: #8f889f;
    font-size: 12px;
    line-height: 1.35;
    text-align: right;
}

.helpy-project-form-page .hpf-title-input {
    min-height: 42px;
    border-radius: 10px;
    background: #fff;
}

.helpy-project-form-page .hpf-smart-suggestions {
    margin: 12px 0 4px;
}

.helpy-project-form-page .hpf-smart-suggestions .helpy-smart-questions__empty {
    padding: 10px 12px;
    border-radius: 12px;
    background: #fbfaff;
    border-color: #ede9f4;
    color: #8f889f;
    font-size: 12px;
}

.helpy-project-form-page .hpf-smart-suggestions .helpy-smart-questions__body {
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid #ede9f4;
    border-radius: 14px;
    background: #fbfaff;
}

.helpy-project-form-page .hpf-smart-suggestions__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 2px;
}

.helpy-project-form-page .hpf-smart-suggestions__head strong {
    font-size: 13px;
    font-weight: 700;
    color: #2e2a40;
}

.helpy-project-form-page .hpf-smart-suggestions__head span {
    font-size: 12px;
    color: #8f889f;
}

.helpy-project-form-page .hpf-smart-inline-field {
    display: grid;
    grid-template-columns: 86px 1fr;
    align-items: center;
    gap: 8px 12px;
    margin: 0;
}

.helpy-project-form-page .hpf-smart-inline-field + .hpf-smart-inline-field {
    border-top: 1px solid #f0ecf8;
    padding-top: 10px;
    margin-top: 0;
}

.helpy-project-form-page .hpf-smart-inline-field [data-helpy-smart-label] {
    margin: 0;
    color: #817a93;
    font-size: 12px;
    font-weight: 600;
}

.helpy-project-form-page .hpf-choice-grid-inline {
    margin-top: 0;
    gap: 6px;
}

.helpy-project-form-page .hpf-choice-grid-inline .helpy-choice-chip span {
    min-height: 30px;
    padding: 5px 11px;
    font-size: 12px;
}

.helpy-project-form-page .hpf-attachments-accordion {
    margin-top: 14px;
    border-top: 1px solid #ede9f4;
    padding-top: 12px;
}

.helpy-project-form-page .hpf-attachments-accordion summary {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid #d9d4ea;
    border-radius: 999px;
    background: #ffffff;
    color: #6f2dbd;
    font-size: 13px;
    font-weight: 600;
    user-select: none;
}

.helpy-project-form-page .hpf-attachments-accordion summary::-webkit-details-marker {
    display: none;
}

.helpy-project-form-page .hpf-attachments-accordion summary::before {
    content: '+';
    display: inline-flex;
    width: 16px;
    height: 16px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #f3eaff;
    color: #6f2dbd;
    font-weight: 700;
    line-height: 1;
}

.helpy-project-form-page .hpf-attachments-accordion[open] summary::before {
    content: '−';
}

.helpy-project-form-page .hpf-attachments-accordion summary small {
    color: #9a94aa;
    font-size: 12px;
    font-weight: 500;
}

.helpy-project-form-page .hpf-attachments-accordion__body {
    margin-top: 12px;
}

.helpy-project-form-page .hpf-attachments-accordion .helpy-project-form-upload {
    min-height: 74px;
}

@media (max-width: 767.98px) {
    .helpy-project-form-page .hpf-title-suggestion__head,
    .helpy-project-form-page .hpf-smart-suggestions__head {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
    }

    .helpy-project-form-page .hpf-title-suggestion__head > span,
    .helpy-project-form-page .hpf-smart-suggestions__head span {
        text-align: left;
    }

    .helpy-project-form-page .hpf-smart-inline-field {
        grid-template-columns: 1fr;
        align-items: start;
        gap: 6px;
    }

    .helpy-project-form-page .hpf-choice-grid-inline .helpy-choice-chip span {
        font-size: 12px;
    }
}

/* ─────────────────────────────────────────────────────────
   v1.21c — Edit-mode overrides (no wizard, accordion view)
   + My Projects page-head layout (Create btn right-top)
   ───────────────────────────────────────────────────────── */

/* ── My Projects page header — Create button on the right ── */

.helpy-projects-page-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.helpy-projects-page-head .helpy-projects-page-title {
    margin: 0;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    color: #1a1730;
}

.helpy-projects-page-head .helpy-projects-create-btn {
    flex-shrink: 0;
}

/* hide legacy toolbar wrapper if any old cache survives */
.helpy-projects-toolbar:empty {
    display: none;
}

/* ── EDIT MODE: hide wizard chrome, show all sections ─── */

/* 1. Hide progress bar in Edit mode */
.helpy-project-form-page--edit .helpy-project-form-progress {
    display: none !important;
}

/* 2. Hide eyebrow ("Step 1", "Step 2" etc.) in Edit mode */
.helpy-project-form-page--edit .helpy-project-form-section__eyebrow {
    display: none !important;
}

/* 3. Show ALL sections at once (override [hidden] attribute) */
.helpy-project-form-page--edit .helpy-project-form-section[hidden] {
    display: block !important;
}

.helpy-project-form-page--edit .helpy-project-form-section + .helpy-project-form-section {
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid #ede9f4;
}

/* 4. Hide review step in Edit mode (it's wizard-only) */
.helpy-project-form-page--edit .helpy-project-form-section--hpf-review {
    display: none !important;
}

/* 5. Hide Back / Continue buttons — only Save Changes remains */
.helpy-project-form-page--edit .helpy-project-wizard-back,
.helpy-project-form-page--edit .helpy-project-wizard-continue {
    display: none !important;
}

/* Save Changes button always visible in Edit mode */
.helpy-project-form-page--edit .helpy-project-form-submit[data-helpy-wizard-submit] {
    display: inline-flex !important;
}

/* 6. Restyle Step section heads for accordion look */
.helpy-project-form-page--edit .helpy-project-form-section__head h3 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 4px;
}

.helpy-project-form-page--edit .helpy-project-form-section__head p {
    font-size: 13px;
    color: #7a7490;
    margin-bottom: 16px;
}

/* 7. "Current attachments" block — restyle to look integrated */
.helpy-project-form-page--edit .helpy-project-edit-current {
    margin-bottom: 16px;
    background: #faf9fd;
    border: 1px solid #ede9f4;
    box-shadow: none;
}

.helpy-project-form-page--edit .helpy-project-edit-current__hint {
    font-size: 11px;
    color: #9491a1;
    margin-top: 12px;
}

/* 8. Wizard nav footer in Edit: remove top border duplication */
.helpy-project-form-page--edit .helpy-project-form-card--smart .helpy-project-wizard-nav {
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid #ede9f4;
    justify-content: flex-end;
}

/* 9. Hide breadcrumb arrow (back arrow conflicts with breadcrumb text) */
.helpy-project-form-page--edit .helpy-project-form-crumb__icon {
    display: none;
}

.helpy-project-form-page--edit .helpy-project-form-crumb__pipe {
    display: none;
}

.helpy-project-form-page--edit .helpy-project-form-crumb {
    font-size: 13px;
    color: #6f2dbd;
}

/* 10. Subtitle in Edit head is useful — show it (counter to global rule) */
.helpy-project-form-page--edit .helpy-project-form-subtitle {
    display: block !important;
    font-size: 13px;
    color: #7a7490;
    margin-top: 4px;
}

/* 11. "I'm not sure yet" budget — disable inputs visually when checked */
.helpy-project-form-page .helpy-project-form-check--budget-unknown input:checked ~ ~ .helpy-project-budget__range,
.helpy-project-form-page [data-helpy-budget-group]:has(input[name="helpy_project_budget_unknown"]:checked) .helpy-project-budget__range {
    opacity: 0.45;
    pointer-events: none;
}

@media (max-width: 767.98px) {
    .helpy-projects-page-head {
        align-items: flex-start;
    }
    .helpy-projects-page-head .helpy-projects-create-btn {
        align-self: stretch;
        justify-content: center;
    }
}

/* ─────────────────────────────────────────────────────────
   v1.22c — Step 5 final action buttons + draft banner
   ───────────────────────────────────────────────────────── */

/* Container for three action buttons — row on desktop, column on mobile */
.helpy-project-form-page .hpf-final-actions {
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #ede9f4;
}

/* Each final-action button: equal flex width, two-line (label + hint) */
.helpy-project-form-page .hpf-final-btn {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
    flex: 1 1 0;
    min-width: 0;
    padding: 12px 16px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background 0.13s, border-color 0.13s, transform 0.1s;
    line-height: 1.3;
    text-align: left;
    min-height: 56px;
}

.helpy-project-form-page .hpf-final-btn:active {
    transform: scale(0.99);
}

.helpy-project-form-page .hpf-final-btn:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.helpy-project-form-page .hpf-final-btn.is-loading {
    position: relative;
    opacity: 0.8;
}

.helpy-project-form-page .hpf-final-btn.is-loading::after {
    content: '';
    position: absolute;
    right: 10px;
    top: 10px;
    width: 12px; height: 12px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: hpf-spin 0.8s linear infinite;
}

@keyframes hpf-spin {
    to { transform: rotate(360deg); }
}

.helpy-project-form-page .hpf-final-btn__hint {
    font-size: 11px;
    font-weight: 400;
    opacity: 0.8;
    line-height: 1.35;
}

/* Variants */
.helpy-project-form-page .hpf-final-btn--primary {
    background: #6f2dbd;
    color: #fff;
    border-color: #6f2dbd;
}
.helpy-project-form-page .hpf-final-btn--primary:hover {
    background: #5a2298;
    border-color: #5a2298;
}

.helpy-project-form-page .hpf-final-btn--secondary {
    background: #fff;
    color: #6f2dbd;
    border-color: #cfc9f0;
}
.helpy-project-form-page .hpf-final-btn--secondary:hover {
    background: #f3eaff;
    border-color: #b388e8;
}

.helpy-project-form-page .hpf-final-btn--ghost {
    background: transparent;
    color: #4a4560;
    border-color: #ede9f4;
}
.helpy-project-form-page .hpf-final-btn--ghost:hover {
    background: #faf9fd;
    border-color: #ddd9e8;
}

/* On Step 5: hide the "Back / Continue" wizard nav row entirely
   — the three final buttons are inside the section now, Back is its own.
   Keep the wizard-back so user can go back to Step 4.                    */
.helpy-project-form-page [data-helpy-wizard-section="hpf_review"]:not([hidden])
    ~ .helpy-project-wizard-nav .helpy-project-wizard-continue,
.helpy-project-form-page [data-helpy-wizard-section="hpf_review"]:not([hidden])
    ~ .helpy-project-wizard-nav [data-helpy-wizard-submit] {
    display: none !important;
}

/* ─── Draft restore banner ──────────────────────────── */

.helpy-project-form-page .hpf-draft-banner {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    margin: 0 0 14px;
    background: #f3eaff;
    border: 1px solid #cfc9f0;
    border-radius: 10px;
    font-size: 13px;
    color: #4a1a7a;
}

.helpy-project-form-page .hpf-draft-banner__icon {
    font-size: 15px;
    color: #6f2dbd;
    flex-shrink: 0;
}

.helpy-project-form-page .hpf-draft-banner__text {
    flex: 1;
    line-height: 1.4;
}

.helpy-project-form-page .hpf-draft-banner__btn {
    height: 30px;
    padding: 0 12px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    border: 1px solid #cfc9f0;
    background: #fff;
    color: #6f2dbd;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.13s;
}

.helpy-project-form-page .hpf-draft-banner__btn:hover {
    background: #e6d0f8;
}

.helpy-project-form-page .hpf-draft-banner__btn--primary {
    background: #6f2dbd;
    color: #fff;
    border-color: #6f2dbd;
}

.helpy-project-form-page .hpf-draft-banner__btn--primary:hover {
    background: #5a2298;
    border-color: #5a2298;
}

@media (max-width: 767.98px) {
    .helpy-project-form-page .hpf-draft-banner {
        flex-wrap: wrap;
    }
    .helpy-project-form-page .hpf-draft-banner__text {
        flex: 1 1 100%;
    }

    /* Stack final action buttons vertically on mobile */
    .helpy-project-form-page .hpf-final-actions {
        flex-direction: column;
    }
    .helpy-project-form-page .hpf-final-btn {
        flex: 0 0 auto;
        padding: 14px 16px;
        font-size: 14px;
        min-height: 0;
    }
    .helpy-project-form-page .hpf-final-btn__hint {
        font-size: 12px;
    }
    .helpy-project-form-page .hpf-final-btn.is-loading::after {
        right: 14px;
        top: 50%;
        width: 14px;
        height: 14px;
        animation: hpf-spin-centered 0.8s linear infinite;
    }
}

@keyframes hpf-spin-centered {
    from { transform: translateY(-50%) rotate(0deg); }
    to   { transform: translateY(-50%) rotate(360deg); }
}

/* ─── v1.27c — Submitting overlay (hides step-switch flicker) ─── */

.helpy-project-form-page .hpf-submitting-overlay {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.92);
    border-radius: 16px;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    animation: hpf-fade-in 0.15s ease-out;
}

@keyframes hpf-fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.helpy-project-form-page .hpf-submitting-overlay__spinner {
    width: 32px;
    height: 32px;
    border: 3px solid #ede9f4;
    border-top-color: #6f2dbd;
    border-radius: 50%;
    animation: hpf-spin 0.8s linear infinite;
}

.helpy-project-form-page .hpf-submitting-overlay__label {
    font-size: 14px;
    font-weight: 500;
    color: #4a4560;
}

/* ─────────────────────────────────────────────────────────
   v1.28c — Status & Workflow block in Edit form
   ───────────────────────────────────────────────────────── */

.helpy-project-form-page--edit .helpy-project-status-block {
    margin-top: 28px;
    padding: 18px 20px;
    background: #faf9fd;
    border: 1px solid #ede9f4;
    border-radius: 12px;
}

.helpy-project-form-page--edit .helpy-project-status-block__head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.helpy-project-form-page--edit .helpy-project-status-block__label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #9491a1;
}

.helpy-project-status-pill {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
}

.helpy-project-status-pill--saved {
    background: #ede9f4;
    color: #6f2dbd;
}

.helpy-project-status-pill--open {
    background: #ecfdf3;
    color: #027a48;
}

.helpy-project-form-page--edit .helpy-project-status-block__desc {
    font-size: 13px;
    color: #4a4560;
    line-height: 1.55;
    margin: 0 0 14px;
}

.helpy-project-form-page--edit .helpy-project-status-block__form {
    margin: 0;
}

.helpy-project-status-btn {
    height: 40px;
    padding: 0 18px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    font-family: inherit;
    transition: background 0.13s, border-color 0.13s, color 0.13s;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.helpy-project-status-btn--publish {
    background: #6f2dbd;
    color: #fff;
    border-color: #6f2dbd;
}

.helpy-project-status-btn--publish:hover {
    background: #5a2298;
    border-color: #5a2298;
}

.helpy-project-status-btn--move-saved {
    background: #fff;
    color: #6f2dbd;
    border-color: #cfc9f0;
}

.helpy-project-status-btn--move-saved:hover {
    background: #f3eaff;
    border-color: #b388e8;
}

/* ─── Status action confirmation modal ─── */

body.hpf-modal-open {
    overflow: hidden;
}

.hpf-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(26, 23, 48, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 20px;
    animation: hpf-modal-fade 0.15s ease-out;
}

@keyframes hpf-modal-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.hpf-modal {
    background: #fff;
    border-radius: 14px;
    max-width: 460px;
    width: 100%;
    padding: 24px;
    position: relative;
    box-shadow: 0 12px 40px rgba(26, 23, 48, 0.25);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    animation: hpf-modal-pop 0.18s ease-out;
}

@keyframes hpf-modal-pop {
    from { transform: translateY(8px); opacity: 0; }
    to   { transform: translateY(0); opacity: 1; }
}

.hpf-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: none;
    background: transparent;
    color: #9491a1;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hpf-modal__close:hover {
    background: #f5f3fb;
    color: #1a1730;
}

.hpf-modal__title {
    font-size: 18px;
    font-weight: 700;
    color: #1a1730;
    margin: 0 0 12px;
    padding-right: 30px;
    line-height: 1.3;
}

.hpf-modal__body {
    font-size: 14px;
    color: #4a4560;
    line-height: 1.55;
    margin-bottom: 18px;
}

.hpf-modal__body strong {
    color: #1a1730;
    font-weight: 600;
}

.hpf-modal__actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.hpf-modal__btn {
    height: 38px;
    padding: 0 18px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    font-family: inherit;
    transition: background 0.13s, border-color 0.13s, color 0.13s;
}

.hpf-modal__btn--secondary {
    background: #fff;
    color: #4a4560;
    border-color: #e4e1ea;
}

.hpf-modal__btn--secondary:hover {
    background: #faf9fd;
    border-color: #ddd9e8;
}

.hpf-modal__btn--primary {
    background: #6f2dbd;
    color: #fff;
    border-color: #6f2dbd;
}

.hpf-modal__btn--primary:hover {
    background: #5a2298;
    border-color: #5a2298;
}

.hpf-modal__btn:disabled {
    opacity: 0.65;
    cursor: not-allowed;
}

@media (max-width: 480px) {
    .hpf-modal {
        padding: 20px 16px;
    }
    .hpf-modal__actions {
        flex-direction: column-reverse;
    }
    .hpf-modal__btn {
        width: 100%;
    }
}

/* ─────────────────────────────────────────────────────────
   v0.3.26 — Edit form compactness + files block
   ───────────────────────────────────────────────────────── */

.helpy-project-form-page--edit .helpy-project-edit-files {
    max-width: 860px;
    margin: 0 0 14px;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid #ede9f4;
    border-radius: 14px;
    box-shadow: 0 6px 20px rgba(38, 31, 63, 0.04);
}

.helpy-project-form-page--edit .helpy-project-edit-files__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 10px;
}

.helpy-project-form-page--edit .helpy-project-edit-files__title {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: #171326;
}

.helpy-project-form-page--edit .helpy-project-edit-files__hint {
    margin: 0;
    font-size: 11px;
    line-height: 1.35;
    color: #8a849a;
    text-align: right;
}

.helpy-project-form-page--edit .helpy-project-edit-files__list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.helpy-project-form-page--edit .helpy-project-edit-files__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 42px;
    padding: 8px 10px;
    background: #faf9fd;
    border: 1px solid #f0edf7;
    border-radius: 12px;
}

.helpy-project-form-page--edit .helpy-project-edit-files__meta {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #332b4c;
}

.helpy-project-form-page--edit .helpy-project-edit-files__name {
    min-width: 0;
    max-width: 340px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
}

.helpy-project-form-page--edit .helpy-project-edit-files__type {
    flex: 0 0 auto;
    padding-left: 8px;
    color: #8a849a;
    font-size: 11px;
    text-transform: uppercase;
}

.helpy-project-form-page--edit .helpy-project-edit-files__actions {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.helpy-project-form-page--edit .helpy-project-edit-files__removeform {
    display: inline-flex;
    margin: 0;
}

.helpy-project-form-page--edit .helpy-project-edit-files .helpy-btn--sm {
    min-height: 34px;
    padding: 0 12px;
    border-radius: 10px;
}

.helpy-project-form-page--edit .helpy-project-form-card--smart {
    padding-top: 28px;
    padding-bottom: 24px;
}

.helpy-project-form-page--edit .helpy-project-form-section + .helpy-project-form-section {
    margin-top: 20px;
    padding-top: 18px;
}

.helpy-project-form-page--edit .helpy-project-form-section__head {
    margin-bottom: 14px;
}

.helpy-project-form-page--edit .helpy-project-form-section__head h3 {
    font-size: 17px;
}

.helpy-project-form-page--edit .helpy-project-form-section__head p {
    margin-bottom: 0;
}

.helpy-project-form-page--edit .helpy-project-form-grid--compact {
    gap: 14px;
}

.helpy-project-form-page--edit .helpy-project-form-field {
    margin-bottom: 14px;
}

.helpy-project-form-page--edit .helpy-project-status-block {
    margin-top: 18px;
    padding: 14px 16px;
}

.helpy-project-form-page--edit .helpy-project-status-block__desc {
    margin-bottom: 12px;
}

.helpy-project-form-page--edit .helpy-project-form-card--smart .helpy-project-wizard-nav {
    margin-top: 18px;
    padding-top: 16px;
}

.helpy-project-form-page--edit .helpy-project-wizard-nav__buttons {
    align-items: center;
    gap: 10px;
}

.helpy-project-form-page--edit .helpy-project-form-submit {
    min-width: 132px;
}

@media (max-width: 767.98px) {
    .helpy-project-form-page--edit .helpy-project-edit-files__head,
    .helpy-project-form-page--edit .helpy-project-edit-files__row {
        align-items: flex-start;
        flex-direction: column;
    }

    .helpy-project-form-page--edit .helpy-project-edit-files__hint {
        text-align: left;
    }

    .helpy-project-form-page--edit .helpy-project-edit-files__actions,
    .helpy-project-form-page--edit .helpy-project-edit-files__actions .helpy-btn,
    .helpy-project-form-page--edit .helpy-project-edit-files__removeform {
        width: 100%;
    }

    .helpy-project-form-page--edit .helpy-project-edit-files__actions .helpy-btn {
        justify-content: center;
    }

    .helpy-project-form-page--edit .helpy-project-wizard-nav__buttons {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .helpy-project-form-page--edit .helpy-project-status-btn,
    .helpy-project-form-page--edit .helpy-project-form-submit {
        width: 100%;
        justify-content: center;
    }
}

/* ─────────────────────────────────────────────────────────
   v0.3.27 — Current files merged into the Step 2 attachments
   accordion. Replaces the old detached .helpy-project-edit-files
   slab (which sat above the form, misaligned at 860px).
   ───────────────────────────────────────────────────────── */

/* Remove-attachment forms are rendered after the main form and
   triggered via the HTML5 form="" attribute — never shown. */
.helpy-project-form-page .hpf-remove-attachment-form {
    display: none !important;
}

.helpy-project-form-page .hpf-attachments-current {
    margin-bottom: 12px;
}

.helpy-project-form-page .hpf-attachments-current__hint {
    margin: 0 0 8px;
    font-size: 11px;
    line-height: 1.35;
    color: #8a849a;
}

.helpy-project-form-page .hpf-attachments-current__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.helpy-project-form-page .hpf-attachments-current__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 42px;
    padding: 8px 10px;
    background: #faf9fd;
    border: 1px solid #f0edf7;
    border-radius: 12px;
}

.helpy-project-form-page .hpf-attachments-current__meta {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #332b4c;
}

.helpy-project-form-page .hpf-attachments-current__name {
    min-width: 0;
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
}

.helpy-project-form-page .hpf-attachments-current__type {
    flex: 0 0 auto;
    color: #8a849a;
    font-size: 11px;
    text-transform: uppercase;
}

.helpy-project-form-page .hpf-attachments-current__actions {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.helpy-project-form-page .hpf-attachments-current .helpy-btn--sm {
    min-height: 34px;
    padding: 0 12px;
    border-radius: 10px;
}

@media (max-width: 767.98px) {
    .helpy-project-form-page .hpf-attachments-current__row {
        flex-direction: column;
        align-items: flex-start;
    }

    .helpy-project-form-page .hpf-attachments-current__actions,
    .helpy-project-form-page .hpf-attachments-current__actions .helpy-btn {
        width: 100%;
        justify-content: center;
    }
}

/* ─────────────────────────────────────────────────────────────
   v0.3.43 — Edit footer: Direct/Public + single primary action
   The bottom "Save Changes" is the one primary action. The visibility
   action (Publish / Make private) is secondary so the two no longer
   read as competing "Save" buttons.
   ───────────────────────────────────────────────────────────── */

/* Pill tones match the Direct/Public scheme used on cards */
.helpy-project-status-pill--saved {
    background: #eef1f6;
    color: #44506a;
}
.helpy-project-status-pill--open {
    background: #f1ebff;
    color: #6429c4;
}

/* Visibility action is now a calm secondary outline (not a 2nd primary) */
.helpy-project-status-btn--publish {
    background: #fff;
    color: #6429c4;
    border-color: #cbbdf0;
}
.helpy-project-status-btn--publish:hover {
    background: #f6f1ff;
    border-color: #b388e8;
    color: #5a2298;
}

/* Give the visibility block a light card so it reads as one grouped zone */
.helpy-project-form-page--edit .helpy-project-status-block {
    background: #faf9fd;
    border: 1px solid #ece8f5;
    border-radius: 14px;
    padding: 16px 18px;
}
.helpy-project-form-page--edit .helpy-project-status-block__head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}