/* Mobile Numbers Listing V2 - VIP Plate Style (Top Filters) */

.mn-page{padding:28px 0 56px;background:#f3f4f6}
.mn-page .container{max-width:1200px;margin:0 auto;padding:0 16px}

/* breadcrumb */
.mn-breadcrumb{font-size:13px;color:#6b7280;margin:6px 0 14px}
.mn-breadcrumb a{color:#111827;text-decoration:none;font-weight:700}
.mn-breadcrumb a:hover{text-decoration:underline}
.mn-breadcrumb span{margin:0 6px}

/* top */
.mn-topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:14px}
.mn-title{margin:0;font-size:34px;line-height:1.1;font-weight:950;color:#111827}
.mn-subtitle{margin-top:8px;color:#374151;font-size:14px}
.mn-dot{margin:0 8px;color:#c8102e}

/* sr-only */
.mn-sr-only{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* filter card */
.mn-filter-card{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:16px;
  padding:14px;
  box-shadow:0 2px 14px rgba(0,0,0,.05);
  margin: 12px 0 14px;
}

.mn-filter-rows{display:flex;flex-direction:column;gap:12px}
.mn-filter-row{display:grid;gap:12px;align-items:end}

/* 3 rows layout */
.mn-row-1{
  grid-template-columns:
    minmax(220px, 1fr)
    minmax(220px, 1fr)
    minmax(260px, 1.4fr)
    minmax(170px, 220px);
}
.mn-row-2{
  grid-template-columns:
    minmax(220px, 1fr)
    minmax(220px, 1fr)
    minmax(200px, 1fr)
    minmax(200px, 1fr);
}
.mn-row-3{
  grid-template-columns:
    minmax(220px, 1fr)
    minmax(220px, 1fr)
    minmax(260px, 1.4fr)
    minmax(120px, 160px);
}

.mn-field{display:flex;flex-direction:column;gap:6px}
.mn-field label{font-size:13px;color:#374151;font-weight:800}

.mn-field input,.mn-field select{
  height:42px;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:0 12px;
  background:#fff;
}
.mn-field input:focus,.mn-field select:focus{
  outline:none;border-color:#c8102e;
  box-shadow:0 0 0 3px rgba(200,16,46,.08)
}

.mn-field-btn{align-items:stretch}
.mn-btn{
  width:100%;
  height:42px;
  border:0;
  border-radius:12px;
  background:#c8102e;
  color:#fff;
  font-weight:950;
  cursor:pointer;
}
.mn-btn:hover{filter:brightness(.97)}

.mn-reset{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:42px;
  padding:0 14px;
  border-radius:12px;
  border:1px solid #e5e7eb;
  background:#fff;
  color:#111827;
  text-decoration:none;
  font-weight:900;
  justify-self:end;
}
.mn-reset:hover{border-color:#c8102e;color:#c8102e}
.mn-reset--disabled{opacity:.45}

/* checkbox row */
.mn-check{
  display:flex;
  align-items:center;
  gap:10px;
  height:42px;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:0 12px;
  background:#fff;
  font-weight:900;
  color:#111827;
}
.mn-check input{width:18px;height:18px}

/* tabs */
.mn-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 12px}
.mn-tab{
  padding:10px 12px;
  border-radius:999px;
  border:1px solid #e5e7eb;
  background:#fff;
  text-decoration:none;
  color:#111827;
  font-weight:950;
  font-size:13px
}
.mn-tab.is-active{background:#111827;color:#fff;border-color:#111827}

/* range row */
.mn-metarow{display:flex;justify-content:space-between;align-items:center;margin:10px 0 12px;color:#6b7280;font-size:13px}
.mn-range strong{color:#111827}

.mn-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

@media (max-width: 1100px){
  .mn-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width: 740px){
  .mn-grid{ grid-template-columns:1fr; }
}

/* item card */
.mn-item{
  background:#fff;
  border:1px solid #eef2f7;
  border-radius:16px;
  padding:14px;
  box-shadow:0 2px 12px rgba(0,0,0,.05);
}
.mn-plate-link{text-decoration:none;color:inherit;display:block}

/* VIP plate (single border + subtle shadow) */
.mn-plate{
  position:relative;
  border-radius:14px;
  border:3px solid #0f172a;
  background:linear-gradient(180deg,#ffffff,#f8fafc);
  box-shadow:0 8px 18px rgba(15,23,42,.08);
  overflow:hidden;
}
.mn-plate-inner{
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 14px;
  padding-right:64px;
}

/* operator logo */
.mn-plate-op{flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.mn-op-logo{height:32px;width:auto;max-width:84px;object-fit:contain;display:block}
.mn-op-fallback{
  height:32px;
  min-width:58px;
  padding:0 10px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:950;
  color:#fff;
  background:#111827;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.mn-op-du{background:#0077c8}
.mn-op-etisalat{background:#00a651}
.mn-op-virgin{background:#e0002a}
.mn-op-generic{background:#111827}

/* number never wraps */
.mn-plate-number{
  flex:1 1 auto;
  min-width:0;
  font-size: clamp(26px, 2.2vw, 36px);
  line-height:1.05;
  font-weight:950;
  letter-spacing:1px;
  color:#14532d;
  white-space:nowrap !important;
  overflow:visible !important;
  text-overflow:clip !important;
  font-variant-numeric: tabular-nums;
}

/* ribbon */
.mn-plate-ribbon{
  position:absolute;
  top:12px;
  right:-38px;
  transform:rotate(45deg);
  background:#c8102e;
  color:#fff;
  font-weight:950;
  font-size:11px;
  padding:6px 46px;
  letter-spacing:.7px;
  text-align:center;
  pointer-events:none;
}

/* bottom row */
.mn-item-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:12px;
}
.mn-price{font-weight:950;color:#111827}
.mn-city{margin-left:10px;color:#6b7280;font-weight:900}
.mn-pill{
  display:inline-block;
  margin-left:10px;
  background:#111827;
  color:#fff;
  border-radius:999px;
  padding:5px 10px;
  font-size:12px;
  font-weight:950;
}
.mn-view{color:#c8102e;font-weight:950}

/* empty */
.mn-empty{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:18px}
.mn-empty-title{font-weight:950;color:#111827}
.mn-empty-sub{margin-top:6px;color:#6b7280}

.mn-pagination{
  margin-top: 18px;
  display:flex;
  justify-content:center;
}

.mn-pagination ul,
.mn-pagination .pagination{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  gap:10px;
  align-items:center;
}

.mn-pagination li{ margin:0; }

.mn-pagination a,
.mn-pagination span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  height:44px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid #e5e7eb;
  background:#fff;
  text-decoration:none;
  font-weight:950;
  color:#111827;
}

.mn-pagination .active span,
.mn-pagination li.active span{
  background:#111827;
  color:#fff;
  border-color:#111827;
}

.mn-pagination a:hover{
  border-color:#c8102e;
  color:#c8102e;
}

/* responsive filters */
@media (max-width: 1100px){
  .mn-row-1,.mn-row-2,.mn-row-3{grid-template-columns:1fr 1fr}
  .mn-reset{justify-self:start}
}
@media (max-width: 560px){
  .mn-row-1,.mn-row-2,.mn-row-3{grid-template-columns:1fr}
  .mn-reset{width:100%;justify-content:center}
}

/* RTL */
.mn-page.is-ar .mn-topbar{flex-direction:row-reverse}
.mn-page.is-ar .mn-metarow{flex-direction:row-reverse}
.mn-page.is-ar .mn-item-bottom{flex-direction:row-reverse}
/* smaller SEO footer */
.mn-seo-block{
  margin-top: 14px;
  background:#fff;
  border-radius:14px;
  padding:14px 16px;     /* was big */
  border:1px solid #eef2f7;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
}

.mn-seo-block h2{
  margin:0 0 6px;
  font-size:18px;        /* was 20-22 */
  line-height:1.2;
  font-weight:950;
  color:#111827;
}

.mn-seo-block p{
  margin:0 0 8px;
  color:#6b7280;
  font-size:13px;        /* smaller */
  line-height:1.15;
}

.mn-seo-grid{
  margin-top: 10px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap: 10px;             /* tighter */
}

.mn-seo-grid h3{
  margin:0 0 6px;
  font-size:12px;        /* smaller */
  color:#111827;
  font-weight:900;
}

.mn-seo-grid a{
  display:block;
  margin:4px 0;          /* tighter */
  text-decoration:none;
  font-weight:900;
  font-size:13px;        /* smaller */
  color:#c8102e;
}

.mn-seo-updated{
  margin-top: 8px;
  font-size:11px;
  color:#9ca3af;
}

/* keep it compact on mobile too */
@media (max-width: 900px){
  .mn-seo-grid{ grid-template-columns:1fr; }
  .mn-seo-block{ padding:12px 14px; }
}
.mn-seo-block--grid{
  grid-column: 1 / -1;   /* spans both columns */
  margin-top: 0;         /* spacing comes from grid gap */
}
.mn-seo-block--grid{
  grid-column: 1 / -1;
}
/* SIMPLE plates-like top row */
.mn-filter-main{
  display:grid;
  grid-template-columns: minmax(220px,1fr) minmax(220px,1fr) minmax(260px,1.6fr) minmax(170px,220px);
  gap:12px;
  align-items:end;
}

.mn-field-grow{min-width:0}

/* Advanced filters collapsible */
.mn-adv{
  margin-top:12px;
  border-top:1px solid #eef2f7;
  padding-top:12px;
}

.mn-adv-summary{
  cursor:pointer;
  font-weight:950;
  color:#111827;
  font-size:13px;
  user-select:none;
  list-style:none;
}
.mn-adv-summary::-webkit-details-marker{display:none;}
.mn-adv-summary:before{
  content:"+";
  display:inline-block;
  width:18px;
  text-align:center;
  margin-right:8px;
  color:#c8102e;
}
.mn-adv[open] .mn-adv-summary:before{content:"–";}

.mn-adv-grid{
  margin-top:12px;
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:12px;
  align-items:end;
}

.mn-adv-actions{
  display:flex;
  justify-content:flex-end;
  align-items:end;
}

/* Responsive */
@media (max-width:1100px){
  .mn-filter-main{grid-template-columns:1fr 1fr;}
  .mn-adv-grid{grid-template-columns:1fr 1fr;}
  .mn-adv-actions{justify-content:stretch;}
  .mn-reset{width:100%; justify-content:center;}
}
@media (max-width:560px){
  .mn-filter-main{grid-template-columns:1fr;}
  .mn-adv-grid{grid-template-columns:1fr;}
}