/*
 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
*/

.optional{ opacity:0;}
.ff-default .ff-el-form-control{ font-family: "Urbanist", sans-serif !important}
.frm-fluent-form .ff-t-container {gap: 10px !important;}

.fluent_form_1 .frm-fluent-form .ff-btn-submit {width: 286px !important; height: 50px !important; margin-top: 30px !important;}
.fluent_form_1 .frm-fluent-form .ff-el-group {margin-bottom: 10px !important;}
.fluent_form_1 .frm-fluent-form .ff-el-form-control {border-radius: 0px !important; background: transparent; border: 1px solid #002434 !important; height: 50px !important; font-size: 19px !important; color:#1E1E1E !important;}
.fluent_form_1 .frm-fluent-form textarea.ff-el-form-control {min-height: 175px; resize: none !important;}
.fluent_form_1 .frm-fluent-form .ff-el-form-check label {font-size: 19px; color: #1E1E1E !important;;}
.fluent_form_1 .frm-fluent-form .ff-el-form-check label a {text-decoration: underline;}
.fluent_form_1 .frm-fluent-form .ff-el-form-check label a:hover {text-decoration: none;}
.fluent_form_1 .frm-fluent-form .ff-el-input--label label {font-size: 16px; line-height: 24px; color: var(--bricks-color-kemqcn); font-weight: 400;}
.fluent_form_1 .frm-fluent-form input::-webkit-input-placeholder {color: var(--bricks-color-kemqcn) !important;}
/* Para Firefox */
.frm-fluent-form input::-moz-placeholder {color: var(--bricks-color-kemqcn) !important;}
/* Para Internet Explorer 10-11 */
.frm-fluent-form input:-ms-input-placeholder {color: var(--bricks-color-kemqcn) !important;}
/* Para Microsoft Edge */
.frm-fluent-form input::-ms-input-placeholder {color: var(--bricks-color-kemqcn) !important;}


.input-newsletter input {border-radius: 0px !important; background-color: #002434 !important; border: 1px solid white !important; height: 35px !important; font-size: 13px !important; color:#FFF !important;}
.fluent_form_2 .ff-el-tc label.ff_tc_label>div, .fluent_form_2 .ff-el-tc label.ff_tc_label>span{ font-size:13px !important; letter-spacing:0.652px; color: white !important;line-height:1.2; padding-top: 7px;}


/* Botón de submit de Fluent Form */
 .ff-btn-submit.ff_btn_style {
  background-color: #002434 !important; 
  color: #fff !important;             
  font-size: 17px !important;         
  font-weight: 400 !important;       
  padding: 10px 30px 10px 34px !important;       
  border: none !important;             
  border-radius: 100px !important;       
  cursor: pointer !important;
  transition: background-color 0.3s ease !important;
  display: inline-block !important;
  width:206px !important; height:55px !important;
  min-width:206px !important;
}

.fluent_form_2 .ff-btn-submit.ff_btn_style{
	font-size: 13px !important; 
	border:1px solid white !important;
	width:140px !important; height:35px !important;
    min-width:140px !important;
	padding: 0 37px !important;     
}

/* Efecto hover */
.fluent_form_1 .ff-btn-submit.ff_btn_style:hover {
  background-color: #fff !important; 
	color: #002434 !important;
	border: 1px solid #002A39 !important;
}
.custom-submit .ff-t-cell.ff-t-column-2{
	align-items:end !important;
}

.fluentform .ff-el-tc label.ff_tc_label {display:flex !important; gap:5px;}

/* Ocultar el checkbox real */
.fluent_form_1 .ff-el-form-check-input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
}

/* Contenedor del toggle */
#fluentform_1 .ff_tc_checkbox {
  position: relative !important;
  display: inline-block;
  width: 51px !important;
  height: 31px !important;
  background-color: #ccc !important;
  border-radius: 100px !important;
  transition: background-color 0.3s !important;
  vertical-align: middle;
}

/* Perilla del toggle */
#fluentform_1 .ff_tc_checkbox::before {
  content: '' !important;
  position: absolute !important;
  top: 1px !important;
  left: 1px !important;
  width: 29px !important;
  height: 29px !important;
  background-color: #fff !important;
  border-radius: 50% !important;
  transition: transform 0.3s !important;
}

/* Cambiar color de fondo si el input está checked */
#fluentform_1 .ff_tc_checkbox:has(input:checked) {
  background-color: black !important;
}

/* Mover la perilla si el input está checked */
#fluentform_1 .ff_tc_checkbox:has(input:checked)::before {
  transform: translateX(20px);
}

/* Ajustar alineación del texto */
#fluentform_1 .ff_t_c {
  margin-left: 10px;
}


.brxe-woocommerce-mini-cart .cart-detail .woocommerce-mini-cart__buttons a, .woocommerce .button, .wc-block-components-button:not(.is-link), .woocommerce-checkout .place-order .button {
    align-items: center;
    border-width: 0;
	border-radius:100px !important;
    color: white;
    display: inline-flex;
    font-weight: 400;
    justify-content: center;
    line-height: 40px;
    min-height: 40px;
    min-height: 0;
    padding: 0 15px;
    text-align: center;
    text-decoration: none;
	background-color: #002434;
	font-size:20px;
	
}

.brxe-woocommerce-mini-cart .cart-detail .woocommerce-mini-cart__buttons a, .woocommerce .button, .wc-block-components-button:not(.is-link), .woocommerce-checkout .place-order .button {

    font-size: 16px;
}

.ff-message-success{ color: #000 !important; }


@media (max-width: 767px) {
	.single-product .section-first{
		margin-top:120px !important;
	}
}

@media (max-width: 767px) {
	
	.fluentform .ff-el-tc label.ff_tc_label{
		display: table-row !important;
	}
	#brxe-osaxap {
    	margin-top: 20px!important;
	}
	.woocommerce-form-coupon-toggle{
		margin-bottom:20px !important;
	}
	#regalo_fields h3{ padding-bottom:10px;}
	#custom-header{
		padding-top: 0!important;
		margin-top:0!important;
	}
	.brxe-woocommerce-mini-cart.show-cart-details .cart-detail {
		position: fixed;
		right: 0;
		top: 120px;
		width:90%;
		left: 50%;
    	transform: translateX(-50%);
	}
	
	.brxe-woocommerce-mini-cart .cart-detail .woocommerce-mini-cart__buttons a, .woocommerce .button, .wc-block-components-button:not(.is-link), .woocommerce-checkout .place-order .button{
		font-size:14px !important;
	}
	.woocommerce-notices-wrapper .woocommerce-message {
		flex-flow: wrap column;
		justify-content: center;
		text-align: center;
	}
	
	.woocommerce-notices-wrapper .woocommerce-message a {
		margin: 10px 0 0;
	}
}