| @@ -6,9 +6,9 @@ | ||
| 6 | 6 | } |
| 7 | 7 | .booking_form_div .wpbc_bfb_form, |
| 8 | 8 | .wpbc_bfb__panel--preview .wpbc_bfb__form_preview_section_container { |
| 9 | 9 | width: var(--wpbc-bfb-booking_form_layout_width,100%); |
| 10 | - max-width: 100%; | |
| 10 | + max-width: min(100%,67rem); | |
| 11 | 11 | margin-left: auto; |
| 12 | 12 | margin-right: auto; |
| 13 | 13 | box-sizing: border-box |
| 14 | 14 | } |
| @@ -72,8 +72,9 @@ | ||
| 72 | 72 | div .wpbc_bfb_form .wpbc__row .wpbc__field, |
| 73 | 73 | div .wpbc_bfb_form .wpbc_bfb__section .wpbc_bfb__row .wpbc_bfb__column { |
| 74 | 74 | display: -ms-flexbox; |
| 75 | 75 | display: flex; |
| 76 | + box-sizing: border-box; | |
| 76 | 77 | -ms-flex-direction: var(--wpbc-bfb-col-dir,column); |
| 77 | 78 | flex-direction: var(--wpbc-bfb-col-dir,column); |
| 78 | 79 | -ms-flex-wrap: var(--wpbc-bfb-col-wrap,nowrap); |
| 79 | 80 | flex-wrap: var(--wpbc-bfb-col-wrap,nowrap); |
| @@ -81,11 +82,88 @@ | ||
| 81 | 82 | justify-content: var(--wpbc-bfb-col-jc,flex-start); |
| 82 | 83 | -ms-flex-align: var(--wpbc-bfb-col-ai,stretch); |
| 83 | 84 | align-items: var(--wpbc-bfb-col-ai,stretch); |
| 84 | 85 | gap: var(--wpbc-bfb-col-gap,0); |
| 86 | + padding: var(--wpbc-bfb-col-padding,0); | |
| 85 | 87 | -ms-flex-item-align: var(--wpbc-bfb-col-aself,flex-start); |
| 86 | 88 | align-self: var(--wpbc-bfb-col-aself,flex-start) |
| 87 | 89 | } |
| 90 | +div .wpbc_bfb_form .wpbc__row .wpbc__field:not(.wpbc__cal), | |
| 91 | +div .wpbc_bfb_form .wpbc_bfb__section .wpbc_bfb__row .wpbc_bfb__column { | |
| 92 | + margin: .7em 0 | |
| 93 | +} | |
| 94 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-margin:"], | |
| 95 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-margin:"] { | |
| 96 | + margin: var(--wpbc-bfb-col-margin) | |
| 97 | +} | |
| 98 | +div .wpbc_bfb_form .wpbc_bfb__section[data-selected-col] > .wpbc_bfb__row > .wpbc_bfb__column.is-selected-column { | |
| 99 | + padding: var(--wpbc-bfb-col-padding,0); | |
| 100 | + padding-top: var(--wpbc-bfb-col-padding-top,var(--wpbc-bfb-col-padding,0)); | |
| 101 | + padding-right: var(--wpbc-bfb-col-padding-right,var(--wpbc-bfb-col-padding,0)); | |
| 102 | + padding-bottom: var(--wpbc-bfb-col-padding-bottom,var(--wpbc-bfb-col-padding,0)); | |
| 103 | + padding-left: var(--wpbc-bfb-col-padding-left,var(--wpbc-bfb-col-padding,0)) | |
| 104 | +} | |
| 105 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-padding-top"], | |
| 106 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-padding-top"] { | |
| 107 | + padding-top: var(--wpbc-bfb-col-padding-top) | |
| 108 | +} | |
| 109 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-padding-right"], | |
| 110 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-padding-right"] { | |
| 111 | + padding-right: var(--wpbc-bfb-col-padding-right) | |
| 112 | +} | |
| 113 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-padding-bottom"], | |
| 114 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-padding-bottom"] { | |
| 115 | + padding-bottom: var(--wpbc-bfb-col-padding-bottom) | |
| 116 | +} | |
| 117 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-padding-left"], | |
| 118 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-padding-left"] { | |
| 119 | + padding-left: var(--wpbc-bfb-col-padding-left) | |
| 120 | +} | |
| 121 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-margin-top"], | |
| 122 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-margin-top"] { | |
| 123 | + margin-top: var(--wpbc-bfb-col-margin-top) | |
| 124 | +} | |
| 125 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-margin-right"], | |
| 126 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-margin-right"] { | |
| 127 | + margin-right: var(--wpbc-bfb-col-margin-right) | |
| 128 | +} | |
| 129 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-margin-bottom"], | |
| 130 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-margin-bottom"] { | |
| 131 | + margin-bottom: var(--wpbc-bfb-col-margin-bottom) | |
| 132 | +} | |
| 133 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-margin-left"], | |
| 134 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-margin-left"] { | |
| 135 | + margin-left: var(--wpbc-bfb-col-margin-left) | |
| 136 | +} | |
| 137 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-max-width"], | |
| 138 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-max-width"] { | |
| 139 | + max-width: var(--wpbc-bfb-col-max-width) | |
| 140 | +} | |
| 141 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-max-height"], | |
| 142 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-max-height"] { | |
| 143 | + max-height: var(--wpbc-bfb-col-max-height) | |
| 144 | +} | |
| 145 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-overflow:"], | |
| 146 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-overflow:"] { | |
| 147 | + overflow: var(--wpbc-bfb-col-overflow); | |
| 148 | + scrollbar-width: thin | |
| 149 | +} | |
| 150 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-overflow-x:"], | |
| 151 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-overflow-x:"] { | |
| 152 | + overflow-x: var(--wpbc-bfb-col-overflow-x); | |
| 153 | + scrollbar-width: thin | |
| 154 | +} | |
| 155 | +div .wpbc_bfb_form .wpbc__row > .wpbc__field[style*="--wpbc-bfb-col-overflow-y:"], | |
| 156 | +div .wpbc_bfb_form .wpbc_bfb__section > .wpbc_bfb__row > .wpbc_bfb__column[style*="--wpbc-bfb-col-overflow-y:"] { | |
| 157 | + overflow-y: var(--wpbc-bfb-col-overflow-y); | |
| 158 | + scrollbar-width: thin | |
| 159 | +} | |
| 160 | +:is(div.wpbc_bfb_form.wpbc__row>.wpbc__field,div.wpbc_bfb_form.wpbc_bfb__section>.wpbc_bfb__row>.wpbc_bfb__column):is([style*="--wpbc-bfb-col-overflow-y:auto"],[style*="--wpbc-bfb-col-overflow-y: auto"],[style*="--wpbc-bfb-col-overflow-y:hidden"],[style*="--wpbc-bfb-col-overflow-y: hidden"]):not(:is([style*="--wpbc-bfb-col-overflow-x:auto"],[style*="--wpbc-bfb-col-overflow-x: auto"],[style*="--wpbc-bfb-col-overflow-x:hidden"],[style*="--wpbc-bfb-col-overflow-x: hidden"],[style*="--wpbc-bfb-col-overflow:auto"],[style*="--wpbc-bfb-col-overflow: auto"],[style*="--wpbc-bfb-col-overflow:hidden"],[style*="--wpbc-bfb-col-overflow: hidden"])) { | |
| 161 | + overflow-x: hidden | |
| 162 | +} | |
| 163 | +:is(div.wpbc_bfb_form.wpbc__row>.wpbc__field,div.wpbc_bfb_form.wpbc_bfb__section>.wpbc_bfb__row>.wpbc_bfb__column):is([style*="--wpbc-bfb-col-overflow-x:auto"],[style*="--wpbc-bfb-col-overflow-x: auto"],[style*="--wpbc-bfb-col-overflow-x:hidden"],[style*="--wpbc-bfb-col-overflow-x: hidden"]):not(:is([style*="--wpbc-bfb-col-overflow-y:auto"],[style*="--wpbc-bfb-col-overflow-y: auto"],[style*="--wpbc-bfb-col-overflow-y:hidden"],[style*="--wpbc-bfb-col-overflow-y: hidden"],[style*="--wpbc-bfb-col-overflow:auto"],[style*="--wpbc-bfb-col-overflow: auto"],[style*="--wpbc-bfb-col-overflow:hidden"],[style*="--wpbc-bfb-col-overflow: hidden"])) { | |
| 164 | + overflow-y: hidden | |
| 165 | +} | |
| 88 | 166 | div .wpbc_bfb_form .wpbc__row .wpbc__field .bfb_element:has(:input), |
| 89 | 167 | div .wpbc_bfb_form .wpbc_bfb__section .wpbc_bfb__row .wpbc_bfb__column .wpbc_bfb__field { |
| 90 | 168 | -ms-flex: 1 1 100%; |
| 91 | 169 | flex: 1 1 100% |
| @@ -109,8 +187,11 @@ | ||
| 109 | 187 | div .wpbc_bfb_form [data-colstyles-active="1"] .wpbc_bfb__row .wpbc_bfb__column .wpbc_bfb__field:not(:has(.wpbc_calendar_wraper)) { |
| 110 | 188 | -ms-flex: 0 1 auto; |
| 111 | 189 | flex: 0 1 auto |
| 112 | 190 | } |
| 191 | +.wpbc__field:has(.wpbc_calendar_wraper) { | |
| 192 | + max-width: 100% | |
| 193 | +} | |
| 113 | 194 | div .wpbc_bfb_form .wpbc__row .wpbc__field[data-colstyles-active="1"] .bfb_element:has(.wpbc_text_captcha_container), |
| 114 | 195 | div .wpbc_bfb_form [data-colstyles-active="1"] .wpbc_bfb__row .wpbc_bfb__column .wpbc_bfb__field:has(.wpbc_text_captcha_container) { |
| 115 | 196 | -ms-flex: 1 1 auto; |
| 116 | 197 | flex: 1 1 auto |
| @@ -163,8 +244,16 @@ | ||
| 163 | 244 | div.wpbc_container.wpbc_form .wpdev-form-control-wrap input[type=checkbox], |
| 164 | 245 | div.wpbc_container.wpbc_form .wpdev-form-control-wrap input[type=radio] { |
| 165 | 246 | margin: -5px 5px 0 |
| 166 | 247 | } |
| 248 | +body:not(.wp-admin) .wpbc_bfb_form .wpbc-hidden-on-frontend { | |
| 249 | + display: none!important | |
| 250 | +} | |
| 251 | +.wpbc_bfb__panel--preview .wpbc_bfb__field.wpbc-hidden-on-frontend > :not(.wpbc_bfb__overlay-controls), | |
| 252 | +.wpbc_bfb__panel--preview .wpbc_bfb__field:has(.wpbc-hidden-on-frontend) > :not(.wpbc_bfb__overlay-controls), | |
| 253 | +.wpbc_bfb__panel--preview .wpbc_bfb__section.wpbc-hidden-on-frontend > .wpbc_bfb__row { | |
| 254 | + opacity: .5 | |
| 255 | +} | |
| 167 | 256 | .wpbc_bfb_form .wpbc_bfb__row .wpbc_bfb__column .wpbc_bfb__field[data-type=divider][data-orientation=horizontal] { |
| 168 | 257 | width: 100%; |
| 169 | 258 | margin: 0; |
| 170 | 259 | min-width: 50px |
| @@ -224,8 +313,20 @@ | ||
| 224 | 313 | } |
| 225 | 314 | .wpbc_bfb_form .wpbc__row .wpbc__field .bfb_element .wpbc_bfb_divider_wrap hr { |
| 226 | 315 | background: 0 0 |
| 227 | 316 | } |
| 317 | +@media (max-width:782px) { | |
| 318 | + div.booking_form_div .wpbc_bfb_form { | |
| 319 | + width: 100%; | |
| 320 | + max-width: 100% | |
| 321 | + } | |
| 322 | + .wpbc_bfb_form .wpbc__row.wpbc_bfb_full_day_split_form > .wpbc__field:has(.wpbc_bfb_divider_wrap[data-orientation=vertical]), | |
| 323 | + .wpbc_bfb_form .wpbc__row.wpbc_bfb_time_slots_split_form > .wpbc__field:has(.wpbc_bfb_divider_wrap[data-orientation=vertical]), | |
| 324 | + .wpbc_bfb_form .wpbc_bfb__section.wpbc_bfb_full_day_split_form .wpbc_bfb__field[data-type=divider][data-orientation=vertical], | |
| 325 | + .wpbc_bfb_form .wpbc_bfb__section.wpbc_bfb_time_slots_split_form .wpbc_bfb__field[data-type=divider][data-orientation=vertical] { | |
| 326 | + display: none | |
| 327 | + } | |
| 328 | +} | |
| 228 | 329 | /*! |
| 229 | 330 | * Booking Form Fields |
| 230 | 331 | * |
| 231 | 332 | * // FixIn: 10.1.5.7. |
| @@ -248,8 +349,10 @@ | ||
| 248 | 349 | --wpbc_form-label-error-color: #d63637; |
| 249 | 350 | --wpbc_form-button-border-radius: 3px; |
| 250 | 351 | --wpbc_form-button-border-style: none; |
| 251 | 352 | --wpbc_form-button-border-size: 1px; |
| 353 | + --wpbc_form-button-light-border-style: solid; | |
| 354 | + --wpbc_form-button-light-border-size: var(--wpbc_form-button-border-size, 1px); | |
| 252 | 355 | --wpbc_form-button-background-color: #066aab; |
| 253 | 356 | --wpbc_form-button-background-color-alt: #066aab; |
| 254 | 357 | --wpbc_form-button-border-color: #066aab; |
| 255 | 358 | --wpbc_form-button-text-color: #ffffff; |
| @@ -282,16 +385,15 @@ | ||
| 282 | 385 | --wpbc_form-label-size-font-size: 16px; |
| 283 | 386 | --wpbc_form-label-size-line-height: 19px; |
| 284 | 387 | --wpbc_form-label-size-sublabel-font-size: 14px; |
| 285 | 388 | --wpbc_form-label-size-sublabel-line-height: 17px; |
| 286 | - --wpbc_form-button-size-font-size: 17px; | |
| 389 | + --wpbc_form-button-size-font-size: 16px; | |
| 287 | 390 | --wpbc_form-button-size-height: 41px; |
| 288 | 391 | --wpbc_form-button-size-padding-h: 15px; |
| 289 | 392 | --wpbc_form-button-size-margin-top: 10px; |
| 290 | 393 | --wpbc_form-container-shadow-size-box-shadow: none; |
| 291 | 394 | --wpbc_form-marging-between-several-checkbox-radio: 30px; |
| 292 | - --wpbc_form-padding-between-label-checkbox-radio: 8px; | |
| 293 | - --wpbc_form-button-light-size-height: 43px | |
| 395 | + --wpbc_form-padding-between-label-checkbox-radio: 8px | |
| 294 | 396 | } |
| 295 | 397 | /*! -------------------------------------------------------------------------------------------------------------------- |
| 296 | 398 | * General Fields |
| 297 | 399 | * ------------------------------------------------------------------------------------------------------------------ */ |
| @@ -825,157 +927,171 @@ | ||
| 825 | 927 | * Front-end button styles for booking forms. Keep this file focused on form |
| 826 | 928 | * buttons only; admin buttons stay in the admin CSS sources. |
| 827 | 929 | */ |
| 828 | 930 | /*! -------------------------------------------------------------------------------------------------------------------- |
| 829 | - * Submit buttons | |
| 931 | + * Shared Booking Calendar button component | |
| 932 | + * | |
| 933 | + * New public UI should use `.wpbc_button` plus a semantic modifier. The | |
| 934 | + * `.wpbc_button_light` and unclassed submit selectors are compatibility | |
| 935 | + * adapters for old custom form templates. All standard buttons deliberately | |
| 936 | + * share one fixed outer geometry. Secondary buttons may use a visible border, | |
| 937 | + * but border-box sizing keeps their outer height and alignment identical. | |
| 938 | + * An explicit `.wpbc_button_secondary` modifier always wins over the legacy | |
| 939 | + * rule that treats otherwise unclassified submit controls as primary. | |
| 830 | 940 | * ------------------------------------------------------------------------------------------------------------------ */ |
| 831 | -.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light), | |
| 832 | -.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light), | |
| 833 | -div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light), | |
| 834 | -div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light) { | |
| 835 | - height: var(--wpbc_form-button-size-height); | |
| 836 | - background-color: var(--wpbc_form-button-background-color-alt,var(--wpbc_form-button-background-color)); | |
| 837 | - border-radius: var(--wpbc_form-button-border-radius); | |
| 838 | - border-style: var(--wpbc_form-button-border-style); | |
| 839 | - border-color: var(--wpbc_form-button-border-color); | |
| 840 | - border-width: var(--wpbc_form-button-border-size); | |
| 841 | - box-shadow: none; | |
| 842 | - color: var(--wpbc_form-button-text-color); | |
| 843 | - padding: 0 var(--wpbc_form-button-size-padding-h); | |
| 941 | +.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary), | |
| 942 | +.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary), | |
| 943 | +.wpbc_booking_ui_theme_scope .wpbc_button, | |
| 944 | +.wpbc_container.wpbc_container_booking_form .wpbc_button, | |
| 945 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light:not(.wpbc_button_gw), | |
| 946 | +.wpbc_container.wpbc_form .wpbc_button, | |
| 947 | +.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_gw), | |
| 948 | +div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary), | |
| 949 | +div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary) { | |
| 950 | + -ms-flex-align: center; | |
| 951 | + align-items: center; | |
| 952 | + appearance: none; | |
| 953 | + border-radius: var(--wpbc_form-button-border-radius,4px); | |
| 954 | + border-style: var(--wpbc_form-button-border-style,solid); | |
| 955 | + border-width: var(--wpbc_form-button-border-size,1px); | |
| 956 | + box-sizing: border-box; | |
| 957 | + cursor: pointer; | |
| 958 | + display: -ms-inline-flexbox; | |
| 959 | + display: inline-flex; | |
| 844 | 960 | font-family: inherit; |
| 961 | + font-size: var(--wpbc_form-button-size-font-size,16px); | |
| 845 | 962 | font-weight: 500; |
| 846 | - font-size: var(--wpbc_form-button-size-font-size); | |
| 847 | - line-height: 100%; | |
| 848 | - cursor: pointer; | |
| 849 | - transition: .15s ease-in-out; | |
| 850 | - position: relative; | |
| 851 | - text-decoration: none | |
| 852 | -} | |
| 853 | -.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(:hover):not(:active), | |
| 854 | -.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(:hover):not(:active), | |
| 855 | -div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(:hover):not(:active), | |
| 856 | -div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(:hover):not(:active) { | |
| 857 | - background-color: var(--wpbc_form-button-background-color-alt,var(--wpbc_form-button-background-color)); | |
| 858 | - color: var(--wpbc_form-button-text-color) | |
| 859 | -} | |
| 860 | -.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):active, | |
| 861 | -.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):focus, | |
| 862 | -.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):hover, | |
| 863 | -.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):active, | |
| 864 | -.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):focus, | |
| 865 | -.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):hover, | |
| 866 | -div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):active, | |
| 867 | -div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):focus, | |
| 868 | -div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):hover, | |
| 869 | -div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):active, | |
| 870 | -div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):focus, | |
| 871 | -div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):hover { | |
| 872 | - background: var(--wpbc_form-button-hover-background-color,linear-gradient(0deg,rgba(0,0,0,.2),rgba(0,0,0,.2)),var(--wpbc_form-button-background-color-alt,var(--wpbc_form-button-background-color))); | |
| 873 | - border-color: var(--wpbc_form-button-hover-border-color,var(--wpbc_form-button-border-color)); | |
| 874 | - color: var(--wpbc_form-button-hover-text-color,var(--wpbc_form-button-text-color)) | |
| 875 | -} | |
| 876 | -.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):focus, | |
| 877 | -.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):focus, | |
| 878 | -div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):focus, | |
| 879 | -div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):focus { | |
| 880 | - outline: 0 | |
| 881 | -} | |
| 882 | -.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):focus:after, | |
| 883 | -.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):focus:after, | |
| 884 | -div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):focus:after, | |
| 885 | -div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):focus:after { | |
| 886 | - content: ""; | |
| 887 | - position: absolute; | |
| 888 | - border: 2px solid var(--wpbc_form-button-background-color); | |
| 889 | - border-radius: calc(var(--wpbc_form-button-border-radius) + 2px); | |
| 890 | - top: calc(-4px - var(--wpbc_form-button-border-size,1px)); | |
| 891 | - right: calc(-4px - var(--wpbc_form-button-border-size,1px)); | |
| 892 | - bottom: calc(-4px - var(--wpbc_form-button-border-size,1px)); | |
| 893 | - left: calc(-4px - var(--wpbc_form-button-border-size,1px)) | |
| 894 | -} | |
| 895 | -.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):disabled, | |
| 896 | -.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):disabled:hover, | |
| 897 | -.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):disabled, | |
| 898 | -.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):disabled:hover, | |
| 899 | -div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):disabled, | |
| 900 | -div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):disabled:hover, | |
| 901 | -div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):disabled, | |
| 902 | -div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):disabled:hover { | |
| 903 | - background-color: var(--wpbc_form-button-background-color-alt,var(--wpbc_form-button-background-color)); | |
| 904 | - cursor: default | |
| 905 | -} | |
| 906 | -/*! -------------------------------------------------------------------------------------------------------------------- | |
| 907 | - * Lightweight buttons | |
| 908 | - * ------------------------------------------------------------------------------------------------------------------ */ | |
| 909 | -.wpbc_container.wpbc_container_booking_form .wpbc_button_light, | |
| 910 | -.wpbc_container.wpbc_form .wpbc_button_light, | |
| 911 | -.wpbc_container.wpbc_form input.wpbc_button_light { | |
| 912 | - font-size: clamp(1em,1em + (1vw - .2em) * .208,1.125em); | |
| 913 | - border: 2px solid var(--wpbc_form-button-light-border-color,rgba(238,238,238,.7098039216)); | |
| 914 | - box-shadow: var(--wpbc_form-button-light-box-shadow,0 2px 10px 2px rgba(255,255,255,.3294117647)); | |
| 915 | - background: var(--wpbc_form-button-light-background-color,#fdfdfd); | |
| 916 | - color: var(--wpbc_form-button-light-text-color,rgba(68,68,68,.8784313725)); | |
| 917 | - border-radius: .375em; | |
| 918 | - padding: 0 2.2em; | |
| 919 | - line-height: calc(var(--wpbc_form-button-light-size-height) - 3px); | |
| 920 | - text-decoration: none; | |
| 921 | - cursor: pointer; | |
| 922 | - outline: 0; | |
| 923 | - display: -ms-flexbox; | |
| 924 | - display: flex; | |
| 925 | - -ms-flex-flow: row wrap; | |
| 926 | - flex-flow: row wrap; | |
| 963 | + height: var(--wpbc_form-button-size-height,41px); | |
| 927 | 964 | -ms-flex-pack: center; |
| 928 | 965 | justify-content: center; |
| 929 | - -ms-flex-align: center; | |
| 930 | - align-items: center; | |
| 966 | + line-height: 1; | |
| 931 | 967 | margin: 0; |
| 932 | - height: auto; | |
| 933 | - box-sizing: border-box; | |
| 968 | + max-width: 100%; | |
| 969 | + min-width: 100px; | |
| 970 | + outline: transparent solid 2px; | |
| 971 | + outline-offset: 2px; | |
| 972 | + padding: 0 var(--wpbc_form-button-size-padding-h,24px); | |
| 973 | + position: relative; | |
| 974 | + text-align: center; | |
| 975 | + text-decoration: none; | |
| 934 | 976 | text-shadow: none; |
| 935 | 977 | text-overflow: ellipsis; |
| 936 | 978 | overflow: hidden; |
| 937 | 979 | overflow-wrap: normal; |
| 980 | + -ms-hyphens: auto; | |
| 981 | + hyphens: auto; | |
| 982 | + transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,color .15s ease-in-out; | |
| 983 | + vertical-align: middle; | |
| 938 | 984 | white-space: normal; |
| 939 | - -ms-hyphens: auto; | |
| 940 | - hyphens: auto | |
| 985 | + width: auto | |
| 941 | 986 | } |
| 942 | -.wpbc_container.wpbc_container_booking_form .wpbc_button_light:focus, | |
| 943 | -.wpbc_container.wpbc_container_booking_form .wpbc_button_light:hover, | |
| 944 | -.wpbc_container.wpbc_form .wpbc_button_light:focus, | |
| 945 | -.wpbc_container.wpbc_form .wpbc_button_light:hover, | |
| 946 | -.wpbc_container.wpbc_form input.wpbc_button_light:focus, | |
| 947 | -.wpbc_container.wpbc_form input.wpbc_button_light:hover { | |
| 948 | - border: 2px solid var(--wpbc_form-button-light-hover-border-color,#4d91cd); | |
| 987 | +/*! -------------------------------------------------------------------------------------------------------------------- | |
| 988 | + * Secondary buttons and legacy `.wpbc_button_light` compatibility | |
| 989 | + * ------------------------------------------------------------------------------------------------------------------ */ | |
| 990 | +.wpbc_booking_ui_theme_scope .wpbc_button.wpbc_button_secondary, | |
| 991 | +.wpbc_container.wpbc_container_booking_form .wpbc_button.wpbc_button_secondary, | |
| 992 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary), | |
| 993 | +.wpbc_container.wpbc_form .wpbc_button.wpbc_button_secondary, | |
| 994 | +.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary) { | |
| 995 | + border-color: var(--wpbc_form-button-light-border-color,rgba(202,202,202,.7098039216)); | |
| 996 | + border-style: var(--wpbc_form-button-light-border-style,solid); | |
| 997 | + border-width: var(--wpbc_form-button-light-border-size,var(--wpbc_form-button-border-size,1px)); | |
| 998 | + box-shadow: var(--wpbc_form-button-light-box-shadow,0 2px 10px 2px rgba(255,255,255,.3294117647)); | |
| 999 | + background: var(--wpbc_form-button-light-background-color,#fdfdfd); | |
| 1000 | + color: var(--wpbc_form-button-light-text-color,rgba(68,68,68,.8784313725)) | |
| 1001 | +} | |
| 1002 | +.wpbc_booking_ui_theme_scope .wpbc_button.wpbc_button_secondary:focus, | |
| 1003 | +.wpbc_booking_ui_theme_scope .wpbc_button.wpbc_button_secondary:hover, | |
| 1004 | +.wpbc_container.wpbc_container_booking_form .wpbc_button.wpbc_button_secondary:focus, | |
| 1005 | +.wpbc_container.wpbc_container_booking_form .wpbc_button.wpbc_button_secondary:hover, | |
| 1006 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):focus, | |
| 1007 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):hover, | |
| 1008 | +.wpbc_container.wpbc_form .wpbc_button.wpbc_button_secondary:focus, | |
| 1009 | +.wpbc_container.wpbc_form .wpbc_button.wpbc_button_secondary:hover, | |
| 1010 | +.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):focus, | |
| 1011 | +.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):hover { | |
| 1012 | + border-color: var(--wpbc_form-button-light-hover-border-color,#4d91cd); | |
| 949 | 1013 | box-shadow: var(--wpbc_form-button-light-hover-box-shadow,var(--wpbc_form-button-light-box-shadow,0 2px 10px 2px rgba(255,255,255,.3294117647))); |
| 950 | 1014 | background-color: var(--wpbc_form-button-light-hover-background-color,var(--wpbc_form-button-light-background-color,#fdfdfd)); |
| 951 | 1015 | color: var(--wpbc_form-button-light-hover-text-color,var(--wpbc_form-button-light-text-color,rgba(68,68,68,.8784313725))) |
| 952 | 1016 | } |
| 953 | -.wpbc_container.wpbc_container_booking_form .wpbc_button_light.button-primary { | |
| 954 | - background: var(--wpbc_form-button-background-color,#066aab); | |
| 1017 | +/*! -------------------------------------------------------------------------------------------------------------------- | |
| 1018 | + * Primary buttons | |
| 1019 | + * | |
| 1020 | + * `.wpbc_button_light.button-primary` remains as a legacy alias. Do not use | |
| 1021 | + * WordPress' generic `.button-primary` class in new public-facing markup. | |
| 1022 | + * ------------------------------------------------------------------------------------------------------------------ */ | |
| 1023 | +.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary), | |
| 1024 | +.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary), | |
| 1025 | +.wpbc_booking_ui_theme_scope .wpbc_button.wpbc_button_primary, | |
| 1026 | +.wpbc_container.wpbc_container_booking_form .wpbc_button.wpbc_button_primary, | |
| 1027 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light.button-primary, | |
| 1028 | +.wpbc_container.wpbc_form .wpbc_button.wpbc_button_primary, | |
| 1029 | +div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary), | |
| 1030 | +div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary) { | |
| 1031 | + background: var(--wpbc_form-button-background-color-alt,var(--wpbc_form-button-background-color,#066aab)); | |
| 1032 | + border-color: var(--wpbc_form-button-border-color,#066aab); | |
| 1033 | + border-style: var(--wpbc_form-button-primary-border-style,var(--wpbc_form-button-border-style,solid)); | |
| 1034 | + box-shadow: none; | |
| 955 | 1035 | color: var(--wpbc_form-button-text-color,#fff) |
| 956 | 1036 | } |
| 1037 | +.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):active, | |
| 1038 | +.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):focus, | |
| 1039 | +.wp-core-ui div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):hover, | |
| 1040 | +.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):active, | |
| 1041 | +.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):focus, | |
| 1042 | +.wp-core-ui div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):hover, | |
| 1043 | +.wpbc_booking_ui_theme_scope .wpbc_button.wpbc_button_primary:active, | |
| 1044 | +.wpbc_booking_ui_theme_scope .wpbc_button.wpbc_button_primary:focus, | |
| 1045 | +.wpbc_booking_ui_theme_scope .wpbc_button.wpbc_button_primary:hover, | |
| 1046 | +.wpbc_container.wpbc_container_booking_form .wpbc_button.wpbc_button_primary:active, | |
| 1047 | +.wpbc_container.wpbc_container_booking_form .wpbc_button.wpbc_button_primary:focus, | |
| 1048 | +.wpbc_container.wpbc_container_booking_form .wpbc_button.wpbc_button_primary:hover, | |
| 957 | 1049 | .wpbc_container.wpbc_container_booking_form .wpbc_button_light.button-primary:active, |
| 958 | 1050 | .wpbc_container.wpbc_container_booking_form .wpbc_button_light.button-primary:focus, |
| 959 | -.wpbc_container.wpbc_container_booking_form .wpbc_button_light.button-primary:hover { | |
| 960 | - background: var(--wpbc_form-button-hover-background-color,var(--wpbc_form-button-background-color,#066aab)); | |
| 1051 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light.button-primary:hover, | |
| 1052 | +.wpbc_container.wpbc_form .wpbc_button.wpbc_button_primary:active, | |
| 1053 | +.wpbc_container.wpbc_form .wpbc_button.wpbc_button_primary:focus, | |
| 1054 | +.wpbc_container.wpbc_form .wpbc_button.wpbc_button_primary:hover, | |
| 1055 | +div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):active, | |
| 1056 | +div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):focus, | |
| 1057 | +div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):hover, | |
| 1058 | +div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):active, | |
| 1059 | +div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):focus, | |
| 1060 | +div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):hover { | |
| 1061 | + background: var(--wpbc_form-button-hover-background-color,linear-gradient(0deg,rgba(0,0,0,.2),rgba(0,0,0,.2)),var(--wpbc_form-button-background-color-alt,var(--wpbc_form-button-background-color,#066aab))); | |
| 961 | 1062 | color: var(--wpbc_form-button-hover-text-color,var(--wpbc_form-button-text-color,#fff)); |
| 962 | - border-color: var(--wpbc_form-button-hover-border-color,var(--wpbc_form-button-primary-hover-border-color,#fff)); | |
| 963 | - box-shadow: 0 0 0 2px var(--wpbc_form-button-background-color,#066aab) | |
| 1063 | + border-color: var(--wpbc_form-button-hover-border-color,var(--wpbc_form-button-primary-hover-border-color,#fff)) | |
| 964 | 1064 | } |
| 965 | -.wpbc_container.wpbc_container_booking_form .wpbc_button_light:active:not(:disabled) { | |
| 1065 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):active:not(:disabled) { | |
| 966 | 1066 | background-color: var(--wpbc_form-button-light-hover-background-color,var(--wpbc_form-button-light-background-color,#fdfdfd)); |
| 967 | - border: 2px solid var(--wpbc_form-button-light-hover-border-color,var(--wpbc_form-button-light-border-color,rgba(238,238,238,.7098039216))); | |
| 1067 | + border-color: var(--wpbc_form-button-light-hover-border-color,var(--wpbc_form-button-light-border-color,rgba(202,202,202,.7098039216))); | |
| 968 | 1068 | color: var(--wpbc_form-button-light-hover-text-color,var(--wpbc_form-button-light-text-color,rgba(68,68,68,.8784313725))); |
| 969 | 1069 | cursor: pointer |
| 970 | 1070 | } |
| 971 | -.wpbc_container.wpbc_container_booking_form .wpbc_button_light:disabled, | |
| 972 | -.wpbc_container.wpbc_container_booking_form .wpbc_button_light:disabled:focus, | |
| 973 | -.wpbc_container.wpbc_container_booking_form .wpbc_button_light:disabled:hover { | |
| 1071 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):disabled, | |
| 1072 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):disabled:focus, | |
| 1073 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):disabled:hover, | |
| 1074 | +.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):disabled, | |
| 1075 | +.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):disabled:focus, | |
| 1076 | +.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):disabled:hover { | |
| 974 | 1077 | color: #ccc; |
| 975 | - border: 2px solid rgba(238,238,238,.7098039216); | |
| 976 | - cursor: not-allowed | |
| 1078 | + border-color: var(--wpbc_form-button-light-border-color,rgba(202,202,202,.7098039216)); | |
| 1079 | + cursor: not-allowed; | |
| 1080 | + opacity: .6 | |
| 977 | 1081 | } |
| 1082 | +.wpbc_booking_ui_theme_scope .wpbc_button:disabled, | |
| 1083 | +.wpbc_container.wpbc_container_booking_form .wpbc_button:disabled, | |
| 1084 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light.button-primary:disabled, | |
| 1085 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light.wpbc_button_primary:disabled, | |
| 1086 | +.wpbc_container.wpbc_form .wpbc_button:disabled, | |
| 1087 | +.wpbc_container.wpbc_form .wpbc_button_light.button-primary:disabled, | |
| 1088 | +.wpbc_container.wpbc_form .wpbc_button_light.wpbc_button_primary:disabled, | |
| 1089 | +div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):disabled, | |
| 1090 | +div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):disabled { | |
| 1091 | + cursor: not-allowed; | |
| 1092 | + opacity: .6 | |
| 1093 | +} | |
| 978 | 1094 | .wpbc_container.wpbc_container_booking_form .wpbc_button_light.wpbc_button_danger { |
| 979 | 1095 | background: #de605c; |
| 980 | 1096 | border-color: #de605c; |
| 981 | 1097 | color: #f7f7f7; |
| @@ -991,8 +1107,16 @@ | ||
| 991 | 1107 | /*! -------------------------------------------------------------------------------------------------------------------- |
| 992 | 1108 | * Payment gateway buttons |
| 993 | 1109 | * ------------------------------------------------------------------------------------------------------------------ */ |
| 994 | 1110 | .wpbc_container .wpbc_button_light.wpbc_button_gw { |
| 1111 | + font-size: var(--wpbc_form-button-size-font-size,16px); | |
| 1112 | + border-style: solid; | |
| 1113 | + border-width: 2px; | |
| 1114 | + border-radius: .375em; | |
| 1115 | + padding: 0 2.2em; | |
| 1116 | + line-height: calc(var(--wpbc_form-button-light-size-height,43px) - 3px); | |
| 1117 | + text-decoration: none; | |
| 1118 | + cursor: pointer; | |
| 995 | 1119 | -ms-flex: 1 1 100%; |
| 996 | 1120 | flex: 1 1 100%; |
| 997 | 1121 | display: -ms-flexbox; |
| 998 | 1122 | display: flex; |
| @@ -1001,8 +1125,20 @@ | ||
| 1001 | 1125 | -ms-flex-pack: start; |
| 1002 | 1126 | justify-content: flex-start; |
| 1003 | 1127 | -ms-flex-align: center; |
| 1004 | 1128 | align-items: center; |
| 1129 | + margin: 0; | |
| 1130 | + height: auto; | |
| 1131 | + outline: transparent solid 2px; | |
| 1132 | + outline-offset: 2px; | |
| 1133 | + box-sizing: border-box; | |
| 1134 | + text-shadow: none; | |
| 1135 | + text-overflow: ellipsis; | |
| 1136 | + overflow: hidden; | |
| 1137 | + overflow-wrap: normal; | |
| 1138 | + white-space: normal; | |
| 1139 | + -ms-hyphens: auto; | |
| 1140 | + hyphens: auto; | |
| 1005 | 1141 | width: 100% |
| 1006 | 1142 | } |
| 1007 | 1143 | .wpbc_container .wpbc_button_light.wpbc_button_gw.wpbc_button_gw_stripe, |
| 1008 | 1144 | .wpbc_container .wpbc_button_light.wpbc_button_gw.wpbc_button_gw_stripe:focus, |
| @@ -1018,15 +1154,24 @@ | ||
| 1018 | 1154 | .wpbc_container .wpbc_button_light.wpbc_button_gw.wpbc_button_gw_stripe.wpbc_button_gw_bccom:hover { |
| 1019 | 1155 | background-image: url(../../../../booking-calendar-com/inc/assets/stripe.svg); |
| 1020 | 1156 | background-color: #2c2e2f; |
| 1021 | 1157 | color: #fff; |
| 1022 | - border-color: #2c2e2f | |
| 1158 | + border-color: #2c2e2f; | |
| 1159 | + background-position: 90% 50%; | |
| 1160 | + background-size: 80px auto; | |
| 1161 | + background-repeat: no-repeat; | |
| 1162 | + padding-right: 130px | |
| 1023 | 1163 | } |
| 1024 | 1164 | .wpbc_container .wpbc_button_light.wpbc_button_gw.wpbc_button_gw_stripe.wpbc_button_gw_bccom:focus, |
| 1025 | 1165 | .wpbc_container .wpbc_button_light.wpbc_button_gw.wpbc_button_gw_stripe.wpbc_button_gw_bccom:hover { |
| 1026 | 1166 | filter: brightness(1.3); |
| 1027 | - border: 2px solid var(--wpbc_form-button-light-hover-border-color,#4d91cd); | |
| 1028 | - box-shadow: var(--wpbc_form-button-light-hover-box-shadow,var(--wpbc_form-button-light-box-shadow,0 2px 10px 2px rgba(255,255,255,.3294117647))) | |
| 1167 | + border: 1px solid var(--wpbc_form-button-light-hover-border-color,#4d91cd); | |
| 1168 | + border-width: var(--wpbc_form-button-light-border-size,var(--wpbc_form-button-border-size,1px)); | |
| 1169 | + box-shadow: var(--wpbc_form-button-light-hover-box-shadow,var(--wpbc_form-button-light-box-shadow,0 2px 10px 2px rgba(255,255,255,.3294117647))); | |
| 1170 | + box-shadow: none; | |
| 1171 | + outline-offset: 0; | |
| 1172 | + outline-color: var(--wpbc_form-button-light-hover-border-color,#4d91cd); | |
| 1173 | + outline-width: 1px | |
| 1029 | 1174 | } |
| 1030 | 1175 | .wpbc_container .wpbc_button_light.wpbc_button_gw.wpbc_button_gw_stripe, |
| 1031 | 1176 | .wpbc_container .wpbc_button_light.wpbc_button_gw.wpbc_button_gw_stripe * { |
| 1032 | 1177 | color: var(--wpbc_form-button-light-text-color,#fff) |
| @@ -1141,29 +1286,25 @@ | ||
| 1141 | 1286 | } |
| 1142 | 1287 | /*! -------------------------------------------------------------------------------------------------------------------- |
| 1143 | 1288 | * Dark style button overrides |
| 1144 | 1289 | * ------------------------------------------------------------------------------------------------------------------ */ |
| 1145 | -.wpbc_theme_dark_1.wpbc_bfb__theme_scope .wpbc_button_light, | |
| 1146 | -.wpbc_theme_dark_1.wpbc_container.wpbc_form .wpbc_button_light { | |
| 1290 | +.wpbc_theme_dark_1.wpbc_bfb__theme_scope .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary), | |
| 1291 | +.wpbc_theme_dark_1.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary) { | |
| 1147 | 1292 | box-shadow: var(--wpbc_form-button-light-box-shadow,0 0 0 #424242); |
| 1148 | - border: 2px solid var(--wpbc_form-button-light-border-color,#2c2e2f); | |
| 1149 | - background-color: var(--wpbc_form-button-light-background-color,#2c2e2f); | |
| 1293 | + border-color: var(--wpbc_form-button-light-border-color,#525252); | |
| 1294 | + background-color: var(--wpbc_form-button-light-background-color,#3f454f); | |
| 1150 | 1295 | color: var(--wpbc_form-button-light-text-color,#fff); |
| 1151 | 1296 | filter: none |
| 1152 | 1297 | } |
| 1153 | -.wpbc_theme_dark_1.wpbc_bfb__theme_scope .wpbc_button_light:focus, | |
| 1154 | -.wpbc_theme_dark_1.wpbc_bfb__theme_scope .wpbc_button_light:hover, | |
| 1155 | -.wpbc_theme_dark_1.wpbc_container.wpbc_form .wpbc_button_light:focus, | |
| 1156 | -.wpbc_theme_dark_1.wpbc_container.wpbc_form .wpbc_button_light:hover { | |
| 1298 | +.wpbc_theme_dark_1.wpbc_bfb__theme_scope .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):focus, | |
| 1299 | +.wpbc_theme_dark_1.wpbc_bfb__theme_scope .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):hover, | |
| 1300 | +.wpbc_theme_dark_1.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):focus, | |
| 1301 | +.wpbc_theme_dark_1.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):hover { | |
| 1157 | 1302 | box-shadow: var(--wpbc_form-button-light-hover-box-shadow,0 0 0 #424242); |
| 1158 | - border: 2px solid var(--wpbc_form-button-light-hover-border-color,var(--wpbc_form-button-light-border-color,#2c2e2f)); | |
| 1159 | - background-color: var(--wpbc_form-button-light-hover-background-color,var(--wpbc_form-button-light-background-color,#2c2e2f)); | |
| 1303 | + border-color: var(--wpbc_form-button-light-hover-border-color,var(--wpbc_form-button-light-border-color,#525252)); | |
| 1304 | + background-color: var(--wpbc_form-button-light-hover-background-color,var(--wpbc_form-button-light-background-color,#3f454f)); | |
| 1160 | 1305 | color: var(--wpbc_form-button-light-hover-text-color,#fff) |
| 1161 | 1306 | } |
| 1162 | -.wpbc_theme_dark_1.wpbc_bfb__theme_scope .wpbc_button_light:hover, | |
| 1163 | -.wpbc_theme_dark_1.wpbc_container.wpbc_form .wpbc_button_light:hover { | |
| 1164 | - filter: brightness(1.2) | |
| 1165 | -} | |
| 1166 | 1307 | .wpbc_theme_dark_1.wpbc_bfb__theme_scope .wpbc_button_light[class*=wpbc_button_gw_paypal_]:hover, |
| 1167 | 1308 | .wpbc_theme_dark_1.wpbc_container.wpbc_form .wpbc_button_light[class*=wpbc_button_gw_paypal_]:hover { |
| 1168 | 1309 | filter: none |
| 1169 | 1310 | } |
| @@ -1176,11 +1317,48 @@ | ||
| 1176 | 1317 | .wpbc_theme_dark_1.wpbc_bfb__theme_scope .wpbc_button_light.wpbc_button_gw.wpbc_button_gw_stripe:focus, |
| 1177 | 1318 | .wpbc_theme_dark_1.wpbc_bfb__theme_scope .wpbc_button_light.wpbc_button_gw.wpbc_button_gw_stripe:hover, |
| 1178 | 1319 | .wpbc_theme_dark_1.wpbc_container.wpbc_form .wpbc_button_light.wpbc_button_gw.wpbc_button_gw_stripe:focus, |
| 1179 | 1320 | .wpbc_theme_dark_1.wpbc_container.wpbc_form .wpbc_button_light.wpbc_button_gw.wpbc_button_gw_stripe:hover { |
| 1180 | - background-color: var(--wpbc_form-button-light-background-color,#2c2e2f); | |
| 1181 | - border-color: var(--wpbc_form-button-light-border-color,#2c2e2f) | |
| 1321 | + background-color: var(--wpbc_form-button-light-background-color,#3f454f); | |
| 1322 | + border-color: var(--wpbc_form-button-light-border-color,#525252) | |
| 1182 | 1323 | } |
| 1324 | +/*! -------------------------------------------------------------------------------------------------------------------- | |
| 1325 | + * Final focus contract | |
| 1326 | + * | |
| 1327 | + * Keep this after legacy, gateway, and dark-theme rules. The inner box-shadow | |
| 1328 | + * plus the outer outline create a stable two-layer focus ring without | |
| 1329 | + * changing button geometry. | |
| 1330 | + * ------------------------------------------------------------------------------------------------------------------ */ | |
| 1331 | +.wpbc_booking_ui_theme_scope .wpbc_button.wpbc_button_secondary:focus-visible:not(:disabled), | |
| 1332 | +.wpbc_booking_ui_theme_scope .wpbc_button.wpbc_button_secondary:focus:not(:disabled), | |
| 1333 | +.wpbc_container.wpbc_container_booking_form .wpbc_button.wpbc_button_secondary:focus-visible:not(:disabled), | |
| 1334 | +.wpbc_container.wpbc_container_booking_form .wpbc_button.wpbc_button_secondary:focus:not(:disabled), | |
| 1335 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):focus-visible:not(:disabled), | |
| 1336 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):focus:not(:disabled), | |
| 1337 | +.wpbc_container.wpbc_form .wpbc_button.wpbc_button_secondary:focus-visible:not(:disabled), | |
| 1338 | +.wpbc_container.wpbc_form .wpbc_button.wpbc_button_secondary:focus:not(:disabled), | |
| 1339 | +.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):focus-visible:not(:disabled), | |
| 1340 | +.wpbc_container.wpbc_form .wpbc_button_light:not(.wpbc_button_primary):not(.button-primary):focus:not(:disabled) { | |
| 1341 | + box-shadow: 0 0 0 2px var(--wpbc_form-button-focus-inner-color,var(--wpbc-bfb-form-background,var(--wpbc_form-field-background-color,#fff))); | |
| 1342 | + outline: 2px solid var(--wpbc_form-button-focus-outline-color,var(--wpbc_form-button-light-hover-border-color,#4d91cd)); | |
| 1343 | + outline-offset: 2px | |
| 1344 | +} | |
| 1345 | +.wpbc_booking_ui_theme_scope .wpbc_button.wpbc_button_primary:focus-visible:not(:disabled), | |
| 1346 | +.wpbc_booking_ui_theme_scope .wpbc_button.wpbc_button_primary:focus:not(:disabled), | |
| 1347 | +.wpbc_container.wpbc_container_booking_form .wpbc_button.wpbc_button_primary:focus-visible:not(:disabled), | |
| 1348 | +.wpbc_container.wpbc_container_booking_form .wpbc_button.wpbc_button_primary:focus:not(:disabled), | |
| 1349 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light.button-primary:focus-visible:not(:disabled), | |
| 1350 | +.wpbc_container.wpbc_container_booking_form .wpbc_button_light.button-primary:focus:not(:disabled), | |
| 1351 | +.wpbc_container.wpbc_form .wpbc_button.wpbc_button_primary:focus-visible:not(:disabled), | |
| 1352 | +.wpbc_container.wpbc_form .wpbc_button.wpbc_button_primary:focus:not(:disabled), | |
| 1353 | +div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):focus-visible:not(:disabled), | |
| 1354 | +div.wpbc_container.wpbc_form button[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):focus:not(:disabled), | |
| 1355 | +div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):focus-visible:not(:disabled), | |
| 1356 | +div.wpbc_container.wpbc_form input[type=submit]:not(.wpbc_button_light):not(.wpbc_button_secondary):focus:not(:disabled) { | |
| 1357 | + box-shadow: 0 0 0 2px var(--wpbc_form-button-focus-inner-color,var(--wpbc-bfb-form-background,var(--wpbc_form-field-background-color,#fff))); | |
| 1358 | + outline: 2px solid var(--wpbc_form-button-focus-outline-color,var(--wpbc_form-field-focus-border-color,var(--wpbc_form-button-background-color,#066aab))); | |
| 1359 | + outline-offset: 2px | |
| 1360 | +} | |
| 1183 | 1361 | .wpdev-form-control-wrap .wpdev-checkbox.group_inline, |
| 1184 | 1362 | .wpdev-form-control-wrap .wpdev-radio.group_inline, |
| 1185 | 1363 | .wpdev-form-control-wrap.group_inline [role=checkboxgroup], |
| 1186 | 1364 | .wpdev-form-control-wrap.group_inline [role=radiogroup] { |
| @@ -1399,9 +1577,9 @@ | ||
| 1399 | 1577 | word-break: normal |
| 1400 | 1578 | } |
| 1401 | 1579 | .wpbc_theme_dark_1 .wpbc_wizard__border_container { |
| 1402 | 1580 | border: var(--wpbc-bfb-form-border-width,1px) solid var(--wpbc-bfb-form-border-color,#000); |
| 1403 | - background: var(--wpbc-bfb-form-background,#626262); | |
| 1581 | + background: var(--wpbc-bfb-form-background,#383a3d); | |
| 1404 | 1582 | color: var(--wpbc_form-label-color,#bbb); |
| 1405 | 1583 | box-shadow: var(--wpbc-bfb-form-box-shadow,0 0 3px #3b3b3b) |
| 1406 | 1584 | } |
| 1407 | 1585 | .wpbc_theme_dark_1 .wpbc_wizard__border_container div:not(.datepick-inline*), |
| @@ -1420,8 +1598,9 @@ | ||
| 1420 | 1598 | } |
| 1421 | 1599 | div.wpbc_container.wpbc_form.wpbc_theme_dark_1 .wpbc_field_description, |
| 1422 | 1600 | div.wpbc_container.wpbc_form.wpbc_theme_dark_1 .wpbc_static_text, |
| 1423 | 1601 | div.wpbc_container.wpbc_form.wpbc_theme_dark_1 .wpdev-list-item-label, |
| 1602 | +div.wpbc_container.wpbc_form.wpbc_theme_dark_1 .wpdev_hint_with_text .block_text, | |
| 1424 | 1603 | div.wpbc_container.wpbc_form.wpbc_theme_dark_1 l, |
| 1425 | 1604 | div.wpbc_container.wpbc_form.wpbc_theme_dark_1 label, |
| 1426 | 1605 | div.wpbc_container.wpbc_form.wpbc_theme_dark_1 p { |
| 1427 | 1606 | color: var(--wpbc_form-label-color,#bbb) |
| @@ -1426,9 +1605,9 @@ | ||
| 1426 | 1605 | div.wpbc_container.wpbc_form.wpbc_theme_dark_1 p { |
| 1427 | 1606 | color: var(--wpbc_form-label-color,#bbb) |
| 1428 | 1607 | } |
| 1429 | 1608 | div.wpbc_container.wpbc_form.wpbc_theme_dark_1 { |
| 1430 | - --wpbc-bfb-form-background: #626262; | |
| 1609 | + --wpbc-bfb-form-background: #383a3d; | |
| 1431 | 1610 | --wpbc-bfb-form-border-color: #000000; |
| 1432 | 1611 | --wpbc-bfb-form-box-shadow: 0 0px 3px #3b3b3b; |
| 1433 | 1612 | --wpbc_form-field-background-color: #3f454f; |
| 1434 | 1613 | --wpbc_form-field-border-color: rgba(255, 255, 255, 0.28); |
| @@ -1440,25 +1619,32 @@ | ||
| 1440 | 1619 | --wpbc_form-field-menu-color: #303640; |
| 1441 | 1620 | --wpbc_form-label-color: #f4f6f8; |
| 1442 | 1621 | --wpbc_form-label-sublabel-color: rgba(255, 255, 255, 0.72); |
| 1443 | 1622 | --wpbc_form-label-error-color: #ff8a8a; |
| 1444 | - --wpbc_form-button-background-color: #4d4d4d; | |
| 1445 | - --wpbc_form-button-background-color-alt: #4d4d4d; | |
| 1623 | + --wpbc_form-button-background-color: #1b1d22; | |
| 1624 | + --wpbc_form-button-background-color-alt: #1b1d22; | |
| 1446 | 1625 | --wpbc_form-button-border-color: #5f5f5f; |
| 1626 | + --wpbc_form-button-primary-border-style: solid; | |
| 1447 | 1627 | --wpbc_form-button-text-color: #ffffff; |
| 1448 | 1628 | --wpbc_form-button-text-color-alt: #ffffff; |
| 1629 | + --wpbc_form-button-hover-background-color: #1b1d22; | |
| 1630 | + --wpbc_form-button-hover-border-color: #5b8bff; | |
| 1631 | + --wpbc_form-button-hover-text-color: #ffffff; | |
| 1449 | 1632 | --wpbc_form-choice-checked-border-color: #5b8bff; |
| 1450 | 1633 | --wpbc_form-choice-checked-color: #f4f6f8; |
| 1451 | 1634 | --wpbc_form-choice-focus-color: #5b8bff; |
| 1452 | - --wpbc_form-button-light-background-color: #2C2E2F; | |
| 1453 | - --wpbc_form-button-light-border-color: #2C2E2F; | |
| 1635 | + --wpbc_form-button-light-background-color: #3f454f; | |
| 1636 | + --wpbc_form-button-light-border-color: #525252; | |
| 1454 | 1637 | --wpbc_form-button-light-text-color: #ffffff; |
| 1455 | 1638 | --wpbc_form-button-light-box-shadow: 0 0 0 #424242; |
| 1456 | - --wpbc_form-button-light-hover-background-color: #2C2E2F; | |
| 1457 | - --wpbc_form-button-light-hover-border-color: #2C2E2F; | |
| 1639 | + --wpbc_form-button-light-hover-background-color: #3f454f; | |
| 1640 | + --wpbc_form-button-light-hover-border-color: #5b8bff; | |
| 1458 | 1641 | --wpbc_form-button-light-hover-text-color: #ffffff; |
| 1459 | 1642 | --wpbc_form-button-light-hover-box-shadow: 0 0 0 #424242; |
| 1460 | - --wpbc_form-button-primary-hover-border-color: #ffffff; | |
| 1643 | + --wpbc-appointment-provider-avatar-background: #2C2E2F; | |
| 1644 | + --wpbc-appointment-provider-avatar-border-color: #525252; | |
| 1645 | + --wpbc-appointment-provider-avatar-text-color: #ffffff; | |
| 1646 | + --wpbc_form-button-primary-hover-border-color: #5b8bff; | |
| 1461 | 1647 | --wpbc_form-page-break-color: #5f9ee7 |
| 1462 | 1648 | } |
| 1463 | 1649 | .wpbc_cal_powered_by, |
| 1464 | 1650 | .wpbc_cal_powered_by a { |
| @@ -1465,8 +1651,15 @@ | ||
| 1465 | 1651 | font-size: 7px; |
| 1466 | 1652 | text-align: left; |
| 1467 | 1653 | margin: 0 0 10px; |
| 1468 | 1654 | text-shadow: none |
| 1655 | +} | |
| 1656 | +.wpbc_range_selection_guidance { | |
| 1657 | + box-sizing: border-box; | |
| 1658 | + max-width: 341px; | |
| 1659 | + overflow-wrap: anywhere; | |
| 1660 | + white-space: normal; | |
| 1661 | + display: block | |
| 1469 | 1662 | } |
| 1470 | 1663 | .wpbc_range_selection_guidance, |
| 1471 | 1664 | .wpbc_range_selection_guidance.wpbc_front_end__message.wpbc_fe_message_info i.menu_icon { |
| 1472 | 1665 | border: 0; |
