
/* =========================================================
   UPSEX ACCOUNT FLOW V5
   Registro y confirmación de cuenta
   ========================================================= */

html{
  --upsex-account-top-gap:0px;
}

html body #account-register,
html body #account-success,
html body #account-register *,
html body #account-success *{
  box-sizing:border-box!important;
  font-family:"Manrope",Arial,sans-serif!important;
}

html body #account-register,
html body #account-success{
  position:relative!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  transform:none!important;
  width:100%!important;
  max-width:1040px!important;
  min-height:300px!important;
  margin:0 auto 48px!important;
  padding:
    var(--upsex-account-top-gap)
    18px
    0!important;
  overflow:visible!important;
  color:#342126!important;
  animation:none!important;
}

html body #account-register > .row,
html body #account-success > .row{
  margin:0!important;
  padding:0!important;
}

html body #account-register #content,
html body #account-success #content{
  width:100%!important;
  max-width:850px!important;
  margin:0 auto!important;
  padding:0!important;
  float:none!important;
}

/* Migas de navegación */

html body #account-register .breadcrumb,
html body #account-success .breadcrumb{
  position:relative!important;
  z-index:5!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:48px!important;
  margin:0 0 20px!important;
  padding:11px 17px!important;
  border:1px solid #F8E9EC!important;
  border-radius:999px!important;
  background:#FFFBFC!important;
  box-shadow:0 5px 16px rgba(77,66,63,.05)!important;
  list-style:none!important;
  overflow:visible!important;
}

html body #account-register .breadcrumb li,
html body #account-success .breadcrumb li{
  display:inline-flex!important;
  align-items:center!important;
  margin:0!important;
  padding:0!important;
  color:#50383E!important;
  font-size:14px!important;
  line-height:1.3!important;
  font-weight:700!important;
}

html body #account-register .breadcrumb li + li::before,
html body #account-success .breadcrumb li + li::before{
  content:"/"!important;
  margin:0 7px 0 0!important;
  color:#C62828!important;
  font-weight:800!important;
}

html body #account-register .breadcrumb a,
html body #account-success .breadcrumb a{
  color:#50383E!important;
  -webkit-text-fill-color:#50383E!important;
  font-size:inherit!important;
  font-weight:700!important;
  text-decoration:none!important;
}

/* Encabezado del registro */

html body #account-register #content > h1{
  position:relative!important;
  margin:0!important;
  padding:28px 28px 14px 69px!important;
  border:1px solid #F8E9EC!important;
  border-bottom:0!important;
  border-radius:24px 24px 0 0!important;
  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(210,173,82,.17),
      transparent 31%
    ),
    linear-gradient(145deg,#FFFBFC,#FFF8F9)!important;
  color:#342126!important;
  -webkit-text-fill-color:#342126!important;
  font-size:clamp(31px,5vw,44px)!important;
  line-height:1.12!important;
  font-weight:800!important;
  letter-spacing:-.8px!important;
  text-transform:none!important;
}

html body #account-register #content > h1::before{
  content:""!important;
  position:absolute!important;
  top:29px!important;
  left:27px!important;
  width:28px!important;
  height:28px!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:28px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B88A00' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M2 21a7 7 0 0 1 14 0M19 8v6M16 11h6'/%3E%3C/svg%3E")!important;
}

html body #account-register #content > h1 + p{
  margin:0 0 22px!important;
  padding:5px 28px 24px!important;
  border:1px solid #F8E9EC!important;
  border-top:0!important;
  border-radius:0 0 24px 24px!important;
  background:#FFF8F9!important;
  color:#50383E!important;
  font-size:15px!important;
  line-height:1.6!important;
  font-weight:430!important;
}

html body #account-register #content > h1 + p a{
  color:#4A0A12!important;
  font-weight:800!important;
  text-decoration:underline!important;
  text-underline-offset:3px!important;
}

/* Tarjeta del formulario */

html body #account-register form.form-horizontal{
  display:block!important;
  width:100%!important;
  margin:0!important;
  padding:29px 29px 31px!important;
  border:1px solid rgba(184,138,0,.20)!important;
  border-radius:24px!important;
  background:#fff!important;
  box-shadow:0 12px 34px rgba(77,66,63,.075)!important;
  overflow:hidden!important;
}

html body #account-register fieldset{
  display:block!important;
  width:100%!important;
  margin:0 0 28px!important;
  padding:0!important;
  border:0!important;
}

html body #account-register legend{
  position:relative!important;
  display:block!important;
  width:100%!important;
  margin:0 0 22px!important;
  padding:0 0 13px 41px!important;
  border:0!important;
  border-bottom:1px solid #F8E9EC!important;
  color:#342126!important;
  -webkit-text-fill-color:#342126!important;
  font-size:22px!important;
  line-height:1.3!important;
  font-weight:800!important;
  letter-spacing:-.3px!important;
}

html body #account-register legend::before{
  content:""!important;
  position:absolute!important;
  top:0!important;
  left:0!important;
  width:28px!important;
  height:28px!important;
  border:1px solid #F8E9EC!important;
  border-radius:9px!important;
  background-color:#FFF8F9!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:17px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A5A18' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9M16.5 3.5a2.1 2.1 0 0 1 3 3L8 18l-4 1 1-4Z'/%3E%3C/svg%3E")!important;
}

html body #account-register .form-group{
  display:block!important;
  width:100%!important;
  margin:0 0 19px!important;
  padding:0!important;
}

html body #account-register .form-group::before,
html body #account-register .form-group::after{
  display:none!important;
}

html body #account-register .control-label{
  display:block!important;
  width:100%!important;
  margin:0 0 8px!important;
  padding:0!important;
  float:none!important;
  color:#342126!important;
  -webkit-text-fill-color:#342126!important;
  font-size:14px!important;
  line-height:1.35!important;
  font-weight:750!important;
  text-align:left!important;
}

html body #account-register .required .control-label::before{
  color:#C62828!important;
}

html body #account-register .col-sm-10,
html body #account-register .col-sm-9,
html body #account-register .col-sm-8,
html body #account-register .col-sm-6,
html body #account-register .col-sm-4,
html body #account-register .col-sm-3,
html body #account-register .col-sm-2{
  display:block!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  float:none!important;
}

html body #account-register .form-control{
  display:block!important;
  width:100%!important;
  min-height:53px!important;
  height:auto!important;
  margin:0!important;
  padding:14px 17px!important;
  border:1px solid #D32F2F!important;
  border-radius:14px!important;
  background:#fff!important;
  color:#342126!important;
  -webkit-text-fill-color:#342126!important;
  font-size:16px!important;
  line-height:1.35!important;
  font-weight:430!important;
  box-shadow:0 3px 11px rgba(77,66,63,.035)!important;
  outline:0!important;
}

html body #account-register .form-control:focus{
  border-color:#7A0C18!important;
  background:#FFFBFC!important;
  box-shadow:0 0 0 3px rgba(184,138,0,.14)!important;
}

html body #account-register .form-control::placeholder{
  color:#8c827f!important;
  -webkit-text-fill-color:#8c827f!important;
  opacity:1!important;
}

/* Grupo interno */

html body #account-register
.upsex-customer-group-hidden-v5{
  display:none!important;
}

/* Radios generales y boletín */

html body #account-register .radio-inline,
html body #account-register .radio label{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:9px!important;
  min-height:42px!important;
  margin:5px 16px 5px 0!important;
  padding:9px 13px!important;
  border:1px solid #F8E9EC!important;
  border-radius:12px!important;
  background:#FFF8F9!important;
  color:#342126!important;
  -webkit-text-fill-color:#342126!important;
  font-size:14px!important;
  line-height:1.4!important;
  font-weight:700!important;
  cursor:pointer!important;
}

html body #account-register input[type="radio"],
html body #account-register input[type="checkbox"]{
  position:static!important;
  flex:0 0 19px!important;
  width:19px!important;
  height:19px!important;
  margin:0!important;
  accent-color:#C62828!important;
  vertical-align:middle!important;
}

html body #account-register .upsex-newsletter-options-v5{
  display:flex!important;
  align-items:stretch!important;
  flex-wrap:wrap!important;
  gap:10px!important;
}

html body #account-register .upsex-newsletter-options-v5
.radio-inline{
  flex:1 1 230px!important;
  margin:0!important;
}

html body #account-register .upsex-choice-copy-v5{
  display:inline!important;
  color:#342126!important;
  -webkit-text-fill-color:#342126!important;
  font-size:14px!important;
  line-height:1.4!important;
  font-weight:700!important;
}

/* Privacidad y botón */

html body #account-register .buttons{
  margin:6px 0 0!important;
  padding:21px 0 0!important;
  border-top:1px solid #F8E9EC!important;
}

html body #account-register .buttons .pull-right{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:wrap!important;
  gap:12px!important;
  width:100%!important;
  margin:0!important;
  float:none!important;
  color:#50383E!important;
  font-size:13px!important;
  line-height:1.5!important;
}

html body #account-register .buttons a{
  color:#4A0A12!important;
  font-weight:800!important;
}

html body #account-register .btn-primary{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:220px!important;
  min-height:54px!important;
  margin:0!important;
  padding:14px 27px!important;
  border:1px solid #342126!important;
  border-radius:999px!important;
  background:#342126!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:15px!important;
  line-height:1.2!important;
  font-weight:800!important;
  text-align:center!important;
  box-shadow:0 9px 22px rgba(77,66,63,.17)!important;
}

/* Errores */

html body #account-register .text-danger{
  display:block!important;
  margin-top:7px!important;
  color:#9b3838!important;
  font-size:13px!important;
  line-height:1.4!important;
  font-weight:700!important;
}

html body #account-register
.upsex-field-error-v5{
  scroll-margin-top:210px!important;
}

/* Confirmación */

html body #account-success #content{
  max-width:720px!important;
}

html body .upsex-account-card-v5{
  position:relative!important;
  overflow:hidden!important;
  width:100%!important;
  margin:0!important;
  padding:36px 29px 31px!important;
  border:1px solid #F8E9EC!important;
  border-radius:24px!important;
  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(210,173,82,.17),
      transparent 31%
    ),
    linear-gradient(145deg,#FFFBFC,#FFF8F9)!important;
  box-shadow:0 13px 35px rgba(77,66,63,.075)!important;
  text-align:center!important;
}

html body .upsex-account-card-v5::before{
  content:""!important;
  position:absolute!important;
  top:0!important;
  left:50%!important;
  width:86px!important;
  height:4px!important;
  border-radius:0 0 999px 999px!important;
  background:linear-gradient(90deg,#C62828,#D2AD52)!important;
  transform:translateX(-50%)!important;
}

html body .upsex-account-check-v5{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:68px!important;
  height:68px!important;
  margin:0 auto 17px!important;
  border:1px solid #D2AD52!important;
  border-radius:50%!important;
  background:#fff!important;
  color:#7A0C18!important;
}

html body .upsex-account-check-v5 svg{
  width:38px!important;
  height:38px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

html body .upsex-account-kicker-v5{
  margin:0 0 11px!important;
  color:#7A0C18!important;
  font-size:11px!important;
  line-height:1.3!important;
  font-weight:800!important;
  letter-spacing:1.3px!important;
}

html body .upsex-account-card-v5 h1{
  margin:0 0 14px!important;
  color:#342126!important;
  -webkit-text-fill-color:#342126!important;
  font-size:clamp(29px,5vw,42px)!important;
  line-height:1.13!important;
  font-weight:800!important;
  letter-spacing:-.7px!important;
  text-transform:none!important;
}

html body .upsex-account-message-v5{
  max-width:560px!important;
  margin:0 auto 24px!important;
  color:#342126!important;
  font-size:17px!important;
  line-height:1.6!important;
  font-weight:550!important;
  text-align:center!important;
}

html body .upsex-account-message-v5 p{
  margin:0!important;
  color:inherit!important;
  font:inherit!important;
}

html body .upsex-account-button-v5{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  max-width:420px!important;
  min-height:54px!important;
  padding:14px 25px!important;
  border:1px solid #342126!important;
  border-radius:999px!important;
  background:#342126!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:15px!important;
  line-height:1.2!important;
  font-weight:800!important;
  text-decoration:none!important;
  box-shadow:0 9px 22px rgba(77,66,63,.17)!important;
}

/* Móvil */

@media(max-width:767px){

  html body #account-register,
  html body #account-success{
    max-width:100%!important;
    margin-bottom:34px!important;
    padding-right:13px!important;
    padding-left:13px!important;
    overflow-x:hidden!important;
  }

  html body #account-register .breadcrumb,
  html body #account-success .breadcrumb{
    min-height:44px!important;
    margin-bottom:16px!important;
    padding:9px 13px!important;
  }

  html body #account-register #content > h1{
    padding:22px 17px 11px 52px!important;
    border-radius:19px 19px 0 0!important;
    font-size:30px!important;
  }

  html body #account-register #content > h1::before{
    top:23px!important;
    left:17px!important;
    width:24px!important;
    height:24px!important;
    background-size:24px!important;
  }

  html body #account-register #content > h1 + p{
    padding:5px 17px 20px!important;
    border-radius:0 0 19px 19px!important;
    font-size:14px!important;
  }

  html body #account-register form.form-horizontal{
    padding:22px 16px 25px!important;
    border-radius:19px!important;
  }

  html body #account-register legend{
    padding-left:36px!important;
    font-size:20px!important;
  }

  html body #account-register .form-control{
    min-height:52px!important;
    padding:13px 15px!important;
    border-radius:12px!important;
    font-size:15px!important;
  }

  html body #account-register .upsex-newsletter-options-v5{
    display:grid!important;
    grid-template-columns:1fr!important;
  }

  html body #account-register .buttons .pull-right{
    justify-content:center!important;
    text-align:center!important;
  }

  html body #account-register .btn-primary{
    width:100%!important;
    min-width:0!important;
  }

  html body .upsex-account-card-v5{
    padding:29px 17px 26px!important;
    border-radius:19px!important;
  }

  html body .upsex-account-card-v5 h1{
    font-size:29px!important;
  }

  html body .upsex-account-message-v5{
    font-size:15.5px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  html body #account-register *,
  html body #account-success *{
    animation:none!important;
    transition:none!important;
  }
}

/* UPSEX_ACCOUNT_RUNTIME_GUARD_V6_START */

/*
 * Las reglas no dependen de que el título siga siendo
 * el hermano inmediatamente anterior del párrafo.
 */

html body #account-register .breadcrumb{
  position:relative!important;
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  transform:none!important;
  pointer-events:auto!important;
}

html body #account-register #content > h1,
html body #account-register
#content > h1.onsex-intent-hidden-h1{
  position:relative!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  transform:none!important;
  pointer-events:auto!important;
}

html body #account-register
#content > p:first-of-type{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:100%!important;
  margin:0 0 22px!important;
  padding:5px 28px 24px!important;
  border:1px solid #F8E9EC!important;
  border-top:0!important;
  border-radius:0 0 24px 24px!important;
  background:#FFF8F9!important;
  color:#50383E!important;
  -webkit-text-fill-color:#50383E!important;
  font-family:"Manrope",Arial,sans-serif!important;
  font-size:15px!important;
  line-height:1.6!important;
  font-weight:430!important;
  text-align:left!important;
  transform:none!important;
}

html body #account-register
#content > p:first-of-type a{
  color:#4A0A12!important;
  -webkit-text-fill-color:#4A0A12!important;
  font-weight:800!important;
  text-decoration:underline!important;
  text-underline-offset:3px!important;
}

html body.account-register
.onsex-intent-landing-hero,
html body.account-success
.onsex-intent-landing-hero,
html body #account-register
.onsex-intent-landing-hero,
html body #account-success
.onsex-intent-landing-hero{
  display:none!important;
}

@media(max-width:767px){

  html body #account-register
  #content > p:first-of-type{
    margin-bottom:20px!important;
    padding:5px 17px 20px!important;
    border-radius:0 0 19px 19px!important;
    font-size:14px!important;
    line-height:1.6!important;
  }
}

/* UPSEX_ACCOUNT_RUNTIME_GUARD_V6_END */

/* UPSEX_HIDE_CUSTOMER_GROUP_V11_START */

html body #account-register
.upsex-customer-group-hidden-v5,

html body #account-register
.upsex-customer-group-hidden-v11,

html body #account-register
.form-group:has(input[name="customer_group_id"]){
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    width:0!important;
    height:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    overflow:hidden!important;
    pointer-events:none!important;
}

/* UPSEX_HIDE_CUSTOMER_GROUP_V11_END */
