.image-url-rows {
    display: grid;
    gap: 10px;
}

.image-url-row {
    display: grid;
    grid-template-columns: minmax(170px, 230px) minmax(0, 1fr) 42px 42px;
    gap: 8px;
    align-items: center;
}

.image-url-row > .image-url-type {
    grid-column: 1;
    grid-row: 1;
}

.image-url-row > .image-url-input {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    width: 100%;
}

.image-url-row > .image-url-custom-label {
    grid-column: 2 / 5;
    grid-row: 2;
    width: 100%;
}

.image-url-custom-label[hidden] {
    display: none;
}

.image-url-row > .image-url-remove {
    grid-column: 3;
    grid-row: 1;
}

.image-url-row > .image-url-history-open {
    grid-column: 4;
    grid-row: 1;
}

.image-url-history-open {
    color: var(--primary, var(--accent-color, currentColor));
}

.image-url-add {
    margin-top: 10px;
}

.image-url-history-dialog {
    width: min(620px, calc(100vw - 28px));
    max-height: min(720px, calc(100vh - 28px));
    padding: 0;
    border: 1px solid var(--border-color, var(--border));
    border-radius: 18px;
    color: inherit;
    background: var(--surface, var(--card-bg, #fff));
    box-shadow: 0 28px 90px rgba(0, 0, 0, .28);
    overflow: hidden;
}

.image-url-history-dialog::backdrop {
    background: rgba(8, 13, 22, .62);
    backdrop-filter: blur(4px);
}

.image-url-history-shell {
    display: grid;
    max-height: min(720px, calc(100vh - 28px));
}

.image-url-history-head {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 42px;
    gap: 12px;
    align-items: center;
    padding: 16px;
    border-bottom: 1px solid var(--border-color, var(--border));
    background: var(--surface-soft, rgba(127, 127, 127, .07));
}

.image-url-history-head-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    background: var(--primary-soft, rgba(38, 132, 255, .12));
    color: var(--primary, currentColor);
}

.image-url-history-head-copy {
    min-width: 0;
}

.image-url-history-head-copy h2,
.image-url-history-head-copy p {
    margin: 0;
}

.image-url-history-head-copy h2 {
    font-size: 18px;
}

.image-url-history-head-copy p {
    margin-top: 3px;
    font-size: 13px;
    opacity: .72;
}

.image-url-history-body {
    min-height: 250px;
    padding: 16px;
    overflow: auto;
}

.image-url-history-search-field {
    margin: 0 0 12px;
}

.image-url-history-status {
    min-height: 20px;
    margin-bottom: 7px;
    font-size: 12px;
    opacity: .7;
}

.image-url-history-list {
    display: grid;
    gap: 7px;
}

.image-url-history-item {
    appearance: none;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px;
    gap: 10px;
    align-items: center;
    width: 100%;
    padding: 10px 9px 10px 12px;
    border: 1px solid var(--border-color, var(--border));
    border-radius: 12px;
    color: inherit;
    background: var(--surface, var(--card-bg, #fff));
    text-align: left;
    cursor: pointer;
}

.image-url-history-item:hover,
.image-url-history-item:focus-visible {
    border-color: var(--primary, currentColor);
    background: var(--surface-soft, rgba(127, 127, 127, .08));
    outline: none;
}

.image-url-history-item[hidden] {
    display: none;
}

.image-url-history-item-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.image-url-history-item-copy strong,
.image-url-history-item-copy small,
.image-url-history-item-copy em {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.image-url-history-item-copy small {
    opacity: .72;
}

.image-url-history-item-copy em {
    color: var(--primary, currentColor);
    font-size: 11px;
    font-style: normal;
}

.image-url-history-select-icon {
    pointer-events: none;
    color: var(--primary, currentColor);
}

.image-url-history-empty {
    display: grid;
    justify-items: center;
    gap: 7px;
    padding: 34px 18px;
    text-align: center;
}

.image-url-history-empty[hidden] {
    display: none;
}

.image-url-history-empty small {
    max-width: 390px;
    opacity: .7;
}

.stage-source-links {
    position: relative;
}

.stage-source-links summary {
    list-style: none;
}

.stage-source-links summary::-webkit-details-marker {
    display: none;
}

.stage-source-links-popover {
    position: absolute;
    right: 0;
    bottom: calc(100% + 10px);
    z-index: 50;
    width: min(390px, calc(100vw - 32px));
    padding: 12px;
    border: 1px solid var(--border-color, var(--border));
    border-radius: 14px;
    background: var(--surface, var(--card-bg, #fff));
    box-shadow: 0 18px 55px rgba(0, 0, 0, .2);
}

.stage-source-links-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2px 4px 9px;
}

.stage-source-links-list {
    display: grid;
    gap: 6px;
}

.stage-source-link {
    display: grid;
    grid-template-columns: 34px 1fr auto;
    align-items: center;
    gap: 9px;
    padding: 9px;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
}

.stage-source-link:hover {
    background: var(--surface-soft, rgba(127, 127, 127, .1));
}

.stage-source-link-copy {
    min-width: 0;
    display: grid;
}

.stage-source-link-copy strong,
.stage-source-link-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stage-source-link-copy small {
    opacity: .7;
}

.dashboard-url-popover {
    position: relative;
    display: inline-block;
}

.dashboard-url-popover summary {
    cursor: pointer;
    list-style: none;
}

.dashboard-url-popover summary::-webkit-details-marker {
    display: none;
}

.dashboard-url-list {
    position: absolute;
    left: 0;
    top: calc(100% + 7px);
    z-index: 30;
    width: 320px;
    max-width: 70vw;
    padding: 10px;
    border: 1px solid var(--border-color, var(--border));
    border-radius: 12px;
    background: var(--surface, var(--card-bg, #fff));
    box-shadow: 0 14px 40px rgba(0, 0, 0, .18);
    display: grid;
    gap: 6px;
}

.dashboard-url-list a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-url-table td small {
    display: block;
    max-width: 360px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 760px) {
    .image-url-row {
        grid-template-columns: minmax(0, 1fr) 42px 42px;
    }

    .image-url-row > .image-url-type {
        grid-column: 1 / 4;
        grid-row: 1;
    }

    .image-url-row > .image-url-input {
        grid-column: 1;
        grid-row: 2;
    }

    .image-url-row > .image-url-remove {
        grid-column: 2;
        grid-row: 2;
    }

    .image-url-row > .image-url-history-open {
        grid-column: 3;
        grid-row: 2;
    }

    .image-url-row > .image-url-custom-label {
        grid-column: 1 / 4;
        grid-row: 3;
    }
}