/* Фирменная палитра Zаренда: тёмно-синий, голубой акцент, серый, золото. */
:root {
  --za-ink: #1d2733;
  --za-muted: #5c6b7c;
  --za-panel: #ffffff;
  --za-line: #cfd8e3;
  --za-accent: #2b5ea7;
  --za-accent-dark: #1e4479;
  --za-accent-soft: #e8f0fa;
  --za-navy: #1e3a5f;
  --za-gold: #c6a15b;
  --za-warning: #b33d00;
  --za-warning-soft: #fff0e5;
  --za-nav: #1e3a5f;
}

.app-body {
  background: linear-gradient(180deg, #f7f9fb 0%, #eef2f7 100%);
  color: var(--za-ink);
}

a {
  color: var(--za-accent);
}

a:hover,
a:focus {
  color: var(--za-accent-dark);
}

.app-navbar {
  background: linear-gradient(90deg, #16294a 0%, var(--za-navy) 100%);
  border-bottom: 3px solid var(--za-gold);
}

.app-navbar .navbar-brand,
.app-navbar .nav-link,
.app-navbar .text-white {
  color: #ffffff !important;
}

.app-navbar .nav-link {
  font-weight: 600;
  opacity: 1;
}

.app-navbar .nav-link:hover,
.app-navbar .nav-link:focus {
  color: #dff7ed !important;
  text-decoration: underline;
  text-underline-offset: 0.25rem;
}

.brand-logo {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #ffffff !important;
}

.brand-logo img {
  height: 2.4rem;
  width: auto;
}

.brand-logo .brand-z {
  color: #7fa8e0;
}

.btn {
  font-weight: 700;
  border-width: 1px;
}

.btn-primary {
  color: #ffffff;
  background-color: var(--za-accent);
  border-color: var(--za-accent);
}

.btn-primary:hover,
.btn-primary:focus {
  color: #ffffff;
  background-color: var(--za-accent-dark);
  border-color: var(--za-accent-dark);
}

.btn-outline-primary {
  color: var(--za-accent-dark);
  border-color: var(--za-accent-dark);
  background-color: #ffffff;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
  color: #ffffff;
  background-color: var(--za-accent-dark);
  border-color: var(--za-accent-dark);
}

.btn-outline-light {
  color: #ffffff;
  border-color: #ffffff;
  background-color: transparent;
}

.btn-outline-light:hover,
.btn-outline-light:focus {
  color: var(--za-nav);
  background-color: #ffffff;
  border-color: #ffffff;
}

.btn:disabled,
.btn.disabled {
  opacity: 0.65;
  color: #3f4954;
  background-color: #e4e8ed;
  border-color: #cbd2da;
}

.action-banner {
  border: 1px solid var(--za-line);
  border-left: 6px solid var(--za-accent);
  background: var(--za-panel);
  border-radius: 8px;
  padding: 1.25rem;
  box-shadow: 0 10px 24px rgba(20, 30, 40, 0.06);
}

.role-label {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--za-line);
  border-radius: 999px;
  padding: 0.25rem 0.65rem;
  color: var(--za-ink);
  background: #f6f8fa;
  font-size: 0.875rem;
  font-weight: 700;
}

.status-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border-radius: 999px;
  padding: 0.25rem 0.65rem;
  font-size: 0.84rem;
  font-weight: 700;
  background: var(--za-accent-soft);
  color: var(--za-accent-dark);
}

.status-chip.warning {
  background: var(--za-warning-soft);
  color: var(--za-warning);
}

.status-chip.neutral {
  background: #eef1f4;
  color: #374151;
}

.status-chip.success {
  background: #e5f5ee;
  color: #075f43;
}

.staff-card,
.dashboard-section {
  border: 1px solid var(--za-line);
  border-radius: 8px;
  background: var(--za-panel);
  box-shadow: 0 8px 18px rgba(20, 30, 40, 0.04);
}

.staff-card {
  padding: 1rem;
  min-height: 100%;
}

.staff-card-number {
  font-size: 2rem;
  font-weight: 800;
  line-height: 1;
}

.section-header {
  padding: 1rem;
  border-bottom: 1px solid var(--za-line);
  background: #ffffff;
  border-radius: 8px 8px 0 0;
}

.dashboard-section .table {
  margin-bottom: 0;
}

.dashboard-section .table thead th {
  background: #f2f5f8;
  color: #26313d;
  font-weight: 700;
}

.timeline {
  display: grid;
  gap: 0.85rem;
}

.timeline-item {
  border: 1px solid var(--za-line);
  border-left: 4px solid #b8c1cc;
  border-radius: 8px;
  background: #ffffff;
  padding: 0.85rem 1rem;
}

.timeline-item.timeline-unread {
  border-left-color: var(--za-warning);
  background: #fffaf5;
}

.timeline-item.timeline-read {
  border-left-color: #b8c1cc;
  background: #ffffff;
}

.timeline-item.timeline-internal {
  border-left-color: #343a40;
  background: #f6f7f8;
}

.notification-unread {
  border-left: 4px solid var(--za-warning) !important;
}

/* === File dropzone (из zadelo) === */
.dropzone-zone {
  border: 1px dashed #94a3b8;
  border-radius: 6px;
  padding: 8px 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(13, 110, 253, 0.04);
  transition: border-color .15s, background .15s;
  user-select: none;
}
.dropzone-zone:hover, .dropzone-zone.dragover {
  border-color: #0d6efd;
  background: rgba(13, 110, 253, 0.1);
}
.dropzone-hint { color: #6c757d; font-size: 12px; }
.dropzone-btn {
  padding: 4px 8px;
  font-size: 18px;
  background: none;
  border: none;
  cursor: pointer;
  line-height: 1;
  color: #6c757d;
  white-space: nowrap;
}
.dropzone-btn:hover { color: #0d6efd; }
.dropzone-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.file-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(13, 110, 253, 0.08);
  border: 1px solid #0d6efd;
  color: #212529;
  border-radius: 20px;
  padding: 4px 10px;
  font-size: 12px;
  max-width: 260px;
}
.file-chip-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 200px; }
.file-chip-remove {
  background: none;
  border: none;
  cursor: pointer;
  color: #94a3b8;
  padding: 0;
  font-size: 13px;
  line-height: 1;
  flex-shrink: 0;
}
.file-chip-remove:hover { color: #ef4444; }

/* === Interactive building map === */
.map-legend {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 3px;
  vertical-align: -2px;
  margin-right: 4px;
}
.map-legend-occupied { background: rgba(13,110,253,0.5); border: 1px solid #0d6efd; }
.map-legend-free { background: rgba(25,135,84,0.5); border: 1px solid #198754; }
.map-legend-unavailable { background: rgba(108,117,125,0.5); border: 1px solid #6c757d; }
.floor-map-overlay { pointer-events: none; }
.floor-map-overlay polygon, .floor-map-overlay circle { pointer-events: auto; }

/* === Тёмная тема (data-bs-theme="dark" на <html>) === */
[data-bs-theme="dark"] .app-body {
  background: linear-gradient(180deg, #0d1524 0%, #101c30 100%);
  color: #dbe4f0;
}
[data-bs-theme="dark"] a { color: #8ab2ec; }
[data-bs-theme="dark"] a:hover, [data-bs-theme="dark"] a:focus { color: #b3ccf3; }
[data-bs-theme="dark"] .app-navbar {
  background: linear-gradient(90deg, #0c1729 0%, #16294a 100%);
  border-bottom-color: var(--za-gold);
}
[data-bs-theme="dark"] .action-banner,
[data-bs-theme="dark"] .staff-card,
[data-bs-theme="dark"] .dashboard-section,
[data-bs-theme="dark"] .card {
  background: #16233c;
  border-color: #26385a;
  color: #dbe4f0;
}
[data-bs-theme="dark"] .card-header,
[data-bs-theme="dark"] .card-header.bg-white {
  background: #1b2a47 !important;
  border-color: #26385a;
  color: #dbe4f0;
}
[data-bs-theme="dark"] .section-header { border-color: #26385a; }
[data-bs-theme="dark"] .role-label {
  background: #1b2a47;
  border-color: #26385a;
  color: #dbe4f0;
}
[data-bs-theme="dark"] .text-secondary { color: #93a5bd !important; }
[data-bs-theme="dark"] .bg-light { background-color: #1b2a47 !important; }
[data-bs-theme="dark"] .table { --bs-table-bg: transparent; color: #dbe4f0; }
[data-bs-theme="dark"] .table-light,
[data-bs-theme="dark"] .table thead th {
  background: #1b2a47;
  color: #dbe4f0;
  border-color: #26385a;
}
[data-bs-theme="dark"] .btn-outline-primary {
  color: #8ab2ec;
  border-color: #8ab2ec;
  background: transparent;
}
[data-bs-theme="dark"] .btn-outline-primary:hover,
[data-bs-theme="dark"] .btn-outline-primary:focus {
  color: #0d1524;
  background: #8ab2ec;
  border-color: #8ab2ec;
}
[data-bs-theme="dark"] .btn:disabled, [data-bs-theme="dark"] .btn.disabled {
  color: #93a5bd;
  background-color: #1b2a47;
  border-color: #26385a;
}
[data-bs-theme="dark"] .status-chip { background: #1e3a5f; color: #b3ccf3; }
[data-bs-theme="dark"] .dropzone-zone { background: rgba(138, 178, 236, 0.06); border-color: #3a527d; }
[data-bs-theme="dark"] .dropzone-zone:hover, [data-bs-theme="dark"] .dropzone-zone.dragover {
  background: rgba(138, 178, 236, 0.14);
  border-color: #8ab2ec;
}
[data-bs-theme="dark"] .file-chip { background: #1b2a47; border-color: #3a527d; color: #dbe4f0; }
[data-bs-theme="dark"] .accordion-item { background: #16233c; border-color: #26385a; }
[data-bs-theme="dark"] .accordion-button { background: #1b2a47; color: #dbe4f0; }
[data-bs-theme="dark"] .list-group-item { background: #16233c; color: #dbe4f0; border-color: #26385a; }
[data-bs-theme="dark"] .list-group-item.bg-light { background: #1b2a47 !important; }
[data-bs-theme="dark"] .timeline-item { border-color: #26385a; }
[data-bs-theme="dark"] footer { color: #93a5bd !important; }

/* Логотип: на светлой теме показываем светлый знак, на тёмной — тёмный вариант */
.logo-light { display: inline; }
.logo-dark { display: none; }
[data-bs-theme="dark"] .logo-light { display: none; }
[data-bs-theme="dark"] .logo-dark { display: inline; }

/* Canonical assets are crops from the client-approved Zаренда board. */
.brand-logo img { content:url("/static/img/zarenda-approved-icon.png"); height:2.25rem; width:2.25rem; border-radius:.55rem; object-fit:cover; }
body:has(.logo-light) .logo-light, body:has(.logo-dark) .logo-dark { content:url("/static/img/zarenda-approved-logo.png"); width:min(360px,100%); height:auto !important; }
body:has(.logo-light) .logo-light + .logo-dark + .h3 { display:none; }
[data-bs-theme="dark"] body:has(.logo-dark) .logo-dark { background:#fff; border-radius:.7rem; padding:.35rem .55rem; }
@media (max-width:575.98px) { body:has(.logo-light) .logo-light, body:has(.logo-dark) .logo-dark { width:min(280px,100%); } }

/* Theme-specific approved marks and restrained navigation gradients. */
:root:not([data-bs-theme="dark"]) .app-navbar { background:linear-gradient(90deg,#fff 0%,#f8fbff 12%,#dbe9f7 25%,#4b79ae 40%,#1e3a5f 100%); border-bottom-color:#c6a15b; }
:root:not([data-bs-theme="dark"]) .app-navbar .navbar-brand,:root:not([data-bs-theme="dark"]) .app-navbar .nav-link { color:#142f4f !important; }
:root:not([data-bs-theme="dark"]) .app-navbar .brand-z { color:#2b5ea7; }
:root:not([data-bs-theme="dark"]) .app-navbar .navbar-nav .nav-item:nth-child(n+3) .nav-link { color:#fff !important; }
:root:not([data-bs-theme="dark"]) .brand-logo img { content:url("/static/img/zarenda-mark-light-transparent.png"); width:auto; height:2.25rem; border-radius:0; object-fit:contain; }
[data-bs-theme="dark"] .app-navbar { background:linear-gradient(90deg,#050a12 0%,#0b1729 26%,#153b67 58%,#215d9f 100%); border-bottom-color:#9f7c3b; box-shadow:0 5px 22px rgba(0,0,0,.35); }
[data-bs-theme="dark"] .app-navbar .navbar-brand,[data-bs-theme="dark"] .app-navbar .nav-link { color:#dbe7f5 !important; } [data-bs-theme="dark"] .brand-logo img { content:url("/static/img/zarenda-mark-dark-transparent.png"); width:auto; height:2.25rem; border-radius:0; object-fit:contain; }
[data-bs-theme="dark"] .app-body { background:#091522; color:#e3ebf5; } [data-bs-theme="dark"] .dashboard-section,[data-bs-theme="dark"] .card,[data-bs-theme="dark"] .accordion-item { background:#112039; border-color:#263d5c; }
[data-bs-theme="dark"] .section-header,[data-bs-theme="dark"] .card-header,[data-bs-theme="dark"] .card-header.bg-white { background:#162a45 !important; border-color:#263d5c; color:#e3ebf5 !important; } [data-bs-theme="dark"] .section-header h1,[data-bs-theme="dark"] .section-header h2,[data-bs-theme="dark"] .section-header h3 { color:#e3ebf5; }
[data-bs-theme="dark"] .accordion-button,[data-bs-theme="dark"] .accordion-button:not(.collapsed),[data-bs-theme="dark"] .list-group-item,[data-bs-theme="dark"] .list-group-item.bg-light { background:#142640 !important; color:#e3ebf5; border-color:#263d5c; }
[data-bs-theme="dark"] .table,[data-bs-theme="dark"] .table > :not(caption) > * > * { color:#dce7f4; border-color:#263d5c; } [data-bs-theme="dark"] .text-secondary { color:#9fb1c7 !important; }
[data-bs-theme="dark"] .badge.text-bg-danger,[data-bs-theme="dark"] .bg-danger { background:#7b3544 !important; color:#ffe1e6 !important; } [data-bs-theme="dark"] .badge.text-bg-success,[data-bs-theme="dark"] .bg-success { background:#245e50 !important; color:#d7f4e8 !important; }
[data-bs-theme="dark"] .badge.text-bg-warning,[data-bs-theme="dark"] .bg-warning { background:#725926 !important; color:#ffedbf !important; } [data-bs-theme="dark"] .badge.text-bg-secondary,[data-bs-theme="dark"] .bg-secondary { background:#40516a !important; color:#edf2f8 !important; }

/* Refined header typography and the background-free night mark. */
.brand-logo { gap:.55rem; min-height:2.3rem; font-weight:500; letter-spacing:0; }
.brand-logo > span { display:block; width:126px; height:27px; font-size:0; background:url("/static/img/zarenda-approved-wordmark.png") left center/contain no-repeat; }
.brand-logo .brand-z { display:none; }
:root:not([data-bs-theme="dark"]) .brand-logo img { content:url("/static/img/zarenda-mark-light-transparent.png"); height:2rem; width:auto; }
:root:not([data-bs-theme="dark"]) .app-navbar .navbar-nav .nav-item:nth-child(1) .nav-link { color:#173b63 !important; }
:root:not([data-bs-theme="dark"]) .app-navbar .navbar-nav .nav-item:nth-child(2) .nav-link { color:#2e5d90 !important; }
:root:not([data-bs-theme="dark"]) .app-navbar .navbar-nav .nav-item:nth-child(3) .nav-link { color:#b9d0e8 !important; }
:root:not([data-bs-theme="dark"]) .app-navbar .navbar-nav .nav-item:nth-child(n+4) .nav-link { color:#f4f8fd !important; }
[data-bs-theme="dark"] .brand-logo img { content:url("/static/img/zarenda-mark-dark-foreground.png"); height:2rem; width:auto; }
[data-bs-theme="dark"] .brand-logo > span { filter:brightness(0) invert(1); opacity:.94; }
@media (max-width:575.98px) { .brand-logo > span { width:108px; height:23px; } }

/* The approved login logo is a transparent cutout in night mode, not a white tile. */
[data-bs-theme="dark"] body:has(.logo-dark) .logo-dark {
  content: url("/static/img/zarenda-approved-logo-transparent.png");
  width: min(360px, 100%);
  height: auto !important;
  padding: 0;
  background: transparent;
  border-radius: 0;
  filter: brightness(0) invert(1);
}

[data-bs-theme="dark"] body:has(.logo-dark) .logo-dark {
  content: url("/static/img/zarenda-approved-logo-night.png?v=gold-2");
  filter: none;
}

/* Keep the brand anchored identically when switching the colour theme. */
.app-navbar .brand-logo {
  display: grid;
  grid-template-columns: 32px 126px;
  column-gap: .55rem;
  align-items: center;
  width: 167px;
  min-height: 40px;
  padding: 0;
}
.app-navbar .brand-logo img {
  width: 32px !important;
  height: 32px !important;
  object-fit: contain;
  object-position: left center;
}
.app-navbar .brand-logo > span { width: 126px; height: 27px; margin: 0; }
:root:not([data-bs-theme="dark"]) .app-navbar .brand-logo img { transform: translateX(-1px); }
[data-bs-theme="dark"] .app-navbar .brand-logo img { transform: translateX(-14px); }

/* Match the visible size of the approved day and night login marks. */
[data-bs-theme="dark"] body:has(.logo-dark) .logo-dark { width: min(410px, 100%); }
@media (min-width: 576px) {
  [data-bs-theme="dark"] body:has(.logo-dark) .logo-dark {
    width: auto;
    max-width: calc(100% + 72px);
    height: 122px !important;
  }
}