/* 7.9.66 — unified footer, notes slide-over, apps, post modal, hero light, nalog tools */

html:has(body.bu-product-page),
html body.bu-product-page {
  overflow-x: hidden !important;
  overflow-y: scroll !important;
}

/* —— Notes panel ABOVE blur overlay (board-fit z-index 220 was behind ::before 20135) —— */
html body.bu-notes-open::before {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 20200 !important;
  background: rgba(15, 23, 42, 0.46) !important;
  backdrop-filter: blur(6px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(6px) saturate(1.05) !important;
  pointer-events: auto !important;
}
html body .bu-notes:not([hidden]),
html body.bu-board-page .bu-notes:not([hidden]),
html body.bu-nalog-page .bu-notes:not([hidden]),
html body.bu-notes-open #bu-notes:not([hidden]) {
  position: fixed !important;
  z-index: 20280 !important;
  display: flex !important;
  flex-direction: column !important;
  background: #fff !important;
  color: #0f172a !important;
  pointer-events: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
  box-shadow: -18px 0 48px rgba(15, 23, 42, 0.22), 0 0 0 1px rgba(15, 23, 42, 0.06) !important;
}
html body #bu-notes[hidden],
html body .bu-notes[hidden] {
  display: none !important;
}
@media (min-width: 900px) {
  html body .bu-notes,
  html body.bu-board-page .bu-notes {
    top: 64px !important;
    right: 12px !important;
    left: auto !important;
    bottom: auto !important;
    width: min(400px, calc(100vw - 24px)) !important;
    max-height: min(78dvh, 640px) !important;
    border-radius: 18px !important;
    animation: bu66-slide-in 0.28s cubic-bezier(.2, .8, .2, 1);
  }
}
@media (max-width: 899px) {
  html body .bu-notes,
  html body.bu-board-page .bu-notes {
    inset: auto 0 0 !important;
    width: 100% !important;
    max-height: min(82dvh, 620px) !important;
    border-radius: 20px 20px 0 0 !important;
  }
}
@keyframes bu66-slide-in {
  from { opacity: 0; transform: translateX(18px) scale(0.98); filter: blur(4px); }
  to { opacity: 1; transform: none; filter: none; }
}

html body .bu-sound-pop {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 20300;
  min-width: 220px;
  padding: 12px 14px;
  border-radius: 14px;
  background: #0f172a;
  color: #f8fafc;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.35);
  font-size: 13px;
  font-weight: 650;
}
html body .bu-sound-pop[hidden] { display: none !important; }
html body .bu-board-header-right { position: relative; }
html body .bu-header-sound {
  display: inline-flex !important;
  position: relative;
  z-index: 3;
}

/* —— Apps strip —— */
html body .bu-apps-nav {
  display: flex;
  gap: 6px;
  align-items: stretch;
  flex: 0 0 auto;
}
html body .bu-apps-nav a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 36px;
  padding: 4px 10px;
  border-radius: 999px;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: inherit;
  line-height: 1.15;
}
html body .bu-apps-nav strong {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.01em;
}
html body .bu-apps-nav span {
  font-size: 9px;
  opacity: 0.72;
  font-weight: 650;
}
html body .bu-board-sidebar-foot .bu-apps-nav {
  flex-direction: column;
  width: 100%;
  margin: 0 0 8px;
}
html body .bu-board-sidebar-foot .bu-apps-nav a {
  background: #12202c;
  color: #e2eef4;
  border-color: rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 8px 10px;
}
html body .bu-neon-head .bu-apps-nav a {
  background: rgba(255, 255, 255, 0.1);
  color: #f8fafc;
}
html body .bu-neon-head.is-inner .bu-apps-nav a,
html body.bu-product-page .bu-neon-head .bu-apps-nav a {
  background: #ecf4f7;
  color: #123a48;
  border-color: #d5e4ea;
}
@media (max-width: 1099px) {
  html body .bu-neon-head .bu-apps-nav span { display: none; }
}

/* —— Edition pill: market chips —— */
html body .bu-edition-markets {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 8px;
}
html body .bu-edition-markets a,
html body .bu-edition-markets button {
  min-width: 36px;
  height: 28px;
  padding: 0 8px;
  border-radius: 999px;
  border: 1px solid #dbe4ee;
  background: #fff;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
  color: #0f172a;
}
html body .bu-edition-markets a.is-on,
html body .bu-edition-markets button.is-on {
  background: #0b6e86;
  color: #fff;
  border-color: #0b6e86;
}

/* —— Unified public footer —— */
html body .bu-pub-foot,
html body.bu-landing-page .bu-pub-foot,
html body.bu-product-page .bu-pub-foot,
html body.bu-author-page .bu-pub-foot {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  min-height: 280px !important;
  overflow: visible !important;
  margin-top: 0 !important;
  background:
    radial-gradient(ellipse at 12% 0%, rgba(42, 163, 181, 0.28), transparent 46%),
    radial-gradient(ellipse at 88% 20%, rgba(196, 92, 38, 0.18), transparent 40%),
    linear-gradient(180deg, #164556 0%, #123a48 58%, #0e3340 100%) !important;
  color: #d7ebe8 !important;
  filter: none !important;
}
html body .bu-pub-foot-inner {
  display: grid !important;
  grid-template-columns: 1.35fr 1fr 1fr 1fr !important;
  gap: 28px 32px !important;
  padding: 48px 28px 28px !important;
  max-width: 1280px;
  margin: 0 auto;
}
html body .bu-pub-foot a { color: #e4f4f1 !important; }
html body .bu-pub-foot strong { color: #fff !important; display: block; margin-bottom: 10px; font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; }
html body .bu-pub-foot-col { display: grid; gap: 8px; align-content: start; }
html body .bu-pub-foot-col a { font-size: 14px; font-weight: 650; }
html body .bu-pub-foot-apps { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
html body .bu-pub-foot-apps a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #fff !important;
  color: #123a48 !important;
  font-size: 12px;
  font-weight: 800;
}
html body .bu-pub-foot-bar {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  max-width: 1280px;
  margin: 0 auto;
  padding: 16px 28px 28px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 12px;
  opacity: 0.88;
}
@media (max-width: 899px) {
  html body .bu-pub-foot-inner {
    grid-template-columns: 1fr 1fr !important;
    padding: 32px 18px 20px !important;
  }
}
@media (max-width: 560px) {
  html body .bu-pub-foot-inner { grid-template-columns: 1fr !important; }
}

/* —— Objavi modal —— */
html body #bu-post.bu-chat.is-open:not([hidden]) {
  background: rgba(12, 28, 36, 0.55) !important;
  backdrop-filter: blur(10px) saturate(1.1) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.1) !important;
}
html body #bu-post .bu-post-panel {
  box-shadow: 0 32px 80px rgba(15, 23, 42, 0.28), 0 0 0 1px rgba(255, 255, 255, 0.08);
  overflow: hidden;
}
html body #bu-post .bu-post-shot-visual {
  display: none;
}
html body #bu-post .bu-post-pro-head {
  padding: 18px 20px 8px;
}
html body #bu-post .bu-tile-pro {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 16px 16px !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #ffffff, #f7fbfc);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.07);
}
html body #bu-post .bu-tile-pro.blue { box-shadow: 0 10px 28px rgba(11, 110, 134, 0.12), inset 0 0 0 1px rgba(11, 110, 134, 0.12); }
html body #bu-post .bu-tile-pro.green { box-shadow: 0 10px 28px rgba(16, 185, 129, 0.12), inset 0 0 0 1px rgba(16, 185, 129, 0.14); }
html body #bu-post .bu-tile-ico {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-size: 22px;
  background: #ecf8fa;
}
html body #bu-post .bu-post-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}
html body #bu-post .bu-post-tags li {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.02em;
  padding: 3px 8px;
  border-radius: 999px;
  background: #e8f4f6;
  color: #0b6e86;
}
html body #bu-post .bu-post-shot-foot {
  text-align: center;
  padding: 4px 16px 16px;
}
html body #bu-post .bu-post-shot-foot span {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, #0b6e86, #2aa3b5);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
}

/* —— Hero light wash + quad cards —— */
html body.bu-landing-page .bu-neon-hero-veil {
  background:
    linear-gradient(105deg, rgba(244, 239, 228, 0.42) 0%, rgba(42, 163, 181, 0.22) 42%, rgba(196, 92, 38, 0.16) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(14, 51, 64, 0.28)) !important;
  mix-blend-mode: normal;
}
html body.bu-landing-page .bu-neon-hero-bloom {
  background: radial-gradient(ellipse at 20% 20%, rgba(42, 163, 181, 0.45), transparent 50%),
    radial-gradient(ellipse at 80% 70%, rgba(196, 92, 38, 0.28), transparent 46%) !important;
  opacity: 0.85;
}
html body.bu-landing-page .bu-neon-hero-bloom.is-white {
  background: radial-gradient(ellipse at 70% 10%, rgba(255, 255, 255, 0.55), transparent 42%) !important;
}
html body.bu-landing-page .bu-hero-solve {
  display: inline-flex;
  margin: 10px 0 0;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.28);
  backdrop-filter: blur(10px);
  font-size: 13px;
  font-weight: 750;
  color: #f8fafc;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.16);
}
html body.bu-landing-page .bu-neon-quad {
  gap: 14px;
}
html body.bu-landing-page .bu-neon-q {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.08));
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
  backdrop-filter: blur(14px) saturate(1.15);
  -webkit-backdrop-filter: blur(14px) saturate(1.15);
  border-radius: 18px;
}
html body.bu-landing-page .bu-neon-q.is-cta {
  background: linear-gradient(160deg, #0b6e86, #c45c26);
  border-color: transparent;
}

html body.bu-landing-page .bu-home-win {
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.14);
  backdrop-filter: blur(12px);
}

/* —— Nalog calculators —— */
html body .bu-calc-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 22px;
}
html body .bu-calc-card {
  background: #fff;
  border: 1px solid #dbe4ee;
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
}
html body .bu-calc-card h3 { margin: 0 0 10px; font-size: 15px; }
html body .bu-calc-card label { display: grid; gap: 4px; font-size: 12px; font-weight: 700; margin-bottom: 8px; color: #475569; }
html body .bu-calc-card input { height: 38px; border-radius: 10px; border: 1px solid #dbe4ee; padding: 0 10px; }
html body .bu-calc-out { margin: 8px 0 0; font-weight: 800; color: #0b6e86; }
html body .bu-how-mini {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 8px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  text-decoration: none;
  background: #ecf8fa;
  color: #0b6e86;
  border: 1px solid #c5e4ea;
}
@media (max-width: 720px) {
  html body .bu-calc-grid { grid-template-columns: 1fr; }
}

/* —— Page motion (subtle, skip board) —— */
@media (prefers-reduced-motion: no-preference) {
  html body.bu-landing-page.bu-in,
  html body.bu-product-page.bu-in {
    animation: bu66-in 0.38s cubic-bezier(.2, .8, .2, 1);
  }
  html body.bu-landing-page.bu-out,
  html body.bu-product-page.bu-out {
    animation: bu66-out 0.2s ease-in both;
  }
}
@keyframes bu66-in {
  from { opacity: 0.4; filter: blur(8px); transform: translateY(8px); }
  to { opacity: 1; filter: none; transform: none; }
}
@keyframes bu66-out {
  to { opacity: 0.35; filter: blur(6px); transform: translateY(-6px); }
}

html body .bu-viber-soon {
  margin: 16px 0 0;
  padding: 14px 16px;
  border-radius: 14px;
  background: linear-gradient(90deg, #7360f2, #0b6e86);
  color: #fff;
  font-weight: 700;
  box-shadow: 0 12px 28px rgba(115, 96, 242, 0.28);
}