/* STiKR theme enhancements - lightweight UI polish */
/* Theme tokens (dark is default; JS can toggle to light via data attribute) */
:root{
  --stikr-radius: 14px;
  --stikr-shadow: 0 18px 45px rgba(0,0,0,.35);

  --stikr-bg: #0b0f14;
  --stikr-text: #ffffff;
  --stikr-surface: rgba(255,255,255,.05);
  --stikr-surface-2: rgba(255,255,255,.035);
  --stikr-border-color: rgba(255,255,255,.12);
  --stikr-header-bg: rgba(11,15,20,.78);
  --stikr-footer-bg: rgba(11,15,20,.86);
  --stikr-link: rgba(255,255,255,.92);
}

html[data-stikr-theme="light"]{
  --stikr-bg: #ffffff;
  --stikr-text: #0b0f14;
  --stikr-surface: rgba(11,15,20,.04);
  --stikr-surface-2: rgba(11,15,20,.03);
  --stikr-border-color: rgba(11,15,20,.12);
  --stikr-header-bg: rgba(255,255,255,.82);
  --stikr-footer-bg: rgba(255,255,255,.92);
  --stikr-link: rgba(11,15,20,.92);
}

/* Keep borders consistent */
:root{ --stikr-border: 1px solid var(--stikr-border-color); }

.stikr-header{
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(14px);
  background: var(--stikr-header-bg);
  border-bottom: var(--stikr-border);
}

.stikr-brandbar{
  gap: 14px;
}

/* Cleaner pill (used for badges only) */
.stikr-pill{
  border-radius: 999px;
  border: var(--stikr-border);
  background: var(--stikr-surface-2);
  padding: 6px 10px;
}

/* More professional navigation */
.stikr-nav a{
  padding: 10px 12px;
  border-radius: 12px;
  transition: background .12s ease, color .12s ease;
  color: var(--stikr-link);
}
.stikr-nav a:hover{
  background: var(--stikr-surface);
}
.stikr-nav .current-menu-item > a,
.stikr-nav .current_page_item > a{
  background: var(--stikr-surface);
  border: var(--stikr-border);
}

.stikr-hero{
  border-radius: 28px;
  overflow: hidden;
  border: var(--stikr-border);
  box-shadow: var(--stikr-shadow);
  background: var(--wp--preset--gradient--stikr-glow);
}

.stikr-hero .stikr-hero__track{
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.stikr-hero .stikr-hero__track::-webkit-scrollbar{ display:none; }

.stikr-hero .stikr-hero__slide{
  min-width: 100%;
  scroll-snap-align: start;
}

.stikr-badge{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  border: var(--stikr-border);
  background: var(--stikr-surface);
  font-size: .9rem;
}

.stikr-card{
  border-radius: var(--stikr-radius);
  border: var(--stikr-border);
  background: var(--stikr-surface);
  box-shadow: 0 14px 30px rgba(0,0,0,.18);
}

.stikr-footer{
  border-top: var(--stikr-border);
  background: var(--stikr-footer-bg);
}

/* Theme toggle button */
.stikr-theme-toggle{
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  border: var(--stikr-border);
  background: var(--stikr-surface-2);
  cursor: pointer;
}
.stikr-theme-toggle:hover{ background: var(--stikr-surface); }
.stikr-theme-toggle__icon{
  width: 18px;
  height: 18px;
  display: block;
  background: currentColor;
  -webkit-mask: var(--stikr-theme-icon) center / contain no-repeat;
          mask: var(--stikr-theme-icon) center / contain no-repeat;
}

/* Sun/Moon icon via inline SVG mask */
:root{
  --stikr-theme-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 18a6 6 0 1 1 0-12 6 6 0 0 1 0 12Zm0-16h0Zm0 20h0ZM4.22 5.64 2.81 4.22 4.22 2.81 5.64 4.22 4.22 5.64Zm16.97 16.97-1.41-1.41 1.41-1.41 1.41 1.41-1.41 1.41ZM1 13v-2h3v2H1Zm19 0v-2h3v2h-3ZM4.22 21.19 5.64 19.78 4.22 18.36 2.81 19.78 4.22 21.19ZM21.19 4.22 19.78 5.64 18.36 4.22 19.78 2.81 21.19 4.22Z'/%3E%3C/svg%3E");
}
html[data-stikr-theme="dark"]{
  --stikr-theme-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 14.5A8.5 8.5 0 0 1 9.5 3a7 7 0 1 0 11.5 11.5Z'/%3E%3C/svg%3E");
}

/* Buttons */
.wp-block-button__link{ box-shadow: none; }
.stikr-btn--spectrum .wp-block-button__link{
  background: var(--wp--preset--gradient--stikr-spectrum) !important;
  color: #0b0f14 !important;
}

/* Outline button looks consistent in both modes */
.wp-block-button.is-style-outline .wp-block-button__link{
  background: transparent !important;
  border: var(--stikr-border) !important;
  color: var(--stikr-link) !important;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover{ background: var(--stikr-surface) !important; }

/* Body background follows theme */
body{ background: var(--stikr-bg); color: var(--stikr-text); }

/* Ensure global links/text adapt */
a{ color: var(--stikr-link); }

/* Responsive tweaks */
@media (max-width: 782px){
  .stikr-header{ position: relative; }
}