/**
 * assets/css/style.css
 */

/* Reset & container */
*{box-sizing:border-box}body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;color:#0f172a;background:#f8fafc;margin:0}
.container{max-width:1100px;margin:0 auto;padding:20px}

/* Header */
.site-header{background:#000000;border-bottom:1px solid #ff69b4}
.site-header .container{display:flex;align-items:center;justify-content:space-between;padding:14px 20px}
.logo{font-weight:700;color:#ffffff}
.admin-link{color:#0ea5e9;text-decoration:none}

/* Hero */
.hero{background:linear-gradient(90deg,#000000,#000000);padding:28px;border-radius:8px;margin:18px 0}
.hero-title{margin:0;font-size:20px;color:#ffffff}
.hero-sub{margin:6px 0 0;color:#ffffff}

/* Listings grid */
.listings-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin-top:18px}
.card{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 1px 4px rgba(2,6,23,0.06);transition:transform .18s ease,box-shadow .18s ease;cursor:pointer}
.card:hover{transform:translateY(-6px);box-shadow:0 8px 30px rgba(2,6,23,0.08)}
.card .img{height:160px;background:#e6eef6;overflow:hidden}
.card img{width:100%;height:100%;object-fit:cover;display:block}
.card .body{padding:12px}
.card h3{margin:0;font-size:15px;color:#08203a}
.card .muted{color:#64748b;font-size:13px;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card .meta{display:flex;justify-content:space-between;align-items:center;margin-top:10px}
.btn-small{padding:6px 10px;border-radius:6px;border:none;background:#ecfeff;color:#0369a1;font-weight:600}

.card.vip {
    grid-column: 1 / -1 !important; 
    display: block !important; /* Esnek yapıyı iptal edip dikey istiflemeye geçiyoruz */
    background: linear-gradient(to bottom, #fffdf0, #fff) !important;
    border: 1px solid #ff0000 !important;
}

.card.vip .img {
    width: 100% !important; /* Genişliği tam ekran yapar */
    height: 200px !important; /* Banner yüksekliğini ayarlar */
}

.card.vip .img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important; /* Görselin alanı tam kaplamasını sağlar */
}

.card.vip .body {
    padding: 20px !important; /* Metin alanına ferahlık verir */
}

@media (max-width: 600px) {
    .card.vip { display: block !important; }
    .card.vip .img { width: 100% !important; height: 200px !important; }
}

/* badge + ribbon */
.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 8px;border-radius:999px;font-size:12px;font-weight:600}
.badge.vip{background:linear-gradient(90deg,#FDE68A,#F59E0B);color:#7c2d12;box-shadow:0 3px 10px rgba(245,158,11,0.12)}
.badge.gold{background:#ffedd5;color:#7c2d12}
.ribbon{position:absolute;right:0;top:0;transform:translate(12px,-12px);opacity:.9}

/* modal */
.modal{display:none;position:fixed;inset:0;z-index:60;align-items:center;justify-content:center}
.modal[aria-hidden="false"]{display:flex}
.modal-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.5)}
.modal-panel{position:relative;background:#fff;border-radius:8px;z-index:70;max-width:900px;width:100%;padding:18px;box-shadow:0 12px 40px rgba(2,6,23,.2)}
.modal-close{position:absolute;right:10px;top:10px;border:0;background:transparent;font-size:20px}

/* admin */
.admin-grid{display:grid;grid-template-columns:320px 1fr;gap:18px}
.admin-left{background:#fff;padding:14px;border-radius:8px}
.admin-left label{display:block;margin-bottom:8px;font-size:13px}
.admin-left input, .admin-left textarea{width:100%;padding:8px;margin-top:6px;border:1px solid #e6eef6;border-radius:6px}
.btn{background:#0369a1;color:#fff;padding:8px 12px;border-radius:8px;border:0}
.btn.small{padding:6px;border-radius:6px}
.btn.danger{background:#ef4444}
.admin-right{background:#fff;padding:12px;border-radius:8px}
.admin-row{display:flex;align-items:center;gap:10px;padding:10px;border-bottom:1px solid #f1f5f9}
.admin-thumb img{width:80px;height:60px;object-fit:cover;border-radius:6px}
.admin-title{font-weight:600}
.alert{background:#fee2e2;padding:8px;border-radius:6px;color:#611a15}

/* v0.2 public navigation and filters */
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{text-decoration:none;font-size:1.3rem}
.main-nav{display:flex;align-items:center;gap:6px}
.nav-link,.nav-dropdown-toggle{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:9px 13px;border:0;border-radius:8px;background:transparent;color:#334155;font:inherit;font-weight:650;text-decoration:none;cursor:pointer}
.nav-link:hover,.nav-dropdown-toggle:hover,.nav-dropdown.is-open .nav-dropdown-toggle{background:#f0f9ff;color:#0369a1}
.nav-dropdown{position:relative}
.nav-dropdown-menu{position:absolute;right:0;top:calc(100% + 8px);display:none;width:220px;max-height:360px;overflow:auto;padding:8px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 18px 45px rgba(15,23,42,.14);z-index:100}
.nav-dropdown.is-open .nav-dropdown-menu{display:grid}
.nav-dropdown-menu a{padding:10px 12px;border-radius:8px;color:#334155;text-decoration:none}
.nav-dropdown-menu a:hover{background:#f0f9ff;color:#0369a1}
.categories-menu{grid-template-columns:repeat(3,1fr);width:270px}
.filter-panel{padding:18px;background:#fff;border:1px solid #e6eef6;border-radius:10px;box-shadow:0 1px 4px rgba(2,6,23,.04)}
.filter-form{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr)) auto;gap:12px;align-items:end}
.filter-form label{display:grid;gap:6px;color:#475569;font-size:13px;font-weight:650}
.filter-form select,.filter-form input{width:100%;min-height:42px;padding:9px 10px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#0f172a;font:inherit}
.filter-actions{display:flex;gap:8px}
.btn.secondary{display:inline-flex;align-items:center;background:#e2e8f0;color:#334155;text-decoration:none}
.active-filter{margin-top:12px;color:#64748b;font-size:13px}
.empty-state,.loading-state{grid-column:1/-1;padding:28px;text-align:center;color:#64748b;background:#fff;border-radius:10px}
.category-badge{position:absolute;right:10px;bottom:10px;padding:6px 8px;border-radius:999px;background:rgba(15,23,42,.82);color:#fff;font-size:12px;font-weight:700}
.detail-tags{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.detail-tags span{padding:6px 9px;border-radius:999px;background:#e0f2fe;color:#075985;font-size:12px;font-weight:700}
.admin-left select{width:100%;margin-top:6px;padding:8px;border:1px solid #e6eef6;border-radius:6px;background:#fff}

@media (max-width:900px){
  .filter-form{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filter-actions{align-self:end}
}
@media (max-width:640px){
  .site-header .container{align-items:flex-start;flex-direction:column}
  .main-nav{width:100%;flex-wrap:wrap}
  .nav-link,.nav-dropdown{flex:1}
  .nav-dropdown-toggle{width:100%;justify-content:center}
  .nav-dropdown-menu{left:0;right:auto;width:min(280px,calc(100vw - 40px))}
  .filter-form{grid-template-columns:1fr}
  .filter-actions .btn{flex:1;justify-content:center}
}


/* v0.3 admin improvements */
.auth{max-width:440px;margin-top:70px;background:#fff;border-radius:12px;box-shadow:0 12px 40px rgba(15,23,42,.08)}
.auth label{display:grid;gap:7px}.auth input{padding:10px;border:1px solid #cbd5e1;border-radius:8px}
.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:4px 0 18px}.admin-stats div{display:grid;gap:4px;padding:18px;background:#fff;border-radius:10px;box-shadow:0 1px 4px rgba(2,6,23,.05)}.admin-stats strong{font-size:24px}.admin-stats span{color:#64748b;font-size:13px}
.admin-left textarea,.admin-left select{width:100%;padding:8px;margin-top:6px;border:1px solid #e6eef6;border-radius:6px}.check-label{display:flex!important;align-items:center;gap:8px}.check-label input{width:auto!important;margin:0!important}.form-actions{display:flex;gap:8px;margin-top:12px}.upload-preview{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}.upload-preview img{width:100px;height:70px;object-fit:cover;border-radius:7px}.admin-list-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.admin-list-head input{max-width:260px;padding:9px;border:1px solid #cbd5e1;border-radius:8px}.admin-info{min-width:0;flex:1}.admin-meta{margin-top:4px;color:#64748b;font-size:12px}.admin-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.admin-row.expired{opacity:.65;background:#f8fafc}.btn{cursor:pointer}.btn.secondary{border:0}
@media(max-width:900px){.admin-grid{grid-template-columns:1fr}.admin-stats{grid-template-columns:repeat(2,1fr)}.admin-row{align-items:flex-start;flex-wrap:wrap}.admin-actions{width:100%;justify-content:flex-start}}
.pagination{display:flex;justify-content:center;gap:8px;margin:28px 0 40px;flex-wrap:wrap}.pagination a{min-width:38px;padding:9px 12px;text-align:center;background:#fff;border:1px solid #e2e8f0;border-radius:8px;color:#334155;text-decoration:none}.pagination a.active,.pagination a:hover{background:#0369a1;color:#fff;border-color:#0369a1}.detail-gallery{display:grid;gap:10px}.detail-main{width:100%;max-height:420px;object-fit:contain;background:#f1f5f9;border-radius:8px}.detail-thumbs{display:flex;gap:8px;overflow:auto}.detail-thumbs button{padding:2px;border:2px solid transparent;background:none;border-radius:7px}.detail-thumbs button.active{border-color:#0369a1}.detail-thumbs img{width:72px;height:56px;object-fit:cover;border-radius:5px;display:block}.card .img{position:relative}.card .badge{position:absolute;left:10px;top:10px}

/* v1.0 ilan detay ve hata sayfaları */
.breadcrumb{display:flex;gap:8px;align-items:center;margin:22px 0;color:#64748b;font-size:14px}.breadcrumb a{color:#0369a1;text-decoration:none}
.listing-detail-card{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:28px;background:#fff;border-radius:14px;padding:22px;box-shadow:0 8px 30px rgba(15,23,42,.07);margin-bottom:40px}.listing-detail-content h1{margin:12px 0;font-size:clamp(24px,4vw,38px)}.listing-price{font-size:28px;font-weight:800;color:#0369a1;margin:12px 0}.listing-description{line-height:1.75;color:#334155;margin:22px 0;white-space:normal}.listing-call{display:inline-flex;text-decoration:none}.detail-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.detail-actions a{text-decoration:none}.error-page{min-height:100vh;display:grid;place-items:center;text-align:center}.error-code{font-size:clamp(72px,18vw,160px);font-weight:900;line-height:1;color:#cbd5e1}.error-page h1{margin:16px 0 8px}.error-page p{color:#64748b;margin-bottom:24px}
@media(max-width:760px){.listing-detail-card{grid-template-columns:1fr;padding:14px}.listing-detail-content h1{font-size:26px}}

/* =========================================================
   Anasayfa: 10 VIP / 40 GOLD / 80 SILVER
   ========================================================= */
#listings.listings-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    align-items:stretch;
    gap:20px;
    width:100%;
    margin-top:20px;
}
#listings .card{
    position:relative;
    display:flex;
    flex-direction:column;
    width:100%;
    min-width:0;
    height:100%;
    overflow:hidden;
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:14px;
    box-shadow:0 4px 14px rgba(15,23,42,.07);
}
#listings .card.vip{
    grid-column:1/-1!important;
    display:grid!important;
    grid-template-columns:minmax(320px,42%) 1fr;
    min-height:360px;
    background:linear-gradient(135deg,#fffdf2 0%,#fff 58%)!important;
    border:2px solid #f59e0b!important;
}
#listings .card.gold{grid-column:span 2;border-color:#f59e0b;background:linear-gradient(180deg,#fffdf5 0%,#fff 40%)}
#listings .card.silver{grid-column:span 1;border-color:#cbd5e1}
#listings .card .img{position:relative;width:100%;height:220px;overflow:hidden;background:#f1f5f9}
#listings .card.vip .img{width:100%!important;height:100%!important;min-height:360px}
#listings .card.gold .img{height:290px}
#listings .card.silver .img{height:220px}
#listings .card .img>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
#listings .card:hover .img>img{transform:scale(1.025)}
#listings .card .body{display:flex;flex:1;flex-direction:column;min-width:0;padding:18px}
#listings .card.vip .body{padding:30px!important;justify-content:center}
#listings .card h3{margin:0;color:#08203a;font-weight:800}
#listings .card.vip h3{font-size:28px;line-height:1.3}
#listings .card.gold h3{font-size:21px}
#listings .card.silver h3{font-size:17px}
#listings .card .muted{color:#64748b;font-size:13px;line-height:1.55;white-space:normal}
#listings .card-description{display:-webkit-box;margin:12px 0 0;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3}
#listings .card.silver .card-description{-webkit-line-clamp:2}
#listings .card-price{margin-top:12px;color:#0369a1;font-size:20px;font-weight:800}
#listings .card .meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:18px}
#listings .badge{position:absolute;top:12px;left:12px;z-index:3;display:inline-flex;align-items:center;justify-content:center;min-width:72px;padding:8px 12px;border-radius:999px;font-size:12px;font-weight:900;letter-spacing:.5px}
#listings .badge.vip{background:linear-gradient(135deg,#fde68a,#f59e0b);color:#713f12}
#listings .badge.gold{background:#f59e0b;color:#fff}
#listings .badge.silver{background:#64748b;color:#fff}
#listings .category-badge{position:absolute;right:12px;bottom:12px;z-index:3;padding:7px 10px;background:rgba(15,23,42,.82);border-radius:999px;color:#fff;font-size:11px;font-weight:700}
#listings .btn-small{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 14px;background:#0369a1;border-radius:8px;color:#fff;text-decoration:none}
#listings .loading-state,#listings .alert{grid-column:1/-1}

@media(max-width:1000px){
    #listings.listings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    #listings .card.vip{grid-column:1/-1;grid-template-columns:minmax(260px,42%) 1fr}
    #listings .card.gold,#listings .card.silver{grid-column:span 1}
}
@media(max-width:640px){
    #listings.listings-grid{grid-template-columns:1fr;gap:16px}
    #listings .card.vip,#listings .card.gold,#listings .card.silver{grid-column:1/-1;display:flex!important;min-height:0;flex-direction:column}
    #listings .card.vip .img,#listings .card.gold .img,#listings .card.silver .img{width:100%!important;height:220px!important;min-height:220px}
    #listings .card.vip .body,#listings .card.gold .body,#listings .card.silver .body{padding:16px!important}
    #listings .card.vip h3,#listings .card.gold h3,#listings .card.silver h3{font-size:18px}
    #listings .card .meta{align-items:stretch;flex-direction:column}
    #listings .btn-small{width:100%}
}

/* =========================================================
   VIP KART ÖZEL GÖRÜNÜMÜ
   Görsel üstte; başlık/kategori solda, ilçe/buton sağda
   ========================================================= */
#listings .card.vip{
    display:flex!important;
    flex-direction:column!important;
    min-height:0;
}

#listings .card.vip .img{
    width:100%!important;
    height:360px!important;
    min-height:360px!important;
    border-bottom:1px solid #e2e8f0;
}

#listings .card.vip .body.vip-body{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:stretch;
    gap:28px;
    min-height:120px;
    padding:22px 26px!important;
}

#listings .vip-info-left,
#listings .vip-info-right{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap:12px;
    min-width:0;
}

#listings .vip-info-right{
    align-items:flex-end;
    text-align:right;
}

#listings .vip-title{
    margin:0;
    overflow:hidden;
    color:#08203a;
    font-size:24px!important;
    font-weight:800;
    line-height:1.3;
    text-overflow:ellipsis;
    white-space:nowrap;
}

#listings .vip-category{
    color:#b45309;
    font-size:14px;
    font-weight:800;
    letter-spacing:.25px;
}

#listings .vip-district{
    color:#334155;
    font-size:16px;
    font-weight:750;
}

#listings .vip-detail-button{
    min-width:110px;
}

@media(max-width:640px){
    #listings .card.vip .img{
        height:240px!important;
        min-height:240px!important;
    }

    #listings .card.vip .body.vip-body{
        grid-template-columns:minmax(0,1fr) auto;
        gap:14px;
        min-height:105px;
        padding:16px!important;
    }

    #listings .vip-title{
        font-size:18px!important;
    }

    #listings .vip-category{
        font-size:12px;
    }

    #listings .vip-district{
        font-size:14px;
    }

    #listings .vip-detail-button{
        min-width:88px;
    }
}

@media(max-width:420px){
    #listings .card.vip .body.vip-body{
        grid-template-columns:1fr;
    }

    #listings .vip-info-right{
        align-items:stretch;
        text-align:left;
    }

    #listings .vip-detail-button{
        width:100%;
    }
}
.contact-buttons{
    margin-top:30px;
}

.btn-whatsapp{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:56px;
    background:#25D366;
    color:#ffffff;
    font-size:18px;
    font-weight:700;
    text-decoration:none;
    border-radius:10px;
    transition:.2s;
}

.btn-whatsapp:hover{
    background:#1ebe5d;
    transform:translateY(-2px);
}
/* WhatsApp Buton Tasarımı (CSS) */
.whatsapp-btn {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: #25D366;
  color: white;
  text-decoration: none;
  font-family: Arial, sans-serif;
  font-weight: bold;
  font-size: 15px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 20px;
  border-radius: 50px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  z-index: 9999;
  transition: transform 0.2s ease, background-color 0.2s ease;
}

/* Üzerine gelindiğinde (Hover) efektler */
.whatsapp-btn:hover {
  background-color: #20ba5a;
  transform: scale(1.05);
  color: white;
}

/* =========================================================
   MOBİL UYUMLULUK - SON VE ÖNCELİKLİ KURALLAR
   Bu bölüm dosyanın sonunda kalmalıdır.
   ========================================================= */

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

img,
svg,
video,
iframe {
    max-width: 100%;
}

button,
a,
input,
select,
textarea {
    -webkit-tap-highlight-color: transparent;
}

/* Tablet */
@media (max-width: 900px) {
    .container {
        width: 100%;
        max-width: none;
        padding: 16px;
    }

    .site-header .container,
    .header-inner {
        gap: 14px;
    }

    .main-nav {
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    #listings.listings-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    #listings .card.vip {
        grid-column: 1 / -1 !important;
    }

    #listings .card.gold,
    #listings .card.silver {
        grid-column: span 1;
    }

    .listing-detail-card {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 18px;
    }

    .detail-main {
        width: 100%;
        max-height: 520px;
    }

    .admin-grid {
        grid-template-columns: 1fr;
    }

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

    .admin-row {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .admin-actions {
        width: 100%;
        justify-content: flex-start;
    }
}

/* Telefon */
@media (max-width: 640px) {
    body {
        font-size: 15px;
    }

    .container {
        padding: 12px;
    }

    .site-header .container,
    .header-inner {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
        padding: 12px;
    }

    .logo {
        display: block;
        width: 100%;
        font-size: 1.1rem;
        text-align: center;
    }

    .main-nav {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
        gap: 8px;
    }

    .nav-link,
    .nav-dropdown,
    .nav-dropdown-toggle {
        width: 100%;
    }

    .nav-link,
    .nav-dropdown-toggle {
        justify-content: center;
        min-height: 46px;
    }

    .nav-dropdown-menu,
    .categories-menu {
        position: static;
        width: 100%;
        max-height: 280px;
        margin-top: 6px;
        box-shadow: none;
    }

    .categories-menu {
        grid-template-columns: 1fr;
    }

    .hero {
        margin: 12px 0;
        padding: 18px 14px;
        text-align: center;
    }

    .hero-title {
        font-size: 18px;
        line-height: 1.4;
    }

    #listings.listings-grid {
        grid-template-columns: 1fr;
        gap: 14px;
        margin-top: 14px;
    }

    #listings .card.vip,
    #listings .card.gold,
    #listings .card.silver {
        grid-column: 1 / -1 !important;
        display: flex !important;
        min-height: 0;
        flex-direction: column !important;
    }

    #listings .card.vip .img,
    #listings .card.gold .img,
    #listings .card.silver .img {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 16 / 9;
    }

    #listings .card .img > img {
        object-fit: cover;
    }

    #listings .card .body,
    #listings .card.vip .body,
    #listings .card.gold .body,
    #listings .card.silver .body {
        padding: 14px !important;
    }

    #listings .card.vip .body.vip-body {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 12px;
        min-height: 100px;
    }

    #listings .vip-title,
    #listings .card h3 {
        font-size: 17px !important;
        line-height: 1.35;
        white-space: normal;
    }

    #listings .vip-category,
    #listings .vip-district,
    #listings .card .muted {
        font-size: 13px;
    }

    #listings .card .meta {
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
    }

    #listings .btn-small,
    #listings .vip-detail-button {
        width: 100%;
        min-width: 0;
        min-height: 44px;
    }

    #listings .category-badge {
        max-width: calc(100% - 24px);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .breadcrumb {
        flex-wrap: wrap;
        margin: 14px 0;
        font-size: 13px;
    }

    .listing-detail-card {
        gap: 16px;
        padding: 12px;
        border-radius: 10px;
    }

    .detail-main {
        width: 100%;
        max-height: none;
        aspect-ratio: 4 / 3;
        object-fit: contain;
    }

    .detail-thumbs {
        gap: 6px;
        padding-bottom: 4px;
    }

    .detail-thumbs img {
        width: 64px;
        height: 50px;
    }

    .listing-detail-content h1 {
        font-size: 24px;
        line-height: 1.3;
    }

    .listing-price {
        font-size: 22px;
    }

    .listing-description {
        font-size: 15px;
        line-height: 1.65;
        overflow-wrap: anywhere;
    }

    .detail-tags {
        gap: 6px;
    }

    .detail-tags span {
        font-size: 11px;
    }

    .btn-whatsapp {
        width: 100%;
        min-height: 52px;
        height: auto;
        padding: 0;
        overflow: hidden;
        border-radius: 12px;
    }

    .btn-whatsapp svg {
        display: block;
        width: 100%;
        max-width: 320px;
        height: auto;
    }

    .contact-buttons {
        margin-top: 18px;
    }

    .modal {
        padding: 8px;
    }

    .modal-panel {
        width: 100%;
        max-height: calc(100vh - 16px);
        padding: 12px;
        overflow-y: auto;
    }

    .admin-stats {
        grid-template-columns: 1fr;
    }

    .admin-list-head {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-list-head input {
        width: 100%;
        max-width: none;
    }

    .admin-row {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-thumb,
    .admin-thumb img {
        width: 100%;
    }

    .admin-thumb img {
        height: 190px;
    }

    .admin-actions,
    .form-actions {
        width: 100%;
        flex-direction: column;
    }

    .admin-actions .btn,
    .form-actions .btn {
        width: 100%;
        min-height: 44px;
    }

    .auth {
        margin-top: 24px;
    }

    .pagination {
        gap: 6px;
        margin: 20px 0 28px;
    }

    .pagination a {
        min-width: 36px;
        padding: 8px 10px;
    }
}

/* Küçük telefon */
@media (max-width: 420px) {
    .container {
        padding: 9px;
    }

    #listings .card.vip .body.vip-body {
        grid-template-columns: 1fr;
    }

    #listings .vip-info-right {
        align-items: stretch;
        text-align: left;
    }

    #listings .vip-detail-button {
        width: 100%;
    }

    .hero-title {
        font-size: 16px;
    }

    .listing-detail-content h1 {
        font-size: 21px;
    }

    .detail-main {
        aspect-ratio: 1 / 1;
    }
}