
.btn-message {
    background: #ffbf00;
    color: #000;
    padding: 7px 14px;
    border-radius: 8px;
    font-weight: bold;
    margin-left: 10px;
    text-decoration: none;
    display: inline-block;
}
.btn-message:hover {
    background: #e6aa00;
    color: #000;
}

/* Profil başlığı */



.container { margin-top: 30px; }
.image-container { display: flex; gap: 25px; background: white; padding: 20px; border-radius: 15px; box-shadow: 0 3px 10px rgba(0,0,0,0.1); }
.profile-header { text-align:center; padding:30px 10px; background:white; border-bottom:1px solid #eee; }
.profile-header img { width:120px; height:120px; border-radius:50%; object-fit:cover; border:3px solid #ff8c42; }
.profile-header h3 { margin-top:10px; color:#333; }
.profile-header p { color:#666; font-size:14px; }
.action-buttons { display:flex; justify-content:center; gap:10px; margin-top:15px; }
.btn-follow { background:#ff6f00; color:#fff; border:none; padding:8px 16px; border-radius:20px; font-weight:500; }
.btn-follow.following { background:#ccc; color:#333; }
.follow-stats { display:flex; justify-content:center; gap:40px; margin-top:15px; }
.follow-stats div { text-align:center; cursor:pointer; }
.follow-stats div:hover { color:#ff6f00; }

/* Media bölməsi */
.media-section {
  max-width:1200px;
  margin:40px auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.media-tabs {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-bottom: 15px;
}
.media-tabs .nav-item { margin: 0 5px; }

/* Grid */
.media-gallery {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap:10px;
  margin-top:20px;
  width: 100%;
}
@media(max-width:992px){ .media-gallery{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:576px){ .media-gallery{ grid-template-columns:repeat(2,1fr); } }

/* Kartlar */
.media-card {
  position: relative;
  background:white;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 4px 12px rgba(0,0,0,0.1);
  transition:0.3s;
  height:180px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.media-card:hover { transform:scale(1.03); }

.media-card img,
.media-card video,
.media-card audio {
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
}

/* Overlay */
.media-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0,0,0,0.5);
  color: #fff;
  font-size: 14px;
  display: flex;
  justify-content: space-between;
  padding: 5px 10px;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}
.media-overlay span i {
  margin-right: 5px;
  color: #ff6f00;
}

#load-more-photos, #load-more-videos, #load-more-audios {
  text-align:center;
  padding:15px;
  cursor:pointer;
  color:#ff6f00;
  font-weight:bold;
}
.spinner-border { width:1.2rem; height:1.2rem; margin-right:6px; }

.modal-user { display:flex; align-items:center; gap:10px; padding:5px 0; }
.modal-user img { width:40px; height:40px; border-radius:50%; object-fit:cover; }

/* MP3 görünməsi üçün düzəliş */
.audio-card {
  display: flex;
  flex-direction: column;
  background: #F58727 ;
  color: #fff;
  padding: 12px;
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.4);
  margin-bottom: 20px;
  max-width: 480px;
  width: 98%;
  margin-left: auto;
  margin-right: auto;
  transition: transform 0.3s;
}
.audio-card:hover { transform: scale(1.02); }

.audio-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.audio-icon { font-size: 28px; }
.audio-title { font-size: 18px; font-weight: 600; flex:1; }

.audio-player {
  width: 100%;
  border-radius: 10px;
  margin-bottom: 10px;
}

.audio-actions { display: flex; justify-content: flex-end; }

.like-btn {
  background: #00bcd4;
  border: none;
  padding: 6px 12px;
  border-radius: 12px;
  color: white;
  cursor: pointer;
  font-weight: 500;
  transition: 0.3s;
}
.like-btn.liked { background: #ff4444; box-shadow: 0 0 10px rgba(255,68,68,0.6); }
.like-btn:hover { background: #0097a7; }

/* Responsive */
@media(max-width:576px){
  .audio-card { padding: 12px; border-radius: 14px; }
  .audio-title { font-size: 16px; }
}



/* MP3 grid düzülüşü – 100% işlək versiya */
#audiosGallery {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 15px !important;
  width: 100% !important;
}

/* Mobil = 1 sütun */
@media(max-width:576px){
  #audiosGallery {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.nav-tabs .nav-link.active{background:#ff7b00;color:#fff;}
.photo-card{position:relative; 
break-inside:avoid; background:#fff;
margin-bottom:12px; border-radius:12px; 
overflow:hidden; box-shadow:0 4px 12px rgba(0,0,0,0.12);
transition:transform .18s;}
.photo-card:hover{transform:translateY(-6px);}
.photo-card img{width:100%;height:auto;object-fit:cover;}
.photo-info{padding:8px;font-size:14px;color:#333;}
.drop-area{border:2px dashed #ff7b00;padding:30px;text-align:center;color:#ff7b00;border-radius:10px;cursor:pointer;background:#fff;}
.delete-btn{position:absolute; top:5px; right:5px; background:red; color:#fff; border:none; border-radius:4px; padding:2px 6px; font-size:12px; cursor:pointer;}










