/* Ngeblogging Studio UI stability authority v95 */

/* Nara lives only in the permanent assistant widget, never in the left sidebar. */
.sn-side > nav > button[data-nara-sidebar-v95="true"],
.sn-side > nav > button[aria-label="Nara AI"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* The portal-backed Comments row must share the exact menu geometry. */
.sn-side > nav > .sn-comments-nav-host-v93 {
  display: contents !important;
}

@media (max-width: 760px) {
  .sn-side > nav > .sn-comments-nav-host-v93 > .sn-comments-nav-button-v93 {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 0 26px !important;
    gap: 18px !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: transparent !important;
    color: #69788d !important;
    box-shadow: none !important;
    transform: none !important;
    text-align: left !important;
    font-size: 17px !important;
    font-weight: 500 !important;
  }
  .sn-side > nav > .sn-comments-nav-host-v93 > .sn-comments-nav-button-v93.active {
    background: #eaf2ff !important;
    color: #245fc9 !important;
    font-weight: 900 !important;
  }
  .sn-side > nav > .sn-comments-nav-host-v93 > .sn-comments-nav-button-v93 > svg {
    width: 25px !important;
    height: 25px !important;
    margin: 0 !important;
    flex: 0 0 25px !important;
  }
  .sn-side > nav > .sn-comments-nav-host-v93 > .sn-comments-nav-button-v93 > span {
    display: block !important;
    margin: 0 !important;
  }

  /* Comments: one-column, no floating/overlay filter navigation. */
  .csm-page-v93 {
    width: 100% !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    min-height: calc(100dvh - 67px) !important;
    padding: 18px 12px 48px !important;
    overflow-x: hidden !important;
  }
  .csm-title-v93,
  .csm-title-v93 > div:last-child,
  .csm-settings-v93 > header,
  .csm-site-v93,
  .csm-replies-v93 > footer {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .csm-title-v93 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
    margin: 0 0 16px !important;
  }
  .csm-title-v93 h1 {
    margin: 7px 0 6px !important;
    font-size: clamp(32px, 11vw, 46px) !important;
    line-height: 1 !important;
    overflow-wrap: anywhere !important;
  }
  .csm-title-v93 p {
    max-width: 100% !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
  }
  .csm-title-v93 > div:last-child {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  .csm-title-v93 button {
    width: 100% !important;
    min-width: 0 !important;
  }
  .csm-site-v93 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
    padding: 16px !important;
  }
  .csm-site-v93 > i {
    justify-self: start !important;
  }
  .csm-metrics-v93 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  .csm-metrics-v93 article {
    min-width: 0 !important;
    padding: 15px !important;
  }
  .csm-settings-v93 > header {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
    padding: 16px !important;
  }
  .csm-settings-v93 > header > button {
    width: 100% !important;
  }
  .csm-settings-v93 > div {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .csm-toggle-v93 {
    width: 100% !important;
    min-width: 0 !important;
    border-right: 0 !important;
  }
  .csm-workspace-v93 {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  .csm-inbox-v93,
  .csm-detail-v93 {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    border-right: 0 !important;
  }
  .csm-inbox-v93 > header {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px !important;
    background: #fff !important;
    box-shadow: none !important;
  }
  .csm-search-v93 {
    width: 100% !important;
    min-width: 0 !important;
  }
  .csm-inbox-v93 nav {
    position: static !important;
    inset: auto !important;
    z-index: auto !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 10px 0 0 !important;
    padding: 0 0 5px !important;
    gap: 6px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    white-space: nowrap !important;
    -webkit-overflow-scrolling: touch;
  }
  .csm-inbox-v93 nav button {
    position: static !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 0 11px !important;
    border-radius: 10px !important;
    transform: none !important;
  }
  .csm-comment-list-v93 {
    max-height: none !important;
    overflow: visible !important;
  }
  .csm-detail-v93 {
    padding: 16px !important;
    border-top: 1px solid #e3eaf2 !important;
  }
  .csm-detail-v93 > header,
  .csm-person-v93 > div,
  .csm-replies-v93 > footer {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }
  .csm-person-v93 span {
    min-width: 0 !important;
  }
  .csm-actions-v93 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .csm-actions-v93 button,
  .csm-replies-v93 > footer button {
    width: 100% !important;
    justify-content: center !important;
  }

  /* Media: horizontal filters and fluid upload/search/grid. */
  .sn-view-pad:has(> .sn-media-library) {
    width: 100% !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    padding: 18px 12px 48px !important;
    overflow-x: hidden !important;
  }
  .sn-media-library,
  .sn-media-library > *,
  .sn-upload-zone,
  .sn-media-tools,
  .sn-media-grid {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .sn-media-library .sn-page-title {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
  }
  .sn-media-library .sn-page-title h1 {
    font-size: clamp(34px, 12vw, 48px) !important;
    line-height: 1 !important;
  }
  .sn-media-library .sn-page-title p {
    max-width: 100% !important;
    font-size: 14px !important;
    overflow-wrap: anywhere !important;
  }
  .sn-media-library .sn-page-title > button {
    width: 100% !important;
  }
  .sn-upload-zone {
    width: 100% !important;
    padding: 28px 16px !important;
    text-align: center !important;
  }
  .sn-upload-zone h3 {
    font-size: 26px !important;
  }
  .sn-upload-zone p {
    max-width: 100% !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
  }
  .sn-media-tools {
    position: static !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    margin-top: 14px !important;
  }
  .sn-media-tools > label {
    width: 100% !important;
    min-width: 0 !important;
  }
  .sn-media-tools > label input {
    width: 100% !important;
    min-width: 0 !important;
  }
  .sn-media-tools > nav {
    position: static !important;
    inset: auto !important;
    z-index: auto !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 0 5px !important;
    gap: 7px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    white-space: nowrap !important;
    -webkit-overflow-scrolling: touch;
  }
  .sn-media-tools > nav > button {
    position: static !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 0 13px !important;
    border-radius: 999px !important;
    transform: none !important;
  }
  .sn-media-tools > span {
    justify-self: start !important;
  }
  .sn-media-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }
  .sn-media-detail-layer > aside {
    width: min(100%, 100vw) !important;
    max-width: 100vw !important;
  }
}

/* Theme code modal must respect the real desktop sidebar width. */
@media (min-width: 761px) {
  .sn-side:not(.collapsed) + .sn-main .tn-modal-layer {
    left: 220px !important;
    right: 0 !important;
    width: calc(100vw - 220px) !important;
    padding: 14px !important;
  }
  .sn-side.collapsed + .sn-main .tn-modal-layer {
    left: 70px !important;
    right: 0 !important;
    width: calc(100vw - 70px) !important;
    padding: 14px !important;
  }
  .tn-modal.fullscreen {
    width: 100% !important;
    max-width: none !important;
    height: calc(100dvh - 28px) !important;
  }
  .tn-code-workspace,
  .tn-code-pane,
  .tn-code-pane textarea,
  .tn-code-workspace > .tn-frame-shell {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .tn-code-workspace {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr) !important;
  }
}

@media (min-width: 761px) and (max-width: 1150px) {
  .tn-code-workspace {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .tn-code-workspace > .tn-frame-shell {
    display: none !important;
  }
}
