| 1 |
.aibui-contact-form { |
| 2 |
--aibui-bg: #ffffff; |
| 3 |
--aibui-border: #e5e7eb; |
| 4 |
--aibui-text: #111827; |
| 5 |
--aibui-muted: #6b7280; |
| 6 |
--aibui-primary: #4f46e5; |
| 7 |
--aibui-primary-contrast: #ffffff; |
| 8 |
} |
| 9 |
|
| 10 |
.aibui-contact-form-preview { |
| 11 |
background: var(--aibui-bg); |
| 12 |
border: 1px solid var(--aibui-border); |
| 13 |
border-radius: 12px; |
| 14 |
padding: 20px; |
| 15 |
} |
| 16 |
|
| 17 |
.aibui-form-title { |
| 18 |
margin: 0 0 8px; |
| 19 |
font-size: 24px; |
| 20 |
line-height: 1.2; |
| 21 |
} |
| 22 |
|
| 23 |
.aibui-form-description { |
| 24 |
margin: 0 0 16px; |
| 25 |
color: var(--aibui-muted); |
| 26 |
} |
| 27 |
|
| 28 |
.aibui-fields { |
| 29 |
display: grid; |
| 30 |
grid-template-columns: repeat(12, 1fr); |
| 31 |
gap: 12px; |
| 32 |
} |
| 33 |
|
| 34 |
.aibui-field { |
| 35 |
grid-column: span 12; |
| 36 |
} |
| 37 |
|
| 38 |
.aibui-input-placeholder { |
| 39 |
border: 1px dashed var(--aibui-border); |
| 40 |
border-radius: 8px; |
| 41 |
padding: 10px 12px; |
| 42 |
color: var(--aibui-muted); |
| 43 |
font-size: 14px; |
| 44 |
} |
| 45 |
|
| 46 |
.aibui-contact-form .components-button.is-primary, |
| 47 |
.aibui-contact-form-preview .components-button.is-primary { |
| 48 |
background: var(--aibui-primary); |
| 49 |
color: var(--aibui-primary-contrast); |
| 50 |
border: 0; |
| 51 |
border-radius: 8px; |
| 52 |
padding: 10px 16px; |
| 53 |
} |
| 54 |
|
| 55 |
.aibui-field-row { |
| 56 |
border: 1px solid var(--aibui-border); |
| 57 |
border-radius: 8px; |
| 58 |
padding: 12px; |
| 59 |
margin-bottom: 12px; |
| 60 |
background: #fff; |
| 61 |
} |
| 62 |
|
| 63 |
|
| 64 |
|
