.contracts-screen{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
.contracts-screen *{box-sizing:border-box;min-width:0;overflow-wrap:anywhere}
.contracts-screen h1{margin-top:16px}
.contracts-home-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:16px}
.contracts-home-heading h1{margin:0;white-space:nowrap}
.contracts-home-heading button{flex-shrink:0;white-space:nowrap;font-size:14px;padding-inline:10px}
.contracts-home-badge{display:inline-block;margin-top:8px}
@media(max-width:360px){.contracts-home-heading h1{font-size:24px}}
.contracts-screen input,.contracts-screen select,.contracts-screen textarea{width:100%;max-width:100%;min-width:0}
.contracts-screen .card{margin-top:16px}
.contracts-templates,.contracts-actions,.contracts-messengers{display:grid;gap:12px}
.contracts-templates button,.contracts-screen [data-contract-client],.contracts-screen [data-contract-estimate],.contracts-screen [data-contract-document]{display:flex;flex-direction:column;align-items:flex-start;text-align:left;width:100%;gap:6px;margin-top:10px}
.contracts-actions{grid-template-columns:repeat(2,minmax(0,1fr));margin:16px 0}
.contracts-messengers{grid-template-columns:repeat(3,minmax(0,1fr))}
#contract-preview canvas{display:block;width:100%;height:auto;margin:14px 0;background:white}
#contracts-created{width:100%;margin-top:16px}
.contract-passport-fields input,.contract-passport-fields textarea{box-sizing:border-box;min-width:0;max-width:100%;width:100%}
/* Keep the added passport date above the submit action in the longer form. */
#modal form:has(.contract-passport-fields) .form-actions{position:static}

.contracts-template-card .contracts-category{display:flex;align-items:center;justify-content:center;width:100%;margin:0 auto;text-align:center;white-space:nowrap;font-size:20px;font-weight:700;padding:12px 8px;min-height:48px}
.contracts-template-card [data-contract-category="review"]{font-size:clamp(16px,4.6vw,19px)}
.contracts-template-card .contracts-templates,.contracts-type-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.contracts-template-card .contracts-templates button,.contracts-type-choice button{display:flex;align-items:center;justify-content:center;text-align:center;margin:0;width:100%;padding:12px;min-height:48px}
#contracts-created{display:flex;align-items:center;justify-content:center;font-size:19px;font-weight:700;text-align:center;min-height:48px;padding:12px}
.contracts-actions{position:static;width:100%;max-width:100%;padding:10px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}
.contracts-actions button{width:100%;min-width:0;display:flex;align-items:center;justify-content:center;text-align:center;padding-inline:8px}
#contract-client-choice{margin-top:16px}
#contract-selection:empty{display:none}
#contract-selection{margin-top:16px}
#contract-form{width:100%;margin-top:16px}
[data-contract-estimate][aria-pressed="true"]{outline:2px solid var(--primary,#2563eb);outline-offset:-2px}

/* Keep search geometry stable while typing and selecting a client. */
.contract-results-stable{max-height:176px;overflow-y:auto;overscroll-behavior:contain;overflow-anchor:none}
.contracts-screen:has(#contract-search){overflow-anchor:none}
.contracts-version-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
.contracts-version-choice button{display:flex;align-items:center;justify-content:center;text-align:center;min-height:48px;width:100%;padding:12px 8px}

/* Only the new-contract form uses this compact spacing. */
.contract-create-form label{margin:0;display:block}
.contract-create-form .contracts-type-choice{margin-top:8px;gap:8px}
.contract-create-form #contract-client-choice,.contract-create-form #contract-selection{margin-top:10px}
.contract-create-form input,.contract-create-form select{min-height:44px;margin-top:4px;padding:10px;font-size:16px}
.contract-create-form #contract-selected{margin:8px 0 0}
.contract-create-form #contract-selection>label+label{margin-top:10px}
.contract-create-form #contract-estimates{max-height:104px;overflow-y:auto;overscroll-behavior:contain}
.contract-create-form [data-contract-estimate]{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,1fr);align-items:center;gap:8px;margin-top:6px;padding:12px;min-height:44px;width:100%;max-width:100%}
.contract-create-form [data-contract-estimate] span{text-align:left}.contract-create-form [data-contract-estimate] b{text-align:center}.contract-create-form [data-contract-estimate] small{margin:0;text-align:right;font-size:14px}
@media(max-width:360px){.contract-create-form [data-contract-estimate]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.contract-create-form [data-contract-estimate] b{grid-column:1/-1;grid-row:2;text-align:center}.contract-create-form [data-contract-estimate] small{grid-column:2;grid-row:1}}
.contract-create-form #contract-form{margin-top:10px;min-height:44px}
.contract-create-form #contract-selected strong{display:inline}
.client-document-create{display:grid;gap:10px;margin-top:12px}.client-document-create button{width:100%;min-height:50px;border-radius:12px;padding:12px;font-size:16px;font-weight:700;text-align:center;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.client-document-entry{min-width:0;max-width:100%}.client-document-group{margin-top:16px}.client-document-record{margin-top:10px;padding:12px;border:1px solid var(--border);border-radius:12px}.client-document-record p{font-size:14px}.client-document-actions{display:flex;flex-wrap:wrap;gap:8px}.client-document-actions button{min-height:44px;flex:1 1 120px}.contract-create-form [data-contract-estimate][hidden]{display:none}

.client-document-actions button{flex:1 1 100%;width:100%;box-sizing:border-box;font-weight:700;text-align:center;display:flex;align-items:center;justify-content:center}