/* Ensure WP themes/builders can't override the HTML "hidden" attribute */
.dff-wrap [hidden] { display: none !important; }

.dff-wrap .dff-step-panel[hidden],
.dff-wrap [data-business-only][hidden] {
    display: none !important;
}

.dff-wrap { max-width: 760px; margin: 24px auto; padding: 0 16px; }
.dff-card {
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 14px;
    padding: 18px;
    background: #fff;
}
.dff-header { margin-bottom: 14px; }
.dff-title { font-size: 20px; font-weight: 700; }
.dff-subtitle { font-size: 13px; opacity: .75; margin-top: 4px; }

.dff-stepper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin: 14px 0 18px;
}
.dff-step {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 12px;
    padding: 10px 12px;
    opacity: .65;
}
.dff-step span {
    width: 26px; height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,.2);
    font-weight: 700;
    font-size: 13px;
}
.dff-step label { font-size: 13px; font-weight: 600; }
.dff-step.is-active { opacity: 1; border-color: rgba(0,0,0,.25); }
.dff-step.is-done { opacity: 1; }

.dff-form { display: block; }
.dff-step-panel { animation: dffFade .12s ease-in-out; }
@keyframes dffFade { from { opacity: .4; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }

.dff-field { margin-bottom: 14px; }
.dff-label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.dff-help { font-size: 12px; opacity: .75; margin-top: 6px; }

.dff-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 640px) { .dff-grid { grid-template-columns: 1fr; } }

.dff-form input, .dff-form select, .dff-form textarea {
    width: 100%;
    border: 1px solid rgba(0,0,0,.18);
    border-radius: 12px;
    padding: 10px 12px;
    font-size: 14px;
    outline: none;
}
.dff-form input:focus, .dff-form select:focus, .dff-form textarea:focus {
    border-color: rgba(0,0,0,.35);
}

.dff-actions { display: flex; justify-content: space-between; gap: 10px; margin-top: 10px; }
.dff-btn {
    appearance: none;
    border: 1px solid rgba(0,0,0,.18);
    background: #fff;
    border-radius: 12px;
    padding: 10px 14px;
    font-weight: 700;
    cursor: pointer;
}
.dff-btn-primary {
    background: #111;
    color: #fff;
    border-color: #111;
}

.dff-status { margin-top: 12px; font-size: 13px; min-height: 18px; }
.dff-status[data-type="error"] { color: #b00020; }
.dff-status[data-type="success"] { color: #0b6b2b; }