/* Logged-in publisher shortcut. Available on mobile, tablet and desktop article views. */
.lfbp-front-wrap { display: none; }

@media (min-width: 0px) {
    html.lfbp-sheet-open,
    html.lfbp-sheet-open body { overflow: hidden !important; }

    .lfbp-front-wrap.is-authorized {
        display: block;
        position: fixed;
        right: 12px;
        top: calc(env(safe-area-inset-top, 0px) + 58px);
        z-index: 2147483000;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    }

    .lfbp-front-action {
        -webkit-appearance: none;
        appearance: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        min-height: 44px;
        padding: 0 13px 0 8px;
        border: 0;
        border-radius: 999px;
        background: #1877f2;
        color: #fff !important;
        box-shadow: 0 4px 16px rgba(0,0,0,.24);
        text-decoration: none !important;
        font-size: 12px;
        line-height: 1;
        font-weight: 800;
        letter-spacing: .15px;
        cursor: pointer;
        touch-action: manipulation;
    }

    .lfbp-front-action:focus-visible {
        outline: 3px solid rgba(24,119,242,.35);
        outline-offset: 3px;
    }

    .lfbp-front-action.is-busy { opacity: .72; cursor: wait; }
    .lfbp-front-retry { background: #b32d2e; }
    .lfbp-front-posted { background: #16713a; }
    .lfbp-front-scheduled { background: #5b47c7; }

    .lfbp-front-f {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 28px;
        height: 28px;
        border-radius: 50%;
        background: #fff;
        color: #1877f2;
        font-family: Arial, sans-serif;
        font-size: 23px;
        font-weight: 900;
        line-height: 28px;
    }

    .lfbp-front-toast {
        position: absolute;
        right: 0;
        top: 52px;
        width: min(310px, calc(100vw - 24px));
        padding: 10px 12px;
        border-radius: 10px;
        background: rgba(18,18,18,.96);
        color: #fff;
        box-shadow: 0 5px 20px rgba(0,0,0,.24);
        font-size: 12px;
        line-height: 1.35;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-6px);
        transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
        pointer-events: none;
    }

    .lfbp-front-toast.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
    .lfbp-front-toast.is-error { background: rgba(148,24,24,.97); }

    .lfbp-front-sheet {
        position: fixed;
        inset: 0;
        z-index: 2147483600;
        display: block;
        visibility: hidden;
        pointer-events: none;
    }

    .lfbp-front-sheet.is-open { visibility: visible; pointer-events: auto; }

    .lfbp-front-sheet-backdrop {
        position: absolute;
        inset: 0;
        background: rgba(0,0,0,.48);
        opacity: 0;
        transition: opacity .18s ease;
    }

    .lfbp-front-sheet.is-open .lfbp-front-sheet-backdrop { opacity: 1; }

    .lfbp-front-sheet-panel {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        max-height: min(76vh, 620px);
        overflow-y: auto;
        background: #fff;
        color: #111;
        border-radius: 20px 20px 0 0;
        padding: 8px 16px calc(18px + env(safe-area-inset-bottom, 0px));
        box-shadow: 0 -8px 30px rgba(0,0,0,.22);
        transform: translateY(105%);
        transition: transform .22s ease;
        -webkit-overflow-scrolling: touch;
    }

    .lfbp-front-sheet.is-open .lfbp-front-sheet-panel { transform: translateY(0); }

    .lfbp-front-sheet-handle {
        width: 42px;
        height: 4px;
        border-radius: 99px;
        background: #d0d3d8;
        margin: 2px auto 8px;
    }

    .lfbp-front-sheet-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 44px;
        margin-bottom: 8px;
    }

    .lfbp-front-sheet-head strong { font-size: 18px; }

    .lfbp-sheet-close {
        width: 38px;
        height: 38px;
        border: 0;
        border-radius: 50%;
        background: #f0f2f5;
        color: #333;
        font-size: 27px;
        line-height: 1;
        cursor: pointer;
    }

    .lfbp-sheet-primary,
    .lfbp-sheet-secondary,
    .lfbp-sheet-danger,
    .lfbp-sheet-schedule {
        width: 100%;
        min-height: 54px;
        margin: 8px 0 0;
        border-radius: 12px;
        font-size: 15px;
        font-weight: 800;
        cursor: pointer;
        touch-action: manipulation;
    }

    .lfbp-sheet-primary {
        border: 0;
        background: #1877f2;
        color: #fff;
    }

    .lfbp-sheet-primary:disabled { opacity: .65; }

    .lfbp-sheet-secondary {
        border: 1px solid #d8dde5;
        background: #fff;
        color: #20242a;
    }

    .lfbp-sheet-danger {
        border: 1px solid #e3b5b5;
        background: #fff;
        color: #b42318;
    }

    .lfbp-sheet-schedule {
        display: flex;
        align-items: center;
        gap: 13px;
        padding: 10px 14px;
        text-align: left;
        border: 1px solid #d8dde5;
        background: #f8f9fb;
        color: #111;
    }

    .lfbp-sheet-schedule > span { font-size: 24px; }
    .lfbp-sheet-schedule b { display: block; font-size: 15px; }
    .lfbp-sheet-schedule small { display: block; margin-top: 3px; color: #68707b; font-weight: 500; }

    .lfbp-sheet-status {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 13px 14px;
        margin-bottom: 8px;
        border-radius: 12px;
        background: #f4f1ff;
    }

    .lfbp-sheet-status-icon { font-size: 25px; }
    .lfbp-sheet-status b { display: block; font-size: 15px; }
    .lfbp-sheet-status span:not(.lfbp-sheet-status-icon) { display: block; margin-top: 3px; color: #5f6470; font-size: 14px; }

    .lfbp-quick-title { margin: 4px 0 8px; color: #5d6470; font-size: 13px; font-weight: 700; }

    .lfbp-quick-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 7px;
        margin-bottom: 14px;
    }

    .lfbp-quick {
        min-height: 42px;
        border: 1px solid #d7dce4;
        border-radius: 10px;
        background: #f7f8fa;
        color: #111;
        font-size: 13px;
        font-weight: 800;
    }

    .lfbp-datetime-label {
        display: block;
        margin: 3px 0 6px;
        font-size: 13px;
        font-weight: 800;
    }

    .lfbp-datetime {
        display: block;
        width: 100%;
        min-height: 52px;
        box-sizing: border-box;
        border: 1px solid #cdd3dc;
        border-radius: 10px;
        background: #fff;
        color: #111;
        padding: 0 12px;
        font-size: 16px;
    }

    .lfbp-timezone-note {
        margin-top: 6px;
        color: #747b86;
        font-size: 11px;
    }
}


/* Desktop: keep the publisher control at the top-right under the site menu,
   while presenting scheduling as a compact panel instead of a full-width mobile sheet. */
@media (min-width: 1025px) {
    .lfbp-front-wrap.is-authorized {
        right: 24px;
        top: 92px;
    }

    .lfbp-front-action {
        min-height: 42px;
        padding: 0 14px 0 8px;
        font-size: 12px;
        box-shadow: 0 4px 14px rgba(0,0,0,.20);
    }

    .lfbp-front-toast {
        width: 340px;
    }

    .lfbp-front-sheet-panel {
        left: auto;
        right: 24px;
        bottom: 24px;
        width: 420px;
        max-width: calc(100vw - 48px);
        max-height: min(78vh, 650px);
        border-radius: 18px;
        padding: 10px 18px 20px;
        transform: translateY(24px) scale(.98);
        opacity: 0;
        transition: transform .18s ease, opacity .18s ease;
    }

    .lfbp-front-sheet.is-open .lfbp-front-sheet-panel {
        transform: translateY(0) scale(1);
        opacity: 1;
    }

    .lfbp-front-sheet-handle {
        display: none;
    }
}