/* Sticky Note Block — bksn- prefix */
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;700&display=swap');

.bksn-wrap {
  display: inline-block;
  position: relative;
  width: var(--bksn-w, 220px);
  padding: var(--bksn-p, 20px);
  background: var(--bksn-bg, #fef08a);
  color: var(--bksn-text, #333);
  font-family: var(--bksn-tx-font-family, inherit);
  font-size: var(--bksn-tx-font-size-d, var(--bksn-fs, 15px));
  font-weight: var(--bksn-tx-font-weight, var(--bksn-fw, 400));
  font-style: var(--bksn-tx-font-style, normal);
  text-decoration: var(--bksn-tx-text-decoration, none);
  text-transform: var(--bksn-tx-text-transform, none);
  line-height: var(--bksn-tx-line-height-d, var(--bksn-lh, 1.6));
  letter-spacing: var(--bksn-tx-letter-spacing-d, normal);
  word-spacing: var(--bksn-tx-word-spacing-d, normal);
  box-shadow: var(--bksn-shadow, 4px 6px 16px rgba(0,0,0,.2));
  transform: rotate(var(--bksn-rot, -2deg));
  box-sizing: border-box;
  transition: transform .2s;
}
.bksn-wrap:hover { transform: rotate(0deg) scale(1.02); }

.bksn-handwritten,
.bksn-handwritten .bksn-heading,
.bksn-handwritten .bksn-text {
  font-family: 'Caveat', cursive !important;
}

/* Curl corner via pseudo-element */
.bksn-curl::after {
  content: '';
  position: absolute;
  bottom: 0; right: 0;
  width: 28px; height: 28px;
  background: linear-gradient(
    225deg,
    rgba(0,0,0,.15) 50%,
    var(--bksn-bg, #fef08a) 50%
  );
  border-top-left-radius: 4px;
}

.bksn-heading {
  display: block;
  font-family: var(--bksn-hd-font-family, inherit);
  font-size: var(--bksn-hd-font-size-d, 1.05em);
  font-weight: var(--bksn-hd-font-weight, 700);
  font-style: var(--bksn-hd-font-style, normal);
  text-decoration: var(--bksn-hd-text-decoration, none);
  text-transform: var(--bksn-hd-text-transform, none);
  line-height: var(--bksn-hd-line-height-d, 1.3);
  letter-spacing: var(--bksn-hd-letter-spacing-d, normal);
  word-spacing: var(--bksn-hd-word-spacing-d, normal);
  margin-bottom: 6px;
}
.bksn-text { margin: 0; }

/* ── Responsive Typography ── */
@media (max-width: 1024px) {
  .bksn-wrap {
    font-size: var(--bksn-tx-font-size-t, var(--bksn-tx-font-size-d, var(--bksn-fs, 15px)));
    line-height: var(--bksn-tx-line-height-t, var(--bksn-tx-line-height-d, var(--bksn-lh, 1.6)));
    letter-spacing: var(--bksn-tx-letter-spacing-t, var(--bksn-tx-letter-spacing-d, normal));
    word-spacing: var(--bksn-tx-word-spacing-t, var(--bksn-tx-word-spacing-d, normal));
  }
  .bksn-heading {
    font-size: var(--bksn-hd-font-size-t, var(--bksn-hd-font-size-d, 1.05em));
    line-height: var(--bksn-hd-line-height-t, var(--bksn-hd-line-height-d, 1.3));
    letter-spacing: var(--bksn-hd-letter-spacing-t, var(--bksn-hd-letter-spacing-d, normal));
    word-spacing: var(--bksn-hd-word-spacing-t, var(--bksn-hd-word-spacing-d, normal));
  }
}
@media (max-width: 767px) {
  .bksn-wrap {
    font-size: var(--bksn-tx-font-size-m, var(--bksn-tx-font-size-t, var(--bksn-tx-font-size-d, var(--bksn-fs, 15px))));
    line-height: var(--bksn-tx-line-height-m, var(--bksn-tx-line-height-t, var(--bksn-tx-line-height-d, var(--bksn-lh, 1.6))));
    letter-spacing: var(--bksn-tx-letter-spacing-m, var(--bksn-tx-letter-spacing-t, var(--bksn-tx-letter-spacing-d, normal)));
    word-spacing: var(--bksn-tx-word-spacing-m, var(--bksn-tx-word-spacing-t, var(--bksn-tx-word-spacing-d, normal)));
  }
  .bksn-heading {
    font-size: var(--bksn-hd-font-size-m, var(--bksn-hd-font-size-t, var(--bksn-hd-font-size-d, 1.05em)));
    line-height: var(--bksn-hd-line-height-m, var(--bksn-hd-line-height-t, var(--bksn-hd-line-height-d, 1.3)));
    letter-spacing: var(--bksn-hd-letter-spacing-m, var(--bksn-hd-letter-spacing-t, var(--bksn-hd-letter-spacing-d, normal)));
    word-spacing: var(--bksn-hd-word-spacing-m, var(--bksn-hd-word-spacing-t, var(--bksn-hd-word-spacing-d, normal)));
  }
}

/* Editor */
.wp-block-blockenberg-sticky-note .bksn-heading,
.wp-block-blockenberg-sticky-note .bksn-text { outline: none; }
