/* Share Buttons Shortcode Styles */
.lubinik-share {
  display: flex;
  align-items: center;
  gap: var(--social-icon-gap, 8px);
  flex-wrap: wrap;
}

/* Alignment variants */
.lubinik-share.share--align-left   { justify-content: flex-start; }
.lubinik-share.share--align-center { justify-content: center; }
.lubinik-share.share--align-right  { justify-content: flex-end; }

/* Floating variants (fixed to viewport) */
.lubinik-share.share--floating {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  z-index: var(--z-fixed, 1030);
  flex-direction: column;
}
.lubinik-share.share--floating.share--float-left  { left: 16px; }
.lubinik-share.share--floating.share--float-right { right: 16px; }

/* Size variants */
.lubinik-share.share--size-sm .share-link { width: 48px; height: 48px; }
.lubinik-share.share--size-md .share-link { width: 54px; height: 54px; }

/* Shape variants */
.lubinik-share.share--rounded .share-link { border-radius: var(--social-icon-radius, 8px); }
.lubinik-share.share--pill    .share-link { border-radius: var(--radius-full, 9999px); }
.lubinik-share.share--square  .share-link { border-radius: 6px; }

/* Link chip */
.lubinik-share .share-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-secondary);
  color: var(--color-white, #fff);
  text-decoration: none;
  transition: all var(--transition-fast, 0.15s ease-in-out);
  box-shadow: none;
}

.lubinik-share .share-link:hover {
  background-color: var(--color-primary-light);
  transform: translateY(-2px);
  color: var(--color-white, #fff);
}

/* Icon */
.lubinik-share .share-link i {
  color: currentColor;
  font-size: 16px;
  line-height: 1;
}

/* Optional label */
.lubinik-share .share-label {
  margin-left: 8px;
  font-size: var(--font-size-sm, 1rem);
  color: var(--color-white, #fff);
}

/* When labels are shown, add horizontal padding */
.lubinik-share .share-link .share-label { display: inline-block; }
.lubinik-share .share-link:has(.share-label) { padding: 0 12px; }

/* Desktop: hide the FAB button container by default */
.lubinik-share-fab { display: none; }

/* Mobile FAB toggle: hide floating bar and show bottom-right button */
@media (max-width: 768px) {
  /* Hide the vertical floating bar on mobile */
  .lubinik-share.share--floating { display: none !important; }

  /* Floating Action Button container */
  .lubinik-share-fab {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: var(--z-fixed, 1030);
    display: block;
  }
  .lubinik-share-fab[data-pos="left"] { left: 16px; right: auto; }
  .lubinik-share-fab[data-pos="left"] .share-fab-panel { left: 0; right: auto; }

  /* The FAB button */
  .lubinik-share-fab .share-fab-btn {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-full, 9999px);
    background-color: var(--color-secondary);
    color: var(--color-white, #fff);
    border: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    box-shadow: var(--shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));
    cursor: pointer;
  }
  .lubinik-share-fab.is-open .share-fab-btn { background-color: var(--color-primary-dark, #0b8693); }

  /* The panel that contains the actual share links */
  .lubinik-share-fab .share-fab-panel {
    position: absolute;
    right: 70px;
    bottom: 0;
    background: var(--footer-background-color, #232327);
    padding: 8px;
    border-radius: 12px;
    box-shadow: var(--shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));
  }
  .lubinik-share-fab .share-fab-panel .lubinik-share {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center;
    gap: 12px;
  }
  .lubinik-share-fab[data-pos="right"] .share-fab-panel .lubinik-share {
    flex-direction: row-reverse !important;
  }
}
