/* В ракурсе — поверх Bootstrap 5.3. Тёмная/светлая тема — data-bs-theme на <html> (static/js/theme.js) */
:root, [data-bs-theme="dark"] {
  --vk-accent: #e8b04a;
  --vk-accent-ink: #1b1406;
}
[data-bs-theme="dark"] { --bs-body-bg: #0f1012; --bs-tertiary-bg: #17181b; --bs-border-color: #2a2c31;
  /* ссылки — в цвет сайта, а не синие */
  --bs-link-color: #f0c063; --bs-link-color-rgb: 240, 192, 99;
  --bs-link-hover-color: #ffd98c; --bs-link-hover-color-rgb: 255, 217, 140; }
[data-bs-theme="light"] { --vk-accent: #c58a17; --vk-accent-ink: #fff;
  --bs-link-color: #9a6a0c; --bs-link-color-rgb: 154, 106, 12;
  --bs-link-hover-color: #6f4c07; --bs-link-hover-color-rgb: 111, 76, 7; }

body { min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1; }
a { text-decoration: none; text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { text-decoration: underline; }
a.btn:hover, a.list-group-item:hover, a.nav-link:hover, a.dropdown-item:hover, a.navbar-brand:hover,
a.stretched-link:hover, .media-card a:hover { text-decoration: none; }

.brand { font-weight: 800; letter-spacing: .04em; }
.brand b { color: var(--vk-accent); }
.btn-accent { --bs-btn-bg: var(--vk-accent); --bs-btn-border-color: var(--vk-accent); --bs-btn-color: var(--vk-accent-ink);
  --bs-btn-hover-bg: #f0c063; --bs-btn-hover-border-color: #f0c063; --bs-btn-hover-color: var(--vk-accent-ink);
  --bs-btn-active-bg: #d79e33; --bs-btn-active-color: var(--vk-accent-ink); font-weight: 600; }
.text-accent { color: var(--vk-accent) !important; }
.theme-navbar { background: color-mix(in srgb, var(--bs-body-bg) 92%, transparent); backdrop-filter: blur(8px); }
.nav-badge { font-size: .7rem; vertical-align: top; }

/* карточки галереи */
.media-card { overflow: hidden; transition: border-color .15s, transform .15s; }
.media-card:hover { border-color: var(--vk-accent); }
.media-card .thumb { position: relative; aspect-ratio: 16 / 10; background: #000; }
.media-card .thumb { overflow: hidden; }
.media-card .thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.media-card .kind { position: absolute; left: .5rem; top: .5rem; }
.media-card .stretched-link::after { z-index: 1; }

/* авторы */
.avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; background: var(--bs-tertiary-bg);
  display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 1.4rem; flex-shrink: 0; }
.avatar-lg { width: 112px; height: 112px; font-size: 2.4rem; }
.contact-btn { --bs-btn-padding-y: .25rem; --bs-btn-padding-x: .6rem; --bs-btn-font-size: .85rem; }
.contact-btn.vk { --bs-btn-color: #fff; --bs-btn-bg: #0077ff; --bs-btn-border-color: #0077ff; --bs-btn-hover-bg: #1a85ff; --bs-btn-hover-color: #fff; }
.contact-btn.tg { --bs-btn-color: #fff; --bs-btn-bg: #229ed9; --bs-btn-border-color: #229ed9; --bs-btn-hover-bg: #35aee6; --bs-btn-hover-color: #fff; }
.author-card .works img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: .375rem; }

/* календарь */
.month-title { color: var(--vk-accent); text-transform: uppercase; letter-spacing: .06em; font-size: .9rem; margin: 1.75rem 0 .6rem; }
.ev-row { display: grid; grid-template-columns: 70px 60px minmax(0, 1fr) auto; gap: 1rem; align-items: center; }
.ev-row .day { text-align: center; line-height: 1.1; }
.ev-row .day b { display: block; font-size: 1.6rem; }
.ev-logo { width: 60px; height: 60px; border-radius: .5rem; background: var(--bs-tertiary-bg) center / contain no-repeat;
  border: 1px solid var(--bs-border-color); }
.ev-logo-lg { width: 120px; height: 120px; }
.ev-now { border-color: var(--vk-accent) !important; }
@media (max-width: 767px) { .ev-row { grid-template-columns: 56px minmax(0, 1fr); } .ev-row .ev-logo { display: none; } .ev-row .cnt { grid-column: 2; } }

/* загрузка */
.drop { border: 2px dashed var(--bs-border-color); border-radius: .5rem; padding: 2rem; text-align: center; transition: .15s; }
.drop.over { border-color: var(--vk-accent); background: color-mix(in srgb, var(--vk-accent) 8%, transparent); }
.qrow { display: grid; grid-template-columns: minmax(0, 1fr) 90px 120px; gap: .6rem; align-items: center;
  padding: .35rem 0; border-bottom: 1px solid var(--bs-border-color); font-size: .9rem; }
.qrow .n { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bar { height: 6px; background: var(--bs-secondary-bg); border-radius: 3px; overflow: hidden; display: block; }
.bar i { display: block; height: 100%; width: 0; background: var(--vk-accent); transition: width .2s; }
.qrow.done .bar i { background: var(--bs-success); } .qrow.err .bar i { background: var(--bs-danger); }
.total { display: flex; gap: .75rem; align-items: center; margin: .75rem 0; } .total .bar { flex: 1; height: 10px; }
.corner-pick .form-check { border: 1px solid var(--bs-border-color); border-radius: .375rem; padding: .4rem .5rem .4rem 2rem; margin: 0; }
.role-pick .form-check { border: 1px solid var(--bs-border-color); border-radius: .5rem; padding: .7rem .7rem .7rem 2.2rem; margin-bottom: .5rem; }
.role-pick .form-check:has(input:checked), .corner-pick .form-check:has(input:checked) { border-color: var(--vk-accent); }
.copy { font-family: var(--bs-font-monospace); font-size: .8rem; word-break: break-all; }
.status-ready { color: var(--bs-success); } .status-failed { color: var(--bs-danger); }
.status-pending, .status-processing { color: var(--vk-accent); }
@media (max-width: 767px) { .qrow { grid-template-columns: 1fr 70px; } .qrow .st { grid-column: 1 / -1; } }

/* подсказки городов */
.city-menu { max-height: 320px; overflow-y: auto; }
.city-menu .dropdown-item small { max-width: 60%; }

/* ---------- плеер ---------- */
.vk-player { --ratio: 16 / 9; position: relative; aspect-ratio: var(--ratio); max-height: 72vh; max-width: 100%;
  margin: 0 auto; background: #000; border-radius: 14px; overflow: hidden; outline: none;
  box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.vk-player video { width: 100%; height: 100%; object-fit: contain; display: block; background: #000; }
.vk-player:fullscreen { max-height: none; border-radius: 0; }
.vk-big { position: absolute; inset: 0; margin: auto; width: 76px; height: 76px; border-radius: 50%; border: 0;
  background: rgba(255,255,255,.92); color: #111; display: grid; place-items: center; cursor: pointer;
  box-shadow: 0 6px 24px rgba(0,0,0,.4); transition: transform .15s, opacity .2s; }
.vk-big:hover { transform: scale(1.06); }
.vk-big svg { width: 34px; height: 34px; fill: currentColor; margin-left: 4px; }
.vk-player.vk-playing .vk-big, .vk-player.vk-ended .vk-big { opacity: 0; pointer-events: none; }
.vk-bar { position: absolute; left: 10px; right: 10px; bottom: 10px; display: flex; align-items: center; gap: 8px;
  padding: 6px 10px; border-radius: 12px; background: rgba(15,16,18,.62); backdrop-filter: blur(10px);
  color: #fff; font-size: .8rem; font-variant-numeric: tabular-nums; transition: opacity .25s, transform .25s; }
.vk-player.vk-playing:not(.vk-active) .vk-bar { opacity: 0; transform: translateY(8px); pointer-events: none; }
.vk-player.vk-playing:not(.vk-active) { cursor: none; }
.vk-btn { background: none; border: 0; padding: 2px; color: #fff; display: grid; place-items: center; cursor: pointer; opacity: .9; }
.vk-btn:hover { opacity: 1; }
.vk-btn svg { width: 22px; height: 22px; fill: currentColor; }
.vk-track { position: relative; flex: 1; height: 4px; border-radius: 2px; background: rgba(255,255,255,.25); }
.vk-track:hover { height: 6px; }
.vk-buf, .vk-fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: inherit; width: 0; }
.vk-buf { background: rgba(255,255,255,.35); }
.vk-fill { background: var(--vk-accent); }
.vk-track input { position: absolute; inset: -8px 0; width: 100%; opacity: 0; cursor: pointer; margin: 0; }
.vk-badge { position: absolute; left: 12px; top: 12px; padding: 3px 10px; border-radius: 20px; font-size: .75rem;
  font-weight: 600; background: rgba(15,16,18,.62); color: #fff; backdrop-filter: blur(8px); pointer-events: none; }
.vk-badge.free { background: rgba(25,135,84,.85); }
.vk-end { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .75rem; text-align: center; padding: 1rem; background: rgba(0,0,0,.72); color: #fff; }
.vk-end[hidden] { display: none; }
.vk-photo { display: block; max-height: 72vh; max-width: 100%; margin: 0 auto; border-radius: 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.35); }
@media (max-width: 575px) { .vk-player, .vk-photo { border-radius: 10px; } .vk-big { width: 60px; height: 60px; } .vk-dur { display: none; } }

/* Профиль: предпросмотр логотипа на тёмном и светлом кадре */
.logo-preview { width: 160px; height: 90px; border-radius: .5rem; display: flex; align-items: center;
  justify-content: center; padding: 10px; border: 1px solid var(--bs-border-color); }
.logo-preview img { max-width: 100%; max-height: 100%; object-fit: contain; }
.logo-preview-dark { background: linear-gradient(135deg, #1d2430, #3a4352); }
.logo-preview-light { background: linear-gradient(135deg, #f4f1ea, #d9dde3); }
.logo-preview .logo-empty { font-size: .8rem; opacity: .6; }
.logo-preview-dark .logo-empty { color: #fff; }
.logo-preview-light .logo-empty { color: #222; }

/* Значок в шапке: на светлой теме — лёгкая тень, чтобы тёмный квадрат не сливался */
.brand-mark { border-radius: 7px; display: block; }
[data-bs-theme="light"] .brand-mark { box-shadow: 0 1px 3px rgba(0,0,0,.25); }

/* Дни недели в расписании вечеринок — кнопками */
.weekday-pick input { display: none; }
.weekday-pick label:has(input:checked) { background: var(--vk-accent); border-color: var(--vk-accent); color: var(--vk-accent-ink); }
.badge-series { background: color-mix(in srgb, var(--vk-accent) 18%, transparent); color: var(--vk-accent); font-weight: 600; }

/* Чат покупателя и автора */
.avatar-sm { width: 40px !important; height: 40px !important; font-size: 1rem !important; flex: 0 0 auto; }
.min-w-0 { min-width: 0; }
.chat-box { display: flex; flex-direction: column; height: min(70vh, 640px); overflow: hidden; }
.chat-scroll { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; }
#chat-msgs { margin-top: auto; display: flex; flex-direction: column; gap: .5rem; }
.chat-msg { display: flex; }
.chat-msg.mine { justify-content: flex-end; }
.chat-msg .bubble { max-width: 80%; padding: .5rem .75rem; border-radius: 1rem 1rem 1rem .25rem;
  background: var(--bs-secondary-bg); word-wrap: break-word; }
.chat-msg.mine .bubble { background: color-mix(in srgb, var(--vk-accent) 22%, var(--bs-body-bg));
  border-radius: 1rem 1rem .25rem 1rem; }
.chat-msg time, .chat-sys time { display: block; font-size: .7rem; opacity: .6; margin-top: .15rem; text-align: right; }
.chat-sys { text-align: center; font-size: .82rem; color: var(--bs-secondary-color); margin: .25rem 0; }
.chat-sys span { background: var(--bs-tertiary-bg); padding: .3rem .7rem; border-radius: 1rem; display: inline-block; }
.chat-item { display: flex; gap: .5rem; align-items: center; text-decoration: none; color: inherit;
  margin-bottom: .35rem; padding-bottom: .35rem; border-bottom: 1px solid var(--bs-border-color); }
.chat-item img { width: 56px; height: 40px; object-fit: cover; border-radius: .35rem; }
.chat-form { border-top: 1px solid var(--bs-border-color); padding: .6rem; background: var(--bs-body-bg); }
.chat-form textarea { resize: none; }
.chat-attach { margin-bottom: .35rem; }
@media (max-width: 576px) { .chat-box { height: calc(100vh - 210px); } .chat-msg .bubble { max-width: 88%; } }

/* Поделиться */
.share .btn { font-weight: 500; }
.share-tg { background: #229ed9; color: #fff; } .share-tg:hover { background: #1b8bc0; color: #fff; }
.share-vk { background: #0077ff; color: #fff; } .share-vk:hover { background: #0066dd; color: #fff; }
.share-wa { background: #25d366; color: #0b2b16; } .share-wa:hover { background: #1fb957; color: #0b2b16; }
/* Подписка на мероприятие */
.subscribe-box { border: 1px dashed var(--vk-accent); border-radius: .75rem; padding: .75rem 1rem; }

/* Уведомления */
.notice-unread { background: color-mix(in srgb, var(--vk-accent) 8%, transparent); }
.notif-toast { background: var(--bs-body-bg); border: 1px solid var(--vk-accent); max-width: 360px; }

/* Подвал */
.site-footer { background: var(--bs-tertiary-bg); border-top: 1px solid var(--bs-border-color); color: var(--bs-secondary-color); }
.site-footer .foot-brand { display: inline-flex; align-items: center; gap: .5rem; font-size: 1.1rem; color: var(--bs-body-color); }
.site-footer .foot-brand:hover { text-decoration: none; }
.site-footer h6 { font-size: .72rem; text-transform: uppercase; letter-spacing: .09em; color: var(--bs-body-color);
  opacity: .7; margin-bottom: .8rem; }
.site-footer ul a { color: var(--bs-secondary-color); display: inline-block; padding: .2rem 0; }
.site-footer ul a:hover { color: var(--vk-accent); text-decoration: none; }
.site-footer .foot-cta { border: 1px solid var(--vk-accent); color: var(--vk-accent); border-radius: 2rem;
  padding: .35rem .9rem; display: inline-block; font-weight: 600; font-size: .85rem; }
.site-footer .foot-cta:hover { background: var(--vk-accent); color: var(--vk-accent-ink); text-decoration: none; }
.site-footer .foot-bottom { border-top: 1px solid var(--bs-border-color); font-size: .78rem; }
.site-footer .foot-bottom a { color: inherit; text-decoration: underline; text-decoration-color: var(--bs-border-color); }
