/* Live blog entries inside an article body (the old Iran Samaneh markup).
   The archive holds three shapes, all drawn here as one card:
   1. a coloured panel with a `.live_body` inside;
   2. a bare panel, the text straight in it (the old rule painted it solid red or blue, unreadable);
   3. a header row (`.title_content_r` title, `.date_content_l` time) over a `.body_content`. */
.liveblog_delay{margin:18px 0;direction:rtl}
:is(.blog_panel_hot,.blog_panel_norm,.content_item:has(>.content_item_top_row)){display:block;margin:0 0 12px;border-radius:6px;overflow:hidden;font:15px/28px dana-regular,Tahoma,sans-serif;color:#222;text-align:right}
:is(.blog_panel_hot,.blog_panel_norm,.content_item:has(>.content_item_top_row)) p{margin:0 0 .8em}
:is(.blog_panel_hot,.blog_panel_norm,.content_item:has(>.content_item_top_row)) p:last-child{margin-bottom:0}
:is(.blog_panel_hot,.blog_panel_norm,.content_item:has(>.content_item_top_row)) img,:is(.blog_panel_hot,.blog_panel_norm,.content_item:has(>.content_item_top_row)) video{max-width:100%;height:auto}

/* 1. panel + .live_body: the coloured rim stays, the text sits on white */
.blog_panel_hot>.live_body,.blog_panel_norm>.live_body{background:#fff;color:#222;padding:12px 20px;box-shadow:none}

/* 2. bare panel: white card with a coloured rim */
.blog_panel_hot:not(:has(>.live_body)):not(:has(>.content_item_top_row)),
.blog_panel_norm:not(:has(>.live_body)):not(:has(>.content_item_top_row)){background:#fff;color:#222;padding:12px 20px;border:2px solid #b2e0fb}
.blog_panel_hot:not(:has(>.live_body)):not(:has(>.content_item_top_row)){border-color:#e10018}

/* 3. header row with the time, then the body */
.content_item:has(>.content_item_top_row){border:2px solid #b2e0fb;background:#fff}
.content_item_top_row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 14px;background:#b2e0fb;padding:8px 16px;width:auto;float:none}
.content_item_top_row>*{float:none;width:auto;padding:0;margin:0}
.content_item_top_row .wrapper{display:none}
.content_item_top_row .title_content_r{flex:1 1 60%;font:17px/28px dana-bold,dana-regular,Tahoma,sans-serif;font-weight:700;color:#000}
.content_item_top_row .date_content_l{flex:0 0 auto;direction:rtl;white-space:nowrap;background:#fff;color:#0152ad;border-radius:14px;padding:1px 12px;font:14px/26px dana-regular,Tahoma,sans-serif}
.content_item_top_row .date_content_l:before{content:"\f017";font-family:FontAwesome;margin-left:6px;font-size:13px}
.content_item .body_content{display:block;float:none;width:auto;background:#fff;padding:12px 16px}
.blog_panel_hot:has(>.content_item_top_row){border-color:#e10018}
.blog_panel_hot>.content_item_top_row{background:#e10018}
.blog_panel_hot>.content_item_top_row .title_content_r{color:#fff}

@media (max-width:576px){
  .content_item_top_row .title_content_r{flex-basis:100%}
  .blog_panel_hot>.live_body,.blog_panel_norm>.live_body,
  .content_item .body_content{padding:10px 12px}
}

/* dark theme */
html[data-tn-theme=dark] :is(.blog_panel_hot,.blog_panel_norm,.content_item:has(>.content_item_top_row)){color:#e6e6e6}
html[data-tn-theme=dark] .blog_panel_hot>.live_body,
html[data-tn-theme=dark] .blog_panel_norm>.live_body,
html[data-tn-theme=dark] .content_item .body_content,
html[data-tn-theme=dark] .blog_panel_hot:not(:has(>.live_body)):not(:has(>.content_item_top_row)),
html[data-tn-theme=dark] .blog_panel_norm:not(:has(>.live_body)):not(:has(>.content_item_top_row)),
html[data-tn-theme=dark] .content_item:has(>.content_item_top_row){background:#1c1c1c;color:#e6e6e6}
html[data-tn-theme=dark] .blog_panel_norm,
html[data-tn-theme=dark] .content_item_top_row{background-color:#013d86;border-color:#013d86}
html[data-tn-theme=dark] .content_item_top_row .title_content_r{color:#fff}
html[data-tn-theme=dark] .content_item_top_row .date_content_l{background:#000;color:#9cc7ff}