/* Sötétkék parkolóalaprajz, olvasható névtáblákkal. */
.parking-heading-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.parking-heading-actions .secondary-button { min-height: 41.4px; }
.parking-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16.2px; margin: 21.6px 0; }
.parking-stats > div { padding: 18px 21.6px; border: 1px solid #283b53; border-radius: 10.8px; background: linear-gradient(125deg, #122338, #0c192a); }
.parking-stats > div > span { display: flex; align-items: center; gap: 8.1px; color: #a9bdd6; font-size: 11px; letter-spacing: .07em; line-height: 1.7; }
.parking-stats svg { width: 16.2px; height: 16.2px; color: #d9bb7a; }
.parking-stats strong { display: block; margin-top: 12.6px; color: #e6f0ff; font: 750 31.5px var(--font-heading); }
.parking-stats > div:first-child strong { color: #78dfb7; }
.parking-stats small { color: #95acc8; font: 400 14.4px var(--font-body); }
.parking-personal-note { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin: 0 0 21.6px; padding: 13.5px 17.1px; border: 1px solid #568cb366; border-radius: 9px; color: #b9d6ef; background: #2e71951a; font-size: 12.6px; line-height: 1.8; }
.parking-personal-note > svg { width: 17.1px; height: 17.1px; color: #92c7f8; }
.parking-personal-note > strong { color: #d1e8ff; }
.parking-personal-note > span { margin-left: auto; }
.parking-personal-note > a { display: inline-flex; align-items: center; gap: 6.3px; margin-left: auto; color: #e1c58d; }
.parking-personal-note a > svg { width: 13.5px; height: 13.5px; }
.parking-plan { padding: 24.3px; overflow: hidden; border-color: #ab946c40; background: linear-gradient(130deg, #101e30, #0a1626); }
.parking-plan-heading { display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap; }
.parking-plan-heading .eyebrow { color: #94a9c5; font-size: 10px; }
.parking-plan-heading h2 { display: flex; align-items: center; gap: 10.8px; margin: 10.8px 0 0; color: #e5edf9; font: 750 25.2px var(--font-heading); letter-spacing: -.035em; }
.parking-plan-heading h2 > svg { width: 28.8px; height: 28.8px; color: #e0bd71; }
.parking-plan-caption { color: #b5a47f; font-size: 11px; line-height: 1.8; }
.parking-map-hint { display: flex; align-items: flex-start; gap: 7.2px; margin: 21.6px 0 12.6px; color: #9cb0ca; font-size: 11px; line-height: 1.8; }
.parking-map-hint svg { flex: 0 0 auto; width: 13.5px; height: 13.5px; margin-top: 3px; color: #b4a179; }
.parking-map-scroll { overflow-x: auto; border: 1px solid #60583e; border-radius: 8.1px; background: #07101b; scrollbar-color: #726449 #101b2b; scrollbar-width: thin; overscroll-behavior-x: contain; }
.parking-map-scroll:focus-visible { outline: 2px solid #e4c281; outline-offset: 4px; }
.parking-map { min-width: 1062px; padding: 17.1px 16.2px 18px; border: 10px solid #17202a; background: #0b131d; }
.parking-map-top { display: grid; grid-template-columns: repeat(20, minmax(0, 1fr)); }
.parking-map-spot { position: relative; display: flex; flex-direction: column; align-items: center; gap: 9px; width: 100%; height: 167.4px; padding: 9.9px 3.6px 7.2px; border: 0; border-left: 1px solid #a4935a; border-bottom: 1px dashed #665d3e; color: #87d9b5; background: #2d9c6710; font-family: var(--font-body); cursor: pointer; transition: background .15s, box-shadow .15s; }
.parking-map-spot:last-child { border-right: 1px solid #a4935a; }
.parking-map-spot > strong { color: #e6edf5; font-size: 11px; line-height: 1.5; font-weight: 750; font-variant-numeric: tabular-nums; white-space: nowrap; }
.parking-map-name { writing-mode: vertical-rl; transform: rotate(180deg); width: 32.4px; max-width: 100%; height: 122.4px; overflow: hidden; color: inherit; font-size: 11px; line-height: 1.45; font-weight: 650; text-align: center; overflow-wrap: anywhere; }
.parking-map-spot.is-occupied { color: #efb5bf; background: #b849601e; }
.parking-map-spot.is-reserved { color: #dfc381; background: #b7913910; }
.parking-map-spot.is-own { box-shadow: inset 0 0 0 2px #72ade6; background: #4187c32a; }
.parking-map-spot:hover, .parking-map-spot:focus-visible { z-index: 1; outline: 2px solid #e0c384; outline-offset: -2px; background: #d7b86b20; }
.parking-map-spot.is-occupied:hover { background: #b8496040; }
.parking-map-own { position: absolute; bottom: 4.5px; right: 5.4px; color: #8ec8ff; font-size: 8px; }
.parking-driveway { position: relative; height: 142.2px; }
.parking-driveway-mark { position: absolute; top: 40.5px; left: 28%; color: #7990a019; font: 800 33.3px var(--font-heading); letter-spacing: .25em; text-align: center; }
.parking-driveway-mark > span { display: block; margin-top: 7.2px; font: 600 10px var(--font-body); letter-spacing: .28em; }
.parking-column { position: absolute; top: 35.1px; right: 24%; display: grid; place-items: center; width: 59.4px; height: 72px; border: 7px solid #252b33; outline: 1px solid #39424c; color: #a3a8ae; background: #1c232a; font-size: 8px; }
.parking-drive-arrow { position: absolute; top: 53.1px; left: 12%; color: #c5b68022; }
.parking-drive-arrow svg { width: 40.5px; height: 31.5px; }
.parking-map-bottom { display: grid; grid-template-columns: 29% 16% 52%; justify-content: space-between; align-items: end; }
.parking-map-leaders { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.parking-map-last { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); }
.parking-map-bottom .parking-map-spot { border-top: 1px dashed #665d3e; border-bottom: 0; }
.parking-garage { height: 122.4px; position: relative; padding: 9px 3.6px 0; }
.parking-garage > div { height: 113.4px; border: 1px solid #776940; background: repeating-linear-gradient(45deg, transparent 0 7px, #a5955522 7px 8px), repeating-linear-gradient(-45deg, transparent 0 7px, #a5955522 7px 8px); }
.parking-garage > span { position: absolute; bottom: -17.1px; left: 3px; right: 3px; display: grid; place-items: center; height: 16.2px; border: 1px solid #ac9458; color: #f1d48b; background: repeating-linear-gradient(125deg, #82703930 0 4px, #121a20 4px 8px); font-size: 9px; font-weight: 650; letter-spacing: .07em; }
.parking-legend { display: flex; flex-wrap: wrap; gap: 11.7px 20.7px; margin-top: 19.8px; }
.parking-legend > span { display: inline-flex; align-items: center; gap: 7.2px; color: #acbed5; font-size: 11px; line-height: 1.7; }
.parking-legend i { width: 8.1px; height: 8.1px; border-radius: 3px; background: #5dcc9c; }
.parking-legend .is-occupied i { background: #d18091; }
.parking-legend .is-reserved i { background: #d1b16b; }
.parking-legend .is-own i { background: #7eb7ef; }
.parking-section-title { margin: 31.5px 0 0; }
.parking-section-title .eyebrow { color: #ac9870; font-size: 10px; }
.parking-section-title h2 { margin: 9px 0 0; color: #e2ecfa; font: 750 22.5px var(--font-heading); letter-spacing: -.03em; }
.parking-toolbar { margin-top: 18px; }
.parking-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 202.5px), 1fr)); gap: 17.1px; }
.parking-slot-card { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 19.8px; border-top: 3px solid #4ec38e; background: linear-gradient(130deg, #10243a, #0a192a); }
.parking-slot-card.is-occupied { border-top-color: #cd7b8d; }
.parking-slot-card.is-reserved, .parking-slot-card.is-pending { border-top-color: #c6a763; }
.parking-slot-card.is-own { border-color: #77ade0; }
.parking-slot-card > header { display: flex; align-items: center; gap: 8.1px; min-height: 35.1px; }
.parking-slot-icon { display: inline-grid; place-items: center; flex: 0 0 auto; width: 36px; height: 36px; border: 1px solid #3b916047; border-radius: 9.9px; color: #81dfb5; background: #2d9c681a; }
.parking-slot-icon > svg { width: 19.8px; height: 19.8px; }
.parking-slot-card.is-occupied .parking-slot-icon { color: #eaa6b5; border-color: #b55d7047; background: #b84b651a; }
.parking-slot-card.is-reserved .parking-slot-icon { color: #ddbf7c; border-color: #b59b5c47; background: #9c7b351a; }
.parking-slot-kind { color: #9fb3cc; font-size: 9px; font-weight: 600; letter-spacing: .06em; }
.parking-own-tag { margin-left: auto; color: #a6cfff; font-size: 9px; letter-spacing: .05em; }
.parking-slot-card h3 { margin: 20.7px 0 9px; color: #edf4fe; font: 800 29.7px var(--font-heading); letter-spacing: -.04em; }
.parking-slot-owner { min-height: 42.3px; margin: 0; color: #8adbb5; font-size: 14.4px; line-height: 1.55; font-weight: 650; overflow-wrap: anywhere; }
.parking-slot-card.is-occupied .parking-slot-owner { color: #e7abb9; }
.parking-slot-card.is-reserved .parking-slot-owner, .parking-slot-card.is-pending .parking-slot-owner { color: #dfc383; }
.parking-slot-state { display: block; margin: 15.3px 0; color: #9bafca; font-size: 10px; letter-spacing: .09em; }
.parking-slot-card > footer { margin-top: auto; }
.parking-slot-card > footer > button, .parking-card-reserved { width: 100%; min-height: 38.7px; padding: 9px 7.2px; font-size: 11px; }
.parking-card-reserved { display: grid; place-items: center; border: 1px solid #7f72424a; border-radius: 6.3px; color: #bba879; }
.parking-danger { color: #e7a5b5; }
.secondary-button.parking-danger { border-color: #a76a7a59; }
.parking-request-spot { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-top: 18.9px; padding: 11.7px; border: 1px solid #3d4550; border-radius: 7.2px; background: #071320; }
.parking-request-spot > svg { width: 18px; height: 18px; color: #dfbd74; }
.parking-request-spot > strong { color: #f1d399; font-size: 15.3px; }
.parking-request-spot > span { color: #a5b9d1; font-size: 11px; }
.parking-history { margin-top: 27px; }
dialog.parking-dialog { width: min(621px, calc(100% - 32.4px)); }
.parking-form-body > .admin-field + .admin-field { margin-top: 19.8px; }
.parking-form-body > .admin-form-note { margin-top: 19.8px; }
.parking-detail-identity { display: grid; justify-items: center; gap: 10.8px; padding: 9px 0 18px; text-align: center; }
.parking-detail-identity .parking-slot-icon { width: 51.3px; height: 51.3px; margin-bottom: 7.2px; }
.parking-detail-identity .parking-slot-icon svg { width: 27px; height: 27px; }
.parking-detail-identity > span:not(.parking-slot-icon) { color: #ab9772; font-size: 10px; letter-spacing: .09em; }
.parking-detail-identity > strong { color: #eaf1fc; font: 750 23.4px var(--font-heading); line-height: 1.5; overflow-wrap: anywhere; }
.parking-detail-identity > p { margin: 0; color: #b5c7df; font-size: 11.7px; line-height: 1.8; }
.parking-detail-identity > small { color: #8ca5c4; font-size: 11px; line-height: 1.8; }
@media (max-width: 750px) {
  .parking-stats { gap: 9px; }
  .parking-stats > div { padding: 15.3px 11.7px; }
  .parking-stats > div > span { flex-direction: column; align-items: flex-start; gap: 7.2px; font-size: 9px; }
  .parking-stats strong { font-size: 25.2px; }
  .parking-stats small { font-size: 11px; }
  .parking-plan { padding: 18.9px 15.3px; }
  .parking-plan-heading h2 { font-size: 21.6px; }
  .parking-plan-caption { font-size: 11px; }
  .parking-slots { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11.7px; }
  .parking-slot-card { padding: 15.3px 11.7px; }
  .parking-slot-card > header { flex-wrap: wrap; gap: 7.2px; }
  .parking-slot-kind { font-size: 8px; }
  .parking-own-tag { margin-left: 0; }
  .parking-slot-owner { font-size: 12.6px; min-height: 59.4px; }
  .parking-slot-card h3 { font-size: 26.1px; }
  .parking-slot-card > footer > button { font-size: 11px; gap: 6.3px; }
  .parking-personal-note > a, .parking-personal-note > span { margin-left: 0; }
}
@media (max-width: 420px) {
  .parking-heading-actions { width: 100%; }
  .parking-heading-actions > button { width: 100%; }
  .parking-slot-kind { width: 100%; }
  .parking-slot-owner { min-height: 59.4px; }
  .parking-slot-card > footer > button { flex-wrap: wrap; min-height: 48.6px; line-height: 1.4; }
  .parking-slot-card > footer > button > svg { width: 13.5px; height: 13.5px; }
  .parking-legend { column-gap: 13.5px; }
}
@media (prefers-reduced-motion: reduce) { .parking-map-spot { transition: none; } }