/* blog.css — extends style.css. Loaded after it, so every color here comes
   from the same :root tokens defined in style.css. No new colors introduced. */

/* ===== Public blog ===== */
.blog-hero{padding:64px 0 24px;}
.blog-hero-lede{max-width:56ch; margin:0 auto; color:var(--ink-soft);}

.blog-list-section{padding:24px 0 80px;}
.blog-empty{color:var(--ink-soft); padding:40px 0;}

.blog-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:20px;
}
.blog-card{
  background:var(--card-bg);
  border:1px solid var(--border);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex; flex-direction:column;
  transition:box-shadow .2s ease, transform .2s ease;
}
.blog-card:hover{box-shadow:0 14px 30px rgba(61,26,79,.1); transform:translateY(-3px);}
.blog-card-photo{
  display:block; aspect-ratio:4/3; background:var(--bg-alt);
}
.blog-card-photo img{width:100%; height:100%; object-fit:cover; display:block;}
.blog-card-photo-fallback{
  width:100%; height:100%; display:flex; align-items:center; justify-content:center;
}
.blog-card-photo-fallback svg{width:40px; height:40px;}
.blog-card-body{padding:22px 22px 26px; display:flex; flex-direction:column; flex:1;}
.blog-card-date{
  font-size:.76rem; text-transform:uppercase; letter-spacing:.08em;
  color:var(--saffron); font-weight:700; margin:0 0 .5em;
}
.blog-card-body h2{font-size:1.25rem; margin:0 0 .3em;}
.blog-card-body h2 a{color:var(--plum);}
.blog-card-body h2 a:hover{color:var(--plum-soft);}
.blog-card-subtitle{color:var(--ink-soft); font-size:.92rem; margin:0 0 .6em;}
.blog-card-excerpt{font-size:.9rem; margin:0 0 1em; flex:1;}
.blog-read-more{font-weight:600; color:var(--plum); font-size:.88rem;}
.blog-read-more:hover{color:var(--saffron);}

.blog-post-section{padding:56px 0 80px;}
.blog-post-wrap{max-width:720px; margin:0 auto;}
.blog-post-wrap h1{margin-bottom:.2em;}
.blog-post-subtitle{font-size:1.15rem; color:var(--ink-soft); margin-top:0;}
.blog-post-date{
  font-size:.8rem; text-transform:uppercase; letter-spacing:.08em;
  color:var(--saffron); font-weight:700; margin-bottom:28px;
}
.blog-post-cover{
  border-radius:var(--radius); overflow:hidden; margin-bottom:32px;
  border:1px solid var(--border);
}
.blog-post-cover img{width:100%; display:block;}
.blog-post-body{font-size:1.05rem; line-height:1.75; color:var(--ink);}
.blog-post-body h2{margin-top:1.6em;}
.blog-post-body h3{margin-top:1.4em; color:var(--plum);}
.blog-post-body p{margin-bottom:1.2em; color:var(--ink);}
.blog-post-body ul, .blog-post-body ol{margin:0 0 1.2em; padding-left:1.4em; color:var(--ink);}
.blog-post-body a{color:var(--plum); text-decoration:underline;}
.blog-post-body img{max-width:100%; border-radius:var(--radius); margin:1em 0;}
.blog-post-body blockquote{
  border-left:4px solid var(--saffron); margin:1.4em 0; padding:.4em 1.2em;
  color:var(--ink-soft); font-style:italic;
}
.blog-post-cta{margin-top:16px;}

@media (max-width:900px){
  .blog-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){
  .blog-grid{grid-template-columns:1fr;}
}

/* ===== Donate status page ===== */
.donate-status-section{padding:100px 0;}
.donate-status-wrap{max-width:520px; margin:0 auto;}
.donate-status-wrap h1{margin-bottom:.4em;}
.donate-status-wrap p{margin-bottom:28px;}

/* ===== Admin ===== */
.admin-body{background:var(--ivory); min-height:100vh;}

.admin-topbar{
  background:var(--plum-deep); color:var(--on-dark);
  padding:16px 0; margin-bottom:32px;
}
.admin-topbar-inner{display:flex; justify-content:space-between; align-items:center;}
.admin-topbar .brand-word{
  font-family:var(--font-display); color:var(--ivory); font-weight:600; font-size:1.05rem;
}
.admin-topbar .brand-word em{
  font-style:normal; color:var(--saffron-light); font-size:.7rem;
  text-transform:uppercase; letter-spacing:.12em; margin-left:.4em;
}
.admin-topbar-actions{display:flex; gap:20px; align-items:center;}
.admin-link{color:var(--on-dark); font-size:.9rem; font-weight:500;}
.admin-link:hover{color:var(--saffron-light);}
.admin-link-btn{background:none; border:none; cursor:pointer; font:inherit; padding:0;}
.admin-link-danger{color:#C97A5C;} /* muted terracotta — closest warm neutral to the palette, used only for destructive text */
.admin-inline-form{display:inline;}

.admin-main{padding-bottom:80px;}
.admin-main-narrow{max-width:760px;}
.admin-main-head{
  display:flex; justify-content:space-between; align-items:center; margin-bottom:28px;
}
.admin-empty{color:var(--ink-soft); padding:30px 0;}

.admin-table{width:100%; border-collapse:collapse; background:var(--card-bg); border-radius:var(--radius); overflow:hidden;}
.admin-table th, .admin-table td{
  text-align:left; padding:14px 16px; border-bottom:1px solid var(--border); font-size:.92rem;
}
.admin-table th{
  background:var(--bg-alt); font-size:.76rem; text-transform:uppercase;
  letter-spacing:.06em; color:var(--ink-soft);
}
.admin-view-link{font-size:.8rem; margin-top:2px;}
.admin-view-link a{color:var(--ink-soft);}
.admin-table-actions{display:flex; gap:14px;}

.status-pill{
  display:inline-block; padding:.3em .8em; border-radius:999px;
  font-size:.76rem; font-weight:700; text-transform:capitalize;
}
.status-published{background:var(--plum); color:var(--ivory);}
.status-draft{background:var(--bg-alt); color:var(--ink-soft); border:1px solid var(--border);}

/* Login */
.admin-login-wrap{
  min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px;
}
.admin-login-card{
  background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius);
  padding:40px 36px; max-width:400px; width:100%;
}
.admin-login-title{margin-top:.2em;}
.admin-back-link{margin-top:20px; font-size:.88rem;}
.admin-back-link a{color:var(--ink-soft);}

/* Shared form styling */
.admin-error{
  background:#FBEAE3; border:1px solid #E3B29B; color:#8A4A30;
  padding:12px 16px; border-radius:10px; font-size:.9rem; margin-bottom:20px;
}
.admin-form{display:flex; flex-direction:column; gap:6px;}
.admin-form label{
  font-weight:600; font-size:.88rem; color:var(--plum); margin-top:14px;
}
.admin-form label:first-child{margin-top:0;}
.admin-optional{font-weight:400; color:var(--ink-soft); font-size:.82rem;}
.admin-form input[type="text"],
.admin-form input[type="password"],
.admin-form input[type="file"],
.admin-form textarea{
  font:inherit; font-size:.95rem; padding:.75em .9em;
  border:1.5px solid var(--border); border-radius:10px; background:var(--ivory);
  color:var(--ink); width:100%;
}
.admin-form textarea{resize:vertical; font-family:var(--font-body); line-height:1.6;}
.admin-form input:focus, .admin-form textarea:focus{
  outline:none; border-color:var(--saffron);
}
.admin-form-submit{width:100%; justify-content:center; margin-top:20px;}
.admin-current-image{
  display:flex; align-items:center; gap:12px; margin-bottom:8px;
  font-size:.82rem; color:var(--ink-soft);
}
.admin-current-image img{width:64px; height:48px; object-fit:cover; border-radius:6px; border:1px solid var(--border);}
.admin-form-actions{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  margin-top:24px; flex-wrap:wrap;
}
.admin-status-toggle{
  display:flex; align-items:center; gap:8px; font-weight:600; font-size:.9rem; color:var(--ink);
}
.admin-status-toggle input{width:auto;}