/* Wrapper matches content width */
.text-size-controls-wrapper {
    max-width: 700px;        /* match your theme’s content width */
    margin: 0 auto;           /* center wrapper */
    padding: 0 15px;          /* optional: match content padding */
}

/* Text Resize Controls */
.text-size-controls {
    display: flex;
    justify-content: flex-end;  /* align buttons to right edge of content */
    align-items: center;
    gap: 6px;
    padding: 4px 0;
    font-size: 14px;
    position: relative;          /* relative to wrapper */
    z-index: 1000;
    top: 2em;
}

/* Label styling */
.text-size-controls .label {
    margin-right: 6px;
    font-weight: normal;
}

/* Buttons styling */
.text-size-controls button {
    font-size: 12px;
    padding: 2px 6px;
    border: 1px solid #ccc;
    background: #f4f4f4;
    cursor: pointer;
    border-radius: 3px;
    line-height: 1;
    transition: background 0.2s, color 0.2s;
}
.post-nav.top .prev,
.post-nav.top .next {
    margin-top: -1em !important;  /* if links themselves add extra spacing */
    margin-bottom: 0 !important;
}

/* Hover */
.text-size-controls button:hover:not(:disabled) {
    background: #e0e0e0;
}

/* Prevent the controls themselves from scaling */
.text-size-controls,
.text-size-controls * {
    font-size: revert !important;
    transform: none !important;
    line-height: normal !important;
}
@media (max-width: 768px) {
   .text-size-controls {
      margin-top: -1.5em !important;
      padding: 6px 8px;
   }
  
  .post-nav.top .prev,
  .post-nav.top .next {
    margin-top: 0 !important;  /* if links themselves add extra spacing */
    margin-bottom: 0 !important;
   }  
}