/* ===============================
   Hide member / login icon
   =============================== */
.member.icon-button {
    display: none !important;
}

/* ===============================
   Related Posts – Center Style
   =============================== */
.related-center-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Each related post */
.related-center-wrapper .post {
    text-align: center;
    margin: 0 auto;
    max-width: 420px;           /* better readability */
    padding: 12px 0;
    border-bottom: 1px solid #eee;
}

/* Remove last border */
.related-center-wrapper .post:last-child {
    border-bottom: none;
}

/* Thumbnail center */
.related-center-wrapper .thumb {
    margin: 0 auto 10px;
}

/* Title stability */
.related-center-wrapper .post-title a {
    display: block;
    white-space: normal;
    word-break: normal;
    overflow-wrap: break-word;
    line-height: 1.4;
}

/* Meta center & stable */
.related-center-wrapper .meta {
    display: inline-flex;        /* 🔥 prevents vertical breaking */
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 12px;
}

/* Meta items inline */
.related-center-wrapper .meta li {
    display: inline-flex;
    align-items: center;
}

/* Dot separator (clean look) */
.related-center-wrapper .meta li:not(:last-child)::after {
    margin-left: 6px;
    color: #1e88e5;
}

/* ===============================
   Featured Image Fix
   =============================== */
.img {
    width: 100%;
    display: block;             /* remove inline gap */
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}
/* =====================================================
   Mobile View – Bottom Floating Language Switcher
   ===================================================== */
@media (max-width: 767px) {

  .language-switcher-button {
      position: fixed !important;
      left: 50%;
      bottom: calc(28px + env(safe-area-inset-bottom));
      transform: translateX(-50%);
      float: none !important;

      display: block !important;
      z-index: 9999;
      touch-action: manipulation;

  }

  .language-switcher-button .dropdown {
      display: block !important;
  }

  /* Toggle button */
  .language-switcher-button .dropdown-toggle {
    padding: 1px 10px;
    min-height: 38px;
    border-radius: 22px;

    font-weight: 600;
    font-size: 14px;

    display: flex;
    align-items: center;
    gap: 6px;

    transition:
        color .3s ease,
        background-color .3s ease,
        box-shadow .3s ease,
        transform .15s ease;
}

/* tap feedback */
.language-switcher-button .dropdown-toggle:active {
    transform: scale(0.96);
}


  /* Dropdown menu (opens upward) */
  .language-switcher-button .dropdown-menu {
      top: auto !important;
      bottom: 120%;
      left: 50%;
      transform: translateX(-50%) translateY(8px);

      opacity: 0;
      visibility: hidden;
      pointer-events: none;

      border-radius: 14px;
      box-shadow: 0 10px 22px rgba(0,0,0,0.35);

      display: block;
      transition: all 0.2s ease;
  }

  .language-switcher-button .dropdown-menu.show {
      opacity: 1;
      visibility: visible;
      transform: translateX(-50%) translateY(0);
      pointer-events: auto;
  }

  /* IMPORTANT: prevent text overlap at page end */
  body {
      padding-bottom: 120px;
  }
}

/* =====================================================
   Dark Mode – Language Switcher (Mobile + Desktop)
   ===================================================== */

.dark-mode .language-switcher-button .dropdown-toggle {
    background: rgba(255, 255, 255, 0.08);   /* soft glass */
    color: #1c1818;
    border-radius: 22px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.8);
}

/* Flag visibility */
.dark-mode .language-switcher-button .dropdown-toggle img.flag {
    filter: brightness(1.15);
}

/* Dropdown menu */
.dark-mode .language-switcher-button .dropdown-menu {
    background: #181818;
    border: 1px solid #2a2a2a;
    border-radius: 14px;
    box-shadow: 0 12px 26px rgba(0,0,0,0.9);
}

/* Dropdown items */
.dark-mode .language-switcher-button .dropdown-item {
    color: #eaeaea;
    font-weight: 600;
}

/* Hover */
.dark-mode .language-switcher-button .dropdown-item:hover {
    background: #262626;
}

[data-theme="light"] .language-switcher-button .dropdown-toggle,
.language-switcher-button .dropdown-toggle {
    background-color: #ffffff;   /* solid readable */
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.25);

    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
[data-theme="dark"] .language-switcher-button .dropdown-toggle {
    background-color: rgba(255, 255, 255, 0.08);
    color: #f1f1f1;
    box-shadow: 0 8px 24px rgba(0,0,0,0.8);

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.meta {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;
}