/**
 * VendorPlus core styles — part 1 of 10: Root tokens, resets and base element styles
 *
 * Split from the single 18,135-line vendor-plus.css. The parts are chained as
 * style dependencies and MUST load in numeric order: rules here are overridden
 * by later parts, and 173 selector pairs in this sheet set the same property
 * twice. Reordering the parts changes computed styles.
 *
 * Do not reorder rules between parts. To verify the split is still faithful:
 *     php vendorplus-core/tests/stylesheet-split-guard-test.php
 *
 * Lines 1-909 of the original file.
 */

/**
 * TEMP
 *
 * @format
 */

#vplus-lot-list [type="checkbox"] {
  display: none;
}

:root {
  --gray-300: #dee2e6;
  --vplus-surface-canvas: #f6f7f9;
  /* HUE — the per-area canvas tint is declared ONLY on the .vplus-geo-*
     classes (part 10). Deliberately no :root default: an empty custom-property
     value still counts as SET, so var(--vplus-geo-canvas, fallback) would
     resolve to nothing rather than to the fallback. */
  --vplus-surface-panel: #ffffff;
  --vplus-surface-panel-alt: #f8f9fa;
  --vplus-surface-subtle: #f6f8fb;
  --vplus-border-default: #d9e1ea;
  --vplus-border-strong: #e5eaf0;
  /* Solid in-card divider. Deliberately darker than --vplus-border-default so a
     separator between field groups reads as one; the dashed rules it replaced
     were near-invisible on a white card. */
  --vplus-divider-solid: #adb5bd;
  --vplus-text-primary: #1f2933;
  --vplus-text-secondary: #5f6c7b;
  --vplus-text-muted: #4b5563;
  --vplus-heading-accent: #003566;
  --vplus-link-subtle: #53627a;
  --vplus-accent-text: #0f4c81;
  --vplus-accent-soft: #e8f1fb;
  --vplus-ring-color: rgba(13, 110, 253, 0.18);
  --vplus-info-soft: rgba(13, 110, 253, 0.1);
  --vplus-info-border: rgba(13, 110, 253, 0.24);
  --vplus-info-text: #0f4c81;
  --vplus-warning-soft: rgba(255, 193, 7, 0.12);
  --vplus-warning-border: rgba(255, 193, 7, 0.28);
  --vplus-warning-text: #8a6d1f;
  --vplus-success-soft: rgba(40, 167, 69, 0.14);
  --vplus-success-text: #1f7a35;
  --vplus-danger-soft: rgba(220, 53, 69, 0.14);
  --vplus-danger-text: #b42332;
  /* Motion tokens — shared vocabulary for transitions/animations across the suite. */
  --vplus-motion-fast: 120ms;
  --vplus-motion-base: 180ms;
  --vplus-motion-slow: 280ms;
  --vplus-ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --vplus-ease-in: cubic-bezier(0.55, 0.06, 0.68, 0.19);
  --vplus-ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --vplus-stagger-step: 45ms;
}

b,
strong {
  font-weight: bold;
}

#main {
  padding-top: 1rem;
}

/* BASIC */
small {
  display: inline-block;
}

/* CORE */
@media (max-width: 420px) {
  .hidden-xxs {
    display: none !important;
  }
}

.padding-top-10 {
  padding-top: 10px;
}
.padding-top-20 {
  padding-top: 20px;
}
.padding-bottom-10 {
  padding-bottom: 10px;
}
.padding-bottom-20 {
  padding-bottom: 20px;
}
.hidden {
  display: none;
}
.relative {
  position: relative;
}
.on-top,
.filter-panel.on-top {
  z-index: 999;
}
.disable-link {
  pointer-events: none;
  cursor: default;
}
.grey-text {
  color: #999;
}
.strikethrough {
  text-decoration: line-through;
}
.margin-top-20 {
  margin-top: 20px;
}
.margin-bottom-20 {
  margin-bottom: 20px;
}

.vplus-delete-prompt .btn-block + .btn-block {
  margin-top: 0;
}

/* FORM */
sup.required {
  color: #e84242;
}
input.error {
  color: #e84242;
  background: red;
  border-color: #e84242;
}

#vplus-login {
  width: 100px;
}
/* USER LOGGED IN */
.vplus-login-info {
  text-align: right;
  margin-bottom: 20px;
}
.vplus-login-nav {
  margin-bottom: 20px;
}

/* 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: 20px;
  box-shadow: #ccc 0 3px 5px;
  margin-top: 8px;
  margin-left: -8px;
  width: 100%;
  min-width: 200px;
  z-index: 100;
  opacity: 0.9;
}
th.filter-heading.filter-active {
  background: #fff;
  position: relative;
}
.collapse-all {
  float: right;
}
/* LOT META */
.vplus-status-draft {
  color: #999;
  background: transparent !important;
}
.vplus-status-review {
  color: #f3be1e;
  background: transparent !important;
}
.vplus-status-accepted {
  color: #24b532;
  background: transparent !important;
}
.vplus-status-rejected {
  color: #e84242;
  background: transparent !important;
}
.vplus-status-box {
  line-height: 1;
  display: inline-block;
  padding: 5px 8px;
  border-radius: 3px;
}
.vplus-status-box.vplus-status-draft {
  background-color: #999;
  color: #fff;
}
.vplus-status-box.vplus-status-review {
  background-color: #f3be1e;
  color: #fff;
}
.vplus-status-box.vplus-status-accepted {
  background-color: #24b532;
  color: #fff;
}
.vplus-status-box.vplus-status-rejected {
  background-color: #e84242;
  color: #fff;
}
.vplus-meta-data {
  margin: 40px 0;
}
.vplus-meta-data li {
  line-height: 1.8em;
}
.bid-override {
  color: #c00;
}
/* VP LINKS */
.vplus-link,
.vplus-link:hover,
.vplus-link:focus,
.vplus-link:visited,
.vplus-link:active {
  display: inline-block;
  cursor: pointer;
  text-decoration: none;
}

.vplus-link,
.vplus-link:active {
  transform: scale(1);
}
.vplus-link:hover {
  transform: scale(1.1);
}

/* LOT CATALOGUE */
#vplus-lot-list .table > thead > tr > th {
  vertical-align: top;
}
#vplus-lot-list .table-striped > tbody > tr:nth-of-type(odd) {
  background-color: rgba(200, 200, 200, 0.2);
}
#vplus-lot-list {
  min-height: 200px;
}
/* Actions group — the button row plus the Sync-options caption strip beneath
   it. Kept as a column wrapper so the options can sit UNDER the Sync buttons
   without being a flex sibling of Save Draft (which would stretch it tall). */
.vplus-lot-actions-group {
  display: flex;
  flex-direction: column;
}
#vplus-lot-actions {
  display: flex;
  align-items: stretch;
  flex-direction: row;
}
/* Sync-options caption strip — a flex row that mirrors the button row's column
   widths: a spacer matching the Save Draft button (flex 1), then the options
   panel spanning the two Sync buttons (flex 2), so the panel lands directly
   beneath the Sync actions it applies to. */
.vplus-sync-options-row {
  display: flex;
  gap: 1rem;
}
.vplus-sync-options-row__spacer {
  flex: 1 1 0;
}
/* Inline Sync options (Dashboard Status + Public Visibility). Reads as attached
   to the Sync buttons above: pulled up under them, top corners squared, subtle
   top border removed so it tucks in seamlessly rather than floating as a card. */
/* R5.1 — a COLUMN: the two controls on a centred row, then the hint as a quiet
   centred caption beneath. Previously the long hint sat inline as a 3rd flex child
   and sprawled ~750px wide, unbalancing the panel. */
#vplus-sync-options {
  flex: 2 1 0;
  margin-top: -1px;
  padding: 0.6rem 0.75rem;
  background: #f8f9fa;
  border: 1px solid #e9ecef;
  border-top: 0;
  border-radius: 0 0 0.5rem 0.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
}
#vplus-sync-options .vplus-sync-options__controls {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  align-items: flex-end;
}
#vplus-sync-options .vplus-sync-options__field {
  display: flex;
  flex-direction: column;
}
#vplus-sync-options .vplus-sync-options__field .form-select {
  min-width: 9rem;
}
/* Match the visibility toggle's height to the status <select> so the two
   controls sit on one baseline (btn-sm and form-select-sm differ by a couple
   of px otherwise, throwing the row off-balance). */
#vplus-sync-options .vplus-sync-option-visibility {
  min-height: calc(1.5em + 0.5rem + 2px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
#vplus-sync-options .vplus-sync-options__hint {
  text-align: center;
}
/* R5.2 — "Current Status / Visibility" line beneath each control (synced lots). */
#vplus-sync-options .vplus-sync-options__current {
  margin-top: 0.35rem;
  font-size: 0.75rem;
  color: #667085;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  white-space: nowrap;
}
/* P2 (3.4): below lg, the three action buttons otherwise wrap 2+1 unevenly
   (Save Draft + Sync on row one, Sync & Create orphaned on row two) and the
   sync-options spacer leaves a gap beside the lone button. Stack all three
   actions full-width in one column across the whole tablet+mobile band, drop the
   options spacer, and let the options strip go full-width beneath them. Raised
   from the old 575.98px cut-off so the tablet band (768–991px) gets the clean
   stack instead of the ragged wrap. */
@media (max-width: 991.98px) {
  #vplus-lot-actions {
    flex-direction: column;
  }
  .vplus-sync-options-row__spacer {
    display: none;
  }
  #vplus-sync-options {
    flex: 1 1 100%;
  }
}
.vplus-submission-final-actions {
  display: flex;
  align-items: stretch;
  flex-direction: row;
}
#vplus-submission-splash {
  position: absolute;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 3rem;
  background: rgba(255, 255, 255, 0.97);
  border-radius: 0.5rem;
}
.vplus-blueflag-heading-icon {
  color: #495057;
}
@media (max-width: 767.98px) {
  /* #vplus-lot-actions is stacked across the whole tablet+mobile band by the
     P2 (3.4) rule above (max-width: 991.98px) — no longer needed here. */
  .vplus-submission-final-actions {
    flex-direction: column !important;
  }
  /* CN2 — the submission form's action row (Back + final actions) is a bare
     .d-flex.justify-content-between.flex-wrap inside .vplus-form-actions. On
     mobile justify-content-between + flex-wrap left the two groups side-by-side
     and wrapped them to ~50% each, so the buttons looked clamped. Stack the row
     and stretch every button to full width. */
  .vplus-form-actions > .d-flex {
    flex-direction: column;
    align-items: stretch !important;
  }
  .vplus-form-actions > .d-flex > .btn,
  .vplus-submission-final-actions {
    width: 100%;
  }
  .vplus-submission-final-actions > .btn {
    width: 100%;
  }
}

.vplus-gallery-main .swiper-slide {
  position: relative;
}

.vplus-gallery-slide-label {
  position: absolute;
  left: 0.75rem;
  bottom: 0.75rem;
  z-index: 3;
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  background: rgba(17, 24, 39, 0.78);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 600;
}

.table-heading th a {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}
.table-heading th [data-filter] {
  cursor: pointer;
  transform: scale(1);
}
.table-heading th [data-filter]:hover {
  transform: scale(1.1);
  color: #2272b9;
}
.no-results {
  padding: 50px 0;
}
/* LOT TABLE JS LOADING */
.table-loading {
  position: relative;
}
.table-loading tbody {
  opacity: 0.5;
}
.table-loading:before {
  content: "";
  position: absolute;
  border: 3px dotted #2272b9;
  z-index: 1000;
  margin-left: -15px;
  margin-top: -15px;
  height: 30px;
  width: 30px;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  z-index: 1000;
  animation: dashicons-spin 5s linear infinite;
}

/* MESSAGE BOX (for logs) */
.log-box {
  margin-top: 5px;
}
.log-box.log-box ul {
  margin-top: 10px;
  margin-bottom: 10px;
}
.message-box + .log-box {
  margin-top: 10px;
}
ul.text-status {
  color: #31708f;
  background-color: #d9edf7;
  border-color: #bce8f1;
}
ul.text-error {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442;
}
ul.text-warning {
  color: #8a6d3b;
  background-color: #fcf8e3;
  border-color: #faebcc;
}
ul.text-success {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}
ul.text-status,
ul.text-error,
ul.text-warning,
ul.text-success {
  padding: 15px 0 15px 30px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 0;
  list-style-type: circle;
  list-style-position: outside;
}

/* VP BUTTON NAVIGATION */
.vplus-navigation-bar {
  text-align: center;
  margin-bottom: 40px;
}
.vplus-navigation-bar a {
  width: 120px;
}
/* AJAX STYLES */
.deleting {
  background: pink;
}

/* PAGINATION */
.pagination a {
  cursor: pointer;
}

/* JQUERY UPLOAD DROPZONE */
#dropzone {
  text-align: center;
  font-size: 3rem;
}
@media (min-width: 450px) {
  #dropzone {
    padding: 0;
    background: #eee;
    border: 1px dashed var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    width: 100%;
    height: 250px;
    line-height: 250px;
    text-align: center;
    font-weight: bold;
    font-size: 4rem;
  }
}
@media (max-width: 449px) {
  #dropzone .fileinput-container {
    transform: scale(0.8);
  }
}
#dropzone .fileinput-container {
  line-height: 1;
  display: inline-block;
  vertical-align: middle;
}
#dropzone .fileinput-button {
  vertical-align: top;
  color: #0073aa;
}
#dropzone .fileinput-button.disabled {
  vertical-align: top;
  color: #ccc;
}
#dropzone.hover {
  background: #d9edf3;
}
#dropzone.fade {
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  opacity: 1;
}

/* MEDIA OPTIONS */
.vplus-media-files {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, 1fr);
}

@media (min-width: 576px) {
  .vplus-media-files {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 768px) {
  .vplus-media-files {
    grid-template-columns: repeat(5, 1fr);
  }
}

@media (min-width: 992px) {
  .vplus-media-files {
    grid-template-columns: repeat(8, 1fr);
  }
}
/*.vplus-media-option,
.vplus-media-option:visited {
padding:5px;
text-decoration: none;
border-radius: 50%;
background:rgba(255,255,255,0.8);
box-shadow: #ccc 0 2px 2px;
}*/
/*.vplus-media-files .vplus-media-option {
position: absolute;
width: auto;
height: auto;
padding: 5px;
border-radius: 50%;
background: #fff;
box-shadow: #ccc 0 2px 2px;
}
.vplus-media-files .image-box .vplus-media-option {
top: -5px;
}
.vplus-media-option:hover,
.vplus-media-option:focus {
text-decoration: none;
cursor: pointer;
transform: scale(1.1);
}

.vplus-media-option:active {
text-decoration: none;
transform: scale(1);
}*/
.vplus-media-option.disabled.disabled {
  color: #ccc;
}
.attachment-container:nth-child(even) .file-item {
  background-color: #eee;
}
.vplus-media-files .image-box {
  border: 1px solid #ccc;
  border-radius: 0.5rem;
  overflow: hidden;
}
/* Pending upload tiles start with a 1x1 transparent placeholder (the small
   downscaled preview / server thumbnail swaps in async). Hold a stable square
   so the tile doesn't collapse to a 1px sliver and jump when the image loads. */
.vplus-media-files .vplus-file-container .image-box {
  aspect-ratio: 1 / 1;
  background-color: #f3f4f6;
}
.vplus-media-files .vplus-file-container .image-box .photo,
.vplus-media-files .vplus-file-container .image-box .photo img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.vplus-media-files .vplus-file-container {
  overflow: visible;
}
.vplus-media-files .file-item {
  padding: 10px;
}
.vplus-media-files .file-radio {
  cursor: pointer;
}
.vplus-media-files .image-box .preview-link {
  left: -5px;
}
/*.delete-link {
color: #e84242;
}
.delete-link:hover {
color: #dc3636;
}*/
/*.vplus-media-files .image-box .delete-link {
right: -5px;
}*/
.vplus-media-files .file-item .file-date {
  position: absolute;
  right: 100px;
  text-align: right;
}
.vplus-media-files .file-item .log-link {
  right: 50px;
  top: 4px;
  padding: 5px;
}
.vplus-media-files .file-item .delete-link {
  top: 4px;
  right: 10px;
}
/*.vplus-media-files .delete-prompt {
width: 100%;
height:100%;
background-color: rgba(0,0,0,0.4);
position: absolute;
z-index: 5;
top: 0;
left: 0;
}*/
/*.vplus-media-files .delete-yes,
.vplus-media-files .delete-no {
border-radius: 50%;
background: #fff;
box-shadow: #666 0 2px 2px;
width: auto;
height:auto;
position: absolute;
}
.vplus-media-files .delete-no:hover,
.vplus-media-files .delete-yes:hover,
.vplus-media-files .delete-no:active,
.vplus-media-files .delete-yes:active {
cursor: pointer;
transform: scale(1.1);
}
.vplus-media-files .delete-yes.dashicons-admin-generic {
padding: 10px 14px;
color: #666;
}
.vplus-media-files .delete-yes {
color: #e84242;
}
.vplus-media-files .image-box .delete-no {
position: absolute;
right: -5px;
top: -5px;
color: #e84242;
padding: 5px;
}
.vplus-media-files .file-item .delete-no {
top: 4px;
right: 10px;
padding: 5px;
}*/
.vplus-media-files .file-item .delete-yes {
  top: 4px;
  right: 50px;
  padding: 5px;
}
.vplus-media-files .image-box .delete-yes {
  top: 50%;
  left: 50%;
  font-size: 4em;
  margin-left: -38px;
  margin-top: -38px;
  padding: 10px;
}
.vplus-media-files .image-box .message-box {
  text-align: center;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 100;
  opacity: 0.85;
}
.vplus-media-files .image-box .message-box .text-danger {
  background: #a94442;
  color: #fff;
}
.vplus-media-files .image-box .photo img {
  width: 100%;
  height: auto;
  display: block;
}
.vplus-media-files .file-item .icon {
  margin: 0 0 0 5px;
}
.vplus-media-files .image-box .file-name {
  position: absolute;
  bottom: 0;
  text-align: center;
  font-size: 0.8em;
  line-height: 1;
  width: 100%;
  padding: 15px 5px;
  z-index: 2;
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
}
.vplus-media-files .image-box .vplus-set-default {
  position: absolute;
  bottom: 5px;
  right: 5px;
  z-index: 99;
}
.progress {
  position: relative;
  width: 100%;
  height: 12px;
  border-radius: 2px;
  top: auto;
  bottom: 0;
  background: rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.progress .progress-bar {
  background-color: #22c55e;
  height: 100%;
  border-radius: 2px;
  transition: width 0.3s ease;
}

.image-box > .progress,
.relative.image-box > .progress,
.vplus-media-files .image-box > .progress,
.vplus-file-container .image-box > .progress {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}

.vplus-image-container {
  border-radius: 0.5rem;
}
.vplus-image-container[data-deleted="true"] .vplus-media-option .delete-state {
  display: none;
}
.vplus-image-container[data-deleted="false"]
  .vplus-media-option
  .un-delete-state {
  display: none;
}
.vplus-image-container[data-deleted="true"] .photo img {
  opacity: 0.5;
  transition: opacity 0.25s ease-in;
}
.vplus-primary-image {
  position: absolute;
  top: 1px;
  margin-left: 1px;
  font-size: 1.4rem;
  padding: 0.5rem 1rem;
  border-radius: 0 0 5px 0;
}

/* 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: 300px;
  }
}
/* TINY MCE - CUSTOM */
#vplus-vendor-lot-form .wp-editor-container {
  border: 1px solid #ddd;
  border-radius: 3px 0 3px 3px;
  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;
}

/* ANIMATIONS */
@-webkit-keyframes dashicons-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes dashicons-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

.vplus-set-default .vplus-check-bg {
  color: #fff;
}
.vplus-set-default .vplus-check-border {
  color: #000;
}
.vplus-set-default .vplus-check {
  color: #ccc;
}
.vplus-set-default.vplus-checked .vplus-check-border {
  color: gold;
}
.vplus-set-default.vplus-checked .vplus-check-bg {
  color: #e08e20;
}
.vplus-set-default.vplus-checked .vplus-check {
  color: gold;
  display: inline-block;
}

.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: 14px;
  height: 14px;
  display: inline-block;
  vertical-align: text-top;
  margin-right: 5px;
  opacity: 0;
  border-radius: 3px;
}
