/* Vchat 0.57.3-alpha — composer toolbar hard geometry lock
   CSS-only. Existing button IDs/listeners remain untouched. */

#vchat-frontend-app.vchat-frontend-app .vchat-composer-tools{
  display:grid!important;
  grid-template-columns:max-content 42px 42px max-content minmax(12px,1fr) max-content!important;
  align-items:center!important;
  justify-items:start!important;
  column-gap:10px!important;
  row-gap:0!important;
  width:100%!important;
  min-height:54px!important;
  height:54px!important;
  padding:6px 0!important;
  margin:0 0 6px!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}

/* Preserve interactivity while locking only geometry. */
#vchat-frontend-app.vchat-frontend-app .vchat-composer-tools button{
  position:relative!important;
  box-sizing:border-box!important;
  margin:0!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  transform:none!important;
  align-self:center!important;
  justify-self:start!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  vertical-align:middle!important;
  line-height:1!important;
  overflow:visible!important;
}
#vchat-frontend-app.vchat-frontend-app .vchat-composer-tools button::before,
#vchat-frontend-app.vchat-frontend-app .vchat-composer-tools button::after{
  pointer-events:none!important;
}

/* Exact DOM slots: Adjuntar / mic / emoji / Programar / spacer / saved reply. */
#vchat-frontend-app.vchat-frontend-app #vchat-attach{grid-column:1!important;}
#vchat-frontend-app.vchat-frontend-app #vchat-record-audio{grid-column:2!important;}
#vchat-frontend-app.vchat-frontend-app #vchat-emoji{grid-column:3!important;}
#vchat-frontend-app.vchat-frontend-app #vchat-schedule-message{grid-column:4!important;}
#vchat-frontend-app.vchat-frontend-app .vchat-composer-tools > span{grid-column:5!important;min-width:0!important;width:auto!important;}
#vchat-frontend-app.vchat-frontend-app #vchat-saved-reply{grid-column:6!important;justify-self:end!important;}

/* Shared 42px visual axis. */
#vchat-frontend-app.vchat-frontend-app #vchat-attach,
#vchat-frontend-app.vchat-frontend-app #vchat-record-audio,
#vchat-frontend-app.vchat-frontend-app #vchat-emoji,
#vchat-frontend-app.vchat-frontend-app #vchat-schedule-message,
#vchat-frontend-app.vchat-frontend-app #vchat-saved-reply{
  height:42px!important;
  min-height:42px!important;
  max-height:42px!important;
  border:1px solid transparent!important;
  color:#6651c7!important;
  font-family:inherit!important;
  font-weight:760!important;
  box-shadow:none!important;
  outline-offset:2px!important;
}

/* Text actions: same pill geometry. */
#vchat-frontend-app.vchat-frontend-app #vchat-attach,
#vchat-frontend-app.vchat-frontend-app #vchat-schedule-message{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  min-width:126px!important;
  padding:0 14px!important;
  border-radius:13px!important;
  background:transparent!important;
  font-size:13px!important;
  white-space:nowrap!important;
  text-indent:0!important;
}

/* Use fixed icon boxes so baselines cannot drift. */
#vchat-frontend-app.vchat-frontend-app #vchat-attach::before{
  content:'+'!important;
  display:grid!important;
  place-items:center!important;
  width:26px!important;
  height:26px!important;
  min-width:26px!important;
  flex:0 0 26px!important;
  margin:0!important;
  border-radius:8px!important;
  background:#efeaff!important;
  color:#6752cc!important;
  font-size:18px!important;
  font-weight:850!important;
  line-height:1!important;
}

/* Round icon actions: same 42x42 box, centered SVG/vector. */
#vchat-frontend-app.vchat-frontend-app #vchat-record-audio,
#vchat-frontend-app.vchat-frontend-app #vchat-emoji{
  display:grid!important;
  place-items:center!important;
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  padding:0!important;
  border-radius:50%!important;
  background:#fff!important;
  border-color:#e4def5!important;
  font-size:0!important;
}
#vchat-frontend-app.vchat-frontend-app #vchat-emoji{
  background:#f4effd!important;
  border-color:#f4effd!important;
}
#vchat-frontend-app.vchat-frontend-app #vchat-record-audio svg{
  display:block!important;
  width:19px!important;
  height:19px!important;
  margin:0!important;
  color:#6852ca!important;
}

/* Stable vector smile icon — no font emoji. */
#vchat-frontend-app.vchat-frontend-app #vchat-emoji::before{
  content:''!important;
  display:block!important;
  width:20px!important;
  height:20px!important;
  margin:0!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:20px 20px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236852ca' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8.5 14.5c.9 1.4 2 2 3.5 2s2.6-.6 3.5-2'/%3E%3Cpath d='M9 9.5h.01M15 9.5h.01' stroke-width='2.4'/%3E%3C/svg%3E")!important;
}

/* Programar: force actual text visible and stable clock vector. */
#vchat-frontend-app.vchat-frontend-app #vchat-schedule-message{
  color:transparent!important;
  font-size:0!important;
}
#vchat-frontend-app.vchat-frontend-app #vchat-schedule-message::before{
  content:''!important;
  display:block!important;
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  flex:0 0 20px!important;
  margin:0!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:20px 20px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236852ca' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5v5l3.2 1.8'/%3E%3C/svg%3E")!important;
}
#vchat-frontend-app.vchat-frontend-app #vchat-schedule-message::after{
  content:'Programar'!important;
  display:block!important;
  color:#6651c7!important;
  font-size:13px!important;
  font-weight:760!important;
  line-height:1!important;
  white-space:nowrap!important;
}
#vchat-frontend-app.vchat-frontend-app #vchat-schedule-message > span,
#vchat-frontend-app.vchat-frontend-app #vchat-schedule-message .screen-reader-text{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

/* Saved reply: align to the very same 42px centerline. */
#vchat-frontend-app.vchat-frontend-app #vchat-saved-reply{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 12px!important;
  background:transparent!important;
  border-radius:12px!important;
  font-size:11px!important;
  white-space:nowrap!important;
}

/* Hover/focus polish only; no click interception. */
#vchat-frontend-app.vchat-frontend-app #vchat-attach:hover,
#vchat-frontend-app.vchat-frontend-app #vchat-schedule-message:hover,
#vchat-frontend-app.vchat-frontend-app #vchat-saved-reply:hover,
#vchat-frontend-app.vchat-frontend-app #vchat-record-audio:hover,
#vchat-frontend-app.vchat-frontend-app #vchat-emoji:hover{
  background:#f5f1fd!important;
  border-color:#ded5f6!important;
}
#vchat-frontend-app.vchat-frontend-app .vchat-composer-tools button:focus-visible{
  outline:2px solid rgba(103,82,204,.32)!important;
}
#vchat-frontend-app.vchat-frontend-app .vchat-composer-tools button:disabled{
  opacity:.45!important;
  cursor:not-allowed!important;
}

@media (max-width:1100px) and (min-width:821px){
  #vchat-frontend-app.vchat-frontend-app .vchat-composer-tools{
    grid-template-columns:max-content 40px 40px max-content minmax(6px,1fr) max-content!important;
    column-gap:7px!important;
  }
  #vchat-frontend-app.vchat-frontend-app #vchat-attach,
  #vchat-frontend-app.vchat-frontend-app #vchat-schedule-message{
    min-width:112px!important;
    padding-inline:10px!important;
  }
}

@media (max-width:820px){
  #vchat-frontend-app.vchat-frontend-app .vchat-composer-tools{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    height:auto!important;
    min-height:48px!important;
    overflow-x:auto!important;
  }
  #vchat-frontend-app.vchat-frontend-app #vchat-attach,
  #vchat-frontend-app.vchat-frontend-app #vchat-schedule-message{
    min-width:auto!important;
    padding-inline:10px!important;
  }
  #vchat-frontend-app.vchat-frontend-app #vchat-saved-reply{
    margin-left:auto!important;
  }
}