/* wpForo Inline Media Uploader 1.0.0 — resumable upload + delete controls */
.wpfim-uploader,
.wpfim-uploader * { box-sizing: border-box; }
.wpfim-uploader {
    direction: rtl;
    width: 100%;
    margin: 12px 0 18px;
    color: #79c78e;
    font-family: inherit;
}
.wpfim-files { display: none; margin-top: 12px; }
.wpfim-files.is-visible { display: block; animation: wpfim-fade-in .22s ease both; }
.wpfim-files-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 2px 9px;
    color: #398c53;
    font-size: 13px;
    font-weight: 800;
}
.wpfim-heading-label { display: inline-flex; align-items: center; gap: 8px; }
.wpfim-heading-label:before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #64bb79;
    box-shadow: 0 0 0 4px rgba(100,187,121,.13);
}
.wpfim-files-count { color: #5aa86e; font-size: 11px; font-weight: 700; }
.wpfim-files-list { display: grid; grid-template-columns: minmax(0,1fr); gap: 12px; }

/* Card grid: icon + filename row, then a full-width progress row and status. */
.wpfim-uploader .wpfim-file-card {
    position: relative;
    display: grid !important;
    grid-template-columns: 58px minmax(0,1fr) !important;
    grid-template-areas:
        "icon meta"
        "progress progress"
        "status status"
        "options options";
    align-items: center;
    column-gap: 12px;
    row-gap: 10px;
    min-width: 0;
    width: 100%;
    overflow: hidden;
    padding: 14px 14px 13px 48px !important;
    border: 2px solid #4d9562 !important;
    border-radius: 6px !important;
    background: linear-gradient(118deg, #14291f 0%, #26312d 54%, #173a27 100%) !important;
    box-shadow: 0 5px 16px rgba(10,29,17,.20), 0 1px 2px rgba(5,15,9,.12), inset 0 1px 0 rgba(255,255,255,.035) !important;
    color: #80cd94 !important;
    animation: wpfim-card-in .22s ease both;
    text-align: right;
}
.wpfim-uploader .wpfim-file-card:before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: linear-gradient(180deg,#a2e2ad,#46a962);
    opacity: .95;
    pointer-events: none;
}
.wpfim-uploader .wpfim-file-icon {
    grid-area: icon;
    display: grid !important;
    flex: none !important;
    width: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
    height: 58px !important;
    min-height: 58px !important;
    place-items: center;
    justify-self: start;
    align-self: center;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(119,202,140,.42) !important;
    border-radius: 8px !important;
    background: linear-gradient(145deg,rgba(70,146,91,.30),rgba(41,62,49,.68)) !important;
    color: #a8e8b5 !important;
    line-height: 1 !important;
}
.wpfim-uploader .wpfim-file-icon svg {
    display: block !important;
    width: 29px !important;
    height: 29px !important;
    max-width: none !important;
    max-height: none !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.55;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.wpfim-kind-video { color: #b6df9f !important; }
.wpfim-kind-audio { color: #b9d6c0 !important; }
.wpfim-kind-file { color: #a6c9b0 !important; }
.wpfim-file-meta { grid-area: meta; display: block; min-width: 0; width: 100%; overflow: hidden; }
.wpfim-file-top { display: block; min-width: 0; width: 100%; overflow: hidden; padding-left: 2px; }
.wpfim-file-name {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    color: #a5e5b2 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.65 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
}
.wpfim-file-details {
    display: flex !important;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px 9px;
    min-width: 0;
    margin-top: 4px;
    color: #83bd91 !important;
    font-size: 10px !important;
    line-height: 1.5 !important;
}
.wpfim-file-size { direction: ltr; unicode-bidi: isolate; }
.wpfim-file-details span + span:before {
    content: "";
    display: inline-block;
    width: 3px;
    height: 3px;
    margin: 0 0 2px 8px;
    border-radius: 50%;
    background: #5c9b6d;
}

/* 90% progress track and 10% numeric percentage, kept on one line. */
.wpfim-uploader .wpfim-progress-row {
    grid-area: progress;
    display: grid !important;
    grid-template-columns: minmax(0,9fr) minmax(34px,1fr) !important;
    align-items: center;
    gap: 8px;
    width: 100% !important;
    min-width: 0;
    margin: 1px 0 0 !important;
    padding: 0 !important;
    direction: rtl;
}
.wpfim-uploader .wpfim-progress-track {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-width: 0;
    height: 11px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid #435c4a !important;
    border-radius: 20px !important;
    background: linear-gradient(90deg,#101a15,#303a34) !important;
    box-shadow: inset 0 1px 3px rgba(0,0,0,.35) !important;
    direction: rtl;
}
.wpfim-uploader .wpfim-progress-fill {
    position: absolute !important;
    inset-block: 0 !important;
    inset-inline-start: 0 !important;
    display: block !important;
    width: 0;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 20px !important;
    background: linear-gradient(90deg,#347c49 0%,#54ae6b 58%,#a0dfa9 100%) !important;
    box-shadow: 0 0 12px rgba(103,190,126,.32) !important;
    transition: width .18s linear;
}
.wpfim-file-percent {
    display: block !important;
    width: 100%;
    min-width: 34px;
    margin: 0 !important;
    padding: 0 !important;
    color: #a1e2ae !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    font-variant-numeric: tabular-nums;
    text-align: center;
    white-space: nowrap;
    direction: rtl;
}
.wpfim-file-bottom {
    grid-area: status;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-width: 0;
    min-height: 20px;
    margin: 0 !important;
    padding: 0 !important;
}
.wpfim-file-status {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: #80c992 !important;
    font-size: 10px !important;
    font-weight: 650 !important;
    line-height: 1.6 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wpfim-file-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 6px;
    max-width: 100%;
}
.wpfim-file-actions [hidden],
.wpfim-delete-options[hidden] { display: none !important; }
.wpfim-uploader .wpfim-action {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 29px !important;
    margin: 0 !important;
    padding: 4px 9px !important;
    border: 1px solid rgba(126,190,143,.45) !important;
    border-radius: 6px !important;
    background: #2d4035 !important;
    color: #b5e9c0 !important;
    font: inherit !important;
    font-size: 10px !important;
    font-weight: 750 !important;
    line-height: 1.4 !important;
    cursor: pointer;
    box-shadow: none !important;
}
.wpfim-uploader .wpfim-action:hover { background: #3b5945 !important; color: #e1f8e5 !important; }
.wpfim-uploader .wpfim-action:disabled { opacity: .55; cursor: wait; }
/* Keep hidden controls hidden even though buttons use display:flex !important. */
.wpfim-uploader .wpfim-file-actions > .wpfim-action[hidden],
.wpfim-uploader .wpfim-delete-options[hidden],
.wpfim-uploader [hidden] { display: none !important; }
.wpfim-uploader .wpfim-pause { border-color: rgba(218,178,91,.55) !important; color: #f0d18c !important; }
.wpfim-uploader .wpfim-resume { border-color: rgba(104,198,128,.65) !important; background: #245c37 !important; color: #c4f2cd !important; }
.wpfim-uploader .wpfim-delete { border-color: rgba(215,127,127,.5) !important; color: #ffc0b9 !important; }
.wpfim-uploader .wpfim-delete-options {
    grid-area: options;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid rgba(114,177,129,.38);
    border-radius: 6px;
    background: rgba(12,25,18,.55);
    color: #a8ddb3;
    font-size: 10px;
}
.wpfim-uploader .wpfim-delete-options > div { display: flex; flex-wrap: wrap; gap: 6px; }
.wpfim-uploader .wpfim-remove-editor { color: #c5e7cd !important; }
.wpfim-uploader .wpfim-remove-server { border-color: rgba(219,111,111,.6) !important; background: #512e2d !important; color: #ffd0cc !important; }
.wpfim-uploader .wpfim-cancel-delete { color: #c3c9c5 !important; }
.wpfim-file-card.is-paused .wpfim-progress-fill { background: linear-gradient(90deg,#8e763f,#d6b66a) !important; }
.wpfim-file-card.is-paused .wpfim-file-status { color: #f0d18c !important; }

.wpfim-uploader .wpfim-card-close {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    z-index: 2;
    display: flex !important;
    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(143,201,157,.38) !important;
    border-radius: 6px !important;
    background: linear-gradient(145deg,#34413a,#202c25) !important;
    color: #a4dcb0 !important;
    cursor: pointer;
    box-shadow: none !important;
    line-height: 1 !important;
    transition: background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease;
}
.wpfim-uploader .wpfim-card-close.is-visible { display: flex !important; }
.wpfim-uploader .wpfim-card-close:hover { transform: translateY(-1px); border-color: #d58d8d !important; background: rgba(146,61,61,.25) !important; color: #ffc1c1 !important; }
.wpfim-uploader .wpfim-card-close svg { display: block; width: 14px !important; height: 14px !important; fill: none !important; stroke: currentColor !important; stroke-width: 2; stroke-linecap: round; }
.wpfim-file-card.is-uploading .wpfim-progress-fill { background: linear-gradient(90deg,#34884b 0%,#60bf77 60%,#b0e7b8 100%) !important; }
.wpfim-file-card.is-done { border-color: #62b779 !important; background: linear-gradient(118deg,#142c20 0%,#26372e 54%,#1d462e 100%) !important; }
.wpfim-file-card.is-done .wpfim-file-status { color: #a4e5b1 !important; }
.wpfim-file-card.is-done .wpfim-progress-fill { background: linear-gradient(90deg,#37834e,#78c78a,#a7dfb2) !important; }
.wpfim-file-card.is-error { border-color: #98615d !important; background: linear-gradient(118deg,#302925 0%,#33302c 55%,#382928 100%) !important; }
.wpfim-file-card.is-error .wpfim-file-percent,
.wpfim-file-card.is-error .wpfim-file-status { color: #efaaaa !important; }
.wpfim-file-card.is-error .wpfim-progress-fill { background: linear-gradient(90deg,#a34e4e,#e6a3a3) !important; }
.wpfim-hidden-picker { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; }
.wpfim-inline-file { margin: 10px 0; max-width: 100%; }
.wpfim-inline-file img,.wpfim-inline-file video { max-width: 100%; height: auto; }
.wpfim-inline-file audio { max-width: 100%; }
@keyframes wpfim-fade-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@keyframes wpfim-card-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width:600px) {
    .wpfim-uploader { margin: 9px 0 15px; }
    .wpfim-files-list { gap: 10px; }
    .wpfim-uploader .wpfim-file-card {
        grid-template-columns: 54px minmax(0,1fr) !important;
        column-gap: 10px;
        row-gap: 9px;
        padding: 12px 11px 11px 43px !important;
    }
    .wpfim-uploader .wpfim-file-icon {
        width: 54px !important;
        min-width: 54px !important;
        max-width: 54px !important;
        height: 54px !important;
        min-height: 54px !important;
    }
    .wpfim-uploader .wpfim-file-icon svg { width: 27px !important; height: 27px !important; }
    .wpfim-file-name { font-size: 11px !important; }
    .wpfim-file-details { font-size: 9.5px !important; }
    .wpfim-file-percent { font-size: 11px !important; }
    .wpfim-file-status { font-size: 9.5px !important; }
    .wpfim-file-bottom { align-items: flex-start; }
    .wpfim-file-actions { width: 100%; }
    .wpfim-uploader .wpfim-action { min-height: 28px !important; padding: 4px 7px !important; font-size: 9px !important; }
    .wpfim-uploader .wpfim-delete-options { align-items: flex-start; flex-direction: column; }
    
.wpfim-uploader .wpfim-card-close { top: 8px !important; left: 8px !important; width: 26px !important; min-width: 26px !important; max-width: 26px !important; height: 26px !important; min-height: 26px !important; }
}
@media (prefers-reduced-motion: reduce) {
    .wpfim-files.is-visible, .wpfim-file-card { animation: none !important; }
    .wpfim-progress-fill { transition: none !important; }
}


/* Distinct blue action button in the native TinyMCE toolbar. */
.tox .tox-tbtn[data-mce-name="wpfim_media"],
.tox .tox-tbtn[aria-label*="افزودن رسانه"],
.tox .tox-tbtn[title*="آپلود هم‌زمان"],
button[data-mce-name="wpfim_media"],
button[aria-label*="افزودن رسانه"],
.mce-btn button[aria-label*="افزودن رسانه"] {
    color: #ffffff !important;
    background: #2563eb !important;
    border: 1px solid #1d4ed8 !important;
    border-radius: 7px !important;
    box-shadow: 0 2px 5px rgba(37, 99, 235, .20) !important;
    padding: 0 10px !important;
    min-height: 30px !important;
    transition: background-color .16s ease, box-shadow .16s ease, transform .16s ease !important;
}
.tox .tox-tbtn[data-mce-name="wpfim_media"]:hover,
.tox .tox-tbtn[aria-label*="افزودن رسانه"]:hover,
.tox .tox-tbtn[title*="آپلود هم‌زمان"]:hover,
button[data-mce-name="wpfim_media"]:hover,
button[aria-label*="افزودن رسانه"]:hover,
.mce-btn button[aria-label*="افزودن رسانه"]:hover {
    color: #ffffff !important;
    background: #1d4ed8 !important;
    box-shadow: 0 3px 8px rgba(37, 99, 235, .28) !important;
}
.tox .tox-tbtn[data-mce-name="wpfim_media"]:focus-visible,
button[data-mce-name="wpfim_media"]:focus-visible,
button[aria-label*="افزودن رسانه"]:focus-visible {
    outline: 2px solid #93c5fd !important;
    outline-offset: 2px !important;
}
.tox .tox-tbtn[data-mce-name="wpfim_media"] .tox-tbtn__select-chevron,
.tox .tox-tbtn[data-mce-name="wpfim_media"] svg,
button[data-mce-name="wpfim_media"] svg,
button[aria-label*="افزودن رسانه"] svg {
    fill: currentColor !important;
    color: #ffffff !important;
}


/* Reliable styling for the actual TinyMCE button (modern and legacy UI). */
.tox .tox-tbtn.wpfim-toolbar-button,
.tox .tox-tbtn[data-wpfim-toolbar-button="true"],
.tox button.wpfim-toolbar-button,
.mce-btn.wpfim-toolbar-button,
.mce-btn button.wpfim-toolbar-button,
button.wpfim-toolbar-button,
[data-wpfim-toolbar-button="true"] {
    background: #2563eb !important;
    background-color: #2563eb !important;
    color: #ffffff !important;
    border: 1px solid #1d4ed8 !important;
    border-radius: 7px !important;
    box-shadow: 0 2px 5px rgba(37, 99, 235, .20) !important;
    min-height: 32px !important;
    padding: 0 10px !important;
    gap: 7px !important;
    align-items: center !important;
    justify-content: center !important;
}
.tox .tox-tbtn.wpfim-toolbar-button:hover,
.tox .tox-tbtn[data-wpfim-toolbar-button="true"]:hover,
.tox button.wpfim-toolbar-button:hover,
.mce-btn.wpfim-toolbar-button:hover,
.mce-btn button.wpfim-toolbar-button:hover,
button.wpfim-toolbar-button:hover,
[data-wpfim-toolbar-button="true"]:hover {
    background: #1d4ed8 !important;
    background-color: #1d4ed8 !important;
    color: #ffffff !important;
    border-color: #1e40af !important;
    box-shadow: 0 3px 8px rgba(37, 99, 235, .28) !important;
}
.tox .tox-tbtn.wpfim-toolbar-button span,
.tox .tox-tbtn.wpfim-toolbar-button svg,
.tox button.wpfim-toolbar-button span,
.tox button.wpfim-toolbar-button svg,
.mce-btn.wpfim-toolbar-button span,
.mce-btn.wpfim-toolbar-button i,
button.wpfim-toolbar-button span,
button.wpfim-toolbar-button svg {
    color: #ffffff !important;
    stroke: #ffffff !important;
}
.tox .tox-tbtn.wpfim-toolbar-button svg,
.tox button.wpfim-toolbar-button svg,
button.wpfim-toolbar-button svg {
    width: 17px !important;
    height: 17px !important;
}
.tox .tox-tbtn.wpfim-toolbar-button:focus-visible,
.tox button.wpfim-toolbar-button:focus-visible,
.mce-btn.wpfim-toolbar-button button:focus-visible,
button.wpfim-toolbar-button:focus-visible {
    outline: 2px solid #93c5fd !important;
    outline-offset: 2px !important;
}

.tox .tox-tbtn.wpfim-toolbar-button,
.tox button.wpfim-toolbar-button,
button.wpfim-toolbar-button,
.mce-btn.wpfim-toolbar-button button {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    white-space: nowrap !important;
    direction: rtl !important;
}
.tox .tox-tbtn.wpfim-toolbar-button svg,
.tox button.wpfim-toolbar-button svg,
button.wpfim-toolbar-button svg,
.mce-btn.wpfim-toolbar-button button img {
    flex: 0 0 17px !important;
    width: 17px !important;
    height: 17px !important;
    vertical-align: middle !important;
}
.tox .tox-tbtn.wpfim-toolbar-button svg,
.tox button.wpfim-toolbar-button svg,
button.wpfim-toolbar-button svg {
    fill: none !important;
    stroke: #ffffff !important;
}
.tox .tox-tbtn.wpfim-toolbar-button .tox-tbtn__select-label,
.tox .tox-tbtn.wpfim-toolbar-button span,
.tox button.wpfim-toolbar-button span,
.mce-btn.wpfim-toolbar-button .mce-txt {
    color: #ffffff !important;
}