/*
 * tarjousui/static/skt-laajennus.css — the extension slots of static/skt-laajennus.js.
 *
 * A slot is an empty <div class="skt-paikka" data-skt-paikka="..."> in index.html (one
 * per card too, made by app.js::kohdeKortti) that a feature module writes into. Empty,
 * it takes no space, so the page looks exactly as before until a feature uses it.
 *
 * On a phone the kohde page's columns are `display: contents` and every block has an
 * `order` (app.css, "Leiskan kolme saraketta"); a block without one would jump to the
 * top of the page. The two slots inside the columns get theirs here, on a phone only:
 * each the order of the block it follows, which keeps it right under that block (equal
 * orders keep the order of the markup). From 1100px the columns are real again and
 * app.css sets every child's order back to 0; an order here would move the slot to
 * the bottom of its column.
 */

.skt-paikka:empty { display: none; }

@media (max-width: 1099.98px) {
  [data-skt-paikka="kuva-tyokalut"]     { order: 3; }  /* under the photo strip, #carousel */
  [data-skt-paikka="kohde-sivupaneeli"] { order: 9; }  /* under the tietue button, #tietue-status */
}

/* The right column is sticky and as high as the screen, and it scrolls as a whole
   (app.css). The side panel takes its full height and never a scrollbar of its own:
   Jyri 9.10.2026, "Kohteen tyyppi ja tarjouspohja должен быть во весь рост" — squeezed
   into what #panel left over, it was a 372 px window onto 958 px of blocks. */
@media (min-width: 1100px) {
  [data-skt-paikka="kohde-sivupaneeli"] { flex: 0 0 auto; }
}

/* Over the photo, inside #stage-inner, so it pans and zooms with it like #overlay. It
   lets every touch through to the drawing layer; a feature that wants one sets
   `pointer-events: auto` on its own element. */
[data-skt-paikka="kuva-paalle"] { position: absolute; inset: 0; pointer-events: none; }

/* The card is a grid of named areas: a slot without one would take an empty area (the
   photos' on a card without photos). Its own row at the bottom, the full width, and
   above the card's open-button (.kohde-open::after covers the whole card), so a
   feature's controls there catch their own taps instead of opening the kohde. */
[data-skt-paikka="kortti-ala"] { grid-column: 1 / -1; grid-row: -1; position: relative; z-index: 1; }

/* In the list's top bar, beside the logout button: a help link, say. */
[data-skt-paikka="ylapalkki"] { display: flex; align-items: center; gap: 4px; }