/* ROY DIAMOND — extra-low phone floating actions in one vertical side line V43 */

@media (max-width: 700px) {
  body {
    padding-bottom: 0 !important;
  }

  .floating-actions {
    position: fixed !important;
    top: auto !important;
    right: max(8px, env(safe-area-inset-right)) !important;
    bottom: max(28px, calc(env(safe-area-inset-bottom) + 20px)) !important;
    left: auto !important;

    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;

    transform: none !important;
    z-index: 1600 !important;
  }

  .floating-action {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    max-width: 40px !important;

    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 12px !important;
    box-shadow: 0 8px 19px rgba(0, 0, 0, 0.14) !important;
  }

  .floating-action .action-icon {
    width: 19px !important;
    height: 19px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .floating-action .action-icon svg {
    width: 16px !important;
    height: 16px !important;
  }

  .floating-action > span:not(.action-icon) {
    display: none !important;
  }
}

@media (max-width: 360px) {
  .floating-actions {
    top: auto !important;
    right: max(6px, env(safe-area-inset-right)) !important;
    bottom: max(22px, calc(env(safe-area-inset-bottom) + 16px)) !important;
    gap: 7px !important;
  }

  .floating-action {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    max-width: 38px !important;
    border-radius: 11px !important;
  }

  .floating-action .action-icon,
  .floating-action .action-icon svg {
    width: 16px !important;
    height: 16px !important;
  }
}
