:root {
    --color-ink: #333333;
    --color-rose: #c8598a;
    --color-mint: #0fc57e;
    --color-border: #d9d3d3;
    --color-surface: #ffffff;
    --color-soft: #f6f1f2;
    --admin-layout-max-width: 1920px;
    --admin-sidebar-width: 240px;
    --admin-header-height: 66px;
}

body {
    font-family: "Rajdhani", sans-serif;
    color: var(--color-ink);
    background: #e3e3e3;
    min-height: 100vh;
}

body.modal-open {
    padding-right: 0 !important;
    overflow-x: hidden;
}

.admin-title-count-badge {
    position: relative;
    top: -2px;
    background-color: #eee;
    border-radius: 0.375rem;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus {
    outline: 4px solid #fff3cd;
    outline-offset: 0;
    border-color: var(--bs-warning);
    box-shadow: none;
}

input[type="checkbox"]:focus,
input[type="radio"]:focus {
    outline: none;
    box-shadow: none;
}


input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    box-shadow: 0 0 0 1000px #ffffff inset !important;
    background-color: #ffffff !important;
    -webkit-text-fill-color: var(--color-ink);
    transition: background-color 9999s ease-in-out 0s;
}

html,
body {
    scrollbar-gutter: stable;
    background-color: #e3e3e3;
}

.admin-auth-body {
    background: #e3e3e3 url("../img/color-bar.jpg") center center / contain no-repeat;
}

.admin-shell {
    min-height: 100vh;
    width: min(100%, var(--admin-layout-max-width));
    margin-inline: auto;
    background: #e3e3e3;
    padding-left: var(--admin-sidebar-width);
    position: relative;
    z-index: 1;
}

body:not(.admin-auth-body)::before,
body:not(.admin-auth-body)::after {
    --admin-side-gap: max(0px, calc((100vw - var(--admin-layout-max-width)) / 2));
    --admin-colorbar-aspect: 6.530612245;
    content: "";
    position: fixed;
    top: 50%;
    width: max(100vh, calc(var(--admin-side-gap) * var(--admin-colorbar-aspect)));
    height: var(--admin-side-gap);
    background: transparent url("../img/color-bar.jpg") center center / cover no-repeat;
    transform: translate(-50%, -50%) rotate(90deg);
    transform-origin: center center;
    pointer-events: none;
    z-index: 0;
    opacity: 0.666;
}

body:not(.admin-auth-body)::before {
    left: calc(var(--admin-side-gap) / 2);
}

body:not(.admin-auth-body)::after {
    left: calc(100vw - (var(--admin-side-gap) / 2));
    transform: translate(-50%, -50%) rotate(-90deg) scaleX(-1);
}



.admin-sidebar {
    width: 240px;
    background: var(--color-ink);
    color: #f9f7f7;
    flex: 0 0 240px;
    position: fixed;
    top: 0;
    left: max(0px, calc((100vw - var(--admin-layout-max-width)) / 2));
    height: 100vh;
    overflow-y: auto;
    z-index: 1030;
    transition: none;
}

.admin-shell > .flex-grow-1 {
    min-width: 0;
}

.admin-sidebar .brand {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.brand-logo {
    height: 42px;
    width: auto;
    border-radius: 0.35rem;
    object-fit: contain;
}

.brand-logo--dark {
    background: var(--color-ink);
    padding: 0.35rem;
}

.brand-logo--full {
    height: 100%;
    max-height: 100%;
    padding: 0;
}

.brand-logo--admin {
    height: 46px;
}

.brand-logo--admin.brand-logo--full {
    height: auto;
    max-height: none;
    width: auto;
}

.admin-sidebar .nav-link {
    color: #f9f7f7;
    border-radius: 0.6rem;
    padding: 0.55rem 0.85rem;
    font-weight: 500;
}

.admin-sidebar .nav-link i {
    display: inline-block;
    width: 1.25rem;
    text-align: center;
}

.admin-sidebar .nav-link:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}

.admin-sidebar .nav-link.active {
    background: #f9f7f7;
    color: var(--color-ink);
}

.admin-header {
    background: var(--color-ink);
    color: #ffffff;
    position: fixed;
    top: 0;
    left: calc(max(0px, (100vw - var(--admin-layout-max-width)) / 2) + var(--admin-sidebar-width));
    right: max(0px, calc((100vw - var(--admin-layout-max-width)) / 2));
    min-height: var(--admin-header-height);
    z-index: 1020;
    transition: none;
}


.admin-header .btn-link {
    color: #ffffff;
}

.admin-content h1 i {
    margin-right: 1rem !important;
}

.admin-content {
    padding-top: var(--admin-header-height);
}

.admin-main {
    padding-bottom: 2.25rem;
}

body.sidebar-collapsed .admin-shell {
    padding-left: 0;
}

body.sidebar-collapsed .admin-sidebar {
    left: calc(-1 * var(--admin-sidebar-width));
    transform: none;
    display: block;
    transition: none;
    pointer-events: none;
}

body.sidebar-collapsed.sidebar-hover .admin-sidebar {
    left: max(0px, calc((100vw - var(--admin-layout-max-width)) / 2));
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.22);
    pointer-events: none;
    background: linear-gradient(transparent 0 3.5rem, var(--color-ink) 3.5rem);
}

body.sidebar-collapsed.sidebar-hover .admin-sidebar nav,
body.sidebar-collapsed.sidebar-hover .admin-sidebar .sidebar-footer {
    pointer-events: auto;
}

body.sidebar-collapsed.sidebar-hover .admin-sidebar .brand {
    visibility: visible;
    opacity: 0;
    pointer-events: none;
}

body.sidebar-collapsed .admin-header {
    left: max(0px, calc((100vw - var(--admin-layout-max-width)) / 2));
}

html.sidebar-collapsed .admin-shell {
    padding-left: 0;
}

html.sidebar-collapsed .admin-sidebar {
    left: calc(-1 * var(--admin-sidebar-width));
    transform: none;
    display: block;
    transition: none;
    pointer-events: none;
}

html.sidebar-collapsed .admin-header {
    left: max(0px, calc((100vw - var(--admin-layout-max-width)) / 2));
}


.sidebar-footer {
    color: #f4efef;
    font-size: 0.9rem;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.admin-card {
    border: 0.33rem solid #ffffff;
    border-radius: 0.5rem;
    background: var(--color-surface);
    box-shadow: 0 12px 30px rgba(113, 101, 101, 0.08);
}

.dashboard-home {
    color: var(--color-ink);
}

.dashboard-eyebrow__pill {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(51, 51, 51, 0.08);
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.dashboard-hero {
    border-color: #f4edee;
    background:
        radial-gradient(circle at top left, rgba(15, 197, 126, 0.16), transparent 28%),
        radial-gradient(circle at right center, rgba(200, 89, 138, 0.18), transparent 30%),
        linear-gradient(135deg, #fffdfd 0%, #f8f4f5 52%, #eff8f3 100%);
}

.dashboard-hero__backdrop {
    position: absolute;
    inset: auto -3rem -5rem auto;
    width: 18rem;
    height: 18rem;
    border-radius: 50%;
    background: rgba(51, 51, 51, 0.05);
    filter: blur(4px);
}

.dashboard-hero__title {
    max-width: 12ch;
    font-size: clamp(2rem, 4vw, 3.6rem);
    line-height: 0.95;
    letter-spacing: -0.04em;
}

.dashboard-hero__lead {
    max-width: 42rem;
    font-size: 1.05rem;
    color: rgba(51, 51, 51, 0.82);
}

.dashboard-panel-label {
    margin-bottom: 0.35rem;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(51, 51, 51, 0.62);
}

.dashboard-hero__focus {
    padding: 1.25rem;
    border-radius: 1.25rem;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(51, 51, 51, 0.08);
    box-shadow: 0 12px 24px rgba(113, 101, 101, 0.08);
}

.dashboard-hero__focus-title {
    margin-bottom: 0.5rem;
    font-size: 1.2rem;
    font-weight: 700;
}

.dashboard-hero-stat {
    height: 100%;
    padding: 1rem 1.1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.76);
    border: 1px solid rgba(51, 51, 51, 0.08);
}

.dashboard-hero-stat strong {
    display: block;
    margin: 0.15rem 0;
    font-size: 2rem;
    line-height: 1;
}

.dashboard-hero-stat__label,
.dashboard-hero-stat__meta {
    display: block;
}

.dashboard-hero-stat__label {
    font-size: 0.86rem;
    color: rgba(51, 51, 51, 0.68);
}

.dashboard-hero-stat__meta {
    font-size: 0.86rem;
    color: rgba(51, 51, 51, 0.78);
}

.dashboard-sidepanel {
    background: linear-gradient(180deg, #333333 0%, #484343 100%);
    color: #ffffff;
}

.dashboard-sidepanel .text-muted,
.dashboard-sidepanel .small {
    color: rgba(255, 255, 255, 0.72) !important;
}

.dashboard-sidepanel .dashboard-panel-label {
    color: rgba(255, 255, 255, 0.64);
}

.dashboard-trend {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 0.7rem;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 600;
}

.dashboard-trend--up {
    color: #103b2a;
    background: rgba(15, 197, 126, 0.92);
}

.dashboard-meter {
    height: 0.75rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    overflow: hidden;
}

.dashboard-meter span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #0fc57e 0%, #f3c86a 100%);
}

.dashboard-mini-row,
.dashboard-upload-item,
.dashboard-timeline__item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.dashboard-mini-row__value,
.dashboard-upload-item__time,
.dashboard-timeline__time,
.dashboard-pill {
    flex: 0 0 auto;
}

.dashboard-mini-row {
    padding-bottom: 0.9rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.dashboard-mini-row:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.dashboard-mini-row__value {
    min-width: 3rem;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    text-align: center;
    font-size: 1.05rem;
    font-weight: 700;
}

.dashboard-checklist__item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: rgba(255, 255, 255, 0.86);
}

.dashboard-checklist__item i {
    color: rgba(255, 255, 255, 0.7);
}

.dashboard-checklist__item.is-done i {
    color: var(--color-mint);
}

.dashboard-metric-card {
    position: relative;
    overflow: hidden;
    display: block;
    background: linear-gradient(to bottom, #e3e3e3 0%, #ffffff 33.33%);
    border-radius: 0.5rem;
    box-shadow: 0 12px 30px rgba(113, 101, 101, 0.08);
    border: 0;
    border-top: 3px solid var(--color-mint);
}

.dashboard-metric-card--link {
    color: inherit;
    text-decoration: none;
}

.dashboard-metric-card--link:hover,
.dashboard-metric-card--link:focus-visible {
    color: inherit;
    text-decoration: none;
    background: #ffffff;
}

.dashboard-metric-card--link:focus-visible {
    outline: 2px solid var(--color-mint);
    outline-offset: 2px;
}

.dashboard-metric-card__value {
    position: relative;
    z-index: 1;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1;
    text-align: right;
}

.dashboard-metric-card__header {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
}

.dashboard-metric-card__value--rose {
    color: var(--color-rose);
}

.dashboard-metric-card__meta {
    position: relative;
    z-index: 1;
    margin-top: 0.85rem;
    font-size: 0.92rem;
    font-weight: 500;
    line-height: 1.25;
    color: rgba(51, 51, 51, 0.78);
}

.dashboard-metric-card__meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: #f8f8f8;
}

.dashboard-metric-card__meta-row + .dashboard-metric-card__meta-row {
    margin-top: 0.35rem;
}

.dashboard-metric-card__meta-label {
    font-size: 1.04rem;
    text-align: left;
}

.dashboard-metric-card__meta-value {
    font-size: 1.35rem;
    font-weight: 600;
    line-height: 1;
    text-align: right;
    color: inherit;
}

.dashboard-metric-card__title {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    font-size: 1.12rem;
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;
}

.dashboard-metric-card__title::before {
    font-family: "Font Awesome 6 Free";
    font-size: 1.18rem;
    font-weight: 900;
    line-height: 1;
    color: currentColor;
}

.dashboard-metric-card--catalog .dashboard-metric-card__title::before {
    content: "\f302";
    font-weight: 400;
}

.dashboard-metric-card--orders .dashboard-metric-card__title::before {
    content: "\f07a";
}

.dashboard-metric-card--review .dashboard-metric-card__title::before {
    content: "\f06e";
}

.dashboard-metric-card--collectors .dashboard-metric-card__title::before {
    content: "\f502";
}

.dashboard-metric-card--statistics .dashboard-metric-card__title::before {
    content: none;
}

.dashboard-metric-card--statistics .dashboard-metric-card__title i {
    font-size: 1.18rem;
    line-height: 1;
}

@media (min-width: 1400px) {
    .dashboard-metric-col {
        flex: 0 0 20%;
        max-width: 20%;
    }
}

.dashboard-priority-item,
.dashboard-upload-item {
    padding: 1rem 1.1rem;
    border: 1px solid var(--color-border);
    border-radius: 1rem;
    background: linear-gradient(180deg, #ffffff 0%, #fbf9f9 100%);
}

.dashboard-priority-item__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.5rem;
}

.dashboard-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    padding: 0.22rem 0.65rem;
    border-radius: 999px;
    font-size: 0.85rem;
    font-weight: 700;
}

.dashboard-pill--rose {
    background: rgba(200, 89, 138, 0.14);
    color: #9b3f68;
}

.dashboard-pill--mint {
    background: rgba(15, 197, 126, 0.14);
    color: #0d8f5d;
}

.dashboard-pill--ink {
    background: rgba(51, 51, 51, 0.08);
    color: #333333;
}

.dashboard-timeline__item {
    position: relative;
    gap: 0.9rem;
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    background: #f8f4f5;
}

.dashboard-timeline__item.is-current {
    background: linear-gradient(135deg, rgba(200, 89, 138, 0.14) 0%, rgba(15, 197, 126, 0.14) 100%);
}

.dashboard-timeline__time,
.dashboard-upload-item__time {
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    background: #ffffff;
    color: rgba(51, 51, 51, 0.72);
    font-size: 0.8rem;
    font-weight: 700;
}

.dashboard-upload-item strong {
    display: block;
    margin-bottom: 0.2rem;
}

.dashboard-activity-card {
    background:
        radial-gradient(circle at top left, rgba(15, 197, 126, 0.08), transparent 26%),
        radial-gradient(circle at right top, rgba(200, 89, 138, 0.08), transparent 24%),
        linear-gradient(180deg, #ffffff 0%, #faf7f7 100%);
}

.dashboard-module-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 0.5rem;
}

.dashboard-module-block {
    padding: 1.15rem;
    border: 0;
    border-radius: 0.5rem;
    background: rgba(255, 255, 255, 0.86);
}

.dashboard-module-block__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    margin-bottom: 1rem;
}

.dashboard-module-block__head h3 {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-mint);
}

.dashboard-module-block__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.85rem;
    background: var(--color-soft);
    color: var(--color-rose);
    font-size: 1rem;
    flex: 0 0 auto;
}

.dashboard-module-block__list {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.dashboard-module-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 0.65rem;
    border-top: 1px solid rgba(51, 51, 51, 0.08);
}

.dashboard-module-item:hover {
    background: #f6f1f2;
}

.keyword-chain-row.is-editing > td {
    background: var(--bs-warning-bg-subtle, #fff3cd);
}

.keyword-chain-row.is-editing:hover > td {
    background: var(--bs-warning-bg-subtle, #fff3cd);
}

.keyword-chain-trigger-badge {
    cursor: pointer;
}

.keyword-chain-trigger-badge.is-active-trigger {
    font-weight: 500 !important;
}


.dashboard-module-item:first-child {
    padding-top: 0;
    border-top: 0;
}

.dashboard-module-item__main {
    min-width: 0;
}

.dashboard-module-item__main strong,
.dashboard-module-item__main span {
    display: block;
}

.dashboard-module-item__main strong {
    margin-bottom: 0.15rem;
    font-size: 0.96rem;
    font-weight: 600;
    word-break: break-word;
}

.dashboard-module-item__main span {
    color: rgba(51, 51, 51, 0.68);
    font-size: 0.88rem;
}

.dashboard-module-item__date {
    flex: 0 0 auto;
    color: rgba(51, 51, 51, 0.56);
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}

.dashboard-module-empty {
    color: rgba(51, 51, 51, 0.58);
    font-size: 0.92rem;
}

.dashboard-tracking-card {
    background: rgba(255, 255, 255, 0.9);
}

.dashboard-tracking-card__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 2rem !important;
}

.dashboard-tracking-card .dashboard-metric-card__title {
    text-transform: uppercase;
}

.dashboard-tracking-card .dashboard-metric-card__title::before {
    content: none;
}

.dashboard-tracking-card__top {
    flex: 0 0 auto;
    text-align: right;
    color: var(--color-rose);
    font-size: 1.12rem;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.dashboard-tracking-badge-rows {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.dashboard-tracking-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    justify-content: center;
}

.dashboard-tracking-badge-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.dashboard-tracking-badge {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: calc(0.35rem * var(--dashboard-badge-scale, 1)) calc(0.7rem * var(--dashboard-badge-scale, 1));
    background-color: #f6f1f2;
    font-size: calc(100% * var(--dashboard-badge-scale, 1));
    font-weight: 500;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
}

.dashboard-tracking-badge__label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-tracking-badge-wrap {
    min-width: 0;
    max-width: 100%;
}

.dashboard-tracking-badge__count {
    margin-left: calc(0.45rem * var(--dashboard-badge-scale, 1));
    color: var(--color-mint);
    font-weight: 500;
}

.dashboard-tracking-list {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.dashboard-tracking-list__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0;
    border-radius: 0.85rem;
    background: #f8f8f8;
}

.dashboard-tracking-list__item--link {
    color: inherit;
    text-decoration: none;
}

.dashboard-tracking-list__item--link:hover,
.dashboard-tracking-list__item--link:focus-visible {
    color: inherit;
    text-decoration: none;
}

.dashboard-tracking-list__main {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.dashboard-tracking-list__thumb {
    width: 4rem;
    height: 4rem;
    flex: 0 0 4rem;
    border-radius: 0.4rem;
    overflow: hidden;
    background: #eef1f4;
}

.dashboard-tracking-list__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dashboard-tracking-list__thumb img,
.group-cover-photo-preview-image,
.admin-detail-preview-frame .admin-detail-preview-image,
.photo-preview-img,
.lightbox-image,
.auth-collage-item {
    -webkit-user-drag: none;
    user-select: none;
}

.dashboard-tracking-list__thumb.is-placeholder {
    background: #d6d9de;
}

.dashboard-tracking-list__label {
    min-width: 0;
    display: -webkit-box;
    font-size: 0.95rem;
    font-weight: 500;
    line-height: 1.35;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dashboard-tracking-list__value {
    flex: 0 0 auto;
    font-size: 1.1rem;
    font-weight: 600;
    line-height: 1;
    color: var(--color-mint);
}

@media (max-width: 1399.98px) {
    .dashboard-module-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1199.98px) {
    .dashboard-module-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-hero__title {
        max-width: none;
    }
}

@media (max-width: 767.98px) {
    .dashboard-hero,
    .dashboard-sidepanel {
        border-width: 0.22rem;
    }

    .dashboard-hero__focus,
    .dashboard-hero-stat,
    .dashboard-priority-item,
    .dashboard-upload-item,
    .dashboard-timeline__item {
        border-radius: 0.85rem;
    }

    .dashboard-mini-row,
    .dashboard-upload-item,
    .dashboard-timeline__item,
    .dashboard-priority-item__head,
    .dashboard-module-item {
        flex-direction: column;
    }

}

.status-dot {
    display: inline-block;
    width: 13px;
    height: 13px;
    min-width: 13px;
    min-height: 13px;
    aspect-ratio: 1 / 1;
    flex: 0 0 auto;
    border-radius: 999px;
    background: #ccc;
    vertical-align: middle;
    box-sizing: border-box;
}

.status-dot--active {
    background: #2f9e44;
}

.status-dot--inactive {
    background: #c92a2a;
}

.status-dot--limited {
    background: #f08c00;
}

#photoGrid .admin-card.is-selected {
    border-color: #000000 !important;
}

#photoListBody tr.is-selected > td {
    background-color: #d4d6d9;
}

#photoListBody tr:hover > td {
    background-color: #f6f1f2;
}

#photoListBody tr.is-selected:hover > td {
    background-color: #c9ccd1;
}

.admin-card--approved {
    background: var(--bs-success-bg-subtle);
}

.admin-card--pending {
    background: var(--bs-warning-bg-subtle);
}

.admin-card--info {
    background: var(--bs-info-bg-subtle);
}

.admin-card--rejected {
    background: var(--bs-danger-bg-subtle);
}

.admin-card--draft {
    background: #ffffff;
}

.admin-card--draft-meta {
    background: var(--bs-secondary-bg-subtle);
}

body.photo-status-highlight-off #photoGrid .admin-card-footer-space.admin-card--approved,
body.photo-status-highlight-off #photoGrid .admin-card-footer-space.admin-card--pending,
body.photo-status-highlight-off #photoGrid .admin-card-footer-space.admin-card--rejected,
body.photo-status-highlight-off #photoGrid .admin-card-footer-space.admin-card--info,
body.photo-status-highlight-off #photoGrid .admin-card-footer-space.admin-card--draft,
body.photo-status-highlight-off #photoGrid .admin-card-footer-space.admin-card--draft-meta {
    background: transparent;
}

.admin-card-preview {
    background: #ffffff;
}


.photo-preview-title {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 0.75rem;
    opacity: 0;
    transition: opacity 150ms ease-in-out;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
}

.photo-grid-16 .photo-preview-title {
    align-items: center;
    padding-top: 0.75rem;
}

.photo-preview-title-text {
    display: block;
    max-width: 100%;
    font-weight: 500;
    line-height: 1.1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}

.photo-preview-title-text > span {
    display: block;
    max-width: 100%;
}

.photo-preview-file {
    display: none !important;
}

.photo-grid-16 .photo-preview-file {
    font-size: 0.85em;
    display: inline-block !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.photo-preview-empty {
    font-style: italic;
}

.admin-card:hover .photo-preview-title {
    opacity: 1;
}

.admin-card-footer-space {
    margin-top: 0.33rem;
    padding-top: 0;
    padding-bottom: 0;
    transition: filter 150ms ease-in-out;
}

.photo-grid-10 .admin-card-footer-space .d-flex {
    justify-content: center;
}

.photo-grid-10 .admin-card-footer-space .photo-file-name {
    text-align: center;
    width: 100%;
}

.photo-grid-10 .admin-card-footer-space .photo-check-wrap {
    display: none;
}

body[data-photo-mode="select"] #photoGrid.photo-grid-10 .admin-card.is-selected .admin-card-footer-space {
    background: #000000;
    margin-top: 0;
    padding-top: 0.33rem;
}

body[data-photo-mode="select"] #photoGrid.photo-grid-10 .admin-card.is-selected .admin-card-footer-space .photo-file-name {
    color: #ffffff !important;
}

.photo-check-wrap {
    position: relative;
    z-index: 2;
}


.admin-card:hover .admin-card-footer-space {
    filter: saturate(3);
}

.admin-card:hover .admin-card--draft-meta {
    filter: saturate(3) brightness(0.9);
}

.admin-card:hover .admin-card-footer-has-title {
    box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.1);
}

.suggest-box {
    position: absolute;
    z-index: 20;
    background: #ffffff;
    border: 1px solid #aaa;
    border-radius: 0.75rem;
    box-shadow: 0 14px 30px rgba(113, 101, 101, 0.15);
    width: 100%;
    max-height: 240px;
    overflow-y: auto;
}

.suggest-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0.8rem;
    cursor: pointer;
}

.suggest-item:hover {
    background: var(--color-soft);
}

.suggest-item img {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 0.5rem;
}

.suggest-box--shop {
    position: absolute;
    z-index: 20;
    background: #ffffff;
    border: 1px solid #aaa;
    border-radius: 0;
    box-shadow: 0 14px 30px rgba(113, 101, 101, 0.15);
    width: 100%;
    min-width: 30rem;
    max-height: none;
    overflow: visible;
}

.suggest-box--shop .suggest-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.35rem 0.8rem;
    cursor: pointer;
}

.cover-photo-suggest-thumb-wrap {
    width: 128px;
    height: 128px;
    min-width: 128px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f6f1f2;
    border-radius: 0.5rem;
    overflow: hidden;
}

.cover-photo-suggest-thumb {
    width: 128px !important;
    height: 128px !important;
    object-fit: contain !important;
    border-radius: 0 !important;
}

.group-cover-photo-group {
    align-items: stretch;
}

.group-cover-photo-preview {
    width: 128px;
    min-width: 128px;
    height: 128px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f6f1f2;
    border: 1px solid var(--bs-border-color);
    border-right: 0;
    border-radius: 0.375rem 0 0 0.375rem;
    overflow: hidden;
}

.group-cover-photo-preview.is-empty::before {
    content: "";
}

.group-cover-photo-preview-image {
    width: 128px;
    height: 128px;
    object-fit: contain;
}

.group-cover-photo-group .form-control {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.group-cover-photo-clear {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.suggest-box--shop .suggest-badge {
    margin-left: auto;
    font-size: 0.75rem;
    text-transform: none;
    letter-spacing: 0.04em;
    color: #333333;
    background: #f6f1f2;
    border-radius: 999px;
    padding: 0.15rem 0.5rem;
}

.suggest-badge {
    font-size: inherit;
    text-transform: none;
    letter-spacing: 0.04em;
    color: #333333;
    background: #f6f1f2;
    border-radius: 999px;
    padding: 0.15rem 0.5rem;
}

.photo-list-card .suggest-badge {
}

.photo-list-card .suggest-badge .fa-xmark {
    color: #595c5f;
}

.status-badge {
    font-size: 0.875em;
    font-weight: 400;
    color: var(--bs-table-color, inherit) !important;
}

.suggest-box--shop .suggest-item:hover,
.suggest-box--shop .suggest-item.is-active {
    background: var(--color-soft);
}

.suggest-box--shop mark {
    background: none;
    color: var(--color-rose);
    padding: 0;
    border-radius: 0;
    font-weight: 600;
}

.photo-search-wrap {
    width: 25rem;
    max-width: 100%;
}

.photo-search-wrap .input-group {
    position: relative;
}

.keyword-search-wrap .suggest-box--shop {
    min-width: 0;
}

.keyword-search-wrap {
    width: 50%;
    max-width: 100%;
}

.keyword-search-form .keyword-filter-group {
    display: inline-flex;
    flex-wrap: wrap;
}

.keyword-search-form .keyword-filter-group > .btn {
    flex: 0 0 auto;
    width: 2.25rem;
}

.keyword-search-wrap .search-input-has-clear {
    padding-right: 3.35rem;
}

.photo-search-wrap.keyword-search-wrap .search-clear {
    right: 3.3rem;
    z-index: 5;
}

.keyword-bulk-form {
    max-width: 50%;
    margin-left: auto;
}

.keyword-bulk-group {
    width: 100%;
}

@media (max-width: 991.98px) {
    .keyword-search-wrap,
    .keyword-bulk-form {
        width: 100%;
        max-width: 100%;
    }

    .keyword-search-form .keyword-filter-group {
        width: 100%;
    }
}

.photo-filter-select {
    width: 9.75rem;
    max-width: 100%;
}

#photoSortSelect {
    padding-left: 0.88rem;
}

.photo-sort-toggle {
    padding-left: 0.666rem !important;
    padding-right: 0.75rem !important;
}

.photo-status-dropdown .photo-dropdown-toggle.photo-filter-select {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    font-weight: 500;
    color: #333333;
}

.photo-edit-label {
    width: 6rem;
    justify-content: flex-end;
    text-align: right;
    font-size: 0.8rem;
    font-weight: 600;
    align-items: center;
    line-height: 1.2;
    padding-bottom: 0.25rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    background-color: #eee;
    border-color: #aaa;
    border-right: 0;
    color: #333333;
}


.photo-edit-label--top {
    align-items: flex-start;
    padding-top: 0.666rem;
}

.photo-edit-id {
    font-size: 1rem;
}

.photo-edit-slug-toggle {
    color: #6c757d;
    border-color: #aaa;
    background: #f6f7f8;
}

.photo-edit-slug-toggle:hover,
.photo-edit-slug-toggle:focus,
.photo-edit-slug-toggle:focus-visible {
    color: #5c636a;
    border-color: #aaa;
    background: #eef0f2;
    box-shadow: none;
}

.photo-edit-slug-toggle:active,
.photo-edit-slug-toggle.active,
.photo-edit-slug-toggle:active:focus,
.photo-edit-slug-toggle:active:focus-visible,
.photo-edit-slug-toggle.btn-outline-secondary:active {
    color: #6c757d;
    border-color: #aaa;
    background: #f6f7f8;
    box-shadow: none;
}

.photo-edit-slug-toggle:disabled,
.photo-edit-slug-toggle.disabled {
    color: #6c757d;
    border-color: #aaa;
    background: #f6f7f8;
    opacity: 1;
}

.photo-rotate-trigger,
.photo-reupload-trigger {
    width: 2.4rem;
    height: 2.4rem;
    padding: 0;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.admin-detail-preview-card {
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: stretch;
    padding: 0;
    border-radius: 0;
    overflow: hidden;
    border: 0;
    background: #e3e3e3;
    box-shadow: none;
}

.admin-detail-meta-card {
    box-shadow: 0 2px 30px rgba(113, 101, 101, 0.08) !important;
}

.admin-detail-preview-frame {
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #e3e3e3;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
}

.admin-detail-preview-frame .admin-detail-preview-image {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: top right;
    display: block;
    border-radius: 0;
}

#photoForm .form-control:not(.is-valid):not(.is-invalid),
#photoForm .form-select:not(.is-valid):not(.is-invalid),
#photoForm .select2-container .select2-selection--multiple,
#photoForm .select2-container .select2-selection--single {
    font-size: 1rem;
    font-weight: 500;
    border-color: #aaa;
}

#photoForm input.form-control,
#photoForm textarea.form-control {
    font-weight: 500;
}

#photoForm #photos_edit_url_slug {
    font-weight: 500;
}

input.form-control[form="photoForm"],
textarea.form-control[form="photoForm"],
#photos_edit_url_slug[form="photoForm"] {
    font-weight: 500;
}

#photoForm .form-control:disabled,
#photoForm .form-select:disabled,
#photoForm textarea:disabled {
    background-color: #fff !important;
    opacity: 1;
}

#photoForm #photos_edit_url_slug[readonly] {
    background-color: #fff !important;
}

#photoForm .form-control:read-only,
#photoForm .form-control[readonly] {
    background-color: #fff !important;
}

#photoForm .photo-edit-group .form-control:disabled,
#photoForm .photo-edit-group .form-control[readonly] {
    background-color: #fff !important;
}

#photos_edit_url_slug {
    background-color: #fff !important;
    border-left-color: #dee2e6 !important;
}

#photoForm #photos_edit_title {
    font-weight: 500;
}

.photo-edit-group .form-control:not(.is-valid):not(.is-invalid) {
    font-size: 1rem;
    font-weight: 500;
    border-color: #aaa;
}

#photoForm .photo-edit-label + .form-control,
#photoForm .photo-edit-label + .form-select,
#photoForm .photo-edit-label + .select2-container .select2-selection--multiple,
#photoForm .photo-edit-label + .select2-container .select2-selection--single {
    border-left-color: #dee2e6;
}

#photoForm #photos_edit_url_slug {
    border-left-color: #dee2e6 !important;
}

#photoForm .photo-edit-group .photo-edit-label + #photos_edit_url_slug {
    border-left-color: #dee2e6 !important;
}

#photoForm label[for="photos_edit_url_slug"].photo-edit-label {
    border-right-color: #dee2e6 !important;
}

#photoForm .photo-edit-group:not(:has(.form-control.is-valid)):not(:has(.form-control.is-invalid)) label[for="photos_edit_url_slug"].photo-edit-label {
    border-right-color: #dee2e6;
}

.photo-edit-group .photo-edit-label + .form-control {
    border-left-color: #dee2e6;
}

#photoForm .photo-edit-label + .form-control:not(.is-valid):not(.is-invalid),
#photoForm .photo-edit-label + .form-select:not(.is-valid):not(.is-invalid) {
    border-left-color: #dee2e6;
}

#photoForm .photo-keywords-group {
    align-items: stretch;
}

#photoForm .photo-keywords-group .photo-edit-label {
    align-self: stretch;
}

#bulkEditModal .photo-edit-label {
    background-color: #eee;
}

#bulkEditModal .photo-keywords-group .photo-edit-label {
    align-self: stretch;
}

#bulkEditModal .photo-form-suggest {
    left: 6rem;
    width: calc(100% - 6rem);
}

#bulkEditModal .keywords-pillbox.has-tags .keywords-input::placeholder {
    opacity: 0;
}

#bulkEditModal .modal-dialog {
    max-width: 50vw;
}

#bulkEditModal .modal-footer {
    padding-bottom: 1.25rem;
}

#bulkEditModal .modal-content {
    padding-top: 0.25rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

#bulkEditModal .bulk-mode-toggle .btn {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    line-height: 1.1;
}

#importModal .bulk-mode-toggle .btn {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    line-height: 1.1;
}

#bulkEditModal .bulk-mode-toggle {
    display: flex;
    align-items: stretch;
}

#importModal .bulk-mode-toggle {
    display: flex;
    align-items: stretch;
}

#bulkEditModal .bulk-mode-button {
    height: 100%;
    align-self: stretch;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-color: #aaa;
    color: #000;
}

#importModal .bulk-mode-button {
    height: 100%;
    align-self: stretch;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-color: #aaa;
    color: #000;
}

#bulkEditModal .bulk-mode-button:hover,
#bulkEditModal .bulk-mode-button:focus,
#bulkEditModal .bulk-mode-button:active {
    color: #000;
}

#importModal .bulk-mode-button:hover,
#importModal .bulk-mode-button:focus,
#importModal .bulk-mode-button:active {
    color: #000;
}

#bulkEditModal .bulk-mode-button[data-mode="replace"] {
    background-color: var(--bs-warning-bg-subtle);
}

#importModal .bulk-mode-button[data-mode="replace"] {
    background-color: var(--bs-warning-bg-subtle);
}

#bulkEditModal .bulk-mode-button[data-mode="fill"] {
    background-color: var(--bs-success-bg-subtle);
}

#importModal .bulk-mode-button[data-mode="fill"] {
    background-color: var(--bs-success-bg-subtle);
}

#bulkEditModal .bulk-mode-button[data-mode="remove"] {
    background-color: var(--bs-danger-bg-subtle);
}

#importModal .bulk-mode-button[data-mode="remove"] {
    background-color: var(--bs-danger-bg-subtle);
}

#bulkEditModal .bulk-mode-button[data-mode="add"] {
    background-color: var(--bs-info-bg-subtle);
}

#importModal .bulk-mode-button[data-mode="add"] {
    background-color: var(--bs-info-bg-subtle);
}

#bulkEditModal .bulk-mode-button[data-mode="subtract"] {
    background-color: var(--bs-secondary-bg-subtle);
}

#importModal .bulk-mode-button[data-mode="subtract"] {
    background-color: var(--bs-secondary-bg-subtle);
}

#importModal .modal-header {
    padding-top: 1.25rem;
}

#importModal .modal-footer {
    padding-bottom: 1.25rem;
}

#importModal .modal-content {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

#importModal .photo-dropdown {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
}

#importModal .photo-dropdown-toggle,
#importModal .photo-dropdown-menu {
    width: 100%;
}

#importModal label[for="import_map_original_name"].photo-edit-label {
    letter-spacing: -0.033rem;
}

#importModal label[for="import_map_note"].photo-edit-label {
    letter-spacing: -0.033rem;
}

#importModal label[for="importCsvDelimiter"].photo-edit-label,
#importModal label[for="importCsvEnclosure"].photo-edit-label,
#importModal label[for="importTagsDelimiter"].photo-edit-label,
#importModal label[for="importTagsEnclosure"].photo-edit-label {
    width: 7rem;
}

#importModal label[for="importCsvDelimiter"].photo-edit-label,
#importModal label[for="importCsvEnclosure"].photo-edit-label {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

#importModal label[for="importTagsDelimiter"].photo-edit-label,
#importModal label[for="importTagsEnclosure"].photo-edit-label {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-top: 0;
}

#importModal label[for="importCsvEnclosure"].photo-edit-label {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 0;
}

#importModal label[for="importTagsEnclosure"].photo-edit-label {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 0;
}

#importModal #importCsvDelimiter,
#importModal #importCsvEnclosure,
#importModal #importTagsDelimiter,
#importModal #importTagsEnclosure {
    border-left: 0;
}

#importModal #importCsvDelimiter,
#importModal #importCsvEnclosure {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

#importModal #importTagsDelimiter,
#importModal #importTagsEnclosure {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-top: 0;
}

#importModal #importCsvDelimiter {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

#importModal #importCsvEnclosure {
    border-left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

#importModal #importTagsDelimiter {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

#importModal #importTagsEnclosure {
    border-left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

#importModal .form-check-input:checked {
    background-color: var(--bs-secondary);
    border-color: var(--bs-secondary);
}

#importModal .form-check-input:focus {
    border-color: #aaa;
    outline: none;
}

#importModal .form-check-input:not(:checked) {
    border-color: #aaa;
}

#importModal .form-check {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

#importModal .form-check-input {
    width: 1.15rem;
    height: 1.15rem;
    margin-top: 0;
}

#importConfirmModal #importPreviewList {
    display: grid;
    grid-template-columns: max-content 1fr;
    column-gap: 0.5rem;
    row-gap: 0.2rem;
}

#importConfirmModal #importPreviewList .import-preview-row {
    display: contents;
}

#importConfirmModal #importPreviewList .import-preview-label {
    text-align: right;
    white-space: nowrap;
}

#importConfirmModal #importPreviewList .import-preview-label::after {
    content: ':';
    margin-left: 0.2rem;
}

#importConfirmModal #importPreviewList .import-preview-value {
    font-weight: 600;
}

#importConfirmModal #importPreviewList .import-preview-value.is-empty {
    font-weight: 400;
    font-style: italic;
}

#importModal .photo-dropdown-toggle,
#importModal .photo-dropdown-menu {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

#importModal .photo-dropdown-toggle {
    border-left: 0;
}

#importModal .import-status-dropdown .photo-dropdown-toggle {
    border-left: 1px solid #aaa;
    border-top-left-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
}

#importModal .import-status-dropdown .photo-dropdown-menu {
    border-top-left-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
}

#importModal .photo-dropdown-menu {
    top: auto;
    bottom: 100%;
    margin-bottom: -1px;
}

#importModal .photo-dropdown.is-open .photo-dropdown-toggle {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0.5rem;
}

#importModal .photo-dropdown.is-open .photo-dropdown-menu {
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

#importModal .import-status-dropdown .photo-dropdown-menu {
    top: 100%;
    bottom: auto;
    margin-top: -1px;
}

#importModal [data-select-id="import_map_original_name"] .photo-dropdown-menu {
    top: 100%;
    bottom: auto;
    margin-top: -1px;
    margin-bottom: 0;
}

#importModal [data-select-id="import_map_original_name"].is-open .photo-dropdown-toggle {
    border-top-left-radius: 0;
    border-top-right-radius: 0.5rem;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

#importModal [data-select-id="import_map_original_name"].is-open .photo-dropdown-menu {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}


#importModal .import-status-dropdown.is-open .photo-dropdown-toggle {
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-left: 1px solid #aaa;
}

#importModal .import-status-dropdown.is-open .photo-dropdown-menu {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}

#importModal .photo-dropdown-item {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#importModal .photo-dropdown-toggle {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
    min-width: 0;
}

#importModal .photo-dropdown-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
    flex: 1 1 auto;
    font-weight: 600;
}

#bulkEditModal .bulk-mode-toggle .btn:disabled {
    opacity: 0.45;
    pointer-events: none;
}

#importModal .bulk-mode-toggle .btn:disabled {
    opacity: 1;
    pointer-events: none;
    background-color: #f8d7da;
}

#bulkEditModal .form-control:disabled,
#bulkEditModal .form-select:disabled,
#bulkEditModal textarea.form-control:disabled,
#bulkEditModal .keywords-input:disabled {
    background-color: #ffffff;
    opacity: 1;
}

#bulkEditModal .btn.btn-mint:disabled,
#bulkEditModal .btn.btn-mint.disabled {
    background-color: var(--color-mint);
    border-color: var(--color-mint);
    color: #ffffff;
    opacity: 1;
}

#bulkEditModal .input-group .form-control,
#bulkEditModal .input-group .form-select,
#bulkEditModal .input-group .keywords-pillbox {
    box-shadow: inset 1px 0 0 #eee;
}

#bulkEditModal .input-group .form-control:focus,
#bulkEditModal .input-group .form-select:focus,
#bulkEditModal .input-group .keywords-pillbox:focus-within {
    box-shadow: inset 1px 0 0 #eee;
}

#bulkEditModal .photo-edit-label + .form-control,
#bulkEditModal .photo-edit-label + textarea.form-control,
#bulkEditModal .photo-edit-label + .form-select {
    border-left-color: #dee2e6;
}

#bulkEditModal .input-group > .photo-edit-label {
    position: relative;
    z-index: 2;
}

#bulkEditModal .input-group > .form-control,
#bulkEditModal .input-group > textarea.form-control,
#bulkEditModal .input-group > .form-select,
#bulkEditModal .photo-keywords-group .keywords-pillbox {
    position: relative;
    z-index: 1;
    margin-left: -1px;
}

#bulkEditModal .input-group:focus-within {
    outline: 4px solid #fff3cd;
    outline-offset: 0;
    border-radius: 0.375rem;
    box-shadow: none;
}

#bulkEditModal .input-group:focus-within .photo-edit-label {
    border-right-color: #eee !important;
}

#bulkEditModal .input-group:focus-within .form-control,
#bulkEditModal .input-group:focus-within .form-select {
    border-left-color: #eee !important;
}

#photoForm #keywordsSuggest {
    left: 6rem;
    width: calc(100% - 6rem);
}

#photoForm #photoTitleSuggest {
    left: 6rem;
    width: calc(100% - 6rem);
}

#photoForm .photo-form-suggest {
    left: 6rem;
    width: calc(100% - 6rem);
}

#photoForm .input-group:has(.form-control.is-valid) .photo-edit-label,
#photoForm .input-group:has(.form-select.is-valid) .photo-edit-label,
#photoForm .input-group:has(.form-control.is-valid) .form-control,
#photoForm .input-group:has(.form-select.is-valid) .form-select {
    border-color: var(--bs-success);
}

.photo-edit-group:has(.form-control.is-valid) .photo-edit-label,
.photo-edit-group:has(.form-control.is-valid) .form-control {
    border-color: var(--bs-success);
}

#photoForm .input-group:has(.form-control.is-valid) .form-control,
#photoForm .input-group:has(.form-select.is-valid) .form-select {
    border-left-color: #dee2e6;
}

.photo-edit-group:has(.form-control.is-valid) .form-control {
    border-left-color: #dee2e6;
}

#photoForm .input-group:has(.form-control.is-invalid) .photo-edit-label,
#photoForm .input-group:has(.form-select.is-invalid) .photo-edit-label,
#photoForm .input-group:has(.form-control.is-invalid) .form-control,
#photoForm .input-group:has(.form-select.is-invalid) .form-select {
    border-color: var(--bs-danger);
}

.photo-edit-group:has(.form-control.is-invalid) .photo-edit-label,
.photo-edit-group:has(.form-control.is-invalid) .form-control {
    border-color: var(--bs-danger);
}

#photoForm .input-group:has(.form-control.is-invalid) .form-control,
#photoForm .input-group:has(.form-select.is-invalid) .form-select {
    border-left-color: #dee2e6;
}

.photo-edit-group:has(.form-control.is-invalid) .form-control {
    border-left-color: #dee2e6;
}


#photoForm .input-group:focus-within {
    outline: 4px solid #fff3cd;
    outline-offset: 0;
    border-radius: 0.375rem;
    box-shadow: none;
}

.photo-edit-group:focus-within {
    outline: 4px solid #fff3cd;
    outline-offset: 0;
    border-radius: 0.375rem;
    box-shadow: none;
}

#photoForm .input-group:focus-within .form-control,
#photoForm .input-group:focus-within .form-select,
#photoForm .input-group:focus-within textarea {
    outline: none;
    box-shadow: none;
}

.photo-edit-group:focus-within .form-control {
    outline: none;
    box-shadow: none;
}


.photo-sort-dropdown,
.photo-dropdown {
    position: relative;
}

.photo-sort-toggle,
.photo-dropdown-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    text-align: left;
    background-color: #ffffff;
    border-color: #aaa;
}

.photo-status-dropdown .photo-dropdown-toggle:hover,
.photo-status-dropdown .photo-dropdown-toggle:focus {
    background-color: var(--bs-secondary) !important;
    border-color: var(--bs-secondary) !important;
    color: #ffffff !important;
}

.photo-sort-menu,
.photo-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1050;
    min-width: 100%;
    padding: 0.35rem 0;
    border: 1px solid #aaa;
    border-radius: 0.5rem;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
    display: none;
    max-height: 69vh;
    overflow-y: auto;
}

.photo-status-dropdown,
.photo-status-dropdown .photo-dropdown-toggle,
.photo-status-dropdown .photo-dropdown-menu {
    width: 12.5rem;
}

.photo-sort-menu {
    left: 50%;
    transform: translateX(-50%);
}

.photo-dropdown-user {
    width: calc(16rem + 7rem);
}

.photo-dropdown-user .photo-dropdown-toggle {
    width: calc(16rem + 7rem);
}

.photo-dropdown-user .photo-dropdown-menu {
    width: calc(16rem + 7rem);
}

#photoSelectActionsDropdown,
#photoSelectActionsDropdown .photo-dropdown-toggle,
#photoSelectActionsDropdown .photo-dropdown-menu {
    width: 10rem;
}

#photoCategoryDropdown,
#photoCategoryDropdown .photo-dropdown-toggle,
#photoCategoryDropdown .photo-dropdown-menu {
    width: 100%;
}

#photoCategoryGroup {
    --photo-select-group-width: 19rem;
    width: var(--photo-select-group-width);
    display: inline-flex !important;
    align-items: stretch;
    gap: 0;
    flex: 0 0 auto;
    white-space: nowrap;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible;
    position: relative;
}

#photoCategoryGroup #photoCategoryDropdown {
    flex: 1 1 auto;
    min-width: 0;
    margin-left: 0;
    width: 100%;
}

#photoCategoryToggle {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    flex: 0 0 auto;
}

#photoCategoryDropdown .photo-dropdown-toggle {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

#photoCategoryDropdown {
    margin-left: -1px;
}

#photoCategoryDropdown {
    display: block;
    position: static;
}

#photoCategoryDropdown .photo-dropdown-toggle,
#photoCategoryDropdown .photo-dropdown-menu {
    width: 100%;
}

#photoCategoryDropdown .photo-dropdown-menu {
    left: 0;
    right: 0;
    width: 100%;
}

#photoCategoryDropdown .photo-dropdown-toggle,
#photoCategoryDropdown .photo-dropdown-toggle:focus,
#photoCategoryDropdown .photo-dropdown-toggle:focus-visible {
    background: transparent;
    color: var(--bs-secondary);
    border-color: var(--bs-secondary);
    display: inline-flex;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
    z-index: 1;
}

#photoCategoryToggle,
#photoCategoryToggle:focus,
#photoCategoryToggle:focus-visible,
#photoCategoryToggle:hover,
#photoCategoryToggle:active,
#photoCategoryToggle.active {
    background: var(--bs-secondary);
    color: #ffffff;
    border-color: var(--bs-secondary);
}

#photoCategoryGroup.is-open #photoCategoryToggle {
    border-bottom-left-radius: 0;
}

#photoCategoryDropdown .photo-dropdown-toggle:hover,
#photoCategoryDropdown .photo-dropdown-toggle:active,
#photoCategoryDropdown .photo-dropdown-toggle.active {
    background: var(--bs-secondary);
    color: #ffffff;
    border-color: var(--bs-secondary);
}

.photo-select-actions-group {
    --photo-select-group-width: 15rem;
    display: inline-flex;
    align-items: stretch;
    gap: 0;
    flex-wrap: nowrap;
    white-space: nowrap;
    flex: 0 0 auto;
    width: var(--photo-select-group-width);
}

#photoCategoryGroup {
    --photo-select-group-width: 18.5rem;
}

.photo-select-actions-group #photoModeToggle {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    flex: 0 0 auto;
}

.photo-select-actions-group #photoModeToggle {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    line-height: 1.5;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.photo-select-actions-group #photoSelectCount {
    font-weight: 500;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 1.05rem;
    line-height: 1;
}


.photo-select-actions-group #photoModeToggle.btn-rose:not(.active) {
    background: transparent;
    color: var(--color-rose);
    border-color: var(--color-rose);
}

.photo-select-actions-group #photoModeToggle.btn-rose:not(.active):hover {
    background: var(--color-rose);
    color: #ffffff;
}

.photo-select-actions-group #photoModeToggle.btn-rose:not(.active):focus,
.photo-select-actions-group #photoModeToggle.btn-rose:not(.active):focus-visible {
    background: transparent !important;
    color: var(--color-rose) !important;
    border-color: var(--color-rose) !important;
}

.photo-select-actions-group #photoModeToggle.btn-rose:not(.active):focus:hover,
.photo-select-actions-group #photoModeToggle.btn-rose:not(.active):focus-visible:hover {
    background: var(--color-rose) !important;
    color: #ffffff !important;
}

.photo-select-actions-group #photoSelectActionsDropdown .photo-dropdown-toggle {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    width: 100%;
}

.photo-select-actions-group #photoSelectActionsDropdown .photo-dropdown-menu {
    width: 100%;
}

.photo-select-actions-group #photoSelectActionsDropdown {
    margin-left: -1px;
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
}

.photo-select-actions-group #photoSelectActionsDropdown .photo-dropdown-toggle,
.photo-select-actions-group #photoSelectActionsDropdown .photo-dropdown-toggle:focus,
.photo-select-actions-group #photoSelectActionsDropdown .photo-dropdown-toggle:focus-visible {
    background: transparent;
    color: var(--color-rose);
    border-color: var(--color-rose);
}

.photo-select-actions-group #photoSelectActionsDropdown .photo-dropdown-toggle:hover,
.photo-select-actions-group #photoSelectActionsDropdown .photo-dropdown-toggle:active,
.photo-select-actions-group #photoSelectActionsDropdown .photo-dropdown-toggle.active {
    background: var(--color-rose);
    color: #ffffff;
    border-color: var(--color-rose);
}

.photo-dropdown-user.upload-collector,
.photo-dropdown-user.upload-collector .photo-dropdown-toggle,
.photo-dropdown-user.upload-collector .photo-dropdown-menu {
    width: calc(22rem + 7rem);
}

.photo-sort-dropdown.is-open .photo-sort-menu,
.photo-dropdown.is-open .photo-dropdown-menu {
    display: block;
}

.photo-sort-dropdown.is-open .photo-sort-toggle,
.photo-dropdown.is-open .photo-dropdown-toggle {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.photo-sort-dropdown.is-open .photo-sort-menu,
.photo-dropdown.is-open .photo-dropdown-menu {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.photo-sort-item,
.photo-dropdown-item {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0.4rem 0.75rem;
    border: 0;
    background: transparent;
    text-align: left;
    font-size: 0.9rem;
    color: inherit;
    white-space: nowrap;
}

.photo-status-dropdown .photo-dropdown-item {
    font-size: 1rem;
}

#photoCategoryDropdown .photo-dropdown-item {
    font-size: 1rem;
}


.photo-dropdown-item i {
    line-height: 1;
    display: inline-flex;
    align-items: center;
}

.photo-dropdown-item-text {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    line-height: 1.2;
    font-weight: 500;
}

.photo-dropdown-meta {
    font-size: 1rem;
    color: #6c757d;
    line-height: 1.2;
    font-weight: 400;
}

.photo-dropdown-owner {
    font-size: 0.75rem;
    color: #6c757d;
    line-height: 1.2;
    font-weight: 400;
    align-self: center;
}

.photo-category-delete-modal .modal-body {
    min-height: 7.25rem;
}

.photo-dropdown-item.is-disabled {
    opacity: 0.5;
    pointer-events: none;
}

.photo-dropdown-item.is-selected {
    background-color: #f6f1f2;
    font-weight: 600;
}

body[data-photo-mode="select"]:not([data-photo-category-manage-disabled="true"]) #photoCategoryDropdown .photo-dropdown-item[data-dropdown-value="all"] {
    display: none;
}

.photo-sort-item {
    padding-left: 0.666rem;
    padding-right: 0.75rem;
}

.photo-sort-row {
    display: flex;
    gap: 0.25rem;
    padding: 0.15rem 0.5rem;
}

.photo-sort-row .photo-sort-item {
    width: 50%;
    padding: 0.35rem 0.5rem;
    border-radius: 0.4rem;
}

.photo-sort-item.is-desc i.fa-signal {
    transform: scaleX(-1);
}

.photo-sort-label.is-desc i.fa-signal {
    transform: scaleX(-1);
}

.photo-sort-item:hover,
.photo-sort-item:focus,
.photo-dropdown:not(.photo-status-dropdown) .photo-dropdown-item:hover,
.photo-dropdown:not(.photo-status-dropdown) .photo-dropdown-item:focus {
    background-color: #f6f1f2;
}

.photo-status-dropdown .photo-dropdown-item:hover,
.photo-status-dropdown .photo-dropdown-item:focus {
    filter: brightness(0.96);
}

.photo-sort-divider,
.photo-dropdown-divider {
    height: 1px;
    margin: 0.25rem 0.5rem;
    background: var(--color-border);
}

.photo-dropdown-label {
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0;
    width: 100%;
    font-weight: 500;
}

.photo-status-dropdown.is-compact.is-draft .photo-dropdown-toggle .photo-dropdown-label,
.photo-status-dropdown.is-compact.is-all .photo-dropdown-toggle .photo-dropdown-label {
    letter-spacing: -0.025rem;
}

.photo-dropdown-user .photo-dropdown-label,
.photo-dropdown-user .photo-dropdown-item {
    font-size: 1rem;
    font-weight: 500;
    color: #333333;
}

.photo-dropdown-user .photo-dropdown-toggle:hover,
.photo-dropdown-user .photo-dropdown-toggle:focus,
.photo-dropdown-user .photo-dropdown-toggle:focus-visible {
    color: #ffffff;
    background-color: #333333;
    border-color: #333333;
}

.photo-dropdown-user .photo-dropdown-toggle:hover .photo-dropdown-label,
.photo-dropdown-user .photo-dropdown-toggle:focus .photo-dropdown-label,
.photo-dropdown-user .photo-dropdown-toggle:focus-visible .photo-dropdown-label {
    color: #ffffff;
}

.photo-dropdown-count {
    background: #eee;
    border-radius: 999px;
    padding: 0.1rem 0.5rem;
    padding-top: 0.02rem;
    padding-bottom: 0.01rem;
    font-size: 1rem;
    color: #000000;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.25rem;
    width: 5.5rem;
}

.photo-dropdown-item .photo-dropdown-count {
    font-size: 0.8rem;
    padding-top: 0.01rem;
    padding-bottom: 0.005rem;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
    width: 4.5rem;
}


.photo-status-dropdown.is-draft .photo-dropdown-toggle {
    background-color: var(--bs-info-bg-subtle);
}

.photo-status-dropdown .photo-dropdown-toggle[data-status-value="approved"] {
    background-color: var(--bs-success-bg-subtle);
}

.photo-status-dropdown .photo-dropdown-toggle[data-status-value="pending"] {
    background-color: var(--bs-warning-bg-subtle);
}

.photo-status-dropdown .photo-dropdown-toggle[data-status-value="rejected"] {
    background-color: var(--bs-danger-bg-subtle);
}

.photo-status-dropdown .photo-dropdown-toggle[data-status-value="all"] {
    background-color: #ffffff;
}

.photo-status-dropdown .photo-dropdown-item[data-status-value="draft"] {
    background-color: var(--bs-info-bg-subtle);
    color: #333333;
}

.photo-status-dropdown .photo-dropdown-item[data-status-value="approved"] {
    background-color: var(--bs-success-bg-subtle);
    color: #333333;
}

.photo-status-dropdown .photo-dropdown-item[data-status-value="pending"] {
    background-color: var(--bs-warning-bg-subtle);
    color: #333333;
}

.photo-status-dropdown .photo-dropdown-item[data-status-value="rejected"] {
    background-color: var(--bs-danger-bg-subtle);
    color: #333333;
}

.photo-status-dropdown .photo-dropdown-item[data-status-value="all"] {
    background-color: #ffffff;
    color: #333333;
}

#usersStorageProgressText {
    font-size: 1rem;
    font-weight: 500;
}

.photo-filter-select.is-draft {
    background-color: var(--bs-info-bg-subtle);
}

.photo-total-count {
    font-size: 1.1rem;
    position: relative;
    top: 0.25rem;
}

.search-clear {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: #7b7f86;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 0.25rem;
}

.photo-search-wrap .search-clear {
    right: 0.75rem;
    z-index: 5;
}

.search-clear.is-visible {
    display: inline-flex;
}

.search-input-has-clear {
    padding-right: 2.5rem;
}

.admin-content .form-control:not(.is-valid):not(.is-invalid),
.admin-content .form-select:not(.is-valid):not(.is-invalid),
.admin-auth-body .form-control:not(.is-valid):not(.is-invalid),
.admin-auth-body .form-select:not(.is-valid):not(.is-invalid) {
    border-color: #aaa;
}

#photoSearch {
    border-color: #aaa;
    outline: none;
    box-shadow: none;
}

#keywordSearch,
#keywordSearch:focus,
#keywordSearch:focus-visible {
    outline: none;
    box-shadow: none;
}

#photoSearch.is-suggest-open {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

#photoSearch.is-suggest-open + .btn.btn-mint {
    border-bottom-right-radius: 0;
}

.photo-check:checked {
    background-color: var(--bs-secondary);
    border-color: var(--bs-secondary);
}

.photo-check {
    border-color: var(--bs-secondary);
}

.photo-check {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 0;
    height: 0;
}

.photo-check:focus,
.photo-check:focus-visible {
    border-color: var(--bs-secondary);
    box-shadow: none;
    outline: none;
}

.photo-check-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    z-index: 2;
}

.photo-check-wrap::before {
    content: '';
    position: absolute;
    top: -1rem;
    bottom: -1rem;
    left: -1rem;
    right: -1rem;
    pointer-events: auto;
}

.photo-file-name {
    font-size: 1rem;
    font-weight: 600;
    align-self: center;
}

.photo-preview-img {
    object-fit: contain;
    object-position: center;
    opacity: 0;
    transition: opacity 100ms ease-in-out;
}

.photo-preview-img.is-loaded {
    opacity: 1;
}

.photo-fit-contain .photo-preview-img {
    object-fit: contain;
}

.photo-fit-cover .photo-preview-img {
    object-fit: cover;
}

.photo-meta-indicators {
    font-size: 0.666rem;
    color: var(--bs-secondary);
}

#photoFitContainer {
    font-size: 0.875rem;
}

#photoFitContainer .btn {
    font-size: 0.875rem;
    padding: 0.25rem 0.5rem;
}


#photoFitContainer .form-check-input {
    width: 1em;
    height: 1em;
}

body.is-grid-switching #photoGrid,
body.is-grid-switching #photoListBody {
    opacity: 0;
    transition: none;
}


.remaining-count {
    font-size: 1.125rem;
}



.status-filter--all {
    background-color: #ffffff;
}

.status-filter--draft {
    background-color: var(--bs-secondary-bg-subtle);
}

.status-filter--approved {
    background-color: var(--bs-success-bg-subtle);
}

.status-filter--pending {
    background-color: var(--bs-warning-bg-subtle);
}

.status-filter--rejected {
    background-color: var(--bs-danger-bg-subtle);
}

.photo-fit-contain .photo-list-card .photo-preview-img {
    border: 0;
}

.photo-fit-cover .photo-list-card .photo-preview-img {
    border: 0;
}

@media (min-width: 1200px) {
    .photo-grid-10 .photo-grid-item {
        flex: 0 0 10%;
        max-width: 10%;
    }

    .photo-grid-16 .photo-grid-item {
        flex: 0 0 6.25%;
        max-width: 6.25%;
    }
}

@media (min-width: 2200px) {
    .photo-grid-10 .photo-grid-item {
        flex: 0 0 6.6667%;
        max-width: 6.6667%;
    }

    .photo-grid-16 .photo-grid-item {
        flex: 0 0 4.1667%;
        max-width: 4.1667%;
    }
}

.photo-grid-16 .photo-list-card .photo-preview-img {
    width: 32px !important;
    height: 32px !important;
}

.photo-grid-16 .admin-card-footer-space .photo-file-name {
    display: none !important;
}

#photoGrid.photo-grid-16 .admin-card-footer-space .photo-file-name {
    display: none !important;
}

.photo-grid-16 .admin-card-footer-space .d-flex {
    justify-content: center;
}

.photo-grid-16 .photo-preview-check {
    position: absolute;
    left: 50%;
    bottom: 0.6rem;
    transform: translateX(-50%);
    z-index: 2;
    opacity: 0;
    transition: opacity 150ms ease-in-out;
    pointer-events: none;
}

.photo-grid-16 .admin-card:hover .photo-preview-check {
    opacity: 1;
}

.photo-grid-10 .photo-preview-check {
    display: none;
}

.photo-grid-16 #photoGrid .admin-card-footer-space {
    display: none;
}


.photo-grid-16 .admin-card-border--approved {
    border-color: var(--bs-success-border-subtle, var(--bs-success));
}

.photo-grid-16 .admin-card {
    border-width: 5px;
}

.photo-grid-10 #photoGrid .admin-card,
.photo-grid-16 #photoGrid .admin-card {
    border-radius: 0;
}

.photo-grid-16 .admin-card-border--pending {
    border-color: var(--bs-warning-border-subtle, var(--bs-warning));
}

.photo-grid-16 .admin-card-border--rejected {
    border-color: var(--bs-danger-border-subtle, var(--bs-danger));
}

.photo-grid-16 .admin-card-border--info {
    border-color: var(--bs-info-border-subtle, var(--bs-info));
}

.photo-grid-16 .admin-card-border--meta {
    border-color: var(--bs-secondary-border-subtle, var(--bs-secondary));
}

body.photo-status-highlight-off #photoGrid.photo-grid-16 .admin-card.admin-card-border--approved,
body.photo-status-highlight-off #photoGrid.photo-grid-16 .admin-card.admin-card-border--pending,
body.photo-status-highlight-off #photoGrid.photo-grid-16 .admin-card.admin-card-border--rejected,
body.photo-status-highlight-off #photoGrid.photo-grid-16 .admin-card.admin-card-border--info,
body.photo-status-highlight-off #photoGrid.photo-grid-16 .admin-card.admin-card-border--meta {
    border-color: #ffffff;
}

.suggest-thumb {
    width: 40px;
    height: 40px;
    border-radius: 0.5rem;
    background: var(--color-soft);
    border: 1px solid var(--color-border);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #9aa3ad;
    font-size: 0.8rem;
    flex: 0 0 auto;
}

mark {
    background: rgba(15, 197, 126, 0.2);
    color: inherit;
    padding: 0 0.2rem;
    border-radius: 0.2rem;
}

.btn-outline-rose {
    color: var(--color-rose);
    border-color: var(--color-rose);
    background: transparent;
}

.btn-outline-rose:hover {
    background: var(--color-rose);
    color: #ffffff;
}

.btn-outline-rose:disabled,
.btn-outline-rose.disabled {
    color: var(--color-rose);
    border-color: var(--color-rose);
    background: transparent;
    opacity: 1;
}

.btn-outline-mint {
    color: var(--color-mint);
    border: 1px solid var(--color-mint);
    background: transparent;
}

.btn-outline-mint:hover {
    background: var(--color-mint);
    color: #ffffff;
}

.btn-outline-mint:disabled,
.btn-outline-mint.disabled {
    color: var(--color-mint);
    border-color: var(--color-mint);
    background: transparent;
    opacity: 1;
}

.btn-rose {
    background: var(--color-rose);
    color: #ffffff;
    border: 1px solid transparent;
}

.btn-rose:hover {
    background: #b84b7d;
    color: #ffffff;
}

.btn-rose:active,
.btn-rose:focus,
.btn-rose:focus-visible,
.btn-rose.active,
.btn-rose.show,
.btn-rose:active:focus {
    background: var(--color-rose) !important;
    color: #ffffff !important;
    border-color: var(--color-rose) !important;
    box-shadow: none !important;
}

.btn-mint {
    background: var(--color-mint);
    color: #ffffff;
    border: 1px solid transparent;
}

.btn-mint:hover {
    background: #0aa76b;
    color: #ffffff;
}

.btn-mint:active,
.btn-mint:focus,
.btn-mint:focus-visible,
.btn-mint.active,
.btn-mint.show,
.btn-mint:active:focus {
    background: var(--color-mint) !important;
    color: #ffffff !important;
    border-color: var(--color-mint) !important;
    box-shadow: none !important;
}

.text-rose {
    color: var(--color-rose);
}

.text-mint {
    color: var(--color-mint);
}

.border-soft {
    border: 1px solid var(--color-border);
}

.upload-status .status-icon {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

.upload-status .status-icon i {
    line-height: 1;
}

.times-symbol {
    font-size: 1.1em;
    position: relative;
    top: 2px;
}

.nav-tabs .nav-link {
    border-color: #d9d3d3;
}

.nav-tabs {
    border-bottom-color: #d9d3d3;
}


.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    border-color: #d9d3d3;
    border-bottom-color: transparent !important;
    border-bottom-width: 0 !important;
}

.nav-tabs .nav-link.active:hover,
.nav-tabs .nav-item.show .nav-link:hover {
    border-bottom-color: transparent !important;
    border-bottom-width: 0 !important;
}

.nav-tabs .nav-link:hover {
    border-color: #d9d3d3;
}

.nav-tabs .nav-link:not(.active):hover,
.nav-tabs .nav-link:not(.active):focus-visible {
    background: linear-gradient(to bottom, #e3e3e3 0%, #ffffff 100%);
}

.nav-tabs {
    gap: 0.35rem;
}

.admin-tabs-bar {
    position: relative;
}

.admin-tabs-bar::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    border-bottom: 1px solid #d9d3d3;
}

.admin-tabs-bar .nav-tabs,
.admin-tabs-bar > *:not(.nav-tabs) {
    position: relative;
    z-index: 1;
}

.admin-tabs-bar .nav-tabs {
    border-bottom: 0;
}

.admin-tabs-bar .nav-tabs .nav-link {
    border-bottom-color: transparent;
}

.nav-tabs .nav-link {
    color: #000000;
}

#settingsTabs .nav-link {
    text-transform: uppercase;
    font-weight: 500;
}

#usersTabs .nav-link {
    text-transform: uppercase;
    font-weight: 500;
}

#licensesTabs .nav-link {
    text-transform: uppercase;
    font-weight: 500;
}

#groupsTabs .nav-link {
    text-transform: uppercase;
    font-weight: 500;
}

#statisticsTabs .nav-link {
    font-weight: 500;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    color: #000000;
    font-weight: 600;
    background: linear-gradient(to bottom, #e3e3e3 0%, #ffffff 100%);
    border-bottom-color: transparent !important;
    border-bottom-width: 0 !important;
    border-top: 3px solid var(--color-mint);
    padding-top: calc(var(--bs-nav-link-padding-y) - 2px);
    position: relative;
}

#settingsTabs .nav-link.active,
#settingsTabs .nav-item.show .nav-link {
    font-weight: 700;
}

#usersTabs .nav-link.active,
#usersTabs .nav-item.show .nav-link {
    font-weight: 700;
}

#licensesTabs .nav-link.active,
#licensesTabs .nav-item.show .nav-link {
    font-weight: 700;
}

#groupsTabs .nav-link.active,
#groupsTabs .nav-item.show .nav-link {
    font-weight: 700;
}

#statisticsTabs .nav-link.active,
#statisticsTabs .nav-item.show .nav-link {
    font-weight: 700;
}

.nav-tabs .nav-link.active::after,
.nav-tabs .nav-item.show .nav-link::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: #ffffff;
}

.meta {
    font-size: 1em;
}

.upload-row .meta {
    font-size: 1em;
}

.upload-row .fw-semibold,
.upload-row .meta,
.upload-row .status,
.upload-row .collector {
    color: #333333 !important;
}

.meta-sep {
    display: inline-block;
    margin: 0 0.5em;
}

.upload-row.alert-success {
    background-color: #e8f3ee;
}

.upload-row.alert-warning {
    background-color: #fff9e6;
}

.upload-row.alert-danger {
    background-color: #fbebec;
}

.upload-row.alert-secondary {
    background-color: #f2f2f2;
}


.upload-row {
    position: relative;
    min-height: 96px;
}

.upload-row-actions {
    position: absolute;
    top: 10px;
    right: 12px;
    display: flex;
    align-items: center;
}

.upload-row-status-corner {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.05rem;
    display: flex;
    align-items: center;
}

.upload-collector-arrow {
    padding: 0 0.5em;
    display: inline-block;
}

.join-or-check {
    width: 1.3em;
    height: 1.3em;
    margin-top: 0.35rem;
    border-color: var(--bs-secondary);
}

.join-or-check:checked {
    background-color: var(--bs-secondary);
    border-color: var(--bs-secondary);
}

.join-or-check:focus {
    border-color: var(--bs-secondary);
    box-shadow: 0 0 0 0.25rem rgba(var(--bs-secondary-rgb), 0.25);
}

.join-or-label {
    display: inline-block;
    line-height: 1.2;
    margin-top: 0.35rem;
    margin-left: 0.35rem;
}


.upload-header,
.upload-timing,
.upload-actions {
    position: relative;
}

.upload-queue-info {
    font-weight: 600;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
}

#uploadSummary,
.upload-timing .upload-speed,
#uploadStatusBadge {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

#dropzone.is-locked {
    opacity: 0.6;
    cursor: not-allowed;
}

.upload-status-badge {
    font-weight: 600;
    color: #000000;
    font-size: 1em;
    padding: 0.4rem 0.7rem;
    line-height: 1.2;
}

.dimension-divider {
    font-size: 1.4em;
    line-height: 1;
    display: inline-block;
    vertical-align: middle;
    margin: 0;
}

.upload-conditions > div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 0.5rem;
    align-items: center;
}

.upload-condition-label {
    white-space: nowrap;
    text-align: right;
}

.upload-condition-value {
    text-align: left;
}

.upload-history-thumb {
    width: 64px;
    height: 64px;
    background: #eeeeee;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.upload-history-thumb.is-placeholder img {
    display: none;
}

.upload-status-badge.is-blinking {
    animation: upload-badge-blink 1.1s ease-in-out infinite;
}

@keyframes upload-badge-blink {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0.35;
    }
}

.table-sortable thead th.sortable {
    cursor: pointer;
    user-select: none;
}

.table-sortable thead th.sortable:hover {
    color: #151515;
}

.admin-table-hover thead th[aria-sort="ascending"] {
    text-decoration: underline;
    text-decoration-style: dashed;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.2em;
}

.admin-table-hover thead th[aria-sort="descending"] {
    text-decoration: overline;
    text-decoration-style: dashed;
    text-decoration-thickness: 1px;
}

.admin-table-hover tbody tr:hover > td,
.admin-table-hover tbody tr:hover > th {
    background: #f6f1f2;
}

.drag-handle {
    cursor: grab;
}

tr.license-row-draggable,
tr.license-row-draggable > td,
tr.license-row-draggable > th {
    cursor: default;
}

tr.dragging {
    background: rgba(255, 206, 86, 0.1);
}

tr.dragging > td,
tr.dragging > th {
    background: rgba(255, 206, 86, 0.1);
}

.invalid-feedback {
    display: none !important;
}

.auth-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1.5rem;
}

.auth-card {
    border: 1px solid var(--color-border);
    border-radius: 0.5rem;
    background: var(--color-surface);
    box-shadow: 0 20px 50px rgba(113, 101, 101, 0.12);
    overflow: hidden;
}

.auth-card-body {
    padding-bottom: 2.25rem;
}

.auth-card-header {
    background: #333333;
    padding: 1.25rem 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.auth-card-header .auth-logo {
    background: transparent;
    padding: 0;
    width: auto;
    height: auto;
    max-width: none;
    max-height: none;
}

.auth-logo {
    height: 64px;
    width: auto;
    padding: 0.5rem;
    border-radius: 0.6rem;
    background: var(--color-ink);
    object-fit: contain;
}

.lightbox-backdrop.show {
    opacity: 0.8;
}

#adminLightboxModal .lightbox-control {
    opacity: 1;
    z-index: 1056;
    background-color: rgba(0, 0, 0, 0.35) !important;
    border-radius: 999px;
    top: 16px;
    padding: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

#adminLightboxModal .lightbox-close {
    right: 24px;
}

#adminLightboxModal .lightbox-toggle {
    left: 24px;
}

#adminLightboxModal .modal-content {
    background: transparent;
    border: 0;
    box-shadow: none;
    pointer-events: auto;
    width: auto;
    display: inline-flex;
    align-items: center;
}

#adminLightboxModal .modal-dialog {
    max-width: 100%;
    width: auto;
    margin: 0;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    pointer-events: none;
}

#adminLightboxModal.is-print .modal-dialog {
    padding: 0;
    align-items: flex-start;
    justify-content: flex-start;
    height: 100vh;
}

#adminLightboxModal.is-print .modal-body {
    align-items: flex-start;
    justify-content: flex-start;
    overflow: auto;
    width: 100vw;
    height: 100vh;
    max-width: 100vw;
    max-height: 100vh;
    padding: 0;
    display: block;
}

#adminLightboxModal.is-print:not(.is-zoomed) .modal-body {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

#adminLightboxModal.is-print:not(.is-zoomed) .lightbox-image {
    align-self: center;
    max-height: 100%;
}

#adminLightboxModal.is-print .modal-content {
    width: 100%;
    align-items: flex-start;
    justify-content: flex-start;
    height: 100%;
}

#adminLightboxModal.is-print:not(.is-zoomed) .modal-dialog {
    align-items: center;
    justify-content: center;
}

#adminLightboxModal.is-print .lightbox-image {
    margin: 0;
    display: block;
    align-self: flex-start;
}

#adminLightboxModal .modal-body {
    width: auto;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

#adminLightboxModal.is-zoomed .modal-body {
    align-items: flex-start;
    overflow: auto;
}

#adminLightboxModal .modal-body.is-drag-enabled {
    cursor: grab;
}

#adminLightboxModal .modal-body.is-dragging {
    cursor: grabbing;
}

#adminLightboxModal .lightbox-image {
    max-width: 100%;
    max-height: 90vh;
    width: auto;
    height: auto;
    object-fit: contain;
}

#adminLightboxModal .lightbox-image.is-placeholder {
    background: #e3e3e3;
}

#adminLightboxModal .lightbox-image.is-zoomable {
    cursor: zoom-in;
}

#adminLightboxModal .lightbox-image.is-zoomed {
    cursor: zoom-out;
    max-width: none;
    max-height: none;
}

@media (max-width: 991px) {
    .admin-sidebar {
        width: 100%;
        position: static;
        height: auto;
    }

    .admin-shell {
        padding-left: 0;
    }

    .admin-header {
        position: static;
        left: 0;
    }

    .admin-content {
        padding-top: 0;
    }
}
#photoListBody tr[data-edit-url] {
    cursor: pointer;
}
.photo-detail-nav #photoDetailCounter {
    border-left-color: #6c757d;
    font-weight: 500;
}

.photo-detail-dimensions {
    font-size: 0.95rem;
    font-weight: 400;
    line-height: 0.95;
}

.photo-detail-dimensions-times {
    font-size: 1.5rem;
    line-height: 1;
    display: inline-block;
    vertical-align: middle;
}

.photo-keywords-group .keywords-pillbox {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: center;
    min-height: 2.4rem;
    padding: 0.35rem 0.5rem;
    background-color: #fff;
}

.photo-keywords-group .keywords-input {
    border: 0;
    outline: none;
    padding: 0;
    margin: 0;
    min-width: 6rem;
    flex: 1 1 6rem;
    font-size: 1rem;
    font-weight: 500;
    background: transparent;
}

.photo-keywords-group .keywords-input:disabled {
    background: transparent;
}

.photo-keywords-group .keyword-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.1rem 0.45rem 0;
    border-radius: 0.375rem;
    background: #dee2e6;
    border: 1px solid #dee2e6;
    font-size: 0.9rem;
    font-weight: 500;
    color: #212529;
}

.photo-keywords-group .keyword-pill-remove {
    border: 0;
    background: transparent;
    color: #aaa;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}

.photo-keywords-group .keyword-pill-label {
    position: relative;
    top: 0.05rem;
}

.photo-keywords-group .keyword-pill-remove:disabled {
    opacity: 0.6;
}

.photo-edit-actions {
    margin-top: 2rem;
}

.photo-auto-next,
.photo-auto-review {
    align-items: center;
}

.photo-auto-next .form-check-input,
.photo-auto-review .form-check-input {
    margin-top: 0;
}

.photo-auto-next .form-check-label,
.photo-auto-review .form-check-label {
    line-height: 1.2;
    margin-bottom: 0;
    display: inline-flex;
    align-items: center;
    transform: translateY(-3px);
}

.photo-edit-label.is-invalid {
    color: var(--bs-danger);
    border-color: var(--bs-danger);
}

#photoForm input.form-control,
#photoForm textarea.form-control,
#photoForm input.form-control.is-valid,
#photoForm input.form-control.is-invalid,
#photoForm textarea.form-control.is-valid,
#photoForm textarea.form-control.is-invalid {
    font-weight: 500;
}

.keyword-mosaic-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: flex-start;
    justify-content: center;
}

.keyword-mosaic-card {
    flex: 0 1 auto;
    max-width: 100%;
    border-radius: 0.5rem;
    padding: 0;
    background: #fff;
    box-shadow: 0 14px 32px rgba(36, 30, 24, 0.08);
}

.keyword-mosaic-card-body {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.135rem 0.15rem 0 0.4rem;
}

.keyword-mosaic-card-content {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
}

.keyword-mosaic-name-wrap {
    min-width: 0;
}

.keyword-mosaic-name {
    font-weight: 600;
    color: var(--bs-body-color);
    overflow-wrap: anywhere;
}

.keyword-mosaic-count {
    color: var(--bs-body-color);
    white-space: nowrap;
    font-size: inherit;
}

.keyword-mosaic-count-bracket {
    font-weight: 400;
}

.keyword-mosaic-count-value {
    font-weight: 500;
}

.keyword-mosaic-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.1rem;
    margin-left: auto;
}

.keyword-mosaic-actions .btn {
    padding: 0.05rem 0.125rem;
    color: var(--bs-secondary-color);
    text-decoration: none;
}

.keyword-mosaic-actions .btn:hover,
.keyword-mosaic-actions .btn:focus-visible {
    color: var(--color-rose);
}

.keyword-mosaic-actions .keyword-mosaic-edit:hover,
.keyword-mosaic-actions .keyword-mosaic-edit:focus-visible {
    color: var(--bs-secondary-color);
}

.keyword-mosaic-actions .keyword-mosaic-delete {
    color: var(--color-rose);
}

.keyword-mosaic-actions .keyword-mosaic-delete:hover,
.keyword-mosaic-actions .keyword-mosaic-delete:focus-visible {
    color: var(--color-rose) !important;
}

.keyword-mosaic-input {
    min-width: 0;
    width: auto;
    max-width: min(28rem, 60vw);
    font-size: 0.95em;
    font-weight: 500;
    line-height: 0.95;
    position: relative;
    top: -1px;
    padding-top: 0;
    padding-right: 0.25rem;
    padding-bottom: 0;
    padding-left: 0.25rem;
}

.keyword-mosaic-card.is-editing {
    box-shadow: 0 18px 36px rgba(36, 30, 24, 0.1);
}

.keyword-mosaic-card.is-editing .keyword-mosaic-count {
    display: none;
}

@media (max-width: 767.98px) {
    .keyword-mosaic-card {
        width: 100%;
    }

    .keyword-mosaic-card-body {
        flex-wrap: wrap;
    }

    .keyword-mosaic-actions {
        width: 100%;
        justify-content: flex-end;
        margin-left: 0;
    }

    .keyword-mosaic-input {
        min-width: 0;
        width: 100%;
        max-width: 100%;
    }
}

.photo-status-alert {
    display: inline-flex;
    align-items: center;
    min-height: 2.4rem;
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
}

.admin-detail-preview-fallback {
    width: 100%;
    aspect-ratio: 3 / 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #6c757d;
    background: #fff;
    border: 1px dashed #cfd4d9;
    border-radius: 0;
    font-weight: 400;
}

.admin-detail-preview-fallback span {
    font-style: italic;
}

.admin-detail-preview-fallback i {
    font-size: 2rem;
}

.photo-detail-nav #photoDetailPrev.disabled + #photoDetailCounter,
.photo-detail-nav #photoDetailPrev[aria-disabled="true"] + #photoDetailCounter {
    border-left-color: #adb5bd;
}

.photo-detail-nav #photoDetailCounter + #photoDetailNext.disabled,
.photo-detail-nav #photoDetailCounter + #photoDetailNext[aria-disabled="true"] {
    border-left-color: #adb5bd;
}

.photo-preview-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: #6c757d;
    border: 1px dashed #cfd4d9;
    text-decoration: none;
}

.admin-card-preview .photo-preview-fallback {
    text-decoration: none !important;
    color: #6c757d !important;
}

.admin-card-preview {
    text-decoration: none;
}

.photo-preview-fallback i {
    font-size: 2rem;
}



#photoForm .input-group-text {
    background-color: #eee !important;
}
#photoSelectActionsDropdown .photo-dropdown-item {
    font-size: 1rem;
}
.table-ajax-sort th[data-sort-field],
.admin-groups-table th[data-sort-field] {
    cursor: pointer;
}

.table-ajax-sort.is-loading tbody,
.admin-groups-table.is-loading tbody {
    visibility: hidden;
}
.users-name-cell {
    font-weight: 500;
}

.users-name-link {
    color: inherit;
    text-decoration: none;
}

.users-name-link:hover,
.users-name-link:focus {
    text-decoration: none;
}

.review-progress-name {
    max-width: 260px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.admin-users-table th,
.admin-users-table td {
    padding-left: 1rem;
    padding-right: 1rem;
}
