/* ==============================================================================
   MPLB — MediaPort LiveBlog Styles v0.11.0
   Targets Automattic Liveblog 1.12.x DOM structure
   ============================================================================== */

/* ---------- Verification badges (kept from v0.1) ---------- */
.mplb-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 4px;
    margin-bottom: 6px;
    margin-right: 6px;
    letter-spacing: 0.02em;
    cursor: default;
    vertical-align: middle;
}

.mplb-badge--unverified  { background: #fef3c7; color: #92400e; }
.mplb-badge--checking    { background: #dbeafe; color: #1e40af; }
.mplb-badge--verified    { background: #d1fae5; color: #065f46; }
.mplb-badge--disproved   { background: #fee2e2; color: #991b1b; text-decoration: line-through; }

/* ---------- Live indicator wrapper (injected by mplb-frontend.js) ---------- */
.mplb-liveblog-wrapper {
    max-width: 720px;
    margin: 0 auto;
    font-family: Georgia, "Times New Roman", serif;
}

.mplb-liveblog-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 0 16px;
    border-bottom: 2px solid #000;
    margin-bottom: 24px;
}

.mplb-live-indicator {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #c00;
    color: #fff;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 3px 9px;
    line-height: 1;
}

.mplb-live-indicator::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    background: #fff;
    border-radius: 50%;
    animation: mplb-blink 1.4s ease-in-out infinite;
}

@keyframes mplb-blink {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.2; }
}

/* ---------- Modern editor (Liveblog 1.12 React app) ---------- */
.liveblog-editor-container {
    background: #f8f8f8;
    border: 1px solid #e0e0e0;
    border-left: 3px solid #c00;
    padding: 16px;
    margin-bottom: 28px;
    position: relative;
}

.liveblog-editor-inner-container {
    background: #fff;
}

.liveblog-input,
.liveblog-form-entry,
.liveblog-form-rich-entry {
    width: 100%;
    min-height: 80px;
    border: 1px solid #ccc;
    border-radius: 0 !important;
    padding: 10px 12px;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    box-sizing: border-box;
    background: #fff;
}

.liveblog-input:focus,
.liveblog-form-entry:focus,
.liveblog-form-rich-entry:focus {
    outline: none;
    border-color: #000;
}

.liveblog-editor-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 8px;
    border-bottom: 1px solid #e0e0e0;
}

.liveblog-editor-tab {
    padding: 6px 12px;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 12px;
    color: #555;
    cursor: pointer;
    border: none;
    background: transparent;
    border-bottom: 2px solid transparent;
}

.liveblog-editor-tab:hover { color: #000; }
.liveblog-editor-tab.active,
.liveblog-editor-tab[aria-selected="true"] {
    color: #000;
    border-bottom-color: #c00;
}

/* Publish (modern + legacy) */
.liveblog-publish-btn,
.liveblog-btn-primary,
.liveblog-form-entry-submit {
    background: #c00 !important;
    color: #fff !important;
    border: none;
    padding: 8px 20px;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 0 !important;
    letter-spacing: 0.03em;
    transition: background 0.15s;
}

.liveblog-publish-btn:hover,
.liveblog-btn-primary:hover,
.liveblog-form-entry-submit:hover {
    background: #a00 !important;
}

/* Secondary / cancel / delete */
.liveblog-btn,
.liveblog-btn-small,
.liveblog-btn-cancel,
.liveblog-editor-cancel-btn,
.liveblog-cancel-btn {
    background: transparent;
    border: 1px solid #ccc;
    color: #555;
    padding: 7px 14px;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 12px;
    cursor: pointer;
    border-radius: 0 !important;
    transition: border-color 0.15s, color 0.15s;
}

.liveblog-btn:hover,
.liveblog-btn-cancel:hover,
.liveblog-editor-cancel-btn:hover {
    border-color: #000;
    color: #000;
}

.liveblog-btn-delete,
.liveblog-editor-delete {
    color: #c00;
    border-color: #c00;
}

.liveblog-btn-delete:hover,
.liveblog-editor-delete:hover {
    background: #c00;
    color: #fff;
}

/* "New entries available" notifier */
.liveblog-update-btn,
.liveblog-update-btn-container {
    background: #c00;
    color: #fff;
    border: none;
    padding: 8px 16px;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 0;
    letter-spacing: 0.03em;
}

/* ---------- Entries list / feed ---------- */
#liveblog-entries,
.liveblog-feed {
    list-style: none;
    margin: 0;
    padding: 0;
}

.liveblog-entry {
    padding: 20px 0;
    border-bottom: 1px solid #e8e8e8;
    position: relative;
    list-style: none;
}

.liveblog-entry:first-child {
    border-top: 1px solid #e8e8e8;
}

/* Meta header: avatar + author + timestamp */
.liveblog-entry .liveblog-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}

.liveblog-author-avatar,
.liveblog-meta-author-avatar {
    flex: 0 0 auto;
}

.liveblog-author-avatar img,
.liveblog-meta-author-avatar img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: block;
}

.liveblog-author-name,
.liveblog-meta-author,
.liveblog-meta-authors {
    font-family: -apple-system, Arial, sans-serif;
    font-size: 11px;
    font-weight: 500;
    color: #555;
}

.liveblog-author-name a,
.liveblog-meta-author a {
    color: inherit;
    text-decoration: none;
}

.liveblog-author-name a:hover,
.liveblog-meta-author a:hover {
    text-decoration: underline;
}

.liveblog-meta-time,
.liveblog-time-update {
    font-family: -apple-system, Arial, sans-serif;
    font-size: 11px;
    font-weight: 600;
    color: #888;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
    text-decoration: none;
    margin-left: auto;
}

.liveblog-meta-time .date,
.liveblog-meta-time .time { color: inherit; }
.liveblog-meta-time .date + .time::before { content: " • "; opacity: 0.6; }

/* Entry body */
.liveblog-entry-text {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 16px;
    line-height: 1.65;
    color: #111;
}

.liveblog-entry-text p { margin: 0 0 0.8em; }
.liveblog-entry-text p:last-child { margin-bottom: 0; }

.liveblog-entry-text img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 12px 0;
}

.liveblog-entry-text iframe {
    max-width: 100%;
    display: block;
    margin: 12px 0;
}

/* Responsive embed wrapper */
.wp-block-embed__wrapper,
.mplb-embed-wrapper {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    margin: 12px 0;
}

.wp-block-embed__wrapper iframe,
.mplb-embed-wrapper iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    margin: 0;
}

/* ---------- Entry type variants ---------- */
.liveblog-entry.mplb-type-breaking {
    background: #fff8f8;
    border-bottom-color: #f0c0c0;
    padding-left: 14px;
    border-left: 3px solid #c00;
}

.mplb-breaking-badge {
    display: inline-block;
    background: #c00;
    color: #fff;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 2px 7px;
    margin-bottom: 6px;
    margin-right: 6px;
    vertical-align: middle;
}

.liveblog-entry.mplb-type-key {
    padding-left: 14px;
    border-left: 3px solid #000;
}

.mplb-source-telegram {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 10px;
    color: #888;
    margin-left: 6px;
}

/* ---------- New-entry animation ---------- */
.liveblog-entry.liveblog-entry-new {
    animation: mplb-entry-in 0.4s ease-out;
}

@keyframes mplb-entry-in {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ---------- Edit / delete tools ---------- */
.liveblog-entry-actions,
.liveblog-entry-tools {
    margin-top: 8px;
    display: flex;
    gap: 10px;
    opacity: 0;
    transition: opacity 0.15s;
    list-style: none;
    padding: 0;
}

.liveblog-entry:hover .liveblog-entry-actions,
.liveblog-entry:hover .liveblog-entry-tools {
    opacity: 1;
}

.liveblog-entry-actions a,
.liveblog-entry-actions button,
.liveblog-entry-tools a,
.liveblog-entry-tools button,
.liveblog-entry-edit,
.liveblog-entry-delete {
    font-family: -apple-system, Arial, sans-serif;
    font-size: 11px;
    color: #888;
    text-decoration: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    transition: color 0.1s;
}

.liveblog-entry-actions a:hover,
.liveblog-entry-actions button:hover,
.liveblog-entry-tools a:hover,
.liveblog-entry-tools button:hover,
.liveblog-entry-edit:hover,
.liveblog-entry-delete:hover {
    color: #c00;
}

/* ---------- Archived state ---------- */
.liveblog-archived-message {
    text-align: center;
    padding: 20px 0;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 12px;
    color: #aaa;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-top: 1px solid #e8e8e8;
    margin-top: 8px;
}

/* ---------- Pagination / load more ---------- */
.liveblog-pagination,
.liveblog-load-more {
    text-align: center;
    padding: 16px 0;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 12px;
}

.liveblog-pagination-btn,
.liveblog-load-more {
    background: transparent;
    color: #000;
    border: none;
    border-bottom: 1px solid #000;
    padding: 4px 2px;
    cursor: pointer;
    font-size: 12px;
}

.liveblog-pagination-pages {
    color: #888;
    margin: 0 12px;
}

.liveblog-loader {
    text-align: center;
    color: #888;
    padding: 20px 0;
}

/* ---------- Mobile ---------- */
@media (max-width: 600px) {
    .mplb-liveblog-wrapper { padding: 0 16px; }
    .liveblog-editor-container { padding: 12px; }
    .liveblog-entry-text { font-size: 15px; }
    .liveblog-publish-btn,
    .liveblog-btn-primary { width: 100%; text-align: center; }
    .liveblog-entry .liveblog-meta { gap: 6px; }
    .liveblog-meta-time { margin-left: 0; width: 100%; }
}

/* ---------- v0.3b: hide duplicate pagination, calm update bar ---------- */
#wpcom-liveblog-container .liveblog-pagination:first-of-type {
    display: none;
}

.liveblog-update-number {
    font-family: -apple-system, Arial, sans-serif;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    font-weight: 600;
    padding: 10px;
    cursor: pointer;
}

/* ==============================================================================
   v0.4: oEmbed wrappers
   ============================================================================== */

.mplb-embed {
    margin: 12px 0;
    max-width: 100%;
}

.mplb-embed--video {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}

.mplb-embed--video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
    margin: 0;
}

.mplb-embed--tiktok {
    margin: 12px 0;
    max-width: 605px;
}

.mplb-embed--telegram {
    border-left: 3px solid #2AABEE;
    padding-left: 0;
    background: transparent;
}

.mplb-embed--telegram-link {
    display: inline-block;
}

.mplb-telegram-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: #f0f8ff;
    border: 1px solid #2AABEE;
    color: #2AABEE;
    text-decoration: none;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 14px;
    transition: background 0.15s;
}

.mplb-telegram-link:hover {
    background: #e0f0ff;
}

.mplb-telegram-link__icon {
    font-size: 16px;
}

.mplb-telegram-link__name {
    font-weight: 600;
}

.mplb-telegram-link__label {
    font-size: 11px;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.mplb-embed .twitter-tweet {
    margin: 0 !important;
}

.mplb-entry video,
.liveblog-entry-text video {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 12px 0;
}

/* v0.7: hide theme's native comments section on liveblog posts */
.liveblog-enabled #comments,
.liveblog-enabled .comments-area,
.liveblog-enabled #respond,
.liveblog-enabled .wp-block-comments,
.liveblog-enabled .wp-block-post-comments-form {
    display: none !important;
}

/* v0.9.1: hide the statically-rendered in-entry delete confirm */
.liveblog-entry-delete-confirm {
    opacity: 0;
    pointer-events: none;
}

/* v0.9.1: fixed-position delete confirmation modal */
.mplb-delete-modal-overlay {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mplb-delete-modal {
    background: #fff;
    padding: 32px;
    max-width: 380px;
    width: 90%;
    text-align: center;
}

.mplb-delete-modal p {
    font-family: -apple-system, Arial, sans-serif;
    font-size: 15px;
    margin: 0 0 20px;
    color: #111;
}

.mplb-delete-modal-btns {
    display: flex;
    gap: 10px;
    justify-content: center;
}

/* v0.6: Editor hint — clarify URL → embed behavior */
.liveblog-editor-container::after {
    content: 'Порада: YouTube посилання на окремому рядку — автоматично стає відео';
    display: block;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 11px;
    color: #aaa;
    padding: 4px 0 0;
    font-style: italic;
}

/* ==============================================================================
   v0.11.0: Image upload UX — locked state, progress pill, error banner
   ============================================================================== */

/* Container locked state — disables toolbar buttons and Publish via CSS only.
   Editor contenteditable=false is set imperatively from JS (so Lexical sees it). */
.liveblog-editor-container.mplb-editor-locked .liveblog-toolbar .liveblog-editor-btn,
.liveblog-editor-container.mplb-editor-locked .liveblog-editor-tab,
.liveblog-editor-container.mplb-editor-locked .liveblog-publish-btn,
.liveblog-editor-container.mplb-editor-locked .liveblog-btn-primary,
.liveblog-editor-container.mplb-editor-locked .liveblog-form-entry-submit {
    pointer-events: none;
    opacity: 0.45;
    filter: grayscale(0.3);
}

.liveblog-editor-container.mplb-editor-locked .liveblog-lexical-content-editable {
    background: #fafafa;
    color: #888;
}

/* Progress pill — appears at the bottom of editor container during upload */
.mplb-upload-pill {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
    padding: 10px 14px;
    background: #fff;
    border: 1px solid #c00;
    border-left-width: 3px;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 13px;
    color: #111;
    animation: mplb-pill-in 0.2s ease-out;
}

@keyframes mplb-pill-in {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.mplb-upload-spinner {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}

.mplb-upload-spinner svg {
    animation: mplb-spin 0.9s linear infinite;
    transform-origin: center;
}

@keyframes mplb-spin {
    to { transform: rotate(360deg); }
}

.mplb-upload-name {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
    color: #444;
}

.mplb-upload-pct {
    flex: 0 0 auto;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: #c00;
    min-width: 38px;
    text-align: right;
}

.mplb-upload-cancel {
    flex: 0 0 auto;
    background: transparent;
    border: none;
    color: #999;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 0 !important;
    transition: color 0.1s;
}

.mplb-upload-cancel:hover {
    color: #c00;
}

/* Inline error banner — preserved upload URL if injection into editor fails */
.mplb-upload-error {
    position: relative;
    margin-top: 12px;
    padding: 10px 36px 10px 14px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-left: 3px solid #c00;
    font-family: -apple-system, Arial, sans-serif;
    font-size: 13px;
    color: #7f1d1d;
    line-height: 1.5;
}

.mplb-upload-error strong {
    color: #991b1b;
}

.mplb-upload-error-msg {
    color: #7f1d1d;
}

.mplb-upload-error-url {
    margin-top: 6px;
    font-size: 12px;
    color: #444;
}

.mplb-upload-error-url code {
    background: #fff;
    padding: 2px 6px;
    border: 1px solid #fde8e8;
    font-family: 'SF Mono', Menlo, monospace;
    font-size: 11px;
    word-break: break-all;
    user-select: all;
}

.mplb-upload-error-close {
    position: absolute;
    top: 6px;
    right: 8px;
    background: transparent;
    border: none;
    color: #991b1b;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    padding: 2px 4px;
    border-radius: 0 !important;
}

.mplb-upload-error-close:hover {
    color: #c00;
}

/* Mobile: pill stacks vertically if very narrow */
@media (max-width: 420px) {
    .mplb-upload-pill {
        flex-wrap: wrap;
    }
    .mplb-upload-name {
        flex: 1 1 100%;
        order: 3;
        margin-top: 4px;
    }
}

/* ==============================================================================
   v0.11.1: UI polish per Maryna/Tetiana feedback (TASK-16)
   ============================================================================== */

.mplb-liveblog-wrapper,
.liveblog-entry-text {
    font-family: 'NAMU Pro', Georgia, "Times New Roman", serif;
}

.liveblog-entry-text blockquote,
.liveblog-entry blockquote {
    border-left: 3px solid #c00;
    margin: 1em 0;
    padding: 8px 16px;
    color: #444;
    font-style: italic;
    font-family: Arial, Helvetica, sans-serif;
    background: #fafafa;
}

.liveblog-entry-text blockquote p,
.liveblog-entry blockquote p {
    margin: 0;
}

.liveblog-update-btn,
.liveblog-update-btn-container {
    background: #6bbbc1 !important;
    color: #fff !important;
}

.liveblog-update-btn:hover,
.liveblog-update-btn-container:hover {
    background: #5aa5ab !important;
}

.liveblog-update-number {
    background: #6bbbc1;
    color: #fff;
}

.liveblog-entry .liveblog-meta {
    gap: 14px;
}

@media (max-width: 600px) {
    .liveblog-entry .liveblog-meta {
        gap: 10px;
    }
}

/* ==============================================================================
   v0.11.1+: NAMU Pro font-face declaration
   Source: https://uklon.com.ua/app/uploads/2025/05/namu-pro-1.zip
   License: CC BY-ND 4.0 (free commercial use, no modification)
   Author: Dmytro Rastvortsev, commissioned by Banda for National Art Museum of Ukraine
   ============================================================================== */

@font-face {
    font-family: 'NAMU Pro';
    src: url('../fonts/NAMU-Pro.woff2') format('woff2'),
         url('../fonts/NAMU-Pro.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* MP-58: share button + anchor highlight */
.liveblog-meta{position:relative}
.mplb-share-btn{
  background:none;border:0;cursor:pointer;padding:4px;
  color:#8a8a8a;opacity:.55;transition:opacity .15s,color .15s;
  vertical-align:middle;margin-left:8px;line-height:0}
.liveblog-entry:hover .mplb-share-btn{opacity:1}
.mplb-share-btn:hover{color:#0073aa}
.mplb-share-btn.mplb-share-copied{color:#1a9c4b;opacity:1}
html[data-theme="dark"] .mplb-share-btn{color:#9a9a9a}
html[data-theme="dark"] .mplb-share-btn:hover{color:#F5E8D5}
html[data-theme="dark"] .mplb-share-btn.mplb-share-copied{color:#4cc572}
.mplb-share-highlight{animation:mplbShareFlash 2.5s ease-out}
@keyframes mplbShareFlash{
  0%{background-color:rgba(0,115,170,.18)}
  100%{background-color:transparent}}
html[data-theme="dark"] .mplb-share-highlight{animation:mplbShareFlashDark 2.5s ease-out}
@keyframes mplbShareFlashDark{
  0%{background-color:rgba(245,232,213,.12)}
  100%{background-color:transparent}}

/* MP-58: copy toast */
.mplb-share-toast{
  position:fixed;left:50%;bottom:32px;transform:translateX(-50%) translateY(12px);
  background:#1c1c1e;color:#F5E8D5;font:14px/1 Arial,Helvetica,sans-serif;
  padding:11px 18px;border-radius:8px;box-shadow:0 4px 14px rgba(0,0,0,.3);
  opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:99999}
.mplb-share-toast--show{opacity:1;transform:translateX(-50%) translateY(0)}
html[data-theme="dark"] .mplb-share-toast{background:#F5E8D5;color:#1c1c1e}

/* MP-58: toast vs Complianz dark layer */
html[data-theme="dark"] body .mplb-share-toast,
html[data-theme="dark"][class*="cmplz"] body .mplb-share-toast{
  background:#F5E8D5 !important;color:#1c1c1e !important}
html[data-theme="dark"] body .mplb-share-toast *{color:#1c1c1e !important}

/* MP-157: стрічкова ітерація видалена, карусель нижче */

/* MP-157: main-кадр фіксованої висоти */
.mplb-gallery .mplb-gallery__main .splide__slide{height:420px}
@media (max-width:600px){.mplb-gallery .mplb-gallery__main .splide__slide{height:260px}}

/* MP-157: доводка — фото цілком, мініатюри без обрізання */
.mplb-gallery{background:rgba(127,127,127,.08);border-radius:6px;padding:6px}
.mplb-gallery .mplb-gallery__main img{object-fit:contain;background:transparent}
.mplb-gallery .mplb-gallery__thumbs{margin-top:6px}
.mplb-gallery .mplb-gallery__thumbs .splide__slide{height:64px !important}
.mplb-gallery .mplb-gallery__thumbs .splide__slide.is-active{outline:2px solid currentColor;outline-offset:-2px;border-radius:3px}

/* MP-157: thumbs track повної висоти */
.mplb-gallery .mplb-gallery__thumbs,
.mplb-gallery .mplb-gallery__thumbs .splide__track{height:auto;overflow:visible}
.mplb-gallery .mplb-gallery__thumbs .splide__track{overflow:hidden}

/* MP-157 FINAL: габарити напряму на img, перебиваємо все */
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__main img{
  width:100% !important;height:420px !important;object-fit:contain !important;display:block}
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__thumbs img{
  width:100% !important;height:64px !important;object-fit:cover !important;display:block}
@media (max-width:600px){
  #wpcom-liveblog-container .mplb-gallery .mplb-gallery__main img{height:260px !important}}

/* MP-157: мініатюри без кропу (contain, фото цілком) */
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__thumbs img{
  object-fit:contain !important;background:rgba(0,0,0,.25)}

/* MP-157: thumbs контейнер + contain без кропу + zoom-курсор */
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__thumbs{height:72px;overflow:hidden}
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__thumbs img{object-fit:contain !important;background:rgba(0,0,0,.25)}
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__main img{cursor:zoom-in}

/* MP-157: геометрія thumbs остаточно */
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__thumbs{height:auto;overflow:visible;padding:0;margin-top:6px}
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__thumbs .splide__track{overflow:hidden;height:64px}
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__thumbs .splide__list{align-items:stretch}
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__thumbs .splide__slide{height:64px !important;margin:0;padding:0;border:0}
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__thumbs .splide__slide img{height:64px !important;width:100% !important;margin:0 !important;vertical-align:top}

/* MP-157: центрування фото у рамках (мініатюри і main) */
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__thumbs .splide__slide{display:flex;align-items:center;justify-content:center}
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__thumbs .splide__slide img{object-position:center center !important;margin:auto !important}
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__main .splide__slide{display:flex;align-items:center;justify-content:center}
#wpcom-liveblog-container .mplb-gallery .mplb-gallery__main img{object-position:center center !important}


/* MP-156: share + коментарі в один рядок, бар компактний */
.liveblog-entry .mplb-share-btn{order:1}
.liveblog-entry .mplb-comments-bar{order:2;margin-left:auto;display:inline-block}
.liveblog-entry .liveblog-meta,
.liveblog-entry{position:relative}
/* MP-194: бар share/коментарі опущено — відступ від тіла entry */
.mplb-comments-bar{margin-top:12px}
.mplb-comments-toggle{background:none;border:0;cursor:pointer;color:#8a8a8a;padding:4px 6px;font:inherit;display:inline-flex;align-items:center;gap:5px}
.mplb-comments-toggle:hover{color:#0073aa}
html[data-theme="dark"] .mplb-comments-toggle{color:#9a9a9a}
html[data-theme="dark"] .mplb-comments-toggle:hover{color:#F5E8D5}
.mplb-comments-box{width:100%;margin-top:8px;border-top:1px solid rgba(127,127,127,.2);padding-top:8px}
.mplb-c-item{margin:0 0 14px}
/* MP-194: head — автор/час ліворуч, інструменти ✏️/🗑 відсунуті праворуч */
.mplb-c-head{display:flex;align-items:center;gap:6px;font-size:.85em;opacity:.8;margin-bottom:3px}
.mplb-c-head time{opacity:.7}
.mplb-c-tools{margin-left:auto;display:inline-flex;gap:10px;opacity:.55;transition:opacity .15s}
.mplb-c-item:hover .mplb-c-tools{opacity:1}
.mplb-c-edit,.mplb-c-del{background:none;border:0;cursor:pointer;padding:2px;line-height:1;font-size:13px}
.mplb-c-empty,.mplb-c-login,.mplb-c-loading{opacity:.6;font-size:.9em;padding:4px 0}
/* MP-193: форма коментаря начисто — textarea на всю ширину зверху,
   під нею один рядок [📎 ліворуч … Надіслати праворуч]. */
.mplb-c-form{display:flex;flex-direction:column;gap:8px;margin-top:10px;width:100%}
.mplb-c-input{width:100%;box-sizing:border-box;border:1px solid rgba(127,127,127,.3);border-radius:6px;padding:8px 10px;font:inherit;line-height:1.4;background:transparent;color:inherit;resize:vertical;min-height:44px}
.mplb-c-preview{position:relative;align-self:flex-start;display:inline-block}
.mplb-c-preview-img{max-height:80px;border-radius:6px;display:block}
.mplb-c-preview-del{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border:0;border-radius:50%;background:#333;color:#fff;cursor:pointer;line-height:1;font-size:14px}
.mplb-c-controls{display:flex;align-items:center;gap:8px;width:100%}
.mplb-c-attach{background:none;border:1px solid rgba(127,127,127,.3);border-radius:6px;cursor:pointer;font-size:16px;line-height:1;padding:6px 9px}
.mplb-c-submit{margin-left:auto;border:0;border-radius:6px;padding:7px 16px;cursor:pointer;background:#0073aa;color:#fff;font:inherit;white-space:nowrap}
.mplb-c-submit:disabled{opacity:.5;cursor:default}
/* контейнер share+comments як flex-рядок */
.liveblog-entry > .mplb-share-btn,
.liveblog-entry > .mplb-comments-bar{vertical-align:middle}

/* MP-156: share + коментарі в один рядок */
.mplb-actions-row{display:flex;align-items:center;gap:4px}
.mplb-actions-row .mplb-share-btn{order:1;margin:0}
.mplb-actions-row .mplb-comments-toggle{order:2}

/* MP-156 v2: share ліворуч, коментарі праворуч, компактніше */
.mplb-actions-row{justify-content:space-between;width:100%}
.mplb-actions-row .mplb-comments-toggle{order:2;margin-left:auto;font-size:.82em;opacity:.7;padding:3px 4px}
.mplb-actions-row .mplb-comments-toggle:hover{opacity:1}
.mplb-actions-row .mplb-comments-toggle .mplb-c-icon{font-size:.9em}

/* MP-156 v3: коментарі = іконка як share, дрібна, справа */
.mplb-actions-row .mplb-comments-toggle{
  order:2;margin-left:auto;padding:4px;opacity:.55;font-size:inherit;
  color:#8a8a8a;display:inline-flex;align-items:center;gap:3px}
.liveblog-entry:hover .mplb-actions-row .mplb-comments-toggle{opacity:1}
.mplb-actions-row .mplb-comments-toggle .mplb-c-icon{font-size:14px;line-height:1}
.mplb-actions-row .mplb-comments-toggle .mplb-c-label{font-size:12px}
html[data-theme="dark"] .mplb-actions-row .mplb-comments-toggle{color:#9a9a9a}

/* MP-156: прикріплене фото в опублікованому коментарі (форма — у блоці MP-193 вище) */
.mplb-c-photo{max-width:100%;max-height:300px;border-radius:6px;margin-top:6px;display:block;cursor:zoom-in}

/* MP-194: на тач-екранах (hover нема) усі інструменти завжди повністю видимі */
@media (hover: none) {
  #wpcom-liveblog-container .mplb-c-tools,
  #wpcom-liveblog-container .mplb-share-btn,
  #wpcom-liveblog-container .mplb-actions-row .mplb-comments-toggle{opacity:1 !important}
}

/* MP-156: kill horizontal overflow від довгих URL */
#wpcom-liveblog-container a,
#wpcom-liveblog-container .mplb-c-text,
#wpcom-liveblog-container .liveblog-entry{
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
#wpcom-liveblog-container{max-width:100%;overflow-x:hidden}