/* ── Global font ── */
body, .navbar { font-family: 'Roboto', system-ui, sans-serif; }

:root {
  /* Brand blues */
  --vik-blue:          #086eb5;
  --vik-blue-dark:     #065a95;
  --vik-blue-light:    #e8f4fd;
  --vik-blue-mid:      #217dbb;   /* table headers, attachment links */
  --vik-nav-top:       #0f75bb;   /* navbar gradient top */
  --vik-nav-bottom:    #0166ad;   /* navbar gradient bottom */
  --vik-nav-border:    #003c66;   /* navbar bottom border */
  --vik-table-accent:  #005d9f;   /* table heavy border */
  --vik-table-th-l:    #4899d0;   /* table th left border */
  --vik-table-th-r:    #246ea0;   /* table th right border */

  /* Footer */
  --vik-footer-bg:     #006cb7;
  --vik-footer-border: #005692;
  --vik-footer-text:   #acdff9;

  /* Borders */
  --vik-header-border: #d8e8f5;
  --vik-border:        #d8e8f2;   /* sidemenu, lists */
  --vik-border-light:  #ddd;      /* table cells, dashed separators */
  --vik-border-muted:  #ccc;      /* featured grid, dir links */

  /* Backgrounds */
  --vik-hover-bg:      #eef5fb;
  --vik-active-bg:     #dceaf6;
  --vik-row-even:      #f6fafd;
  --vik-bg-subtle:     #f2f2f2;

  /* Text */
  --vik-text:          #333;
  --vik-text-secondary:#444;
  --vik-text-muted:    #666;
  --vik-text-dimmed:   #aaa;
  --vik-gray:          #6c757d;

  /* Action buttons */
  --vik-action-news-bg:        #2e6da4;
  --vik-action-news-border:    #005c9c;
  --vik-action-damage-bg:      #e07b24;
  --vik-action-damage-border:  #cd710e;
  --vik-action-repairs-bg:     #8a9e2f;
  --vik-action-repairs-border: #cd9300;
  --vik-action-sewerage-bg:    #3a8a5c;
  --vik-action-sewerage-border:#499e4a;
  --vik-action-regime-bg:      #5a6474;
  --vik-action-regime-border:  #616b72;

  /* Status badges */
  --vik-badge-current:   #dc3545;
  --vik-badge-planned:   #fd7e14;
  --vik-badge-completed: #198754;
  --vik-badge-pending:   #6c757d;
  --vik-badge-reported:  #0dcaf0;
  --vik-badge-combined:  #6f42c1;
}

a { color: var(--vik-blue); }
a:hover { color: var(--vik-blue-dark); }

/* ── Header band ── */
.vik-header { background: #fff; border-bottom: 1px solid var(--vik-header-border); }

.vik-logo-placeholder {
  width: 58px; height: 50px; flex-shrink: 0;
  background: var(--vik-blue);
  border-radius: 3px;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 900; font-size: 1rem; letter-spacing: -1px;
}

.vik-site-title { color: var(--vik-blue); font-size: 1.2rem; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.vik-phone-label { color: var(--vik-text-muted); font-size: 0.8rem; }
.vik-phone-number { color: var(--vik-blue); font-size: 1.5rem; font-weight: bold; }
.vik-email-icon { color: var(--vik-blue); font-size: 1.5rem; }
.vik-email-icon:hover { color: var(--vik-blue-dark); }

/* ── Navigation ── */
.navbar-vik {
  background: linear-gradient(to bottom, var(--vik-nav-top), var(--vik-nav-bottom));
  box-shadow: 0 -5px 0 rgba(0,0,0,.06) inset, 0 1px 0 rgba(255,255,255,.13) inset,
              0 -1px 0 rgba(0,0,0,.13) inset, 0 4px 8px rgba(0,0,0,.12);
  border-bottom: 1px solid var(--vik-nav-border);
  padding-top: 2px;
  padding-bottom: 2px;
}
.navbar-vik .nav-link {
  color: #fff !important;
  font-weight: 500;
  text-shadow: 1px 1px 3px rgba(0,0,0,.6), -1px -1px 3px rgba(0,0,0,.4), 0 0 6px rgba(0,0,0,.3);
  font-size: 1.05rem;
  padding: 1rem 0.85rem;
  font-family: 'Roboto', system-ui, sans-serif;
  white-space: nowrap;
}
.navbar-vik .nav-link:hover,
.navbar-vik .nav-link:focus {
  background: #fff !important;
  color: var(--vik-footer-bg) !important;
  text-shadow: none !important;
  border-radius: 0;
  box-shadow: rgba(0,0,0,.06) 0 -5px 0 inset, rgba(255,255,255,.33) 0 1px 0 inset, rgba(0,0,0,.13) 0 -1px 0 inset;
}
.navbar-vik .nav-link-home { padding-left: 0.5rem; padding-right: 0.75rem; }
.navbar-vik .nav-link.active {
  color: #fff !important;
  background: transparent !important;
  text-shadow: none !important;
}
.navbar-vik .nav-link.active:hover,
.navbar-vik .nav-link.active:focus {
  color: #fff !important;
  background: rgba(255,255,255,0.20) !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
.navbar-vik .navbar-toggler-icon { filter: brightness(2); }

/* Language switcher */
.vik-lang-link {
  display: inline-block;
  padding: 0.2rem 0.45rem;
  font-size: 0.8rem;
  font-weight: 400;
  color: rgba(255,255,255,0.7) !important;
  text-decoration: none;
  border-radius: 3px;
  transition: background .15s;
}
.vik-lang-link:hover { color: #fff !important; background: rgba(255,255,255,.15); }
.vik-lang-active {
  background: rgba(255,255,255,0.25) !important;
  color: #fff !important;
  font-weight: 600;
  border: 1px solid rgba(255,255,255,0.5);
}

/* ── Carousel caption text outline ── */
.carousel-caption h2 {
  text-shadow: 1px 1px 3px rgba(0,0,0,.9), -1px -1px 3px rgba(0,0,0,.7),
               0 0 8px rgba(0,0,0,.8);
  font-weight: 700;
}

/* ── Carousel arrows ── */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  width: 2rem; height: 2rem;
  filter: drop-shadow(0 0 4px rgba(0,0,0,.9)) drop-shadow(0 0 2px rgba(0,0,0,.9));
}

.btn-vik { background-color: var(--vik-blue); color: #fff; border-color: var(--vik-blue); }
.btn-vik:hover { background-color: var(--vik-blue-dark); border-color: var(--vik-blue-dark); color: #fff; }

/* ── Homepage action buttons — CSS Grid, always equal size ── */
.vik-action-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}
@media (max-width: 600px) {
  .vik-action-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
.vik-action-btn {
  display: flex; align-items: center; justify-content: center;
  text-align: center; padding: 0;
  color: #fff !important; font-weight: 600; font-size: clamp(0.78rem, 1vw, 0.95rem);
  text-shadow: 1px 1px 3px rgba(0,0,0,.7), -1px -1px 3px rgba(0,0,0,.5), 0 0 8px rgba(0,0,0,.4);
  text-decoration: none !important;
  background-repeat: no-repeat; background-position: center; background-size: cover;
  height: 85px;
  transition: filter .15s;
  line-height: 1.25;
}
.vik-action-btn span { display: block; padding: 0.5rem; }
@media (max-width: 600px) { .vik-action-btn { height: 65px; } }
.vik-action-btn:hover { filter: brightness(1.12); }
.vik-action-news    { background-image: url('../images/box1.png'); background-color: var(--vik-action-news-bg);     border: 2px solid var(--vik-action-news-border); }
.vik-action-damage  { background-image: url('../images/box3.png'); background-color: var(--vik-action-damage-bg);   border: 2px solid var(--vik-action-damage-border); }
.vik-action-repairs { background-image: url('../images/box4.png'); background-color: var(--vik-action-repairs-bg);  border: 2px solid var(--vik-action-repairs-border); }
.vik-action-sewerage{ background-image: url('../images/box5.png'); background-color: var(--vik-action-sewerage-bg); border: 2px solid var(--vik-action-sewerage-border); }
.vik-action-regime  { background-image: url('../images/box6.png'); background-color: var(--vik-action-regime-bg);   border: 2px solid var(--vik-action-regime-border); }

/* ── Breadcrumb ── */
.breadcrumb { font-size: 0.78rem; }
/* Trailing slash when breadcrumb has only one item (homepage) */
.breadcrumb-item:only-child::after {
  content: " /";
  padding-left: 0.3rem;
  color: var(--vik-gray);
}

/* ── Page sidemenu (left sidebar) ── */
.vik-sidemenu { list-style: none; padding: 0; margin: 0; }
.vik-sidemenu-item { border-bottom: 1px solid var(--vik-border); }
.vik-sidemenu-item:first-child { border-top: 1px solid var(--vik-border); }
.vik-sidemenu-link {
  display: flex; justify-content: space-between; align-items: center;
  padding: 0.5rem 0.6rem 0.5rem 0.3rem;
  font-size: 1rem; color: var(--vik-text); text-decoration: none;
  transition: background .1s, color .1s;
}
.vik-sidemenu-link::after {
  content: '›';
  color: var(--vik-blue);
  font-size: 1.4rem;
  line-height: 1;
  flex-shrink: 0;
  margin-left: 0.4rem;
}
.vik-sidemenu-link:hover { background: var(--vik-hover-bg); color: var(--vik-blue); }
.vik-sidemenu-item.active .vik-sidemenu-link {
  background: var(--vik-active-bg);
  color: var(--vik-blue);
  font-weight: 600;
}
.vik-sidemenu-item:last-child { border-bottom: none; }

/* ── Procurement sub-category and contract lists (bottom-border only) ── */
.vik-catlist { list-style: none; padding: 0; margin: 0; }
.vik-catlist li { border-bottom: 1px solid var(--vik-border); }
.vik-catlist li a {
  display: block; padding: 0.5rem 0.4rem;
  color: var(--vik-blue); text-decoration: none;
}
.vik-catlist li a:hover { background: var(--vik-hover-bg); }

.vik-proclist { list-style: none; padding: 0; margin: 0; }
.vik-proclist-item { padding: 0.6rem 0.2rem; border-bottom: 1px solid var(--vik-border); }

/* ── Page body content ── */
.vik-page-body { min-height: 560px; }
.vik-page-body img { max-width: 100%; height: auto; }
.vik-page-body .mk-indent { padding-left: 1.4rem; }
.vik-page-body .mk-indent .mk-indent { padding-left: 1.2rem; }
.vik-page-body p { margin-bottom: 0.9rem; }
.vik-page-body h2, .vik-page-body h3, .vik-page-body h4 { margin-top: 1.5rem; }
.vik-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 1.25rem; }
.vik-page-body table {
  width: 100%; border-collapse: collapse; margin-bottom: 0;
  font-size: 0.9rem; color: var(--vik-text);
  border-bottom: 5px solid var(--vik-table-accent);
}
.vik-page-body table td {
  padding: 0.6rem 0.75rem;
  border-top: 1px solid var(--vik-border-light); border-left: 1px solid var(--vik-border-light);
}
.vik-page-body table td:last-child { border-right: 1px solid var(--vik-border-light); }
.vik-page-body table th {
  padding: 0.5rem 0.75rem; text-align: center;
  border-left: 1px solid var(--vik-table-th-l); border-right: 1px solid var(--vik-table-th-r);
  border-bottom: 3px solid var(--vik-table-accent);
}
.vik-page-body table thead {
  background: var(--vik-blue-mid); color: #fff; font-size: 0.95rem;
}
.vik-page-body table tbody tr:nth-child(even) td { background: var(--vik-row-even); }
.vik-page-body table td.text-right { text-align: right; }
.vik-page-body table td.text-center { text-align: center; }

/* ── Homepage portal card tabs ── */
/* Panes must NOT carry d-flex — that prevents Bootstrap hiding the inactive
   one with display:none. Active pane gets flex via the .show.active rule.
   flex-basis:0 on tab-content lets children use flex-grow against a concrete size. */
#vik-portal-card .tab-content { flex: 1 1 0; min-height: 0; }
#pcard-bill.show.active,
#pcard-login.show.active { display: flex !important; flex-direction: column; flex: 1; }
#pcard-bill.show.active > form,
#pcard-login.show.active > form { flex: 1; }

.vik-portal-tabs .nav-link {
  color: rgba(255,255,255,.65);
  border-bottom: 2px solid transparent;
  border-top: 0; border-left: 0; border-right: 0;
  border-radius: 0;
  background: none;
  padding: .3rem .5rem;
  font-size: .82rem;
  font-weight: 600;
}
.vik-portal-tabs .nav-link.active,
.vik-portal-tabs .nav-link:hover {
  color: #fff;
  background: none;
  border-bottom-color: rgba(255,255,255,.8);
}

/* ── Page attachments ── */
.vik-attachments { border-top: 2px solid var(--vik-border); padding-top: 0.75rem; }
.vik-attachment-item { padding: 0.3rem 0; border-bottom: 1px dashed var(--vik-border-light); }
.vik-attachment-item:last-child { border-bottom: none; }
.vik-attachment-item a { color: var(--vik-blue-mid); text-decoration: none; display: flex; align-items: baseline; gap: 0.4rem; }
.vik-attachment-item a:hover { text-decoration: underline; }
.vik-attachment-icon { font-size: 0.85rem; flex-shrink: 0; }

/* ── Pagination ── */
.pagination .page-link {
  border: none;
  color: var(--vik-blue);
  background: transparent;
  padding: 0.3rem 0.65rem;
  border-radius: 4px;
}
.pagination .page-link:hover,
.pagination .page-link:focus {
  background: var(--vik-blue-light);
  color: var(--vik-blue-dark);
  box-shadow: none;
}
.pagination .page-item.active .page-link {
  background: var(--vik-blue);
  color: #fff;
}
.pagination .page-item.disabled .page-link { color: var(--vik-text-dimmed); }

/* ── Featured pages "Полезни връзки" ── */
.vik-featured-grid {
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, auto);
  grid-auto-flow: column;
  gap: 0;
}
@media (max-width: 767px) {
  .vik-featured-grid { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-flow: row; }
}
.vik-featured-grid li {
  border-bottom: 1px dashed var(--vik-border-muted); padding: 0.35rem 0.5rem 0.35rem 0;
  display: flex; align-items: flex-start;
}
.vik-featured-grid li::before { content: '›'; color: var(--vik-blue); margin-right: 6px; flex-shrink: 0; }
.vik-featured-grid li a { color: var(--vik-blue); text-decoration: none; font-size: 0.9rem; line-height: 1.3; }
.vik-featured-grid li a:hover { text-decoration: underline; }

/* ── Info panel (Знаете ли, che) ── */
.vik-wave {
  height: 48px; width: 100%;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAIAAADYYG7QAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAipJREFUeNrsWNmSwjAMI8HdAv//qxy9V0RsKKVN0yOkO4NmeIGUqLZiK1ZN0+y2BL3bGLZFqK5rXVXVRthAPNfrVeOzERllWXaPEHlF55TneVEUDw0ha3E5gQ3C8yJqcLpcLlE4ZQY9pwz5O5/Pn9Q41YLwtL+UzgrE6cdAKRWUTVmWt9vtPSfSm1GsTtNURAIVG+QIW/T+KkPP3EuC1ghVkiQrUrGnaQjifh5RxduAE6K13+9n84A0wcNHoOIjvdwAqiItbeAWGZ6qDJAaEPJnL5MORWHwOJ+GE2EXMB6NwbxwyhJBfO3Hl9CX0L8jhAqiZ9ffEDidTvpwOIRu7J4AE/YAfTweo3NKDB4aQtbALi4bS0DZphPLWcPhwHs9dd1mQE/5MRcLnSAwHRuo3kMCA9TxuSFAnUDBXZa9OXK7zKWlT2uHP1YO0SB39NcrUhn1xGpUxYgWfdkSvSMe9MHjwvLfpvpDbTDeBPS9DRD+dU7Ne2881baq9k/IY9RxO7IhkMiM+xf2W70J8pqqcdEJ5I6nghfZrYxjwIbHWTNzsUYfthQ/b1dWTeAUJXeITbsxvIxjwClQdR46U9ixc9WX94ENKhhKe2iHBB7IlNc4BksRJ06JQlBBaXUcbRkqCez5bD1rRQvvif902xtxVyoOANmGZs+v2A09xyDimW+A1ZnjGHd7YmPhWAg8JhWUaeOY0qBtJ9hGANvUlsxiFo1jAk1kNneV/hVgAISkAGJxYI5EAAAAAElFTkSuQmCC);
  background-repeat: repeat-x;
}
.vik-botwave {
  height: 48px; width: 100%;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAIAAADYYG7QAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAhNJREFUeNrsmNuSgjAQRDcBvP3/l1rlBeWyR0ezKWRDhEDyQD9YQilpZnrSk1HH4/EnJeifxJAeIZAOm/1+r3e7XSJsNptNnuc6y7IUOEFju92+NFQUhVxEZEOy5Ltq21a+3e/36/W6PBvSRIqUUl1CoK7ry+Vi31lAN53kqM7yXBKnqqrmpkJICAzh6d7vjQeEyrJsmma+wACTpmFCgtvthrDC0qKAoOLY/NSgYogWzJDXxP23eKI3Kt8RMtqqnoCZ519YGx6UNELh01dbI2qKvzRvyKU8RL2h3xjxZMVL+9OfG+fzWVPkS248DlDX6EETdjbD6GwoZ0rn5WWyQcdlY1xLm9omf1FyR2BsD9W2kcFpvt25F1BBOv+2sLA5nU6Sy7nB+7MWyeqaf6/a+R0m/Ol8QYAwZIn+bqT3rpQehPCdgLsUVMQfHWLN3S4G/G3I/Sh4+HQ1w0khWuUTmQUfcrUF//rNv5Kh8XwxLGNedlKM043saEerYWJDsh6lV0IroXUc88DhcNCc8qd4QkBg53jAI0IpjGPkAPnSkMwfIrKxCfydy7DiKJ01sbHD0R3H0FMu2cWiG8mUaxzjaOfCljeB+ez+IoxjKGoZx3x9tpfDW0BaUJFqcmw0w8MGhCXd55RTG6mBCtUUbBwjeYQcn54xY22ZxfjwmDSOkUYbtBZkSXscM84AVCKjj3Td/leAAQB5WJoT5F2I8gAAAABJRU5ErkJggg==);
  background-repeat: repeat-x;
}
.vik-infopanel { background: var(--vik-bg-subtle); position: relative; margin-top: 0; }

/* ── Footer directory section ── */
.vik-footer-dir { background: #fff; padding: 1.5rem 0; }
.vik-dir-heading { font-size: 0.85rem; font-weight: bold; margin-bottom: 0.5rem; border-bottom: 2px solid var(--vik-blue); padding-bottom: 4px; }
.vik-dir-heading a { color: var(--vik-text); }
.vik-dir-link {
  display: block; font-size: 0.8rem; color: var(--vik-text-secondary);
  padding: 2px 0 2px 14px; text-decoration: none;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAJCAYAAAAPU20uAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAGFJREFUeNpiXLd9NwMQPAXiZiCewYAGmKC0FBBPB+KNQCyCTQEM+AHxJSB2xaUABCSBeCcQd+JSAANsIIIFi8RzIE6EmoJhwlog1oVJIiu4D9UVAsRvkXXArFDC5RCAAAMAFv0OqUwfYpsAAAAASUVORK5CYII=);
  background-position: 0 5px; background-repeat: no-repeat;
  border-bottom: 1px dotted var(--vik-border-muted);
}
.vik-dir-link:hover { color: var(--vik-blue); text-decoration: none; }

/* ── Footer bottom bar ── */
.vik-footer {
  background: var(--vik-footer-bg);
  border-top: 4px solid var(--vik-footer-border);
  color: var(--vik-footer-text);
  padding: 0.75rem 0;
  font-size: 0.85rem;
}
.vik-footer a { color: #fff; font-weight: bold; text-decoration: none; }
.vik-footer a:hover { color: var(--vik-footer-text); }

/* ── Repairment status badges ── */
.badge-status-current   { background-color: var(--vik-badge-current);   color: #fff; }
.badge-status-planned   { background-color: var(--vik-badge-planned);   color: #fff; }
.badge-status-completed { background-color: var(--vik-badge-completed); color: #fff; }
.badge-status-pending   { background-color: var(--vik-badge-pending);   color: #fff; }
.badge-status-reported  { background-color: var(--vik-badge-reported);  color: #000; }
.badge-status-combined  { background-color: var(--vik-badge-combined);  color: #fff; }

/* ── Portal content area ── */
.vik-portal { min-height: 560px; }
.vik-portal h2 { color: var(--vik-blue); font-size: 1.4rem; }
.vik-portal h5 { color: var(--vik-blue); }
.vik-portal .vik-table-wrap {
  overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 1.25rem;
}
.vik-portal .vik-table-wrap table {
  width: 100%; border-collapse: collapse; font-size: 0.9rem;
  border-bottom: 4px solid var(--vik-table-accent);
}
.vik-portal .vik-table-wrap table th {
  padding: 0.45rem 0.75rem; background: var(--vik-blue-mid); color: #fff;
  border-left: 1px solid var(--vik-table-th-l); border-right: 1px solid var(--vik-table-th-r);
  border-bottom: 3px solid var(--vik-table-accent); white-space: nowrap;
}
.vik-portal .vik-table-wrap table td {
  padding: 0.5rem 0.75rem; vertical-align: middle;
  border-top: 1px solid var(--vik-border-light); border-left: 1px solid var(--vik-border-light);
}
.vik-portal .vik-table-wrap table td:last-child { border-right: 1px solid var(--vik-border-light); }
.vik-portal .vik-table-wrap table tbody tr:nth-child(even) td { background: var(--vik-row-even); }
.vik-portal .vik-table-wrap table tbody tr:hover td { background: var(--vik-hover-bg); }
/* Suppress number input spinner arrows inside portal */
.vik-portal input[type=number]::-webkit-inner-spin-button,
.vik-portal input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; }
.vik-portal input[type=number] { -moz-appearance: textfield; appearance: textfield; }