/* =============================
 * build/style.css
 * ============================= */

/* Root-elementet som har en klickbar overlay */
.clickable-block {
  position: relative;
}

/* Osynlig overlay-länk — täcker hela raden */
.clickable-block > .row-link-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  /* Ingen visuell stil — länken är helt osynlig men klickbar */
  text-decoration: none;
  color: transparent;
}

/* Inre interaktiva element hamnar ovanpå overlayen */
.clickable-block a:not(.row-link-overlay),
.clickable-block button,
.clickable-block input,
.clickable-block select,
.clickable-block textarea,
.clickable-block label,
.clickable-block [role="button"],
.clickable-block summary {
  position: relative;
  z-index: 2;
}

/* Hover-feedback på hela raden */
.clickable-block:hover {
  cursor: pointer;
}

.clickable-block:has(> .row-link-overlay:hover) {
  filter: brightness(1.02);
}

/* Fokusring på overlay-länken när den tabbas till */
.clickable-block > .row-link-overlay:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: -2px;
}

/* Visuellt dold men tillgänglig text för skärmläsare */
.clickable-block > .row-link-overlay .screen-reader-text {
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  width: 1px;
  height: 1px;
  overflow: hidden;
  word-wrap: normal !important;
}

/* Editor-preview: diskret markering i editorn */
.is-row-linked-preview::before {
  content: "🔗";
  position: absolute;
  top: 4px;
  right: 4px;
  font-size: 14px;
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  padding: 2px 6px;
  border-radius: 3px;
  z-index: 100;
  pointer-events: none;
}