body {
    margin: 0;
    position: absolute;
    top: 50%;
    width: 92%;
    height: 92%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 1.5%;
    font-weight: 400;
    line-height: 1.5;
    border: 1px solid #dee2e6;
    border-radius: 0.3rem;
}

.panel-footer {
    position: absolute;
    bottom: 2rem;
}

.console {
    font-family: "Courier New", Courier, monospace;
    background-color: #000;
    color: #d1cdc7;
    font-size: 0.6rem;
    border-radius: 0.25rem;
    border: 1px solid #383d3f;
    padding: 0.4rem;
    height: 15rem;
    overflow: auto;
    width: 99%;
    margin-top: 9.5rem;
}
.console .OFFER {
    color: #ada79f;
}
.console .INFO {
    color: #979086;
}
.console .WARN {
    color: #ebef02;
}
.console .ERROR {
    color: #cf1c1c;
}

.console-popup-overlay {
    border: none;
}

.console-popup {
    padding: 20px;
    text-align: center;
}

.console-popup p {
    margin: 0;
    margin-bottom: 10px;
}

.console-close-popup-btn {
    background-color: rgb(0, 128, 66);
    border: none;
    font-size: 1rem;
    font-weight: 700;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
}




.module-container {
    display: flex;
    flex-wrap: wrap;
    gap: .625vw;
    max-height: 33vw;
    overflow-y: scroll;
}
.module {
    width: 19%;
    height: 18.45vw;
    border: 2px solid rgb(56, 61, 63);
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: border-color 0.3s ease;
}
.module.selected {
    border-color: green;
}
.module-image {
    position: relative;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 70%;
    min-height: 0;
    background-color: black;
    display: flex;
    justify-content: center;
    align-items: stretch;
    overflow: hidden;
}
.module-image img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.module-content {
    position: absolute;
    bottom: 0;

    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
    /* max-height: 26.5%; */
    /* height: 26.5%; */
    padding: .5vw;
    /* TODO change below */
    overflow-y: auto;
    font-size: .9vw;
    /* line-height: .9vw; */
}
.module-footer {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
    max-height: 32%;
    height: 32%;
    padding: 8px;
    overflow-y: auto;
}
.module-content span {
    background-color: black;
    margin-bottom: 0;
    white-space: pre-line;
}
.module-content h3 {
    /* line-height: 1vw; */
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.module-content p {
    margin-bottom: 0;
    white-space: pre-line
}
.input-group {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: nowrap;
    margin-bottom: 1.33%;
}
.input-group input, .button-group button {
    display: block;
    width: 100%;
    font-size: 0.9vw;
    font-weight: 400;
    /* line-height: 1.5; */
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem !important;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;

    color: rgb(209, 205, 199);
    background-color: hsl(151, 6%, 10%);
    border-color: hsl(151, 6%, 25%);
    padding: 0.375rem 0.25rem;

    width: 45%;
}
.button-group {
    display: flex;
    justify-content: space-evenly;
    line-height: 0;
    height: inherit;
    height: -webkit-fill-available;
}
.button-group, .input-group {
    max-height: 30%;
}
#printSelectedButton {
    margin-top: 20px;
    padding: 10px 20px;
    font-size: 16px;
}
.form-check-input[type=checkbox]:indeterminate {
    background-color: #6c757d;
    border-color: #6c757d;
    border-style: hidden;
}

.wallets-group {
  display: flex;
  align-items: center;
}

.select-pane {
    height: 2.3vw;
    background-color: hsl(151deg, 2.19%, 6.15%);
    color: rgb(232, 230, 227);
    border: 4px solid transparent;
    border-radius: .25rem;
    margin-right: 10px;
    cursor: pointer;
    position: relative;
}

.select-pane.selected {
    border-color: rgb(0, 128, 66);
}

.select-pane.selected::after {
    content: "\2713";
    position: absolute;
    top: -0.48vw;
    right: -0.48vw;
    background-color: rgb(0, 128, 66);
    color: rgb(232, 230, 227);
    border-radius: 50%;
    width: 1vw;
    height: 1vw;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    font-size: 0.8vw;
}

.plus-button {
    width: 2.3vw;
    height: 2.3vw;
    background-color: hsl(151deg, 2.19%, 6.15%);
    color: rgb(232, 230, 227);
    border: 4px solid transparent;
    border-radius: .25rem;
    cursor: pointer;
    font-size: 0.833vw;
    font-weight: bold;
  }


.list-group-item-action {
    cursor: pointer;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.col-4.border-end p:first-child {
    justify-content: center!important;
    font-size: 1.5rem;
    font-weight: 900;
    align-items: center;
    color: #e8e6e3!important;
}

.col-4.border-end p:first-child span:nth-child(2) {
    color: #00db5f!important;
}

.col-4.border-end p:first-child span:last-child {
    font-size: 1.4rem;
    font-weight: 600;
    margin-left: 0.5rem;
    color: #d1cdc7!important;
}

.col-4.border-end .logo {
    width: 2rem!important;
    height: 2rem!important;
    margin-right: 0.1875rem;
}



.p-1.d-flex.justify-content-start:first-child {
    justify-content: center!important;
    font-size: 4vw;
    font-weight: 900;
    align-items: center;
    color: #e8e6e3!important;
}

.p-1.d-flex.justify-content-start:first-child span:nth-child(2) {
    color: #00db5f!important;
}

.p-1.d-flex.justify-content-start:first-child span:last-child {
    font-size: 3.1vw;
    font-weight: 600;
    margin-left: 0.5rem;
    margin-top: 0.1rem;
    color: #d1cdc7!important;
}

.btn-login {
    font-size: 1.72vw!important;
    font-weight: 400;
    line-height: 1.3;
    padding: 0.375rem 1.75rem;
}

.logout-btn {
    background-color: rgb(55 21 21)!important;
}

.btn-action {
    width: 45%;
}

.btn-action.btn-stop {
    background-color: rgb(128 32 0);
    border-color: rgb(112, 28, 0);
}

.btn-stop:hover {
    color: rgb(232, 230, 227)!important;
    background-color: rgb(102, 29, 5)!important;
    border-color: rgb(113, 32, 5)!important;
}.btn-stop:focus + .btn-stop,
.btn-stop:focus {
    color: rgb(232, 230, 227)!important;
    background-color: rgb(102, 29, 5)!important;
    border-color: rgb(113, 32, 5)!important;
    box-shadow: hsla(15, 98%, 21%, 0.5) 0px 0px 0px 0.25rem!important;
}

.btn-primary:disabled,
.btn-primary[disabled]{
    color: rgb(232, 230, 227);
    background-color: rgb(0, 128, 66);
    border-color: rgb(0, 112, 58);
}

.btn-stop:disabled,
.btn-stop[disabled]{
    color: rgb(232, 230, 227);
    background-color: rgb(128 32 0);
    border-color: rgb(112, 28, 0);
}

.list-group.action-list {
    display: flex;
    justify-content: space-evenly;
    flex-direction: row;
}

.border-end .status {
    display: flex;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: 400;
    line-height: 0;
    color: hsl(36deg 10% 50%);
}


.p-1.d-flex.justify-content-start .logo {
    width: 4.5vw!important;
    height: 4.5vw!important;
    margin-right: 0.1875rem;
    margin-top: 0.5rem;
}

.form-title {
    color: rgb(209, 205, 199)!important;
    display: flex;
    justify-content: center;
    font-size: 1.3vw;
    font-weight: 500;
    line-height: 1;
}
.form-subtitle {
    margin-top: 2.25rem;
    font-size: 1.2em;
    font-weight: 400;
    color: rgb(186 180 171)!important;
    display: flex;
    flex-direction: column;
    text-align: center;
    line-height: 2;
}

.type-disabled {
    display: none!important;
}
.type-enabled {
    display: inline-block!important;
}

.mb-3.massoffer-collection-labels {
    margin-bottom: 0!important;
}
.mb-3.massoffer-collection-labels > * {
    display: inline-block;
    text-align: center;
}

.mb-3 .draggable {
  cursor: move;
}
.mb-3 .collection-form-drag {
    width: 1.8%;
    margin-left: 0!important;
}.mb-3 .collection-form-url {
    width: 22.7%;
    /* width: 26.7%; */
}.mb-3 .collection-form-price {
    width: 5%;
    /* width: 4.5%; */
}.mb-3 .collection-form-price-amount {
    width: 10.035%;
}.mb-3 .collection-form-index {
    width: 5.5%;
}.mb-3 .collection-form-index-label,
.mb-3 .collection-form-price-label {
    width: 11.05%;
    /*font-size: 0.7em;*/
}.mb-3 .collection-form-index-label {
    width: 12.05%
}
.mb-3 .collection-form-traits {
    width: 7%;
}
.mb-3 .collection-form-duration {
    width: 6%;
    /* width: 8%; */
}
.mb-3 .collection-form-amount {
    width: 7%;
    /* width: 9%; */
}
.mb-3 .form-label .collection-form-amount {
    /* font-size: 0.7em; */
}
.mb-3 .form-control.collection-form-notes {
    color: rgb(209 205 199 / 70%);
    /* background-color: hsl(200 6% 13% / 1); */
    border-color: hsl(151 6% 15% / 1);
}
.mb-3 .collection-form-notes {
    width: 5.7%;
}
.mb-3 .collection-form-bidding-method {
    width: 12.033%;
}
.mb-3 .collection-form-bidding-type {
    width: 11.75%;
    margin-left: 0!important;
}
.mb-3.object-to-copy {
    position: relative;
    white-space: nowrap;
    min-width: 23rem;
    margin-bottom: 0.85rem!important;
}


.mb-3.massoffer-collection-labels > *,
.mb-3.massoffer-collection-inputs > form > *:not(.modal) {
    display: inline-block;
    margin-left: 1.3%;
}
.mb-3.massoffer-collection-inputs .formbreak {
    margin-left: 1.3%;
}
.mb-3.massoffer-collection-labels .formnobreak, 
.mb-3.massoffer-collection-inputs .formnobreak {
    margin-left: 0.3%!important;
}

.form-checkbox {
    width: 2.35rem;
    height: 2.35rem;
    margin-top: 0;
    border-width: medium;
}

.trait-explanation {
    margin: 0;
    color: rgb(158, 150, 137);
}
.trait-color-key {
    color: rgb(209, 205, 199);
}
.stats-main,.stats-trait {
    margin-top: 0.1rem;
    max-height: 1.5rem;
    width: 65%;
    display: flex;
    justify-content: space-around;
}
.stats-trait {
    width: 28.5%;
    max-width: 28.5%;
    margin-left: auto;
    margin-top: -1.5rem;
    margin-right: 4rem;
}
.stats-alt {
    display: flex;
    color: hsl(45 4% 60% / 1);
}
.stats-value {
    color: rgb(209, 205, 199);
}
.eth-logo {
    width: 1rem;
}

.nc-hidden::-webkit-outer-spin-button,
.nc-hidden::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.nc-hidden[type=number] {
    /* Firefox */
    -moz-appearance: textfield;
}
.form-filter-type {
    display: inline;
    width: 20%;
}
.form-filter-index {
    display: inline;
    width: 10%;
    margin-left: 0.15%;
    margin-right: 0.15%;
}
.form-filter-name {
    display: inline;
    width: 20%;
}
.form-filter-trait {
    min-height: 13rem!important;
}


.form-label .info {
    position: relative;
    display: inline-block
}  
.form-label .info .infotext {
    visibility: hidden;
    width: max-content;
    background-color: black;
    color: #d1cdc7;
    text-align: center;
    border-radius: 1rem;
    padding: .5rem;
    
    /* Position the tooltip */
    position: absolute;
    z-index: 2;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
}
.form-label .info:hover .infotext {
    visibility: visible;
}
.offer-list {
    margin-bottom: 1rem;
    max-height: 27rem;
    overflow-y: scroll;
    overflow-y: overlay;
    margin-right: -0.85rem;
    scrollbar-gutter: stable;
}

.new-feature {
    color: #e600e5;
    font-size: 0.9rem;
}

.form-control {
    padding: 0.375rem 0.25rem;
}
.col-4 {
    width: 23%;
}
.col-8 {
    width: 77%;
}
.mb-3 {
    margin-bottom: 0rem!important;
}
.modal-backdrop {
    transform: translate(50%,-50%);
    top: 50%;
    right: 50%;
    left: unset;
    position: absolute;
    background-color: rgb(0 0 0 / 40%);
}
.modal-content {
    background-color: #1e2122
}
.modal-header, .modal-footer {
    border-color: #383d3f;
}
.modal-close {
    border-width: 0;
    background-color: #1e2122
}




.list-group-item-action {
    cursor: pointer;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}html {
    background-color: #181a1b !important;
}html {
    color-scheme: dark !important;
}html, body {
    background-color: #181a1b;
}html, body {
    border-color: #736b5e;
    color: #e8e6e3;
}a {
    color: hsl(151, 100%, 42%);
}::-webkit-scrollbar {
    background-color: #202324;
    color: #aba499;
}::-webkit-scrollbar-thumb {
    background-color: #454a4d;
}::-webkit-scrollbar-thumb:hover {
    background-color: #575e62;
}::-webkit-scrollbar-corner {
    background-color: #181a1b;
}:root {
   --darkreader-neutral-background: #131516;
   --darkreader-neutral-text: #d8d4cf;
   --darkreader-selection-background: #004daa;
   --darkreader-selection-text: #e8e6e3;
}:root {
    --bs-blue: #0d6efd; --bs-indigo: #6610f2; --bs-purple: #6f42c1; --bs-pink: #d63384; --bs-red: #dc3545; --bs-orange: #fd7e14; --bs-yellow: #ffc107; --bs-green: #198754; --bs-teal: #20c997; --bs-cyan: #0dcaf0; --bs-white: #fff; --bs-gray: #6c757d; --bs-gray-dark: #343a40; --bs-primary: #0d6efd; --bs-secondary: #6c757d; --bs-success: #198754; --bs-info: #0dcaf0; --bs-warning: #ffc107; --bs-danger: #dc3545; --bs-light: #f8f9fa; --bs-dark: #212529; --bs-font-sans-serif: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; --bs-font-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",
    monospace;
    --darkreader-bgimg--bs-gradient: linear-gradient(180deg,
    rgba(24, 26, 27, 0.15),
    rgba(24, 26, 27, 0));
}body {
    color: rgb(209, 205, 199);
    background-color: rgb(24, 26, 27);
    -webkit-tap-highlight-color: transparent;
}a {
    color: hsl(151, 98%, 40%);
    text-decoration-color: initial;
}a:hover {
    color: hsl(151, 91%, 65%);
}button:focus:not(:focus-visible) {
    outline-color: initial;
}.row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
}.form-text {
    color: rgb(158, 150, 137);
}.form-control {
    color: rgb(209, 205, 199);
    background-color: hsl(151, 6%, 10%);
    border-color: hsl(151, 6%, 25%);
}.form-control:focus {
    color: rgb(209, 205, 199);
    background-color: hsl(151, 6%, 10%);
    border-color: rgb(0, 66, 34);
    outline-color: initial;
    box-shadow: hsla(151, 99%, 27%, 0.25) 0px 0px 0px 0.25rem;
}.form-control:disabled,
.form-control[readonly] {
    background-color: rgb(35, 38, 39);
}.form-select {
    color: rgb(209, 205, 199);
    background-color: rgb(24, 26, 27);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    border-color: rgb(60, 65, 68);
}.form-select:focus {
    border-color: rgb(0, 66, 34);
    outline-color: initial;
    box-shadow: rgba(2, 80, 196, 0.25) 0px 0px 0px 0.25rem;
}.form-check-input {
    background-color: hsl(151, 6%, 10%);
    border-color: rgba(140, 130, 115, 0.25);
}.form-check-input:focus {
    border-color: rgb(0, 66, 34);
    outline-color: initial;
    box-shadow: hsla(151, 99%, 27%, 0.25) 0px 0px 0px 0.25rem;
}.form-check-input:checked {
    background-color: rgb(0, 128, 66);
    border-color: hsl(151, 100%, 22%);
    border-style: hidden;
}.form-check-input:checked[type="checkbox"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"); 
}.btn {
    color: rgb(209, 205, 199);
    text-decoration-color: initial;
    background-color: transparent;
    border-color: transparent;
}.btn:hover {
    color: rgb(209, 205, 199);
}.btn-check:focus + .btn,
.btn:focus {
    outline-color: initial;
    box-shadow: rgba(2, 80, 196, 0.25) 0px 0px 0px 0.25rem;
}.btn-primary {
    color: rgb(232, 230, 227);
    background-color: rgb(0, 128, 66);
    border-color: rgb(0, 112, 58);
}.btn-primary:hover {
    color: rgb(232, 230, 227);
    background-color: rgb(5, 102, 55);
    border-color: rgb(5, 113, 60);
}.btn-check:focus + .btn-primary,
.btn-primary:focus {
    color: rgb(232, 230, 227);
    background-color: rgb(5, 102, 55);
    border-color: rgb(5, 113, 60);
    box-shadow: hsla(151, 98%, 21%, 0.5) 0px 0px 0px 0.25rem;
}.btn-check:active + .btn-primary,
.btn-check:checked + .btn-primary,
.btn-primary.active,
.btn-primary:active,
.show > .btn-primary.dropdown-toggle {
    color: rgb(232, 230, 227);
    background-color: #008042;
    border-color: #00703a;
}.btn-check:active + .btn-primary:focus,
.btn-check:checked + .btn-primary:focus,
.btn-primary.active:focus,
.btn-primary:active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    box-shadow: rgba(2, 72, 174, 0.5) 0px 0px 0px 0.25rem;
}.card {
    background-color: rgb(24, 26, 27);
    border-color: rgba(140, 130, 115, 0.13);
}.list-group-item-action {
    color: rgb(181, 175, 166);
}.list-group-item-action:focus,
.list-group-item-action:hover {
    color: rgb(181, 175, 166);
    text-decoration-color: initial;
    background-color: rgb(27, 30, 31);
}.list-group-item-action:active {
    color: rgb(209, 205, 199);
    background-color: rgb(35, 38, 39);
}.list-group-item {
    color: rgb(209, 205, 199);
    text-decoration-color: initial;
    background-color: rgb(24, 26, 27);
    border-color: rgba(140, 130, 115, 0.13);
}.list-group-item.active {
    color: rgb(232, 230, 227);
    background-color: #008042;
    border-color: #00703a;
}.border-end {
    border-right-color: rgb(56, 61, 63) !important;
}body {
    border-color: rgb(56, 61, 63) !important;
}

.row.px-2 {
    height: 100%;
}
.col-4.border-end {
    display: flex;
    flex-direction: column;
}
.console {
    margin-top: auto;
}

/* Font sizes */
/* 1 rem */
body, .form-select, .form-control {
    font-size: 0.9vw;
}
/* 1 rem */
.btn {
    font-size: 0.833vw;
}
/* 0.875 rem */
.form-text {
    /* font-size: 0.7875vw; */
}
/* 0.7 rem */
.border-end .status {
    font-size: 0.63vw;
    padding-bottom: 0.6vw;
}
/* 0.6 rem */
.console {
    font-size: 0.54vw;
    height: 32vh;
}
.col-4.border-end p:first-child {
    font-size: 1.5vw;
}
.col-4.border-end p:first-child span:last-child {
    font-size: 1.3vw;
}
.col-4.border-end .logo {
    width: 1.8vw !important;
    height: 1.8vw !important;
    margin-right: 0.18vw;
    margin-top: 3px;
}
.form-checkbox {
    width: 2.05vw;
    height: 2.05vw;
}
.offer-list {
    border-top: 1px solid;
    border-color: rgb(56, 61, 63) !important;
    padding-top: 1vw;
    margin-top: 1vw;
    max-height: 45vh;
}
.edit-multiple-checkbox {
    margin-left: 6%;
    width: 1vw;
    height: 1vw;
    font-size: 70%;
    border-width: 2px;
}
.edit-multiple-checkbox:checked {
    background-color: rgb(0, 128, 66);
    border-color: hsl(151, 100%, 22%);
    border-style: hidden;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
}
[type=checkbox]:not(:disabled) {
    cursor: pointer;
}
.edit-multiple-checkbox-apply a {
    font-size: 80%;
    vertical-align: text-top;
}
.edit-multiple-checkbox-apply {
    background-color: rgb(0, 128, 66);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
    width: 2vw;
    height: 2vw;
    margin-left: -0.05vw;
}
.edit-multiple-checkbox-reset {
    background-color: #797979;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' width='256' height='256' viewBox='0 0 256 256' xml:space='preserve'%3E%3Cdefs%3E%3C/defs%3E%3Cg style='stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;' transform='translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)' %3E%3Cpath d='M 75.702 53.014 c -2.142 7.995 -7.27 14.678 -14.439 18.816 c -7.168 4.138 -15.519 5.239 -23.514 3.095 c -16.505 -4.423 -26.335 -21.448 -21.913 -37.953 C 20.258 20.467 37.286 10.64 53.79 15.06 c 4.213 1.129 8.076 3.118 11.413 5.809 l -8.349 8.35 h 26.654 V 2.565 l -8.354 8.354 c -5.1 -4.405 -11.133 -7.61 -17.74 -9.381 C 33.451 -4.882 8.735 9.389 2.314 33.35 c -6.42 23.961 7.851 48.678 31.811 55.098 C 38.001 89.486 41.934 90 45.842 90 c 7.795 0 15.488 -2.044 22.42 -6.046 c 10.407 -6.008 17.851 -15.709 20.962 -27.317 L 75.702 53.014 z' style='stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;' transform=' matrix(1 0 0 1 0 0) ' stroke-linecap='round' /%3E%3C/g%3E%3C/svg%3E");
    transform: scaleX(-1);
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: 80%;
    width: 1.1vw;
    height: 2vw;
    margin-left: 0.25vw;
}
.edit-multiple-checkbox-reset:hover {
    background-color: #797979;
}
.edit-multiple-checkbox-reset:focus {
    background-color: #797979;
    box-shadow: hsla(151, 98%, 21%, 0.5) 0px 0px 0px 0.25rem;
}
.edit-multiple-checkbox-apply:hover {
    color: rgb(232, 230, 227);
    background-color: rgb(5, 102, 55);
    border-color: rgb(5, 113, 60);
}
.edit-multiple-checkbox-apply:focus {
    color: rgb(232, 230, 227);
    background-color: rgb(5, 102, 55);
    border-color: rgb(5, 113, 60);
    box-shadow: hsla(151, 98%, 21%, 0.5) 0px 0px 0px 0.25rem;
}
.end-buttons {
    display: inline-flex !important;
    margin-left: .5% !important;
    width: 3.5vw;
}
.mb-3 .btn-remove {
    display: inline-flex!important;
    background-color: #a11212!important;
    /* margin-left: .5%!important;
    width: 2%;
    max-width: 1.2rem; */
    margin-left: 6%;
    width: 1vw;
    height: 1vw;
    font-size: 70%;
    align-items: center;
    justify-content: center;
}
.mb-3 .btn-disable {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Layer_1' x='0px' y='0px' viewBox='131 -131 512 512' style='enable-background:new 131 -131 512 512;' xml:space='preserve'%3E%3Cg id='XMLID_1_'%3E%3Crect style='fill: rgb(209, 205, 199);' id='XMLID_3_' x='131' y='70.8' width='512' height='108.4'/%3E%3C/g%3E%3C/svg%3E");
    padding: 0.15vw;
    background-size: contain;
    background-repeat: no-repeat;
    background-origin: content-box;
    display: inline-flex!important;
    background-color: #797979!important;
    /* width: 2%;
    max-width: 1.2rem; */
    margin-left: -3%;
    width: 1vw;
    height: 1vw;
    font-size: 70%;
    align-items: center;
    justify-content: center;
}
.edit-multiple-checkbox-reveal-button {
    text-align: center;
    line-height: 0.1em;
    margin-top: 0.5vw;
    border-bottom: 2px dashed;
    border-radius: 0.25rem;
    border-color: hsl(151, 6%, 28%)!important;
    cursor: pointer;
}
.edit-multiple-checkbox-fields {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.5s ease-out;
}
.btn-secondary {
    background-color: #5d5d5d12;
    border-color: #5858585c;
}
.disabled-overlay:not([disabled]) {
    position: absolute;
    top: 0;
    left: 1.8%;
    /* width: 94.1%; */
    width: 92.4%;
    height: 100%;
    background-color: rgb(10 10 10 / 45%);
}
.modal-body .form-checkbox {
    width: 1.6vw;
    height: 1.6vw;
}

/* NFT Autolister Bot Styles - Redesigned */

/* Main Header Section - 3 Column Layout */
.autolister-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding: 0;
}

.title-section {
    flex: 1;
}

.title-section h2 {
    margin: 0;
    font-size: 1.8rem;
    font-weight: 600;
    color: #d1cdc7;
}

.center-section {
    flex: 1;
    display: flex;
    justify-content: center;
}

.refresh-section {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
}

#refreshCountdown {
    font-size: 0.9rem;
    color: #d1cdc7;
    opacity: 0.8;
}

.manual-refresh-btn {
    background: #008042;
    border: 1px solid #00703a;
    color: white;
    padding: 0.4rem 0.8rem;
    border-radius: 0.25rem;
    font-size: 0.8rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.manual-refresh-btn:hover {
    background: #00703a;
    transform: translateY(-1px);
}

/* Future Task Section */
.future-task-section {
    text-align: center;
    margin-bottom: 1.5rem;
}

.create-future-btn {
    background: #008042;
    border: 1px solid #00703a;
    color: white;
    padding: 0.6rem 1.2rem;
    border-radius: 0.25rem;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
    font-weight: 500;
}

.create-future-btn:hover {
    background: #00703a;
    transform: translateY(-1px);
}

/* Table Headers */
.listing-table-header {
    display: flex;
    align-items: center;
    padding: 0.8rem 1rem;
    background: rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(56, 61, 63, 0.3);
    border-radius: 0.25rem;
    margin-bottom: 1rem;
    font-weight: 600;
    color: #d1cdc7;
    font-size: 0.85rem;
    gap: 1rem;
}

.col-nft-name {
    width: 120px;
    flex-shrink: 0;
}

.col-collection-data,
.col-nft-data {
    width: 140px;
    flex-shrink: 0;
}

.col-filter-trait {
    width: 180px;
    flex-shrink: 0;
}

.col-settings {
    width: 200px;
    flex-shrink: 0;
}

.col-action {
    width: 80px;
    flex-shrink: 0;
}

.future-task-creator button {
    background: rgba(0, 128, 66, 0.8);
    border: 1px solid rgba(0, 128, 66, 0.5);
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 0.25rem;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.3s ease;
}

.future-task-creator button:hover {
    background: rgba(0, 128, 66, 1);
    transform: translateY(-1px);
}



/* Listings Sections */
.listings-section {
    margin-bottom: 2rem;
}

.section-divider {
    position: relative;
    height: 2px;
    background: rgba(56, 61, 63, 0.8);
    margin: 2rem 0 1rem 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.active-divider {
    background: #00ff00;
}

.divider-text {
    background: #181a1b;
    color: #d1cdc7;
    padding: 0 1rem;
    font-weight: bold;
    font-size: 1rem;
}

.listings-container {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 400px;
    overflow-y: auto;
    padding-right: 0.5rem;
}

.listings-container::-webkit-scrollbar {
    width: 8px;
}

.listings-container::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.3);
    border-radius: 4px;
}

.listings-container::-webkit-scrollbar-thumb {
    background: rgba(56, 61, 63, 0.8);
    border-radius: 4px;
}

.listings-container::-webkit-scrollbar-thumb:hover {
    background: rgba(56, 61, 63, 1);
}

.no-listings {
    text-align: center;
    color: rgba(209, 205, 199, 0.6);
    font-style: italic;
    padding: 2rem;
}

/* NFT Cards Grid Layout */
.nft-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.8rem;
    max-height: 400px;
    overflow-y: auto;
    padding: 0.5rem;
}

.nft-cards-grid::-webkit-scrollbar {
    width: 8px;
}

.nft-cards-grid::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.3);
    border-radius: 4px;
}

.nft-cards-grid::-webkit-scrollbar-thumb {
    background: rgba(56, 61, 63, 0.8);
    border-radius: 4px;
}

/* NFT Card Design - New Layout */
.nft-card {
    width: 220px;
    border-radius: 0.4rem;
    overflow: hidden;
    border: 2px solid rgba(56, 61, 63, 0.6);
    transition: all 0.3s ease;
    background: rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
}

.nft-card:hover {
    border-color: rgba(0, 128, 66, 0.8);
    transform: translateY(-2px);
}

.nft-card.active {
    border-color: #00ff00;
}

/* NFT Image Section - Square at top */
.nft-image-section {
    width: 100%;
}

.nft-square-image {
    width: 100%;
    height: 160px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}

.nft-image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.3) 100%);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0.6rem;
}

/* Image Overlay Text */
.nft-title {
    font-size: 0.85rem;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.9), -1px -1px 2px rgba(0,0,0,0.9), 1px -1px 2px rgba(0,0,0,0.9), -1px 1px 2px rgba(0,0,0,0.9);
    margin-bottom: 0.2rem;
    text-align: center;
}

.collection-title {
    font-size: 0.7rem;
    color: rgba(255,255,255,0.9);
    text-shadow: 1px 1px 2px rgba(0,0,0,0.9), -1px -1px 1px rgba(0,0,0,0.9), 1px -1px 1px rgba(0,0,0,0.9), -1px 1px 1px rgba(0,0,0,0.9);
    text-align: center;
    margin-bottom: 0.3rem;
}

/* Stats on Image */
.nft-stats {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.stats-row {
    display: flex;
    justify-content: space-between;
    font-size: 0.6rem;
    color: white;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.9), -1px -1px 1px rgba(0,0,0,0.9), 1px -1px 1px rgba(0,0,0,0.9), -1px 1px 1px rgba(0,0,0,0.9);
}

/* Fields Section - Below Image */
.nft-fields-section {
    padding: 0.6rem;
    background: rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Form Controls */
.traits-section textarea {
    width: 100%;
    height: 40px;
    background: rgba(0,0,0,0.7);
    border: 1px solid rgba(255,255,255,0.3);
    color: white;
    border-radius: 0.25rem;
    padding: 0.4rem;
    font-size: 0.7rem;
    resize: none;
}

.controls-section {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.input-labels {
    display: flex;
    gap: 0.3rem;
    margin-bottom: 0.2rem;
}

.input-labels span {
    flex: 1;
    font-size: 0.55rem;
    color: rgba(255, 255, 255, 0.7);
    text-align: center;
    font-weight: 500;
}

.input-row {
    display: flex;
    gap: 0.3rem;
}

.input-row input {
    flex: 1;
    background: rgba(0,0,0,0.7);
    border: 1px solid rgba(255,255,255,0.3);
    color: white;
    border-radius: 0.25rem;
    padding: 0.25rem;
    font-size: 0.65rem;
    text-align: center;
    width: 45px;
}

.checkbox-row {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.checkbox-row label {
    display: flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.6rem;
    color: white;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
}

.action-section {
    text-align: center;
}

.action-section .btn {
    padding: 0.4rem 0.8rem;
    border-radius: 0.25rem;
    font-size: 0.7rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    min-width: 60px;
}

.action-section .btn-success {
    background: #008042;
    color: white;
}

.action-section .btn-danger {
    background: #dc3545;
    color: white;
}

/* Future Task Specific */
.future-url-input {
    margin-bottom: 0.3rem;
}

.future-url-input input {
    width: 100%;
    background: rgba(0,0,0,0.8);
    border: 1px solid rgba(255,255,255,0.5);
    color: white;
    border-radius: 0.25rem;
    padding: 0.4rem;
    font-size: 0.65rem;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.9);
}

/* Private Key Bottom Left */
.private-key-bottom {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    z-index: 100;
}

.private-key-bottom label {
    font-size: 0.8rem;
    color: #d1cdc7;
    font-weight: 500;
}

.private-key-bottom input {
    width: 250px;
    background: rgba(0, 0, 0, 0.8);
    border: 1px solid rgba(56, 61, 63, 0.8);
    color: #d1cdc7;
    padding: 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.8rem;
}

.nft-listing.active {
    border-color: #00ff00;
    background: rgba(0, 128, 66, 0.1);
}

.nft-listing.inactive {
    border-color: rgba(56, 61, 63, 0.8);
}

.nft-listing:hover {
    border-color: #00ff00;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 255, 0, 0.2);
}

/* NFT Info Column */
.nft-info {
    width: 120px;
    flex-shrink: 0;
}

.nft-image {
    position: relative;
    width: 50px;
    height: 50px;
    border-radius: 0.25rem;
    overflow: hidden;
    background: #000;
    flex-shrink: 0;
}

.nft-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.nft-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.9));
    color: #fff;
    padding: 2px 4px;
}

.nft-name {
    font-weight: 600;
    font-size: 0.6rem;
    margin-bottom: 1px;
    line-height: 1.1;
}

.collection-name {
    font-size: 0.5rem;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.1;
}

/* Data Columns */
.collection-data,
.nft-data {
    width: 140px;
    flex-shrink: 0;
}

.data-item {
    font-size: 0.7rem;
    color: rgba(209, 205, 199, 0.8);
    margin-bottom: 1px;
    line-height: 1.2;
}

.data-item span {
    color: #d1cdc7;
    font-weight: 500;
}

/* Filter/Traits Column */
.filter-traits {
    width: 180px;
    flex-shrink: 0;
}

.filter-traits textarea {
    width: 100%;
    height: 40px;
    resize: none;
    overflow-y: auto;
    font-size: 0.7rem;
    line-height: 1.2;
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(56, 61, 63, 0.5);
    color: #d1cdc7;
    padding: 0.3rem;
    border-radius: 0.25rem;
    transition: border-color 0.2s ease;
}

.filter-traits textarea:focus {
    outline: none;
    border-color: rgba(0, 128, 66, 0.8);
}

.trait-section {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.trait-section label {
    font-size: 0.8rem;
    color: rgba(209, 205, 199, 0.8);
    font-weight: 500;
}

.trait-section input {
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(56, 61, 63, 0.8);
    color: #d1cdc7;
    font-size: 0.8rem;
    padding: 0.3rem;
}

.trait-section input:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Settings Column */
.settings {
    width: 200px;
    flex-shrink: 0;
}

.settings-row {
    display: flex;
    gap: 0.3rem;
    margin-bottom: 0.2rem;
}

.settings-row input[type="number"] {
    width: 50px;
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(56, 61, 63, 0.5);
    color: #d1cdc7;
    font-size: 0.7rem;
    padding: 0.2rem 0.3rem;
    text-align: center;
    border-radius: 0.25rem;
    transition: border-color 0.2s ease;
}

.settings-row input[type="number"]:focus {
    outline: none;
    border-color: rgba(0, 128, 66, 0.8);
}

.settings-checkboxes {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.settings-checkboxes label {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.65rem;
    color: rgba(209, 205, 199, 0.8);
    cursor: pointer;
}

.settings-checkboxes input[type="checkbox"] {
    margin: 0;
    cursor: pointer;
}

.setting-row input:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.setting-options {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.checkbox-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    color: rgba(209, 205, 199, 0.8);
    cursor: pointer;
}

.checkbox-label input[type="checkbox"] {
    margin: 0;
    cursor: pointer;
}

.checkbox-label input[type="checkbox"]:disabled {
    cursor: not-allowed;
}

/* Action Column */
.action {
    width: 80px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.action .btn {
    padding: 0.3rem 0.6rem;
    border-radius: 0.25rem;
    font-size: 0.7rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    min-width: 50px;
}

.action .btn-success {
    background: #008042;
    color: white;
}

.action .btn-success:hover {
    background: #00703a;
}

.action .btn-danger {
    background: #dc3545;
    color: white;
}

.action .btn-danger:hover {
    background: #c82333;
}

/* Future Task Placeholder */
.future-task-placeholder {
    padding: 0.3rem;
}

.placeholder-text {
    font-size: 0.6rem;
    color: rgba(209, 205, 199, 0.6);
    margin-bottom: 0.2rem;
}

.future-task-placeholder input {
    width: 100%;
    font-size: 0.7rem;
    padding: 0.2rem;
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(56, 61, 63, 0.5);
    color: #d1cdc7;
    border-radius: 0.25rem;
}

.nft-action .btn {
    min-width: 80px;
    font-size: 0.85rem;
    padding: 0.4rem 0.8rem;
}

/* Private Key Section */
.private-key-section {
    margin-top: 2rem;
    padding: 1rem;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 0.5rem;
    border: 1px solid rgba(56, 61, 63, 0.8);
}

.private-key-section label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #d1cdc7;
    margin-bottom: 0.5rem;
}

.info-icon {
    cursor: help;
    font-size: 1.1rem;
}

.private-key-section input {
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(56, 61, 63, 0.8);
    color: #d1cdc7;
    padding: 0.5rem;
}

.private-key-section input::placeholder {
    color: rgba(209, 205, 199, 0.6);
}

/* Responsive Design */
@media (max-width: 1200px) {
    .nft-listing {
        gap: 0.5rem;
        padding: 0.5rem;
    }
    
    .nft-image {
        width: 50px;
        height: 50px;
    }
    
    .stat-row {
        font-size: 0.7rem;
    }
    
    .trait-section input,
    .setting-row input {
        font-size: 0.7rem;
        padding: 0.15rem;
    }
}

@media (max-width: 768px) {
    .nft-listing {
        flex-direction: column;
        height: auto;
        gap: 0.5rem;
        padding: 1rem;
    }
    
    .nft-image {
        width: 80px;
        height: 80px;
    }
    
    .future-task-creator {
        flex-direction: column;
        align-items: stretch;
    }
    
    .refresh-info {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .listing-header {
        position: static;
        margin-bottom: 1rem;
    }
}

/* Dark theme enhancements */
.nft-listing {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.3), rgba(24, 26, 27, 0.4));
}

.nft-listing.active {
    background: linear-gradient(135deg, rgba(0, 128, 66, 0.1), rgba(0, 255, 0, 0.05));
    box-shadow: 0 0 20px rgba(0, 255, 0, 0.1);
}

/* Smooth transitions */
.nft-listing * {
    transition: all 0.2s ease;
}

/* Focus states */
.trait-section input:focus,
.setting-row input:focus,
.private-key-section input:focus {
    outline: none;
    border-color: #00ff00;
    box-shadow: 0 0 0 2px rgba(0, 255, 0, 0.2);
}

/* Button hover effects */
.nft-action .btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

/* Loading states */
.nft-listing.loading {
    opacity: 0.7;
    pointer-events: none;
}

.nft-listing.loading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin: -10px 0 0 -10px;
    border: 2px solid #00ff00;
    border-top: 2px solid transparent;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}