.elementor-11727 .elementor-element.elementor-element-b2869c1{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-11727 .elementor-element.elementor-element-6fb8eb3{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--border-radius:8px 8px 8px 8px;--padding-top:24px;--padding-bottom:24px;--padding-left:24px;--padding-right:24px;}.elementor-11727 .elementor-element.elementor-element-6fb8eb3:not(.elementor-motion-effects-element-type-background), .elementor-11727 .elementor-element.elementor-element-6fb8eb3 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-11727 .elementor-element.elementor-element-6fb8eb3.e-con{--align-self:center;}.elementor-11727 .elementor-element.elementor-element-1df9f16{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:4px 4px;--row-gap:4px;--column-gap:4px;}.elementor-11727 .elementor-element.elementor-element-841657b .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:20px;}.elementor-11727 .elementor-element.elementor-element-f1d2c99 .wd-text-block{max-width:400px;font-family:"Poppins", Sans-serif;font-size:14px;line-height:22px;}.elementor-11727 .elementor-element.elementor-element-72408cf{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for wd_text_block, class: .elementor-element-f1d2c99 *//* =========================================================
   Link Styling
   ---------------------------------------------------------
   Styles all links inside this Elementor block.
   ========================================================= */
   
.elementor-11727 .elementor-element.elementor-element-f1d2c99 a {
  color: #EA580C;
  text-decoration: underline;
  font-size: 14px;
  font-weight: 500;
  text-wrap: nowrap;
}

.elementor-11727 .elementor-element.elementor-element-f1d2c99 a:hover {
  color: #EA580C;
  text-decoration: underline;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-72408cf *//* =========================================================
   LupiTools B2B Registration Form — Overrides
   ========================================================= */

/* =========================================================
   1. Form Header
   ---------------------------------------------------------
   Hides the default B2BKing registration header.
   ========================================================= */

.lupi-b2b-form .b2bking_b2bregistration_only_register_header {
  display: none;
}

/* =========================================================
   2. Form Layout
   ---------------------------------------------------------
   Creates a responsive two-column registration form layout
   on desktop while keeping fields stacked on smaller screens.
   ========================================================= */

/* 2.1 Form Grid
   ---------------------------------------------------------
   Sets the default mobile-first form grid.
   --------------------------------------------------------- */

.lupi-b2b-form form.woocommerce-form-register {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 8px;
}

/* 2.2 Field Spacing Reset
   ---------------------------------------------------------
   Neutralizes default WooCommerce/B2BKing spacing on direct
   form children so grid spacing controls the layout.
   --------------------------------------------------------- */

.lupi-b2b-form form.woocommerce-form-register > p,
.lupi-b2b-form form.woocommerce-form-register > div {
  margin: 0;
}

/* =========================================================
   3. Desktop Form Layout
   ---------------------------------------------------------
   Places selected fields in 50/50 rows on desktop.
   ========================================================= */

@media (min-width: 1025px) {
  /* 3.1 Desktop Grid
     ---------------------------------------------------------
     Creates two equal columns with an 8px column gap and
     24px row gap.
     --------------------------------------------------------- */

  .lupi-b2b-form form.woocommerce-form-register {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 8px;
    row-gap: 24px;
  }

  /* 3.2 Row 1 — First Name / Last Name
     --------------------------------------------------------- */

  .lupi-b2b-form .b2bking_custom_registration_container_field_21 {
    order: 1;
    grid-column: 1;
  }

  .lupi-b2b-form .b2bking_custom_registration_container_field_22 {
    order: 2;
    grid-column: 2;
  }

  /* 3.3 Row 2 — Company Name / Company Website
     --------------------------------------------------------- */

  .lupi-b2b-form .b2bking_custom_registration_container_field_23 {
    order: 3;
    grid-column: 1;
  }

  .lupi-b2b-form .b2bking_custom_registration_container_field_10661 {
    order: 4;
    grid-column: 2;
  }

  /* 3.4 Row 3 — Company Type
     ---------------------------------------------------------
     Places the company type field full-width below company
     name and company website.
     --------------------------------------------------------- */

  .lupi-b2b-form .b2bking_custom_registration_container_field_15304 {
    order: 5;
    grid-column: 1 / -1;
  }

  .lupi-b2b-form .b2bking_custom_registration_container_field_15304 select {
    width: 100%;
  }

  /* 3.5 Row 4 — Email Address / Phone Number
     --------------------------------------------------------- */

  .lupi-b2b-form form.woocommerce-form-register > p:has(#reg_email) {
    order: 6;
    grid-column: 1;
    margin-bottom: 0;
  }

  .lupi-b2b-form .b2bking_custom_registration_container_field_28 {
    order: 6;
    grid-column: 2;
  }

  /* 3.6 Email Password Notice
     ---------------------------------------------------------
     Places the password setup notice below the email field.
     The negative margin compensates for the form grid row gap.
     --------------------------------------------------------- */

  .lupi-b2b-form form.woocommerce-form-register > p:has(#reg_email) + p {
    order: 7;
    grid-column: 1;
    margin-top: -38px;
    font-size: 14px;
    line-height: 1.4;
  }

  /* 3.7 Row 5 — Street Address / Address Line 2
     --------------------------------------------------------- */

  .lupi-b2b-form .b2bking_custom_registration_container_field_24 {
    order: 8;
    grid-column: 1;
  }

  .lupi-b2b-form .b2bking_custom_registration_container_field_25 {
    order: 9;
    grid-column: 2;
  }

  /* 3.8 Row 6 — Postal Code / City
     --------------------------------------------------------- */

  .lupi-b2b-form .b2bking_custom_registration_container_field_27 {
    order: 10;
    grid-column: 1;
  }

  .lupi-b2b-form .b2bking_custom_registration_container_field_26 {
    order: 11;
    grid-column: 2;
  }

  /* 3.9 Row 7 — Country
     --------------------------------------------------------- */

  .lupi-b2b-form .b2bking_custom_registration_container_field_29 {
    order: 12;
    grid-column: 1 / -1;
  }

  /* 3.10 VAT Field
     ---------------------------------------------------------
     Keeps the VAT field full-width if B2BKing displays it.
     --------------------------------------------------------- */

  .lupi-b2b-form .b2bking_custom_registration_container_field_30 {
    order: 13;
    grid-column: 1 / -1;
  }

  /* 3.11 Privacy Message
     ---------------------------------------------------------
     Styles the privacy policy message block on desktop.
     --------------------------------------------------------- */

  .lupi-b2b-form .woocommerce-privacy-policy-text {
    order: 14;
    grid-column: 1 / -1;
    padding: 16px;
    border-radius: 8px;
    background-color: #F5F5F5;
    color: #727272;
  }

  .lupi-b2b-form .woocommerce-privacy-policy-text p {
    margin: 0;
    color: inherit;
  }

  .lupi-b2b-form .woocommerce-privacy-policy-text a {
    color: #101010;
    text-decoration: underline;
  }

  /* 3.12 Submit Button
     ---------------------------------------------------------
     Styles the B2B registration submit button.
     --------------------------------------------------------- */

  .lupi-b2b-form form.woocommerce-form-register > p:has(.woocommerce-form-register__submit) {
    order: 15;
    grid-column: 1 / -1;
  }

  .lupi-b2b-form .woocommerce-form-register__submit {
    --btn-bgcolor: #FF760A;
    --btn-bgcolor-hover: #FF5F00;
    --btn-color: #FFFFFF;
    --btn-color-hover: #FFFFFF;
    --btn-radius: 8px;

    background-color: #FF760A;
    color: #FFFFFF;
    border-radius: 8px;
  }

  .lupi-b2b-form .woocommerce-form-register__submit:hover,
  .lupi-b2b-form .woocommerce-form-register__submit:focus {
    background-color: #FF5F00;
    color: #FFFFFF;
  }
}

/* =========================================================
   4. Select Fields
   ---------------------------------------------------------
   Styles Select2 dropdown fields inside the B2B registration
   form, including custom LupiTools chevron icons.
   ========================================================= */

/* 4.1 Native Select Fields
   ---------------------------------------------------------
   Makes normal select fields, such as Company type, fill
   their available grid column width.
   --------------------------------------------------------- */

.lupi-b2b-form select {
  width: 100%;
}

/* 4.2 Select2 Field Shell
   ---------------------------------------------------------
   Sets the closed select field height, border, radius and
   base alignment using WoodMart form variables.
   --------------------------------------------------------- */

.lupi-b2b-form .select2-container--default .select2-selection--single {
  height: var(--wd-form-height);
  border: var(--wd-form-brd-width) solid var(--wd-form-brd-color);
  border-radius: 4px;
}

/* 4.3 Select2 Field Text
   ---------------------------------------------------------
   Aligns the selected value/placeholder and controls the
   left and right inner spacing.
   --------------------------------------------------------- */

.lupi-b2b-form .select2-container--default .select2-selection--single .select2-selection__rendered {
  height: var(--wd-form-height);
  padding-left: 15px;
  padding-right: 40px;
  line-height: var(--wd-form-height);
}

/* 4.4 Select2 Chevron
   ---------------------------------------------------------
   Replaces the default Select2 arrow with the custom
   LupiTools chevron-down SVG.
   --------------------------------------------------------- */

.lupi-b2b-form .select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 0;
  right: 8px;
  width: 24px;
  height: var(--wd-form-height);
  background-image: url("https://lupitools.com/wp-content/uploads/2026/04/chevron-down-black-24.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px 24px;
}

/* Hide default Select2 arrow triangle */
.lupi-b2b-form .select2-container--default .select2-selection--single .select2-selection__arrow b {
  display: none;
}

/* 4.5 Select2 Open State
   ---------------------------------------------------------
   Swaps the chevron icon when the Select2 dropdown is open.
   --------------------------------------------------------- */

.lupi-b2b-form .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow,
.lupi-b2b-form .select2-container.select2-container--open .select2-selection__arrow {
  background-image: url("https://lupitools.com/wp-content/uploads/2026/04/chevron-up-black-24.svg");
}

/* =========================================================
   5. Privacy Message
   ---------------------------------------------------------
   Styles the privacy policy message block on all breakpoints.
   ========================================================= */

.lupi-b2b-form .woocommerce-privacy-policy-text {
  padding: 16px;
  border-radius: 8px;
  background-color: #F5F5F5;
  color: #727272;
}

.lupi-b2b-form .woocommerce-privacy-policy-text p {
  margin: 0;
  color: inherit;
}

.lupi-b2b-form .woocommerce-privacy-policy-text a {
  color: #101010;
  text-decoration: underline;
}

/* =========================================================
   6. Submit Button
   ---------------------------------------------------------
   Styles the B2B registration submit button on all breakpoints.
   ========================================================= */

.lupi-b2b-form .woocommerce-form-register__submit {
  --btn-bgcolor: #FF760A;
  --btn-bgcolor-hover: #FF5F00;
  --btn-color: #FFFFFF;
  --btn-color-hover: #FFFFFF;
  --btn-radius: 8px;

  background-color: #FF760A;
  color: #FFFFFF;
  border-radius: 8px;
}

.lupi-b2b-form .woocommerce-form-register__submit:hover,
.lupi-b2b-form .woocommerce-form-register__submit:focus {
  background-color: #FF5F00;
  color: #FFFFFF;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-6fb8eb3 *//* =========================================================
   LupiTools Form Shell
   ========================================================= */

.elementor-11727 .elementor-element.elementor-element-6fb8eb3 {
  width: 100%;
  max-width: 664px;
  margin-inline: auto;
}/* End custom CSS */