/* Nakata-Dojo-style UI elements adapted for Infinite Resources:
   1) #irSocialDock — fixed right-edge social dock with macOS-style magnification
   2) .nd-mobile-menu — white right slide-in panel opened by the header hamburger */

:root {
  --nd-blue: #227FE3;
  --nd-blue-dark: #1a66b8;
  --nd-panel: #ffffff;
  --nd-white: #ffffff;
}

/* ── Social dock ─────────────────────────────────────────────────────────── */
#irSocialDock {
  position: fixed;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1500;
  display: flex;
  flex-direction: column;
  gap: 13px;
  padding: 0;
  border: 0;
  background: none;
}
#irSocialDock .sd-icon {
  width: 44px;
  height: 44px;
  border-radius: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-decoration: none;
  transform-origin: right center;
  transition: transform .18s cubic-bezier(.22,1,.36,1), box-shadow .18s;
  box-shadow: 0 2px 6px rgba(0,0,0,.22);
  will-change: transform;
}
#irSocialDock .sd-icon svg { width: 23px; height: 23px; display: block; }
#irSocialDock .sd-fb { background: #1877F2; }
#irSocialDock .sd-ig { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285AEB 90%); }
#irSocialDock .sd-li { background: #0A66C2; }

@media (max-width: 760px) {
  #irSocialDock {
    inset: auto auto 16px 50%;
    top: auto;
    right: auto;
    left: 50%;
    transform: translateX(-50%);
    flex-direction: row;
    gap: 16px;
  }
  #irSocialDock .sd-icon { width: 42px; height: 42px; transform-origin: center center; }
}

/* ── Hamburger (restyle of the existing header toggle) ───────────────────── */
.ir-nav__toggle.nd-toggle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  cursor: pointer;
  width: 28px;
  height: 28px;
  background: none;
  border: none;
  padding: 0;
}
.ir-nav__toggle.nd-toggle svg { display: none; }
.ir-nav__toggle.nd-toggle span {
  display: block;
  width: 28px;
  height: 2px;
  background: #1D2327;
  transition: all .25s ease;
}

/* ── Slide-in mobile menu ────────────────────────────────────────────────── */
.nd-mobile-menu {
  display: flex;
  position: fixed;
  inset: 0;
  justify-content: flex-end;
  background: rgba(17,17,17,.45);
  z-index: 2000;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s;
}
.nd-mobile-menu.open { opacity: 1; pointer-events: all; }

.nd-mobile-panel {
  width: 320px;
  max-width: 84%;
  height: 100%;
  background: var(--nd-panel);
  display: flex;
  flex-direction: column;
  padding: 22px 22px calc(22px + env(safe-area-inset-bottom, 0px));
  overflow-y: auto;
  transform: translateX(106%);
  transition: transform .44s cubic-bezier(.33,1,.68,1);
}
.nd-mobile-menu.open .nd-mobile-panel { transform: translateX(0); }

.nd-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 22px;
}
.nd-panel-head img { height: 30px; width: auto; }
.nd-close {
  background: none;
  border: none;
  color: #1D2327;
  font-size: 32px;
  cursor: pointer;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.nd-group-label { font-size: 11px; letter-spacing: 1.5px; color: #9a9a9a; margin-bottom: 9px; }
.nd-group { display: flex; flex-direction: column; gap: 11px; margin-bottom: 20px; }
.nd-nav-link {
  color: #1D2327;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  opacity: 0;
  transform: translateX(14px);
  transition: opacity .45s, transform .45s, color .15s, padding-left .15s;
}
.nd-mobile-menu.open .nd-nav-link { opacity: 1; transform: translateX(0); }
.nd-nav-link:hover { color: var(--nd-blue); padding-left: 5px; }

.nd-sep { border-top: 1px solid #E5E7EB; margin: 2px 0 18px; }

.nd-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 13px;
  margin-top: auto;
  padding-top: 6px;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .5s .2s, transform .5s .2s;
}
.nd-mobile-menu.open .nd-brand { opacity: 1; transform: translateY(0); }
.nd-brand-mark img { height: 64px; width: 64px; border-radius: 50%; border: 1px solid #E5E7EB; background: #fff; padding: 4px; }
.nd-tagline { color: #6b7280; font-size: 13px; line-height: 1.5; }
.nd-cta {
  width: 100%;
  background: var(--nd-blue);
  color: #fff;
  font-weight: 500;
  padding: 11px;
  border-radius: 8px;
  font-size: 14px;
  text-align: center;
  text-decoration: none;
  box-sizing: border-box;
  transition: background .15s, transform .12s;
}
.nd-cta:hover { background: var(--nd-blue-dark); }
.nd-cta:active { transform: scale(.98); }
.nd-textus {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #6b7280;
  font-size: 13px;
  text-decoration: none;
  transition: color .15s;
}
.nd-textus:hover { color: var(--nd-blue); }
.nd-textus svg { width: 16px; height: 16px; }
.nd-panel-social { display: flex; justify-content: center; align-items: center; gap: 16px; margin-top: 2px; }
.nd-panel-social a { color: #6b7280; display: flex; transition: color .15s; text-decoration: none; }
.nd-panel-social a:hover { color: var(--nd-blue); }
.nd-panel-social svg { width: 18px; height: 18px; }

/* the legacy drawer is superseded */
.ir-nav__drawer { display: none !important; }
