/* Mana Local Ads Manager PRO – Frontend */

/* Booking form */
.mlam-booking-form{max-width:640px;margin:0 auto;padding:20px;background:#fff;border-radius:10px;box-shadow:0 2px 12px rgba(0,0,0,.08)}
.mlam-form-title{margin:0 0 18px;font-size:1.35rem;color:#1a1a2e}
.mlam-field{margin-bottom:14px}
.mlam-field label{display:block;font-weight:600;margin-bottom:6px;font-size:.9rem}
.mlam-field input,.mlam-field select,.mlam-field textarea{width:100%;padding:10px 12px;border:1px solid #ccc;border-radius:6px;font-size:.95rem}
.mlam-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:600px){.mlam-row{grid-template-columns:1fr}}
.mlam-btn{background:#c41e3a;color:#fff;border:none;padding:12px 28px;border-radius:6px;font-size:1rem;cursor:pointer;width:100%}
.mlam-btn:hover{background:#a01830}
.mlam-btn:disabled{opacity:.6}
.mlam-message{margin-top:12px;padding:12px;border-radius:6px}
.mlam-message.success{background:#e8f5e9;color:#2e7d32}
.mlam-message.error{background:#ffebee;color:#c62828}
.mlam-upi-box{background:#f5f5f5;padding:10px 14px;border-radius:6px;margin-bottom:14px}
.mlam-table{width:100%;border-collapse:collapse;margin-top:12px}
.mlam-table th,.mlam-table td{padding:8px 10px;border:1px solid #eee;text-align:left}
.mlam-table th{background:#f8f8f8}
.mlam-payment-box{max-width:480px;margin:20px auto;padding:20px;background:#fff;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.08)}

/* Location selector */
.mlam-location-selector{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:12px 14px;margin-bottom:16px}
.mlam-loc-label{display:block;font-weight:600;margin-bottom:8px;font-size:.95rem}
.mlam-loc-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.mlam-loc-select{padding:8px 10px;border:1px solid #ccc;border-radius:6px;font-size:.9rem;min-width:140px;flex:1}
.mlam-loc-btn{background:#c41e3a;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem}
.mlam-loc-btn:hover{background:#a01830}
.mlam-loc-hint{margin:8px 0 0;font-size:.8rem;color:#777}

/* ==========================================================================
   Responsive Ad System (placement + device)
   Uploaded image any size → CSS crops to slot (object-fit:cover)
   ========================================================================== */

.mlam-ads-wrap{
  display:flex;
  flex-direction:column;
  gap:14px;
  margin:12px 0;
  width:100%;
}

.local-ad-card,
.mlam-ad{
  background:#fff;
  border:1px solid #eee;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 1px 4px rgba(0,0,0,.06);
  width:100%;
  max-width:100%;
  margin:0 auto;
}

.local-ad-media{
  width:100%;
  overflow:hidden;
  background:#f4f4f4;
  line-height:0;
}

.local-ad-card img,
.local-ad-img,
.mlam-ad-img{
  width:100%;
  height:100%;
  max-width:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  border-radius:0;
}

.local-ad-body{
  padding:10px 12px 12px;
}

.local-ad-title,
.mlam-ad-title{
  font-weight:600;
  font-size:1rem;
  margin:0 0 4px;
  color:#1a1a2e;
  line-height:1.35;
}

.local-ad-content,
.mlam-ad-content{
  font-size:.88rem;
  color:#555;
  line-height:1.45;
  margin:0 0 6px;
}

.local-ad-badge,
.mlam-ad-type{
  display:inline-block;
  font-size:.72rem;
  background:#f0f0f0;
  padding:2px 8px;
  border-radius:3px;
  color:#666;
}

/* ---------- Desktop defaults ---------- */

/* Sidebar Small / standard – 300×250 */
.local-ad--sidebar{
  max-width:300px;
}
.local-ad--sidebar .local-ad-media{
  aspect-ratio:300/250;
  max-height:250px;
}

/* Sidebar Premium / homepage side – 300×600 */
.local-ad--sidebar-premium{
  max-width:300px;
}
.local-ad--sidebar-premium .local-ad-media{
  aspect-ratio:300/600;
  max-height:600px;
}

/* Birthday / Marriage / Square – 300×300 */
.local-ad--square{
  max-width:300px;
}
.local-ad--square .local-ad-media{
  aspect-ratio:1/1;
  max-height:300px;
}

/* Portrait option (300×400) – use class local-ad--portrait if needed */
.local-ad--portrait{
  max-width:300px;
}
.local-ad--portrait .local-ad-media{
  aspect-ratio:3/4;
  max-height:400px;
}

/* Header / Footer / Sticky banner – 728×90 */
.local-ad--banner{
  max-width:728px;
  width:100%;
}
.local-ad--banner .local-ad-media{
  aspect-ratio:728/90;
  max-height:90px;
}
.local-ad--banner .local-ad-body{
  display:none; /* banner = image focused */
}

/* Placement-specific tweaks */
.mlam-placement-sidebar .local-ad-card,
.mlam-placement-category .local-ad-card,
.mlam-placement-single .local-ad-card{
  max-width:300px;
  margin-left:auto;
  margin-right:auto;
}

.mlam-placement-homepage .local-ad--sidebar-premium{
  max-width:300px;
}

/* Popup */
.mlam-popup{
  position:fixed;
  bottom:20px;
  right:20px;
  max-width:320px;
  z-index:99999;
  background:#fff;
  padding:12px;
  border-radius:10px;
  box-shadow:0 8px 30px rgba(0,0,0,.2);
}
.mlam-popup-close{
  position:absolute;
  top:4px;
  right:10px;
  border:none;
  background:none;
  font-size:1.5rem;
  cursor:pointer;
  line-height:1;
  z-index:2;
}
.mlam-popup .local-ad--square{
  max-width:100%;
  box-shadow:none;
  border:none;
}

/* ---------- Mobile (≤900px) ---------- */
@media (max-width:900px){
  .mlam-ads-wrap{
    gap:12px;
    margin:12px 0 20px;
  }

  /* Sidebar → 320×250 */
  .local-ad--sidebar{
    max-width:100%;
  }
  .local-ad--sidebar .local-ad-media{
    aspect-ratio:320/250;
    max-height:none;
  }

  /* Premium → 320×480 */
  .local-ad--sidebar-premium{
    max-width:100%;
  }
  .local-ad--sidebar-premium .local-ad-media{
    aspect-ratio:320/480;
    max-height:none;
  }

  /* Birthday square → 320×320 */
  .local-ad--square{
    max-width:100%;
  }
  .local-ad--square .local-ad-media{
    aspect-ratio:1/1;
    max-height:none;
  }

  /* Portrait mobile 320×400 */
  .local-ad--portrait .local-ad-media{
    aspect-ratio:320/400;
  }

  /* Banner → 320×100 */
  .local-ad--banner .local-ad-media{
    aspect-ratio:320/100;
    max-height:100px;
  }

  /* Sticky footer feel */
  .mlam-placement-sticky .local-ad--banner .local-ad-media,
  .mlam-placement-footer .local-ad--banner .local-ad-media{
    aspect-ratio:320/50;
    max-height:50px;
  }

  .mlam-popup{
    left:12px;
    right:12px;
    bottom:12px;
    max-width:none;
  }
}

/* Very small phones */
@media (max-width:400px){
  .local-ad-title{font-size:.95rem}
  .local-ad-body{padding:8px 10px 10px}
}

/* Theme mobile slot integration */
.mobile-ads-slot .local-ad-card{
  max-width:100%;
}
.mobile-ads-slot .local-ad--square .local-ad-media,
.mobile-ads-slot .local-ad--sidebar .local-ad-media{
  border-radius:8px 8px 0 0;
}

/* Fit modes (Google Ads style) */
.local-ad-fit-cover,
.local-ad-card.local-ad-fit-cover .local-ad-img{
  object-fit:cover !important;
}
.local-ad-fit-contain,
.local-ad-card.local-ad-fit-contain .local-ad-img{
  object-fit:contain !important;
  background:#f0f0f0;
}
.local-ad-fit-fill,
.local-ad-card.local-ad-fit-fill .local-ad-img{
  object-fit:fill !important;
}
