/* OrgMan overrides scoped here */
.wrapper:has(.wicket-orgman),
.wicket-acc-container:has(.wicket-orgman) {
  /* Layout Fix: Side-by-side on desktop (lg: 1024px) - SCOPED TO ORGMAN */
  @media (min-width: 1024px) {
    & {
      display: flex !important;
      flex-direction: row !important;
      flex-wrap: nowrap !important;
      gap: 3rem !important;
      align-items: flex-start !important;
      justify-content: space-between !important;
      max-width: 1440px !important;
      margin: 0 auto !important;
      width: 100% !important;
    }

    /* Content Area: Take remaining space */
    & > .wicket-acc-page-acc,
    & > .woocommerce-wicket--account-centre {
      flex: 1 !important;
      min-width: 0 !important;
      max-width: none !important;
      order: 1 !important;
    }

    /* Sidebar Area: Fixed width */
    & > .myaccount-nav {
      flex: 0 0 320px !important;
      width: 320px !important;
      max-width: 320px !important;
      min-width: 0 !important;
      position: sticky !important;
      top: 2rem !important;
      order: 2 !important;
    }

    /* Hide mobile-specific navigation elements on desktop ONLY IN ORGMAN */
    .myaccount-nav-mobile,
    .dropdown__toggle--nav,
    .dropdown__button--nav {
      display: none !important;
    }
  }

  /* Force internal elements to fill the expanded area - Desktop Only */
  @media (min-width: 1024px) {
    .wicket-orgman,
    .org-management-app,
    .wicket-acc-page {
      width: 100% !important;
      max-width: none !important;
      box-sizing: border-box !important;
    }
  }

  /* Force Mobile Navigation behavior on OrgMan pages */
  @media (max-width: 1023px) {
    .myaccount-nav:not(.myaccount-nav-mobile) {
      display: none !important;
    }

    .myaccount-nav-mobile {
      display: block !important;
      position: fixed !important;
      bottom: 0 !important;
      left: 0 !important;
      width: 100% !important;
      z-index: 9999 !important;
      background: #fff !important;
      border-top: 1px solid #ddd !important;
      margin: 0 !important;
      padding: 0 !important;

      .dropdown__toggle--nav {
        display: block !important;
        padding: 2rem 1.5rem 0.75rem !important;
        color: #000 !important;
        text-transform: uppercase !important;
        font-family: "Playfair Display", serif !important;
        font-weight: 400 !important;
        font-size: 19.2px !important;
        text-decoration: none !important;
        width: 100% !important;
        box-sizing: border-box !important;
        line-height: normal !important;
        -webkit-font-smoothing: antialiased !important;
        text-rendering: optimizelegibility !important;

        i {
          display: none !important;
        }
      }

      .dropdown__content--nav {
        background: #fff !important;
        border: none !important;
        padding: 0 1.5rem 3rem !important;

        .wicket-acc-menu-mobile {
          padding: 0 !important;
          margin: 0 !important;
          list-style: none !important;

          li {
            list-style: none !important;
            margin: 5px 0 !important; /* Margin top/bottom 5px */
            padding: 0 !important;
            border-bottom: none !important; /* spec says border-bottom-style: none */
            display: block !important;
            height: 44px; /* spec height */

            .dropdown__toggle--menu,
            .nav__menu-link,
            & > a {
              display: flex !important;
              align-items: center !important;
              justify-content: space-between !important;
              width: 100% !important;
              height: 44px !important; /* Match li height */
              padding: 0 !important;
              color: #000 !important;
              font-family: Poppins, sans-serif !important;
              font-weight: 400 !important; /* spec 400 */
              font-size: 16px !important; /* spec 16px */
              line-height: 25.6px !important; /* spec 25.6px */
              text-decoration: none !important;
              background: none !important;
              border: none !important;
              text-align: left !important;
              box-shadow: none !important;
              -webkit-font-smoothing: antialiased !important;

              i {
                font-size: 0.8rem !important;
                color: #000 !important;
                transition: transform 0.3s ease !important;
              }

              &.open i {
                transform: rotate(180deg) !important;
              }
            }

            .nav__submenu {
              display: none; /* Collapsed by default */
              padding: 0 0 0 1.15rem !important; /* Indentation */

              .sub-menu {
                padding: 0 !important;
                margin: 0 !important;
                list-style: none !important;

                li {
                  border: none !important;
                  margin: 5px 0 !important;
                  height: 35.5px !important;
                  display: block !important;

                  a {
                    display: block !important;
                    padding: 0 !important;
                    color: #111 !important;
                    font-family: Poppins, sans-serif !important;
                    font-size: 16px !important;
                    line-height: 25.6px !important;
                    text-decoration: none !important;
                    font-weight: 400 !important;
                    -webkit-font-smoothing: antialiased !important;

                    &:hover {
                      color: #000 !important;
                    }

                    /* Handle external link icon */
                    i {
                        font-size: 0.8em !important;
                        margin-left: 0.25rem !important;
                        display: inline-block !important;
                    }
                  }

                  &.current-menu-item a {
                    font-weight: 700 !important;
                    text-decoration: none !important;
                  }
                }
              }
            }

            /* Show when open */
            &.open > .nav__submenu,
            &.current-menu-item > .nav__submenu,
            &.current-menu-ancestor > .nav__submenu {
              display: block !important;
            }
          }
        }
      }
    }
  }

  .wicket-acc-container {
    padding-top: 0;
  }
}

.wicket-orgman {
  .members-search {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
  }

  .members-search__field {
    flex: 1 1 auto;
    position: relative;
    display: flex;
    align-items: center;
  }

  .members-search__input {
    height: 44px;
    min-height: 44px;
    padding: 0 1rem 0 2.5rem;
    margin: 0;
    box-sizing: border-box;
    line-height: 1;
  }

  .members-search__icon {
    position: absolute;
    left: 0.75rem;
    display: flex;
    align-items: center;
    pointer-events: none;
    z-index: 2;
  }

  .members-search__actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .members-search__actions .button {
    height: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.25rem;
    margin: 0;
    line-height: 1;
    box-sizing: border-box;
    border-radius: 55px;
  }

  /* Rounded buttons for all actions and pagination */
  .button,
  .button--primary,
  .button--secondary,
  .members-pagination__btn,
  .edit-permissions-button,
  .remove-member-button,
  .add-member-button {
    border-radius: 55px !important;
  }

  /* Member card alignment and sizing */
  .member-card .edit-permissions-button,
  .member-card .remove-member-button {
    justify-content: center;
  }

  /* Member card buttons alignment */
  .member-card .sm\:wt\:flex-row,
  .member-card .wt\:flex.wt\:flex-col.sm\:wt\:flex-row {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
  }

  @media (min-width: 640px) {
    .member-card .sm\:wt\:flex-row,
    .member-card .wt\:flex.wt\:flex-col.sm\:wt\:flex-row {
      flex-direction: row;
      align-items: center;
    }
  }

  /* Organization Details Card & Actions */
  .org-details {
    margin-bottom: 2rem;

    .org-details__action-link,
    a.org-details__action-link {
        color: #111 !important;
        text-decoration-color: #ddd !important;

        &:hover {
          color: #000 !important;
          text-decoration-color: #111 !important;
        }
    }

    .org-details__divider,
    div.org-details__divider {
        border-color: #111 !important;
        border-bottom-color: #111 !important;
    }
  }

  .acc-remove-button {
    margin-left: 0;
  }

  /* Mutually exclusive Search/Clear visibility toggle */
  /* Search is visible only when input is empty (placeholder shown) */
  .members-search:has(.members-search__input:placeholder-shown) .members-search__submit {
    display: inline-flex;
  }
  .members-search:has(.members-search__input:placeholder-shown) .members-search__clear {
    display: none;
  }
  /* Clear is visible only when input has text (placeholder NOT shown) */
  .members-search:has(.members-search__input:not(:placeholder-shown)) .members-search__submit {
    display: none;
  }
  .members-search:has(.members-search__input:not(:placeholder-shown)) .members-search__clear {
    display: inline-flex;
  }

}

/* Account Menu Accordion Styling - STRICTLY SCOPED TO ORGMAN PAGES - DESKTOP ONLY */
@media (min-width: 1024px) {
  .wrapper:has(.wicket-orgman) {
    .myaccount-nav__container {
      margin-top: 2rem;
    }

    .myaccount-nav-heading {
      margin-top: 0 !important;
      border-bottom: none !important;
      display: block !important;

      a {
        font-family: "Playfair Display", Georgia, serif !important;
        font-size: 19.2px !important;
        text-transform: uppercase !important;
        color: #000 !important;
        text-decoration: none !important;
        font-weight: 400 !important;
        letter-spacing: 0.03em !important;
        line-height: 1.1 !important;
        display: block !important;
      }
    }

    .myaccount-nav .wicket-acc-menu {
      list-style: none !important;
      padding: 0 !important;
      margin: 0 !important;

      li {
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        list-style: none !important;
        position: relative !important;
      }

      /* Toggles & Links - Scoped */
      .dropdown__toggle--menu,
      .nav__menu-link,
      li:not(.menu-item-has-children) > a {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        padding: 1.25rem 0 !important;
        background: transparent !important;
        border: none !important;
        border-bottom: 1px solid #eee !important;
        color: #000 !important;
        font-weight: 700 !important;
        font-size: 14px !important;
        cursor: pointer !important;
        text-align: left !important;
        font-family: inherit !important;
        transition: all 0.2s ease !important;
        text-decoration: none !important;

        &:hover {
          color: var(--om-text-interactive, #0056b3) !important;
        }

        /* Icons/Carets */
        i, &::after {
          font-size: 0.875rem !important;
          transition: transform 0.3s ease !important;
          margin-left: 1rem !important;
        }

        &.open i {
          transform: rotate(180deg) !important;
        }
      }

      /* Submenu container - Scoped */
      .nav__submenu {
        display: none;
        padding: 0.5rem 0 1.5rem 0 !important;

        .sub-menu {
          list-style: none !important;
          padding: 0 !important;
          margin: 0 !important;

          li {
            a {
              display: block !important;
              padding: 0.75rem 0 !important;
              color: #444 !important;
              text-decoration: none !important;
              font-size: 14px !important;
              font-weight: 400 !important;
              transition: color 0.2s ease !important;
              border-bottom: none !important;

              &:hover {
                color: var(--om-text-interactive, #0056b3) !important;
              }
            }

            &.current-menu-item a {
              font-weight: 700 !important;
              color: #000 !important;
            }
          }
        }
      }
    }
  }
}
