.vallokalskarta {
  --vk-accent: #ed1c24;
  --vk-accent-dark: #c8161d;
  --vk-advance: #b3131a;
  --vk-advance-dark: #8f0f15;
  --vk-surface: #f8f4e9;
  position: relative;
  isolation: isolate;
  width: 100%;
  height: var(--vallokalskarta-height, 680px);
  min-height: 420px;
  overflow: hidden;
  border-radius: 10px;
  background: #e7ecef;
  color: #17212b;
  font-family: inherit;
}
.vallokalskarta--cover { min-height: var(--vallokalskarta-min-height, 560px); }

.vallokalskarta *, .vallokalskarta *::before, .vallokalskarta *::after { box-sizing: border-box; }
.vallokalskarta__map-stage { position: absolute; z-index: 1; inset: 0; overflow: hidden; border-radius: 10px; background: #e7ecef; }
.vallokalskarta__map { position: absolute; inset: 0; z-index: 1; border-radius: 10px; }
.vallokalskarta .leaflet-container { font-family: inherit; background: #e7ecef; }
.vallokalskarta .leaflet-control-zoom a { color: #17212b; text-decoration: none; }
.vallokalskarta .leaflet-top.leaflet-right { top: 14px; right: 14px; }
.vallokalskarta .leaflet-right .leaflet-control { margin-right: 0; }
.vallokalskarta .leaflet-control-zoom, .vallokalskarta .vallokalskarta-locate-control { border: 2px solid rgba(0, 0, 0, .2); border-radius: 4px; box-shadow: none; }
.vallokalskarta-map-locate { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 2px; background: #fff; color: #363636; cursor: pointer; }
.vallokalskarta-map-locate:hover, .vallokalskarta-map-locate:focus { background: #f4f4f4; color: #ed1c24; }
.vallokalskarta-map-locate svg { display: block; }

.vallokalskarta__panel {
  position: absolute;
  z-index: 700;
  top: 24px;
  left: 24px;
  width: min(420px, calc(100% - 48px));
  max-height: calc(100% - 48px);
  overflow: auto;
  padding: 20px;
  border: 1px solid rgba(0, 0, 0, .06);
  border-radius: 22px;
  background: var(--vk-surface);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .18);
}

.vallokalskarta__panel-heading { position: relative; display: block; padding: 2px 42px 0; text-align: center; }
.vallokalskarta__panel h2 { margin: 0; color: #202020; font-size: 23px; font-weight: 700; line-height: 1.2; }
.vallokalskarta__status { margin: 5px 0 18px; color: #5d5a53; font-size: .82rem; }
.vallokalskarta--planning .vallokalskarta__status { display: none; }
.vallokalskarta__panel-toggle { position: absolute; top: -3px; right: -2px; width: 34px; min-height: 34px; padding: 0; border: 1px solid rgba(0,0,0,.18); border-radius: 50%; background: transparent; line-height: 30px; }
.vallokalskarta__panel-toggle:focus-visible { outline: 2px solid var(--vk-accent); outline-offset: 2px; }
.vallokalskarta__panel-toggle-label { display: none; }
.vallokalskarta__panel-toggle-icon { display: inline; }
.vallokalskarta__modes { display: grid; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); margin: 0 0 16px; padding: 3px; border-radius: 999px; background: rgba(237, 28, 36, .12); }
.vallokalskarta__modes button { min-height: 36px; padding: 5px 8px; border: 0; border-radius: 999px; background: transparent; color: #7d171c; font: inherit; font-size: .78rem; font-weight: 700; cursor: pointer; }
.vallokalskarta__modes button[aria-pressed="true"] { background: var(--vk-accent); color: #fff; box-shadow: 0 2px 8px rgba(136, 8, 14, .18); }
.vallokalskarta__modes button:focus-visible { outline: 2px solid var(--vk-accent); outline-offset: 1px; }
.vallokalskarta__label { display: block; margin: 0 0 5px; color: #263743; font-size: .78rem; font-weight: 700; letter-spacing: .025em; }
.vallokalskarta__search, .vallokalskarta__address, .vallokalskarta__filters select,
.vallokalskarta__planner select {
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border: 1px solid #b9c4cc;
  border-radius: 999px;
  background: #fff;
  color: #17212b;
  font: inherit;
}
.vallokalskarta__search:focus, .vallokalskarta__address:focus, .vallokalskarta__filters select:focus,
.vallokalskarta__planner select:focus { outline: 2px solid rgba(237, 28, 36, .2); border-color: var(--vk-accent); }
.vallokalskarta__address-form { margin-bottom: 15px; }
.vallokalskarta__address-row { display: grid; grid-template-columns: 1fr auto; gap: 7px; }
.vallokalskarta__address-row button { min-height: 42px; padding: 0 16px; border: 0; border-radius: 999px; background: var(--vk-accent); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.vallokalskarta__address-row button:hover { background: var(--vk-accent-dark); }
.vallokalskarta__address-row button:disabled { cursor: wait; opacity: .7; }
.vallokalskarta__address-help { margin: 6px 4px 0; color: #5d6870; font-size: .72rem; line-height: 1.35; }
.vallokalskarta__address-results { margin-top: 7px; padding: 7px; border: 1px solid #d5d0c4; border-radius: 12px; background: #fff; color: #43535e; font-size: .78rem; }
.vallokalskarta__address-results[hidden] { display: none; }
.vallokalskarta__address-results ul { margin: 0; padding: 0; list-style: none; }
.vallokalskarta__address-results li + li { border-top: 1px solid #ece8df; }
.vallokalskarta__address-results button { width: 100%; padding: 8px 6px; border: 0; background: transparent; color: #17212b; font: inherit; line-height: 1.3; text-align: left; cursor: pointer; }
.vallokalskarta__address-results button:hover, .vallokalskarta__address-results button:focus-visible { color: var(--vk-accent); }
.vallokalskarta__filters { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 13px 0; }
.vallokalskarta__restricted { display: flex; align-items: flex-start; gap: 8px; margin: -2px 0 13px; color: #43535e; font-size: .8rem; line-height: 1.35; cursor: pointer; }
.vallokalskarta__restricted[hidden] { display: none; }
.vallokalskarta__restricted input { flex: 0 0 auto; margin-top: 2px; }
.vallokalskarta__locate {
  width: 100%;
  min-height: 43px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  background: var(--vk-accent);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.vallokalskarta__locate:hover { background: var(--vk-accent-dark); }
.vallokalskarta__locate:focus-visible { outline: 3px solid rgba(237, 28, 36, .25); outline-offset: 2px; }
.vallokalskarta__locate:disabled { cursor: wait; opacity: .7; }
.vallokalskarta__advanced { margin: 13px 0 0; border-top: 1px solid rgba(93, 90, 83, .2); }
.vallokalskarta__advanced summary { position: relative; padding: 13px 34px 2px 2px; color: #263743; font-size: .82rem; font-weight: 700; cursor: pointer; list-style: none; }
.vallokalskarta__advanced summary::-webkit-details-marker { display: none; }
.vallokalskarta__advanced summary::after { position: absolute; top: 9px; right: 2px; display: grid; place-items: center; width: 24px; height: 24px; border: 1px solid rgba(0, 0, 0, .18); border-radius: 50%; content: '+'; font-size: 17px; font-weight: 500; line-height: 1; }
.vallokalskarta__advanced[open] summary::after { content: '−'; }
.vallokalskarta__advanced summary:focus-visible { outline: 2px solid var(--vk-accent); outline-offset: 2px; border-radius: 4px; }
.vallokalskarta__advanced-content { padding-top: 13px; }

.vallokalskarta__nearest { display: grid; gap: 2px; margin-top: 14px; padding: 13px 14px; border-left: 4px solid var(--vk-accent); border-radius: 10px; background: #fffefa; }
.vallokalskarta__nearest[hidden] { display: none; }
.vallokalskarta__nearest-label { color: #52616d; font-size: .75rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.vallokalskarta__nearest-warning { margin: 5px 0 1px; color: #5e584f; font-size: .76rem; line-height: 1.4; }
.vallokalskarta__nearest strong { font-size: 1.05rem; }
.vallokalskarta__nearest-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 5px; }
.vallokalskarta__nearest button { padding: 0; border: 0; background: none; color: var(--vk-accent); font: inherit; font-weight: 700; cursor: pointer; text-decoration: underline; }

.vallokalskarta--panel-collapsed .vallokalskarta__panel { width: auto; padding: 10px; overflow: hidden; }
.vallokalskarta--panel-collapsed .vallokalskarta__panel-heading { width: 34px; height: 34px; padding: 0; }
.vallokalskarta--panel-collapsed .vallokalskarta__panel-toggle { top: 0; right: 0; }
.vallokalskarta--panel-collapsed .vallokalskarta__panel-heading > div,
.vallokalskarta--panel-collapsed .vallokalskarta__panel-body { display: none; }

.vallokalskarta__loading { position: absolute; z-index: 650; inset: 50% auto auto 50%; transform: translate(-50%, -50%); padding: 12px 18px; border-radius: 7px; background: rgba(255,255,255,.95); box-shadow: 0 5px 18px rgba(0,0,0,.15); }
.vallokalskarta__loading[hidden] { display: none; }
.vallokalskarta__loading--error { width: min(420px, calc(100% - 40px)); color: #a51d24; text-align: center; }
.vallokalskarta__info { position: absolute; z-index: 660; right: 14px; bottom: 24px; }
.vallokalskarta__info-toggle { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 2px solid rgba(0, 0, 0, .2); border-radius: 4px; background: #fff; color: #363636; box-shadow: none; font: inherit; font-size: 17px; font-weight: 800; line-height: 1; cursor: pointer; }
.vallokalskarta__info-toggle:hover, .vallokalskarta__info-toggle:focus-visible, .vallokalskarta__info-toggle[aria-expanded="true"] { background: #f4f4f4; color: var(--vk-accent); }
.vallokalskarta__info-toggle:focus-visible { outline: 2px solid var(--vk-accent); outline-offset: 2px; }
.vallokalskarta__info-panel { position: absolute; right: 0; bottom: 40px; width: min(310px, calc(100vw - 48px)); padding: 11px 13px; border: 1px solid rgba(0, 0, 0, .14); border-radius: 9px; background: rgba(255, 255, 255, .97); color: #34444f; box-shadow: 0 8px 24px rgba(0, 0, 0, .16); font-size: 11px; line-height: 1.4; }
.vallokalskarta__info-panel[hidden] { display: none; }
.vallokalskarta__info-panel p { margin: 0; }
.vallokalskarta__info-panel p + p { margin-top: 5px; }
.vallokalskarta__info-panel a { color: inherit; text-decoration: underline; }
.vallokalskarta-error { padding: 18px; border-left: 4px solid #d4351c; background: #fff0f0; color: #7d1711; }

.vallokalskarta-marker-wrap { background: none; border: 0; }
.vallokalskarta-marker { display: block; position: relative; width: 24px; height: 24px; border: 3px solid #fff; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: var(--vk-accent); box-shadow: 0 2px 7px rgba(0,0,0,.32); }
.vallokalskarta-marker::after { content: ''; position: absolute; width: 6px; height: 6px; top: 6px; left: 6px; border-radius: 50%; background: #fff; }
.vallokalskarta-marker--advance { background: var(--vk-advance); }
.vallokalskarta-marker--restricted { background: #a64b00; }
.vallokalskarta-cluster { display: grid; place-items: center; border: 4px solid rgba(237,28,36,.24); border-radius: 50%; background: rgba(237,28,36,.92); color: #fff; font-weight: 700; box-shadow: 0 2px 8px rgba(0,0,0,.22); }
.vallokalskarta-cluster--advance { border-color: rgba(179,19,26,.24); background: rgba(179,19,26,.94); }
.vallokalskarta-cluster--mixed { border-color: rgba(105,10,15,.25); background: rgba(130,13,19,.94); }
.vallokalskarta-cluster--medium { width: 46px !important; height: 46px !important; margin: -2px 0 0 -2px !important; }
.vallokalskarta-cluster--large { width: 52px !important; height: 52px !important; margin: -5px 0 0 -5px !important; }
.vallokalskarta-user { stroke: #fff; stroke-width: 3; fill: #e31837; filter: drop-shadow(0 1px 4px rgba(0,0,0,.4)); }
.vallokalskarta-accuracy { stroke: #005293; stroke-width: 1; fill: #3a91cf; fill-opacity: .14; }
.vallokalskarta-popup h3 { margin: 0 0 8px; font-size: 1.05rem; }
.vallokalskarta-popup p { margin: 4px 0; line-height: 1.4; }
.vallokalskarta-popup__type { display: inline-block; margin: 0 0 6px; padding: 2px 7px; border-radius: 99px; background: rgba(237,28,36,.12); color: var(--vk-accent-dark); font-size: .7rem; font-weight: 700; text-transform: uppercase; }
.vallokalskarta-popup__type--advance { background: rgba(179,19,26,.12); color: var(--vk-advance-dark); }
.vallokalskarta-popup__warning { padding: 7px 9px; border-left: 3px solid #a64b00; background: #fff3e8; color: #713400; font-weight: 600; }
.vallokalskarta-popup__hours { margin-top: 8px; }
.vallokalskarta-popup__hours summary { color: var(--vk-accent); font-weight: 700; cursor: pointer; }
.vallokalskarta-popup__hours dl { display: grid; grid-template-columns: 1fr auto; gap: 3px 14px; max-height: 190px; margin: 8px 0 0; padding: 8px; overflow: auto; background: #f4f7f8; }
.vallokalskarta-popup__hours dt, .vallokalskarta-popup__hours dd { margin: 0; }
.vallokalskarta-popup__hours dt { text-transform: capitalize; }
.vallokalskarta-popup__plan { width: 100%; min-height: 38px; margin-top: 12px; border: 0; border-radius: 999px; background: var(--vk-accent); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }

.vallokalskarta__flow-view[hidden] { display: none; }
.vallokalskarta__planner { margin: 0; }
.vallokalskarta__planner[hidden] { display: none; }
.vallokalskarta__planner h3 { margin: 17px 0 9px; font-size: 1rem; }
.vallokalskarta__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin: 0 0 18px; padding: 0 3px 15px; border-bottom: 1px solid #d8d2c6; counter-reset: vk-step; list-style: none; }
.vallokalskarta__steps li { position: relative; padding-top: 26px; color: #77736c; font-size: .7rem; font-weight: 700; text-align: center; counter-increment: vk-step; }
.vallokalskarta__steps li::before { content: counter(vk-step); position: absolute; top: 0; left: 50%; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; transform: translateX(-50%); background: #ddd7ca; color: #5b5750; }
.vallokalskarta__steps li:not(:last-child)::after { content: ''; position: absolute; z-index: -1; top: 10px; left: calc(50% + 12px); width: calc(100% - 20px); height: 2px; background: #ddd7ca; }
.vallokalskarta__steps li.is-active, .vallokalskarta__steps li.is-complete { color: var(--vk-accent-dark); }
.vallokalskarta__steps li.is-active::before, .vallokalskarta__steps li.is-complete::before { background: var(--vk-accent); color: #fff; }
.vallokalskarta__steps li.is-complete::after { background: var(--vk-accent); }
.vallokalskarta__step-intro { margin: 0 0 8px; color: #5d5a53; font-size: .76rem; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.vallokalskarta__planner-place { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; margin-bottom: 17px; padding: 14px 15px; border-left: 4px solid var(--vk-accent); border-radius: 12px; background: #fffefa; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.vallokalskarta__planner-place[hidden] { display: none; }
.vallokalskarta__planner-type { grid-column: 1 / -1; color: #52616d; font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.vallokalskarta__planner-place strong { grid-column: 1 / -1; font-size: 1.05rem; }
.vallokalskarta__planner-place > span:not(.vallokalskarta__planner-type) { grid-column: 1; color: #4e555a; font-size: .82rem; }
.vallokalskarta__planner-map-button { grid-column: 2; grid-row: 3; align-self:center; padding: 3px 0; border: 0; background: transparent; color: var(--vk-accent-dark); font: inherit; font-size: .74rem; font-weight: 700; text-decoration: underline; cursor: pointer; }
.vallokalskarta__planner-map-button:hover, .vallokalskarta__planner-map-button:focus-visible { color: #7d171c; text-decoration-thickness: 2px; }
.vallokalskarta__planner-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.vallokalskarta__planner-note { margin: 12px 0; padding: 9px 11px; border-radius: 9px; background: rgba(237, 28, 36, .08); color: #593638; font-size: .78rem; line-height: 1.4; }
.vallokalskarta__planner-validation { min-height: 1.2em; margin: 0 2px 8px; color: #a30f15; font-size: .75rem; font-weight: 600; }
.vallokalskarta__planner-actions { display: flex; justify-content: space-between; gap: 9px; margin-top: 5px; }
.vallokalskarta__planner-actions .uk-button { min-height: 42px; padding: 0 17px; border-radius: 999px; font: inherit; font-size: .78rem; font-weight: 700; text-transform: none; }
.vallokalskarta__planner-actions .uk-button-primary { border: 1px solid var(--vk-accent); background: var(--vk-accent); color: #fff; }
.vallokalskarta__planner-actions .uk-button-primary:hover, .vallokalskarta__planner-actions .uk-button-primary:focus-visible { background: var(--vk-accent-dark); color: #fff; }
.vallokalskarta__planner-actions .uk-button-primary:disabled { border-color: #c8c3b9; background: #d8d4ca; color: #746f67; cursor: not-allowed; }
.vallokalskarta__planner-actions .uk-button-default { border: 1px solid #bdb7ac; background: #fff; color: #3f3c37; }
.vallokalskarta__planner-actions--final { justify-content: flex-start; margin-top: 14px; }
.vallokalskarta__planner-summary { margin-bottom: 15px; padding: 14px 15px; border-radius: 12px; background: #fffefa; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.vallokalskarta__planner-summary dl { display: grid; grid-template-columns: minmax(68px, auto) 1fr; gap: 6px 12px; margin: 0; }
.vallokalskarta__planner-summary dt { color: #5d5a53; font-size: .74rem; font-weight: 700; }
.vallokalskarta__planner-summary dd { margin: 0; color: #202020; font-size: .82rem; font-weight: 600; }
.vallokalskarta__planner-summary .vallokalskarta__planner-note { margin-bottom: 0; }
.vallokalskarta__planner-reminder-field { margin: 0 0 14px; }
.vallokalskarta__calendar { padding-top: 13px; border-top: 1px solid #d8d2c6; }
.vallokalskarta__calendar[hidden] { display: none; }
.vallokalskarta__calendar-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.vallokalskarta__calendar-buttons a { display: flex; align-items: center; justify-content: center; min-height: 39px; padding: 6px 9px; border: 1px solid var(--vk-accent); border-radius: 999px; color: var(--vk-accent-dark); font-size: .77rem; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none; }
.vallokalskarta__calendar-buttons a:hover { background: var(--vk-accent); color: #fff; }
.vallokalskarta__calendar-buttons a:last-child { grid-column: 1 / -1; background: var(--vk-accent); color: #fff; }
.vallokalskarta__calendar > p { margin: 8px 2px 0; color: #666159; font-size: .7rem; line-height: 1.35; }

html.vallokalskarta-confirmation-open, html.vallokalskarta-confirmation-open body { overflow: hidden !important; }
.vallokalskarta--confirmation-open { z-index: 2147483000; }
.vallokalskarta__calendar-confirmation { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 24px; background: rgba(18, 25, 31, .48); }
.vallokalskarta__calendar-confirmation[hidden] { display: none; }
.vallokalskarta__celebration-canvas { position: fixed; z-index: 1; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.vallokalskarta__calendar-confirmation-card { position: relative; z-index: 2; width: min(560px, 100%); max-height: min(680px, calc(100dvh - 48px)); padding: 34px 36px 30px; overflow: auto; border: 1px solid rgba(0, 0, 0, .08); border-radius: 24px; background: var(--vk-surface); box-shadow: 0 24px 80px rgba(0, 0, 0, .34); animation: vallokalskarta-confirmation-in .28s ease-out both; }
.vallokalskarta__calendar-confirmation-close { position: absolute; top: 12px; right: 12px; display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid rgba(0, 0, 0, .16); border-radius: 50%; background: #fff; color: #252525; font: inherit; font-size: 25px; line-height: 1; cursor: pointer; }
.vallokalskarta__calendar-confirmation-close:hover, .vallokalskarta__calendar-confirmation-close:focus-visible { background: var(--vk-accent); color: #fff; }
.vallokalskarta__calendar-confirmation-close:focus-visible { outline: 3px solid rgba(237, 28, 36, .25); outline-offset: 2px; }
.vallokalskarta__calendar-confirmation-content { color: #272727; font-size: 1rem; line-height: 1.55; }
.vallokalskarta__calendar-confirmation-content > :first-child { margin-top: 0; padding-right: 28px; }
.vallokalskarta__calendar-confirmation-content > :last-child { margin-bottom: 0; }
.vallokalskarta__calendar-confirmation-content p { margin: 0 0 1em; }
.vallokalskarta__calendar-confirmation-content h1, .vallokalskarta__calendar-confirmation-content h2, .vallokalskarta__calendar-confirmation-content h3, .vallokalskarta__calendar-confirmation-content h4, .vallokalskarta__calendar-confirmation-content h5, .vallokalskarta__calendar-confirmation-content h6 { margin: 1.15em 0 .55em; color: #202020; line-height: 1.2; }
.vallokalskarta__calendar-confirmation-content h2 { font-size: 1.65rem; }
.vallokalskarta__calendar-confirmation-content ul, .vallokalskarta__calendar-confirmation-content ol { margin: 0 0 1em; padding-left: 1.4em; }
.vallokalskarta__calendar-confirmation-content li + li { margin-top: .35em; }
.vallokalskarta__calendar-confirmation-content blockquote { margin: 0 0 1em; padding: .15em 0 .15em 1em; border-left: 4px solid var(--vk-accent); color: #4f4b45; }
.vallokalskarta__calendar-confirmation-content a { color: var(--vk-accent-dark); font-weight: 700; }
.vallokalskarta__calendar-confirmation-share { margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(93, 90, 83, .2); }
.vallokalskarta__calendar-confirmation-share [hidden] { display: none !important; }
.vallokalskarta__share { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 39px; padding: 6px 9px; border: 1px solid var(--vk-accent); border-radius: 999px; background: var(--vk-accent); color: #fff; font: inherit; font-size: .77rem; font-weight: 700; line-height: 1.2; text-decoration: none; cursor: pointer; }
.vallokalskarta__share:hover, .vallokalskarta__share:focus-visible { background: var(--vk-accent); color: #fff; text-decoration: none; }
.vallokalskarta__share:focus-visible { outline: 3px solid rgba(237, 28, 36, .25); outline-offset: 2px; }
.vallokalskarta__share svg { flex: 0 0 auto; }
.vallokalskarta__share-heading { margin: 0 0 11px; color: #263743; font-size: .84rem; font-weight: 700; text-align: center; }
.vallokalskarta__share-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.vallokalskarta__share-option, .vallokalskarta__share-option:visited { display: flex; align-items: center; justify-content: center; min-height: 39px; padding: 6px 9px; border: 1px solid var(--vk-accent); border-radius: 999px; background: var(--vk-accent); color: #fff; font: inherit; font-size: .77rem; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none; cursor: pointer; }
.vallokalskarta__share-option:hover, .vallokalskarta__share-option:focus-visible { border-color: var(--vk-accent); background: var(--vk-accent); color: #fff; text-decoration: none; }
.vallokalskarta__share-option:focus-visible { outline: 2px solid var(--vk-accent); outline-offset: 2px; }
.vallokalskarta__share-system { grid-column: 1 / -1; }
.vallokalskarta__share-status { margin: 9px 0 0; color: #4f4b45; font-size: .82rem; line-height: 1.4; text-align: center; }
.vallokalskarta__share-status:empty { display: none; }

@keyframes vallokalskarta-confirmation-in {
  from { opacity: 0; transform: translateY(16px) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 640px) {
  .vallokalskarta { height: auto !important; min-height: 0; overflow: visible; border-radius: 0; background: transparent; }
  .vallokalskarta__map-stage { position: relative; inset: auto; width: 100%; height: clamp(240px, 70vw, 300px); border-radius: 10px 10px 0 0; }
  .vallokalskarta__map { border-radius: 10px 10px 0 0; }
  .vallokalskarta__info { top: 24px; right: auto; bottom: auto; left: 14px; }
  .vallokalskarta__info-panel { top: 40px; right: auto; bottom: auto; left: 0; }
  .vallokalskarta__panel { position: relative; top: auto; right: auto; bottom: auto; left: auto; width: auto; max-height: none; margin: -38px 10px 0; padding: 15px; overflow: visible; border-radius: 22px; }
  .vallokalskarta--planning .vallokalskarta__panel { max-height: none; }
  .vallokalskarta__panel-heading { min-height: 34px; padding: 2px 106px 0 0; text-align: left; }
  .vallokalskarta__panel h2 { font-size: 19px; }
  .vallokalskarta__status { margin-bottom: 12px; }
  .vallokalskarta__panel-toggle { display: block; top: -2px; right: -2px; width: auto; min-width: 98px; min-height: 34px; padding: 0 13px; border-radius: 999px; background: rgba(255, 255, 255, .45); font-size: .76rem; font-weight: 700; line-height: 32px; white-space: nowrap; }
  .vallokalskarta__panel-toggle-label { display: inline; }
  .vallokalskarta__panel-toggle-icon { display: none; }
  .vallokalskarta__filters { grid-template-columns: 1fr 1fr; gap: 8px; }
  html.vallokalskarta-map-open, html.vallokalskarta-map-open body { overflow: hidden !important; overscroll-behavior: none; }
  .vallokalskarta.vallokalskarta--mobile-map-expanded { position: fixed; z-index: 2147483000; inset: 0; width: auto; height: auto !important; margin: 0; overflow: hidden; border-radius: 0; background: #e7ecef; }
  .vallokalskarta--mobile-map-expanded .vallokalskarta__map-stage { position: absolute; inset: 0; width: auto; height: auto; border-radius: 0; }
  .vallokalskarta--mobile-map-expanded .vallokalskarta__map { border-radius: 0; }
  .vallokalskarta--mobile-map-expanded .vallokalskarta__panel { position: absolute; z-index: 700; top: auto; right: auto; bottom: max(16px, env(safe-area-inset-bottom)); left: 14px; width: auto; max-height: none; margin: 0; padding: 7px; overflow: visible; border-radius: 999px; }
  .vallokalskarta--mobile-map-expanded .vallokalskarta__panel-heading { width: auto; height: auto; min-height: 38px; padding: 0; }
  .vallokalskarta--mobile-map-expanded .vallokalskarta__panel-toggle { position: static; min-width: 118px; min-height: 38px; padding: 0 17px; border: 0; background: var(--vk-accent); color: #fff; line-height: 38px; }
  .vallokalskarta--mobile-map-expanded .vallokalskarta__panel-toggle:hover,
  .vallokalskarta--mobile-map-expanded .vallokalskarta__panel-toggle:focus-visible { background: var(--vk-accent-dark); color: #fff; }
  .vallokalskarta__calendar-confirmation { padding: 16px; }
  .vallokalskarta__calendar-confirmation-card { max-height: calc(100dvh - 32px); padding: 30px 24px 25px; border-radius: 20px; }
  .vallokalskarta__calendar-confirmation-content h2 { font-size: 1.4rem; }
}

@media (max-width: 380px) {
  .vallokalskarta__filters { grid-template-columns: 1fr; }
  .vallokalskarta__planner-fields, .vallokalskarta__calendar-buttons { grid-template-columns: 1fr; }
  .vallokalskarta__calendar-buttons a:last-child { grid-column: auto; }
  .vallokalskarta__planner-actions { display: grid; grid-template-columns: 1fr; }
  .vallokalskarta__planner-next { grid-row: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .vallokalskarta .leaflet-zoom-animated { transition: none !important; }
  .vallokalskarta__calendar-confirmation-card { animation: none; }
}
