/* Button Classes */
.btn-primary { background: var(--primary); color: white; }
.btn-secondary { background: white; color: var(--primary); border: 2px solid var(--primary); }

/* Helpers */
.hidden { display: none !important; }
.mb-1 { margin-bottom: 1rem; }
.mt-2 { margin-top: 2rem; }
.flex-gap { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center; }
.divider { margin: 2rem 0; border: 0; border-top: 1px solid var(--surface-variant); }

/* Textarea styling */
textarea { width: 100%; padding: 0.65rem; font-size: 1rem; border-radius: 8px; border: 1px solid var(--surface-variant); font-family: inherit; }
textarea:focus { outline: 2px solid var(--primary); border-color: var(--primary); }
.section-textarea { min-height: 80px; resize: vertical; }

/* Entity Cards (Owner / Tenant) */
.section-header { display: flex; justify-content: space-between; align-items: center; }
.layout-controls { display: flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; color: var(--muted); }
.layout-controls select { padding: 0.3rem 0.5rem; font-size: 0.9rem; width: auto; }

.entity-grid { display: grid; gap: 1.5rem; margin-bottom: 1rem; transition: all 0.3s ease; }
.grid-cols-1 { grid-template-columns: 1fr; }
.grid-cols-2 { grid-template-columns: repeat(2, 1fr); }

.entity-card {
    background: var(--surface-variant);
    padding: 1.5rem;
    border-radius: 12px;
    border: 1px solid var(--primary);
    position: relative;
}
.entity-card h4 { margin-top: 0; margin-bottom: 1rem; color: var(--tertiary); display: flex; justify-content: space-between; }
.entity-card .remove-btn { background: var(--error); color: white; padding: 0.2rem 0.6rem; font-size: 0.8rem; border: none; border-radius: 6px; cursor: pointer; }
.entity-card .field-group { margin-bottom: 0.75rem; }
.entity-card .field-group label { font-size: 0.85rem; }
.add-btn { width: 100%; padding: 0.75rem; border-style: dashed; }

/* Document Preview Box */
#previewContent { padding: 2.5rem; background: white; border: 1px solid var(--surface-variant); border-radius: 8px; min-height: 500px; color: black; }
#previewContent p { margin-bottom: 1rem; line-height: 1.6; }

@media (max-width: 640px) {
    .grid-cols-2 { grid-template-columns: 1fr; } /* Force single column on mobile */
}

.wizard-progress {
    display:flex;
    justify-content:space-between;
    margin-bottom:2rem;
}

.wizard-step {
    text-align:center;
    opacity:.5;
}

.wizard-step span {
    display:block;
    width:35px;
    height:35px;
    border-radius:50%;
    margin:auto;
    padding-top:7px;
    background:#ddd;
}

.wizard-step.active {
    opacity:1;
}


.wizard-buttons {
    display:flex;
    justify-content:space-between;
    margin-top:2rem;
}

.placeholder-helper {
    margin-bottom:1.5rem;
    padding:1rem;
}


.placeholder-grid {

    display:grid;

    grid-template-columns:
    repeat(auto-fit,minmax(130px,1fr));

    gap:0.75rem;

    margin-top:1rem;

}


.placeholder-grid button {

    cursor:pointer;

    padding:0.7rem;

    border-radius:8px;

    border:1px solid #ddd;

    background:white;

    font-family:monospace;

}


.placeholder-grid button:hover {

    background:#f5f5f5;

}
.deduction-section[draggable="true"] {
    user-select: none;
}

.deduction-section:hover {
    border-color: var(--primary, #007bff);
}

.deduction-section button:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}


#copyMessage {

    margin-top:1rem;

    font-size:.9rem;

}