/* Consolidated blog and admin styles migrated from view inline blocks */

.blog-hero {
  background: var(--gradient-hero);
  color: var(--color-white);
  position: relative;
  overflow: hidden;
  padding: clamp(6.5rem, 10vw, 9rem) 0 clamp(4rem, 6vw, 6rem);
}
.blog-hero-glow {
  position: absolute;
  width: 38rem;
  height: 38rem;
  right: -10rem;
  top: -10rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(169, 70, 245, 0.16), transparent 60%);
  pointer-events: none;
}
.blog-section {
  background-color: var(--color-bg-soft);
  padding: 5rem 0;
  min-height: 50vh;
}
.blog-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: #ffffff;
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.3s ease;
}
.blog-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-md); }
.blog-img-wrapper { position: relative; width: 100%; height: 220px; overflow: hidden; background-color: #2b2331; }
.blog-card-img { width:100%; height:100%; object-fit:cover; transition: transform 0.5s ease; }
.blog-card:hover .blog-card-img { transform: scale(1.06); }
.blog-card-body { padding: 1.6rem; display:flex; flex-direction:column; flex-grow:1; }
.blog-meta { font-size:0.78rem; font-weight:600; color:var(--color-muted); margin-bottom:0.75rem; display:flex; align-items:center; gap:0.8rem; }
.blog-card-title { font-family:var(--font-heading); font-weight:900; font-size:1.25rem; line-height:1.3; margin-bottom:0.85rem; color:var(--color-text); transition: color 0.2s ease; }
.blog-card-text { font-size:0.92rem; color:var(--color-muted); line-height:1.6; margin-bottom:1.5rem; flex-grow:1; }
.blog-read-more { font-family:var(--font-heading); font-weight:800; font-size:0.82rem; letter-spacing:0.05em; text-transform:uppercase; color:var(--color-secondary) !important; display:inline-flex; align-items:center; gap:0.35rem; transition: transform 0.2s ease; margin-top:auto; }
.blog-card:hover .blog-read-more { transform: translateX(4px); }
.no-image-banner { width:100%; height:100%; display:flex; align-items:center; justify-content:center; background: linear-gradient(135deg, rgba(43,35,49,0.4), rgba(77,47,99,0.4)); color: rgba(255,255,255,0.25); }

.post-header { background: var(--gradient-hero); color: var(--color-white); position: relative; overflow: hidden; padding: calc(var(--header-height) + 3rem) 0 4rem; }
.post-header-glow { position:absolute; width:42rem; height:42rem; right:-10rem; top:-10rem; border-radius:50%; background: radial-gradient(circle, rgba(255,196,0,0.08), transparent 60%); pointer-events:none; }
.post-cover-container { max-width:900px; margin:-2.5rem auto 3rem; position:relative; z-index:5; }
.post-cover-image { width:100%; max-height:480px; object-fit:cover; object-position:center; border-radius:var(--radius-lg); border:1px solid rgba(255,255,255,0.15); box-shadow:var(--shadow-md); }
@media (max-width:768px) { .post-cover-image { max-height:260px; } .post-cover-container { margin-top:-1.5rem; margin-bottom:1.5rem; } }
.post-content-section { background-color: var(--color-bg); padding-bottom:7rem; }
.post-body-container { max-width:780px; margin:0 auto; padding:0 15px; }
.post-meta-details { font-size:0.88rem; color: rgba(255,255,255,0.72); display:flex; flex-wrap:wrap; gap:1.5rem; font-weight:600; }
.post-meta-details span { display:inline-flex; align-items:center; gap:0.35rem; }
.btn-back-feed { color: rgba(255,255,255,0.6) !important; font-family:var(--font-heading); font-weight:700; font-size:0.82rem; text-transform:uppercase; letter-spacing:0.06em; display:inline-flex; align-items:center; gap:0.45rem; transition: color 0.2s ease, transform 0.2s ease; margin-bottom:2rem; }
.btn-back-feed:hover { color: var(--color-primary) !important; transform: translateX(-4px); }
.post-rendered-body { font-family: var(--font-body); color: var(--color-text); line-height: 1.8; font-size: 1.12rem; }
.post-rendered-body h1, .post-rendered-body h2, .post-rendered-body h3, .post-rendered-body h4 { font-family: var(--font-heading); color: var(--color-bg-dark); font-weight:850; margin-top:2.2rem; margin-bottom:1rem; line-height:1.25; letter-spacing:-0.02em; }
.post-rendered-body h1 { font-size:2rem; }
.post-rendered-body h2 { font-size:1.6rem; border-bottom:1px solid var(--color-border); padding-bottom:0.5rem; }
.post-rendered-body h3 { font-size:1.3rem; }
.post-rendered-body p { margin-bottom:1.6rem; }
.post-rendered-body blockquote { border-left:4px solid var(--color-secondary); background-color:var(--color-bg-soft); padding:1rem 1.5rem; margin:2rem 0; border-radius:0 var(--radius-sm) var(--radius-sm) 0; color:var(--color-muted); font-style:italic; }
.post-rendered-body img { max-width:100%; height:auto; border-radius:var(--radius-md); margin:2rem 0; border:1px solid var(--color-border); box-shadow:var(--shadow-sm); }
.post-rendered-body code { background-color:#f1ecf7; color:var(--color-secondary-dark); padding:0.15rem 0.35rem; border-radius:4px; font-size:0.9em; font-family:SFMono-Regular, Menlo, Monaco, Consolas, monospace; }
.post-rendered-body pre { background-color:#2b2331; color:#f8f6f9; padding:1.25rem; border-radius:var(--radius-sm); overflow-x:auto; margin:1.8rem 0; }
.post-rendered-body pre code { background-color:transparent; color:inherit; padding:0; font-size:0.9em; }
.post-rendered-body ul, .post-rendered-body ol { margin-bottom:1.6rem; padding-left:1.5rem; }
.post-rendered-body li { margin-bottom:0.45rem; }

/* Admin area shared styles (consolidated) */
.admin-wrapper { display:flex; min-height:100vh; }
.admin-sidebar { width:260px; background-color:#1f1a26; color:#eae6f0; flex-shrink:0; padding:1.5rem 1rem; display:flex; flex-direction:column; border-right:1px solid rgba(255,255,255,0.05); z-index:100; }
.sidebar-brand { display:flex; align-items:center; gap:0.5rem; margin-bottom:2.5rem; padding:0 0.5rem; }
.sidebar-logo { width:140px; height:auto; }
.sidebar-menu { list-style:none; padding:0; margin:0; flex-grow:1; }
.menu-header { font-family:var(--font-heading); font-size:0.72rem; font-weight:800; text-transform:uppercase; letter-spacing:0.1em; color:rgba(255,255,255,0.35); margin-bottom:0.75rem; padding-left:0.75rem; }
.menu-item { margin-bottom:0.35rem; }
.menu-link { display:flex; align-items:center; gap:0.75rem; padding:0.65rem 0.85rem; color:rgba(255,255,255,0.7); text-decoration:none; font-weight:600; font-size:0.9rem; border-radius:10px; transition: all 0.2s ease; }
.menu-link:hover { background: rgba(255,255,255,0.05); color:#fff; }
.menu-link.active { background: var(--color-primary); color:#191620; }
.menu-link.disabled-link { opacity:0.45; cursor:not-allowed; }
.sidebar-footer { border-top:1px solid rgba(255,255,255,0.08); padding-top:1.25rem; margin-top:2rem; }
.admin-content { flex-grow:1; padding:2.2rem; display:flex; flex-direction:column; }
.content-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:2rem; }
.content-title { font-family:var(--font-heading); font-weight:800; font-size:1.6rem; margin:0; color:var(--text-dark); }
.admin-card { background-color:#ffffff; border:1px solid rgba(22,21,28,0.08); border-radius:14px; box-shadow:var(--shadow-sm); padding:1.75rem; margin-bottom:2rem; }
.metric-card { background:var(--card-bg); border:1px solid rgba(22,21,28,0.08); border-radius:12px; padding:1.25rem; display:flex; align-items:center; gap:1rem; box-shadow:var(--shadow-sm); height:100%; }
.post-thumbnail { width:54px; height:40px; border-radius:6px; object-fit:cover; border:1px solid rgba(22,21,28,0.08); }
.no-image-placeholder { width:54px; height:40px; border-radius:6px; background:#eee; display:flex; align-items:center; justify-content:center; color:var(--color-muted); font-size:0.85rem; border:1px dashed rgba(22,21,28,0.08); }
.badge-status { font-size:0.75rem; font-weight:700; padding:0.25rem 0.65rem; border-radius:6px; display:inline-flex; align-items:center; gap:0.25rem; }
.badge-published { background: rgba(40,200,64,0.1); color:#1b8c2d; border:1px solid rgba(40,200,64,0.2); }
.badge-draft { background: rgba(255,196,0,0.1); color:#a67f00; border:1px solid rgba(255,196,0,0.2); }
.btn-action { width:32px; height:32px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(22,21,28,0.08); background:#ffffff; color:var(--text-dark); transition:all 0.2s ease; text-decoration:none; }
.btn-action-edit:hover { background: rgba(22,21,28,0.05); border-color:var(--text-muted); }
.btn-action-delete { color:#dc3545; border-color: rgba(220,53,69,0.15); background: rgba(220,53,69,0.02); }
.btn-action-delete:hover { background:#dc3545; color:#fff; border-color:#dc3545; }
.user-pill { display:flex; align-items:center; gap:0.5rem; font-size:0.85rem; font-weight:600; background: rgba(255,255,255,0.06); padding:0.4rem 0.8rem; border-radius:999px; border:1px solid rgba(255,255,255,0.05); }
.user-pill-avatar { width:22px; height:22px; border-radius:50%; background:var(--color-primary); color:#191620; display:flex; align-items:center; justify-content:center; font-size:0.75rem; font-weight:800; }
.role-text-sidebar { font-size:0.68rem; color:var(--color-primary); text-transform:uppercase; font-weight:800; letter-spacing:0.05em; }
.form-label-custom { font-family:var(--font-heading); font-weight:700; font-size:0.88rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--color-muted); margin-bottom:0.5rem; }
.form-control-custom, .form-select-custom { background:#fff !important; border:1px solid rgba(22,21,28,0.08) !important; border-radius:8px; color:var(--color-text) !important; padding:0.65rem 0.85rem; font-size:0.95rem; }
.form-control-custom:focus, .form-select-custom:focus { border-color: var(--color-secondary) !important; box-shadow: 0 0 0 0.25rem rgba(169,70,245,0.08) !important; }
.glass-card { background: #ffffff; border-radius: var(--radius-md); padding: 2.2rem; box-shadow: 0 15px 45px rgba(0,0,0,0.06); }
.cover-image-preview { max-width:280px; border-radius:10px; border:1px solid rgba(22,21,28,0.08); margin-top:1rem; object-fit:cover; }
.btn-nav-custom { font-size:0.88rem; padding:0.55rem 1.1rem; border-radius:999px; display:inline-flex; align-items:center; gap:0.45rem; }
.btn-back { background:transparent; border:1px solid rgba(22,21,28,0.06); color:var(--color-muted); }
