/* =========================================================
   OTOMOTO MARKETPLACE – DARK LISTING
   ========================================================= */

:root{
  --ot-bg:#0B0F16;
  --ot-bg-2:#0F1522;
  --ot-card:#121826;
  --ot-card-2:#161D2E;
  --ot-line:rgba(255,255,255,0.08);
  --ot-line-strong:rgba(255,255,255,0.12);
  --ot-text:#F3F6FB;
  --ot-muted:#8FA1C3;
  --ot-accent:#FFD000;
  --ot-accent-hover:#FFDF3A;
  --ot-accent-2:#0E7ACF;
  --ot-radius:20px;
  --ot-radius-sm:14px;
  --ot-shadow:0 18px 48px rgba(0,0,0,.36);
  --ui-card: #1a202f;
}

/* =========================================================
   TŁO STRONY / SEKCJI
   ========================================================= */

body.post-type-archive-otomoto_vehicle,
body.post-type-archive-otomoto_vehicle #page-container,
body.post-type-archive-otomoto_vehicle #main-content{
  background:var(--ot-bg) !important;
  color:var(--ot-text);
}

/* jeśli listing jest na zwykłej stronie z shortcode */
.otomoto-marketplace{
  max-width:1320px;
  margin:0 auto;
  padding:34px 20px 70px;
  color:var(--ot-text);
}

/* zabezpieczenie pod linki / teksty z Divi */
.otomoto-marketplace,
.otomoto-marketplace p,
.otomoto-marketplace h1,
.otomoto-marketplace h2,
.otomoto-marketplace h3,
.otomoto-marketplace h4,
.otomoto-marketplace label,
.otomoto-marketplace span,
.otomoto-marketplace a{
  color:inherit;
}

/* =========================================================
   FILTRY
   ========================================================= */

.otomoto-filters{
  background:linear-gradient(180deg, rgba(18,24,38,.92), rgba(10,14,22,.98));
  border:1px solid var(--ot-line);
  border-radius:24px;
  padding:22px;
  margin-bottom:30px;
  box-shadow:0 20px 50px rgba(0,0,0,.35);
}

.otomoto-filters-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(180px, 1fr));
  gap:18px;
}

/* ważne: bez białych boxów */
.otomoto-filter{
  background:transparent !important;
  border:none !important;
  padding:0 !important;
  margin:0 !important;
  box-shadow:none !important;
}

.otomoto-filter label{
  display:block;
  margin:0 0 8px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:var(--ot-muted);
}

.otomoto-filter select,
.otomoto-filter input{
  width:100%;
  height:54px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:#141B2B;
  color:var(--ot-text);
  padding:0 16px;
  outline:none;
  box-shadow:none;
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease;
  -webkit-appearance:none;
  appearance:none;
}

.otomoto-filter select:focus,
.otomoto-filter input:focus{
  border-color:rgba(255,208,0,.35);
  box-shadow:0 0 0 3px rgba(255,208,0,.08);
  background:#172033;
}

.otomoto-filter input::placeholder{
  color:#6D7A92;
}

/* select arrow */
.otomoto-filter select{
  background-image:
    linear-gradient(45deg, transparent 50%, #c7d0de 50%),
    linear-gradient(135deg, #c7d0de 50%, transparent 50%);
  background-position:
    calc(100% - 20px) calc(50% - 2px),
    calc(100% - 14px) calc(50% - 2px);
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
  padding-right:40px;
}

.otomoto-filters-actions{
  display:flex;
  gap:12px;
  margin-top:20px;
  align-items:center;
}

/* =========================================================
   BUTTONY
   ========================================================= */

.otomoto-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:0 20px;
  border-radius:16px;
  text-decoration:none !important;
  font-weight:800;
  border:none;
  cursor:pointer;
  transition:transform .15s ease, opacity .15s ease, background .15s ease, border-color .15s ease;
}

.otomoto-btn:hover{
  transform:translateY(-1px);
}

.otomoto-btn-primary{
  background:var(--ot-accent-2);
  color:#fff !important;
}

.otomoto-btn-primary:hover{
  background:#1187e4;
  color:#fff !important;
}

.otomoto-btn-secondary{
  background:transparent;
  color:var(--ot-accent) !important;
  border:1px solid rgba(255,255,255,.10);
}

.otomoto-btn-secondary:hover{
  background:rgba(255,255,255,.03);
  color:var(--ot-accent) !important;
}

/* =========================================================
   GRID
   ========================================================= */

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

/* =========================================================
   KARTA
   ========================================================= */


/* FIX konfliktu starych kart */
.otomoto-card{
  background: linear-gradient(180deg, rgb(42 56 81), rgba(8, 12, 20, 1)) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 22px !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.36) !important;
  overflow: hidden !important;
  transition: transform .18s ease, box-shadow .18s ease;
}

.otomoto-card-body{
  background: transparent !important;
}
/* =========================================================
   ZDJĘCIE
   ========================================================= */

.otomoto-card-image{
  position:relative;
  aspect-ratio:16 / 10;
  background:#0f1522;
  overflow:hidden;
}

.otomoto-card-image-link{
  display:block;
  width:100%;
  height:100%;
  text-decoration:none;
}

.otomoto-card-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .35s ease;
}

.otomoto-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 30px 70px rgba(0,0,0,.45);
}

.otomoto-card:hover .otomoto-card-image img{
  transform:scale(1.04);
}

.otomoto-card-image::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom, rgba(0,0,0,0) 62%, rgba(0,0,0,.46) 100%);
  pointer-events:none;
}

.otomoto-card-placeholder{
  width:100%;
  height:100%;
  background:linear-gradient(135deg, #141b2a, #1a2234);
}

/* opcjonalny badge */
.otomoto-badge{
  position:absolute;
  top:14px;
  left:14px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  height:28px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(11,15,22,.82);
  border:1px solid rgba(255,255,255,.10);
  color:#fff;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

/* =========================================================
   TREŚĆ KARTY
   ========================================================= */

.otomoto-card-body{
  padding:20px 20px 22px;
}

.otomoto-card-title{
  margin:0 0 10px;
  font-size:17px;
  line-height:1.25;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--ot-text);
}

.otomoto-card-title a{
  color:var(--ot-text) !important;
  text-decoration:none !important;
}

.otomoto-card-title a:hover{
  color:#ffffff !important;
}

.otomoto-card-price{
  font-size:22px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.02em;
  color:var(--ot-accent);
  margin-bottom:14px;
}

.otomoto-card-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 16px;
  color:var(--ot-muted);
  font-size:13px;
  margin-bottom:16px;
}

.otomoto-card-meta span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  opacity:.92;
  letter-spacing:.01em;
}

.otomoto-card-actions{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
}

.otomoto-card-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 18px;
  border-radius:14px;
  background:var(--ot-accent);
  color:#0B0F16 !important;
  text-decoration:none !important;
  font-weight:900;
  border:none;
  transition:background .18s ease, transform .15s ease;
}

.otomoto-card-btn:hover{
  background:var(--ot-accent-hover);
  color:#0B0F16 !important;
  transform:translateY(-1px);
}

.otomoto-card-link{
  color:var(--ot-accent) !important;
  text-decoration:none !important;
  font-weight:800;
  letter-spacing:.01em;
}

.otomoto-card-link:hover{
  color:var(--ot-accent-hover) !important;
}

/* =========================================================
   EMPTY / PAGINATION / LOAD MORE
   ========================================================= */

.otomoto-card.loading{
  background: linear-gradient(90deg,#1a2234,#202b44,#1a2234);
  background-size:200% 100%;
  animation: shimmer 1.2s infinite;
}

@keyframes shimmer{
  0%{background-position:200% 0}
  100%{background-position:-200% 0}
}

.otomoto-empty{
  grid-column:1/-1;
  padding:30px;
  border:1px solid var(--ot-line);
  border-radius:20px;
  background:var(--ot-card);
  color:var(--ot-muted);
}

.otomoto-pagination{
  margin-top:32px;
  text-align:center;
}

.otomoto-pagination .page-numbers{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:42px;
  height:42px;
  margin:0 4px;
  padding:0 12px;
  border-radius:999px;
  text-decoration:none !important;
  color:var(--ot-text) !important;
  background:#161D2E;
  border:1px solid var(--ot-line);
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}

.otomoto-pagination .page-numbers:hover{
  background:#1b2538;
  color:#fff !important;
}

.otomoto-pagination .page-numbers.current{
  background:var(--ot-accent-2);
  color:#fff !important;
  border-color:transparent;
}

.otomoto-loadmore-wrap{
  text-align:center;
  margin-top:30px;
}

/* =========================================================
   DODATKOWE OGRANICZENIA POD DIVI
   ========================================================= */

.otomoto-marketplace .et_pb_module,
.otomoto-marketplace .et_pb_text,
.otomoto-marketplace .et_pb_code{
  margin-bottom:0;
}

.otomoto-marketplace input,
.otomoto-marketplace select,
.otomoto-marketplace button{
  font-family:inherit;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

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

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

@media (max-width:767px){
  .otomoto-marketplace{
    padding:24px 14px 48px;
  }

  .otomoto-grid{
    grid-template-columns:1fr;
    gap:18px;
  }

  .otomoto-filters{
    padding:18px;
    border-radius:18px;
  }

  .otomoto-filters-grid{
    grid-template-columns:1fr;
    gap:14px;
  }

  .otomoto-filters-actions{
    flex-direction:column;
    align-items:stretch;
  }

  .otomoto-btn,
  .otomoto-card-btn{
    width:100%;
  }

  .otomoto-card-actions{
    flex-direction:column;
    align-items:stretch;
  }

  .otomoto-card-title{
    font-size:18px;
  }

  .otomoto-card-price{
    font-size:24px;
  }
}