/* =========================================================
   THE GKMC TIMES — CONTRIBUTOR.CSS
   Reader-contributor account styles: register/login tabs, the
   block-by-block writing editor, submission status badges, and
   the homepage "Write for Us" banner.
   Loaded on: contribute.html, write.html, editor.html, index.html
   ========================================================= */

/* ---------- Contributor system: register/login tabs, block editor, status badges ---------- */
.auth-tabs{ display:flex; gap:8px; margin-bottom:20px; }
.auth-tabs button{
  font-family:var(--utility); font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  padding:9px 18px; border:1px solid var(--rule-strong); border-radius:var(--radius-sm); background:none; cursor:pointer;
}
.auth-tabs button.active{ background:var(--ink); color:var(--paper); }
.auth-panel{ max-width:460px; margin:0 auto; }

.block-editor{ border:1px solid var(--rule); background:var(--paper-dim); padding:4px; }
.block-toolbar{ display:flex; gap:6px; flex-wrap:wrap; padding:10px; border-bottom:1px solid var(--rule); }
.block-toolbar button{
  font-family:var(--utility); font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
  padding:7px 12px; border:1px solid var(--rule-strong); border-radius:var(--radius-sm); background:var(--paper); cursor:pointer;
}
.block-toolbar button:hover{ border-color:var(--maroon); color:var(--maroon); }
.block-list{ padding:14px; display:flex; flex-direction:column; gap:12px; }
.block-item{ position:relative; border:1px solid var(--rule); border-radius:var(--radius-sm); background:var(--paper); padding:14px 44px 14px 14px; }
.block-item textarea{ width:100%; border:none; font-family:var(--body); font-size:1rem; resize:vertical; min-height:70px; background:none; }
.block-item textarea:focus{ outline:none; }
.block-item.is-heading textarea{ font-family:var(--display); font-size:1.3rem; font-weight:600; min-height:44px; }
.block-item .block-label{ font-family:var(--utility); font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--maroon); margin-bottom:6px; display:block; }
.block-item .block-remove{
  position:absolute; top:10px; right:10px; width:26px; height:26px; border-radius:50%; border:1px solid var(--rule-strong);
  background:var(--paper); cursor:pointer; color:var(--maroon); font-size:14px; line-height:1; display:flex; align-items:center; justify-content:center;
}
.block-item .block-remove:hover{ background:var(--maroon); color:var(--paper); border-color:var(--maroon); }
.block-item.is-image img{ max-width:100%; border-radius:var(--radius-sm); display:block; margin-bottom:8px; }
.block-item.is-image input[type="text"]{
  width:100%; padding:8px 10px; border:1px solid var(--rule); border-radius:var(--radius-sm); font-family:var(--utility); font-size:12.5px; background:var(--paper-dim);
}
.block-empty{ font-family:var(--body); font-size:.9rem; color:var(--steel); text-align:center; padding:20px; }

.status-badge{
  font-family:var(--utility); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  padding:4px 10px; border-radius:20px; white-space:nowrap;
}
.status-badge.pending{ background:rgba(180,140,20,.14); color:#8A6A10; }
.status-badge.approved{ background:rgba(60,110,60,.14); color:#2E5E33; }
.status-badge.rejected{ background:rgba(122,31,43,.1); color:var(--maroon); }

.submission-item{ border:1px solid var(--rule); border-radius:var(--radius-sm); padding:14px 16px; margin-bottom:12px; background:var(--paper); }
.submission-item-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:6px; }
.submission-item-head strong{ font-family:var(--body); font-size:1rem; }
.submission-meta{ font-family:var(--utility); font-size:12px; color:var(--steel); }
.submission-note{ font-family:var(--body); font-size:.9rem; color:var(--ink-soft); margin-top:8px; padding-top:8px; border-top:1px dashed var(--rule); }
.pending-review-item{ border:1px solid var(--rule); border-radius:var(--radius-sm); padding:16px 18px; margin-bottom:16px; background:var(--paper); }
.pending-review-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.pending-review-head h4{ font-family:var(--display); font-size:1.2rem; margin:0 0 4px; }
.pending-review-body{ font-family:var(--body); font-size:.92rem; color:var(--ink-soft); margin:10px 0; max-height:220px; overflow-y:auto; border:1px solid var(--rule); padding:10px 12px; border-radius:var(--radius-sm); background:var(--paper-dim); }
.pending-review-body p{ margin:0 0 10px; }
.pending-review-body img{ max-width:100%; border-radius:var(--radius-sm); }
.pending-review-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:10px; }
.btn-approve{ background:#2E5E33; color:var(--paper); border:none; padding:10px 20px; border-radius:var(--radius-sm); font-family:var(--utility); font-weight:700; text-transform:uppercase; font-size:12.5px; letter-spacing:.04em; cursor:pointer; }
.btn-approve:hover{ background:#254E29; }
.btn-reject{ background:none; color:var(--maroon); border:1px solid var(--maroon); padding:10px 20px; border-radius:var(--radius-sm); font-family:var(--utility); font-weight:700; text-transform:uppercase; font-size:12.5px; letter-spacing:.04em; cursor:pointer; }
.btn-reject:hover{ background:var(--maroon); color:var(--paper); }

/* ---------- Homepage "Write for Us" banner ---------- */
.contribute-banner{
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  background: var(--ink); color: var(--paper);
  border-radius: var(--radius-sm);
  padding: 22px 28px;
  margin: 28px 0;
}
.contribute-banner-text{ font-family:var(--utility); }
.contribute-banner-text .kicker-cta{
  display:block; font-size:11.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--maroon-tint); margin-bottom:6px; font-weight:700;
}
.contribute-banner-text strong{
  display:block; font-family:var(--display); font-size:1.5rem; font-weight:600; color:var(--paper); margin-bottom:4px;
}
.contribute-banner-text span{ font-size:14px; color:rgba(255,255,255,.75); }
.contribute-banner .btn{
  background: var(--paper); color: var(--ink); flex-shrink:0; white-space:nowrap;
}
.contribute-banner .btn:hover{ background:var(--maroon); color:var(--paper); box-shadow:none; }
@media (max-width: 620px){
  .contribute-banner{ flex-direction:column; align-items:flex-start; text-align:left; }
}

/* ---------------------------------------------------------