/* upload2.css — design skin for uploadcardvisual2 only
   All rules scoped under .uv2-wrapper */

/* ── Nav active state ──────────────────────────────── */
.uv2-wrapper .uv2-nav-btn {
    background: rgba(255,255,255,0.08);
    color: var(--uv2-muted) !important;
    border: 1px solid var(--uv2-border);
    transition: background 0.15s, color 0.15s, border-color 0.15s, box-shadow 0.15s;
}

.uv2-wrapper .uv2-nav-btn:hover {
    background: rgba(255,255,255,0.14) !important;
    color: var(--uv2-accent) !important;
    transform: none;
}

.uv2-wrapper .uv2-nav-btn.uv2-nav-active {
    background: var(--uv2-accent) !important;
    color: oklch(0.18 0.02 250) !important;
    border-color: transparent !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

/* ── Select / form-select dark theme ─────────────────── */
.uv2-wrapper select,
.uv2-wrapper .form-select,
.uv2-wrapper select.groupSelect,
.uv2-wrapper select.setselector2,
.uv2-wrapper select.setselector {
    background-color: oklch(0.21 0.02 250) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    padding: 6px 10px !important;
    outline: none !important;
    height: auto !important;
    cursor: pointer;
    /* Bootstrap form-select arrow override */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.6rem center !important;
    background-size: 14px !important;
    padding-right: 28px !important;
}

.uv2-wrapper select option,
.uv2-wrapper .form-select option {
    background: oklch(0.21 0.02 250) !important;
    color: #ffffff !important;
}

/* ── JS-generated upload card structure ─────────────── */
/* Card wrapper */
.uv2-wrapper #cards-imgs .card-bx-holder,
.uv2-wrapper #cards-imgs-back .card-bx-holder {
    background: var(--uv2-card-bg);
    border: 1px solid var(--uv2-border);
    border-radius: 12px;
    overflow: hidden;
    min-width: 200px;
    max-width: 260px;
    flex: 1 1 200px;
    display: flex;
    flex-direction: column;
}

/* Inner shell */
.uv2-wrapper #cards-imgs .col-3-shell,
.uv2-wrapper #cards-imgs-back .col-3-shell {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 0;
}

/* Header: title + close button */
.uv2-wrapper #cards-imgs .card-title-holder,
.uv2-wrapper #cards-imgs-back .card-title-holder {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 10px;
    background: rgba(255,255,255,0.05);
    border-bottom: 1px solid var(--uv2-border);
    gap: 6px;
}

.uv2-wrapper #cards-imgs .card-title,
.uv2-wrapper #cards-imgs-back .card-title {
    font-size: 11px;
    font-weight: 700;
    color: var(--uv2-text);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 0 !important;
    margin: 0;
    flex: 1;
}

/* Close / remove button */
.uv2-wrapper #cards-imgs .close-btn.card-remove,
.uv2-wrapper #cards-imgs-back .close-btn.card-remove {
    cursor: pointer;
    flex-shrink: 0;
    opacity: 0.6;
    transition: opacity 0.15s;
}

.uv2-wrapper #cards-imgs .close-btn.card-remove:hover,
.uv2-wrapper #cards-imgs-back .close-btn.card-remove:hover { opacity: 1; }

.uv2-wrapper #cards-imgs .close-btn img,
.uv2-wrapper #cards-imgs-back .close-btn img {
    width: 18px;
    height: 18px;
    display: block;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Image area */
.uv2-wrapper #cards-imgs .card-img-holder,
.uv2-wrapper #cards-imgs-back .card-img-holder {
    background: rgba(0,0,0,0.4);
    position: relative;
    overflow: hidden;
    flex: 1;
}

.uv2-wrapper #cards-imgs .card-img,
.uv2-wrapper #cards-imgs-back .card-img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Control area */
.uv2-wrapper #cards-imgs .card-select-space,
.uv2-wrapper #cards-imgs-back .card-select-space {
    padding: 8px 10px 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* cta-btn1 inside JS upload cards */
.uv2-wrapper #cards-imgs .cta-btn1,
.uv2-wrapper #cards-imgs-back .cta-btn1 {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    padding: 7px 10px !important;
    background: var(--uv2-blue) !important;
    color: #fff !important;
    border-radius: 8px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.15s;
    border: none !important;
    box-sizing: border-box;
    text-decoration: none !important;
    height: auto !important;
    line-height: 1.4 !important;
}

.uv2-wrapper #cards-imgs .cta-btn1:hover,
.uv2-wrapper #cards-imgs-back .cta-btn1:hover {
    background: oklch(0.62 0.18 265) !important;
    color: #fff !important;
}

/* Quantity counter row */
.uv2-wrapper #cards-imgs .card-bot-area,
.uv2-wrapper #cards-imgs-back .card-bot-area {
    padding: 8px 10px;
    display: flex;
    align-items: center;
    gap: 6px;
    border-top: 1px solid var(--uv2-border);
    margin-top: 4px;
}

.uv2-wrapper #cards-imgs ul.item,
.uv2-wrapper #cards-imgs-back ul.item {
    display: flex;
    align-items: center;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--uv2-border);
    border-radius: 8px;
    overflow: hidden;
}

.uv2-wrapper #cards-imgs ul.item li,
.uv2-wrapper #cards-imgs-back ul.item li {
    display: flex;
}

.uv2-wrapper #cards-imgs .img-count-text2-li,
.uv2-wrapper #cards-imgs-back .img-count-text2-li {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    padding: 4px 8px;
    font-size: 12px;
    font-weight: 700;
    color: var(--uv2-text);
    text-decoration: none;
    background: rgba(255,255,255,0.06);
}

.uv2-wrapper #cards-imgs .minus-quantity2,
.uv2-wrapper #cards-imgs .plus-quantity2,
.uv2-wrapper #cards-imgs-back .minus-quantity2,
.uv2-wrapper #cards-imgs-back .plus-quantity2 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    font-size: 14px;
    font-weight: 700;
    color: var(--uv2-accent);
    text-decoration: none;
    background: rgba(255,255,255,0.04);
    transition: background 0.12s;
    cursor: pointer;
}

.uv2-wrapper #cards-imgs .minus-quantity2:hover,
.uv2-wrapper #cards-imgs .plus-quantity2:hover,
.uv2-wrapper #cards-imgs-back .minus-quantity2:hover,
.uv2-wrapper #cards-imgs-back .plus-quantity2:hover {
    background: rgba(255,255,255,0.10);
    color: var(--uv2-accent-h);
}

/* FOIL button */
.uv2-wrapper #cards-imgs .card-foil,
.uv2-wrapper #cards-imgs-back .card-foil {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--uv2-border);
    border-radius: 6px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--uv2-muted) !important;
    cursor: pointer;
    text-decoration: none !important;
    transition: background 0.15s, color 0.15s;
}

.uv2-wrapper #cards-imgs .card-foil.on,
.uv2-wrapper #cards-imgs-back .card-foil.on {
    background: oklch(0.72 0.16 70);
    color: oklch(0.18 0.02 250) !important;
    border-color: transparent;
}

.uv2-wrapper #cards-imgs .card-foil:hover,
.uv2-wrapper #cards-imgs-back .card-foil:hover {
    background: rgba(255,255,255,0.12);
    color: var(--uv2-text) !important;
}

/* ── Design tokens ─────────────────────────────────── */
.uv2-wrapper {
    --uv2-bg:      oklch(0.18 0.02 250);
    --uv2-card-bg: oklch(0.21 0.02 250);
    --uv2-accent:  oklch(0.72 0.16 70);
    --uv2-accent-h:oklch(0.78 0.16 70);
    --uv2-blue:    oklch(0.55 0.18 265);
    --uv2-border:  rgba(255,255,255,0.07);
    --uv2-border-h:rgba(255,255,255,0.15);
    --uv2-text:    #ffffff;
    --uv2-muted:   rgba(255,255,255,0.65);
    --uv2-dim:     rgba(255,255,255,0.40);
    --uv2-radius:  16px;

    max-width: 1200px;
    margin: 20px auto 40px;
    padding: 0 16px;
    font-family: 'Myriad Pro', system-ui, sans-serif;
    color: var(--uv2-text);
    box-sizing: border-box;
}

/* ── Panel ─────────────────────────────────────────── */
.uv2-wrapper .uv2-panel {
    background: var(--uv2-bg);
    border: 1px solid var(--uv2-border);
    border-radius: var(--uv2-radius);
    padding: 24px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.35);
    margin-bottom: 16px;
}

/* ── Page header ───────────────────────────────────── */
.uv2-wrapper .uv2-page-title {
    font-size: 26px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--uv2-text);
    margin: 0 0 8px;
}

.uv2-wrapper .uv2-page-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--uv2-muted);
    margin: 0 0 20px;
    max-width: 640px;
}

.uv2-wrapper .uv2-choice-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

/* ── Buttons ───────────────────────────────────────── */
.uv2-wrapper .uv2-btn-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 9px 20px;
    background: var(--uv2-accent);
    color: oklch(0.18 0.02 250) !important;
    border: none;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.15s, transform 0.15s;
    text-decoration: none !important;
    white-space: nowrap;
    box-sizing: border-box;
    line-height: 1.4;
}

.uv2-wrapper .uv2-btn-cta:hover {
    background: var(--uv2-accent-h);
    color: oklch(0.18 0.02 250) !important;
    transform: translateY(-1px);
    text-decoration: none !important;
}

.uv2-wrapper .uv2-full-btn {
    width: 100% !important;
    border-radius: 10px !important;
    padding: 12px 20px !important;
    margin-top: 12px;
    font-size: 13px !important;
}

.uv2-wrapper .uv2-btn-danger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 16px;
    background: #af192d;
    color: #ffeadb !important;
    border: none;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.15s;
    line-height: 1.4;
}

.uv2-wrapper .uv2-btn-danger:hover { background: #7a0f1f; color: #ffeadb !important; }

.uv2-wrapper .uv2-btn-success {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 16px;
    background: #166534;
    color: #dcfce7 !important;
    border: none;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.15s;
    line-height: 1.4;
}

.uv2-wrapper .uv2-btn-success:hover { background: #14532d; color: #dcfce7 !important; }

.uv2-wrapper .uv2-btn-warning {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 11px 20px;
    background: #ff8421;
    color: #fff !important;
    border: none;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.15s;
    width: 100%;
    margin-top: 10px;
    line-height: 1.4;
}

.uv2-wrapper .uv2-btn-warning:hover { background: #e6741a; color: #fff !important; }

/* Override cta-btn1 from custom.css inside wrapper */
.uv2-wrapper .cta-btn1 {
    font-size: 13px !important;
    width: auto !important;
    height: auto !important;
    padding: 8px 16px !important;
    border-radius: 999px !important;
    line-height: 1.4 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    box-sizing: border-box !important;
}

/* Override card-bx-holder padding from custom.css */
.uv2-wrapper .card-bx-holder {
    padding: 0 !important;
    flex: unset !important;
    max-width: unset !important;
}

/* ── Section label ─────────────────────────────────── */
.uv2-wrapper .uv2-section-label {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--uv2-accent);
    margin-bottom: 12px;
}

/* ── Upload trigger (file input) ───────────────────── */
.uv2-wrapper .uv2-upload-trigger {
    margin-bottom: 12px;
    position: relative;
    display: inline-block;
}

.uv2-wrapper .uv2-upload-label {
    cursor: pointer;
    position: relative;
    display: inline-flex;
}

/* Cards row for multi-upload JS-injected cards */
.uv2-wrapper .uv2-upload-cards-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 12px;
}

/* ── 3-step grid ───────────────────────────────────── */
.uv2-wrapper .uv2-steps-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

@media (max-width: 900px) {
    .uv2-wrapper .uv2-steps-grid { grid-template-columns: 1fr; }
}

/* ── Step panel ────────────────────────────────────── */
.uv2-wrapper .uv2-step-panel {
    background: var(--uv2-bg);
    border: 1px solid var(--uv2-border);
    border-radius: var(--uv2-radius);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 20px rgba(0,0,0,0.3);
}

.uv2-wrapper .uv2-step-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: rgba(255,255,255,0.05);
    border-bottom: 1px solid var(--uv2-border);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--uv2-text);
    flex-shrink: 0;
}

.uv2-wrapper .uv2-step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    background: var(--uv2-accent);
    color: oklch(0.18 0.02 250);
    border-radius: 50%;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
    line-height: 1;
}

.uv2-wrapper .uv2-step-body {
    padding: 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* ── Inputs ────────────────────────────────────────── */
.uv2-wrapper input[type="text"]:not(.adminCardEditionName):not(.adminCardEditionEmail),
.uv2-wrapper input[type="email"],
.uv2-wrapper input[type="number"] {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid var(--uv2-border) !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    color: var(--uv2-text) !important;
    font-size: 14px !important;
    outline: none !important;
    transition: border-color 0.15s;
    font-family: 'Myriad Pro', system-ui, sans-serif;
    width: 100%;
    box-sizing: border-box;
    height: auto !important;
}

.uv2-wrapper input[type="text"]:focus,
.uv2-wrapper input[type="email"]:focus { border-color: var(--uv2-accent) !important; }
.uv2-wrapper input::placeholder { color: var(--uv2-dim); }

/* ── Search row (step 1) ───────────────────────────── */
.uv2-wrapper .uv2-search-row {
    display: flex;
    gap: 8px;
    align-items: center;
}

.uv2-wrapper .uv2-search-row input {
    flex: 1;
    width: auto !important;
    min-width: 0;
}

.uv2-wrapper .uv2-search-row .uv2-btn-cta {
    border-radius: 8px !important;
    padding: 8px 14px !important;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Searched card image */
.uv2-wrapper #cardSearched {
    width: 100%;
    height: auto;
    border-radius: 10px;
    display: block;
}

/* Select card button */
.uv2-wrapper #selectVisual {
    width: 100%;
    border-radius: 10px !important;
    padding: 10px !important;
    background: var(--uv2-blue) !important;
    color: #fff !important;
}

/* Name label in step 1 */
.uv2-wrapper .uv2-searched-name {
    font-size: 14px;
    color: var(--uv2-muted);
    padding: 0;
    margin: 0;
    text-align: center;
}

/* ── Instructions box (step 2) ─────────────────────── */
.uv2-wrapper .uv2-instructions-box {
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--uv2-border);
    border-radius: 10px;
    padding: 14px;
    color: var(--uv2-muted);
    line-height: 1.6;
}

.uv2-wrapper .uv2-instructions-box h4 {
    font-size: 12px;
    font-weight: 700;
    color: var(--uv2-text);
    margin: 0 0 8px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.uv2-wrapper .uv2-instructions-box ul {
    margin: 0;
    padding-left: 18px;
}

.uv2-wrapper .uv2-instructions-box li {
    margin-bottom: 4px;
    font-size: 12px;
}

/* ── Form fields (step 2) ──────────────────────────── */
.uv2-wrapper .uv2-form-field {
    display: flex;
    align-items: center;
    gap: 10px;
}

.uv2-wrapper .uv2-form-label {
    flex-shrink: 0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--uv2-accent);
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--uv2-border);
    border-radius: 6px;
    padding: 5px 9px;
    min-width: 72px;
    text-align: center;
    line-height: 1.4;
}

.uv2-wrapper .uv2-radio-field {
    display: flex;
    align-items: center;
    gap: 10px;
}

.uv2-wrapper .uv2-radio-field label,
.uv2-wrapper .uv2-form-field label {
    font-size: 13px;
    color: var(--uv2-muted);
    cursor: pointer;
}

.uv2-wrapper input[type="radio"] {
    visibility: hidden;
    width: 0;
    margin: 0;
}

/* Radio checked highlight */
.uv2-wrapper :checked + label:before {
    content: "" !important;
    width: 100% !important;
    height: 100% !important;
    position: absolute;
    left: -2px !important;
    top: -2px !important;
    border: 3px solid var(--uv2-accent);
    border-radius: 6px;
}

/* ── Preview area (step 3) ─────────────────────────── */
.uv2-wrapper .uv2-preview-wrap {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    background: rgba(0,0,0,0.4);
}

.uv2-wrapper #customVisualImg,
.uv2-wrapper #customVisualImgBleed {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 0;
}

.uv2-wrapper .uv2-preview-title {
    text-align: center;
    font-size: 15px;
    font-weight: 700;
    color: var(--uv2-text);
    padding: 0;
    margin: 0;
}

.uv2-wrapper .uv2-preview-subtitle {
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    color: var(--uv2-accent);
    padding: 0;
    margin: 0;
    letter-spacing: 0.04em;
}

.uv2-wrapper .blur-msg {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px;
    background: rgba(239,68,68,0.15);
    border-radius: 8px;
    color: #ef4444;
    font-size: 13px;
    font-weight: 600;
}

/* Keep d-none override so JS can show blur-msg */
.uv2-wrapper .blur-msg.d-none { display: none !important; }

.uv2-wrapper .zoomResetBtn {
    cursor: pointer;
    position: absolute;
    bottom: 8px;
    right: 8px;
    background: rgba(175,175,175,0.85) !important;
    user-select: none;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 13px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
}

.uv2-wrapper .zoomResetBtn .zoomInBtn { color: rgba(0,0,0,0.9); }

/* ── Error box ─────────────────────────────────────── */
.uv2-wrapper #error-msg {
    border-radius: 10px !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    margin-bottom: 14px;
}

/* ── Admin section ─────────────────────────────────── */
.uv2-wrapper .uv2-admin-title {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--uv2-text);
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--uv2-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
}

/* Admin card grid */
.uv2-wrapper .uv2-admin-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

@media (max-width: 900px) { .uv2-wrapper .uv2-admin-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 560px) { .uv2-wrapper .uv2-admin-grid { grid-template-columns: 1fr; } }

/* Admin card */
.uv2-wrapper .uv2-admin-card {
    background: var(--uv2-bg);
    border: 1px solid var(--uv2-border);
    border-radius: var(--uv2-radius);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}

.uv2-wrapper .uv2-admin-card-header {
    padding: 10px 12px;
    background: rgba(255,255,255,0.05);
    border-bottom: 1px solid var(--uv2-border);
    text-align: center;
}

.uv2-wrapper .uv2-admin-card-name {
    font-size: 12px;
    font-weight: 700;
    color: var(--uv2-text);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 6px;
}

.uv2-wrapper .uv2-admin-card-img {
    flex: 1;
    background: rgba(0,0,0,0.4);
}

.uv2-wrapper .uv2-admin-card-img img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 0;
    padding: 0 !important;
    margin: 0 !important;
}

.uv2-wrapper .uv2-admin-card-footer {
    padding: 10px;
    display: flex;
    gap: 8px;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid var(--uv2-border);
    background: rgba(0,0,0,0.15);
}

/* Admin inputs */
.uv2-wrapper .adminCardEditionName,
.uv2-wrapper .adminCardEditionEmail {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid var(--uv2-border) !important;
    border-radius: 6px !important;
    padding: 6px 10px !important;
    color: var(--uv2-text) !important;
    font-size: 12px !important;
    width: 100% !important;
    box-sizing: border-box;
    margin-top: 6px;
    text-align: center;
    font-family: 'Myriad Pro', system-ui, sans-serif;
    height: auto !important;
    resize: none;
}

/* Radio row in admin cards */
.uv2-wrapper .radioAR {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 8px 0 0;
    flex-wrap: wrap;
}

.uv2-wrapper .radioAR label {
    font-size: 11px;
    color: var(--uv2-muted);
    cursor: pointer;
    margin: 0;
}

/* Admin search */
.uv2-wrapper .uv2-admin-search-row {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 12px 14px;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--uv2-border);
    border-radius: 10px;
    margin-bottom: 16px;
}

.uv2-wrapper #searchCardNameAccepted {
    flex: 1;
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid var(--uv2-border) !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    color: var(--uv2-text) !important;
    font-size: 14px !important;
    outline: none !important;
    font-family: 'Myriad Pro', system-ui, sans-serif;
    width: auto !important;
    height: auto !important;
}

.uv2-wrapper #searchCardNameAccepted::placeholder { color: var(--uv2-dim); }

/* WP paginate_links inside wrapper */
.uv2-wrapper .page-numbers { color: var(--uv2-muted); margin: 0 4px; }
.uv2-wrapper .page-numbers.current { color: var(--uv2-accent) !important; }

/* Tagify inside wrapper */
.uv2-wrapper tags.tagify {
    width: 100%;
    border: 1px solid var(--uv2-border);
    border-radius: 8px;
    background: rgba(255,255,255,0.06);
    padding: 4px;
}

.uv2-wrapper .tagify__tag {
    background: rgba(255,255,255,0.12);
    border-radius: 6px;
    color: var(--uv2-text);
}

.uv2-wrapper .tagify__input { color: var(--uv2-text); }

.uv2-wrapper .tagify__dropdown__wrapper {
    background-color: oklch(0.21 0.02 250) !important;
    border: 1px solid var(--uv2-border);
}

/* JS-generated multi-upload cards inside #cards-imgs */
.uv2-wrapper #cards-imgs .card-bx-holder,
.uv2-wrapper #cards-imgs-back .card-bx-holder {
    background: var(--uv2-card-bg);
    border: 1px solid var(--uv2-border);
    border-radius: 12px;
    overflow: hidden;
    min-width: 160px;
    max-width: 220px;
    flex: 1;
}

.uv2-wrapper #cards-imgs .card-img,
.uv2-wrapper #cards-imgs-back .card-img {
    border-radius: 0 !important;
    width: 100%;
    height: auto;
    display: block;
}

.uv2-wrapper #cards-imgs .card-title,
.uv2-wrapper #cards-imgs-back .card-title {
    font-size: 12px;
    color: var(--uv2-text);
    padding: 8px 10px 4px;
    font-weight: 600;
}

/* ── Modal overrides ───────────────────────────────── */
.uv2-wrapper + .modal .modal-content,
#showcaseModal .modal-content {
    background: oklch(0.18 0.02 250);
    border: 1px solid rgba(255,255,255,0.07);
    color: #fff;
}

/* ── Mobile ────────────────────────────────────────── */
@media (max-width: 600px) {
    .uv2-wrapper .uv2-choice-row { flex-direction: column; }
    .uv2-wrapper .uv2-btn-cta { width: 100%; }
    .uv2-wrapper .uv2-admin-title { flex-direction: column; align-items: flex-start; }
    .uv2-wrapper .uv2-panel { padding: 16px; }
    .uv2-wrapper .uv2-step-body { padding: 12px; }
}