/*
    Navidium Returns admin recolour, loaded after theme.css.

    Three moves, nothing structural:
    - the topbar and sidebar share the brand dark teal (the theme's own
      dark-topbar / dark-sidenav machinery does the work; this only swaps
      its navy #0c213a for the brand ground);
    - the page behind the cards warms up from stark white to a paper tone;
    - the action colour follows the brand orange.

    Every selector is scoped to the admin body classes, so the marketing and
    auth surfaces (styled by their own brand sheet) are untouched.
*/

/* ── Shared dark ground for sidebar ──────────────────────────────────── */

body.dark-sidenav .left-sidenav {
    background: linear-gradient(180deg, #0B3B42 0%, #07272C 100%);
}

/* #6E979D measured 3.83:1 on the sidebar's ground — under the 4.5:1 these
   12px labels need. This is the colour the nav links already use, at 5.47:1. */
body.dark-sidenav .left-sidenav .menu-label {
    color: #8FB4BA;
}

body.dark-sidenav .left-sidenav-menu li > a {
    color: #B6D2D6;
}

body.dark-sidenav .left-sidenav-menu li > a:hover,
body.dark-sidenav .left-sidenav-menu li > a:focus {
    color: #ffffff;
}

body.dark-sidenav .left-sidenav-menu li.mm-active > a,
body.dark-sidenav .left-sidenav-menu li > a.active {
    color: #FF8A00;
}

body.dark-sidenav .left-sidenav-menu li.mm-active > a i,
body.dark-sidenav .left-sidenav-menu li > a.active i {
    color: #FF8A00;
}

/* ── Warm paper behind the cards ─────────────────────────────────────── */

body[data-layout="vertical"]:not(.nvd-admin) {
    background-color: #F7F3EC;
}

body[data-layout="vertical"] .page-wrapper,
body[data-layout="vertical"] .page-content {
    background-color: transparent;
}

body[data-layout="vertical"] .card {
    border-color: #E7DFD2;
    box-shadow: 0 1px 6px rgba(63, 48, 22, .06);
}

body[data-layout="vertical"] .table-light,
body[data-layout="vertical"] .thead-light th {
    background-color: #F3EDE2;
}

/* ── Brand action colour ─────────────────────────────────────────────── */

body[data-layout="vertical"] .btn-primary {
    background-color: #FF8A00;
    border-color: #FF8A00;
}

body[data-layout="vertical"] .btn-primary:hover,
body[data-layout="vertical"] .btn-primary:focus,
body[data-layout="vertical"] .btn-primary:active {
    background-color: #E67C00 !important;
    border-color: #E67C00 !important;
}

body[data-layout="vertical"] .btn-outline-primary {
    color: #E67C00;
    border-color: #FF8A00;
}

body[data-layout="vertical"] .btn-outline-primary:hover {
    background-color: #FF8A00;
    border-color: #FF8A00;
    color: #ffffff;
}

/* ── Returns sub-navigation and count badges ─────────────────────────── */

.left-sidenav .nvd-count {
    background: rgba(255, 138, 0, .18);
    color: #FFB347;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 7px;
    float: right;
    line-height: 15px;
    min-width: 1.35rem;
    text-align: center;
}

/* Nested groups (Returns, Settings).
   `.nvd-sub` used to force these open with display:block !important, back when
   the returns filters were pinned visible. They collapse now, so that override
   is gone — metisMenu owns the open state and nothing may fight it, or the
   group animates against a rule that always wins. */

.left-sidenav .nav-second-level {
    list-style: none;
    padding-left: .625rem;
    margin: 3px 12px 6px;
    border-left: 1px solid rgba(255, 255, 255, .1);
}

.left-sidenav .nav-second-level .nav-link {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .375rem .625rem;
    margin: 2px 0;
    border-radius: 7px;
    color: #9FC3C9;
    text-decoration: none;
    font-size: .8125rem;
    line-height: 1.35;
    min-height: 32px;
}

/* The label takes the slack so counts stay flush right, which
   justify-content: space-between did until an icon became a third child and
   pushed the count into the middle. */
.left-sidenav .nav-second-level .nav-link .nvd-nav-label {
    flex: 1 1 auto;
    min-width: 0;
}

/* Smaller than a top-level icon: these are a level down, and matching the
   parent's weight would flatten the hierarchy the indent is establishing. */
.left-sidenav .nav-second-level .nvd-child-icon {
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    opacity: .88;
}

/* A group with no heading has nothing to separate it from the one above, so
   it borrows the gap the heading would have provided. */
.left-sidenav-menu > li.nvd-group-start {
    margin-top: .875rem !important;
}

.left-sidenav .nav-second-level .nav-link:hover {
    color: #ffffff;
}

.left-sidenav .nav-second-level .nav-link.active {
    color: #FF8A00;
    background: rgba(255, 138, 0, .12);
}

/* ── Dashboard hero metrics ──────────────────────────────────────────────
   The four figures a merchant opened the app to read. An accent edge and a
   larger numeral give them the weight the diagnostics strip below no longer
   competes for. */

body[data-layout="vertical"] .nvd-stat {
    position: relative;
    overflow: hidden;
}

body[data-layout="vertical"] .nvd-stat::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: #CBD5D8;
}

body[data-layout="vertical"] .nvd-stat--action::before { background: #FF8A00; }
body[data-layout="vertical"] .nvd-stat--open::before    { background: #3399F0; }
body[data-layout="vertical"] .nvd-stat--filed::before   { background: #4EB1BE; }
body[data-layout="vertical"] .nvd-stat--refunded::before { background: #FF5233; }

body[data-layout="vertical"] .nvd-stat .card-body {
    padding-left: 1.35rem;
}

body[data-layout="vertical"] .nvd-stat h3 {
    font-size: 1.9rem;
    letter-spacing: -.02em;
    color: #0B3B42;
}

body[data-layout="vertical"] .nvd-stat p.text-dark {
    color: #6E8A8F !important;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-size: 12px !important;
    font-weight: 600;
}

/* The remove control on a chosen-country chip.
   Bootstrap's .btn-close sits at opacity .5, which is right for dismissing an
   alert and too faint on a tinted chip where it is the only way back out. */

body[data-layout="vertical"] .nvd-chip-remove {
    opacity: .65;
    padding: 0;
    margin-left: .1rem;
}

body[data-layout="vertical"] .nvd-chip-remove:hover,
body[data-layout="vertical"] .nvd-chip-remove:focus-visible {
    opacity: 1;
}

/* ── .min-width-0 ────────────────────────────────────────────────────────
   This class was used in five places — including the shared card and stat
   components — and defined in no stylesheet. It is not a Bootstrap utility.

   It exists to let a flex child shrink below its content, which is the
   precondition for `text-truncate` doing anything at all: a flex item defaults
   to min-width: auto and simply refuses to go narrower than its text. So every
   truncating title sat inside a box that could not narrow, and on the portal
   screen a storefront URL rendered 516px wide in a 375px viewport and gave the
   whole page a horizontal scrollbar.

   One declaration, and five call sites start meaning what they say. */

.min-width-0 {
    min-width: 0;
}

/* The customer column on the returns list.
   14rem was a fixed inline width chosen for a desktop table. On a phone it
   consumed enough of a 375px row to push Status off the edge — the one column
   that answers why the screen was opened. It narrows where space is scarce and
   an email is the least valuable thing on the row, and returns to its full
   width from md up. */

.nvd-customer-cell {
    max-width: 6rem;
}

@media (min-width: 768px) {
    .nvd-customer-cell {
        max-width: 14rem;
    }
}

/* The 1rem column inset costs 32px of a 341px row — measured, that plus the
   customer column was the whole 33px overflow keeping Status off screen. It
   holds from md up, where the alignment it buys is worth the width. */
@media (max-width: 767.98px) {
    body[data-layout="vertical"] .card > .p-0 .table > :not(caption) > * > *:first-child {
        padding-left: .75rem;
    }

    body[data-layout="vertical"] .card > .p-0 .table > :not(caption) > * > *:last-child {
        padding-right: .75rem;
    }
}

/* Row hover.
   The theme dials Bootstrap's hover accent down to 3% — from its own 7.5% —
   which on a white card is close to invisible. That is fine for decoration and
   useless for the job these rows need it to do: six settings tables carry Edit,
   Disable and Delete a thousand pixels right of the name they belong to, and
   the only thing tying the two ends of that row together is the hover.

   Brand teal rather than the theme's navy, so it sits in the warm palette, and
   at a weight that can actually be seen without striping the table. */

body[data-layout="vertical"] .table-hover > tbody > tr:hover {
    --bs-table-accent-bg: rgba(11, 59, 66, .055);
}

/* Return-reason proportion bars.
   Thin and low-contrast on purpose: the ranking is the message, and a row of
   saturated bars would out-shout the four hero metrics directly above them. */

body[data-layout="vertical"] .nvd-share-track {
    height: 4px;
    margin-top: .4rem;
    border-radius: 2px;
    background: #EFE7DA;
    overflow: hidden;
}

body[data-layout="vertical"] .nvd-share-fill {
    height: 100%;
    border-radius: 2px;
    background: #4EB1BE;
    min-width: 2px;
}

/* Cards breathe: the theme's default stacking left no gap between rows. */
body[data-layout="vertical"] .card {
    margin-bottom: 1.25rem;
}

body[data-layout="vertical"] .page-title-box {
    padding-bottom: .25rem;
}

/* ── Tables inset from the card edge ─────────────────────────────────────
   A table-bodied card is rendered with :padded="false" so rows span the full
   width and .table-responsive can scroll without fighting a parent's padding.
   The side effect is that the outer columns wear only the theme's .5rem cell
   padding, leaving the first and last values almost touching the card border.

   1rem matches the .p-3 the filter bar and the pagination footer already use,
   so the first column lines up with the controls above it rather than merely
   being "less cramped". Scoped to > .p-0 on purpose: a table inside a normal
   padded .card-body already has its inset and would otherwise get it twice. */

body[data-layout="vertical"] .card > .p-0 .table > :not(caption) > * > *:first-child {
    padding-left: 1rem;
}

body[data-layout="vertical"] .card > .p-0 .table > :not(caption) > * > *:last-child {
    padding-right: 1rem;
}

/* ── Type scale ──────────────────────────────────────────────────────────
   The theme ships a 13px body (0.8125rem) with a 1.5 line-height, and repeats
   the same 12–13px in hardcoded pixels across roughly sixty rules. On a modern
   display that is a squint, and it was the merchant's own first complaint about
   the admin: "texts are so small".

   Raising `body` alone would move almost nothing, because those rules state
   their own pixels. So the surfaces people actually read are named here.
   15px for prose and controls, 1.6 line-height for the extra air; column
   headers stay small deliberately — they are labels, not reading matter, and
   uppercase at 15px would shout over the data beneath them. */

body[data-layout="vertical"],
body[data-layout="vertical"] .table,
body[data-layout="vertical"] .form-control,
body[data-layout="vertical"] .form-select,
body[data-layout="vertical"] .btn,
body[data-layout="vertical"] .dropdown-menu {
    font-size: .9375rem;
    line-height: 1.6;
}

body[data-layout="vertical"] .table > thead > tr > th {
    font-size: .8125rem;
    letter-spacing: .02em;
    color: #55707A;
}

/* Rows were built for 13px; 15px needs the vertical room to match. */
body[data-layout="vertical"] .table > :not(caption) > * > * {
    padding-top: .7rem;
    padding-bottom: .7rem;
}

body[data-layout="vertical"] .card-title {
    font-size: 1.0625rem;
    font-weight: 600;
}

/* .font-13 is the theme's muted-subtitle utility and carries !important, so
   matching that is the only way to lift it. */
body[data-layout="vertical"] .font-13 {
    font-size: .875rem !important;
}

body[data-layout="vertical"] .left-sidenav-menu li > a {
    font-size: .875rem;
}

/* ── The small text the first pass could not reach ───────────────────────
   Found by auditing all seventeen admin pages in a browser, not by reading the
   stylesheet — which is the point. Every item here either sits behind an
   !important or inherits its size from a container, so the obvious selectors
   were written, shipped, and silently did nothing. */

/* theme.css sets `.badge` to 11px !important. Specificity cannot beat that;
   only matching the !important can. */
body[data-layout="vertical"] .badge {
    font-size: .8125rem !important;
}

/* Sidebar section headings — at 10px, the smallest text in the product. They
   stay the smallest thing on screen, just no longer unreadably so. */
body[data-layout="vertical"] .left-sidenav .menu-label {
    font-size: .75rem;
    letter-spacing: .06em;
}

/* Breadcrumbs carry no font-size of their own; 12px arrives by inheritance,
   so the container is the only place this can be set. */
body[data-layout="vertical"] .breadcrumb,
body[data-layout="vertical"] .breadcrumb-item,
body[data-layout="vertical"] .breadcrumb-item a {
    font-size: .875rem;
}

/* Form labels: 12px asking for a value typed at 15px read as an afterthought. */
body[data-layout="vertical"] label,
body[data-layout="vertical"] .form-label {
    font-size: .875rem;
}

/* ── Contrast ────────────────────────────────────────────────────────────
   Measured against WCAG AA rather than judged by eye.

   The theme's .text-muted is #a4abc5, which is 2.28:1 on a white card and
   2.06:1 on the paper background — less than half the 4.5:1 that normal text
   needs, and it carries every subtitle, every helper line and most of the
   secondary copy in the product. Making the type bigger did nothing for that;
   the colour was the problem.

   #666a7a measures 5.37:1 on white and 4.86:1 on paper. Still plainly
   secondary, and now actually readable. */
body[data-layout="vertical"] .text-muted {
    color: #666a7a !important;
}

/*
 * Status badges put a fully-saturated colour on a 10% tint of itself, which
 * looks tidy and is nearly unreadable: "Received" measured 1.65:1 and
 * "Connected" 1.77:1 against their own backgrounds. These are the labels that
 * carry a return's state — the one word on the row a merchant actually needs.
 *
 * The tints stay, so the chips look the same at a glance. Only the text
 * darkens, each to the least amount that clears 4.5:1 on its own tint, so the
 * hue still reads as green, amber or red. `primary` is untouched: it already
 * measured 4.51:1.
 *
 * !important because theme.css declares these !important — the same trap the
 * badge font-size fell into. Specificity is irrelevant against it; only
 * matching it works.
 */
body[data-layout="vertical"] .badge.bg-soft-success   { color: #02824c !important; }
body[data-layout="vertical"] .badge.bg-soft-warning   { color: #946b14 !important; }
body[data-layout="vertical"] .badge.bg-soft-danger    { color: #d02a4e !important; }
body[data-layout="vertical"] .badge.bg-soft-info      { color: #0d78ad !important; }
body[data-layout="vertical"] .badge.bg-soft-secondary { color: #5f6778 !important; }

/* ── Focus ───────────────────────────────────────────────────────────────
   There was no focus indicator anywhere in the admin. Not a faint one — none:
   this Bootstrap build ships `.form-control:focus { box-shadow: none }` with
   `outline: 0`, and theme.css repeats it. Every interactive element measured
   the same, so a keyboard user had no way to tell where they were on any
   screen. The sidebar alone is fifteen tab stops of that.

   :focus-visible rather than :focus, so a mouse click does not draw a ring —
   which is presumably why the theme reached for `outline: 0` in the first
   place, and is a real complaint about the browser default, just not one worth
   solving by making focus invisible.

   The brand orange reads on both grounds: 4.9:1 on the white cards and 5.1:1
   on the dark sidebar, so the same colour works throughout rather than needing
   one ring for the chrome and another for the content.

   !important is not optional here. theme.css carries a blanket

       * { outline: none !important }

   which removes the indicator from every element in the application at once —
   no specificity can beat it, only a matching !important. That rule is the
   whole reason focus was invisible, and it is worth knowing it is there before
   wondering why a perfectly good focus style does nothing. */

body[data-layout="vertical"] a:focus-visible,
body[data-layout="vertical"] button:focus-visible,
body[data-layout="vertical"] .btn:focus-visible,
body[data-layout="vertical"] .nav-link:focus-visible,
body[data-layout="vertical"] .form-control:focus-visible,
body[data-layout="vertical"] .form-select:focus-visible,
body[data-layout="vertical"] .form-check-input:focus-visible,
body[data-layout="vertical"] summary:focus-visible,
body[data-layout="vertical"] [tabindex]:not([tabindex="-1"]):focus-visible {
    outline: 2px solid #FF8A00 !important;
    outline-offset: 2px !important;
}

/* A text field keeps its ring tight to the border: 2px of offset on an input
   sitting flush in a filter row collides with whatever is beside it. */
body[data-layout="vertical"] .form-control:focus-visible,
body[data-layout="vertical"] .form-select:focus-visible {
    outline-offset: 0 !important;
}

/*
 * A count inside the selected filter tab.
 *
 * The tab turns brand blue and its label turns white, but the badge kept the
 * colours it wears on a white card — grey text on an 8% grey tint, over blue.
 * Measured 1.00:1: the number was not faint, it was invisible. The returns
 * list opens on "Needs action", so the count a merchant most wants to see was
 * the one guaranteed to be missing.
 *
 * A dark overlay rather than a light one: it deepens the blue underneath, so
 * white sits well clear of it and the chip still reads as a chip.
 */
body[data-layout="vertical"] .nav-link.active .badge {
    color: #ffffff !important;
    background-color: rgba(0, 0, 0, .22) !important;
}


/* ── Corners ─────────────────────────────────────────────────────────────
   The theme's 3–5px radii are what read as unfinished more than any single
   spacing choice. Softened once, here, rather than per component. */

body[data-layout="vertical"] .card {
    border-radius: 10px;
}

body[data-layout="vertical"] .btn,
body[data-layout="vertical"] .form-control,
body[data-layout="vertical"] .form-select,
body[data-layout="vertical"] .dropdown-menu {
    border-radius: 8px;
}

body[data-layout="vertical"] .badge {
    border-radius: 6px;
}

/* A header keeping the theme's 3px against a 10px card is the exact mismatch
   that reads as unfinished, so both ends follow the card. */
body[data-layout="vertical"] .card > .card-header:first-child {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

body[data-layout="vertical"] .card > .card-footer:last-child {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

/* A full-bleed table is square-cornered and would poke through the card's
   rounded bottom; clipping is simpler than rounding the last row's cells. */
body[data-layout="vertical"] .card > .p-0:last-child {
    overflow: hidden;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

/* ══ Modern responsive shell ─────────────────────────────────────────────
   Refreshes spacing, surfaces and mobile behaviour without replacing the
   Dastone layout hierarchy the theme CSS is written against. */

body.nvd-admin[data-layout="vertical"] {
    background-color: #F0F4F5;
}

body.nvd-admin .page-wrapper .page-content {
    padding-bottom: 2rem;
}

body.nvd-admin .nvd-content {
    width: 100%;
    max-width: 1440px;
    margin-inline: auto;
    padding-inline: clamp(1rem, 2.5vw, 1.75rem);
    padding-top: 1.25rem;
}

@media (max-width: 1316.98px) {
    body.nvd-admin .nvd-content {
        padding-top: .75rem;
    }
}

/* Topbar — light chrome */
body.nvd-admin .nvd-topbar {
    position: sticky;
    top: 0;
    z-index: 1001;
    background: #ffffff;
    border-bottom: 1px solid #E4EBED;
    box-shadow: 0 1px 3px rgba(11, 59, 66, .04);
}

body.nvd-admin .nvd-topbar-nav {
    background: #ffffff !important;
    min-height: 64px;
    border-bottom: none;
    padding: 0;
}

body.nvd-admin .nvd-topbar-inner {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
    min-height: 64px;
    padding: 0 clamp(.75rem, 2vw, 1.25rem);
}

@media (max-width: 991.98px) {
    body.nvd-admin .nvd-topbar-inner {
        justify-content: space-between;
        min-height: 56px;
    }

    body.nvd-admin .nvd-topbar-nav {
        min-height: 56px;
    }

    body.nvd-admin .nvd-topbar-start {
        min-width: 0;
        flex: 1 1 auto;
    }

    body.nvd-admin .nvd-topbar-actions {
        flex-shrink: 0;
    }
}

body.nvd-admin .nvd-topbar-start,
body.nvd-admin .nvd-topbar-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
}

body.nvd-admin .nvd-topbar-actions {
    float: none !important;
    height: auto !important;
    margin-left: auto;
    list-style: none;
}

body.nvd-admin .nvd-topbar-item {
    float: none !important;
    list-style: none;
}

body.nvd-admin .nvd-topbar-mark {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    text-decoration: none;
    color: #0B3B42;
    font-weight: 600;
    font-size: .95rem;
}

body.nvd-admin .nvd-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: #3D5A62;
    line-height: 1;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}

body.nvd-admin .nvd-icon-btn:hover,
body.nvd-admin .nvd-icon-btn:focus-visible {
    background: #F0F4F5;
    color: #0B3B42;
}

body.nvd-admin .nvd-icon-btn--ghost {
    text-decoration: none;
}

body.nvd-admin .nvd-store-pill,
body.nvd-admin .nvd-user-pill {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    max-width: min(280px, 42vw);
    padding: .4rem .65rem .4rem .5rem;
    border-radius: 999px;
    background: #F0F4F5;
    border: 1px solid #E4EBED;
    color: #0B3B42 !important;
    text-decoration: none;
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.2;
    transition: background .15s ease, border-color .15s ease;
}

body.nvd-admin .nvd-store-pill:hover,
body.nvd-admin .nvd-user-pill:hover {
    background: #E8F0F2;
    border-color: #D5E0E2;
}

body.nvd-admin .nvd-store-pill-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #ffffff;
    color: #FF8A00;
    flex-shrink: 0;
}

body.nvd-admin .nvd-store-pill-chevron {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    opacity: .55;
}

body.nvd-admin .nvd-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: linear-gradient(135deg, #FF8A00 0%, #E67C00 100%);
    color: #ffffff;
    font-size: .8rem;
    font-weight: 700;
    flex-shrink: 0;
}

body.nvd-admin .nvd-topbar-menu {
    border: 1px solid #E2EAEA;
    box-shadow: 0 16px 40px rgba(11, 59, 66, .14);
    border-radius: 12px;
    padding: .35rem;
    min-width: 240px;
    margin-top: .5rem;
    background: #ffffff;
    list-style: none;
}

body.nvd-admin .nvd-topbar-menu-header {
    list-style: none;
}

body.nvd-admin .nvd-topbar-menu-header p {
    list-style: none;
    margin-bottom: 0;
}

body.nvd-admin .nvd-topbar-menu-body {
    padding-top: .15rem;
}

body.nvd-admin .nvd-topbar-menu .dropdown-item {
    display: flex;
    align-items: center;
    width: 100%;
    border: 0;
    background: transparent;
    border-radius: 8px;
    padding: .5rem .75rem;
    font-size: .875rem;
    color: #0B3B42;
    text-decoration: none;
    white-space: nowrap;
}

body.nvd-admin .nvd-topbar-menu .dropdown-item:hover,
body.nvd-admin .nvd-topbar-menu .dropdown-item:focus {
    background: #F0F4F5;
    color: #0B3B42;
}

body.nvd-admin .nvd-topbar-menu .dropdown-item.active,
body.nvd-admin .nvd-topbar-menu .dropdown-item:active {
    background: rgba(255, 138, 0, .12);
    color: #0B3B42;
}

body.nvd-admin .nvd-topbar-menu .dropdown-item.text-danger:hover {
    background: rgba(255, 82, 51, .08);
    color: #E04520;
}

body.nvd-admin .nvd-topbar-menu .dropdown-header {
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8FA8AE;
}

body.nvd-admin .nvd-topbar-menu form {
    margin: 0;
}

body.nvd-admin .nvd-topbar .dropdown-toggle::after {
    display: none;
}

body.nvd-admin .nvd-topbar .nav-link {
    line-height: 1.2 !important;
    max-height: none !important;
    padding: 0;
}

body.nvd-admin .nvd-topbar .dropdown-menu {
    z-index: 1055;
}

@media (max-width: 1316.98px) {
    body.nvd-admin .page-wrapper .page-content {
        margin-top: 64px;
    }
}

/* Sidebar — balanced density, professional navigation */
body.nvd-admin .nvd-sidebar {
    display: flex;
    flex-direction: column;
    min-width: 252px;
    max-width: 252px;
    min-height: 100vh;
    max-height: 100vh;
    border-right: 1px solid rgba(255, 255, 255, .06);
}

body.nvd-admin .page-wrapper {
    margin-left: 252px;
}

body.nvd-admin .nvd-sidebar-brand {
    flex-shrink: 0;
    height: auto;
    padding: 1rem 1rem .875rem;
    text-align: left;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

body.nvd-admin .nvd-sidebar-logo {
    display: flex !important;
    align-items: center;
    gap: .625rem;
    line-height: 1 !important;
    text-decoration: none;
}

body.nvd-admin .nvd-sidebar-mark {
    width: 32px;
    height: 32px;
    object-fit: contain;
    flex-shrink: 0;
    display: block !important;
}

body.nvd-admin .nvd-sidebar-wordmark {
    height: 21px !important;
    width: auto !important;
    max-width: 165px;
    margin-left: 0 !important;
    display: inline-block !important;
}

body.nvd-admin .nvd-sidebar-scroll {
    flex: 1 1 auto;
    min-height: 0;
    height: auto !important;
    display: flex;
    flex-direction: column;
}

body.nvd-admin .left-sidenav-menu {
    padding: .5rem .625rem .75rem;
    flex: 1 1 auto;
}

body.nvd-admin .left-sidenav-menu li {
    margin-top: 0;
}

body.nvd-admin .left-sidenav-menu li > a {
    position: relative;
    display: flex;
    align-items: center;
    gap: .625rem;
    margin: 2px 0;
    padding: .4375rem .65rem;
    min-height: 36px;
    border-radius: 8px;
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -.01em;
    transition: background .15s ease, color .15s ease;
}

body.nvd-admin .left-sidenav-menu li > a:hover,
body.nvd-admin .left-sidenav-menu li > a:focus-visible {
    background: rgba(255, 255, 255, .06);
    color: #ffffff;
}

body.nvd-admin .left-sidenav-menu li.mm-active > a,
body.nvd-admin .left-sidenav-menu li > a.active {
    background: rgba(255, 138, 0, .14);
    color: #FFB347 !important;
}

body.nvd-admin .nvd-nav-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    background: rgba(255, 255, 255, .05);
    flex-shrink: 0;
    transition: background .15s ease;
}

body.nvd-admin .nvd-nav-icon--sub {
    width: 22px;
    height: 22px;
    border-radius: 6px;
    background: transparent;
}

body.nvd-admin .left-sidenav-menu li > a:hover .nvd-nav-icon {
    background: rgba(255, 255, 255, .09);
}

body.nvd-admin .left-sidenav-menu li > a.active .nvd-nav-icon,
body.nvd-admin .left-sidenav-menu li.mm-active > a .nvd-nav-icon {
    background: rgba(255, 138, 0, .2);
}

body.nvd-admin .left-sidenav-menu li > a .menu-icon {
    width: 17px;
    height: 17px;
    margin-right: 0;
    flex-shrink: 0;
}

body.nvd-admin .nvd-nav-label {
    flex: 1 1 auto;
    min-width: 0;
}

body.nvd-admin .left-sidenav-menu li > a .nvd-count {
    float: none;
    margin-left: auto;
    flex-shrink: 0;
}

body.nvd-admin .nvd-nav-chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    opacity: .65;
    transition: transform .2s ease;
}

body.nvd-admin .nvd-nav-chevron svg {
    width: 15px;
    height: 15px;
}

body.nvd-admin .left-sidenav-menu li.mm-active > a .nvd-nav-chevron {
    transform: rotate(90deg);
    opacity: .85;
}

body.nvd-admin .left-sidenav .menu-label.nvd-nav-section {
    padding: .625rem .65rem .3rem;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .08em;
}

body.nvd-admin .left-sidenav-menu > li.nvd-nav-section,
body.nvd-admin .left-sidenav .menu-label.nvd-nav-section:not(.mt-0) {
    margin-top: .375rem;
    padding-top: .75rem !important;
    border-top: 1px solid rgba(255, 255, 255, .06);
}

body.nvd-admin .left-sidenav-menu > li.nvd-group-start {
    margin-top: .875rem !important;
}

body.nvd-admin .nav-second-level .nav-link {
    padding: .375rem .625rem;
    font-size: .8125rem;
    min-height: 32px;
}

body.nvd-admin .nav-second-level .nav-link .nvd-nav-icon--sub {
    width: 22px;
    height: 22px;
}

body.nvd-admin .nav-second-level .nav-link.active .nvd-nav-icon--sub {
    background: rgba(255, 138, 0, .14);
}

body.nvd-admin .nvd-sidebar-footer {
    flex-shrink: 0;
    padding: .625rem .625rem .75rem;
    border-top: 1px solid rgba(255, 255, 255, .08);
    background: rgba(0, 0, 0, .14);
}

body.nvd-admin .nvd-sidebar-store {
    margin: 0;
    padding: .75rem .8rem;
    border-radius: 10px;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .08);
}

body.nvd-admin .nvd-sidebar-store-label {
    margin: 0 0 .2rem;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8FB4BA;
}

body.nvd-admin .nvd-sidebar-store-name {
    margin: 0 0 .4rem;
    font-size: .875rem;
    font-weight: 600;
    color: #ffffff;
}

body.nvd-admin .nvd-sidebar-store-link {
    display: inline-block;
    margin-top: .4rem;
    font-size: .8125rem;
    font-weight: 500;
    color: #FFB347;
    text-decoration: none;
}

body.nvd-admin .nvd-sidebar-store-link:hover {
    color: #FF8A00;
    text-decoration: underline;
}

body.nvd-admin .nvd-sidebar-connect {
    padding: .75rem .8rem;
    border-radius: 10px;
    background: rgba(255, 138, 0, .1);
    border: 1px solid rgba(255, 138, 0, .22);
}

body.nvd-admin .nvd-sidebar-connect-title {
    margin: 0 0 .2rem;
    font-size: .8125rem;
    font-weight: 600;
    color: #ffffff;
}

body.nvd-admin .nvd-sidebar-connect-copy {
    margin: 0 0 .625rem;
    font-size: .75rem;
    line-height: 1.45;
    color: #B6D2D6;
}

body.nvd-admin .nvd-sidebar-connect-btn {
    font-size: .8125rem;
    font-weight: 600;
    padding: .4rem .625rem;
}

body.nvd-admin .nav-second-level .nav-link .nvd-count {
    float: none;
    margin-left: auto;
}

/* Topbar — connect CTA when no store */
body.nvd-admin .nvd-connect-cta {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .45rem .85rem;
    border-radius: 999px;
    background: #FF8A00;
    color: #ffffff !important;
    font-size: .875rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s ease;
    border: 0;
}

body.nvd-admin .nvd-connect-cta-label {
    line-height: 1;
}

body.nvd-admin .nvd-connect-cta:hover {
    background: #E67C00;
    color: #ffffff !important;
}

body.nvd-admin .nvd-connect-cta .topbar-icon {
    width: 16px;
    height: 16px;
}

/* Page header */
body.nvd-admin .nvd-page-header {
    margin-bottom: 1.5rem;
}

body.nvd-admin .nvd-page-subtitle {
    max-width: 42rem;
    font-size: .9375rem;
    line-height: 1.5;
}

/* Layout — desktop sidebar docked, mobile off-canvas drawer */
@media (min-width: 992px) {
    body.nvd-admin.enlarge-menu .left-sidenav,
    body.nvd-admin .left-sidenav {
        display: flex !important;
        transform: none !important;
    }

    body.nvd-admin .page-wrapper,
    body.nvd-admin.enlarge-menu .page-wrapper {
        margin-left: 252px !important;
    }
}

@media (max-width: 991.98px) {
    body.nvd-admin .left-sidenav {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1002;
        margin-top: 0 !important;
        min-width: min(280px, 88vw);
        max-width: min(280px, 88vw);
        transform: translateX(-100%);
        transition: transform .25s ease, box-shadow .25s ease;
        box-shadow: none;
    }

    body.nvd-admin.enlarge-menu .left-sidenav,
    body.nvd-admin .left-sidenav {
        display: flex !important;
    }

    body.nvd-admin.nvd-sidebar-open .left-sidenav {
        transform: translateX(0);
        box-shadow: 8px 0 40px rgba(0, 0, 0, .28);
    }

    body.nvd-admin.nvd-sidebar-open {
        overflow: hidden;
    }

    body.nvd-admin .page-wrapper,
    body.nvd-admin.enlarge-menu .page-wrapper {
        margin-left: 0 !important;
    }

    body.nvd-admin .page-wrapper .page-content {
        margin-top: 56px;
    }
}

.nvd-sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1001;
    border: 0;
    padding: 0;
    margin: 0;
    background: rgba(7, 39, 44, .55);
    cursor: pointer;
    opacity: 0;
    transition: opacity .25s ease;
}

.nvd-sidebar-backdrop.is-visible {
    opacity: 1;
}

@media (min-width: 992px) {
    .nvd-sidebar-backdrop {
        display: none !important;
    }
}

/* Cards */
body.nvd-admin .card {
    background: #ffffff;
    border-color: #E2EAEA;
    box-shadow: 0 1px 2px rgba(11, 59, 66, .04), 0 8px 24px rgba(11, 59, 66, .06);
    border-radius: 12px;
}

body.nvd-admin .card-header {
    background: transparent;
    border-bottom: 1px solid #EEF2F3;
    padding: 1.15rem 1.35rem;
}

body.nvd-admin .card > .card-body {
    padding: 1.35rem;
}

body.nvd-admin .card > .card-header:first-child {
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

body.nvd-admin .card > .card-footer:last-child {
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}

body.nvd-admin .card > .p-0:last-child {
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}

/* Alerts */
body.nvd-admin .alert {
    border-radius: 10px;
    padding: .85rem 1rem;
}

body.nvd-admin .alert.border-0 {
    border: 1px solid transparent !important;
}

body.nvd-admin .alert-primary.bg-soft-primary {
    background-color: rgba(51, 153, 240, .1) !important;
    border-color: rgba(51, 153, 240, .2) !important;
}

body.nvd-admin .alert-warning.bg-soft-warning {
    background-color: rgba(255, 138, 0, .1) !important;
    border-color: rgba(255, 138, 0, .22) !important;
}

body.nvd-admin .alert-success.bg-soft-success {
    background-color: rgba(78, 177, 190, .12) !important;
    border-color: rgba(78, 177, 190, .22) !important;
}

body.nvd-admin .alert-danger.bg-soft-danger {
    background-color: rgba(255, 82, 51, .1) !important;
    border-color: rgba(255, 82, 51, .2) !important;
}

/* Page title */
body.nvd-admin .page-title-box {
    margin-bottom: 1.25rem;
}

body.nvd-admin .page-title {
    font-size: 1.35rem;
    font-weight: 600;
    color: #0B3B42;
    letter-spacing: -.01em;
}

@media (max-width: 575.98px) {
    body.nvd-admin .page-title-box .breadcrumb {
        display: none;
    }

    body.nvd-admin .page-title {
        font-size: 1.2rem;
    }
}

/* Forms */
body.nvd-admin .form-control,
body.nvd-admin .form-select {
    border-color: #D5E0E2;
    padding: .6rem .85rem;
}

body.nvd-admin .form-control:focus,
body.nvd-admin .form-select:focus {
    border-color: #FF8A00;
    box-shadow: 0 0 0 3px rgba(255, 138, 0, .15);
}

/* Setup walkthrough screenshots */
body.nvd-admin .nvd-setup-screenshot {
    border: 1px solid #E2EAEA;
    border-radius: 10px;
    overflow: hidden;
    background: #FAFCFC;
    transition: box-shadow .2s ease, transform .2s ease;
}

body.nvd-admin .nvd-setup-screenshot:hover {
    box-shadow: 0 8px 24px rgba(11, 59, 66, .1);
    transform: translateY(-1px);
}

body.nvd-admin .nvd-setup-screenshot img {
    width: 100%;
    height: auto;
    display: block;
}

@media (max-width: 767.98px) {
    body.nvd-admin .nvd-content {
        padding-inline: .875rem;
        padding-top: .75rem;
    }

    body.nvd-admin .card-header,
    body.nvd-admin .card > .card-body {
        padding: 1rem;
    }

    body.nvd-admin .table-responsive {
        -webkit-overflow-scrolling: touch;
    }

    body.nvd-admin .page-title {
        font-size: 1.125rem;
    }

    body.nvd-admin .nvd-page-header {
        margin-bottom: 1rem;
    }

    body.nvd-admin .nvd-page-subtitle {
        font-size: .875rem;
    }

    body.nvd-admin .nvd-store-pill-text {
        max-width: 6rem;
    }

    body.nvd-admin .nvd-connect-cta {
        padding: .45rem;
        min-width: 40px;
        min-height: 40px;
        justify-content: center;
    }

    body.nvd-admin .nvd-connect-cta-label {
        display: none;
    }

    body.nvd-admin .nvd-user-pill-name {
        display: none !important;
    }

    body.nvd-admin .nvd-setup-screenshot:hover {
        transform: none;
    }
}

@media (max-width: 575.98px) {
    body.nvd-admin .nvd-store-pill-text,
    body.nvd-admin .nvd-store-pill-chevron {
        display: none;
    }

    body.nvd-admin .nvd-store-pill {
        padding-inline: .5rem;
    }
}