/* Bebé Crece — menú de perfil y selector de contacto, 2026-07-13 */
:root{
  --bc-account-blue:#2048a0;
  --bc-account-navy:#102a63;
  --bc-account-soft:#f5f9ff;
  --bc-account-line:#d8e5fb;
  --bc-account-green:#16884a;
  --bc-account-danger:#be2940;
}

.bc-account-shell{
  position:relative;
  min-width:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.bc-account-shell > .bc-account-btn,
.bc-account-shell > .bc-btn-cuenta{
  width:100%;
}
.bc-account-btn[aria-expanded="true"],
.bc-btn-cuenta[aria-expanded="true"]{
  box-shadow:0 0 0 4px rgba(32,72,160,.12),0 14px 32px rgba(16,42,99,.16)!important;
}

.bc-profile-menu{
  position:fixed;
  z-index:100120;
  width:min(326px,calc(100vw - 24px));
  max-height:min(520px,calc(100vh - 24px));
  overflow:auto;
  padding:12px;
  border:1px solid var(--bc-account-line);
  border-radius:24px;
  background:rgba(255,255,255,.985);
  color:#11224c;
  box-shadow:0 26px 72px rgba(8,31,79,.24);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-7px) scale(.985);
  transform-origin:top right;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}
.bc-profile-menu.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}
.bc-profile-menu::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:5px;
  border-radius:24px 24px 0 0;
  background:linear-gradient(90deg,#2048a0,#5b92ef,#fbc530);
}
.bc-profile-menu-head{
  display:grid;
  grid-template-columns:46px minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:12px 10px 14px;
  border-bottom:1px solid #e4ecfa;
}
.bc-profile-avatar{
  width:46px;
  height:46px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#e8f0ff,#d9e8ff);
  color:var(--bc-account-blue);
  border:1px solid #cbdcf8;
  font-size:15px;
  font-weight:950;
  letter-spacing:.3px;
}
.bc-profile-menu-name{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--bc-account-navy);
  font-size:14px;
  font-weight:950;
}
.bc-profile-menu-email{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#6c7c9e;
  font-size:12px;
  margin-top:3px;
}
.bc-profile-menu-actions{
  display:grid;
  gap:5px;
  padding-top:9px;
}
.bc-profile-action{
  width:100%;
  min-height:48px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  border:0;
  border-radius:16px;
  background:transparent;
  color:#17356f;
  padding:6px 10px 6px 7px;
  text-align:left;
  font:800 13px/1.25 Poppins,Arial,sans-serif;
  cursor:pointer;
  transition:background .16s ease,transform .16s ease,color .16s ease;
}
.bc-profile-action:hover,
.bc-profile-action:focus-visible{
  background:#edf4ff;
  color:var(--bc-account-blue);
  transform:translateX(2px);
  outline:none;
}
.bc-profile-action-icon{
  width:38px;
  height:38px;
  border-radius:13px;
  display:grid;
  place-items:center;
  background:#eaf2ff;
  color:var(--bc-account-blue);
  font-size:17px;
}
.bc-profile-action-arrow{
  color:#8ea1c6;
  font-size:18px;
  line-height:1;
}
.bc-profile-action.is-danger{
  margin-top:5px;
  border-top:1px solid #edf1f8;
  border-radius:0 0 16px 16px;
  color:var(--bc-account-danger);
}
.bc-profile-action.is-danger .bc-profile-action-icon{
  background:#fff0f2;
  color:var(--bc-account-danger);
}
.bc-profile-action.is-danger:hover,
.bc-profile-action.is-danger:focus-visible{
  background:#fff4f5;
  color:#a61731;
}

.bc-profile-overlay{
  position:fixed;
  inset:0;
  z-index:100160;
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(10,31,73,.66);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.bc-profile-overlay.is-open{display:flex;}
.bc-profile-dialog{
  width:min(590px,100%);
  max-height:min(720px,calc(100vh - 32px));
  overflow:auto;
  position:relative;
  background:#fff;
  border:1px solid rgba(216,229,251,.95);
  border-radius:30px;
  padding:28px;
  box-shadow:0 30px 90px rgba(4,18,45,.34);
  color:#11224c;
}
.bc-profile-dialog-close{
  position:absolute;
  top:15px;
  right:15px;
  width:42px;
  height:42px;
  border:0;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#eaf2ff;
  color:var(--bc-account-blue);
  font-size:23px;
  line-height:1;
  font-weight:900;
  cursor:pointer;
}
.bc-profile-dialog-kicker{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:7px 12px;
  border-radius:999px;
  background:#edf4ff;
  color:var(--bc-account-blue);
  font-size:11px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.35px;
}
.bc-profile-dialog h2{
  margin:14px 52px 6px 0;
  color:var(--bc-account-navy);
  font-size:clamp(27px,4vw,38px);
  line-height:1.08;
  letter-spacing:-.8px;
}
.bc-profile-dialog-intro{
  margin:0 0 22px;
  color:#667799;
  font-size:14px;
  line-height:1.65;
}
.bc-profile-view-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.bc-profile-data-card{
  min-width:0;
  padding:15px;
  border:1px solid var(--bc-account-line);
  border-radius:18px;
  background:linear-gradient(180deg,#fff,#f8fbff);
}
.bc-profile-data-card.is-wide{grid-column:1/-1;}
.bc-profile-data-card span{
  display:block;
  margin-bottom:5px;
  color:#7484a5;
  font-size:10px;
  font-weight:950;
  letter-spacing:.4px;
  text-transform:uppercase;
}
.bc-profile-data-card strong{
  display:block;
  color:#17356f;
  font-size:14px;
  line-height:1.45;
  overflow-wrap:anywhere;
}
.bc-profile-view-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:20px;
}
.bc-profile-primary,
.bc-profile-secondary{
  min-height:48px;
  border-radius:15px;
  padding:11px 18px;
  font:900 14px Poppins,Arial,sans-serif;
  cursor:pointer;
}
.bc-profile-primary{
  border:0;
  background:linear-gradient(135deg,#2048a0,#153d89);
  color:#fff;
  box-shadow:0 12px 28px rgba(32,72,160,.2);
}
.bc-profile-secondary{
  border:1px solid var(--bc-account-line);
  background:#fff;
  color:var(--bc-account-blue);
}
.bc-profile-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.bc-profile-field{display:block;min-width:0;}
.bc-profile-field.is-wide{grid-column:1/-1;}
.bc-profile-field > span{
  display:block;
  margin:0 0 7px;
  color:#2048a0;
  font-size:11px;
  font-weight:950;
  letter-spacing:.35px;
  text-transform:uppercase;
}
.bc-profile-field input,
.bc-profile-field textarea{
  width:100%;
  min-height:52px;
  border:1px solid var(--bc-account-line);
  border-radius:16px;
  background:#fbfdff;
  color:#102a63;
  padding:12px 14px;
  font:700 15px Poppins,Arial,sans-serif;
  outline:none;
}
.bc-profile-field textarea{min-height:100px;resize:vertical;}
.bc-profile-field input:focus,
.bc-profile-field textarea:focus{
  border-color:#6d9de8;
  box-shadow:0 0 0 4px rgba(32,72,160,.09);
}
.bc-profile-field input[readonly]{
  background:#f1f5fb;
  color:#71809f;
  cursor:not-allowed;
}
.bc-profile-help{
  display:block;
  margin-top:6px;
  color:#7c8baa;
  font-size:11px;
  line-height:1.45;
  text-transform:none!important;
  letter-spacing:0!important;
  font-weight:600!important;
}
.bc-profile-form-actions{
  grid-column:1/-1;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding-top:3px;
}
.bc-profile-message{
  grid-column:1/-1;
  min-height:22px;
  font-size:13px;
  font-weight:850;
  line-height:1.45;
}
.bc-profile-message.is-success{color:#16884a;}
.bc-profile-message.is-error{color:#be2940;}
.bc-profile-loading{
  min-height:180px;
  display:grid;
  place-items:center;
  color:#64779e;
  font-weight:800;
}
.bc-profile-loading::before{
  content:"";
  width:34px;
  height:34px;
  border:4px solid #dbe7fa;
  border-top-color:#2048a0;
  border-radius:50%;
  animation:bc-profile-spin .75s linear infinite;
  margin-bottom:10px;
}
@keyframes bc-profile-spin{to{transform:rotate(360deg)}}

/* Selector moderno del tema de contacto */
.select-field-v2.bc-topic-enhanced{
  position:relative;
  overflow:visible!important;
  z-index:12;
}
.select-field-v2.bc-topic-enhanced:focus-within{
  border-color:#6c9ce8!important;
  box-shadow:0 0 0 4px rgba(32,72,160,.09)!important;
}
.bc-native-topic-select{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
}
.bc-topic-control{
  position:relative;
  width:100%;
  min-width:0;
}
.bc-topic-button{
  width:100%;
  min-height:52px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border:0;
  background:transparent;
  color:#17356f;
  padding:0 2px 0 0;
  text-align:left;
  font:800 15px Poppins,Arial,sans-serif;
  cursor:pointer;
  outline:none;
}
.bc-topic-button::after{
  content:"";
  width:9px;
  height:9px;
  flex:0 0 9px;
  border-right:2px solid #2048a0;
  border-bottom:2px solid #2048a0;
  transform:translateY(-2px) rotate(45deg);
  transition:transform .18s ease;
  margin-right:4px;
}
.bc-topic-control.is-open .bc-topic-button::after{
  transform:translateY(2px) rotate(225deg);
}
.bc-topic-menu{
  position:absolute;
  left:-48px;
  right:-12px;
  top:calc(100% + 9px);
  z-index:10080;
  display:grid;
  gap:5px;
  padding:9px;
  border:1px solid var(--bc-account-line);
  border-radius:19px;
  background:#fff;
  box-shadow:0 22px 55px rgba(16,42,99,.2);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-7px);
  transition:opacity .16s ease,transform .16s ease,visibility .16s ease;
}
.bc-topic-control.is-open .bc-topic-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.bc-topic-option{
  width:100%;
  min-height:43px;
  display:flex;
  align-items:center;
  gap:10px;
  border:0;
  border-radius:13px;
  background:#fff;
  color:#354d7d;
  padding:9px 11px;
  text-align:left;
  font:750 14px Poppins,Arial,sans-serif;
  cursor:pointer;
}
.bc-topic-option::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:#c8d8f4;
  flex:0 0 8px;
}
.bc-topic-option:hover,
.bc-topic-option:focus-visible{
  background:#edf4ff;
  color:#2048a0;
  outline:none;
}
.bc-topic-option[aria-selected="true"]{
  background:linear-gradient(135deg,#2048a0,#2d67c7);
  color:#fff;
  font-weight:900;
}
.bc-topic-option[aria-selected="true"]::before{background:#fbc530;}

@media(max-width:860px){
  .bc-account-shell{width:100%;min-width:0;}
  .nav-actions .bc-account-shell > .bc-account-btn,
  .nav-actions .bc-account-shell > .bc-btn-cuenta{
    width:100%!important;
    max-width:100%!important;
    min-height:46px!important;
    border-radius:16px!important;
    justify-content:center!important;
  }
}
@media(max-width:640px){
  .bc-profile-overlay{padding:10px;align-items:flex-end;}
  .bc-profile-dialog{
    width:100%;
    max-height:90vh;
    border-radius:26px 26px 18px 18px;
    padding:23px 17px 20px;
  }
  .bc-profile-view-grid,.bc-profile-form{grid-template-columns:1fr;}
  .bc-profile-data-card.is-wide,.bc-profile-field.is-wide,
  .bc-profile-form-actions,.bc-profile-message{grid-column:1;}
  .bc-profile-view-actions,.bc-profile-form-actions{display:grid;grid-template-columns:1fr;}
  .bc-profile-primary,.bc-profile-secondary{width:100%;}
  .bc-topic-menu{left:-49px;right:-10px;max-height:300px;overflow:auto;}
}
@media(max-width:400px){
  .nav-actions .bc-account-shell > .bc-account-btn,
  .nav-actions .bc-account-shell > .bc-btn-cuenta{
    max-width:100%!important;
    font-size:12px!important;
    padding:9px 10px!important;
  }
}
@media(prefers-reduced-motion:reduce){
  .bc-profile-menu,.bc-profile-action,.bc-topic-menu,.bc-topic-button::after{transition:none!important;}
  .bc-profile-loading::before{animation-duration:1.4s;}
}

/* Asegura que el control personalizado ocupe la segunda columna completa del campo original. */
.select-field-v2.bc-topic-enhanced::after{display:none!important;}
.select-field-v2.bc-topic-enhanced > .bc-topic-control{
  grid-column:2!important;
  grid-row:1!important;
  align-self:stretch;
  display:flex;
  align-items:center;
  width:100%!important;
  min-width:0!important;
}
.select-field-v2.bc-topic-enhanced .bc-topic-button{flex:1 1 auto;min-width:0;}
.select-field-v2.bc-topic-enhanced .bc-topic-menu{
  left:-64px;
  right:-18px;
  width:auto;
}
@media(max-width:640px){
  .select-field-v2.bc-topic-enhanced .bc-topic-menu{left:-64px;right:-18px;}
}

/* Neutraliza estilos antiguos demasiado generales aplicados a todos los span del formulario. */
.contact-form-card .select-field-v2 .bc-topic-control,
.contact-form-card-v2 .select-field-v2 .bc-topic-control{
  width:100%!important;
  height:auto!important;
  min-height:52px!important;
  border-radius:0!important;
  display:flex!important;
  place-items:initial!important;
  background:transparent!important;
  color:inherit!important;
  font-size:inherit!important;
}
.contact-form-card .select-field-v2 [data-bc-topic-label],
.contact-form-card-v2 .select-field-v2 [data-bc-topic-label]{
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  border-radius:0!important;
  display:block!important;
  place-items:initial!important;
  background:transparent!important;
  color:inherit!important;
  font-size:inherit!important;
  line-height:1.35!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
}
.contact-form-card .select-field-v2 .bc-topic-menu,
.contact-form-card-v2 .select-field-v2 .bc-topic-menu{
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:min(330px,50vh)!important;
  border-radius:19px!important;
  display:grid!important;
  place-items:initial!important;
  background:#fff!important;
  color:#354d7d!important;
  font-size:14px!important;
  overflow:auto!important;
}
