.title-actions { align-items: center; }
.push-right { margin-left: auto; }
.secondary { border: 1px solid var(--line); background: white; color: var(--ink); border-radius: 7px; padding: 8px 12px; font-weight: bold; cursor: pointer; }
.secondary:hover { border-color: var(--green); color: var(--green); }
.row-actions, .form-actions { display: flex; align-items: center; gap: 8px; }
.form-actions .primary { flex: 1; }
dialog { width: min(900px, calc(100% - 32px)); border: 1px solid var(--line); border-radius: 14px; padding: 28px; background: var(--paper); color: var(--ink); box-shadow: 0 24px 80px #101d1599; }
dialog::backdrop { background: #12201999; backdrop-filter: blur(3px); }
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 25px; }
.modal-head h2 { font: 30px Georgia; margin: 6px 0; }
.modal-close { border: 0; background: none; font-size: 28px; color: var(--muted); cursor: pointer; }
.page-hero { min-height: 260px; }
.compact-hero { min-height: 245px; }
.quick-action { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 26px; margin-bottom: 22px; border: 1px solid var(--line); border-radius: 14px; background: var(--lime); }
.quick-action h2 { font: 24px Georgia; margin: 5px 0; }
.quick-action p { margin: 0; color: var(--muted); font-size: 13px; }
#quote-modal { width: min(720px, calc(100% - 32px)); }
.nav-form { display: inline; }.nav-form button { border: 0; background: none; color: var(--ink); font: inherit; font-size: 13px; font-weight: bold; cursor: pointer; padding: 0; }
.auth-page { min-height: 100vh; display: grid; place-items: center; background: var(--green); }.auth-shell { width: min(480px, calc(100% - 32px)); padding: 30px 0; }.auth-brand { color: white; margin: 0 0 20px 8px; }.auth-brand .logo { background: var(--lime); color: var(--green); }.auth-card { padding: 38px; }.auth-card h1 { font-size: 40px; margin: 10px 0; }.auth-card>p { color: var(--muted); margin-bottom: 24px; }.auth-form { display: grid; gap: 16px; }.auth-form .remember { display: flex; align-items: center; gap: 8px; text-transform: none; }.auth-form .remember input { width: auto; margin: 0; }.auth-errors { margin: 18px 0 0; }
#order-modal { width: min(900px, calc(100% - 32px)); }.order-lines { display: grid; gap: 10px; margin: 20px 0 10px; }.order-line { display: grid; grid-template-columns: 2fr .8fr 1fr auto; gap: 12px; align-items: end; padding: 12px; background: var(--cream); border-radius: 8px; }.order-line .delete { height: 42px; }.add-line { margin-bottom: 16px; }.order-notes { display: block; margin-bottom: 16px; }.order-save { width: 100%; }.new-material-fields { grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 14px; }.new-material-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-top: 8px; }
@media (max-width: 650px) { dialog .form-grid { grid-template-columns: 1fr; } dialog .span2, dialog .span3 { grid-column: auto; } .title-actions { flex-wrap: wrap; } .push-right { width: 100%; margin-left: 50px; } .quick-action { align-items: stretch; flex-direction: column; } .order-line { grid-template-columns: 1fr; }.order-line .delete { justify-self: end; }.new-material-grid { grid-template-columns: 1fr; } }