/* Adoras wpForo Media: attachments, lightbox, uploader, embeds */

/*
 * Wrappers are <span>s so they stay valid inside wpautop's <p>. wpForo's classic theme sets
 * `#wpforo #wpforo-wrap span {display: inline}`, which outranks `#wpforo .x`, so every rule that
 * gives a span a display also lists the `#wpforo #wpforo-wrap` selector.
 */

/* ---------- Attachments in posts ---------- */
#wpforo .adwm-media,
#wpforo #wpforo-wrap .adwm-media {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 6px 0;
    max-width: 100%;
}

#wpforo .adwm-item {
    display: block;
    max-width: 100%;
}

#wpforo .adwm-img {
    line-height: 0;
    cursor: zoom-in;
}

#wpforo .adwm-img img {
    display: block;
    width: auto;
    height: auto;
    max-width: min(400px, 100%);
    max-height: 300px;
    border-radius: 6px;
    object-fit: cover;
}

#wpforo .adwm-video {
    width: 100%;
}

#wpforo .adwm-video video {
    display: block;
    width: 100%;
    max-width: 720px;
    max-height: 80vh;
    background: #000;
    border-radius: 6px;
}

#wpforo .adwm-audio audio {
    display: block;
    width: 100%;
    max-width: 480px;
}

#wpforo .adwm-file {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 6px;
    text-decoration: none;
}

#wpforo .adwm-file i {
    font-size: 1.6em;
}

#wpforo .adwm-locked-item {
    padding: 6px 10px;
    border: 1px dashed rgba(0, 0, 0, .25);
    border-radius: 6px;
    font-size: 13px;
    color: #666;
}

/* ---------- Embeds ---------- */
#wpforo .adwm-embed,
#wpforo #wpforo-wrap .adwm-embed {
    display: block;
    width: 100%;
    max-width: 480px;
    margin: 6px 0;
}

#wpforo .adwm-embed-frame,
#wpforo #wpforo-wrap .adwm-embed-frame {
    display: block;
    position: relative;
    aspect-ratio: 16 / 9;
}

#wpforo .adwm-embed-frame iframe {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    border: 0;
}

#wpforo .adwm-embed video,
#wpforo .adwm-embed audio {
    display: block;
    width: 100%;
}

#wpforo .adwm-embed video {
    background: #000;
    border-radius: 6px;
}

/* ---------- Uploader (topic/reply forms) ---------- */
#wpforo .adwm-uploader {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 12px;
    width: 100%;
    margin: 6px 0;
}

#wpforo .adwm-uploader-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 6px;
    background: #fff;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

#wpforo .adwm-uploader-button:hover,
#wpforo .adwm-uploader-button:focus-visible {
    border-color: rgba(0, 0, 0, .5);
}

#wpforo .adwm-uploader-hint {
    font-size: 12px;
    color: #777;
}

#wpforo .adwm-queue {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 100%;
}

#wpforo .adwm-queue:empty {
    display: none;
}

#wpforo .adwm-queue-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 120px 48px;
    align-items: center;
    gap: 8px;
    font-size: 13px;
}

#wpforo .adwm-queue-name {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#wpforo .adwm-queue-bar {
    height: 6px;
    border-radius: 3px;
    background: rgba(0, 0, 0, .1);
    overflow: hidden;
}

#wpforo .adwm-queue-bar span,
#wpforo #wpforo-wrap .adwm-queue-bar span {
    display: block;
    width: 0;
    height: 100%;
    background: #3c9a6e;
    transition: width .2s ease;
}

#wpforo .adwm-queue-row.is-error {
    color: #b3261e;
}

#wpforo .adwm-queue-row.is-error .adwm-queue-bar span {
    background: #b3261e;
}

#wpforo .adwm-queue-status {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* ---------- My media library ---------- */
#wpforo .adwm-library {
    width: 100%;
    max-height: 360px;
    overflow-y: auto;
    padding: 8px;
    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 6px;
    background: #fff;
}

#wpforo .adwm-library[hidden] {
    display: none;
}

#wpforo .adwm-library.is-loading {
    opacity: .6;
}

#wpforo .adwm-library-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: 8px;
    font-size: 12px;
}

#wpforo .adwm-library-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

#wpforo .adwm-library-insert {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
    padding: 0;
    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 4px;
    background: #f6f6f6;
    cursor: copy;
    overflow: hidden;
}

#wpforo .adwm-library-insert:hover,
#wpforo .adwm-library-insert:focus-visible {
    border-color: #3c9a6e;
}

#wpforo .adwm-library-insert img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#wpforo .adwm-library-kind {
    font-size: 28px;
    color: #666;
}

#wpforo .adwm-library-meta {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#wpforo .adwm-library-badge {
    color: #777;
}

#wpforo .adwm-library-delete {
    align-self: flex-start;
    padding: 0;
    border: 0;
    background: none;
    color: #b3261e;
    font-size: 12px;
    cursor: pointer;
}

#wpforo .adwm-library-more {
    margin-top: 8px;
}

#wpforo form.adwm-dragover {
    outline: 2px dashed #3c9a6e;
    outline-offset: 4px;
}

/* ---------- Lightbox ---------- */
.adwm-lightbox {
    position: fixed;
    inset: 0;
    z-index: 2147483647; /* above chat/search widgets */
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, .9);
    touch-action: pan-y;
}

.adwm-lightbox[hidden] {
    display: none;
}

.adwm-lightbox img {
    max-width: 94vw;
    max-height: 88vh;
    object-fit: contain;
    user-select: none;
}

.adwm-lightbox button {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
}

.adwm-lightbox button:hover,
.adwm-lightbox button:focus-visible {
    background: rgba(255, 255, 255, .25);
}

.adwm-lightbox-close { top: 16px; right: 16px; }
.adwm-lightbox-prev { left: 16px; top: 50%; transform: translateY(-50%); }
.adwm-lightbox-next { right: 16px; top: 50%; transform: translateY(-50%); }

.adwm-lightbox-count {
    position: absolute;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    color: #ddd;
    font-size: 13px;
}

@media (max-width: 600px) {
    .adwm-lightbox-prev,
    .adwm-lightbox-next {
        display: none !important;
    }

    #wpforo .adwm-queue-row {
        grid-template-columns: minmax(0, 1fr) 80px 40px;
    }
}