/* LifeDb post page - Layout A (3 columns). Save as public/assets/css/post-layout-a.css */

:root{
  --ldb-bg:#f4f5f7; --ldb-surface:#fff; --ldb-text:#1f2430; --ldb-muted:#667085;
  --ldb-line:#dfe3e8; --ldb-edge:#cfd4dc; --ldb-accent:#c2410c; --ldb-soft:#fff4ed;
}

/* ---------- logo-only header ---------- */
.ldb-bar{display:flex;align-items:center;justify-content:space-between;background:var(--ldb-surface);border-bottom:1px solid var(--ldb-edge);box-shadow:0 1px 6px rgba(0,0,0,.12);padding:10px 20px;position:relative;z-index:10}
.ldb-home{display:inline-flex;align-items:center;gap:10px;color:var(--ldb-text);font-weight:700;font-size:20px;text-decoration:none}
.ldb-home:hover{color:var(--ldb-accent);text-decoration:none}
.ldb-home img{height:44px;width:auto;border-radius:6px}

/* ---------- page shell ---------- */
.ldb-post{background:var(--ldb-bg);padding:24px 0 48px;color:var(--ldb-text);
  font-family:"Noto Sans Devanagari","Nirmala UI","Mangal","Segoe UI",system-ui,Arial,sans-serif}
.ldb-grid{display:grid;grid-template-columns:240px minmax(0,1fr) 290px;gap:24px;
  max-width:1240px;margin:0 auto;padding:0 16px;align-items:start}
.ldb-grid > *{min-width:0}
.ldb-card{background:var(--ldb-surface);border:1px solid var(--ldb-edge);border-radius:14px}
.ldb-author,.ldb-related{position:sticky;top:16px}
.ldb-muted{color:var(--ldb-muted);font-size:14px}
.ldb-muted a,.ldb-comment-form a{color:var(--ldb-accent);text-decoration:underline}

/* ---------- headings: stop global h1-h6 colour/font from leaking in ---------- */
.ldb-post h1,.ldb-post h2,.ldb-post h3,.ldb-post h4,.ldb-post h5,.ldb-post h6{
  font-family:inherit;color:var(--ldb-text);text-transform:none}
.ldb-post .ldb-side-title{color:var(--ldb-muted);text-transform:uppercase}
.ldb-post .ldb-title{color:var(--ldb-text)}

/* keep the floating social bar (from socialLinks) from covering the right column */
@media (min-width:1001px){.ldb-grid{padding-right:72px}}

/* ---------- flash ---------- */
.ldb-flash{max-width:1240px;margin:0 auto 16px;padding:12px 16px;border-radius:8px}
.ldb-flash-ok{background:#ecfdf3;color:#067647}
.ldb-flash-error{background:#fef3f2;color:#b42318}

/* ---------- author (left) ---------- */
.ldb-author{padding:22px 18px;text-align:center}
.ldb-avatar{width:88px;height:88px;border-radius:50%;object-fit:cover;margin-bottom:10px}
.ldb-author-name{font-size:18px;margin:0 0 4px;font-weight:700}
.ldb-author-bio{color:var(--ldb-muted);font-size:14px;line-height:1.5;margin:0 0 12px}
.ldb-social{list-style:none;margin:0;padding:0;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.ldb-social a{width:36px;height:36px;border:1px solid var(--ldb-edge);border-radius:50%;display:grid;
  place-items:center;color:var(--ldb-muted)}
.ldb-social a:hover{color:var(--ldb-accent);border-color:var(--ldb-accent);text-decoration:none}

/* ---------- article (center) ---------- */
.ldb-article{padding:32px 40px}
.ldb-owner{margin-bottom:16px}
.ldb-chip{display:inline-block;font-size:13px;font-weight:600;color:var(--ldb-accent);
  background:var(--ldb-soft);padding:3px 10px;border-radius:14px}
.ldb-title{font-size:34px;line-height:1.3;margin:12px 0 10px;font-weight:700;letter-spacing:-.01em}
.ldb-meta{color:var(--ldb-muted);font-size:14px;margin-bottom:24px;padding-bottom:16px;
  border-bottom:1px solid var(--ldb-line)}

/* post body: neutralise inline styles pasted from Google Docs / Word */
.ldb-body{font-size:18px;line-height:1.8;overflow-wrap:anywhere}
.ldb-body *{font-family:inherit !important;font-size:inherit !important;line-height:inherit !important;
  color:inherit !important;background:none !important;white-space:normal !important}
.ldb-body p{margin:0 0 1.2em !important}
.ldb-body h2{font-size:26px !important;line-height:1.3 !important;margin:1.6em 0 .5em !important;font-weight:700}
.ldb-body h3{font-size:21px !important;line-height:1.35 !important;margin:1.5em 0 .4em !important;font-weight:700}
.ldb-body h4{font-size:18px !important;font-weight:700;margin:1.3em 0 .4em !important}
.ldb-body a{color:var(--ldb-accent) !important;text-decoration:underline !important;text-underline-offset:3px}
.ldb-body ul,.ldb-body ol{padding-left:1.4em;margin:0 0 1.2em}
.ldb-body li{margin-bottom:.4em}
.ldb-body img{max-width:100% !important;height:auto !important;border-radius:6px;margin:.4em 0}
.ldb-body iframe,.ldb-body video{max-width:100%}
.ldb-body table{display:block;overflow-x:auto;max-width:100%;border-collapse:collapse}
.ldb-body td,.ldb-body th{border:1px solid var(--ldb-line);padding:6px 10px}
.ldb-body blockquote{border-left:4px solid var(--ldb-accent);margin:1.2em 0;padding:.2em 1em;color:var(--ldb-muted)}

.ldb-also{margin:28px 0 0;padding:14px 16px;background:var(--ldb-soft);border-radius:8px;font-size:16px}
.ldb-also a{color:var(--ldb-accent);font-weight:600}

.ldb-react{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:28px;padding-top:18px;
  border-top:1px solid var(--ldb-line)}
.ldb-react form{margin:0}
.ldb-share{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:18px}
.ldb-share span{font-weight:600;margin-right:4px}
.ldb-prevnext{display:flex;justify-content:space-between;gap:10px;margin-top:28px}
.ldb-prevnext a{border:1px solid var(--ldb-edge);padding:10px 16px;border-radius:8px;font-size:14px;color:var(--ldb-text)}
.ldb-prevnext a:hover{border-color:var(--ldb-accent);color:var(--ldb-accent);text-decoration:none}

.ldb-comments h2,.ldb-comment-form h2{font-size:20px;margin:32px 0 14px}
.ldb-comment{display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--ldb-line)}
.ldb-comment img{width:42px;height:42px;border-radius:50%;object-fit:cover}
.ldb-comment p{margin:4px 0 0}

/* ---------- related (right) ---------- */
.ldb-related{padding:18px}
.ldb-side-title{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--ldb-muted);
  margin:0 0 6px;padding-bottom:10px;border-bottom:1px solid var(--ldb-edge);font-weight:700}
.ldb-related > a{display:block;padding:12px 0;border-top:1px solid var(--ldb-line);font-size:15px;
  line-height:1.45;color:var(--ldb-text)}
.ldb-related > .ldb-side-title + a{border-top:0}
.ldb-related > a:hover{color:var(--ldb-accent);text-decoration:none}
.ldb-news{margin-top:20px;padding-top:16px;border-top:1px solid var(--ldb-line)}
.ldb-news p{font-size:14px;color:var(--ldb-muted)}

/* ---------- back to top ---------- */
.ldb-top{display:none;position:fixed;right:18px;bottom:18px;width:42px;height:42px;border-radius:50%;
  background:var(--ldb-accent);color:#fff;place-items:center;cursor:pointer;z-index:20;
  box-shadow:0 2px 8px rgba(0,0,0,.25)}


/* ---------- dark mode ---------- */
html[data-theme="dark"]{
  --ldb-bg:#14161a; --ldb-surface:#1e222a; --ldb-text:#e8eaee; --ldb-muted:#a4adbd;
  --ldb-line:rgba(255,255,255,.26); --ldb-edge:rgba(255,255,255,.5);
  --ldb-accent:#fb923c; --ldb-soft:#2a2018;
}
html[data-theme="dark"] .ldb-flash-ok{background:#12301f;color:#6ce9a6}
html[data-theme="dark"] .ldb-flash-error{background:#3a1613;color:#fda29b}
html[data-theme="dark"] .ldb-post .form-control{background:var(--ldb-bg);color:var(--ldb-text);border-color:var(--ldb-line)}
html[data-theme="dark"] .ldb-post .note-editor{border-color:var(--ldb-line)}
html[data-theme="dark"] .ldb-post .note-editor .note-editable{background:var(--ldb-bg);color:var(--ldb-text)}
html[data-theme="dark"] .ldb-post .note-editor .note-toolbar{background:var(--ldb-surface);border-color:var(--ldb-line)}
html[data-theme="dark"] .ldb-bar{box-shadow:none}
html[data-theme="dark"] .ldb-avatar,html[data-theme="dark"] .ldb-comment img{opacity:.92}

/* theme toggle button (in the header bar) */
.ldb-theme{border:1px solid var(--ldb-edge);background:var(--ldb-bg);color:var(--ldb-text);width:40px;height:40px;
  border-radius:50%;cursor:pointer;font-size:18px;line-height:1;display:grid;place-items:center;padding:0}
.ldb-theme:hover{border-color:var(--ldb-accent)}
.ldb-theme .ldb-sun{display:none}
html[data-theme="dark"] .ldb-theme .ldb-sun{display:inline}
html[data-theme="dark"] .ldb-theme .ldb-moon{display:none}


/* floating theme toggle for logged-in users (they keep the normal site menu) */
.ldb-theme-float{position:fixed;left:16px;bottom:16px;z-index:30;background:var(--ldb-surface);
  box-shadow:0 2px 8px rgba(0,0,0,.25)}

/* dark mode for the normal site menu (only active on post pages, where data-theme is set) */
html[data-theme="dark"] .header_area,
html[data-theme="dark"] .header_area .navbar{background:#1e222a !important;border-bottom:1px solid var(--ldb-edge)}
html[data-theme="dark"] .header_area .navbar .nav .nav-item .nav-link,
html[data-theme="dark"] .header_area .navbar-brand{color:#e8eaee !important}
html[data-theme="dark"] .header_area .dropdown-menu{background:#1e222a !important;border:1px solid var(--ldb-edge)}
html[data-theme="dark"] .header_area .dropdown-menu button{background-color:#1e222a !important;color:#e8eaee !important}
html[data-theme="dark"] .header_area .navbar-toggler .icon-bar{background:#e8eaee !important}

/* ---------- tablet / mobile: post first, then author, then related ---------- */
@media (max-width:1000px){
  .ldb-grid{grid-template-columns:minmax(0,1fr);gap:16px}
  .ldb-author,.ldb-related{position:static}
  .ldb-article{order:1;padding:20px 18px}
  .ldb-author{order:2}
  .ldb-related{order:3}
  .ldb-title{font-size:26px}
  .ldb-body{font-size:17px}
  .ldb-body h2{font-size:22px !important}
  .ldb-body h3{font-size:19px !important}
}