/* Dynamic theme using pyramid portfolio colors */
:root {
  --pyramid-orange: #ff6b35;
  --pyramid-amber: #f7931e;
  --pyramid-yellow: #ffd100;
  --pyramid-green: #90ee02;
  --pyramid-teal: #00d4aa;
  --pyramid-blue: #0099cc;
  --pyramid-purple: #951b81;
}

/* Black background override */
[data-md-color-scheme="slate"] {
  --md-default-bg-color: #000000;
  --md-default-bg-color--light: #000000;
  --md-default-bg-color--lighter: #111111;
  --md-default-bg-color--lightest: #1a1a1a;
  --md-primary-fg-color: #1877F2;
  --md-primary-fg-color--light: #1877F2;
  --md-primary-fg-color--dark: #0e5fc7;
}

/* Bold H1 titles */
.md-typeset h1 {
  font-weight: bold;
}

/* Override all content links to Facebook blue */
.md-typeset a {
  color: #1877F2;
}

.md-typeset a:hover {
  color: #0e5fc7;
}

/* Static professional header color - Meta/Facebook blue */
.md-header {
  background-color: rgba(24, 119, 242, 0.6);
}

/* Mobile navigation drawer background */
.md-nav--primary {
  background-color: rgba(24, 119, 242, 0.6);
}

.md-nav--primary .md-nav__title {
  background-color: rgba(24, 119, 242, 0.6);
}

.md-header[data-md-state="shadow"] {
  background-color: rgba(24, 119, 242, 0.6);
}

.md-tabs {
  background-color: rgba(24, 119, 242, 0.6);
}

/* Mobile hamburger menu icon color */
.md-header__button.md-icon {
  color: #1877F2;
}

.md-header__button.md-icon svg {
  fill: #1877F2;
}

/* Navigation accent color */
.md-nav__link--active, .md-nav__link:hover {
  color: #1877F2;
}


/* Hide primary sidebar on desktop, keep for mobile */
@media (min-width: 76.25em) {
  .md-sidebar--primary {
    display: none;
  }

  .md-main__inner {
    display: block;
    margin: 0;
    padding: 0;
    max-width: none;
  }

  .md-content {
    margin: 0 auto;
    max-width: 50%;
    padding: 2rem;
    float: none;
    width: auto;
  }
}

/* Reorder header items: favicon, search, theme toggle */
.md-header__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.md-header__button {
  order: 1;
}

.md-search {
  order: 2;
}

.md-header__option {
  order: 3;
}


/* Replace paragraph markers with wireframe triangles */
.md-typeset .headerlink {
  font-size: 0;
}

.md-typeset .headerlink::after {
  content: "△";
  font-size: 1.2rem;
  opacity: 0.6;
  transition: all 0.3s ease;
  color: #1877F2;
}

.md-typeset .headerlink:hover::after {
  opacity: 1;
}

.md-typeset .headerlink:active::after {
  transform: scale(1.2);
}

/* Fixed width tabs to prevent shifting */
.md-tabs__link {
  min-width: 90px;
  text-align: center;
  display: inline-block;
}

/* Easter egg hover text replacement */
.md-tabs__item:nth-child(2) .md-tabs__link:hover {
  font-size: 0;
}

.md-tabs__item:nth-child(2) .md-tabs__link:hover::after {
  content: "Meat";
  font-size: 0.8rem;
}

.md-tabs__item:nth-child(3) .md-tabs__link:hover {
  font-size: 0;
}

.md-tabs__item:nth-child(3) .md-tabs__link:hover::after {
  content: "Potatoes";
  font-size: 0.8rem;
}

.md-tabs__item:nth-child(4) .md-tabs__link:hover {
  font-size: 0;
}

.md-tabs__item:nth-child(4) .md-tabs__link:hover::after {
  content: "Gravy";
  font-size: 0.8rem;
}

/* Images - responsive height, centered */
.md-content img {
  height: 30vh;
  width: auto;
  max-width: 100%;
  display: block;
  margin: 0 auto;
}

/* Multiple images on same line - inline and centered */
.md-content p:has(img + img) {
  text-align: center;
}

.md-content p:has(img + img) img {
  display: inline-block;
  margin: 0 0.5rem;
  width: 48%;
  height: auto;
}

/* Center linked banner images */
.md-content p:has(a > img) {
  text-align: center;
}

/* Hide site title - show only logo */
.md-header__title {
  display: none;
}

/* Center navigation tabs */
.md-tabs__list {
  justify-content: center;
}


/* Mobile responsive images */
@media (max-width: 768px) {
  .md-content img {
    height: 20vh;
    max-width: 100%;
  }

  .md-content p:has(img + img) img {
    width: 100%;
    display: block;
    margin: 0.5rem auto;
  }
}