/* ============================================================
   PlagiMusicali — Share Buttons
   Da includere in caso.php (o in main CSS)
   ============================================================ */

.share-section {
  margin: 28px 0 8px;
  padding: 20px 0 0;
  border-top: 1px solid #2e2e38;
}

.share-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #7a7a8c;
  margin-bottom: 12px;
}

.share-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* ---------- singolo pulsante ---------- */
.share-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 14px;
  border-radius: 6px;
  border: 1px solid #2e2e38;
  background: #1a1a1f;
  color: #c4c4d0;
  font-size: 12.5px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  text-decoration: none;
  line-height: 1;
  transition: background .18s, border-color .18s, color .18s, transform .1s;
  white-space: nowrap;
}
.share-btn:active { transform: scale(.96); }

.share-btn svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  fill: currentColor;
}

/* colori brand al hover */
.share-btn[data-net="facebook"]:hover   { background:#1877f2; border-color:#1877f2; color:#fff; }
.share-btn[data-net="twitter"]:hover    { background:#000;    border-color:#555;    color:#fff; }
.share-btn[data-net="whatsapp"]:hover   { background:#25d366; border-color:#25d366; color:#000; }
.share-btn[data-net="telegram"]:hover   { background:#229ed9; border-color:#229ed9; color:#fff; }
.share-btn[data-net="messenger"]:hover  { background:#0084ff; border-color:#0084ff; color:#fff; }
.share-btn[data-net="reddit"]:hover     { background:#ff4500; border-color:#ff4500; color:#fff; }
.share-btn[data-net="sms"]:hover        { background:#34c759; border-color:#34c759; color:#000; }
.share-btn[data-net="email"]:hover      { background:#e8b84b; border-color:#e8b84b; color:#111; }
.share-btn[data-net="copy"]:hover       { background:#3a3a48; border-color:#555;    color:#fff; }

/* stato "copiato" per il pulsante copy */
.share-btn[data-net="copy"].copied {
  background: #3ecf72;
  border-color: #3ecf72;
  color: #000;
}

/* ---------- responsive ---------- */
@media (max-width: 480px) {
  .share-buttons { gap: 6px; }
  .share-btn { padding: 8px 11px; font-size: 12px; }
  /* su mobile molto stretto: solo icona */
  .share-btn .share-btn-label { display: none; }
  .share-btn { padding: 9px 10px; }
}