/* =========================================================
   MPD Lokale – czysty styl kart + liczniki (v1)
   - wyraźne ramki i tła
   - dopasowane do palety MPD
   - historia cen ukryta (awaryjnie)
   ========================================================= */

/* Paleta / zmienne */
:root{
  --mpd-green:    #2E6B5A;
  --mpd-green-dk: #245648;
  --mpd-orange:   #C86A3C;
  --mpd-blue:     #2E5D7B;

  --mpd-deep:     #06146B;   /* firmowy granat akcentowy */
  --mpd-text:     #0f172a;   /* główny kolor tekstu */
  --mpd-muted:    #64748b;   /* opis / secondary */
  --mpd-line:     #D1D9EC;   /* linie / obramowania */
  --mpd-head:     #F5F7FB;   /* tło nagłówka karty */
  --mpd-foot:     #F8FAFC;   /* tło stopki karty */
  --mpd-chip:     #F3F4F6;   /* chipy/etykiety */
}

/* ========== Siatka kart ========== */
.mpd-grid-cards{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}
@media (max-width:1100px){ .mpd-grid-cards{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:700px){  .mpd-grid-cards{grid-template-columns:1fr;gap:16px;} }

/* ========== Karta ========== */
.mpd-card{
  background:#fff;
  border:2px solid var(--mpd-line);
  border-radius:16px;
  box-shadow:0 8px 18px rgba(6,20,107,.07);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}

/* Pasek nagłówka */
.mpd-card__header{
  background:linear-gradient(180deg,#F5F7FB 0,#F0F4FA 100%);
  padding:14px 16px;
  border-bottom:2px solid var(--mpd-line);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.mpd-card__title{
  margin:2px 0 0;
  font-weight:800;
  font-size:18px;
  color:var(--mpd-deep);
}
/* (opcjonalnie) dwuliniowe podkreślenie tytułu
.mpd-card__title{
  text-decoration-line:underline;
  text-decoration-style:double;
  text-decoration-thickness:2px;
  text-underline-offset:5px;
  text-decoration-color:var(--mpd-deep);
}
*/
.mpd-card__subtitle{
  font-size:13px;
  color:#475569;
  text-transform:uppercase;
  letter-spacing:.02em;
}

/* Pigułki statusów – kolory bez zmian */
.mpd-badge{
  align-self:flex-start;
  display:inline-block;
  padding:2px 10px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
  border:1px solid var(--mpd-line);
  background:#fff;
}
.mpd-status-dostepny  .mpd-badge{background:#e7f8ed;color:#166534;border-color:#86efac}
.mpd-status-rezerwacja .mpd-badge{background:#fff7ed;color:#9a3412;border-color:#fdba74}
.mpd-status-sprzedany  .mpd-badge{background:#fee2e2;color:#991b1b;border-color:#fca5a5}

/* Ciało karty */
.mpd-card__body{ padding:14px 16px; }
.mpd-specs{ margin:0; padding:0; list-style:none; }
.mpd-specs li{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:6px 0;
  border-bottom:1px dashed var(--mpd-line);
  color:var(--mpd-text);
  font-size:14px;
}
.mpd-specs li:last-child{ border-bottom:0; }
.mpd-specs strong{ color:#0f172a; }

/* Rozkład – delikatny panel */
.mpd-uklad{
  margin-top:10px;
  background:#FAFCFF;
  border:1px dashed var(--mpd-line);
  border-radius:12px;
  padding:10px 12px;
}
.mpd-uklad h4{ margin:0 0 6px; font-size:14px; font-weight:800; color:var(--mpd-deep); }
.mpd-uklad-list{ margin:0; padding-left:18px; }
.mpd-uklad-list li{ margin:2px 0; }

/* Stopka z ceną */
.mpd-card__footer{
  background:var(--mpd-foot);
  border-top:2px solid var(--mpd-line);
  padding:12px 16px;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.mpd-price{ font-weight:800; font-size:20px; color:var(--mpd-text); }
.mpd-vat-note{ font-size:12px; color:var(--mpd-muted); }

/* ========== Liczniki (Dostępne / Rezerwacje / Sprzedane / Razem) ========== */
.mpd-status-wrap{
  display:grid;
  grid-template-columns:repeat(4,minmax(140px,1fr));
  gap:14px;
  margin:10px 0 6px;
}
.mpd-status-item{
  background:#fff;
  border:1px solid var(--mpd-line);
  border-radius:12px;
  padding:12px;
  text-align:center;
}
.mpd-status-item .mpd-status-label{display:block;font-size:13px;color:#6b7280;margin-bottom:6px}
.mpd-status-item .mpd-status-value{font-size:28px;font-weight:800;color:#0B1D5A}
.mpd-status-item.mpd-status-total{background:#ECF7F1;border-color:#cfe8df}
@media(max-width:860px){.mpd-status-wrap{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.mpd-status-wrap{grid-template-columns:1fr}}

/* ========== Dodatki (DFG + przyciski PDF) ========== */
.mpd-extra{
  padding:12px 16px;
  border-top:1px solid var(--mpd-line);
  background:#fff;
}
.mpd-extra .dfg{
  margin:6px 0 10px;
  background:#EEF2FF;
  border:1px dashed #C7D2FE;
  border-radius:10px;
  padding:8px 10px;
  font-size:13px;
}
.mpd-extra .btns{ display:flex; flex-wrap:wrap; gap:10px; }
.mpd-extra .btn{
  display:inline-block;
  padding:8px 12px;
  border-radius:10px;
  border:1px solid var(--mpd-line);
  background:#fff;
  text-decoration:none;
  font-weight:700;
  font-size:14px;
  color:var(--mpd-text);
  transition:.15s ease;
}
.mpd-extra .btn:hover{ transform:translateY(-1px); box-shadow:0 1px 4px rgba(6,20,107,.08); }
.mpd-extra .btn.primary{ background:var(--mpd-deep); color:#fff; border-color:#0b1260; }

/* (Awaryjnie) ukryj rozwijaną „Historię zmian ceny”, jeśli gdzieś jeszcze się pojawi */
.mpd-extra details{ display:none !important; }
/* płynny scroll do kotwic */
html{scroll-behavior:smooth}

/* żeby karta nie chowała się pod sticky headerem (jeśli jest) */
.mpd-card{position:relative;scroll-margin-top:90px}

/* PODŚWIETLENIE po przejściu do kotwicy (#lokal-123) */
.mpd-card:target{
  border-color:#0B1D5A;
  box-shadow:0 0 0 3px rgba(11,29,90,.15), 0 12px 24px rgba(6,20,107,.18);
  animation:mpdFlash 2.2s ease-out 1;
}
@keyframes mpdFlash{
  0%   { background:#FFFBEA; }
  100% { background:#fff; }
}