/* checkpoint 8 — listing, replies, reactions */
.cctp-listing{padding:18px 0 34px}.cctp-listing__header{padding:0 18px 14px}.cctp-listing__header h1{margin:0 0 12px;font-size:30px}.cctp-listing__tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.cctp-listing__tabs a{display:flex;align-items:center;justify-content:center;min-height:42px;border:1px solid #d7dce3;border-radius:var(--cctp-radius);color:#202124;font-weight:700;text-decoration:none}.cctp-listing__tabs a.is-active{border-color:#0c45ae;color:#0c45ae;background:#f4f7ff}.cctp-listing__empty{padding:18px}.cctp-post-list{border-top:1px solid #e5e7eb}.cctp-post{padding:16px 18px;border-bottom:8px solid #f3f4f6;scroll-margin-top:72px}.cctp-post__header{display:flex;align-items:center;gap:10px}.cctp-post__avatar{width:48px;height:48px;object-fit:cover;border-radius:var(--cctp-radius);background:#f1f3f5}.cctp-post__identity{display:flex;flex-direction:column;min-width:0}.cctp-post__media{display:block;width:100%;margin:14px 0 0;padding:0;border:0;background:#f1f3f5;border-radius:var(--cctp-radius);overflow:hidden;cursor:zoom-in;aspect-ratio:4/3}.cctp-post__image{display:block;width:100%;height:100%;object-fit:cover;object-position:center top}.cctp-image-viewer{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.94);padding:18px}.cctp-image-viewer[hidden]{display:none}.cctp-image-viewer__backdrop{position:absolute;inset:0;border:0;background:transparent;border-radius:0}.cctp-image-viewer__image{position:relative;z-index:1;display:block;max-width:min(100%,980px);max-height:calc(100dvh - 36px);width:auto;height:auto;object-fit:contain}.cctp-image-viewer__close{position:absolute;z-index:2;top:max(14px,env(safe-area-inset-top));right:14px;width:42px;height:42px;display:flex;align-items:center;justify-content:center;border:0;border-radius:var(--cctp-radius);background:#d1d5db;color:#202124;font-size:24px;line-height:1;cursor:pointer}.cctp-image-viewer-open{overflow:hidden}.cctp-post__identity strong{font-size:16px}.cctp-post__identity span,.cctp-post__meta,.cctp-reply small{font-size:13px;color:#6b7280}.cctp-post__content{padding:14px 0;font-size:17px;line-height:1.5;white-space:normal;overflow-wrap:anywhere}.cctp-post__meta{display:flex;justify-content:space-between;gap:12px;padding-bottom:9px}.cctp-post__actions{display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb}.cctp-post-action{border:0;background:#fff;color:#3f454c;min-height:42px;font-weight:700;border-radius:0}.cctp-post-action.is-active{color:#0c45ae;background:#f4f7ff}.cctp-post-action b{font:inherit}.cctp-reply-form{padding:12px 0;border-bottom:1px solid #e5e7eb}.cctp-reply-form textarea{width:100%;box-sizing:border-box;resize:vertical;border:1px solid #d7dce3;border-radius:var(--cctp-radius);padding:10px 12px;font:inherit;min-height:72px}.cctp-reply-form__bottom{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:8px}.cctp-reply-form__bottom button{min-height:38px;padding:0 18px}.cctp-reply-form small{display:block;margin-top:-30px;padding-right:110px;color:#6b7280}.cctp-reply-error{color:#b42318;font-size:13px;margin-top:8px}.cctp-replies{padding-top:4px}.cctp-reply{margin-top:9px;padding:9px 11px;background:#f5f6f7;border-radius:var(--cctp-radius);scroll-margin-top:72px}.cctp-reply strong{font-size:14px}.cctp-reply p{margin:3px 0 4px;line-height:1.4;overflow-wrap:anywhere}.cctp-more-replies{border:0;background:transparent;color:#3366cc;font-weight:700;padding:10px 0 0;border-radius:0}.cctp-pagination{display:flex;align-items:center;justify-content:center;gap:18px;padding:18px}.cctp-pagination a{color:#3366cc;text-decoration:none;font-weight:700}.cctp-pagination span{color:#6b7280}
@media(max-width:720px){.cctp-listing{padding-top:12px}.cctp-listing__header{padding:0 14px 12px}.cctp-post{padding:14px}.cctp-listing__header h1{font-size:27px}}
@media(max-width:430px){.cctp-listing__header{padding-left:12px;padding-right:12px}.cctp-listing__tabs{gap:4px}.cctp-listing__tabs a{min-height:40px;font-size:14px}.cctp-post{padding:13px 12px}.cctp-post__content{font-size:19px}.cctp-post__meta{font-size:12px}.cctp-post-action{font-size:14px}}
@media(max-width:390px){.cctp-listing__tabs a{font-size:13px}.cctp-post{padding-left:10px;padding-right:10px}.cctp-post__actions{grid-template-columns:1fr 1fr .9fr}}

/* Public post quick moderation — visible to logged-in Admin only */
.cctp-post__identity{flex:1 1 auto}
.cctp-post__header-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:0 0 auto}
.cctp-post__admin-action{min-height:36px;padding:6px 10px;border:1px solid #c7cdd4;border-radius:7px;background:#fff;color:#202124;font:inherit;font-size:14px;font-weight:800;cursor:pointer}
.cctp-post__admin-action--edit,.cctp-post__admin-action--edit.is-active{color:#155eef;border-color:#9bb7eb;background:#f3f7ff}
.cctp-post__admin-action--reject{color:#b42318;border-color:#e7aaa5;background:#fff5f4}
.cctp-post__admin-action:disabled{opacity:.55;cursor:wait}
.cctp-post__admin-editor{margin:14px 0;padding:12px;border:1px solid #b8c2ce;border-radius:7px;background:#f7f9fb}
.cctp-post__admin-editor label{display:block;margin-bottom:10px;color:#39414a;font-size:13px;font-weight:800}
.cctp-post__admin-editor input,.cctp-post__admin-editor textarea{display:block;width:100%;box-sizing:border-box;margin-top:5px;border:1px solid #aeb8c3;border-radius:7px;background:#fff;color:#15191e;padding:10px 11px;font:inherit}
.cctp-post__admin-editor textarea{min-height:240px;resize:vertical;line-height:1.5}
.cctp-post__admin-editor-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.cctp-post__admin-editor-actions span{flex:1 1 auto;color:#b42318;font-size:13px}
.cctp-post__admin-editor-actions button{min-height:38px;padding:7px 14px;border:1px solid #aeb8c3;border-radius:7px;background:#fff;color:#202124;font:inherit;font-weight:800}
.cctp-post__admin-editor-actions button[type="submit"]{border-color:#155eef;background:#155eef;color:#fff}
.cctp-post__admin-rejected{margin:18px;padding:18px;border:1px solid #e7aaa5;border-radius:7px;background:#fff5f4;color:#8d1d16;font-weight:800;text-align:center}
@media(max-width:520px){.cctp-post__header{align-items:flex-start;flex-wrap:wrap}.cctp-post__header-actions{width:100%;padding-left:58px;justify-content:flex-start}.cctp-post__admin-action{font-size:13px}.cctp-post__save-top{margin-left:auto}}

/* STEP 8 post text collapse/toggle */
.cctp-post__content-wrap{position:relative;padding:14px 0;cursor:pointer;outline:none}
.cctp-post__content-wrap:focus-visible{outline:2px solid #3366cc;outline-offset:2px;border-radius:var(--cctp-radius)}
.cctp-post__content{padding:0;font-size:19px;line-height:1.6;white-space:normal;overflow-wrap:anywhere}
.cctp-post__content-wrap:not(.is-expanded) .cctp-post__content{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;white-space:normal;padding-right:76px}
.cctp-post__more{position:absolute;right:0;top:14px;background:#fff;color:#3f454c;font-weight:700;font-size:15px;line-height:1.7;padding-left:8px}
.cctp-post__content-wrap.is-expanded .cctp-post__more{position:static;display:inline-block;margin-top:4px;padding-left:0;color:#6b7280}
@media (max-width:430px){.cctp-post__content{font-size:19px}.cctp-post__content-wrap:not(.is-expanded) .cctp-post__content{padding-right:72px}.cctp-post__more{font-size:14px}}

/* STEP 8 Facebook-style post card correction */
.cctp-post__content-wrap{
  position:relative;
  margin:0;
  padding:12px 0 10px;
  cursor:pointer;
}
.cctp-post__content{
  margin:0;
  padding:0;
  font-size:var(--cctp-post-reading-size,19px);
  line-height:1.6;
  overflow-wrap:anywhere;
}

/* Public article reading toolbar: size selector left, working Save button right. */
.cctp-post__reading-tools{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  margin:16px 0 4px;
}
.cctp-post__font-size{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
  color:#0b2343;
  font-size:15px;
  font-weight:800;
}
.cctp-post__font-size select{
  min-width:94px;
  min-height:44px;
  padding:7px 32px 7px 13px;
  border:1px solid #64717d;
  border-top-color:#f7f9fa;
  border-radius:7px;
  background-color:#b9c0c6;
  background-image:linear-gradient(180deg,rgba(255,255,255,.48),rgba(255,255,255,.08) 46%,rgba(35,47,58,.18)),url('../images/cctp-button-aluminum.jpg');
  background-position:center;
  background-size:100% 100%,cover;
  color:#07182f;
  box-shadow:inset 0 1px #fff,inset 0 -2px rgba(56,69,80,.54),0 4px 8px rgba(7,20,34,.22);
  font:inherit;
  font-size:16px;
  cursor:pointer;
}
.cctp-post__font-size select:focus-visible{
  outline:2px solid #155eef;
  outline-offset:2px;
}
.cctp-post__save-top--reading,
.cctp-post__save-top--reading.is-active{
  min-width:96px;
  min-height:44px;
  margin:0!important;
  padding:8px 18px!important;
  border:1px solid #64717d!important;
  border-top-color:#f7f9fa!important;
  border-radius:7px!important;
  background-color:#b9c0c6!important;
  background-image:linear-gradient(180deg,rgba(255,255,255,.48),rgba(255,255,255,.08) 46%,rgba(35,47,58,.18)),url('../images/cctp-button-aluminum.jpg')!important;
  background-position:center!important;
  background-size:100% 100%,cover!important;
  color:#07182f!important;
  box-shadow:inset 0 1px #fff,inset 0 -3px rgba(56,69,80,.62),0 5px 9px rgba(7,20,34,.24)!important;
  text-shadow:0 1px rgba(255,255,255,.76)!important;
}
.cctp-post__save-top--reading.is-active{
  color:#0c50a7!important;
}
.cctp-post__save-top--reading:active{
  transform:translateY(2px);
  box-shadow:inset 0 3px 8px rgba(22,34,45,.34),0 2px 4px rgba(7,20,34,.18)!important;
}
.cctp-post__save-top--reading:disabled{opacity:.62;cursor:wait}
@media(max-width:430px){
  .cctp-post__reading-tools{gap:9px;margin-top:14px}
  .cctp-post__font-size{gap:7px;font-size:14px}
  .cctp-post__font-size select{min-width:88px;min-height:42px;padding-left:10px}
  .cctp-post__save-top--reading{min-width:88px;min-height:42px;padding-inline:14px!important}
}
.cctp-post__content-wrap:not(.is-expanded){
  display:flex;
  align-items:baseline;
  min-width:0;
  gap:5px;
}
.cctp-post__content-wrap:not(.is-expanded) .cctp-post__content{
  display:block;
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  -webkit-line-clamp:unset;
  -webkit-box-orient:initial;
  padding-right:0;
}
.cctp-post__more{
  position:static;
  flex:0 0 auto;
  display:inline;
  padding:0;
  background:transparent;
  color:#65676b;
  font-size:15px;
  font-weight:600;
  line-height:inherit;
  white-space:nowrap;
}
.cctp-post__more[hidden]{display:none!important}
.cctp-post__content-wrap.is-expanded{
  display:block;
}
.cctp-post__content-wrap.is-expanded .cctp-post__content{
  white-space:normal;
  overflow:visible;
}
.cctp-post__title{margin:0;color:var(--cctp-text);font-size:22px;line-height:1.2}
.cctp-post__title-link{color:inherit;text-decoration:none}
.cctp-post__title-link:hover{text-decoration:underline}
.cctp-post__content-wrap.is-expanded .cctp-post__more{
  display:inline-block;
  margin-top:4px;
  color:#65676b;
}
.cctp-post__media{
  display:block;
  width:100%;
  aspect-ratio:4/3;
  margin:0 0 10px;
  padding:0;
  overflow:hidden;
  background:#f0f2f5;
  border:0;
  border-radius:var(--cctp-radius);
  cursor:zoom-in;
}
.cctp-post__media:focus-visible{
  outline:2px solid #3366cc;
  outline-offset:2px;
}
.cctp-post__image{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
}
@media(max-width:720px){
  .cctp-post__media{
    width:calc(100% + 28px);
    margin-left:-14px;
    margin-right:-14px;
    border-radius:0;
  }
}
@media(max-width:430px){
  .cctp-post__content{font-size:19px}
  .cctp-post__more{font-size:14px}
  .cctp-post__media{
    width:calc(100% + 24px);
    margin-left:-12px;
    margin-right:-12px;
  }
}
@media(max-width:390px){
  .cctp-post__content{font-size:19px}
  .cctp-post__media{
    width:calc(100% + 20px);
    margin-left:-10px;
    margin-right:-10px;
  }
}

/* STEP 8 fix: collapsed post preview must be exactly one visual line */
.cctp-post__content-wrap:not(.is-expanded) .cctp-post__content{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  display:block!important;
  max-height:1.45em!important;
}
.cctp-post__content-wrap.is-expanded .cctp-post__content{
  white-space:pre-line!important;
  overflow:visible!important;
  max-height:none!important;
}


/* STEP 14 HOTFIX — restore true viewport fullscreen image viewer */
.cctp-image-viewer {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #000 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0 !important;
}
.cctp-image-viewer[hidden] {
  display: none !important;
}
.cctp-image-viewer__backdrop {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #000 !important;
}
.cctp-image-viewer__image {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #000 !important;
}
.cctp-image-viewer__close {
  position: fixed !important;
  z-index: 2147483001 !important;
  top: max(12px, env(safe-area-inset-top)) !important;
  right: max(12px, env(safe-area-inset-right)) !important;
  width: 46px !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: rgba(229,231,235,.94) !important;
  color: #202124 !important;
  font-size: 30px !important;
  line-height: 1 !important;
}
html.cctp-image-viewer-open,
body.cctp-image-viewer-open {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}
@media (max-width:720px) {
  .cctp-image-viewer,
  .cctp-image-viewer__image {
    width: 100vw !important;
    height: 100dvh !important;
  }
}


/* HOTFIX — edge-to-edge post media/actions + compact 12px action padding */
.cctp-post-action{
  padding:12px!important;
}
@media(max-width:720px){
  .cctp-post__media,
  .cctp-post__actions{
    width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    border-radius:0!important;
  }
}


/* HOTFIX — 3 post actions, save beside identity, edge-to-edge replies */
.cctp-post__save-top{
  margin-left:auto;
  flex:0 0 auto;
  border:0;
  background:transparent;
  color:#3f454c;
  padding:10px 0 10px 12px;
  font:inherit;
  font-weight:700;
  line-height:1.2;
  border-radius:0;
  cursor:pointer;
}
.cctp-post__save-top.is-active{color:#0c45ae}
.cctp-post__actions{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}
@media(max-width:720px){
  .cctp-replies{
    width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  .cctp-reply{
    width:100%!important;
    box-sizing:border-box!important;
    margin-left:0!important;
    margin-right:0!important;
    border-radius:0!important;
  }
}

/* HOTFIX — compact 3-action row: 12px vertical padding only */
.cctp-post-action{
  min-height:0!important;
  padding:12px 0!important;
}



/* V1.2 HOTFIX — listing post actions use Facebook-style blue */
.cctp-post-action,
.cctp-post-action.is-active,
.cctp-post__save-top,
.cctp-post__save-top.is-active{
  color:#0c50a7!important;
}

/* V1.2 HOTFIX — keep reaction counters neutral; only action labels are blue */
.cctp-post-action b[data-count]{
  color:#3f454c!important;
}

/* V1.2 HOTFIX — reaction counters slightly smaller/lighter than action labels */
.cctp-post-action b[data-count]{
  font-size:.9em!important;
  font-weight:500!important;
}

/* V1.2 HOTFIX — full-width metadata-color divider between posts */
@media(max-width:720px){
  .cctp-post{
    position:relative;
    border-bottom:0!important;
  }
  .cctp-post::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:0;
    width:100vw;
    height:2px;
    transform:translateX(-50%);
    background:#6b7280;
    pointer-events:none;
  }
}


/* V1.2 HOTFIX — reply composer cancel X */
.cctp-reply-form__bottom{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:10px;margin-top:8px}
.cctp-reply-form__bottom small{display:block;margin:0;padding:0;color:#6b7280}
.cctp-reply-form__cancel{width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #e5e7eb;background:#f3f4f6;color:#16181d;border-radius:50%;font:700 30px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;padding:0;cursor:pointer}
.cctp-reply-form__cancel:focus-visible{outline:2px solid #1877f1;outline-offset:2px}
.cctp-reply-form__bottom>span[data-reply-count]{font-weight:500;color:#3f454c;white-space:nowrap}
@media(max-width:430px){.cctp-reply-form__bottom{grid-template-columns:minmax(0,1fr) 42px auto auto;gap:8px}.cctp-reply-form__bottom button[type="submit"]{padding-left:14px;padding-right:14px}}

/* Keep the reader-selected size above earlier feed/mobile defaults. */
.cctp-post__content{
  font-size:var(--cctp-post-reading-size,19px)!important;
}
