/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

:root {
	--attention-color: #ff9f1c;
	--attention-color-hover: #ffb54f;
}

.form--light,
.form--dark {
  max-width: 100%;
}

/* Tabs */
.form--light .wsf-form ul.wsf-group-tabs > li > a,
.form--dark .wsf-form ul.wsf-group-tabs > li > a {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.form--light .wsf-form ul.wsf-group-tabs > li:not(.wsf-tab-active) > a:hover {
  background-color: var(--primary-trans-30);
}

/* body .wsf-form ul.wsf-group-tabs > li > a,
body .wsf-form fieldset.wsf-section > legend {
  font-family: 'Albert Sans';
  text-transform: uppercase;
} */

/* --------- */


/* This should match the ACSS <label> style */
.wsf-form fieldset.wsf-section.sub-section > legend {
  text-transform: inherit;
}

.full-width-message .wsf-alert {
  width: 100%;
}


/* Repeatable Sections */
.wsform-repeater-snug:not(:last-child) {
	margin-bottom: 0 !important;
}

.wsform-repeater-snug + *:not(.wsform-repeater-snug) {
	margin-top: var(--space-l); /* This should match ACSS "Fieldset Bottom Margin" value */
}

.wsf-section-delete:not(.wsf-section-delete-disabled) svg path {
  fill: #bc1b1b !important;
}

.custom-wsform-repeater__row-heading h2,
.custom-wsform-repeater__row-heading h3 {
  color: var(--primary);
}

.custom-wsform-repeater__row-heading .custom-wsform-repeater__row-heading-name {
  color: var(--accent);
}

@media screen and (min-width: 576px) {
  .custom-wsform-repeater__row-heading .custom-wsform-repeater__row-heading-line-break {
    display: none;
  }
}

@media screen and (max-width: 575px) {  
  .custom-wsform-repeater__icon-wrapper.custom-wsform-repeater__icon-wrapper--remove {
    order: -1;
  }

  .custom-wsform-repeater__icon-wrapper .wsf-section-icons {
    justify-content: flex-start !important;
  }
}

.custom-wsform-repeater__row-divider {
  padding-top: var(--space-l);
  padding-bottom: var(--space-l);
  margin-bottom: 0 !important;
  width: 40%;
}

.custom-wsform-repeater__row-divider hr {
  border-top: 2px solid var(--primary);
  width: 33%;
  min-width: 230px;
  margin-left: 0;
}
/* --------- */


/* Horizontal line */
.wsf-form hr {
  border: none;
  border-top: 1px solid #000;
}


/* Radios */
.form--light .wsf-form [data-type="radio"] > div:not(.wsf-grid) > div + div,
.form--light .wsf-form [data-type="price_radio"] > div:not(.wsf-grid) > div + div {
  margin-block-start: 0;
}

.wsf-field-wrapper[data-type="radio"] [role="radiogroup"] {
	min-height: 5rem;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 2rem;
}

body input[type="radio"].wsf-field + label.wsf-label::before,
body input[type="radio"].wsf-field + label.wsf-label::after {
	width: 16px;
	height: 16px;
}

.form--light .wsf-form input[type="radio"].wsf-field + label.wsf-label,
.form--dark .wsf-form input[type="radio"].wsf-field + label.wsf-label {
	display: flex;
	align-items: center;
}

body input[type="radio"].wsf-field + label.wsf-label::after {
	top: auto;
}

body .wsf-inline {
	margin-inline-end: var(--space-l) !important;
}
/* --------- */


/* Buttons */
.wsform-copy-to-clipboard {
	margin-bottom: 0 !important;
	text-align: right;
}

.wsform-copy-to-clipboard button {
	padding: 0.35em 1em !important;
	min-height: 3.5rem !important;
	font-size: var(--text-s) !important;
}

.form--light .wsf-form button.wsf-button.wsf-button-success {
	background-color: var(--success);
	border-color: var(--success);
}

.form--light .wsf-form button.wsf-button.wsf-button-success:hover {
	background-color: var(--success-hover);
	border-color: var(--success-hover);
}


/* Alerts */
.form--light .wsf-form .wsf-alert.wsf-alert-information {
	max-width: 80ch;
	width: 100%;
}

.confirm-form-message {
	margin-bottom: 0 !important;
}

.confirm-form-message .wsf-alert {
	border: none !important;
	font-size: var(--text-m);
	width: 100%;
}

.confirm-form-message .wsf-alert h3 {
	font-size: var(--h2);
}

/* Save URL message - external to form - needs to be message type of none. This selector targets elements which have ONE CLASS ONLY, specifically wsf-alert. DEPRECATED? */
/* :not(form) [class="wsf-alert"] {
	overflow: auto;
	white-space: nowrap;
} */

/* Save URL in-form message */
form.wsf-form [data-sb="saved-form-url-wrapper"] {
	overflow: auto;
	padding-top: var(--space-s);
	padding-bottom: var(--space-s);
	width: 100%;
}


@media (min-width: 576px) {
	.wsf-form .wsf-field-wrapper[data-type="radio"] [role="radiogroup"]:first-child {
		align-items: flex-start;
	}
}

.copy-confirmation-popup {
	position: fixed;
	inset: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-width: 310px;
	margin: 0 auto;
}