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

/* wsform */
.wsf-field-wrapper {
	margin-bottom: 30px !important;
}
.wsf-form input, .wsf-form textarea, span.select2-selection {
	background-color: #222222 !important;
	border: 1px solid #222222 !important;
	color: var(--white) !important;
	padding-inline: calc(.8 * var(--space-m)) !important;
	padding-block: 20px !important;
	height: auto !important;
	border-radius: 8px !important;
	font-size: 16px !important;
}
@media (max-width: 767px) {
	.wsf-form input, .wsf-form textarea {
		padding-block: 14px !important;
		font-size: 14px !important;
	}
}
.wsf-form input:placeholder, .wsf-form textarea:placeholder {
	color: #878787 !imponrtant;
}
select.wsf-field ~ .select2-container .select2-selection--single .select2-selection__placeholder, select.wsf-field ~ .select2-container .select2-selection--multiple .select2-selection__placeholder {
    color: #878787 !important;
}
select.wsf-field ~ .select2-container .select2-selection--single .select2-selection__rendered, select.wsf-field ~ .select2-container .select2-selection--multiple .select2-selection__rendered {
    color: var(--white) !important;
}
.wsf-form input:focus, .wsf-form input:focus-visible, .wsf-form textarea:focus, .wsf-form textarea:focus-visible {
	border: 1px solid var(--primary) !important;
}
.wsf-form textarea {
	padding-right: calc(54px + var(--space-m)) !important;
}
.wsf-form textarea:after {
	content: "";
	height:14px;
	width:14px;
	background: url('/wp-content/uploads/2024/05/textarea-handle.svg');
	
}
.wsf-form label.wsf-label {
	font-size: var(--text-m) !important;
	color: var(--white) !important;
	margin-bottom: 10px;
}
.wsf-tile {
	padding: 0 !important;
}
.wsf-tile[data-type="textarea"] small {
	color: #878787 !important;
	position:absolute;
	top: calc(23px + var(--space-m)) !important;
	right: var(--space-m) !important;
	margin-top: 0 !important;
}
.wsf-text-danger {
	color: var(--white) !important;
}
div[data-type="submit"] {
	display: flex;
	justify-content: end !important;
	margin: 0 !important;
}
.wsf-button {
	border: 1px solid var(--primary) !important;
	transition: all .25s !important;
	padding-block: var(--btn-padding-block) !important;
	padding-inline: var(--btn-padding-inline) !important;
	font-weight: 600 !important;
	border-radius: 8px !important;
}
.wsf-grid {
	margin: 0 !important;
}

input[type=checkbox].wsf-field:checked + label.wsf-label:before {
	background-color: var(--primary) !important;
	border-color: var(--primary) !important;
}

input[type=checkbox].wsf-field:checked + label.wsf-label:after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23000000' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e") !important
}


/* Button mousedown */

.btn--primary:active:hover {
	background-color: #AFFDF3 !important;
	border-color: #AFFDF3 !important;
}
.btn--secondary:active:hover {
	background-color: #1E1E1E !important;
	border-color: #1E1E1E !important;
}
.brxe-button[disabled] {
	pointer-events: none;
	background: transparent !important;
	border-color: #595959 !important;
	color: #595959 !important;
}
.select2-container--open .wsf-select2-dropdown.select2-dropdown--below {
    background: transparent;
}
.wsf-select2-dropdown .select2-search--dropdown {
    padding: 0 !important;
    margin: 0 !important;
}
.select2-container--open .wsf-select2-dropdown.select2-dropdown--below {
    border: none !important;
}
.wsf-select2-dropdown .select2-results .select2-results__option {
    padding: 20px 24px !important;
	color: var(--white) !important;
	border: none !important;
}
.select2-container--default .select2-results>.select2-results__options {
	background-color: #333 !important;
	border-radius: 8px !important;
	overflow: hidden !important;
}
.wsf-select2-dropdown .select2-results .select2-results__option--highlighted[aria-selected] {
    background-color: #444 !important;
}
select.wsf-field ~ .select2-container--default.select2-container--focus:not(.select2-container--disabled) .select2-selection--single, select.wsf-field ~ .select2-container--default.select2-container--focus:not(.select2-container--disabled) .select2-selection--multiple {
    box-shadow: unset !important;
}