/* vendorplus-components.css — Filter panel, Bootstrap custom, dashicons, collapse toggle, cards, badges, btn-link-toggle, tab-content, toast, tooltips, user menu, Tom Select, filter bar, list toolbar */

/* =============================================================================
   List toolbar (results-header row above list/table results — per-page, sort)
   ============================================================================= */
.vplus-list-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* SEARCH FORM - FILTER PANEL */
.vplus-js-on .vplus-search-form {
  display: none;
}
.filter-panel * {
  font-weight: normal;
}
.filter-panel.on-top {
  background: rgba(255, 255, 255, 0.9);
  opacity: 1;
}
.filter-panel {
  position: absolute;
  background: #fff;
  padding: 1.25rem;
  box-shadow: #ccc 0 0.1875rem 0.3125rem;
  margin-top: 0.5rem;
  margin-left: -0.5rem;
  width: 100%;
  min-width: 12.5rem;
  z-index: 100;
  opacity: 0.9;
}
th.filter-heading.filter-active {
  background: #fff;
  position: relative;
}
.collapse-all {
  float: right;
}

/* BOOTSTRAP - CUSTOM */
.btn-prev {
  position: absolute;
  top: 0;
  left: 0;
}

.popover.popover .row {
  border-bottom: 1px solid #f2f2f2;
}
.popover.popover .row:last-child {
  border-bottom: 0;
}

@media (min-width: 420px) {
  .popover.popover {
    max-width: max-content;
  }
  .popover.popover .row {
    width: 18.75rem;
  }
}

/* TINY MCE - CUSTOM */
#vplus-vendor-item-form .wp-editor-container {
  border: 1px solid #ddd;
  border-radius: 0.1875rem 0 0.1875rem 0.1875rem;
  overflow: hidden;
}

/* DASHICONS - CUSTOM */
.dashicons-filter-small {
  font-size: 1em;
  line-height: 1.2em;
}
.dashicons-spin {
  -webkit-animation: dashicons-spin 2s infinite linear;
  animation: dashicons-spin 2s infinite linear;
}


.table > tbody > tr.header-row > td {
  vertical-align: bottom;
}
.table > tbody > tr > td > * {
  vertical-align: middle;
}
.table > tbody > tr:last-child > td {
  border-bottom: 0;
}

.chart-legend-box {
  width: 0.875rem;
  height: 0.875rem;
  display: inline-block;
  vertical-align: text-top;
  margin-right: 0.3125rem;
  opacity: 0;
  border-radius: 0.1875rem;
}

.vplus-badge {
  cursor: pointer;
}

.badge-lighter {
  background: #e9eef6;
  color: var(--bs-gray-800);
}

.btn-collapse-toggle {
  padding: 0 1rem;
  color: #666;
}
.btn-collapse-toggle:not(.collapsed) span[class*="fa-"] {
  transform: rotate(180deg);
}
.btn-collapse-toggle:focus {
  outline: none;
  border-color: transparent;
  background: #f5f5f5;
}
.card {
  margin-bottom: 1rem;
}
.card h5 {
  color: #6b6b6b;
  font-size: var(--bs-body-font-size);
  text-transform: uppercase;
  font-weight: bold;
  margin: 0;
}
.card-body + .card-body.collapse,
.card-body + .card-body.collapsing {
  padding-top: 0;
}
.card-body > .row {
  row-gap: 1rem;
}
.card-body p:last-child {
  margin-bottom: 0;
}

.alert p:last-child {
  margin-bottom: 0;
}

.btn-link-toggle {
  padding: 0 0.5rem;
  line-height: 1rem;
}

.btn-link-toggle + .collapsing {
  transition: all 0.3s ease-in;
}
.btn-link-toggle + .collapse {
  margin-top: 0;
}
.btn-link-toggle + .collapse.show,
.btn-link-toggle + .collapsing {
  margin-top: 1rem;
}
.btn-link-toggle:focus,
.btn-link-toggle:active {
  outline: none;
  --bs-btn-active-border-color: transparent;
}
.btn-link-toggle[aria-expanded="false"] .fa-toggle-large-on {
  display: none;
}
.btn-link-toggle[aria-expanded="true"] .fa-toggle-large-off {
  display: none;
}

.card-body .tab-content {
  padding: 1rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0 0 var(--bs-border-radius) var(--bs-border-radius);
  border-top: 0;
}

.card-body .row {
  row-gap: 1rem;
}

.card-body .row:has(.form-row) {
  row-gap: 0;
}

.toast-close.toast-close {
  position: absolute;
  top: 0.25rem;
  right: 0.25rem;
  font-size: var(--bs-body-font-size-sm);
}

@media (max-width: 575px) {
  .toastify {
    font-size: var(--bs-body-font-size);
  }
}

.vplus-dev-info-tooltip {
  position: relative;
  display: inline-block;
}

.vplus-dev-info-tooltip .vplus-dev-tooltip-text {
  visibility: hidden;
  width: 17.5rem;
  background-color: #333;
  color: #fff;
  text-align: left;
  border-radius: 0.375rem;
  padding: 0.625rem;
  position: absolute;
  z-index: 1000;
  bottom: 125%;
  left: 50%;
  margin-left: -8.75rem;
  opacity: 0;
  transition: opacity 0.3s;
  font-size: var(--bs-body-font-size);
  font-weight: normal;
  line-height: 1.4;
  box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.2);
  text-transform: none;
}

.vplus-dev-info-tooltip .vplus-dev-tooltip-text::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -0.3125rem;
  border-width: 0.3125rem;
  border-style: solid;
  border-color: #333 transparent transparent transparent;
}

.vplus-dev-info-tooltip:hover .vplus-dev-tooltip-text {
  visibility: visible;
  opacity: 1;
}

.dev-notice-badge {
  background-color: var(--bs-warning-bg);
  color: var(--bs-warning-text);
  border: 1px solid var(--bs-warning-border-subtle);
  font-weight: var(--vplus-font-weight-normal);
  margin-right: 0.5rem;
  margin-bottom: 0.5rem;
}

.vplus-info-tooltip {
  position: relative;
  display: inline-block;
  margin-left: 0.3125rem;
}

.vplus-info-tooltip .fal {
  cursor: help;
  font-size: var(--bs-body-font-size);
  color: #6c757d;
}

.vplus-info-tooltip .vplus-tooltip-text {
  visibility: hidden;
  width: 17.5rem;
  background-color: #333;
  color: #fff;
  text-align: left;
  border-radius: 0.375rem;
  padding: 0.625rem;
  position: absolute;
  z-index: 1000;
  bottom: 125%;
  left: 50%;
  margin-left: -8.75rem;
  opacity: 0;
  transition: opacity 0.3s;
  font-size: var(--bs-body-font-size);
  font-weight: normal;
  line-height: 1.4;
  box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.2);
  pointer-events: none;
  text-transform: none;
}

.vplus-info-tooltip .vplus-tooltip-text::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -0.3125rem;
  border-width: 0.3125rem;
  border-style: solid;
  border-color: #333 transparent transparent transparent;
}

.vplus-info-tooltip:hover .vplus-tooltip-text {
  visibility: visible;
  opacity: 1;
}

.auction-nav .nav-item:has(.vplus-user-menu-btn) {
  display: flex;
  align-items: center;
}

.auction-nav .nav-link {
  --bs-nav-link-padding-x: .5rem;
  --bs-nav-link-padding-y: .25rem;
}

.auction-nav .nav-link.active {
  color: var(--bs-primary);
  font-weight: var(--vplus-font-weight-semibold);
  border: 1px solid rgba(var(--bs-primary-rgb), .5);
  border-radius: var(--bs-border-radius);
}

.auction-nav .dropdown-menu .dropdown-item.active,
.auction-nav .dropdown-menu .dropdown-item:active {
  background-color: rgba(26, 53, 112, 0.12);
  color: var(--bs-primary);
}

.vplus-user-menu-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  padding: 0.5rem;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(0,0,0,0.09);
  border-radius: 2rem;
  font-size: var(--bs-body-font-size);
  font-weight: 500;
  line-height: 1;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
  max-width: 14rem;
  white-space: nowrap;
}
.vplus-user-menu-btn:hover {
  background: #fff;
  border-color: rgba(0,0,0,0.16);
  box-shadow: 0 1px 0.1875rem rgba(0,0,0,0.08);
}
.vplus-user-menu-btn.show,
.vplus-user-menu-btn[aria-expanded="true"] {
  background: #fff;
  border-color: rgba(0,0,0,0.18);
  box-shadow: 0 1px 0.1875rem rgba(0,0,0,0.1);
}
.vplus-user-menu-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--bs-body-font-size);
  color: #6c757d;
  flex-shrink: 0;
}
.vplus-user-menu-name {
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  min-width: 0;
}
.vplus-user-menu-caret {
  font-size: 0.5rem;
  color: #6c757d;
  flex-shrink: 0;
  transition: transform 0.2s;
}
.vplus-user-menu-btn[aria-expanded="true"] .vplus-user-menu-caret {
  transform: rotate(180deg);
}

.vplus-user-menu-btn + .dropdown-menu {
  padding: 0;
}
.vplus-user-menu-btn + .dropdown-menu .dropdown-divider {
  margin: 0;
}
.vplus-user-menu-btn + .dropdown-menu .dropdown-item {
  padding: 0.5rem 1rem;
  font-size: var(--bs-body-font-size);
  color: #2c3338;
}

