#section-profile-dashboard .nav-tabs {
    --bs-nav-tabs-link-active-color: #000000;
    border-bottom: 1px solid #D9D9D9;
}

#section-profile-dashboard .nav-link {
    --bs-nav-link-padding-y: 18px;
    border-bottom: 1px solid transparent;
}

#section-profile-dashboard .nav-link.active {
    border-bottom: 2px solid var(--bs-primary);
}

#section-profile-dashboard .image-not-found {
    width: 230px;
    height: 180px;
    object-fit: contain;
}

#section-profile-dashboard .icon-not-found {
    width: 50px;
    height: 50px;
    object-fit: contain;
}

#section-profile-dashboard .account-menu .account-menu-item,
#app-account-offcanvas-menu .account-menu .account-menu-item {
    background: transparent;
    color: #000;
    transition: all 0.3s ease;
}

#section-profile-dashboard .account-menu .account-menu-item.active,
#section-profile-dashboard .account-menu .account-menu-item:hover,
#app-account-offcanvas-menu .account-menu .account-menu-item.active,
#app-account-offcanvas-menu .account-menu .account-menu-item:hover {
    background: #F2F2F2;
    transition: all 0.3s ease;
}

#section-profile-dashboard .avatar,
#app-account-offcanvas-menu .avatar {
    width: 60px;
    height: 60px;
    object-fit: cover;
    background: #f5f5f5;
}

#section-profile-dashboard .account-menu .account-menu-submenu .account-menu-submenu-item,
#app-account-offcanvas-menu .account-menu .account-menu-submenu .account-menu-submenu-item {
    border-left: 1px solid #D9D9D9;
    background: transparent;
    color: #000;
    transition: all 0.3s ease;
}

#section-profile-dashboard .account-menu .account-menu-submenu .account-menu-submenu-item.active,
#app-account-offcanvas-menu .account-menu .account-menu-submenu .account-menu-submenu-item.active {
    border-left: 2px solid #F06022;
    transition: all 0.3s ease;
}

/* Default submenu state - hidden */
#section-profile-dashboard .account-menu .account-menu-submenu,
#app-account-offcanvas-menu .account-menu .account-menu-submenu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

/* Show submenu when expand class is present */
#section-profile-dashboard .account-menu .account-menu-submenu.expand,
#app-account-offcanvas-menu .account-menu .account-menu-submenu.expand {
    max-height: 100dvh;
}

/* Rotate arrow when submenu is expanded */
#section-profile-dashboard .account-menu .account-menu-item.has-submenu.expand svg,
#app-account-offcanvas-menu .account-menu .account-menu-item.has-submenu.expand svg {
    transform: scale(0.8) rotate(180deg);
}

/* Rotate arrow when submenu is expanded and item is active */
#section-profile-dashboard .account-menu .account-menu-item.has-submenu.expand.active svg,
#app-account-offcanvas-menu .account-menu .account-menu-item.has-submenu.expand.active svg {
    transform: scale(1) rotate(180deg);
}

#section-profile-dashboard .stat-card {
    height: 100%;
    border-color: #D9D9D9;
}


#section-profile-dashboard .slider-button-prev,
#section-profile-dashboard .slider-button-next {
    width: 35px !important;
    height: 35px !important;
}

#section-profile-dashboard .slider-button-prev {
    left: 5px;
}

#section-profile-dashboard .slider-button-next {
    right: 5px;
}

#section-profile-dashboard .list-horizontal-item {
    position: relative !important;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

#section-profile-dashboard .list-horizontal-item::before {
    content: '';
    background-image: url('/assets/icons/listing-attributes/icon-dot.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 4px;
    height: 4px;
    margin-right: 4px;
    display: inline-block;
}

@media(min-width: 768px) {
    #section-profile-dashboard .list-horizontal-item::before {
        margin-right: 8px;
    }

}

#section-profile-dashboard .slider-button-next:after,
#section-profile-dashboard .slider-button-prev:after {
    font-size: 14px !important;
}

#section-profile-dashboard .border-desktop-left {
    border-left: 0px !important;
}

@media(min-width: 768px) {
    #section-profile-dashboard .border-desktop-left {
        border-left: 1px solid !important;
        border-color: rgba(var(--bs-sak-gray-lighter-rgb), 1) !important;
    }
}

#section-profile-dashboard .border-mobile-bottom {
    border-bottom: 1px solid rgba(var(--bs-sak-gray-lighter-rgb), 1) !important;
}


#section-profile-dashboard #logo-upload-preview {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: contain;
}

#section-profile-dashboard #logo-upload-input {
    width: 1px;
    height: 1px;
    opacity: 0;
    transform: scale(0.01);
    position: absolute;
}


@media(min-width: 768px) {
    #section-profile-dashboard .border-mobile-bottom {
        border-bottom: 0px !important;
    }
}


.btn.btn-listing-action-button {
    width: 100%;
    border-radius: 32px;
    font-size: 10px;
    gap: 8px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--button-accent-border-color);
    background: var(--button-accent-bg-color);
    color: var(--button-accent-color);
}

@media(min-width: 768px) {
    .btn.btn-listing-action-button {
        font-size: 14px;
    }
}

.btn.btn-listing-action-button svg * {
    stroke: var(--button-accent-color);
}


.btn.btn-listing-action-button.accent-expiring {
    --button-accent-bg-color: #F060221A;
    --button-accent-border-color: #F06022;
    --button-accent-color: #F06022;
}

.btn.btn-listing-action-button.accent-a {
    --button-accent-bg-color: #64A7171A;
    --button-accent-border-color: #64A717;
    --button-accent-color: #64A717;
}

.btn.btn-listing-action-button.accent-d,
.btn.btn-listing-action-button.accent-h {
    --button-accent-bg-color: #F80E1233;
    --button-accent-border-color: #F80E12;
    --button-accent-color: #F80E12;
}

.redcase-mobile-hide-text {
    font-size: 0 !important;
}

@media(min-width: 768px) {
    .redcase-mobile-hide-text {
        font-size: inherit !important;
    }
}

.buy-piston-card {
    border-radius: 32px;
    border-top: 4px solid #F06022;
    background: rgba(240, 96, 34, 0.10);
    height: 100%;
    max-height: 183px;
}

/* .buy-piston-card::before {
    content: '\A0';
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
    height: 8px;
    width: 100%;
    background: #E1A434;
    z-index: -1;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
} */

.token-icon-wrapper img {
    width: 56px;
    height: 56px;
    object-fit: contain;
    position: absolute;
    left: 50%;
    translate: -50% 0;
    z-index: 1;
}


.checkbox-min-size {
    width: 20px;
    height: 20px;
    aspect-ratio: 1/1;
    color: #D3D3D3;
}

.listing-image-preview,.video-image-preview {
    min-height: 180px !important;
    max-height: 180px !important;
    border: 1px dashed #D9D9D9;
    padding: 8px;
}


.upload-image-delete {
    top: -8px;
    right: -8px;
    width: 20px;
    height: 20px;
    background: url('/assets/icons/dashboard/icon-media-delete.svg') no-repeat center center / contain;
    aspect-ratio: 1/1;
    color: #D3D3D3;
}


/* ==========================================================================
   Rejection notice
   Shown to a seller when a reviewer turns down an ad, listing or reel.
   Deliberately not an .alert-danger flood: the chrome stays quiet so the
   reviewer's message is the loudest thing in the block, which is the only
   part the seller actually needs to read and act on.
   ========================================================================== */

.sak-rejection {
    position: relative;
    background: #FFFAF9;
    border: 1px solid rgba(248, 14, 18, .14);
    border-left: 3px solid var(--bs-danger, #F80E12);
    border-radius: 12px;
    padding: 14px 18px 14px 20px;
    max-width: 720px;
}

.sak-rejection__head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.sak-rejection__mark {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--bs-danger, #F80E12);
}

.sak-rejection__label {
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--bs-danger, #F80E12);
}

.sak-rejection__date {
    margin-inline-start: auto;
    font-size: 11px;
    font-weight: 500;
    color: var(--bs-sak-gray, #707070);
    white-space: nowrap;
}

/* The reviewer's own words: full size, near-black, generous leading. */
.sak-rejection__reason {
    margin: 0;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.55;
    color: #1a1a1a;
    overflow-wrap: anywhere;
}

.sak-rejection__action {
    margin: 10px 0 0;
    padding-top: 10px;
    border-top: 1px solid rgba(248, 14, 18, .12);
    font-size: 13px;
    line-height: 1.5;
    color: var(--bs-sak-gray, #707070);
}

/* Compact: sits in a table sub-row under the item it belongs to. */
.sak-rejection--compact {
    padding: 10px 14px 10px 15px;
    border-radius: 10px;
    max-width: none;
}

.sak-rejection--compact .sak-rejection__reason {
    font-size: 14px;
}

/* Full table width would strand the date at the far edge, away from the label
   it qualifies. Keep the header group tight instead. */
.sak-rejection--compact .sak-rejection__date {
    margin-inline-start: 0;
}

.sak-rejection--compact .sak-rejection__date::before {
    content: '\00B7';
    margin-inline-end: 6px;
}

.sak-rejection--compact .sak-rejection__action {
    margin-top: 8px;
    padding-top: 8px;
    font-size: 12px;
}

/* Neutral/informational variant for notices that aren't reporting a
   rejection (e.g. a listing still waiting for review). Mirrors the amber
   "pending" tone already used for ads/reels status badges, rather than the
   red error tone above. */
.sak-rejection--pending {
    background: #FFFBEB;
    border-color: rgba(255, 193, 7, .35);
    border-left-color: var(--bs-warning, #FFC107);
}

.sak-rejection--pending .sak-rejection__mark,
.sak-rejection--pending .sak-rejection__label {
    color: #8A6D00;
}

.sak-rejection--pending .sak-rejection__action {
    border-top-color: rgba(255, 193, 7, .3);
}

/* Table sub-row carrying a compact notice. It has to read as part of the ad
   above it, so the dividing border and the hover tint are both suppressed. */
tr.sak-rejection-row > td {
    padding: 0 12px 14px !important;
    border-top: 0 !important;
    border-bottom-width: 0 !important;
}

.table > tbody > tr:has(+ tr.sak-rejection-row) > td {
    border-bottom-color: transparent;
}

.table-hover > tbody > tr.sak-rejection-row:hover > td {
    --bs-table-accent-color: transparent;
    background-color: transparent;
    box-shadow: none;
}

@media (max-width: 767.98px) {
    .sak-rejection {
        padding: 12px 14px 12px 15px;
    }

    .sak-rejection__reason {
        font-size: 14px;
    }
}

/* A toggle the seller cannot use until the item is resubmitted. */
.status-toggle:disabled {
    cursor: not-allowed;
    opacity: .45;
}