/* MAPA */
#lok-map { width: 100%; height: 420px; margin-top: 16px; border: 1px solid #e6e6e6; border-radius: 6px; }

#lok-map{ font-family: "Open Sans"}

/* NAGŁÓWKI, FORMULARZ – jak wcześniej */
.lok-new .lok-title { text-align:center; color:#17A144; margin: 0 0 26px; font-weight: 300; }
.lok-new .lok-sub   { text-align:center; margin: 0 0 16px; color:#212529; font-size: 16px; }
.lok-form { display:block; margin-top: 30px; }
#lok-input { width:100%; height:48px; padding:0 16px; border:0px solid #d8d8d8; border-radius:0px; font-size:16px; background-color: #F5F5F5; text-align: center; outline: none !important }
.lok-inline { display:flex; gap:16px; margin:12px 0; flex-wrap:wrap; }
.lok-select { display:flex; align-items:center; gap:10px; }
.lok-select label { font-size:16px; color:#17A144; letter-spacing:.5px; text-transform:uppercase; }
.lok-inline {
    justify-content: center;
	margin: 35px 0;
}
.lok-select label {
    position: relative;
    width: 100%;
	max-width: fit-content;
}
.lok-select select { height:48px; padding:0 12px; border: 0px solid #d8d8d8; border-radius:0px;  background-color: #F5F5F5 }
.lok-btn { background: #EF9716;
    color: #fff;
    border: 0;
    padding: 16px 104px;
    border-radius: 0;
    cursor: pointer; }

.lok-btn:hover, .lok-btn:active, .lok-btn:focus{
background: #17A144;
	 border: 0;
	outline: none !important;
}

.lok-btn-wrap{
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  column-gap: 16px;
  width:100%;
	margin-bottom: 45px;
}

#lok-search{
  grid-column:2;
  justify-self:center;
}

#lok-clear{
  grid-column:3;
  justify-self:end;
}

a.lok-hover-route {
    color: #fff !important;
	font-size: 20px;
	font-weight: 400;
}

a.lok-hover-route {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
}

a.lok-hover-route svg {
    display: block;
    width: 100%;
	margin-top: 20px;
}

/* opcjonalnie: na bardzo wąskich ekranach pod przyciskiem */
@media (max-width: 480px){
  .lok-btn-wrap{
    grid-template-columns: 1fr;
    row-gap: 12px;
  }
  #lok-search{ grid-column:1; justify-self:center; }
  #lok-clear{ grid-column:1; justify-self:end; }
}

.lok-btn.ghost { background:transparent; color:#17A144; border:none; }
.lok-link {     background: transparent;
    color: #17A144;
stroke: #17A144;
    border: 0;
    margin-left: 12px;
    padding: 12px 0;
    cursor: pointer;
    text-decoration: none;
    display: flex
;
    align-content: center;
 }


.lok-link:hover, .lok-link:focus, .lok-link:active  {     background: transparent;
    color: #EF9716;
stroke: #EF9716;
    border: 0 !important;
    margin-left: 12px;
    padding: 12px 0;
    cursor: pointer;
    text-decoration: none;
    display: flex
;
    align-content: center;
	outline: none !important;
 }

.lok-inline select:active, .lok-inline select:focus, .lok-inline select:hover{
		outline: none !important;

}


/* GRID */
.lok-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:16px; margin:16px 0 20px; }
@media (max-width: 1024px) { .lok-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .lok-grid { grid-template-columns: 1fr; } }
.lok-col { display:block; }

/* KARTA */
.lok-card {
  position: relative;
  border: 1px solid #17A144;
  border-radius: 0px;
  padding: 24px;
  background: #fff;
  overflow: hidden;
  transition: box-shadow .15s ease, transform .15s ease;
}


.lok-card {
    height: 100%;
}

.lok-city {
    font-size: 16px;
}

.lok-addr svg, .lok-km svg{
margin-right: 7px;
}

.lok-km, .lok-addr {
    display: flex;
    align-content: center;
}

.lok-card:hover { box-shadow: 0 6px 18px rgba(0,0,0,.08); transform: translateY(-1px); }

.lok-card-hd { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:6px; }
.lok-city { font-weight:700; color:#1a1a1a; }
.lok-km   { font-size:16px; color:#212529; }
.lok-addr { font-size:16px; margin-bottom:6px; color:#212529; }
.lok-desc { font-size:12px; color:#212529; }

/* Fallback guzik dla urządzeń dotykowych */
.lok-route { display:none; margin-top:10px; color:#fff; background:#17A144; padding:10px 12px; border-radius:0px; text-decoration:none; }
@media (hover:none) {
  .lok-route { display:inline-block; }
}

/* OVERLAY NA HOVER */
.lok-hover-route {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #00a13d;
  color: #fff;
  font-weight: 700;
  letter-spacing: .6px;
  text-decoration: none;
  font-size: 18px;
  opacity: 0;
  transition: opacity .18s ease;
}
.lok-card:hover .lok-hover-route { opacity: 1; }

/* Strzałka – mała ikonka SVG jako pseudo-zastępnik */
.lok-hover-route .lok-arrow {
  display:inline-block; width:24px; height:24px; margin-left:10px;
  background: no-repeat center / contain;
  background-image: url("data:image/svg+xml;utf8,<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12h14M13 5l7 7-7 7'/></svg>");
}

/* „Pokaż więcej” */
.lok-loadmore-wrap { display:flex; justify-content:center; margin-bottom:24px; }
