/* =========================================================
   NAVKAR STORE - artwork editor, toasts, cart & checkout
   ========================================================= */

/* ---------- Modal above sticky header ---------- */

body #artworkUploadModal { z-index: 100001 !important; }
body .modal-backdrop { z-index: 100000 !important; }

/* ---------- Artwork editor ---------- */

.art-side {
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 14px;
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.art-side.has-error { border-color: #dc3545; box-shadow: 0 0 0 3px rgba(220, 53, 69, .12); }

.art-side-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
}

.art-side-head h5 { margin: 0; font-size: 17px; font-weight: 700; }
.art-side-head .art-size { font-size: 12px; color: var(--np-text, #555b6d); margin-left: auto; }

.art-remove {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 50%;
    background: #fff;
    color: var(--np-text, #555b6d);
    line-height: 1;
    align-self: center;
}

.art-remove:hover { border-color: #dc3545; color: #dc3545; }
.art-remove.disabled { pointer-events: none; opacity: .5; }

/* The one upload for all artwork files (above the file cards) */
.art-multi-drop {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 150px;
    margin: 0 0 20px;
    padding: 18px;
    border: 2px dashed #cfd3de;
    border-radius: 14px;
    background: #fafbfc;
    color: var(--np-text, #555b6d);
    text-align: center;
    cursor: pointer;
    transition: border-color .2s ease, background .2s ease, min-height .2s ease;
}

.art-multi-drop i { font-size: 32px; color: var(--np-pink, #e7287c); }
.art-multi-drop strong { color: var(--np-dark, #09052f); font-size: 16px; }
.art-multi-drop small { font-size: 12px; }

.art-multi-drop:hover,
.art-multi-drop.is-dragover {
    border-color: var(--np-pink, #e7287c);
    background: rgba(231, 40, 124, .04);
}

/* With files chosen the upload shrinks to an "add more" bar */
.art-multi-drop.has-files { min-height: 0; flex-direction: row; flex-wrap: wrap; gap: 4px 10px; padding: 12px 18px; }
.art-multi-drop.has-files i { font-size: 22px; }
.art-multi-drop.has-files small { width: 100%; }
.art-multi-drop.is-full,
.art-multi-drop.disabled { opacity: .55; cursor: not-allowed; }
.art-multi-drop.has-error { border-color: #dc3545; box-shadow: 0 0 0 3px rgba(220, 53, 69, .12); }

.art-stage {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 260px;
    padding: 18px;
    border-radius: 10px;
    background:
        repeating-conic-gradient(#f1f2f6 0% 25%, #fafbfc 0% 50%) 50% / 20px 20px;
    overflow: hidden;
}

.art-stage canvas {
    display: none;
    max-width: 100%;
    max-height: 420px;
    box-shadow: 0 6px 24px rgba(25, 31, 56, .18);
    background: #fff;
}

.art-stage.has-image canvas { display: block; }
.art-stage.has-image .art-drop { display: none; }

.art-drop {
    position: absolute;
    inset: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 2px dashed #cfd3de;
    border-radius: 10px;
    cursor: pointer;
    color: var(--np-text, #555b6d);
    text-align: center;
    padding: 12px;
    transition: border-color .2s ease, background .2s ease;
}

.art-drop i { font-size: 28px; color: var(--np-pink, #e7287c); }
.art-drop strong { color: var(--np-dark, #09052f); }
.art-drop small { font-size: 12px; }

.art-stage.is-dragover .art-drop,
.art-drop:hover {
    border-color: var(--np-pink, #e7287c);
    background: rgba(231, 40, 124, .04);
}

.art-pdf-note {
    display: none;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
    color: var(--np-text, #555b6d);
}

.art-pdf-note i { font-size: 40px; color: #d93025; }
.art-stage.has-pdf .art-pdf-note { display: flex; }
.art-stage.has-pdf .art-drop { display: none; }

.art-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.art-controls .btn-group .btn,
.art-controls > .btn {
    font-size: 13px;
    padding: 6px 12px;
}

.art-mode.active {
    background: var(--np-pink, #e7287c) !important;
    border-color: var(--np-pink, #e7287c) !important;
    color: #fff !important;
}

.art-controls .art-replace { margin-left: auto; }

.art-file-name {
    font-size: 12px;
    color: var(--np-text, #555b6d);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 18px;
}

.art-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    font-size: 12px;
    color: var(--np-text, #555b6d);
}

.art-legend span::before {
    content: "";
    display: inline-block;
    width: 18px;
    height: 0;
    margin-right: 6px;
    vertical-align: middle;
    border-top: 2px solid;
}

.art-legend .lg-bleed::before { border-color: rgba(231, 40, 124, .55); border-top-width: 8px; }
.art-legend .lg-cut::before { border-color: #e7287c; }
.art-legend .lg-safe::before { border-color: #2873ba; border-top-style: dashed; }

.art-warning {
    display: none;
    font-size: 12px;
    color: #9a6700;
    background: #fff8e1;
    border-radius: 8px;
    padding: 6px 10px;
}

.art-warning.show { display: block; }

#artworkStatus { font-size: 13px; }

/* ---------- Buttons busy ---------- */

.theme-btn[disabled],
.theme-btn.is-busy {
    opacity: .7;
    pointer-events: none;
}

/* ---------- Toasts ---------- */

#np-toasts {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 100010;
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: min(360px, calc(100vw - 40px));
}

.np-toast {
    padding: 12px 16px;
    border-radius: 10px;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
    opacity: 0;
    transform: translateY(10px);
    transition: opacity .3s ease, transform .3s ease;
}

.np-toast.show { opacity: 1; transform: translateY(0); }
.np-toast-success { background: #1f9d55; }
.np-toast-error { background: #d93025; }

/* ---------- Cart page ---------- */

.np-cart-table {
    width: 100%;
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 14px;
    overflow: hidden;
}

.np-cart-row {
    display: grid;
    grid-template-columns: 96px 1fr 120px 130px 110px 40px;
    gap: 16px;
    align-items: center;
    padding: 18px 20px;
    border-bottom: 1px solid var(--np-border, #eceef4);
}

.np-cart-row:last-child { border-bottom: 0; }

.np-cart-head {
    background: var(--np-soft, #f8f9fc);
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--np-dark, #09052f);
    padding-top: 14px;
    padding-bottom: 14px;
}

.np-cart-thumb img {
    width: 96px;
    height: 96px;
    object-fit: contain;
    border-radius: 10px;
    background: var(--np-soft, #f8f9fc);
}

.np-cart-name { font-weight: 700; font-size: 16px; color: var(--np-dark, #09052f); }

.np-cart-sku { margin-top: 4px; font-size: 12px; color: var(--np-text, #555b6d); }

/* Selected details panel (spans the full cart row) */
.np-cart-details {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
    background: var(--np-soft, #f8f9fc);
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 12px;
}

.np-cd-title {
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--np-pink, #e7287c);
}

.np-cd-spec { margin: 0; font-size: 13px; }

.np-cd-spec > div {
    display: flex;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 1px dashed var(--np-border, #e1e4ec);
}

.np-cd-spec > div:last-child { border-bottom: 0; }

.np-cd-spec dt {
    flex: 0 0 42%;
    font-weight: 500;
    color: var(--np-text, #555b6d);
}

.np-cd-spec dd {
    flex: 1;
    margin: 0;
    font-weight: 700;
    color: var(--np-dark, #09052f);
    word-break: break-word;
}

.np-cd-chip {
    display: inline-block;
    margin: 0 6px 6px 0;
    padding: 2px 9px;
    border-radius: 20px;
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    font-weight: 600;
}

.np-cd-chip b { color: var(--np-pink, #e7287c); }

.np-cd-total dt, .np-cd-total dd { color: var(--np-dark, #09052f); font-weight: 800; }

/* Any number of artwork files: cards wrap into columns when there is room */
.np-cd-art { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.np-cd-art-count { font-weight: 400; color: var(--np-text, #555b6d); }

.np-cd-art-thumb.is-file {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    background: var(--np-soft, #f8f9fc);
    font-size: 26px;
    color: #d93025;
}

.np-cd-art-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px;
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 10px;
}

.np-cd-art-thumb img {
    display: block;
    width: 64px;
    height: 64px;
    object-fit: contain;
    border-radius: 8px;
    background: var(--np-soft, #f8f9fc);
}

.np-cd-art-info { min-width: 0; font-size: 13px; }

.np-cd-art-info strong { display: block; color: var(--np-dark, #09052f); }

.np-cd-art-file {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    color: var(--np-text, #555b6d);
}

.np-art-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }

.np-art-links a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    padding: 3px 9px;
    border-radius: 20px;
    background: var(--np-soft, #f8f9fc);
    border: 1px solid var(--np-border, #eceef4);
    color: var(--np-dark, #09052f);
}

.np-art-links a:hover { border-color: var(--np-pink, #e7287c); color: var(--np-pink, #e7287c); }

.np-qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 8px;
    overflow: hidden;
}

.np-qty button {
    width: 32px;
    height: 36px;
    border: 0;
    background: var(--np-soft, #f8f9fc);
    font-weight: 700;
}

.np-qty input {
    width: 52px;
    height: 36px;
    border: 0;
    text-align: center;
    font-weight: 600;
    -moz-appearance: textfield;
}

.np-qty input::-webkit-outer-spin-button,
.np-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.np-remove {
    border: 0;
    background: transparent;
    color: #999;
    font-size: 18px;
}

.np-remove:hover { color: #d93025; }

.np-summary {
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 14px;
    padding: 24px;
    position: sticky;
    top: 120px;
}

.np-summary h4 { margin-bottom: 18px; }

.np-summary-row {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    font-size: 15px;
}

.np-summary-row.total {
    margin-top: 8px;
    padding-top: 14px;
    border-top: 1px solid var(--np-border, #eceef4);
    font-size: 19px;
    font-weight: 700;
    color: var(--np-dark, #09052f);
}

.np-empty-cart {
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 14px;
}

.np-empty-cart i { font-size: 48px; color: var(--np-pink, #e7287c); margin-bottom: 16px; }

@media (max-width: 991px) {
    .np-cart-head { display: none; }
    .np-cart-row {
        grid-template-columns: 80px 1fr 40px;
        grid-template-areas:
            "thumb info remove"
            "thumb price price"
            "qty qty sub"
            "details details details";
    }
    .np-cart-details { grid-area: details; grid-template-columns: 1fr; }
    .np-cart-qty::before { content: "Qty: "; color: var(--np-text, #555b6d); }
    .np-cart-thumb { grid-area: thumb; }
    .np-cart-thumb img { width: 80px; height: 80px; }
    .np-cart-info { grid-area: info; }
    .np-cart-price { grid-area: price; }
    .np-cart-qty { grid-area: qty; }
    .np-cart-sub { grid-area: sub; text-align: right; font-weight: 700; }
    .np-cart-del { grid-area: remove; }
    .np-cart-price::before { content: "Price: "; color: var(--np-text, #555b6d); }
}

/* ---------- Checkout ---------- */

.np-checkout-card {
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 14px;
    padding: 28px;
}

.np-checkout-card h4 { margin-bottom: 20px; }

.np-checkout-card label {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 6px;
    color: var(--np-dark, #09052f);
}

.np-checkout-card .form-control {
    height: 48px;
    border-radius: 10px;
    border-color: var(--np-border, #eceef4);
}

.np-checkout-card textarea.form-control { height: auto; }

.np-checkout-card .form-control:focus {
    border-color: var(--np-pink, #e7287c);
    box-shadow: 0 0 0 3px rgba(231, 40, 124, .12);
}

.np-order-line {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid var(--np-border, #eceef4);
}

.np-order-line img {
    width: 54px;
    height: 54px;
    object-fit: contain;
    border-radius: 8px;
    background: var(--np-soft, #f8f9fc);
}

.np-order-line .name { flex: 1; font-size: 14px; font-weight: 600; line-height: 1.3; }
.np-order-line .name small { display: block; font-weight: 400; color: var(--np-text, #555b6d); }

.np-secure {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    font-size: 13px;
    color: var(--np-text, #555b6d);
}

.np-success-icon {
    width: 84px;
    height: 84px;
    margin: 0 auto 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 38px;
    color: #fff;
    background: #1f9d55;
}

.np-success-icon.pending { background: #f0ad4e; }

/* ---------- Hero: secondary slides use <h2 class="h1"> (one h1 per page) ---------- */

.hero-2 .hero-content .h1 { color: var(--white); font-size: 110px; line-height: 1; }
@media (max-width: 1399px) { .hero-2 .hero-content .h1 { font-size: 80px; } }
@media (max-width: 991px)  { .hero-2 .hero-content .h1 { font-size: 70px; } }
@media (max-width: 767px)  { .hero-2 .hero-content .h1 { font-size: 55px; } }
@media (max-width: 575px)  { .hero-2 .hero-content .h1 { font-size: 42px; } }

/* ---------- Header account menu ---------- */

.np-acct { position: relative; }

.np-acct-initial {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--np-pink, #e7287c);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
}

.np-acct-menu {
    position: absolute;
    top: calc(100% + 10px);
    right: -10px;
    z-index: 99999;
    width: 230px;
    padding: 6px 0;
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 12px;
    box-shadow: 0 18px 50px rgba(25, 31, 56, .14);
    visibility: hidden;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s;
}

/* Hover bridge across the gap above the menu */
.np-acct-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }

.np-acct:hover .np-acct-menu,
.np-acct:focus-within .np-acct-menu { visibility: visible; opacity: 1; transform: translateY(0); }

.np-acct-head { padding: 8px 16px 10px; border-bottom: 1px solid var(--np-border, #eceef4); margin-bottom: 4px; }
.np-acct-head strong { display: block; font-size: 14px; color: var(--np-dark, #09052f); }
.np-acct-head small { display: block; font-size: 12px; color: var(--np-text, #555b6d); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.np-acct-menu a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 600;
    color: var(--np-dark, #09052f);
}

.np-acct-menu a i { width: 16px; color: var(--np-text, #555b6d); }
.np-acct-menu a:hover { background: var(--np-soft, #f8f9fc); color: var(--np-pink, #e7287c); }

/* ---------- Auth pages (login / register / verify) ---------- */

.np-auth {
    max-width: 480px;
    margin: 0 auto;
    padding: 34px 32px;
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(25, 31, 56, .06);
}

.np-auth h3 { margin-bottom: 6px; }
.np-auth-sub { margin-bottom: 22px; color: var(--np-text, #555b6d); font-size: 15px; }

.np-auth-tabs {
    display: flex;
    gap: 6px;
    padding: 4px;
    margin-bottom: 20px;
    background: var(--np-soft, #f8f9fc);
    border-radius: 50px;
}

.np-auth-tab {
    flex: 1;
    padding: 9px 12px;
    border: 0;
    border-radius: 50px;
    background: transparent;
    font-size: 14px;
    font-weight: 700;
    color: var(--np-text, #555b6d);
    transition: background .2s ease, color .2s ease;
}

.np-auth-tab.active { background: #fff; color: var(--np-pink, #e7287c); box-shadow: 0 4px 14px rgba(25, 31, 56, .08); }

.np-auth-form label,
.np-co-pass label {
    display: block;
    margin: 12px 0 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--np-dark, #09052f);
}

.np-auth-form .row label { margin-top: 0; }

.np-auth-label-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.np-auth-label-row a { font-size: 13px; font-weight: 600; color: var(--np-pink, #e7287c); }

.np-auth-form .form-control {
    height: 48px;
    border-radius: 10px;
    border: 1px solid var(--np-border, #e1e4ec);
    color: var(--np-dark, #09052f);
}

.np-auth-form .form-control:focus { border-color: var(--np-pink, #e7287c); box-shadow: 0 0 0 3px rgba(231, 40, 124, .1); }

.np-auth-hint { margin: 8px 0 0; font-size: 13px; color: var(--np-text, #555b6d); }

.np-code-input {
    font-size: 22px !important;
    font-weight: 700;
    letter-spacing: 10px;
    text-align: center;
}

.np-auth-resend { margin-top: 16px; font-size: 14px; color: var(--np-text, #555b6d); }

.np-link-btn {
    padding: 0;
    border: 0;
    background: none;
    font-weight: 700;
    color: var(--np-pink, #e7287c);
    text-decoration: underline;
}

.np-auth-foot {
    margin: 22px 0 0;
    padding-top: 18px;
    border-top: 1px solid var(--np-border, #eceef4);
    text-align: center;
    font-size: 14px;
}

.np-auth-foot a { font-weight: 700; color: var(--np-pink, #e7287c); }

/* ---------- Account area ---------- */

.np-acc-nav {
    padding: 18px;
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 14px;
    position: sticky;
    top: 120px;
}

.np-acc-user {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 14px;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--np-border, #eceef4);
}

.np-acc-user > div { min-width: 0; }
.np-acc-user strong { display: block; font-size: 15px; color: var(--np-dark, #09052f); }
.np-acc-user small { display: block; font-size: 12px; color: var(--np-text, #555b6d); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.np-acc-avatar {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--np-pink, #e7287c);
    color: #fff;
    font-weight: 700;
    font-size: 17px;
}

.np-acc-nav a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    color: var(--np-dark, #09052f);
}

.np-acc-nav a i { width: 16px; color: var(--np-text, #555b6d); }
.np-acc-nav a:hover, .np-acc-nav a.active { background: var(--np-soft, #f8f9fc); color: var(--np-pink, #e7287c); }
.np-acc-nav a.active i { color: var(--np-pink, #e7287c); }

.np-acc-card {
    padding: 26px 28px;
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 14px;
}

.np-acc-card > h4 { margin-bottom: 18px; }
.np-acc-narrow { max-width: 560px; }

.np-acc-empty { padding: 40px 10px; text-align: center; color: var(--np-text, #555b6d); }
.np-acc-empty i { display: block; margin-bottom: 12px; font-size: 44px; color: var(--np-pink, #e7287c); }

.np-orders { border: 1px solid var(--np-border, #eceef4); border-radius: 12px; overflow: hidden; }

.np-orders-row {
    display: grid;
    grid-template-columns: 1.4fr 1fr .6fr 1fr 1fr 24px;
    gap: 12px;
    align-items: center;
    padding: 14px 18px;
    border-bottom: 1px solid var(--np-border, #eceef4);
    font-size: 14px;
    color: var(--np-dark, #09052f);
    transition: background .15s ease;
}

.np-orders-row:last-child { border-bottom: 0; }
a.np-orders-row:hover { background: var(--np-soft, #f8f9fc); color: var(--np-dark, #09052f); }

.np-orders-head {
    background: var(--np-soft, #f8f9fc);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.np-o-num { font-weight: 700; }
.np-o-go { color: var(--np-text, #555b6d); text-align: right; }

.np-status {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    background: #eef1f7;
    color: #555b6d;
}

.np-status-processing, .np-status-in_production, .np-status-ready { background: #e8f1fb; color: #2873ba; }
.np-status-completed, .np-status-delivered, .np-status-shipped { background: #e6f6ef; color: #18865b; }
.np-status-refunded, .np-status-cancelled, .np-status-failed { background: #fdecec; color: #c0392b; }

.np-acc-order-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--np-border, #eceef4);
}

.np-acc-order-head h4 { margin: 0 0 4px; }
.np-acc-order-head p { margin: 0; font-size: 14px; color: var(--np-text, #555b6d); }

.np-acc-item {
    display: grid;
    grid-template-columns: 80px 1fr auto;
    gap: 16px;
    padding: 16px 0;
    border-bottom: 1px solid var(--np-border, #eceef4);
}

.np-acc-item img {
    width: 80px;
    height: 80px;
    object-fit: contain;
    border-radius: 10px;
    background: var(--np-soft, #f8f9fc);
}

.np-acc-item-info { min-width: 0; }
.np-acc-item-info > strong { display: block; color: var(--np-dark, #09052f); }
.np-acc-item-info > small { display: block; margin-bottom: 6px; font-size: 12px; color: var(--np-text, #555b6d); }
.np-acc-item .np-cd-spec { max-width: 460px; }

.np-acc-item-price { text-align: right; white-space: nowrap; }
.np-acc-item-price span { display: block; font-size: 13px; color: var(--np-text, #555b6d); }
.np-acc-item-price strong { color: var(--np-dark, #09052f); }

.np-acc-address { font-size: 14px; line-height: 1.7; color: var(--np-text, #555b6d); }
.np-acc-paid { margin-top: 10px; font-size: 14px; color: #18865b; font-weight: 600; }

@media (max-width: 767px) {
    .np-auth { padding: 26px 20px; }
    .np-acc-nav { position: static; }
    .np-acc-card { padding: 20px 16px; }
    .np-orders-head { display: none; }
    .np-orders-row { grid-template-columns: 1fr auto; gap: 4px 12px; }
    .np-orders-row > div[data-label]::before { content: attr(data-label) ": "; color: var(--np-text, #555b6d); }
    .np-o-go { display: none; }
    .np-acc-item { grid-template-columns: 60px 1fr; }
    .np-acc-item img { width: 60px; height: 60px; }
    .np-acc-item-price { grid-column: 2; text-align: left; }
    .np-acc-order-head { flex-direction: column; }
}

/* ---------- Checkout: account + email verification ---------- */

.np-co-account {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    padding: 12px 16px;
    background: #fff;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 12px;
    font-size: 14px;
    color: var(--np-text, #555b6d);
}

.np-co-account i { font-size: 18px; color: var(--np-pink, #e7287c); }
.np-co-account span { flex: 1; }
.np-co-account a { flex-shrink: 0; font-weight: 700; color: var(--np-pink, #e7287c); }

.np-verify {
    padding: 14px 16px;
    background: var(--np-soft, #f8f9fc);
    border: 1px dashed var(--np-border, #d5d8e3);
    border-radius: 12px;
    font-size: 14px;
}

.np-verify[hidden] { display: none; }
.np-verify-account, .np-verify-done { color: #18865b; font-weight: 600; }
.np-verify-text { margin: 0 0 10px; color: var(--np-dark, #09052f); font-weight: 600; }
.np-verify-text i { color: var(--np-pink, #e7287c); margin-right: 4px; }

.np-verify-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

.np-verify-row .np-code-input {
    width: 190px;
    height: 44px;
    font-size: 18px !important;
    letter-spacing: 6px;
}

.np-verify-btn {
    height: 44px;
    padding: 0 20px;
    border-radius: 10px;
    border: 2px solid var(--np-pink, #e7287c);
    background: #fff;
    font-weight: 700;
    color: var(--np-pink, #e7287c);
    transition: background .2s ease, color .2s ease;
}

.np-verify-btn:hover:not(:disabled), .np-verify-primary { background: var(--np-pink, #e7287c); color: #fff; }
.np-verify-btn:disabled { opacity: .55; cursor: not-allowed; }

.np-verify-msg { margin: 8px 0 0; font-size: 13px; }
.np-verify-msg:empty { display: none; }
.np-verify-msg.is-ok { color: #18865b; }
.np-verify-msg.is-error { color: #c0392b; }

.np-co-create {
    padding: 14px 16px;
    border: 1px solid var(--np-border, #eceef4);
    border-radius: 12px;
}

.np-co-check { display: flex; gap: 12px; align-items: flex-start; margin: 0 !important; cursor: pointer; }
.np-co-check input { width: 18px; height: 18px; margin-top: 3px; accent-color: var(--np-pink, #e7287c); }
.np-co-check span { font-weight: 700; color: var(--np-dark, #09052f); }
.np-co-check small { display: block; font-weight: 400; color: var(--np-text, #555b6d); }
.np-co-pass { margin-top: 4px; }
.np-co-pass[hidden] { display: none; }

/* ---------- Offers / discounts ---------- */

.np-offer-badge {
    display: inline-block;
    padding: 3px 9px;
    border-radius: 20px;
    background: var(--np-pink, #e7287c);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .02em;
    line-height: 1.4;
    white-space: nowrap;
    text-transform: uppercase;
}

/* Corner badge on product images */
.np-offer-corner {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
    box-shadow: 0 4px 12px rgba(231, 40, 124, .35);
}

.shop-items .shop-image,
.products-box-items .product-thumb { position: relative; }

/* Home "sale" spots now carry the offer value */
.feature-product-items .post-cat.np-offer-badge,
.shop-items .offer-text.np-offer-badge { background: var(--np-pink, #e7287c); }

.np-offer-banner { padding: 22px 0 0; }

.np-offer-banner-inner {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 18px 22px;
    border-radius: 14px;
    background: linear-gradient(90deg, rgba(231, 40, 124, .08), rgba(40, 115, 186, .08));
    border: 1px solid rgba(231, 40, 124, .2);
}

.np-offer-big { font-size: 18px; padding: 8px 16px; }
.np-offer-banner-text { flex: 1; min-width: 0; }
.np-offer-banner-text p { margin: 0; color: var(--np-dark, #09052f); font-weight: 600; }
.np-offer-banner-text small { color: var(--np-text, #555b6d); }

.np-offer-how {
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--np-dark, #09052f);
}

.np-offer-how i { color: var(--np-pink, #e7287c); }

.np-offer-code,
.np-deal-code strong {
    display: inline-block;
    padding: 2px 10px;
    border: 2px dashed var(--np-pink, #e7287c);
    border-radius: 8px;
    color: var(--np-pink, #e7287c);
    letter-spacing: .06em;
}

.np-deal-code { margin: 18px 0 0; font-weight: 600; }

/* Product page */
.np-pd-offer { display: flex; align-items: center; gap: 10px; margin: 4px 0 6px; }
.np-pd-offer[hidden], .np-pd-saving[hidden] { display: none; }
.np-pd-offer-title { font-size: 14px; font-weight: 600; color: var(--np-dark, #09052f); }
.np-pd-regular { font-size: .6em; font-weight: 500; color: #999; margin-left: 6px; }
.np-pd-saving { margin: 2px 0 0; font-size: 14px; color: #18865b; }

.np-pd-timer {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    padding: 8px 14px;
    border-radius: 10px;
    background: #fff4f8;
    border: 1px solid rgba(231, 40, 124, .25);
    font-size: 14px;
    color: var(--np-dark, #09052f);
}

.np-pd-timer[hidden] { display: none; }
.np-pd-timer > i { color: var(--np-pink, #e7287c); }
.np-pd-timer-label { font-weight: 600; }
.np-pd-timer-parts { display: inline-flex; gap: 6px; font-variant-numeric: tabular-nums; }
.np-pd-timer-parts span { color: var(--np-text, #555b6d); font-size: 12px; }

.np-pd-timer-parts b {
    display: inline-block;
    min-width: 26px;
    margin-right: 1px;
    padding: 2px 4px;
    border-radius: 6px;
    background: var(--np-dark, #09052f);
    color: #fff;
    font-size: 14px;
    text-align: center;
}

.np-pd-timer.is-urgent .np-pd-timer-parts b { background: var(--np-pink, #e7287c); }

/* Cart / checkout lines */
.np-cart-offer { margin-top: 6px; font-size: 12px; font-weight: 600; color: var(--np-dark, #09052f); }
.np-cart-regular, .np-line-regular { display: block; font-size: 12px; font-weight: 500; color: #999; }
.np-line-offer { display: block; margin-top: 4px; }
.np-line-offer .np-offer-badge { font-size: 10px; padding: 1px 7px; }

.np-coupon {
    margin: 16px 0 6px;
    padding: 14px 0;
    border-top: 1px solid var(--np-border, #eceef4);
    border-bottom: 1px solid var(--np-border, #eceef4);
}

.np-coupon label { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 600; color: var(--np-dark, #09052f); }
.np-coupon-row { display: flex; gap: 8px; }
.np-coupon-row .form-control { height: 44px; border-radius: 10px; text-transform: uppercase; }
.np-coupon-form[hidden], .np-coupon-applied[hidden], .np-summary-row[hidden] { display: none; }

.np-coupon-applied {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: #e6f6ef;
    color: #18865b;
    font-size: 14px;
}

.np-coupon-applied span { flex: 1; }
.np-row-discount span:last-child, .np-row-savings span:last-child { color: #18865b; font-weight: 600; }

@media (max-width: 767px) {
    .np-offer-banner-inner { flex-direction: column; align-items: flex-start; }
}

/* ---------- Product page: custom quote link ---------- */

.np-pd-quote-link {
    margin: 14px 0 0;
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--np-soft, #f8f9fc);
    font-size: 13.5px;
    color: var(--np-text, #555b6d);
}

.np-pd-quote-link i { margin-right: 6px; color: var(--np-pink, #e7287c); }
.np-pd-quote-link a { font-weight: 700; color: var(--np-pink, #e7287c); white-space: nowrap; }

/* Checkout: country / province pickers, phone dial code, tax rows */
.np-checkout-card .form-select {
    height: 48px;
    border-radius: 10px;
    border-color: var(--np-border, #eceef4);
}
.np-checkout-card .form-select:focus {
    border-color: var(--np-pink, #e7287c);
    box-shadow: 0 0 0 3px rgba(231, 40, 124, .12);
}
.np-field-hint { display: block; margin-top: 5px; font-size: 12px; color: var(--np-text, #555b6d); }

.np-phone { display: flex; }
.np-phone .np-phone-code {
    flex: 0 0 auto;
    width: auto;
    height: 48px;
    padding: 0 26px 0 10px;
    border: 1px solid var(--np-border, #eceef4);
    border-right: 0;
    border-radius: 10px 0 0 10px;
    background: #f6f7fb url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23555b6d' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") no-repeat right 8px center / 10px;
    font-size: 13px;
    font-weight: 600;
    color: var(--np-dark, #09052f);
    appearance: none;
    cursor: pointer;
}
.np-phone .np-phone-code:focus { outline: none; border-color: var(--np-pink, #e7287c); }
.np-phone .form-control { flex: 1; min-width: 0; border-radius: 0 10px 10px 0; }

.np-tax-row small { margin-left: 4px; font-size: 12px; color: var(--np-text, #555b6d); }
#np-tax-rows.is-loading { opacity: .5; }

/* ---------- Checkout: terms note ---------- */
.np-terms-note { margin: 12px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--np-text, #555b6d); text-align: center; }
.np-terms-note a { font-weight: 700; color: var(--np-pink, #e7287c); }

/* ---------- Account order: invoice download ---------- */
.np-acc-order-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }

.np-invoice-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 14px;
    border-radius: 8px;
    background: var(--np-dark, #09052f);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    transition: background .2s ease;
}

.np-invoice-btn:hover { background: var(--np-pink, #e7287c); color: #fff; }
.np-invoice-btn i { font-size: 14px; }

.np-invoice-view {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid var(--np-border, #e1e4ec);
    color: var(--np-dark, #09052f);
    transition: border-color .2s ease, color .2s ease;
}

.np-invoice-view:hover { border-color: var(--np-pink, #e7287c); color: var(--np-pink, #e7287c); }

.np-acc-invoice-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 10px;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--np-pink, #e7287c);
}

@media (max-width: 575px) {
    .np-acc-order-head { flex-direction: column; }
    .np-acc-order-actions { justify-content: flex-start; }
}

/* My account > order: payment history */
.np-pay-history { border: 1px solid var(--np-border, #eceef4); border-radius: 12px; overflow: hidden; }
.np-pay-row { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--np-border, #eceef4); }
.np-pay-row:last-child { border-bottom: 0; }
.np-pay-row > i { width: 34px; height: 34px; line-height: 34px; flex: 0 0 34px; border-radius: 50%; background: #e6f6ef; color: #18865b; text-align: center; }
.np-pay-row.is-refund > i { background: #fdecea; color: #c0392b; }
.np-pay-info { flex: 1; min-width: 0; }
.np-pay-info strong { display: block; font-size: 14px; color: var(--np-dark, #09052f); }
.np-pay-info small { display: block; font-size: 12px; color: var(--np-text, #555b6d); }
.np-pay-amount { font-weight: 700; white-space: nowrap; color: #18865b; }
.np-pay-row.is-refund .np-pay-amount { color: #c0392b; }
.np-pay-row.is-muted { opacity: .6; }
.np-pay-net { background: #f6f7fb; }
.np-pay-net .np-pay-amount { color: var(--np-dark, #09052f); font-size: 16px; }

/* Checkout: shipping options */
.np-ship-msg { margin: -8px 0 12px; font-size: 13px; color: var(--np-text, #555b6d); }
.np-ship-msg.is-error { color: #c0392b; }
.np-ship-options { display: grid; gap: 10px; }
.np-ship-options.is-loading { opacity: .5; pointer-events: none; }
.np-ship-option { display: flex; align-items: center; gap: 12px; margin: 0; padding: 14px 16px; border: 1px solid var(--np-border, #eceef4); border-radius: 10px; cursor: pointer; transition: border-color .15s, background .15s; }
.np-ship-option:hover { border-color: var(--np-pink, #e7287c); }
.np-ship-option:has(input:checked) { border-color: var(--np-pink, #e7287c); background: #fff5f9; }
.np-ship-option input { flex: 0 0 auto; width: 18px; height: 18px; margin: 0; accent-color: var(--np-pink, #e7287c); }
.np-ship-name { flex: 1; min-width: 0; font-size: 14px; font-weight: 600; color: var(--np-dark, #09052f); }
.np-ship-name small { display: block; font-weight: 400; font-size: 12px; color: var(--np-text, #555b6d); }
.np-ship-price { font-weight: 700; white-space: nowrap; color: var(--np-dark, #09052f); }
.np-row-shipping small { margin-left: 4px; font-size: 12px; color: var(--np-text, #555b6d); }

/* My account > order: delivery + UPS tracking */
.np-delivery { margin: 0 0 18px; padding: 16px 18px; border: 1px solid var(--np-border, #eceef4); border-radius: 12px; background: #fbfbfe; }
.np-delivery-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.np-delivery-head i { color: var(--np-pink, #e7287c); margin-right: 4px; }
.np-delivery-method { font-size: 13px; font-weight: 600; color: var(--np-dark, #09052f); }
.np-delivery-note { margin: 0; font-size: 14px; color: var(--np-text, #555b6d); }
.np-track { padding: 14px 0 4px; border-top: 1px solid var(--np-border, #eceef4); }
.np-track:first-of-type { border-top: 0; padding-top: 4px; }
.np-track-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.np-track-status { display: inline-block; padding: 3px 12px; border-radius: 20px; font-size: 12px; font-weight: 700; background: #e8f1fb; color: #1f6fb5; }
.np-track-delivered { background: #e6f6ef; color: #18865b; }
.np-track-out_for_delivery { background: #fff3e0; color: #b25e00; }
.np-track-exception, .np-track-returned { background: #fdecea; color: #c0392b; }
.np-track-label_created { background: #f0f1f5; color: #555b6d; }
.np-track-num { margin-top: 6px; font-size: 13px; color: var(--np-text, #555b6d); word-break: break-all; }
.np-track-eta { margin-top: 2px; font-size: 14px; color: var(--np-dark, #09052f); }
.np-track-btn { display: inline-block; padding: 8px 16px; border-radius: 30px; background: var(--np-dark, #09052f); color: #fff; font-size: 13px; font-weight: 600; white-space: nowrap; }
.np-track-btn:hover { background: var(--np-pink, #e7287c); color: #fff; }
.np-track-steps { display: flex; margin: 16px 0 6px; padding: 0; list-style: none; counter-reset: s; }
.np-track-steps li { flex: 1; position: relative; padding-top: 22px; font-size: 11px; text-align: center; color: #9aa0ad; }
.np-track-steps li span { position: absolute; top: 4px; left: 50%; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: #dfe2ea; z-index: 1; }
.np-track-steps li::before { content: ""; position: absolute; top: 10px; left: -50%; width: 100%; height: 3px; background: #dfe2ea; }
.np-track-steps li:first-child::before { display: none; }
.np-track-steps li.is-done { color: var(--np-dark, #09052f); font-weight: 600; }
.np-track-steps li.is-done span, .np-track-steps li.is-done::before { background: #18865b; }
.np-track-steps li.is-current span { box-shadow: 0 0 0 4px rgba(24, 134, 91, .2); }
.np-track.is-problem .np-track-steps li.is-current span { background: #c0392b; box-shadow: 0 0 0 4px rgba(192, 57, 43, .2); }
.np-track-events { margin-top: 8px; font-size: 13px; }
.np-track-events summary { cursor: pointer; color: var(--np-pink, #e7287c); font-weight: 600; }
.np-track-events ul { margin: 8px 0 0; padding: 0 0 0 14px; list-style: none; border-left: 2px solid #dfe2ea; }
.np-track-events li { padding: 3px 0; }
.np-track-events li > span { display: inline-block; min-width: 110px; color: var(--np-text, #555b6d); }
.np-track-events small { color: #9aa0ad; }
.np-o-track { display: block; margin-top: 4px; font-size: 11px; color: var(--np-text, #555b6d); }

/* My account > order: artwork proof review */
.np-proof { margin: 0 0 18px; padding: 16px 18px; border: 2px solid var(--np-border, #eceef4); border-radius: 12px; background: #fff; scroll-margin-top: 120px; }
.np-proof-pending { border-color: #f5b041; background: #fffaf0; }
.np-proof-approved { border-color: #b7e4cc; }
.np-proof-changes_requested { border-color: #f5c6c1; }
.np-proof-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.np-proof-head i { color: var(--np-pink, #e7287c); margin-right: 4px; }
.np-proof-status { padding: 3px 12px; border-radius: 20px; font-size: 12px; font-weight: 700; background: #f0f1f5; color: #555b6d; white-space: nowrap; }
.np-proof-pending .np-proof-status { background: #fdebd0; color: #b25e00; }
.np-proof-approved .np-proof-status { background: #e6f6ef; color: #18865b; }
.np-proof-changes_requested .np-proof-status { background: #fdecea; color: #c0392b; }
.np-proof-intro { margin: 0 0 10px; font-size: 14px; color: var(--np-text, #555b6d); }
.np-proof-msg { margin: 0 0 10px; padding: 10px 12px; border-left: 3px solid var(--np-pink, #e7287c); background: #f8f9fc; font-size: 14px; }
.np-proof-files { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin: 12px 0; }
.np-proof-file { padding: 8px; border: 1px solid var(--np-border, #eceef4); border-radius: 10px; background: #fff; font-size: 12px; }
.np-proof-thumb { display: flex; align-items: center; justify-content: center; height: 130px; margin-bottom: 6px; border-radius: 6px; background: #f6f7fb; overflow: hidden; }
.np-proof-thumb img { max-width: 100%; max-height: 100%; object-fit: contain; }
.np-proof-thumb i { font-size: 48px; color: #c0392b; }
.np-proof-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; color: var(--np-dark, #09052f); }
.np-proof-links a { color: var(--np-pink, #e7287c); font-weight: 600; }
.np-proof-form { margin-top: 6px; }
.np-proof-check { display: flex; gap: 8px; align-items: center; margin: 0 0 10px; font-size: 14px; font-weight: 600; cursor: pointer; }
.np-proof-check input { width: 18px; height: 18px; accent-color: #18865b; }
.np-proof-form textarea { border-radius: 10px; font-size: 14px; }
.np-proof-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.np-proof-approve { background: #18865b; border-color: #18865b; }
.np-proof-approve:disabled { opacity: .5; cursor: not-allowed; }
.np-proof-changes { padding: 12px 22px; border: 2px solid #c0392b; border-radius: 30px; background: #fff; color: #c0392b; font-weight: 700; }
.np-proof-changes:hover { background: #c0392b; color: #fff; }
.np-proof-answer { margin: 6px 0 8px; font-size: 14px; font-weight: 600; }
.np-proof-approved .np-proof-answer { color: #18865b; }
.np-proof-changes_requested .np-proof-answer { color: #c0392b; }
.np-proof-older { margin-top: 8px; font-size: 13px; }
.np-proof-older summary { cursor: pointer; color: var(--np-pink, #e7287c); font-weight: 600; }
.np-proof-old { padding: 8px 0; border-bottom: 1px dashed var(--np-border, #eceef4); }
.np-proof-old a { color: var(--np-dark, #09052f); text-decoration: underline; }
.np-o-proof { display: block; margin-top: 4px; font-size: 11px; font-weight: 700; color: #b25e00; }

/* ---------- Product page: description (admin rich text) ---------- */
.np-pd-desc { color: var(--np-text, #555b6d); line-height: 1.75; }
.np-pd-desc p { margin: 0 0 12px; }
.np-pd-desc p:last-child { margin-bottom: 0; }
.np-pd-desc strong, .np-pd-desc b { color: var(--np-dark, #09052f); }
.np-pd-desc ul, .np-pd-desc ol { margin: 0 0 12px; padding-left: 20px; }
.np-pd-desc ul { list-style: disc; }
.np-pd-desc ol { list-style: decimal; }
.np-pd-desc li { margin-bottom: 4px; }
.np-pd-desc h2, .np-pd-desc h3, .np-pd-desc h4 { margin: 18px 0 8px; font-size: 18px; }
.np-pd-desc a { color: var(--np-pink, #e7287c); font-weight: 600; }
.np-pd-desc table { width: 100%; margin-bottom: 12px; border-collapse: collapse; }
.np-pd-desc th, .np-pd-desc td { padding: 8px 10px; border: 1px solid var(--np-border, #eceef4); }