/* Gallery editor and lightbox (projects, products). */
.gallery-toolbar { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin-bottom: .75rem; }
.gallery-counts { display: flex; gap: 1rem; color: var(--a-muted); font-size: .82rem; }
.gallery-counts span { display: inline-flex; gap: .3rem; align-items: center; }
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: .9rem; }
.gallery-card { background: var(--a-surface); border: 1px solid var(--a-border); border-radius: .8rem; overflow: hidden; cursor: grab; transition: transform .15s, box-shadow .15s, border-color .15s; }
.gallery-card:hover { box-shadow: var(--a-shadow-lg); }
.gallery-card.dragging { opacity: .45; }
.gallery-card.drag-over { border-color: var(--a-primary); transform: scale(1.02); box-shadow: 0 0 0 3px var(--a-primary-soft); }
.gallery-thumb { position: relative; aspect-ratio: 4 / 3; background: var(--a-surface-2); cursor: zoom-in; }
.gallery-thumb img, .gallery-thumb video { width: 100%; height: 100%; object-fit: cover; display: block; }
.gallery-thumb .order-badge { position: absolute; top: .45rem; right: .45rem; min-width: 24px; height: 24px; border-radius: 12px; background: rgba(15, 23, 42, .7); color: #fff; font-size: .75rem; font-weight: 700; display: flex; align-items: center; justify-content: center; padding: 0 .4rem; }
.gallery-thumb .cover-badge { position: absolute; top: .45rem; left: .45rem; background: #fab005; color: #1e1e1e; font-size: .7rem; font-weight: 700; border-radius: 1rem; padding: .15rem .55rem; display: inline-flex; gap: .2rem; align-items: center; }
.gallery-thumb .kind-badge { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.gallery-thumb .kind-badge i { width: 44px; height: 44px; border-radius: 50%; background: rgba(15, 23, 42, .65); color: #fff; font-size: 1.6rem; display: flex; align-items: center; justify-content: center; }
.gallery-caption { border: 0; border-top: 1px solid var(--a-border); border-radius: 0; font-size: .8rem; }
.gallery-tools { display: flex; gap: .25rem; padding: .35rem; border-top: 1px solid var(--a-border); }
.gallery-tools .btn { padding: .15rem .45rem; }

.lightbox { position: fixed; inset: 0; z-index: 2050; background: rgba(8, 12, 24, .92); display: flex; align-items: center; justify-content: center; gap: 1rem; padding: 2rem; }
.lightbox-body { max-width: min(1100px, 90vw); max-height: 85vh; display: flex; flex-direction: column; align-items: center; gap: .75rem; }
.lightbox-body img, .lightbox-body video { max-width: 100%; max-height: 78vh; border-radius: .6rem; object-fit: contain; }
.lightbox-caption { color: #dfe4f0; font-size: .85rem; }
.lightbox-close { position: absolute; top: 1rem; left: 1rem; }
.lightbox-close, .lightbox-nav { width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .12); color: #fff; font-size: 1.6rem; display: flex; align-items: center; justify-content: center; }
.lightbox-nav:disabled { opacity: .25; }
.lightbox-close:hover, .lightbox-nav:hover:not(:disabled) { background: rgba(255, 255, 255, .25); }

/* Project facts */
.facts-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }
.fact-field .input-group-text { min-width: 42px; justify-content: center; }
.status-toggle { display: flex; gap: .5rem; }
.status-toggle label { flex: 1; display: flex; align-items: center; justify-content: center; gap: .4rem; padding: .55rem; border: 1px solid var(--a-border); border-radius: .6rem; cursor: pointer; font-size: .85rem; margin: 0; }
.status-toggle input { display: none; }
.status-toggle label.active { border-color: var(--a-primary); background: var(--a-primary-soft); color: var(--a-primary); font-weight: 600; }
.duration-hint { font-size: .78rem; color: var(--a-muted); margin-top: .35rem; }

/* Product specifications */
.specs-toolbar { display: flex; align-items: center; gap: .5rem; margin-bottom: .6rem; }
.specs-import { border: 1px dashed var(--a-border); border-radius: .7rem; padding: .7rem; margin-bottom: .75rem; background: var(--a-surface-2); }
.specs-rows { display: flex; flex-direction: column; gap: .35rem; }
.spec-row { display: flex; align-items: center; gap: .4rem; padding: .3rem .4rem; border: 1px solid var(--a-border); border-radius: .6rem; background: var(--a-surface); transition: box-shadow .15s; }
.spec-row:hover { box-shadow: var(--a-shadow); }
.spec-row.dragging { opacity: .4; }
.spec-row.drag-over { box-shadow: 0 -3px 0 var(--a-primary); }
.spec-grip { color: var(--a-muted); cursor: grab; font-size: 1.1rem; }
.spec-name { flex: 0 0 34%; font-weight: 600; }
.spec-value { flex: 1; }
.spec-tools { display: flex; gap: 2px; }
.spec-tools .btn { padding: .1rem .4rem; }
.specs-chips { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; margin-top: .6rem; }
.chip-btn { border: 1px solid var(--a-border); background: var(--a-surface); color: var(--a-text); border-radius: 1rem; padding: .15rem .65rem; font-size: .76rem; transition: border-color .15s, color .15s; }
.chip-btn:hover:not(:disabled), .chip-btn.active { border-color: var(--a-primary); color: var(--a-primary); background: var(--a-primary-soft); }
@media (max-width: 575px) { .spec-row { flex-wrap: wrap; } .spec-name, .spec-value { flex: 1 1 100%; } }

/* Publishing readiness checklist */
.readiness { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .35rem; font-size: .84rem; color: var(--a-muted); }
.readiness li { display: flex; align-items: center; gap: .4rem; }
.readiness li i { font-size: 1.05rem; }
.readiness li.done { color: var(--a-text); }
.readiness li.done i { color: #12b76a; }

/* Video editor */
.source-picker { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .6rem; }
.source-option { display: flex; flex-direction: column; align-items: center; gap: .3rem; padding: 1rem .6rem; border: 2px solid var(--a-border); border-radius: .9rem; background: var(--a-surface); color: var(--a-text); transition: border-color .15s, box-shadow .15s, transform .15s; }
.source-option:hover { transform: translateY(-1px); border-color: var(--a-primary); }
.source-option.active { border-color: var(--a-primary); box-shadow: 0 0 0 4px var(--a-primary-soft); }
.source-option small { color: var(--a-muted); font-size: .72rem; }
.source-icon { width: 46px; height: 46px; border-radius: .8rem; display: inline-flex; align-items: center; justify-content: center; font-size: 1.6rem; color: #fff; background: #64748b; }
.source-upload { background: linear-gradient(135deg, #4f6ef7, #6d8bff); }
.source-youtube { background: #ff0000; }
.source-aparat { background: #ea1d5d; }
.source-externallink { background: #475569; }
.video-player { position: relative; aspect-ratio: 16 / 9; border-radius: .9rem; overflow: hidden; background: #0b1220; }
.video-player video, .video-player iframe { width: 100%; height: 100%; border: 0; display: block; }
.video-file-bar { display: flex; align-items: center; gap: .5rem; padding: .55rem .7rem; margin-top: .6rem; border: 1px solid var(--a-border); border-radius: .7rem; font-size: .85rem; flex-wrap: wrap; }
.embed-help { font-size: .82rem; }
.embed-help summary { cursor: pointer; color: var(--a-primary); }
.embed-help ul { margin: .5rem 0; padding-inline-start: 1.2rem; font-family: ui-monospace, Consolas, monospace; font-size: .74rem; color: var(--a-muted); }
.provider-info { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-top: .75rem; }
.info-result { display: flex; gap: .8rem; width: 100%; padding: .7rem; border: 1px solid var(--a-border); border-radius: .8rem; background: var(--a-surface-2); }
.info-result img { width: 160px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: .5rem; }
.info-result strong { display: block; font-size: .9rem; }
.info-result small { color: var(--a-muted); }
.video-cover-preview { position: relative; aspect-ratio: 16 / 9; border-radius: .9rem; overflow: hidden; background: var(--a-surface-2); border: 1px dashed var(--a-border); display: flex; align-items: center; justify-content: center; }
.video-cover-preview img { width: 100%; height: 100%; object-fit: cover; }
.video-cover-preview > span:not(.play-badge):not(.cover-badge) { display: flex; flex-direction: column; align-items: center; gap: .3rem; color: var(--a-muted); font-size: .85rem; }
.video-cover-preview > span i { font-size: 2rem; }
.video-cover-preview .cover-remove { position: absolute; top: .5rem; left: .5rem; }
.video-cover-preview .cover-badge { position: absolute; bottom: .5rem; right: .5rem; background: rgba(15, 23, 42, .75); color: #fff; font-size: .72rem; border-radius: 1rem; padding: .15rem .6rem; }
.play-badge { position: absolute; width: 52px; height: 52px; border-radius: 50%; background: rgba(15, 23, 42, .6); color: #fff; font-size: 1.8rem; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.cover-actions-list { display: flex; flex-direction: column; gap: .5rem; }
.frame-strip { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: .5rem; margin-top: 1rem; }
.frame { position: relative; border: 2px solid transparent; border-radius: .6rem; overflow: hidden; padding: 0; background: #000; transition: border-color .15s, transform .15s; }
.frame:hover { border-color: var(--a-primary); transform: scale(1.03); }
.frame img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.frame span { position: absolute; bottom: 4px; left: 4px; background: rgba(0, 0, 0, .7); color: #fff; font-size: .7rem; padding: 0 .35rem; border-radius: .3rem; direction: ltr; }

/* Video list */
.video-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.video-card { background: var(--a-surface); border: 1px solid var(--a-border); border-radius: 1rem; overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .15s, transform .15s; }
.video-card:hover { box-shadow: var(--a-shadow-lg); transform: translateY(-2px); }
.video-card.is-draft .video-thumb img { filter: grayscale(.6); opacity: .8; }
.video-thumb { position: relative; aspect-ratio: 16 / 9; background: #0b1220; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.video-thumb img { width: 100%; height: 100%; object-fit: cover; }
.video-thumb .no-thumb { color: #64748b; font-size: 2.5rem; }
.video-thumb .play-badge { opacity: 0; transition: opacity .15s; }
.video-card:hover .video-thumb .play-badge { opacity: 1; }
.source-badge { position: absolute; top: .5rem; right: .5rem; color: #fff; font-size: .7rem; border-radius: 1rem; padding: .15rem .55rem; display: inline-flex; gap: .25rem; align-items: center; }
.duration-badge { position: absolute; bottom: .5rem; left: .5rem; background: rgba(0, 0, 0, .75); color: #fff; font-size: .72rem; padding: .05rem .4rem; border-radius: .3rem; direction: ltr; }
.video-card-body { padding: .75rem .85rem; display: flex; flex-direction: column; gap: .45rem; flex: 1; }
.video-card-title { font-weight: 600; color: var(--a-text); text-decoration: none; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.video-card-meta { display: flex; flex-wrap: wrap; gap: .7rem; font-size: .74rem; color: var(--a-muted); }
.video-card-actions { display: flex; align-items: center; gap: .5rem; margin-top: auto; padding-top: .4rem; border-top: 1px solid var(--a-border); }
