| @@ -22,12 +22,12 @@ | ||
| 22 | 22 | padding: 6px 12px; |
| 23 | 23 | min-height: 36px; |
| 24 | 24 | box-sizing: border-box; |
| 25 | 25 | background: #ffffff; |
| 26 | - color: #111827; | |
| 27 | - border: 1px solid #dcdfe4; | |
| 28 | - border-radius: 8px; | |
| 29 | - box-shadow: 0px 1px 2px rgba( 0, 0, 0, 0.08 ); | |
| 26 | + color: #1c1917; | |
| 27 | + border: 1px solid rgba( 28, 25, 23, 0.12 ); | |
| 28 | + border-radius: 10px; | |
| 29 | + box-shadow: 0px 1px 2px rgba( 28, 25, 23, 0.06 ); | |
| 30 | 30 | } |
| 31 | 31 | |
| 32 | 32 | .mlsimport-block-inspector .components-textarea-control__input { |
| 33 | 33 | min-height: 0; |
| @@ -36,24 +36,24 @@ | ||
| 36 | 36 | /* SelectControl draws its visible border on the .components-input-control__backdrop |
| 37 | 37 | overlay (default 1px #949494), covering the border set on the inner <select>. |
| 38 | 38 | Recolor the backdrop to the 2025 token so the select matches the text inputs. */ |
| 39 | 39 | .mlsimport-block-inspector .components-input-control__backdrop { |
| 40 | - border-color: #dcdfe4 !important; | |
| 41 | - border-radius: 8px !important; | |
| 40 | + border-color: rgba( 28, 25, 23, 0.12 ) !important; | |
| 41 | + border-radius: 10px !important; | |
| 42 | 42 | } |
| 43 | 43 | |
| 44 | 44 | /* WP forces box-shadow:none on the native <select> via an emotion class — re-assert |
| 45 | 45 | the soft shadow so the select isn't flat next to the inputs. */ |
| 46 | 46 | .mlsimport-block-inspector .components-select-control__input { |
| 47 | - box-shadow: 0px 1px 2px rgba( 0, 0, 0, 0.08 ) !important; | |
| 47 | + box-shadow: 0px 1px 2px rgba( 28, 25, 23, 0.06 ) !important; | |
| 48 | 48 | } |
| 49 | 49 | |
| 50 | -/* Focus: brand-indigo ring, consistent across every field. */ | |
| 50 | +/* Focus: Sunny Bento orange accent ring, consistent across every field. */ | |
| 51 | 51 | .mlsimport-block-inspector .components-text-control__input:focus, |
| 52 | 52 | .mlsimport-block-inspector .components-textarea-control__input:focus, |
| 53 | 53 | .mlsimport-block-inspector .components-select-control__input:focus { |
| 54 | - border-color: #635bff; | |
| 55 | - box-shadow: 0 0 0 1px #635bff; | |
| 54 | + border-color: #e85d3c; | |
| 55 | + box-shadow: 0 0 0 1px #e85d3c; | |
| 56 | 56 | outline: none; |
| 57 | 57 | } |
| 58 | 58 | |
| 59 | 59 | /* Field labels — block, 14px, medium weight, dark, sentence-case. Covers BOTH label |
| @@ -66,9 +66,9 @@ | ||
| 66 | 66 | display: block; |
| 67 | 67 | margin-bottom: 4px; |
| 68 | 68 | font-size: 14px !important; |
| 69 | 69 | font-weight: 500; |
| 70 | - color: #111827; | |
| 70 | + color: #1c1917; | |
| 71 | 71 | text-transform: none !important; |
| 72 | 72 | letter-spacing: normal; |
| 73 | 73 | } |
| 74 | 74 | |
| @@ -73,25 +73,35 @@ | ||
| 73 | 73 | } |
| 74 | 74 | |
| 75 | 75 | /* Help / explanation text under a field — muted. */ |
| 76 | 76 | .mlsimport-block-inspector .components-base-control__help { |
| 77 | - color: #6b7280; | |
| 77 | + color: #9a9285; | |
| 78 | 78 | font-size: 12px; |
| 79 | 79 | } |
| 80 | 80 | |
| 81 | -/* Buttons, if a panel uses them — primary indigo gradient, secondary neutral | |
| 82 | - bordered — matching .button.mlsimport_button. */ | |
| 81 | +/* Buttons, if a panel uses them — primary: solid near-black pill, secondary: | |
| 82 | + white bordered pill — matching .button.mlsimport_button (Sunny Bento). */ | |
| 83 | 83 | .mlsimport-block-inspector .components-button.is-primary { |
| 84 | 84 | color: #ffffff; |
| 85 | - background: linear-gradient( 180deg, #635bff 0%, #4e36f5 100% ); | |
| 86 | - border: 1px solid #15b79f; | |
| 87 | - border-radius: 8px; | |
| 88 | - box-shadow: rgba( 0, 0, 0, 0.08 ) 0px 1px 2px 0px, rgb( 78, 54, 245 ) 0px 0px 0px 1px inset, rgba( 255, 255, 255, 0.16 ) 0px 2px 0px 0px inset; | |
| 85 | + background: #1c1917; | |
| 86 | + border: 1px solid #1c1917; | |
| 87 | + border-radius: 999px; | |
| 88 | + box-shadow: 0px 1px 2px rgba( 28, 25, 23, 0.08 ); | |
| 89 | 89 | } |
| 90 | 90 | |
| 91 | +.mlsimport-block-inspector .components-button.is-primary:hover { | |
| 92 | + background: #33302b; | |
| 93 | + border-color: #33302b; | |
| 94 | + box-shadow: 0 10px 24px -10px rgba( 0, 0, 0, 0.45 ); | |
| 95 | +} | |
| 96 | + | |
| 91 | 97 | .mlsimport-block-inspector .components-button.is-secondary { |
| 92 | 98 | background: #ffffff; |
| 93 | - color: #1e1e1e; | |
| 94 | - border: 1px solid #dcdfe4; | |
| 95 | - border-radius: 8px; | |
| 96 | - box-shadow: 0px 1px 2px rgba( 0, 0, 0, 0.08 ); | |
| 99 | + color: #1c1917; | |
| 100 | + border: 1px solid rgba( 28, 25, 23, 0.12 ); | |
| 101 | + border-radius: 999px; | |
| 102 | + box-shadow: 0px 1px 2px rgba( 28, 25, 23, 0.06 ); | |
| 103 | +} | |
| 104 | + | |
| 105 | +.mlsimport-block-inspector .components-button.is-secondary:hover { | |
| 106 | + background: #f3efe7; | |
| 97 | 107 | } |