/* ============================
   NFHB Forum (scoped styles)
   Single-column layout
   ============================ */

#forum-app {
  --base:#E5EDFF;
  --ink:#1a1a1a;
  --muted:#6b7280;
  --white:#ffffff;
  --card-shadow:0 6px 18px rgba(16,24,40,.08);
  --radius:16px;
    font-size: 12px;
}

/* Container */
#forum-app .wrap{
  max-width:1100px;
  margin:32px auto;
  padding:0 16px;
}

/* Header + Title */
#forum-app .header{ margin-bottom:12px; }
#forum-app .center-title{ text-align:center; margin:0; }
#forum-app .subtle{ color:var(--muted); font-size:.95rem; text-align:center; }

/* Cards (soft panel for info, regular for lists) */
#forum-app .card{
  background:var(--white);
  border-radius:var(--radius);
  box-shadow:var(--card-shadow);
  padding:18px;
  margin-bottom:18px;
}
#forum-app .card.soft{
  background:var(--base);
  border:1px solid rgba(0,0,0,.05);
}

/* Buttons */
#forum-app .btn, .btn {
  background-color:#4CAF50;   /* green */
  border:none;
  color:#fff;
  padding:4px 16px;           /* a bit taller than 2px, shorter than 10px */
  font-size:12px;             /* modest size, easy to read */
  font-weight:500;
  text-decoration:none;
  margin-left:20px;
  cursor:pointer;
  border-radius:25px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1.3;
}

#forum-app .btn:hover {
  background-color:#45a049;
}

#forum-app .btn[disabled] {
  opacity:.6;
  cursor:not-allowed;
  background-color:#9ccc9c;
}

#forum-app .btn.secondary {
  background-color:#555;
  margin-left:20px;
}

#forum-app .btn.secondary:hover {
  background-color:#333;
}

#forum-app .btn.ghost {
  background-color:transparent;
  border:1px solid #4CAF50;
  color:#4CAF50;
  margin-left:20px;
}

#forum-app .btn.ghost:hover {
  background-color:#4CAF50;
  color:#fff;
}

/* “Table” list of submissions */
#forum-app .section-title{ font-weight:700; margin:0 0 8px; }
#forum-app .legend{ font-size:.85rem; color:var(--muted); margin-top:2px; }
#forum-app .table{ width:100%; border-collapse:separate; border-spacing:0 10px; }
#forum-app .table th{ text-align:left; font-size:.9rem; color:var(--muted); font-weight:600; padding:0 10px 6px 10px; }

#forum-app .row-card{ background:var(--white); box-shadow:var(--card-shadow); border-radius:14px; overflow:hidden; }
#forum-app .row{
  display:grid;
  grid-template-columns:80px auto 160px 160px 160px;
  gap:10px; align-items:center;
  padding:12px 10px;
}
#forum-app .row + .row{ border-top:1px solid rgba(0,0,0,.06); }
#forum-app .cell-actions{ display:flex; gap:8px; }
#forum-app .title-strong{ font-weight:700; }

/* Badges */
#forum-app .badge{
  display:inline-block; padding:6px 10px; border-radius:999px;
  font-size:.8rem; font-weight:700; background:#eef2ff; color:#3730a3;
  border:1px solid rgba(55,48,163,.15);
}
#forum-app .badge.draft{ background:#fff7ed; color:#9a3412; border-color:rgba(154,52,18,.2); }
#forum-app .badge.submitted{ background:#ecfeff; color:#0e7490; border-color:rgba(14,116,144,.2); }
#forum-app .badge.accepted{ background:#ecfdf5; color:#166534; border-color:rgba(22,101,52,.2); }
#forum-app .badge.rejected{ background:#fef2f2; color:#7f1d1d; border-color:rgba(127,29,29,.2); }
#forum-app .badge.underreview{ background:#f5f3ff; color:#4c1d95; border-color:rgba(76,29,149,.2); }
#forum-app .badge.withdrawn{ background:#f8fafc; color:#475569; border-color:rgba(71,85,105,.2); }

tr.alt {
  background-color: #f9fbff; /* light blueish-gray */
}

/* ===== Submission form utilities ===== */
#forum-app .container-900 { width:900px; margin:0 auto; }
#forum-app .panel-blue {
    background: var(--base);
    border-radius: var(--radius);
    box-shadow: var(--card-shadow);
    padding: 16px 18px;
}
#forum-app .panel-title { font-weight:800; font-size:120%; margin-bottom:10px; }
#forum-app .mb-sm { margin-bottom:10px; }
#forum-app .mb-md { margin-bottom:18px; }
#forum-app .mb-lg { margin-bottom:24px; }

/* Table-like rows for label/value pairs */
#forum-app .rowtable       { display:table; width:100%; table-layout:fixed; }
#forum-app .rowtable-row   { display:table-row; }
#forum-app .rowtable-cell  { display:table-cell; padding:6px 8px; vertical-align:middle; }
#forum-app .rowtable-cell.label { width:32%; }

/* Two-up (side-by-side) panels */
#forum-app .two-up { display:flex; gap:10px; }
#forum-app .two-up .panel-blue { flex:1; }

#forum-app .form-actions { text-align:left; }
#forum-app .radio-group label { margin-right: 18px; }
#forum-app .presenter-fields { margin-top: 8px; }
#forum-app .hidden { display: none; }
#forum-app .mt-10 { margin-top: 10px; }

/* Make inputs stretch nicely inside panels */
#forum-app .rowtable-cell input[type="text"],
#forum-app .rowtable-cell input[type="email"],
#forum-app .panel-blue select,
#forum-app .panel-blue textarea {
    width: 100%;
    max-width: 100%;
}

/* Flash banners */
#forum-app .flash {
    margin: 10px auto 12px auto;
    padding: 12px 16px;
    border-radius: var(--radius);
    box-shadow: var(--card-shadow);
    border-left: 5px solid;
    font-weight: 600;
}
#forum-app .flash.success { background:#ecfdf5; border-color:#16a34a; color:#166534; }
#forum-app .flash.error   { background:#fef2f2; border-color:#b91c1c; color:#7f1d1d; }
#forum-app .flash.info    { background:#eff6ff; border-color:#2563eb; color:#1e3a8a; }
#forum-app .flash.warn    { background:#fffbeb; border-color:#d97706; color:#92400e; }

/* Abtract Editor */
#forum-app #abstractText{
    width: 100%;
    min-height: 240px;
    padding: 10px 12px;
    box-sizing: border-box;
    resize: vertical;
    font-size: 12px;
}

#forum-app .wordcounter {
    margin-bottom: 6px;
    color: var(--muted);
}

#forum-app .wordcounter.overlimit {
    color: #b91c1c;    /* red */
    font-weight: 700;
}

/* ===== In-section upload alerts (match site look) ===== */
#forum-app #upload-messages .success-box,
#forum-app #upload-messages .error-box{
    margin: 10px 0 12px;
    padding: 10px 12px;
    border-radius: var(--radius);
    box-shadow: var(--card-shadow);
    border-left: 5px solid;
    font-weight: 600;
}
#forum-app #upload-messages .success-box{ background:#ecfdf5; border-color:#16a34a; color:#166534; }
#forum-app #upload-messages .error-box  { background:#fef2f2; border-color:#b91c1c; color:#7f1d1d; }

/* Reusable info popup (scoped) */
#forum-app .info-popup {
    position: fixed;
    top: 20%;
    left: 50%;
    transform: translate(-50%, -20%);
    background: #fff;
    border: 1px solid #e6eaf8;
    padding: 20px;
    box-shadow: 0 8px 24px rgba(16,24,40,.2);
    z-index: 10000;
    max-width: 480px;
    border-radius: var(--radius);
    line-height: 1.5;
}
#forum-app .info-popup button {
    margin-top: 10px;
    padding: 6px 12px;
    background: #007BFF;
    color: #fff;
    border: 0;
    border-radius: 8px;
    cursor: pointer;
}
#forum-app .info-popup button:hover { background:#0056b3; }

/* Preview modal */
#forum-app .preview-popup{
    position: fixed;
    top: 12%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10000;
    background: #fff;
    border: 1px solid #e6eaf8;
    border-radius: var(--radius);
    box-shadow: var(--card-shadow);
    width: min(90vw, 760px);
    padding: 12px 14px;
}
#forum-app .preview-header{
    display:flex; align-items:center; justify-content:space-between;
    margin-bottom:8px;
}
#forum-app .preview-close{
    background:transparent; border:0; font-size:22px; line-height:1; cursor:pointer;
}
#forum-app .preview-body .section{
    background: var(--base);
    border-radius: var(--radius);
    padding: 12px 14px;
    margin-bottom: 10px;
}
#forum-app .preview-body .section h4{
    margin: 0 0 6px 0;
}
/* Preview modal (now appended to <body>, not #forum-app) */
.preview-popup{
    position: fixed;
    top: 12%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10000;
    background: #fff;
    border: 1px solid #e6eaf8;
    border-radius: var(--radius);
    box-shadow: var(--card-shadow);
    width: min(90vw, 760px);
    padding: 12px 14px;

    /* keep the nice scrollbar */
    max-height: 80vh;
    overflow: auto;
}

.preview-header{
    display:flex; align-items:center; justify-content:space-between;
    margin-bottom:8px;
    cursor: move;            /* optional: shows it’s draggable */
    user-select: none;       /* optional: avoid text selection while dragging */
}

.preview-close{
    background:transparent; border:0; font-size:22px; line-height:1; cursor:pointer;
}

.preview-body .section{
    background: var(--base);
    border-radius: var(--radius);
    padding: 12px 14px;
    margin-bottom: 10px;
}

.preview-body .section h4{
    margin: 0 0 6px 0;
}

/* various status messages */
/* Upload Status Base look */
#forum-app .upload-control .status {
    color: #334155;            /* default (neutral) */
}

/* Upload Status States */
#forum-app .upload-control .status.is-busy  { color: #733e9e; }  /* Magenta */
#forum-app .upload-control .status.is-ok    { color: #4CAF50; }  /* green */
#forum-app .upload-control .status.is-error { color: #7f1d1d; }  /* red */
.filewarn { color: #fc031c; padding-top:5px;}

/* --- My Submissions: override the global 5-col grid inside this section --- */
#forum-app .submissions-grid .row{
    display: grid;
    /* Title (↓), Status, Updated, Actions (↑) */
    grid-template-columns: minmax(300px, 1.6fr) 140px 160px minmax(320px, 1.4fr);
    gap: 12px;
    align-items: center;
    padding: 10px 12px;
}

/* Header row tint + typography */
#forum-app .submissions-grid .legend-row {
    background: #e9f0ff;
    color: #2b3a67;
    font-weight: 600;
    border: 1px solid #dbe2f2;
    border-radius: 10px;
    margin-bottom: 6px;
}

/* Row hover */
#forum-app .submissions-grid .row:not(.legend-row):hover {
    background: #f6f8ff;
}

/* Status centered, tidy meta text */
#forum-app .submissions-grid .cell[data-label="Status"],
#forum-app .submissions-grid .legend-row .cell:nth-child(2) {
    text-align: center;
}
#forum-app .submissions-grid .title-strong { font-weight: 700; line-height: 1.25; }
#forum-app .submissions-grid .legend { color: #667089; font-size: .92rem; margin-top: 2px; }

/* Allow grid children to shrink properly and avoid weird clipping */
#forum-app .submissions-grid .cell{
    min-width: 0;                 /* critical for CSS grid text clipping issues */
}

/* Give the Title cell a little inset so letters aren't hard against the edge */
#forum-app .submissions-grid .cell:first-child{
    padding-left: 8px;
}

/* Nudge the Title column right a bit */
#forum-app .submissions-grid .row:not(.legend-row) .cell:first-child {
    padding-left: 2em;   /* or use 20px if you prefer pixels */
}

/* Keep header aligned with body rows */
#forum-app .submissions-grid .legend-row .cell:first-child {
    padding-left: 2em;   /* use the same value as above */
}

/* Keep long titles neat without chopping the first characters */
#forum-app .submissions-grid .title-strong{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* up to 2 lines */
    -webkit-box-orient: vertical;
    white-space: normal;
}

/* Badge colors (keep your classes, add some pop) */
.badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:.85rem;line-height:1;font-weight:700;}
.badge.draft{background:#fff7e6;color:#a35a00;border:1px solid #ffdfad;}
.badge.submitted{background:#e8f3ff;color:#114a9b;border:1px solid #cfe3ff;}
.badge.underreview{background:#f1f0ff;color:#4a34a3;border:1px solid #dedbff;}
.badge.accepted{background:#e8fff3;color:#0f7a3c;border:1px solid #c8f2dd;}
.badge.rejected{background:#ffecec;color:#a11212;border:1px solid #ffcdcd;}
.badge.withdrawn{background:#f7f7f7;color:#6d6d6d;border:1px solid #e6e6e6;}

/* Buttons */
#forum-app .submissions-grid .btn.ghost { border-color:#b9c7ff;color:#2b3a67; }
#forum-app .submissions-grid .btn.ghost:hover { background:#eef3ff; }

/* Poster Competition: checkbox/text + right-aligned sponsor on same line */
#forum-app #posterOptionsBox .comp-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 8px;
}

#forum-app #posterOptionsBox .comp-label {
    display: flex;
    gap: .5rem;
    align-items: center;
    margin: 0;
}

#forum-app #posterOptionsBox .sponsor-inline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

#forum-app #posterOptionsBox .sponsor-inline strong {
    font-weight: 600;
    color: var(--header-fg, #2b3a67);
}

#forum-app #posterOptionsBox .sponsor-logo {
    height: 77px;
    width: auto;
    vertical-align: middle;
}

/* Make the contenteditable look/feel like your inputs */
#forum-app .rte {
  min-height: 8rem;
  padding: .5rem .6rem;
  line-height: 1.45;
  overflow-y: auto;
  white-space: pre-wrap;
}
#forum-app .rte:empty:before { content: attr(data-placeholder); color:#999; }
#forum-app .form-control.editing { border: 2px solid #4CAF50; background:#f8fff8; }
/* Authors/Abstract submit fields are now hidden backing fields */
#authors_input,
#abstractText { display: none !important; }



/* show a hint when the contenteditable RTE is actually empty */
.rte[contenteditable="true"][data-placeholder]:empty::before {
    content: attr(data-placeholder);
    color: #6b7280;   /* subtle gray */
    font-style: italic;
    pointer-events: none;
}

.rte-lite.rte-disabled {
  background: #f8fafc;
  color: #6b7280;
  border-color: #e5e7eb;
  cursor: not-allowed;
}
.rte-lite.rte-disabled em { font-style: italic; color: inherit; }
.rte-lite.rte-disabled:focus { outline: none; box-shadow: none; }
/* Show the circle-with-slash cursor on locked (finalized) fields */
.lock-cur,
.lock-cur textarea,
.lock-cur input[type="text"],
.lock-cur [contenteditable="false"],
textarea[readonly], input[readonly],
textarea[disabled], input[disabled] {
    cursor: not-allowed !important;
}
/* make previews + non-editable RTEs show the not-allowed cursor */
.lock-cur .render-preview,
.lock-cur [contenteditable="false"] { cursor: not-allowed !important; }

.wordcounter { font-size: 0.9em; opacity: 0.85; }
#invitedSummaryText.limit-reached { outline: 2px solid #c64040; }

/* Bigger, clearer typing size just for author & abstract textareas */
/* #forum-app textarea[name="authors"],
#forum-app textarea[name="abstract"] {
  font-size: 16px;              
  line-height: 1.6;
  font-family: "Segoe UI", system-ui, -apple-system, Roboto,
               "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}
*/

/* Optional: all forum textareas, if you want it everywhere */
/* #forum-app textarea {
  font-size: 16px;
  line-height: 1.6;
  font-family: "Segoe UI", system-ui, -apple-system, Roboto,
               "Helvetica Neue", Arial, "Noto Sans", sans-serif;
}
*/
/* Small screens: stack, center sponsor */
@media (max-width: 640px) {
    #forum-app #posterOptionsBox .comp-line {
        flex-wrap: wrap;
    }
    #forum-app #posterOptionsBox .sponsor-inline {
        margin-left: auto;
    }
}

/* AuthAb textarea highlighter */
#forum-app .form-control.editing {
  border: 2px solid #4CAF50;
  background: #f8fff8;
  outline: none;
}
/* ——— Make the editor text larger (actual typing area) ——— */
/* #forum-app .rte,
#forum-app .form-control.rte {
  font-size: 16px !important;  
  line-height: 1.6 !important;
  font-family: "Segoe UI", system-ui, -apple-system, Roboto,
               "Helvetica Neue", Arial, "Noto Sans", sans-serif !important;
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}
*/
/* ——— If Word paste uses <sup>TM</sup>, don’t make superscripts tiny ——— */
/* #forum-app .rte sup,
#forum-app .rte sub {
  font-size: 0.9em;              
  line-height: 0;               
}
#forum-app .rte sup { vertical-align: text-top; }
#forum-app .rte sub { vertical-align: text-bottom; }
*/
/* Optional: same visual in the preview block too */
/* #forum-app .render-preview sup,
#forum-app .render-preview sub {
  font-size: 0.9em;
  line-height: 0;
}
*/
/* ===== My Submissions tweaks ===== */

/* Center the "Actions" header label (4th col in header row) */
#forum-app .submissions-grid .legend-row .cell:nth-child(4) {
    text-align: center;
}

/* Center the actions content and give links breathing room */
#forum-app .submissions-grid .cell-actions {
    display: flex;              /* already set, re-assert just in case */
    justify-content: center;    /* center the buttons horizontally */
    gap: 16px;                  /* space between links */
}

/* Remove global left margin on buttons inside the actions cell, add a bit more L/R padding */
#forum-app .submissions-grid .cell-actions .btn {
    margin-left: 0;
    padding: 4px 20px;          /* slightly more left/right buffering */
}

/* Status as colored text (not a pill/button) */
#forum-app .submissions-grid .status {
    font-weight: 700;
    background: none;
    border: 0;
    padding: 0;
}

/* Map your existing status keys to colors */
#forum-app .submissions-grid .status.draft       { color: #a35a00; } /* brownish */
#forum-app .submissions-grid .status.submitted   { color: #114a9b; } /* blue */
#forum-app .submissions-grid .status.accepted    { color: #0f7a3c; } /* green */
#forum-app .submissions-grid .status.rejected    { color: #a11212; } /* red */
#forum-app .submissions-grid .status.underreview { color: #4a34a3; } /* purple */
#forum-app .submissions-grid .status.withdrawn   { color: #6d6d6d; } /* gray */


/* Responsive: stack nicely */
@media (max-width: 780px){
  #forum-app .submissions-grid .row{ grid-template-columns:1fr; gap:6px; }
}



/* Responsive tweak */
@media (max-width: 720px){
  #forum-app .row{ grid-template-columns:1fr; gap:6px; }
  #forum-app .cell-actions{ justify-content:flex-start; }
  #forum-app .two-up { flex-direction: column; }
}