/* karea — «Πώς θα έρθετε» (χάρτης διαδρομής) */
.pk-route { margin: 3rem calc(50% - 50vw) 3.5rem; padding: 56px 16px 60px; color: #efe7d8;
	background: radial-gradient(80% 90% at 90% 0%, rgba(123, 95, 160, .45), transparent 60%), linear-gradient(160deg, #2a2046, #15101f); }
.has-sidebar .pk-route { margin-inline: 0; border-radius: 24px; }
.pk-route > * { width: min(100%, 1180px); margin-inline: auto; }
.pk-route__head { max-width: 760px; margin-bottom: 28px; }
.pk-route__head h2 { color: #fff; margin: .3em 0 .3em; }
.pk-route__head p { color: #d6cce4; margin: 0; }
.pk-route .pk-eyebrow { color: #f0d79c; }

.pk-route__box { display: grid; grid-template-columns: 1.35fr 1fr; gap: 22px; align-items: stretch; }
@media (max-width: 900px) { .pk-route__box { grid-template-columns: 1fr; } }
.pk-route__map { min-height: 440px; border-radius: 18px; overflow: hidden; border: 1px solid rgba(240, 210, 150, .3); background: #221a36; box-shadow: 0 30px 60px -30px rgba(0,0,0,.6); z-index: 0; }
@media (max-width: 600px) { .pk-route__map { min-height: 340px; } }
.pk-route__placeholder { height: 100%; min-height: inherit; display: grid; place-items: center; text-align: center; padding: 20px; font-family: var(--pk-f-ui); font-size: .85rem; color: #cbbfe0; }
.pk-route__placeholder a { color: #f0d79c; }

.pk-route__panel { display: flex; flex-direction: column; gap: 16px; }
.pk-route__form label { display: block; font-family: var(--pk-f-ui); font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: #f0d79c; margin-bottom: 8px; }
.pk-route__row { display: flex; gap: 8px; }
.pk-route__row input { flex: 1; min-width: 0; font: inherit; font-size: 1.05rem; padding: .7em .9em; border-radius: 12px; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.08); color: #fff; }
.pk-route__row input::placeholder { color: #a79db3; }
.pk-route__row .pk-btn { background: linear-gradient(135deg, #e7c26c, #b8862b); color: #1d1829; }
.pk-route__tip { font-family: var(--pk-f-ui); font-size: .76rem; color: #a79db3; margin: 8px 0 0; }
.pk-route__quick { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; }
.pk-route__quick button { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 12px; border: 1px solid rgba(240, 210, 150, .3); background: rgba(255,255,255,.06); color: #efe7d8; font-family: var(--pk-f-ui); font-size: .8rem; font-weight: 500; cursor: pointer; text-align: left; transition: background .2s, border-color .2s, transform .2s; }
.pk-route__quick button:hover { background: rgba(240, 210, 150, .16); border-color: #f0d79c; transform: translateY(-1px); }
.pk-route__quick svg { width: 18px; height: 18px; flex: none; fill: none; stroke: #f0d79c; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.pk-route__result { background: rgba(255,255,255,.07); border: 1px solid rgba(240, 210, 150, .3); border-radius: 16px; padding: 18px; animation: pk-pop .35s cubic-bezier(.2,.8,.2,1); }
.pk-route__result h3 { color: #fff; font-size: 1.3rem; margin: 0 0 12px; }
.pk-route__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
.pk-route__stats div { text-align: center; padding: 10px 6px; border-radius: 10px; background: rgba(0,0,0,.2); }
.pk-route__stats strong { display: block; font-family: var(--pk-f-display); font-weight: 400; font-size: 1.6rem; color: #f0d79c; line-height: 1.1; }
.pk-route__stats span { font-family: var(--pk-f-ui); font-size: .68rem; color: #cbbfe0; }
.pk-route__costs { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 6px; }
.pk-route__costs li { display: flex; justify-content: space-between; font-family: var(--pk-f-ui); font-size: .86rem; padding: 6px 0; border-bottom: 1px dashed rgba(255,255,255,.12); }
.pk-route__costs strong { color: #fff; }
.pk-route__line { font-family: var(--pk-f-ui); font-size: .8rem; color: #d6cce4; margin: 0 0 14px; }
.pk-route__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.pk-route__actions .pk-btn--ghost { color: #efe7d8; border-color: rgba(255,255,255,.25); }
.pk-route__actions .pk-btn--ghost:hover { background: #efe7d8; color: #1d1829; }
.pk-route__actions .is-speaking { background: #f0d79c; color: #1d1829; }
.pk-route__loading, .pk-route__err { margin: 0; font-family: var(--pk-f-ui); font-size: .88rem; }
.pk-route__err { color: #ffb4a6; }
.pk-route__err a { color: #f0d79c; }
.pk-route__note { font-family: var(--pk-f-ui); font-size: .7rem; line-height: 1.5; color: #8f84a0; margin: 0; }

/* Σημάδια στον χάρτη */
.pk-route__pin span { display: block; width: 34px; height: 34px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: linear-gradient(135deg, #e7c26c, #a2352a); border: 3px solid #fff; box-shadow: 0 6px 14px rgba(0,0,0,.35); }
.pk-route__from { display: grid !important; place-items: center; border-radius: 50%; background: #4b3869; color: #fff; font: 700 13px var(--pk-f-ui); border: 2px solid #fff; box-shadow: 0 4px 10px rgba(0,0,0,.3); }
.pk-route .leaflet-popup-content { font-family: var(--pk-f-body); font-size: 1rem; color: #1d1829; }
.pk-route .leaflet-control-attribution { font-size: 10px; }

.pk-route__qr { text-align: center; }
.pk-route__qr img { display: block; margin: 12px auto; border-radius: 12px; max-width: 100%; height: auto; background: #fff; }
