/* ===========================================================================
   SSCOM — Marktplaats-style modern UI layer (Phase 1: header + homepage)
   Loaded AFTER bootstrap + main.css, so it overrides them.
   =========================================================================== */

:root{
  --mp-primary:#c7000b;        /* brand red (logo, CTA, active) */
  --mp-primary-hover:#a00009;
  --mp-primary-050:#fdeff0;    /* faint red wash for hovers */
  --mp-ink:#1b1f24;            /* main text */
  --mp-muted:#6b7280;          /* secondary text */
  --mp-line:#e3e6ea;           /* borders */
  --mp-bg:#f2f3f5;             /* page background */
  --mp-card:#ffffff;
  --mp-radius:10px;
  --mp-radius-sm:6px;
  --mp-shadow:0 1px 3px rgba(16,24,40,.08),0 1px 2px rgba(16,24,40,.04);
  --mp-shadow-hover:0 6px 18px rgba(16,24,40,.12);
  --mp-font:'Inter','Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}

/* ---- base ---------------------------------------------------------------- */
body{
  font-family:var(--mp-font);
  background:var(--mp-bg)!important;
  color:var(--mp-ink);
  padding-top:0!important;           /* kill Bootstrap fixed-navbar offset */
  -webkit-font-smoothing:antialiased;
}
a{color:var(--mp-primary);}
a:hover,a:focus{color:var(--mp-primary-hover);text-decoration:none;}
.container{max-width:1200px;width:100%;}
img{max-width:100%;}

/* ---- header -------------------------------------------------------------- */
.mp-header{
  background:var(--mp-card);
  border-bottom:1px solid var(--mp-line);
  position:sticky;top:0;z-index:1030;
  box-shadow:0 1px 0 rgba(16,24,40,.04);
}
.mp-header__top{
  max-width:1200px;margin:0 auto;padding:12px 16px;
  display:flex;align-items:center;gap:18px;
}
.mp-logo{
  display:inline-flex;align-items:baseline;gap:2px;
  font-weight:800;font-size:26px;letter-spacing:-.5px;
  color:var(--mp-primary)!important;white-space:nowrap;
}
.mp-logo span{color:var(--mp-ink);font-weight:800;}
.mp-logo:hover{color:var(--mp-primary-hover)!important;}

/* search */
.mp-search{flex:1 1 auto;min-width:0;}
.mp-search form{
  display:flex;align-items:stretch;
  border:2px solid var(--mp-ink);border-radius:var(--mp-radius);
  overflow:hidden;background:#fff;height:48px;
}
.mp-search input[type=text]{
  flex:1 1 auto;min-width:0;border:0;outline:0;padding:0 16px;
  font-size:15px;color:var(--mp-ink);background:transparent;
}
.mp-search__cat{
  border:0;border-left:1px solid var(--mp-line);outline:0;
  background:#fff;padding:0 12px;font-size:14px;color:var(--mp-ink);
  max-width:190px;cursor:pointer;
}
.mp-search__btn{
  border:0;background:var(--mp-primary);color:#fff;
  padding:0 22px;font-size:15px;font-weight:600;cursor:pointer;
  display:flex;align-items:center;gap:8px;transition:background .15s;
}
.mp-search__btn:hover{background:var(--mp-primary-hover);}

/* right actions */
.mp-actions{display:flex;align-items:center;gap:8px;white-space:nowrap;}
.mp-link{
  display:inline-flex;align-items:center;gap:6px;
  color:var(--mp-ink)!important;font-size:14px;font-weight:500;
  padding:8px 10px;border-radius:var(--mp-radius-sm);
}
.mp-link:hover{background:var(--mp-primary-050);color:var(--mp-primary)!important;}
.mp-lang{position:relative;}
.mp-lang>a{color:var(--mp-ink)!important;font-weight:600;}
.mp-btn-post{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--mp-primary);color:#fff!important;
  font-weight:700;font-size:14px;padding:11px 18px;
  border-radius:var(--mp-radius);transition:background .15s,transform .05s;
  box-shadow:var(--mp-shadow);
}
.mp-btn-post:hover{background:var(--mp-primary-hover);color:#fff!important;}
.mp-btn-post:active{transform:translateY(1px);}

/* category quick-nav row */
.mp-catnav{border-top:1px solid var(--mp-line);background:var(--mp-card);}
.mp-catnav__inner{
  max-width:1200px;margin:0 auto;padding:0 16px;
  display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;
}
.mp-catnav__inner::-webkit-scrollbar{display:none;}
.mp-catnav a{
  color:var(--mp-muted)!important;font-size:13.5px;font-weight:600;
  padding:12px 12px;white-space:nowrap;border-bottom:2px solid transparent;
}
.mp-catnav a:hover{color:var(--mp-ink)!important;border-bottom-color:var(--mp-primary);}

/* ---- page wrapper -------------------------------------------------------- */
.mp-page{padding-top:18px;padding-bottom:18px;}

/* ---- hero (card inside container) ---------------------------------------- */
.mp-hero{
  background:linear-gradient(120deg,#fff 0%,#fbeceb 100%);
  border:1px solid var(--mp-line);border-radius:var(--mp-radius);
  padding:22px 22px;margin-bottom:22px;box-shadow:var(--mp-shadow);
}
.mp-hero h1{font-size:23px;font-weight:800;margin:0 0 4px;color:var(--mp-ink);}
.mp-hero p{color:var(--mp-muted);margin:0;font-size:14.5px;}

/* ---- section heading ----------------------------------------------------- */
.mp-h2{
  font-size:18px;font-weight:800;margin:0 0 14px;color:var(--mp-ink);
  display:flex;align-items:center;gap:10px;
}

/* ---- category grid ------------------------------------------------------- */
.mp-catgrid{
  display:grid;gap:14px;
  grid-template-columns:repeat(4,1fr);
}
.mp-cat{
  background:var(--mp-card);border:1px solid var(--mp-line);
  border-radius:var(--mp-radius);padding:16px 16px 12px;
  box-shadow:var(--mp-shadow);transition:box-shadow .15s,transform .1s,border-color .15s;
  display:flex;flex-direction:column;min-height:100%;
}
.mp-cat:hover{box-shadow:var(--mp-shadow-hover);transform:translateY(-2px);border-color:#d7dbe0;}
.mp-cat__head{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
.mp-cat__icon{
  width:44px;height:44px;flex:0 0 44px;border-radius:10px;
  background:var(--mp-primary-050);display:flex;align-items:center;justify-content:center;
}
.mp-cat__icon img{width:28px;height:28px;object-fit:contain;}
.mp-cat__title{font-size:15.5px;font-weight:800;color:var(--mp-ink);line-height:1.2;}
.mp-cat__title a{color:var(--mp-ink)!important;}
.mp-cat__title a:hover{color:var(--mp-primary)!important;}
.mp-cat ul{list-style:none;margin:0;padding:0;}
.mp-cat li{margin:0;}
.mp-cat li a{
  display:flex;justify-content:space-between;gap:8px;
  color:var(--mp-muted)!important;font-size:13.5px;padding:4px 0;
  border-bottom:1px dashed transparent;
}
.mp-cat li a:hover{color:var(--mp-primary)!important;}
.mp-cat li a .cnt{color:#9aa1ab;font-size:12.5px;}
.mp-cat__all{
  margin-top:auto;padding-top:10px;font-size:13px;font-weight:700;
  color:var(--mp-primary)!important;
}

/* ---- footer -------------------------------------------------------------- */
.mp-footer{
  background:var(--mp-card);border-top:1px solid var(--mp-line);margin-top:28px;
}
.mp-footer__inner{
  max-width:1200px;margin:0 auto;padding:22px 16px;
  display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;
  font-size:13.5px;color:var(--mp-muted);
}
.mp-footer__inner a{color:var(--mp-muted)!important;font-weight:600;}
.mp-footer__inner a:hover{color:var(--mp-primary)!important;}
.mp-footer__count{
  background:var(--mp-primary-050);color:var(--mp-primary)!important;
  padding:6px 12px;border-radius:20px;font-weight:700;
}
.mp-footer__copy{margin-left:auto;color:#9aa1ab;}

/* keep the old ad banners tidy */
.reklama-horizontal{max-width:1200px;margin:10px auto 0;padding:0 16px;}

/* ---- responsive ---------------------------------------------------------- */
@media (max-width:992px){
  .mp-catgrid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:768px){
  .mp-header__top{flex-wrap:wrap;gap:10px;}
  .mp-search{order:3;flex-basis:100%;}
  .mp-search__cat{display:none;}         /* simplify search on mobile */
  .mp-actions{margin-left:auto;}
  .mp-logo{font-size:22px;}
}
@media (max-width:520px){
  .mp-catgrid{grid-template-columns:1fr;}
  .mp-link span.txt{display:none;}       /* icon-only links on small screens */
}

/* ===========================================================================
   LEGACY OVERRIDES — restyle the old Bootstrap-3 + main.css look on the
   deeper pages (category listings, ad detail, forms, auth, static pages)
   so the whole site adopts the new design without rewriting every template.
   =========================================================================== */

/* buttons ------------------------------------------------------------------ */
.btn{
  border-radius:var(--mp-radius-sm)!important;font-weight:600!important;
  border:1px solid transparent!important;box-shadow:none!important;
  text-shadow:none!important;background-image:none!important;padding:8px 16px;
  transition:background .15s,border-color .15s;
}
.btn-primary,.btn-komp,.btn-success,button.searchform,input[type=submit].btn{
  background:var(--mp-primary)!important;border-color:var(--mp-primary)!important;color:#fff!important;
}
.btn-primary:hover,.btn-komp:hover,.btn-success:hover,button.searchform:hover{
  background:var(--mp-primary-hover)!important;border-color:var(--mp-primary-hover)!important;color:#fff!important;
}
.btn-default{background:#fff!important;border-color:var(--mp-line)!important;color:var(--mp-ink)!important;}
.btn-default:hover{background:var(--mp-primary-050)!important;border-color:#d7dbe0!important;color:var(--mp-primary)!important;}
.btn-xs{padding:4px 10px;font-size:12px;}
.btn-lg{padding:12px 22px;font-size:16px;}

/* forms -------------------------------------------------------------------- */
.form-control{
  border:1px solid var(--mp-line)!important;border-radius:var(--mp-radius-sm)!important;
  box-shadow:none!important;color:var(--mp-ink);height:auto;padding:9px 12px;font-size:14.5px;
}
.form-control:focus{border-color:var(--mp-primary)!important;box-shadow:0 0 0 3px var(--mp-primary-050)!important;}
label{font-weight:600;color:var(--mp-ink);}
.rulestext{border:1px solid var(--mp-line)!important;border-radius:var(--mp-radius)!important;box-shadow:none!important;background:#fff;}
.rulestext h2{border-bottom:1px solid var(--mp-line);}

/* panels / wells → cards --------------------------------------------------- */
.panel,.panel.panel-default,.well{
  background:var(--mp-card)!important;background-image:none!important;filter:none!important;
  border:1px solid var(--mp-line)!important;border-radius:var(--mp-radius)!important;
  box-shadow:var(--mp-shadow)!important;
}
.panel-heading{
  background:#fff!important;background-image:none!important;border-bottom:1px solid var(--mp-line)!important;
  border-radius:var(--mp-radius) var(--mp-radius) 0 0!important;font-weight:700;color:var(--mp-ink);
}
.panel-title{font-weight:700;}

/* breadcrumb --------------------------------------------------------------- */
.breadcrumb{
  background:transparent!important;border:0!important;border-radius:0!important;
  padding:12px 0!important;margin-bottom:14px!important;font-size:13.5px;
}
.breadcrumb>li,.breadcrumb>li>a{color:var(--mp-muted)!important;}
.breadcrumb>li>a:hover{color:var(--mp-primary)!important;}
.breadcrumb>.active{color:var(--mp-ink)!important;font-weight:700!important;}
.breadcrumb>li+li:before{color:#c3c8cf;content:"\203A";padding:0 8px;}

/* listing table (LRP) ------------------------------------------------------ */
.table{background:var(--mp-card);border-radius:var(--mp-radius);overflow:hidden;}
.table.table-ads{
  border:1px solid var(--mp-line)!important;border-collapse:separate;border-spacing:0;
  box-shadow:var(--mp-shadow);
}
.table.table-ads>thead>tr{background:var(--mp-ink)!important;color:#fff!important;}
.table.table-ads>thead>tr>th{
  border:0!important;padding:12px 12px;font-size:13px;font-weight:700;color:#fff!important;vertical-align:middle;
}
/* neutralise the old teal thead rule from main.css */
.table>thead:first-child>tr:first-child>th,.table>thead:first-child>tr:first-child>td{
  background-color:var(--mp-ink)!important;color:#fff!important;
}
.table.table-ads>tbody>tr{transition:background .1s;}
.table.table-ads>tbody>tr:hover{background:var(--mp-primary-050)!important;}
.table.table-ads>tbody>tr>td{
  border-top:1px solid var(--mp-line)!important;vertical-align:middle;padding:10px 12px;font-size:14px;
}
.table.table-ads img{border-radius:8px;border:1px solid var(--mp-line);object-fit:cover;}
.table.table-ads a{color:var(--mp-ink)!important;font-weight:600;}
.table.table-ads a:hover{color:var(--mp-primary)!important;}
td.price_coll,.price_coll{color:var(--mp-primary)!important;font-weight:800!important;white-space:nowrap;}

/* sort links + filter search form ------------------------------------------ */
a.sortlink{color:#cfd3d8!important;}
a.sortlink:hover{color:#fff!important;}
a.sortlink.active{color:#ffb3a0!important;}
.form-inline.sform{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
}
input.searchform,select.searchform{
  width:auto!important;min-width:120px;margin:0!important;padding:8px 10px!important;
  border:1px solid var(--mp-line)!important;border-radius:var(--mp-radius-sm)!important;font-size:14px;height:auto;
}
input.searchform:focus,select.searchform:focus{border-color:var(--mp-primary)!important;outline:0;}
button.searchform{
  width:auto!important;float:none!important;margin:0 0 0 auto!important;padding:8px 18px!important;
  border-radius:var(--mp-radius-sm)!important;font-weight:600;
}

/* ad detail (VIP) ---------------------------------------------------------- */
span.ads_price{color:var(--mp-primary)!important;font-weight:800;font-size:30px;}
.large{border:1px solid var(--mp-line)!important;border-radius:var(--mp-radius)!important;background:#fff;}
.small img{border-radius:8px!important;border:1px solid var(--mp-line)!important;}
.small img.galsmall.active{opacity:1!important;outline:2px solid var(--mp-primary);}
.post_text{
  background:var(--mp-card);border:1px solid var(--mp-line);border-radius:var(--mp-radius);
  padding:16px 18px;line-height:1.6;color:var(--mp-ink);
}
table.par{background:var(--mp-card);border:1px solid var(--mp-line);border-radius:var(--mp-radius);overflow:hidden;width:100%;}
table.par td.par_name{color:var(--mp-muted)!important;font-weight:600;border-bottom:1px solid var(--mp-line);}
table.par td.par_value{color:var(--mp-ink)!important;border-bottom:1px solid var(--mp-line);}
.detail{color:var(--mp-muted);}
span.foul{color:var(--mp-primary)!important;}
.autohartitle{background:var(--mp-ink)!important;color:#fff!important;border-radius:var(--mp-radius-sm) var(--mp-radius-sm) 0 0;font-family:var(--mp-font)!important;}
.harhead{background:#f0f1f3!important;color:var(--mp-ink);border-radius:var(--mp-radius-sm);}
.autoharname.exist{color:#1f9d55!important;}

/* pagination --------------------------------------------------------------- */
.pagination>li>a,.pagination>li>span{color:var(--mp-ink)!important;border-color:var(--mp-line)!important;}
.pagination>li>a:hover{background:var(--mp-primary-050)!important;color:var(--mp-primary)!important;}
.pagination>.active>a,.pagination>.active>span,.pagination>.active>a:hover{
  background:var(--mp-primary)!important;border-color:var(--mp-primary)!important;color:#fff!important;
}

/* misc leftovers from main.css -------------------------------------------- */
.col-xs-6.col-sm-6{background:var(--mp-card)!important;border:1px solid var(--mp-line)!important;border-radius:var(--mp-radius);}
.catblock{background:var(--mp-card)!important;border:1px solid var(--mp-line)!important;border-radius:var(--mp-radius);min-height:0;}
.catblock h2{background:transparent!important;color:var(--mp-ink)!important;height:auto;}
.catblock h2 a{color:var(--mp-ink)!important;}
.modal-content{border-radius:var(--mp-radius)!important;border:0!important;box-shadow:0 12px 40px rgba(16,24,40,.2)!important;overflow:hidden;}
.modal-header{border-bottom:1px solid var(--mp-line)!important;padding:16px 18px!important;}
.modal-header .modal-title,.modal-title{font-weight:800!important;font-size:17px!important;color:var(--mp-ink);}
.modal-body{padding:18px!important;}
.modal-footer{border-top:1px solid var(--mp-line)!important;}
.modal-header .close{opacity:.5;font-size:24px;}
.modal-header .close:hover{opacity:1;color:var(--mp-primary);}
/* modern checkboxes/radios + labels */
input[type=checkbox],input[type=radio]{accent-color:var(--mp-primary);width:16px;height:16px;vertical-align:-2px;cursor:pointer;}
.radio label,.checkbox label{font-weight:500;color:var(--mp-ink);}
/* auth / registration forms breathing room */
#regform,#editform{max-width:940px;margin:0 auto;}
.alert{border-radius:var(--mp-radius)!important;}
.label-primary,.badge{background:var(--mp-primary)!important;}
hr{border-top:1px solid var(--mp-line);}

/* ===========================================================================
   MOBILE — make it feel like a native app (bottom tab bar, app shell, PWA)
   Applies to phones only; desktop keeps the web layout.
   =========================================================================== */

/* Bottom tab bar (hidden on desktop) */
.mp-tabbar{display:none;}
.mp-tab{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;
  gap:3px;padding:7px 2px 6px;min-height:56px;
  background:none;border:0;text-decoration:none;cursor:pointer;
  color:var(--mp-muted)!important;font-size:10.5px;font-weight:600;font-family:var(--mp-font);
}
.mp-tab svg{width:23px;height:23px;flex:0 0 auto;}
.mp-tab span{line-height:1;white-space:nowrap;}
.mp-tab.is-active{color:var(--mp-primary)!important;}
.mp-tab:active{background:var(--mp-primary-050);}
.mp-tab--post{overflow:visible;}
.mp-tab__fab{
  width:52px;height:52px;border-radius:18px;background:var(--amber,#E08A2C);color:#3a2408;
  display:flex;align-items:center;justify-content:center;margin-top:-22px;margin-bottom:1px;
  box-shadow:0 10px 22px -8px rgba(224,138,44,.6);border:3px solid #fff;
}
.mp-tab__fab svg{width:24px;height:24px;}

@media (max-width:768px){
  body{padding-bottom:calc(60px + env(safe-area-inset-bottom))!important;}

  /* hide the page scrollbar for a clean native-app look (scroll still works) */
  html{scrollbar-width:none;-ms-overflow-style:none;}
  html::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;height:0;}

  .mp-tabbar{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1040;
    background:#fff;border-top:1px solid var(--mp-line);
    padding-bottom:env(safe-area-inset-bottom);
    box-shadow:0 -2px 12px rgba(16,24,40,.08);
  }

  /* App-like top header */
  .mp-header__top{padding:9px 12px;gap:8px;}
  .mp-logo{font-size:20px;}
  .mp-actions>a.mp-link{display:none;}          /* account/logout live in the tab bar */
  .mp-btn-post{display:none;}                    /* + is the tab-bar FAB */
  .mp-lang>a{padding:8px 8px;}

  /* Search as a rounded pill */
  .mp-search{order:3;flex-basis:100%;}
  .mp-search form{height:44px;border-width:1.6px;border-radius:24px;}
  .mp-search input[type=text]{padding:0 14px;font-size:14.5px;}
  .mp-search__cat{display:none;}
  .mp-search__btn{padding:0 16px;border-radius:0 22px 22px 0;}
  .mp-search__btn span{display:none;}

  /* Category quick-nav → scrollable chips */
  .mp-catnav__inner{gap:8px;padding:9px 12px;}
  .mp-catnav a{
    border:1px solid var(--mp-line)!important;border-radius:20px;padding:7px 14px;
    background:#fff;color:var(--mp-ink)!important;font-size:12.5px;flex:0 0 auto;
  }
  .mp-catnav a:hover{border-color:var(--mp-primary)!important;color:var(--mp-primary)!important;}

  /* Tighter content + app-like spacing */
  .container.mp-page{padding-left:12px;padding-right:12px;}
  .mp-page{padding-top:12px;}
  .mp-hero{padding:16px;margin-bottom:16px;}
  .mp-hero h1{font-size:19px;}
  .mp-hero p{font-size:13px;}
  .mp-h2{font-size:16px;}
  .mp-catgrid{gap:12px;}

  /* Full-bleed cards feel more app-native */
  .mp-cat{border-radius:12px;}
  .panel,.well,.post_text,table.par,.rulestext{border-radius:12px!important;}

  /* Smooth momentum scrolling for the listing table wrapper */
  .table-responsive,[style*="overflow-x"]{-webkit-overflow-scrolling:touch;}
}

/* Two-column app tiles on the smallest screens (denser, more app-like) */
@media (max-width:520px){
  .mp-catgrid{grid-template-columns:1fr;}
}

/* Standalone (installed PWA): respect the notch / status bar */
@media (display-mode:standalone){
  .mp-header{padding-top:env(safe-area-inset-top);}
  .mp-tab{padding-bottom:6px;}
}

/* ===========================================================================
   LRP — search results as app cards + filter sidebar / bottom sheet
   =========================================================================== */
.mp-lrp{display:grid;grid-template-columns:262px 1fr;gap:20px;align-items:start;}
.mp-filters{
  background:var(--mp-card);border:1px solid var(--mp-line);border-radius:var(--mp-radius);
  box-shadow:var(--mp-shadow);position:sticky;top:120px;overflow:hidden;
}
.mp-filters__head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--mp-line);font-weight:800;}
.mp-filters__head .mp-sheet__close{display:none;}
.mp-filterform{padding:14px 16px;}
.mp-field{margin-bottom:12px;}
.mp-field label{display:block;font-size:12.5px;color:var(--mp-muted);margin-bottom:5px;font-weight:600;}
.mp-field select,.mp-field input{width:100%;border:1px solid var(--mp-line)!important;border-radius:var(--mp-radius-sm)!important;padding:9px 10px!important;font-size:14px;background:#fff;}
.mp-field__range{display:flex;gap:8px;}
.mp-filters__actions{display:flex;gap:8px;margin-top:4px;}
.mp-filters__actions .btn{flex:1;text-align:center;}
.mp-filters__empty{color:var(--mp-muted);padding:0 2px;}

.mp-results__bar{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap;}
.mp-results__count{font-size:14px;color:var(--mp-muted);}
.mp-results__count b{color:var(--mp-ink);font-size:16px;}
.mp-sort{margin-left:auto;border:1px solid var(--mp-line);border-radius:var(--mp-radius-sm);padding:8px 10px;font-size:14px;background:#fff;max-width:230px;}
.mp-filter-toggle{display:none;align-items:center;gap:6px;border:1px solid var(--mp-line);background:#fff;border-radius:var(--mp-radius-sm);padding:8px 12px;font-weight:600;font-size:14px;color:var(--mp-ink);cursor:pointer;}

.mp-list{display:flex;flex-direction:column;gap:12px;}
.mp-listing{
  display:flex;gap:14px;background:var(--mp-card);border:1px solid var(--mp-line);
  border-radius:var(--mp-radius);box-shadow:var(--mp-shadow);overflow:hidden;position:relative;
  padding:12px;text-decoration:none;transition:box-shadow .15s,transform .08s;
}
.mp-listing:hover{box-shadow:var(--mp-shadow-hover);}
.mp-listing:active{transform:scale(.995);}
.mp-listing__img{flex:0 0 132px;width:132px;height:104px;border-radius:8px;overflow:hidden;background:#f0f1f3;}
.mp-listing__img img{width:100%;height:100%;object-fit:cover;}
.mp-listing__body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;}
.mp-listing__title{font-size:15px;font-weight:600;color:var(--mp-ink);line-height:1.35;margin-bottom:6px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.mp-listing__chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px;}
.mp-listing__chips span{background:#f0f1f3;color:var(--mp-muted);font-size:12px;padding:3px 8px;border-radius:12px;white-space:nowrap;}
.mp-listing__bottom{margin-top:auto;display:flex;align-items:baseline;gap:12px;}
.mp-listing__price{font-size:18px;font-weight:800;color:var(--mp-primary);}
.mp-listing__date{font-size:12.5px;color:#9aa1ab;margin-left:auto;}
.mp-listing__fav{
  position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:50%;
  background:#fff;border:1px solid var(--mp-line);color:#9aa1ab;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2;
}
.mp-listing__fav svg{width:18px;height:18px;}
.mp-listing__fav.is-on{color:var(--mp-primary);border-color:var(--mp-primary);}
.mp-listing__fav.is-on svg{fill:var(--mp-primary);}
.mp-empty{background:var(--mp-card);border:1px dashed var(--mp-line);border-radius:var(--mp-radius);padding:44px 20px;text-align:center;color:var(--mp-muted);}

/* ===========================================================================
   VIP — ad detail: gallery, specs, seller card, fullscreen lightbox
   =========================================================================== */
.mp-vip{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start;}
.mp-vip__main{min-width:0;}
.mp-gallery{position:relative;margin-bottom:16px;}
.mp-gallery .swiper-gallery{border-radius:var(--mp-radius);overflow:hidden;background:#111;}
.mp-gallery .swiper-slide{display:flex;align-items:center;justify-content:center;background:#111;height:430px;cursor:zoom-in;}
.mp-gallery .swiper-slide img{max-height:430px;width:auto;max-width:100%;object-fit:contain;}
.mp-gallery__single{border-radius:var(--mp-radius);overflow:hidden;background:#111;display:flex;align-items:center;justify-content:center;height:430px;cursor:zoom-in;}
.mp-gallery__single img{max-height:430px;max-width:100%;object-fit:contain;}
.mp-gallery__count{position:absolute;bottom:12px;right:12px;background:rgba(0,0,0,.6);color:#fff;font-size:12px;padding:4px 10px;border-radius:14px;z-index:5;}
.mp-thumbs{display:flex;gap:8px;margin-top:10px;overflow-x:auto;padding-bottom:4px;}
.mp-thumbs img{width:84px;height:64px;object-fit:cover;border-radius:8px;border:2px solid transparent;cursor:pointer;flex:0 0 auto;}
.mp-thumbs img.active{border-color:var(--mp-primary);}
.mp-vip__title{font-size:24px;font-weight:800;color:var(--mp-ink);margin:4px 0 6px;line-height:1.25;}
.mp-vip__price{font-size:28px;font-weight:800;color:var(--mp-primary);margin-bottom:16px;}
.mp-vip__block{margin-bottom:18px;}
.mp-vip__h{font-size:16px;font-weight:800;margin:0 0 10px;}
.mp-vip .post_text{margin-top:0;}
.mp-specs{border:1px solid var(--mp-line);border-radius:var(--mp-radius);overflow:hidden;}
.mp-specs__row{display:flex;justify-content:space-between;gap:16px;padding:10px 14px;font-size:14px;}
.mp-specs__row:nth-child(even){background:#fafbfc;}
.mp-specs__k{color:var(--mp-muted);}
.mp-specs__v{color:var(--mp-ink);font-weight:600;text-align:right;}
.mp-vip__meta{color:var(--mp-muted);font-size:13px;margin-top:14px;}
.mp-vip__meta .foul{cursor:pointer;color:var(--mp-primary);}

.mp-vip__side{position:sticky;top:120px;}
.mp-seller{background:var(--mp-card);border:1px solid var(--mp-line);border-radius:var(--mp-radius);box-shadow:var(--mp-shadow);padding:18px;}
.mp-seller__price{font-size:26px;font-weight:800;color:var(--mp-primary);margin-bottom:12px;}
.mp-seller__name{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.mp-seller__label{display:block;font-size:12px;color:var(--mp-muted);}
.mp-seller__name b{font-size:15px;}
.mp-btn-primary,.mp-btn-outline{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px;border-radius:var(--mp-radius);font-weight:700;font-size:15px;margin-bottom:10px;position:relative;overflow:hidden;text-decoration:none;transition:background .15s,border-color .15s;}
.mp-btn-primary{background:var(--mp-primary);color:#fff!important;}
.mp-btn-primary:hover{background:var(--mp-primary-hover);color:#fff!important;}
.mp-btn-outline{background:#fff;border:1.5px solid var(--mp-line);color:var(--mp-ink)!important;}
.mp-btn-outline:hover{border-color:var(--mp-primary);color:var(--mp-primary)!important;}
.mp-vip__ad{margin-top:14px;}

/* fullscreen lightbox (native scroll-snap swipe) */
.mp-lightbox{position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.94);display:none;}
.mp-lightbox.open{display:block;}
.mp-lightbox__track{display:flex;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
.mp-lightbox__slide{flex:0 0 100%;height:100%;scroll-snap-align:center;display:flex;align-items:center;justify-content:center;padding:16px;}
.mp-lightbox__slide img{max-width:100%;max-height:100%;object-fit:contain;}
.mp-lightbox__close{position:fixed;top:14px;right:16px;z-index:2010;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;font-size:26px;line-height:1;cursor:pointer;}

/* ---- tap ripple + fixed ad contact bar (base) ---------------------------- */
[data-ripple]{position:relative;overflow:hidden;}
.mp-ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.5);transform:scale(0);animation:mpRipple .55s ease-out;pointer-events:none;}
.mp-btn-outline .mp-ripple,.mp-listing .mp-ripple{background:rgba(199,0,11,.16);}
@keyframes mpRipple{to{transform:scale(2.4);opacity:0;}}
.mp-ad-actions{display:none;}
.mp-page{animation:mpFade .24s ease;}
@keyframes mpFade{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:none;}}

/* ===========================================================================
   LRP + VIP — mobile app behaviour
   =========================================================================== */
@media (max-width:768px){
  /* LRP single column; filters become a slide-up sheet */
  .mp-lrp{grid-template-columns:1fr;}
  .mp-filter-toggle{display:inline-flex;}
  .mp-filters{
    position:fixed;left:0;right:0;bottom:0;top:auto;z-index:1200;
    border-radius:18px 18px 0 0;max-height:82vh;overflow-y:auto;
    transform:translateY(110%);transition:transform .28s ease;box-shadow:0 -12px 44px rgba(0,0,0,.28);
  }
  /* ⚠ --cp-muted, not --mp-muted: the latter is still the old bluish Tailwind grey
     (#6b7280) on this file's :root, so the sheet's close button was drawn in a
     colour the portal does not use. --cp-muted (#5C6A62) is the real palette.
     Mobile-only rule (line 441 hides the button above 768), so desktop is untouched. */
  .mp-filters__head .mp-sheet__close{display:inline-flex;align-items:center;justify-content:center;
    min-width:44px;min-height:44px;margin-right:-10px;
    background:none;border:0;font-size:28px;line-height:1;color:var(--cp-muted,#5C6A62);cursor:pointer;}
  body.mp-filters-open .mp-filters{transform:translateY(0);}
  .mp-sheet-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.42);z-index:1150;opacity:0;visibility:hidden;transition:opacity .2s;}
  body.mp-filters-open .mp-sheet-backdrop{opacity:1;visibility:visible;}
  body.mp-filters-open{overflow:hidden;}

  .mp-listing__img{flex-basis:106px;width:106px;height:90px;}
  .mp-listing__title{font-size:14px;}
  .mp-listing__price{font-size:16.5px;}
  .mp-sort{max-width:52vw;}

  /* VIP single column; hide side card, show fixed contact bar */
  .mp-vip{grid-template-columns:1fr;}
  .mp-vip__side{display:none;}
  .mp-gallery{margin-left:-12px;margin-right:-12px;}      /* full-bleed */
  .mp-gallery .swiper-gallery,.mp-gallery__single{border-radius:0;}
  .mp-gallery .swiper-slide,.mp-gallery__single{height:300px;}
  .mp-gallery .swiper-slide img,.mp-gallery__single img{max-height:300px;}
  .mp-thumbs{padding-left:12px;padding-right:12px;}
  .mp-vip__title{font-size:20px;}
  .mp-vip__price{font-size:23px;}

  body.page-ads .mp-tabbar{display:none;}                 /* contact bar replaces tab bar */
  body.page-ads{padding-bottom:calc(74px + env(safe-area-inset-bottom))!important;}
  .mp-ad-actions{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1040;gap:10px;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom));
    background:#fff;border-top:1px solid var(--mp-line);box-shadow:0 -2px 12px rgba(16,24,40,.1);
  }
  .mp-ad-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:13px;border-radius:var(--mp-radius);font-weight:700;font-size:15px;text-decoration:none;}
  .mp-ad-btn--call{background:#fff;border:1.6px solid var(--mp-primary);color:var(--mp-primary)!important;}
  .mp-ad-btn--msg{background:var(--mp-primary);color:#fff!important;}
}

/* ===========================================================================
   Category browser — tappable subcategory rows (app style)
   =========================================================================== */
.mp-catrows{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.mp-catrow{
  display:flex;align-items:center;gap:12px;padding:14px 16px;
  background:var(--mp-card);border:1px solid var(--mp-line);border-radius:var(--mp-radius);
  box-shadow:var(--mp-shadow);text-decoration:none;color:var(--mp-ink)!important;
  position:relative;overflow:hidden;transition:box-shadow .12s,transform .08s,border-color .12s;
}
.mp-catrow:hover{box-shadow:var(--mp-shadow-hover);border-color:#d7dbe0;}
.mp-catrow:active{transform:scale(.99);}
.mp-catrow__ic{width:36px;height:36px;flex:0 0 36px;border-radius:9px;background:var(--mp-primary-050);display:flex;align-items:center;justify-content:center;}
.mp-catrow__ic img{width:22px;height:22px;object-fit:contain;}
.mp-catrow__name{flex:1 1 auto;font-weight:600;font-size:15px;line-height:1.25;}
.mp-catrow__cnt{color:var(--mp-muted);font-size:12.5px;background:#f0f1f3;padding:2px 9px;border-radius:12px;white-space:nowrap;}
.mp-catrow__chev{color:#c3c8cf;flex:0 0 auto;}
@media (max-width:640px){ .mp-catrows{grid-template-columns:1fr;} }

/* ===========================================================================
   Account / post-ad forms (on top of the global Bootstrap overrides)
   =========================================================================== */
.selcatdiv{margin-bottom:14px;}
.slim{border:1px dashed var(--mp-line)!important;border-radius:var(--mp-radius)!important;background:#fafbfc;}
.panel-body{padding:18px;}
.panel .form-group{margin-bottom:16px;}
.account-hd,.mp-account-hd,.mp-formhd{font-size:20px;font-weight:800;margin:2px 0 16px;}
@media (max-width:768px){
  .col-md-offset-2{margin-left:0;}
  .panel-body{padding:14px;}
}

/* post-ad: photo uploaders as a responsive grid + nicer dropzones */
.mp-photos{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:4px 0 8px;}
@media (max-width:768px){ .mp-photos{grid-template-columns:repeat(2,1fr);} }
.mp-photos .slim,.slim{border:2px dashed var(--mp-line)!important;border-radius:12px!important;background:#fafbfc!important;transition:border-color .15s,background .15s;}
.mp-photos .slim:hover,.slim:hover{border-color:var(--mp-primary)!important;background:var(--mp-primary-050)!important;}
.slim-label{color:var(--mp-muted)!important;font-weight:600;}

/* success card */
.mp-success{max-width:540px;margin:34px auto;background:var(--mp-card);border:1px solid var(--mp-line);border-radius:var(--mp-radius);box-shadow:var(--mp-shadow);padding:34px 26px;text-align:center;}
.mp-success__ic{width:66px;height:66px;margin:0 auto 16px;border-radius:50%;background:#e9f9ef;display:flex;align-items:center;justify-content:center;}
.mp-success h1{font-size:23px;font-weight:800;margin:0 0 8px;color:var(--mp-ink);}
.mp-success p{color:var(--mp-muted);margin:0 0 22px;font-size:15px;}
.mp-success__btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;}
.mp-success__btns .btn{min-width:150px;}

/* post-ad category picker step */
.mp-step__hint{color:var(--mp-muted);font-size:14px;margin:-8px 0 16px;}

/* my ads — cards */
.mp-myads{display:flex;flex-direction:column;gap:12px;}
.mp-myad{display:flex;align-items:center;gap:14px;background:var(--mp-card);border:1px solid var(--mp-line);border-radius:var(--mp-radius);box-shadow:var(--mp-shadow);padding:12px;}
.mp-myad__img{flex:0 0 84px;width:84px;height:64px;border-radius:8px;overflow:hidden;background:#f0f1f3;}
.mp-myad__img img{width:100%;height:100%;object-fit:cover;}
.mp-myad__body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:6px;}
.mp-myad__title{font-size:14.5px;font-weight:600;color:var(--mp-ink)!important;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.mp-myad__title:hover{color:var(--mp-primary)!important;}
.mp-myad__status{align-self:flex-start;font-size:12px;font-weight:700;padding:2px 10px;border-radius:12px;}
.mp-myad__status.is-active{background:#e9f9ef;color:#1f9d55;}
.mp-myad__status.is-exp{background:#f0f1f3;color:var(--mp-muted);}
.mp-myad__status.is-off{background:var(--mp-primary-050);color:var(--mp-primary);}
.mp-myad__actions{display:flex;gap:6px;flex:0 0 auto;}
.mp-myad__btn{width:38px;height:38px;border-radius:9px;border:1px solid var(--mp-line);display:flex;align-items:center;justify-content:center;color:var(--mp-muted)!important;background:#fff;transition:background .12s,border-color .12s,color .12s;}
.mp-myad__btn:hover{border-color:var(--mp-primary);color:var(--mp-primary)!important;background:var(--mp-primary-050);}
.mp-myad__btn--del:hover{border-color:#d64545;color:#d64545!important;background:#fdecec;}
@media (max-width:560px){
  .mp-myad{flex-wrap:wrap;}
  .mp-myad__actions{flex-basis:100%;justify-content:flex-end;border-top:1px solid var(--mp-line);padding-top:10px;margin-top:2px;}
}

/* ===========================================================================
   Saved / favorites feature — save-search button, account nav, saved searches
   =========================================================================== */
.mp-savesearch{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--mp-line);background:#fff;border-radius:var(--mp-radius-sm);padding:8px 12px;font-weight:600;font-size:14px;color:var(--mp-ink);cursor:pointer;transition:background .12s,border-color .12s,color .12s;}
.mp-savesearch:hover{border-color:var(--mp-primary);color:var(--mp-primary);background:var(--mp-primary-050);}
.mp-savesearch.is-saved{background:#e9f9ef;border-color:#c5ebd3;color:#1f9d55;cursor:default;}

.mp-accnav{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:0 0 18px;}
.mp-accnav a{padding:8px 14px;border-radius:20px;font-size:14px;font-weight:600;color:var(--mp-muted)!important;background:#fff;border:1px solid var(--mp-line);transition:background .12s,border-color .12s,color .12s;}
.mp-accnav a:hover{color:var(--mp-primary)!important;border-color:var(--mp-primary);}
.mp-accnav a.is-active{background:var(--mp-primary);color:#fff!important;border-color:var(--mp-primary);}
.mp-accnav__add{margin-left:auto;background:var(--mp-primary)!important;color:#fff!important;border-color:var(--mp-primary)!important;}
.mp-accnav__add:hover{background:var(--mp-primary-hover)!important;color:#fff!important;}

.mp-ssearch{display:flex;flex-direction:column;gap:10px;margin-bottom:8px;}
.mp-ss{display:flex;align-items:center;gap:12px;background:var(--mp-card);border:1px solid var(--mp-line);border-radius:var(--mp-radius);box-shadow:var(--mp-shadow);padding:12px 14px;}
.mp-ss__ic{color:var(--mp-primary);flex:0 0 auto;}
.mp-ss__title{flex:1 1 auto;min-width:0;font-weight:600;color:var(--mp-ink)!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mp-ss__title:hover{color:var(--mp-primary)!important;}
.mp-ss__alert{color:#1f9d55;display:flex;flex:0 0 auto;}
.mp-ss__del{width:34px;height:34px;border-radius:8px;border:1px solid var(--mp-line);display:flex;align-items:center;justify-content:center;color:var(--mp-muted)!important;flex:0 0 auto;}
.mp-ss__del:hover{border-color:#d64545;color:#d64545!important;background:#fdecec;}
@media (max-width:560px){ .mp-accnav__add{margin-left:0;flex-basis:100%;text-align:center;} }

/* ===========================================================================
   Chat / messages
   =========================================================================== */
/* tab bar unread badge */
.mp-tab__ico{position:relative;display:inline-flex;}
.mp-tab__badge{position:absolute;top:-5px;right:-9px;background:var(--mp-primary);color:#fff;font-size:10px;font-weight:800;min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 4px;border:2px solid #fff;}

/* seller email under the chat button */
.mp-seller__mail{display:block;text-align:center;font-size:12.5px;color:var(--mp-muted)!important;margin:-2px 0 4px;word-break:break-all;}
.mp-seller__mail:hover{color:var(--mp-primary)!important;}

/* inbox */
.mp-inbox{display:flex;flex-direction:column;background:#fff;border:1px solid var(--mp-line);border-radius:var(--mp-radius);overflow:hidden;box-shadow:var(--mp-shadow);}
.mp-inbox__row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--mp-line);text-decoration:none;position:relative;}
.mp-inbox__row:last-child{border-bottom:0;}
.mp-inbox__row:hover{background:var(--mp-primary-050);}
.mp-inbox__img{width:52px;height:52px;border-radius:10px;object-fit:cover;flex:0 0 auto;background:#f0f1f3;}
.mp-inbox__body{flex:1 1 auto;min-width:0;}
.mp-inbox__top{display:flex;justify-content:space-between;gap:10px;align-items:baseline;}
.mp-inbox__top b{color:var(--mp-ink);font-size:14.5px;}
.mp-inbox__time{color:#9aa1ab;font-size:12px;flex:0 0 auto;}
.mp-inbox__prev{color:var(--mp-muted);font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px;}
.mp-inbox__row.is-unread .mp-inbox__prev{color:var(--mp-ink);font-weight:600;}
.mp-inbox__badge{background:var(--mp-primary);color:#fff;font-size:12px;font-weight:800;min-width:20px;height:20px;border-radius:10px;display:flex;align-items:center;justify-content:center;padding:0 6px;flex:0 0 auto;}

/* conversation */
.mp-conv{display:flex;flex-direction:column;background:#fff;border:1px solid var(--mp-line);border-radius:var(--mp-radius);box-shadow:var(--mp-shadow);overflow:hidden;height:calc(100vh - 210px);min-height:440px;max-width:840px;margin:0 auto;}
.mp-conv__head{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--mp-line);background:#fff;}
.mp-conv__back{font-size:22px;line-height:1;color:var(--mp-ink)!important;text-decoration:none;padding:2px 8px;}
.mp-conv__ad{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0;}
.mp-conv__ad img{width:42px;height:42px;border-radius:9px;object-fit:cover;flex:0 0 auto;}
.mp-conv__who{display:block;font-weight:700;color:var(--mp-ink);font-size:14.5px;}
.mp-conv__title{display:block;font-size:12.5px;color:var(--mp-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:58vw;}
.mp-conv__body{flex:1 1 auto;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:8px;background:#f7f8fa;}
.mp-msg{max-width:78%;padding:9px 13px;border-radius:16px;font-size:14.5px;line-height:1.42;word-wrap:break-word;overflow-wrap:anywhere;}
.mp-msg__t{display:block;font-size:10.5px;opacity:.72;margin-top:3px;text-align:right;}
.mp-msg.their{align-self:flex-start;background:#fff;border:1px solid var(--mp-line);border-bottom-left-radius:5px;color:var(--mp-ink);}
.mp-msg.mine{align-self:flex-end;background:var(--mp-primary);color:#fff;border-bottom-right-radius:5px;}
.mp-msg.mine .mp-msg__t{opacity:.85;}
.mp-conv__form{display:flex;align-items:flex-end;gap:8px;padding:10px 12px;border-top:1px solid var(--mp-line);background:#fff;}
.mp-conv__form textarea{flex:1 1 auto;border:1px solid var(--mp-line);border-radius:20px;padding:10px 14px;font-size:14.5px;resize:none;max-height:120px;font-family:inherit;line-height:1.35;}
.mp-conv__form textarea:focus{border-color:var(--mp-primary);outline:0;}
.mp-conv__form button{flex:0 0 auto;width:44px;height:44px;border-radius:50%;border:0;background:var(--mp-primary);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .12s;}
.mp-conv__form button:hover{background:var(--mp-primary-hover);}

/* conversation full-screen on mobile, hide the tab bar */
body.mp-in-conv .mp-tabbar{display:none;}
body.mp-in-conv{padding-bottom:0!important;}
@media (max-width:768px){
  body.mp-in-conv .mp-page{padding:0;}
  body.mp-in-conv .mp-conv{height:calc(100vh - 58px);border-radius:0;border-left:0;border-right:0;margin:0;max-width:none;box-shadow:none;}
  body.mp-in-conv .mp-catnav{display:none;}
}

/* ===========================================================================
   VIP engagement — share buttons + similar/recently-viewed strips
   =========================================================================== */
.mp-share{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px;}
.mp-share__btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--mp-line);background:#fff;border-radius:var(--mp-radius-sm);padding:8px 12px;font-size:13.5px;font-weight:600;color:var(--mp-ink)!important;cursor:pointer;text-decoration:none;transition:background .12s,border-color .12s,color .12s;}
.mp-share__btn:hover{border-color:var(--mp-primary);color:var(--mp-primary)!important;background:var(--mp-primary-050);}
.mp-share__btn.is-done{background:#e9f9ef;border-color:#c5ebd3;color:#1f9d55!important;}
.mp-share__wa:hover{border-color:#25d366;color:#128c3e!important;background:#eafaf0;}
.mp-share__fb:hover{border-color:#1877f2;color:#1877f2!important;background:#eaf2fe;}
.mp-share__tg:hover{border-color:#229ed9;color:#1c86ba!important;background:#e9f6fd;}

.mp-more{margin:24px 0 8px;}
.mp-more__h{font-size:18px;font-weight:800;margin:0 0 12px;}
.mp-hscroll{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;}
.mp-hscroll::-webkit-scrollbar{height:6px;}
.mp-hscroll::-webkit-scrollbar-thumb{background:#d7dbe0;border-radius:3px;}
.mp-mini{flex:0 0 158px;width:158px;background:var(--mp-card);border:1px solid var(--mp-line);border-radius:var(--mp-radius);overflow:hidden;text-decoration:none;box-shadow:var(--mp-shadow);scroll-snap-align:start;transition:box-shadow .15s,transform .08s;}
.mp-mini:hover{box-shadow:var(--mp-shadow-hover);transform:translateY(-2px);}
.mp-mini__img{width:100%;height:110px;background:#f0f1f3;}
.mp-mini__img img{width:100%;height:100%;object-fit:cover;}
.mp-mini__t{padding:9px 10px;font-size:13px;font-weight:600;color:var(--mp-ink);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em;}
@media (max-width:768px){ .mp-mini{flex-basis:140px;width:140px;} .mp-mini__img{height:98px;} .mp-more__h{font-size:16px;} }

/* ===========================================================================
   Ad slots — DESKTOP ONLY (hidden on mobile; little space there)
   =========================================================================== */
.mp-ad-slot{display:none;}
@media (min-width:769px){
  .mp-ad-slot{display:block;margin:20px 0;}
  .mp-ad-slot__lbl{display:block;font-size:9.5px;letter-spacing:.6px;text-transform:uppercase;color:#c3c8cf;font-weight:700;text-align:right;margin-bottom:4px;}
  .mp-ad-slot__link{display:block;border-radius:var(--mp-radius);overflow:hidden;box-shadow:0 1px 3px rgba(16,24,40,.08);transition:box-shadow .15s,transform .08s;}
  .mp-ad-slot__link:hover{box-shadow:0 8px 20px rgba(16,24,40,.14);transform:translateY(-1px);}
  .mp-ad-slot__link img{display:block;width:100%;height:auto;}
  .mp-ad-slot--infeed{margin:12px 0;}
  .mp-ad-slot--halfpage{max-width:300px;margin:0;}
}

/* ==========================================================================
   CAMPERPLAATS  — catalog/listings surface (plugins/cp)
   ========================================================================== */
.cp-hero{background:linear-gradient(135deg,#fff2f0,#ffe1dc);border-radius:var(--mp-radius);
  padding:34px 28px;margin:8px 0 22px;text-align:center;}
.cp-hero h1{margin:0 0 6px;font-size:30px;font-weight:800;color:var(--mp-primary);letter-spacing:-.5px;}
.cp-hero p{margin:0;color:var(--mp-muted);font-size:16px;}
.cp-entries{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:28px;}
.cp-entry{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--mp-border);
  border-radius:var(--mp-radius);padding:16px;text-decoration:none;transition:box-shadow .15s,transform .08s;}
.cp-entry:hover{box-shadow:0 8px 22px rgba(16,24,40,.12);transform:translateY(-2px);text-decoration:none;}
.cp-entry img{width:96px;height:72px;object-fit:cover;border-radius:10px;flex:none;}
.cp-entry b{display:block;font-size:17px;color:var(--mp-ink);}
.cp-entry span{color:var(--mp-muted);font-size:13.5px;}
.cp-section{font-size:20px;font-weight:800;color:var(--mp-ink);margin:6px 0 14px;}
.cp-catnav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px;}
.cp-catnav a{padding:7px 14px;border-radius:999px;background:#fff;border:1px solid var(--mp-border);
  color:var(--mp-ink);font-size:13.5px;font-weight:600;text-decoration:none;}
.cp-catnav a:hover{border-color:var(--mp-primary);color:var(--mp-primary);text-decoration:none;}
.cp-catnav a.is-on{background:var(--mp-primary);border-color:var(--mp-primary);color:#fff;}
/* fitment badges */
.cp-fit{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11.5px;font-weight:700;line-height:1.5;}
.cp-fit.is-fit{background:#e7f6ec;color:#1a7f3c;}
.cp-fit.is-attr{background:#fff4e5;color:#b9670a;}
.cp-fit.is-uni{background:#eef1f6;color:#5b6472;}
/* condition badge on card image */
.cp-cond{position:absolute;top:8px;left:8px;padding:3px 9px;border-radius:8px;font-size:11px;font-weight:700;
  color:#fff;background:rgba(16,24,40,.72);}
.cp-cond--new{background:#1a7f3c;}
.cp-cond--damaged{background:#b23b2e;}
.mp-listing__img{position:relative;}
/* detail page */
.cp-detailhead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:2px 0 14px;}
.cp-detailhead .mp-vip__price{margin:0;}
.cp-loc{color:var(--mp-muted);font-size:14px;}
.cp-h{font-size:16px;font-weight:800;color:var(--mp-ink);margin:22px 0 10px;}
.cp-fitlist{list-style:none;margin:0;padding:0;}
.cp-fitlist li{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:10px 12px;border:1px solid var(--mp-border);border-radius:10px;margin-bottom:8px;
  background:#fff;font-size:14.5px;font-weight:600;color:var(--mp-ink);}
.cp-fitbox{margin:4px 0;}
@media(max-width:600px){.cp-entries{grid-template-columns:1fr;}.cp-hero h1{font-size:24px;}}

