/* iFeedeBook - Fix composer buttons V7
   Corrige los botones del composer principal:
   - Iconos / Subir canción / Foto compactos.
   - Foto con ancho suficiente.
   - Publicar misma altura que Publicar en una página.
   - Publicar con icono de notita/editar.
   Aplica web normal + iPhone standalone.
*/

/* Filas del composer */
.post-composer .form-row,
#composerForm .form-row,
#postForm .form-row,
.ifb-composer-tools-inline,
.ifb-lite-composer-tools,
.composer-tools,
.composer-actions,
.ifb-composer-actions-row {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
  box-sizing: border-box !important;
}

#postForm button[type="submit"].ifb-publish-button-with-note {
    top: -2px !important;
}

/* Botones superiores compactos: Iconos / Subir canción / Foto */
.ifb-composer-icon-button,
.ifb-lite-music-toggle-button,
.ifb-composer-music-button,
.ifb-composer-photo-button,
.ifb-lite-photo-button,
.ifb-photo-upload-button,
.post-composer label.button,
.post-composer label[for="photo"],
.post-composer label[for="image"],
.post-composer label[for="postPhoto"],
.post-composer label[for="postImage"],
#composerForm label.button,
#composerForm label[for="photo"],
#composerForm label[for="image"],
#composerForm label[for="postPhoto"],
#composerForm label[for="postImage"],
#postForm label.button,
#postForm label[for="photo"],
#postForm label[for="image"],
#postForm label[for="postPhoto"],
#postForm label[for="postImage"] {
  height: 27px !important;
  min-height: 27px !important;
  max-height: 27px !important;
  line-height: 15px !important;
  padding: 4px 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  vertical-align: middle !important;
  margin: 0 !important;
  position: relative !important;
  top: 0 !important;
  white-space: nowrap !important;
  font-size: 12px !important;
}

.ifb-composer-icon-button:active,
.ifb-composer-icon-button.ifb-icon-picker-active,
.ifb-lite-music-toggle-button:active,
.ifb-composer-music-button:active,
.ifb-composer-photo-button:active,
.ifb-lite-photo-button:active,
.ifb-photo-upload-button:active,
.post-composer label.button:active,
.post-composer label[for="photo"]:active,
.post-composer label[for="image"]:active,
.post-composer label[for="postPhoto"]:active,
.post-composer label[for="postImage"]:active,
#composerForm label.button:active,
#composerForm label[for="photo"]:active,
#composerForm label[for="image"]:active,
#composerForm label[for="postPhoto"]:active,
#composerForm label[for="postImage"]:active,
#postForm label.button:active,
#postForm label[for="photo"]:active,
#postForm label[for="image"]:active,
#postForm label[for="postPhoto"]:active,
#postForm label[for="postImage"]:active {
  transform: translateY(1px) !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .22) !important;
}

/* Anchos visuales */
.ifb-composer-icon-button {
  min-width: 88px !important;
}

.ifb-lite-music-toggle-button,
.ifb-composer-music-button,
button.ifb-lite-music-toggle-button,
button.ifb-composer-music-button {
  min-width: 136px !important;
}

/* Foto estaba muy corto: lo llevamos a proporción cercana */
.ifb-composer-photo-button,
.ifb-lite-photo-button,
.ifb-photo-upload-button,
.post-composer label[for="photo"],
.post-composer label[for="image"],
.post-composer label[for="postPhoto"],
.post-composer label[for="postImage"],
#composerForm label[for="photo"],
#composerForm label[for="image"],
#composerForm label[for="postPhoto"],
#composerForm label[for="postImage"],
#postForm label[for="photo"],
#postForm label[for="image"],
#postForm label[for="postPhoto"],
#postForm label[for="postImage"] {
  min-width: 76px !important;
}

/* Iconos internos centrados */
.ifb-composer-icon-button .fbico,
.ifb-composer-icon-button .fb2ico,
.ifb-composer-icon-button .fa,
.ifb-lite-music-toggle-button .fbico,
.ifb-lite-music-toggle-button .fb2ico,
.ifb-lite-music-toggle-button .fa,
.ifb-composer-music-button .fbico,
.ifb-composer-music-button .fb2ico,
.ifb-composer-music-button .fa,
.ifb-composer-photo-button .fbico,
.ifb-composer-photo-button .fb2ico,
.ifb-composer-photo-button .fa,
.ifb-lite-photo-button .fbico,
.ifb-lite-photo-button .fb2ico,
.ifb-lite-photo-button .fa,
.ifb-photo-upload-button .fbico,
.ifb-photo-upload-button .fb2ico,
.ifb-photo-upload-button .fa,
.post-composer label.button .fbico,
.post-composer label.button .fb2ico,
.post-composer label.button .fa,
#composerForm label.button .fbico,
#composerForm label.button .fb2ico,
#composerForm label.button .fa,
#postForm label.button .fbico,
#postForm label.button .fb2ico,
#postForm label.button .fa {
  position: relative !important;
  top: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  vertical-align: middle !important;
}

/* Botones inferiores: Publicar y Publicar en una página misma altura */
.post-composer button[type="submit"],
#composerForm button[type="submit"],
#postForm button[type="submit"],
.ifb-composer-submit-button,
.ifb-lite-publish-button,
.ifb-lite-publish-page-button,
button[data-ifb-publish],
button[data-ifb-publish-page],
.post-composer .ifb-publish-page-button,
#composerForm .ifb-publish-page-button,
#postForm .ifb-publish-page-button {
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  line-height: 16px !important;
  padding: 5px 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  box-sizing: border-box !important;
  vertical-align: middle !important;
  margin: 0 !important;
  position: relative !important;
  top: 0 !important;
  white-space: nowrap !important;
  font-size: 12px !important;
}

.post-composer button[type="submit"]:active,
#composerForm button[type="submit"]:active,
#postForm button[type="submit"]:active,
.ifb-composer-submit-button:active,
.ifb-lite-publish-button:active,
.ifb-lite-publish-page-button:active,
button[data-ifb-publish]:active,
button[data-ifb-publish-page]:active,
.post-composer .ifb-publish-page-button:active,
#composerForm .ifb-publish-page-button:active,
#postForm .ifb-publish-page-button:active {
  transform: translateY(1px) !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .26) !important;
}

/* Publicar mantiene tamaño compacto, igual altura que el de página */
.post-composer button[type="submit"],
#composerForm button[type="submit"],
#postForm button[type="submit"],
.ifb-composer-submit-button,
.ifb-lite-publish-button,
button[data-ifb-publish] {
  min-width: 92px !important;
}

/* Publicar en una página puede ser más ancho pero misma altura */
.ifb-lite-publish-page-button,
button[data-ifb-publish-page],
.post-composer .ifb-publish-page-button,
#composerForm .ifb-publish-page-button,
#postForm .ifb-publish-page-button {
  min-width: 190px !important;
}

#pagePostForm .ifb-composer-icon-row,
#pagePostForm .photo-upload-row,
#pagePostForm > div {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  margin: 7px 6px 0 0 !important;
  vertical-align: middle !important;
}

#pagePostForm > div button[type="submit"] {
  margin: 0 !important;
}

#pagePostForm {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0 6px !important;
}

#pagePostForm > .retro-icon-picker {
  display: none !important;
}

#pagePostForm textarea {
  flex: 0 0 100% !important;
  width: 100% !important;
  margin: 0 0 7px 0 !important;
}

#pagePostForm .ifb-composer-icon-row,
#pagePostForm .photo-upload-row,
#pagePostForm .ifb-page-post-actions {
  margin: 0 6px 0 0 !important;
}

#pagePostForm .photo-upload-row .photo-upload-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  min-width: 20px !important;
  height: 18px !important;
  overflow: visible !important;
  margin-right: 4px !important;
}

#pagePostForm .photo-upload-row .photo-upload-icon .fbico,
#pagePostForm .photo-upload-row .fbico-photo {
  width: 19px !important;
  min-width: 19px !important;
  height: 16px !important;
  margin-right: 0 !important;
  vertical-align: -3px !important;
}

/* Icono notita/editar para Publicar */
.ifb-publish-note-icon {
  width: 15px !important;
  height: 15px !important;
  min-width: 15px !important;
  display: inline-block !important;
  position: relative !important;
  box-sizing: border-box !important;
  border: 1px solid #6f7f9a !important;
  background:
    linear-gradient(to bottom, #fffef6, #f1df9b) !important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.9),
    0 1px rgba(255,255,255,.5) !important;
  margin-right: 4px !important;
  top: 0 !important;
}

.ifb-publish-note-icon::before {
  content: "" !important;
  position: absolute !important;
  left: 3px !important;
  right: 3px !important;
  top: 4px !important;
  height: 1px !important;
  background: #9b8b56 !important;
  box-shadow: 0 3px #9b8b56, 0 6px #9b8b56 !important;
}

.ifb-publish-note-icon::after {
  content: "" !important;
  position: absolute !important;
  width: 9px !important;
  height: 3px !important;
  right: -3px !important;
  bottom: 1px !important;
  background: #d87822 !important;
  border: 1px solid #9b4b13 !important;
  transform: rotate(-38deg) !important;
  transform-origin: center !important;
}

/* Evita doble icono si el botón ya tenía uno propio muy pegado */
.ifb-publish-button-with-note > .fbico:first-child,
.ifb-publish-button-with-note > .fb2ico:first-child {
  margin-right: 4px !important;
}

/* Mobile: mantiene compactos sin romper línea */
@media (max-width: 760px) {
  .ifb-composer-icon-button,
  .ifb-lite-music-toggle-button,
  .ifb-composer-music-button,
  .ifb-composer-photo-button,
  .ifb-lite-photo-button,
  .ifb-photo-upload-button,
  .post-composer label.button,
  #composerForm label.button,
  #postForm label.button {
    height: 27px !important;
    min-height: 27px !important;
    max-height: 27px !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  .ifb-lite-music-toggle-button,
  .ifb-composer-music-button,
  button.ifb-lite-music-toggle-button,
  button.ifb-composer-music-button {
    min-width: 132px !important;
  }

  .ifb-composer-photo-button,
  .ifb-lite-photo-button,
  .ifb-photo-upload-button,
  .post-composer label[for="photo"],
  .post-composer label[for="image"],
  .post-composer label[for="postPhoto"],
  .post-composer label[for="postImage"],
  #composerForm label[for="photo"],
  #composerForm label[for="image"],
  #composerForm label[for="postPhoto"],
  #composerForm label[for="postImage"],
  #postForm label[for="photo"],
  #postForm label[for="image"],
  #postForm label[for="postPhoto"],
  #postForm label[for="postImage"] {
    min-width: 74px !important;
  }
}
