/* KOLMAR SOCIAL: small surface helpers. Keep this file late in index.html. */
/* The public-profile-only background fix lives in styles-public-profile-fix.css. */

/* Feed-only fix: clear the gray surface behind the author line at the top of a post.
   The post body, media, actions, comments and profile header are intentionally untouched. */
.content .post-card > .post-head,
.content .post-card > .post-head .post-author,
.content .post-card > .post-head .post-profile-link {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

.content .post-card > .post-head .post-author:hover,
.content .post-card > .post-head .post-author:focus-visible,
.content .post-card > .post-head .post-profile-link:hover,
.content .post-card > .post-head .post-profile-link:focus-visible {
  background: transparent !important;
}

.post-profile-link {
  min-height: 36px;
  margin-left: auto;
  padding: 0 8px;
  color: #c8adff;
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.post-profile-link:hover,
.post-profile-link:focus-visible {
  color: #fff;
  text-decoration: underline;
}

.content .post-card + .post-card {
  border-top-color: #27272f;
}

@media (max-width: 600px) {
  .modal-backdrop {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: max(8px, env(safe-area-inset-top)) 8px max(8px, env(safe-area-inset-bottom));
    -webkit-overflow-scrolling: touch;
  }

  .modal-backdrop .profile-editor,
  .modal-backdrop .story-editor {
    width: 100%;
    height: calc(100dvh - 16px);
    max-height: none;
    min-height: 0;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }

  .profile-editor .editor-actions,
  .story-editor .editor-actions {
    position: sticky;
    bottom: -1px;
    z-index: 20;
    min-height: 58px;
    background: linear-gradient(180deg, transparent 0, var(--panel) 30%);
  }

  .profile-editor input,
  .profile-editor textarea,
  .story-editor input,
  .story-editor textarea,
  .story-editor select {
    font-size: 16px;
  }

  .profile-editor .upload-zone,
  .story-editor .upload-zone,
  .story-camera-launch {
    min-height: 64px;
    touch-action: manipulation;
  }
}

@supports not (height: 100dvh) {
  @media (max-width: 600px) {
    .modal-backdrop .profile-editor,
    .modal-backdrop .story-editor { height: calc(100vh - 16px); }
  }
}