/* =======================================================
   ELAN KARTLARI — LOKAL DİZAYN (kompakt, sabit layout)
   FIXED: VIP / PREMIUM / DISCOUNT border-glow + badge contrast
   Fayl: html/css/elan-card.css
   ======================================================= */
:root{
  --bd:    var(--q-border,      #e5e7eb);
  --fg:    var(--q-text,        #111827);
  --fg2:   var(--q-text-muted,  #6b7280);
  --chip:  var(--q-border-light,#f3f4f6);
  --chipbd:var(--q-border,      #e5e7eb);
  --accent:var(--q-primary,     #1d4ed8);
  --danger:var(--q-danger,      #ef4444);
  --warn:  var(--q-warn,        #f59e0b);
  --vip:   var(--q-vip,         #7c3aed);

  --vip-ring:     var(--q-vip-ring,      rgba(124,58,237,.92));
  --vip-glow:     var(--q-vip-glow,      rgba(124,58,237,.28));

  --premium-ring: var(--q-premium-ring,  rgba(245,158,11,.95));
  --premium-glow: var(--q-premium-glow,  rgba(245,158,11,.26));

  --discount-ring:var(--q-discount-ring, rgba(239,68,68,.96));
  --discount-glow:var(--q-discount-glow, rgba(239,68,68,.24));
}

/* ================== KART ================== */
.elan-card{
  position:relative;
  background:#fff;
  border:1px solid var(--bd);
  border-radius:18px;
  padding:6px 6px 5px;
  box-shadow:0 2px 8px rgba(0,0,0,.06);
  transition:transform .2s, box-shadow .2s, border-color .2s, filter .2s;
  display:flex;
  flex-direction:column;
  height:100%;
  overflow:hidden;
  isolation:isolate;
}

.elan-card:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(0,0,0,.12);
}

/* Gücləndirilmiş VIP / Premium / Endirim konturları */
.elan-card.card--vip{
  border:2px solid var(--vip-ring);
  box-shadow:
    0 0 0 3px rgba(124,58,237,.16),
    0 0 18px var(--vip-glow),
    0 12px 26px rgba(124,58,237,.12),
    inset 0 0 0 1px rgba(255,255,255,.55);
}

.elan-card.card--premium{
  border:2px solid var(--premium-ring);
  box-shadow:
    0 0 0 3px rgba(245,158,11,.18),
    0 0 18px var(--premium-glow),
    0 12px 26px rgba(245,158,11,.12),
    inset 0 0 0 1px rgba(255,255,255,.55);
}

.elan-card.card--discount{
  border:2px solid var(--discount-ring);
  box-shadow:
    0 0 0 3px rgba(239,68,68,.16),
    0 0 18px var(--discount-glow),
    0 12px 26px rgba(239,68,68,.10),
    inset 0 0 0 1px rgba(255,255,255,.55);
  padding:5px;
}

.block-link{
  display:block;
  text-decoration:none;
  color:inherit;
  flex-grow:1;
}

/* ================== ŞƏKİL & OVERLAY ================== */
.photo-wrap{
  position:relative;
}

.elan-card .photo{
  width:100%;
  height:120px;
  object-fit:cover;
  border-radius:14px;
  margin-bottom:4px;
  background:#f3f4f6;
  display:block;
}

.elan-card.card--discount .photo{
  height:116px;
  margin-bottom:3px;
}

.rating-chip{
  position:absolute;
  right:8px;
  bottom:8px;
  border-radius:9px;
  background:#fff;
  border:1px solid var(--bd);
  padding:2px 6px;
  font-weight:700;
  font-size:11px;
  box-shadow:0 1px 3px rgba(0,0,0,.10);
  color:#111827;
}

/* ================== BAŞLIQ ================== */
.title-row{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  margin-bottom:4px;
}

.elan-card .title{
  font-weight:800;
  font-size:14px;
  line-height:1.2;
  color:#1f2937;
  text-align:center;
  margin:0 auto;
  white-space:normal;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}

.elan-card.card--discount .title{
  font-size:13px;
}

/* ================== BADGE-lər ================== */
.badge{
  position:absolute;
  top:8px;
  left:8px;
  border-radius:10px;
  padding:4px 9px;
  font-weight:900;
  font-size:11px;
  color:#fff;
  z-index:25;
  line-height:1.1;
  letter-spacing:.1px;
  text-shadow:0 1px 1px rgba(0,0,0,.22);
  box-shadow:0 6px 14px rgba(0,0,0,.18);
}

.badge.discount{
  background:linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
  border:1px solid rgba(255,255,255,.28);
  color:#fff !important;
}

/* ================== META XƏTTİ ================== */
.meta-info{
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:4px;
  min-height:22px;
  min-width:0;
}

.elan-card.card--discount .meta-info{
  margin-bottom:3px;
  min-height:20px;
}

.meta-left{
  display:flex;
  align-items:center;
  gap:6px;
  flex:1;
  min-width:0;
}

.meta-left .chip{
  flex:0 1 auto;
  min-width:0;
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:#f3f4f6;
  border:1px solid #e5e7eb;
  border-radius:9999px;
  padding:3px 8px;
  font-size:10px;
  font-weight:600;
  color:var(--fg2);
  line-height:1;
  white-space:nowrap;
  box-shadow:0 2px 6px rgba(2,132,199,.10);
}

.meta-left .chip img{
  width:13px;
  height:13px;
  opacity:.9;
  display:block;
  object-fit:contain;
}

.meta-left .chip.region{
  flex:1 1 auto;
  min-width:0;
  max-width:100%;
  overflow:hidden;
  box-sizing:border-box;
}

.meta-left .chip .txt{
  display:block;
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* ================== QİYMƏT SƏTRİ ================== */
.price-row{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:3px;
  margin:2px 0 4px;
  min-height:auto;
  width:100%;
}

.elan-card.card--discount .price-row{
  gap:2px;
  margin:0 0 2px;
}

.price-row.price-row--tight{
  flex-direction:column;
  gap:3px;
  align-items:flex-start;
}

.price-chip{
  background:var(--chip);
  border:1px solid var(--chipbd);
  border-radius:8px;
  padding:2px 7px;
  font-weight:700;
  font-size:10.5px;
  color:var(--fg);
  white-space:nowrap;
  width:fit-content;
  order:unset;
  display:inline-flex;
  align-items:center;
  gap:6px;
  line-height:1.2;
}

.price-chip .lbl{
  color:var(--accent);
  font-weight:800;
  margin-right:0;
  font-size:10px;
}

.price-chip.price-daily{
  order:unset;
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.price-chip.price-hourly{
  order:unset;
  max-width:100%;
  min-width:0;
}

.price-chip.price-hourly .hourly-slot-tail{
  min-width:0;
  flex:1 1 auto;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* ===== Endirimli görünüş ===== */
.price-chip--disc{
  background:#fff7ed;
  border-color:#fed7aa;
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.price-chip--disc .old{
  text-decoration:line-through;
  text-decoration-thickness:2px;
  text-decoration-color:var(--danger);
  color:#9ca3af;
  margin-right:4px;
}

.price-chip--disc .new{
  color:var(--danger);
  font-weight:800;
  font-size:11.5px;
}

.price-chip .old,
.price-chip .new{
  margin-left:0;
}

/* ================== FOOTER ================== */
.card-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:auto;
  padding-top:4px;
}

.elan-card.card--discount .card-footer{
  padding-top:2px;
}

.footer-left{
  display:flex;
  align-items:center;
  gap:6px;
}

.cat-title{
  font-weight:800;
  font-size:12px;
  color:#0ea5e9;
  letter-spacing:.2px;
  line-height:1;
  white-space:nowrap;
}

.cat-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:3px 8px;
  background:#f3f4f6;
  border:1px solid #d1e9ff;
  border-radius:9999px;
  color:#075985;
  font-weight:700;
  font-size:10.5px;
  line-height:1;
  white-space:nowrap;
  box-shadow:0 2px 6px rgba(2,132,199,.12);
}

.cat-badge::before{
  content:"";
  width:13px;
  height:13px;
  display:inline-block;
  background-color:#0369a1;
  -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20.59 13.41L11 3H4v7l9.59 9.59a2 2 0 0 0 2.83 0l4.17-4.17a2 2 0 0 0 0-2.83z"></path><circle cx="6.5" cy="6.5" r="1.5"></circle></svg>') no-repeat center/contain;
          mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20.59 13.41L11 3H4v7l9.59 9.59a2 2 0 0 0 2.83 0l4.17-4.17a2 2 0 0 0 0-2.83z"></path><circle cx="6.5" cy="6.5" r="1.5"></circle></svg>') no-repeat center/contain;
}

/* ================== Iconlar ================== */
.icons{
  display:flex;
  align-items:center;
  gap:3px !important;
}

.icon-link{
  display:inline-flex;
  width:26px;
  height:26px;
  border-radius:8px;
  align-items:center;
  justify-content:center;
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  margin:0 !important;
  box-shadow:none !important;
  transform:none !important;
  transition:opacity .15s ease;
  flex:0 0 auto;
}

.icon-link img{
  width:18px;
  height:18px;
  display:block;
  object-fit:contain;
}

.icon-link:hover{
  opacity:.85;
  background:transparent !important;
  transform:none !important;
  box-shadow:none !important;
}

.icon-link:active{
  opacity:.75;
  transform:none !important;
}

.icon-link.disabled{
  opacity:.35;
  pointer-events:none;
}

.icon-static,
.icon-static *{
  pointer-events:none !important;
  cursor:default !important;
}

/* ================== VIP & PREMIUM ikonları ================== */
.vip-badge,
.premium-badge{
  position:absolute;
  top:6px;
  right:6px;
  width:52px;
  height:52px;
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  z-index:30;
  pointer-events:none;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.35));
}

.elan-card.card--vip .vip-badge{
  background-image:url("/img/icons/vip.png");
}

.elan-card.card--premium .premium-badge{
  background-image:url("/img/icons/premium.png");
}

/* ================== Grid util-ləri ================== */
.grid{
  display:grid;
  gap:10px;
}

.cols-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

@media (min-width:768px){
  .cols-sm-3{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (min-width:1024px){
  .cols-md-4{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media (min-width:1280px){
  .cols-lg-5{
    grid-template-columns:repeat(5,minmax(0,1fr));
  }
}

.page-title{
  font-size:19px;
  font-weight:800;
  margin:10px 0;
}

.container{
  max-width:1420px;
  margin:0 auto;
  padding:8px;
}

/* === REGION CHIP ellipsis & layout qorunması === */
.meta-left{
  flex-wrap:nowrap;
  min-width:0;
}

.meta-left .chip.region{
  flex:0 1 auto;
  max-width:60%;
  min-width:0;
  overflow:hidden;
  box-sizing:border-box;
}

.meta-left .chip.region .txt{
  display:block;
  min-width:0;
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.meta-left .chip:first-child{
  flex:0 0 auto;
}

@media (max-width:480px){
  .meta-left .chip.region{
    max-width:70%;
  }
}

/* ================== Kiçik ekran düzəlişləri ================== */
@media (max-width:480px){
  .meta-info{
    flex-wrap:wrap;
  }

  .meta-left{
    flex-basis:100%;
  }

  .price-chip{
    font-size:9.8px;
    padding:1px 6px;
  }

  .price-chip--disc .new{
    font-size:10.5px;
  }
}

/* ===== ICONS: HARD OVERRIDE ===== */
.elan-card .card-footer .icons,
.elan-card .card-footer .icons.icons--tight{
  display:flex !important;
  align-items:center !important;
  gap:0 !important;
  column-gap:0 !important;
}

.elan-card .card-footer .icons > *{
  margin:0 !important;
  padding:0 !important;
}

.elan-card .card-footer .icon-link{
  width:20px !important;
  height:20px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  border-radius:0 !important;
}

.elan-card .card-footer .icon-link img{
  width:16px !important;
  height:16px !important;
  display:block !important;
}

.elan-card .card-footer .icon-static,
.elan-card .card-footer .icon-static *{
  pointer-events:none !important;
  cursor:default !important;
}

.card-footer .icons .icon-link img[src*="instagram"]{
  width:20px !important;
  height:20px !important;
  transform:scale(1.15) !important;
  transform-origin:center !important;
}