/* Real barcode fonts for Duplo preview rendering */
@font-face {
    font-family: 'Libre Barcode 39';
    src: url('/fonts/LibreBarcode39-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Libre Barcode 128';
    src: url('/fonts/LibreBarcode128-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

:root {
    /* Impozly brand tokens — neutral ink + warm amber accent */
    --ipz-ink:        #0B1220;
    --ipz-ink-2:      #111a2e;
    --ipz-paper:      #FAFAF7;
    --ipz-paper-2:    #F1F2EE;
    --ipz-line:       #E3E5EA;
    --ipz-muted:      #5b6473;
    --ipz-text:       #1a2332;
    --ipz-cyan:       #2b6fff;
    --ipz-magenta:    #C25100;
    --ipz-yellow:     #F5C400;
    --ipz-brand:      #2b6fff;
    --ipz-brand-soft: rgba(43,111,255,.12);
    --ipz-shadow:     0 1px 2px rgba(11,18,32,.06), 0 8px 24px rgba(11,18,32,.06);
    --ipz-radius:     10px;
    --ipz-surface:    #ffffff;
    --ipz-surface-2:  #f8f9fc;
    --ipz-sidebar-grad-start: #0B1220;
    --ipz-sidebar-grad-end: #111a2e;
    --ipz-accent:     #F5C400;
    --ipz-accent-ink: #5c3d00;
}

html[data-theme='dark'] {
    color-scheme: dark;
    --ipz-ink:        #f0f4ff;
    --ipz-ink-2:      #d9e2f8;
    --ipz-paper:      #0f1420;
    --ipz-paper-2:    #141b2a;
    --ipz-line:       #2a3448;
    --ipz-muted:      #9ca8bf;
    --ipz-text:       #dce5f8;
    --ipz-brand-soft: rgba(43,111,255,.18);
    --ipz-shadow:     0 1px 2px rgba(0,0,0,.35), 0 8px 24px rgba(0,0,0,.45);
    --ipz-surface:    #171f30;
    --ipz-surface-2:  #1b2438;
    --ipz-sidebar-grad-start: #090d17;
    --ipz-sidebar-grad-end: #111828;
    --ipz-accent:     #ffd54f;
    --ipz-accent-ink: #2a1f00;

    --bs-body-bg: var(--ipz-paper);
    --bs-body-color: var(--ipz-text);
    --bs-border-color: var(--ipz-line);
    --bs-secondary-color: var(--ipz-muted);
    --bs-tertiary-bg: var(--ipz-surface-2);
    --bs-card-bg: var(--ipz-surface);
    --bs-emphasis-color: var(--ipz-ink);
}

.page.theme-dark {
    color-scheme: dark;
    --ipz-ink:        #f0f4ff;
    --ipz-ink-2:      #d9e2f8;
    --ipz-paper:      #0f1420;
    --ipz-paper-2:    #141b2a;
    --ipz-line:       #2a3448;
    --ipz-muted:      #9ca8bf;
    --ipz-text:       #dce5f8;
    --ipz-brand-soft: rgba(43,111,255,.18);
    --ipz-shadow:     0 1px 2px rgba(0,0,0,.35), 0 8px 24px rgba(0,0,0,.45);
    --ipz-surface:    #171f30;
    --ipz-surface-2:  #1b2438;
    --ipz-sidebar-grad-start: #090d17;
    --ipz-sidebar-grad-end: #111828;
    --ipz-accent:     #ffd54f;
    --ipz-accent-ink: #2a1f00;

    --bs-body-bg: var(--ipz-paper);
    --bs-body-color: var(--ipz-text);
    --bs-border-color: var(--ipz-line);
    --bs-secondary-color: var(--ipz-muted);
    --bs-tertiary-bg: var(--ipz-surface-2);
    --bs-card-bg: var(--ipz-surface);
    --bs-emphasis-color: var(--ipz-ink);
}

html, body {
    font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
    color: var(--ipz-text);
    background: var(--ipz-paper);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5 {
    color: var(--ipz-ink);
    letter-spacing: -0.01em;
    font-weight: 700;
}

a, .btn-link { color: var(--ipz-cyan); text-decoration: none; }
a:hover, .btn-link:hover { color: #255fe0; text-decoration: underline; }

.btn-primary {
    color: #fff;
    background: var(--ipz-ink);
    border-color: var(--ipz-ink);
    border-radius: 8px;
    font-weight: 600;
    padding: .5rem 1.1rem;
    transition: transform .05s ease, background .15s ease;
}
.btn-primary:hover, .btn-primary:focus { background: var(--ipz-ink-2); border-color: var(--ipz-ink-2); }
.btn-primary:active { transform: translateY(1px); }

.btn-brand {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--ipz-brand);
    --bs-btn-border-color: var(--ipz-brand);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #255fe0;
    --bs-btn-hover-border-color: #255fe0;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #1f52c4;
    --bs-btn-active-border-color: #1f52c4;
    --bs-btn-disabled-color: var(--ipz-surface);
    --bs-btn-disabled-bg: rgba(43,111,255,.55);
    --bs-btn-disabled-border-color: transparent;
    color: #fff;
    background: var(--ipz-brand);
    border: 0;
    border-radius: 8px;
    font-weight: 600;
    padding: .5rem 1.1rem;
}
.btn-brand:hover { color: #fff; }

/* Theme toggle — lives inside an interactive island so styles must be global */
.theme-toggle {
    border-radius: 999px;
    font-size: .9rem;
    font-weight: 600;
    letter-spacing: .02em;
    line-height: 1;
    padding: .4rem .7rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    transition: background .12s ease, color .12s ease, border-color .12s ease;
}

.theme-toggle--light {
    border: 1px solid var(--ipz-cyan);
    color: var(--ipz-cyan);
}

.theme-toggle--light:hover {
    background: var(--ipz-cyan);
    color: #fff;
}

.theme-toggle--dark {
    border: 1px solid var(--ipz-accent);
    color: var(--ipz-accent);
}

.theme-toggle--dark:hover {
    background: var(--ipz-accent);
    color: var(--ipz-accent-ink);
}

.theme-toggle:focus-visible {
    outline: 2px solid rgba(43,111,255,.45);
    outline-offset: 2px;
}

.btn-outline-ink {
    color: var(--ipz-ink);
    background: transparent;
    border: 1px solid var(--ipz-line);
    border-radius: 8px;
    font-weight: 600;
    padding: .5rem 1.1rem;
}
.btn-outline-ink:hover { border-color: var(--ipz-ink); color: var(--ipz-ink); }

.btn-outline-secondary {
    color: var(--ipz-muted);
    background: transparent;
    border-color: var(--ipz-line);
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
    color: var(--ipz-ink);
    background: var(--ipz-surface-2);
    border-color: var(--ipz-line);
}

.btn-primary:disabled,
.btn-primary.disabled,
fieldset:disabled .btn-primary {
    color: var(--ipz-surface);
    background: var(--ipz-ink-2);
    border-color: var(--ipz-ink-2);
    opacity: .6;
}

html[data-theme='dark'] .btn-primary,
.page.theme-dark .btn-primary {
    color: #f3f8ff;
    background: #2b6fff;
    border-color: #2b6fff;
}

html[data-theme='dark'] .btn-primary:hover,
html[data-theme='dark'] .btn-primary:focus,
.page.theme-dark .btn-primary:hover,
.page.theme-dark .btn-primary:focus {
    color: #f3f8ff;
    background: #255fe0;
    border-color: #255fe0;
}

html[data-theme='dark'] .btn-primary:disabled,
html[data-theme='dark'] .btn-primary.disabled,
html[data-theme='dark'] fieldset:disabled .btn-primary,
.page.theme-dark .btn-primary:disabled,
.page.theme-dark .btn-primary.disabled,
.page.theme-dark fieldset:disabled .btn-primary {
    color: #d8e6ff;
    background: #334466;
    border-color: #334466;
    opacity: .85;
}

.btn-brand:disabled,
.btn-brand.disabled,
fieldset:disabled .btn-brand {
    color: var(--ipz-surface);
    background: rgba(43,111,255,.55);
    opacity: .7;
}

.btn-outline-secondary:disabled,
.btn-outline-secondary.disabled,
fieldset:disabled .btn-outline-secondary,
.btn-outline-ink:disabled,
.btn-outline-ink.disabled,
fieldset:disabled .btn-outline-ink {
    color: var(--ipz-muted);
    background: var(--ipz-surface-2);
    border-color: var(--ipz-line);
    opacity: .7;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus,
.form-control:focus, .form-check-input:focus, .form-select:focus {
    box-shadow: 0 0 0 .15rem rgba(43,111,255,.25);
    border-color: var(--ipz-cyan);
}

.form-control, .form-select {
    border-radius: 8px;
    border-color: var(--ipz-line);
    background-color: var(--ipz-surface);
    color: var(--ipz-text);
}

.form-control:disabled,
.form-select:disabled,
.form-control[readonly] {
    border-color: var(--ipz-line);
    background-color: var(--ipz-surface-2);
    color: var(--ipz-muted);
    opacity: 1;
}

.form-control::placeholder,
.form-select::placeholder {
    color: var(--ipz-muted);
}

.content { padding-top: 1.5rem; }
h1:focus { outline: none; }

.valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; }
.invalid { outline: 1px solid #C25100; }
.validation-message { color: #C25100; }

.blazor-error-boundary {
    background: #C25100;
    padding: 1rem 1.25rem;
    color: white;
    border-radius: var(--ipz-radius);
}
.blazor-error-boundary::after { content: "An error has occurred."; }

.darker-border-checkbox.form-check-input { border-color: #929292; }

.form-floating > .form-control-plaintext::placeholder,
.form-floating > .form-control::placeholder { color: var(--bs-secondary-color); text-align: end; }
.form-floating > .form-control-plaintext:focus::placeholder,
.form-floating > .form-control:focus::placeholder { text-align: start; }

/* Brand utility components reusable across pages */
.ipz-badge {
    display: inline-flex; align-items: center; gap: .35rem;
    font-size: .72rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
    padding: .25rem .55rem; border-radius: 999px;
    background: var(--ipz-brand-soft); color: var(--ipz-ink);
}
.ipz-card {
    background: var(--ipz-surface);
    border: 1px solid var(--ipz-line);
    border-radius: var(--ipz-radius);
    padding: 1.5rem;
    box-shadow: var(--ipz-shadow);
}
.ipz-ico {
    display: inline-block;
    width: 1.1em;
    height: 1.1em;
    margin-right: .35em;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    vertical-align: -0.15em;
    opacity: .95;
}
.ipz-ico-home {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M3 10.5 12 3l9 7.5'/><path d='M5 9.5V21h14V9.5'/><path d='M9 21v-6h6v6'/></svg>");
}
.ipz-ico-grid {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='7' height='7' rx='1'/><rect x='14' y='3' width='7' height='7' rx='1'/><rect x='3' y='14' width='7' height='7' rx='1'/><rect x='14' y='14' width='7' height='7' rx='1'/></svg>");
}
.ipz-ico-spark {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3v4M12 17v4M3 12h4M17 12h4M5.5 5.5l2.8 2.8M15.7 15.7l2.8 2.8M5.5 18.5l2.8-2.8M15.7 8.3l2.8-2.8'/></svg>");
}
.ipz-ico-tools {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.3-3.3a1 1 0 0 0 0-1.4l-1.6-1.6a1 1 0 0 0-1.4 0z'/><path d='M4 17l7-7 3 3-7 7H4v-3z'/></svg>");
}
.ipz-ico-impose {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='18' height='18' rx='2'/><path d='M3 9h18M9 21V9'/></svg>");
}
.ipz-ico-tile {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='8' height='8' rx='1'/><rect x='13' y='3' width='8' height='8' rx='1'/><rect x='3' y='13' width='18' height='8' rx='1'/></svg>");
}
.ipz-ico-gangup {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 2L2 7l10 5 10-5-10-5z'/><path d='M2 17l10 5 10-5'/><path d='M2 12l10 5 10-5'/></svg>");
}
.ipz-ico-docs {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M4 19.5A2.5 2.5 0 0 1 6.5 17H20'/><path d='M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z'/></svg>");
}
.ipz-ico-pricing {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='2' y='5' width='20' height='14' rx='2'/><path d='M2 10h20'/></svg>");
}
.ipz-ico-account {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/><circle cx='12' cy='7' r='4'/></svg>");
}
.ipz-ico-support {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><path d='M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3'/><line x1='12' y1='17' x2='12.01' y2='17'/></svg>");
}
.ipz-ico-admin-users {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/><circle cx='9' cy='7' r='4'/><path d='M23 21v-2a4 4 0 0 0-3-3.87'/><path d='M16 3.13a4 4 0 0 1 0 7.75'/></svg>");
}
.ipz-ico-admin-support {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/></svg>");
}
.ipz-ico-signout {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/><polyline points='16 17 21 12 16 7'/><line x1='21' y1='12' x2='9' y2='12'/></svg>");
}
.ipz-ico-signin {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/><polyline points='10 17 15 12 10 7'/><line x1='15' y1='12' x2='3' y2='12'/></svg>");
}
.ipz-ico-register {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1220' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/><circle cx='8.5' cy='7' r='4'/><line x1='20' y1='8' x2='20' y2='14'/><line x1='23' y1='11' x2='17' y2='11'/></svg>");
}

.ipz-gradient-text {
    background: linear-gradient(135deg, #2b6fff 0%, #6fa1ff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.ipz-card-header { background: linear-gradient(90deg, rgba(43,111,255,.10), rgba(43,111,255,.04)); border-bottom: 1px solid rgba(11,18,32,.08); }

/* Settings panel readability */
.ipz-settings-panel .card.mb-2 {
    border: 1px solid #d7dce6;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 0 rgba(11,18,32,.03);
}

.ipz-settings-panel .card.mb-2 + .card.mb-2 {
    margin-top: .8rem;
}

.ipz-settings-panel .card.mb-2 > .card-header {
    background: linear-gradient(90deg, rgba(43,111,255,.08), rgba(43,111,255,.04));
    border-bottom: 1px solid #dfe4ee;
}

.ipz-settings-panel .card.mb-2 > .card-body {
    background: linear-gradient(180deg, var(--ipz-surface) 0%, var(--ipz-surface-2) 100%);
    padding: .9rem !important;
}

.ipz-settings-panel .card.mb-2 > .card-body > .form-label.fw-semibold:first-child {
    border-bottom: 1px dashed #d9deea;
    margin-bottom: .7rem;
    padding-bottom: .45rem;
}

/* Auth pages */
.ipz-auth-body{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--ipz-paper);margin:0;padding:2rem;font-family:-apple-system,Segoe UI,sans-serif}
.ipz-auth-card{background:var(--ipz-surface);border:1px solid var(--ipz-line,#e6e6e2);border-radius:14px;padding:2rem;width:100%;max-width:420px;box-shadow:0 6px 28px rgba(11,18,32,.06)}
.ipz-auth-brand{display:block;margin-bottom:1.25rem}
.ipz-auth-title{font-size:1.5rem;font-weight:700;margin:0 0 .35rem;color:var(--ipz-ink)}
.ipz-auth-sub{color:var(--ipz-muted);margin:0 0 1.25rem;font-size:.92rem}
.ipz-auth-foot{margin-top:1rem;text-align:center;font-size:.88rem;color:var(--ipz-muted)}
.nav-user{font-weight:600;opacity:.85}


/* Account + Admin */
.ipz-page{max-width:1100px;margin:0 auto;padding:1.5rem}
.ipz-page-title{font-size:1.75rem;font-weight:700;margin:0 0 .25rem;color:var(--ipz-ink);letter-spacing:-.01em}
.ipz-page-sub{color:var(--ipz-muted);margin:0 0 1.5rem}
.acct-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1rem}
.acct-card{background:var(--ipz-surface);border:1px solid var(--ipz-line,#e6e6e2);border-radius:12px;padding:1.25rem 1.35rem;box-shadow:var(--ipz-shadow,0 2px 10px rgba(11,18,32,.04))}
.acct-card-title{font-size:.95rem;font-weight:700;color:var(--ipz-ink);letter-spacing:.01em;margin:0 0 1rem;padding-bottom:.5rem;border-bottom:1px solid var(--ipz-line,#e6e6e2)}
.acct-plan-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.acct-plan-tier{font-size:1.25rem;font-weight:700;color:var(--ipz-ink)}
.acct-plan-meta{color:var(--ipz-muted);font-size:.85rem}
.acct-roles{display:flex;gap:.4rem;flex-wrap:wrap}
.acct-role{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:.25rem .55rem;border-radius:999px;background:var(--ipz-ink);color:var(--ipz-surface)}
.acct-role-muted{background:var(--ipz-surface-2);color:var(--ipz-muted)}
.admin-users-table .mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem}

/* Account page */
.acct-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.25rem}
.acct-header-info{display:flex;align-items:center;gap:1rem}
.acct-avatar-large{width:3.5rem;height:3.5rem;border-radius:12px;background:var(--ipz-brand-soft);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:1.4rem;color:var(--ipz-cyan);text-transform:uppercase;flex:0 0 auto;overflow:hidden}
.acct-avatar-img{width:100%;height:100%;object-fit:cover}
.acct-avatar-edit{position:relative;width:5rem;height:5rem;flex:0 0 auto}
.acct-avatar-edit-img{width:5rem;height:5rem;border-radius:12px;background:var(--ipz-brand-soft);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:2rem;color:var(--ipz-cyan);text-transform:uppercase;object-fit:cover}
.acct-avatar-edit-btn{position:absolute;bottom:-.25rem;right:-.25rem;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--ipz-ink);color:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--ipz-shadow);border:2px solid var(--ipz-surface);font-size:.85rem}
.acct-avatar-edit-btn:hover{background:var(--ipz-accent);color:var(--ipz-accent-ink)}
.acct-header-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:.3rem}
.acct-plan-pill{font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:.25rem .55rem;border-radius:999px;border:1px solid var(--ipz-line);background:var(--ipz-surface-2);color:var(--ipz-muted)}
.acct-plan-pill--free{border-color:#bfc9d4;background:#f4f6f8;color:#475c6e}
.acct-plan-pill--pro{border-color:#b8e0e8;background:#e8f7fa;color:#007a91}
.acct-plan-pill--plus{border-color:#e8c2d6;background:#fae8f1;color:#9e1c5e}
.acct-plan-pill--studio{border-color:#d4c2f0;background:#f0e8fc;color:#5e35b1}
html[data-theme='dark'] .acct-plan-pill--free{border-color:#475c6e;background:#222c38;color:#9fb3c6}
html[data-theme='dark'] .acct-plan-pill--pro{border-color:#1d5a66;background:#0f252a;color:#6fd3e6}
html[data-theme='dark'] .acct-plan-pill--plus{border-color:#7a3a5a;background:#2e1a28;color:#e08ab5}
html[data-theme='dark'] .acct-plan-pill--studio{border-color:#4a3a6e;background:#241a36;color:#bfa3f0}
.acct-tabs{display:flex;gap:.25rem;border-bottom:1px solid var(--ipz-line);margin-bottom:1.25rem;overflow-x:auto}
.acct-tab{font-size:.85rem;font-weight:600;color:var(--ipz-muted);background:transparent;border:0;border-bottom:2px solid transparent;padding:.55rem .85rem;white-space:nowrap;cursor:pointer;transition:color .15s,border-color .15s}
.acct-tab:hover{color:var(--ipz-ink)}
.acct-tab--active{color:var(--ipz-cyan);border-bottom-color:var(--ipz-cyan);background:var(--ipz-surface-2)}
.acct-grid--profile{grid-template-columns:1fr;max-width:900px}
.acct-grid--profile .acct-card{max-width:none}
.acct-grid--billing{grid-template-columns:1fr;max-width:900px}
.acct-card--highlight{border-color:var(--ipz-accent);background:linear-gradient(135deg,var(--ipz-surface) 0%,rgba(245,196,0,.08) 100%)}
.acct-plan-header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.acct-plan-name{font-size:1.75rem;font-weight:700;color:var(--ipz-ink)}
.acct-plan-preview{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:.25rem .55rem;border-radius:6px;background:var(--ipz-yellow);color:#1a2332;margin-left:.5rem;vertical-align:middle}
.acct-plan-stats{display:flex;gap:1.5rem;margin-bottom:1rem;flex-wrap:wrap}
.acct-plan-stat{display:flex;flex-direction:column;min-width:80px}
.acct-plan-stat-value{font-size:1.35rem;font-weight:700;color:var(--ipz-ink);line-height:1}
.acct-plan-stat-label{font-size:.75rem;color:var(--ipz-muted);margin-top:.2rem}
.acct-plan-renews{display:flex;gap:1rem;flex-wrap:wrap;font-size:.85rem;color:var(--ipz-muted)}
.acct-usage-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1rem}
.acct-usage-item{display:flex;flex-direction:column;gap:.2rem}
.acct-usage-value{font-size:1.25rem;font-weight:700;color:var(--ipz-ink)}
.acct-usage-label{font-size:.75rem;color:var(--ipz-muted)}
.acct-team-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.acct-team-name{font-size:1.1rem;font-weight:700;color:var(--ipz-ink)}
.acct-team-table thead th{font-size:.7rem;letter-spacing:.04em;text-transform:uppercase;font-weight:700;color:var(--ipz-muted)}
.acct-api-table thead th{font-size:.7rem;letter-spacing:.04em;text-transform:uppercase;font-weight:700;color:var(--ipz-muted)}
@media (max-width:768px){
    .acct-header{flex-direction:column;align-items:flex-start}
    .acct-header-actions{width:100%;display:flex;justify-content:flex-end}
    .acct-plan-name{font-size:1.35rem}
}

/* Admin users page */
.ipz-page--wide{max-width:1300px}
.admin-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.admin-beta-switch{display:flex;align-items:center;gap:.5rem;background:var(--ipz-surface-2);border:1px solid var(--ipz-line);border-radius:999px;padding:.35rem .85rem}
.admin-beta-state{font-weight:700;color:var(--ipz-cyan)}
.admin-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.admin-search{position:relative;display:flex;align-items:center;gap:.5rem;flex:1 1 280px;max-width:420px;background:var(--ipz-surface);border:1px solid var(--ipz-line);border-radius:8px;padding:0 .55rem}
.admin-search-icon{font-size:.85rem;opacity:.7}
.admin-search input{border:0;background:transparent;padding:.45rem 0;box-shadow:none}
.admin-search input:focus{outline:none}
.admin-stats{display:flex;align-items:center;gap:.75rem;font-size:.85rem}
.admin-stat strong{color:var(--ipz-ink)}
.admin-card{padding:0;overflow:hidden}
.admin-users-table{margin:0}
.admin-users-table thead th{font-size:.7rem;letter-spacing:.04em;text-transform:uppercase;font-weight:700;color:var(--ipz-muted);border-bottom:1px solid var(--ipz-line);padding:.75rem .9rem;white-space:nowrap;background:var(--ipz-surface-2)}
.admin-users-table tbody td{padding:.65rem .9rem;vertical-align:middle;border-bottom:1px solid var(--ipz-line)}
.admin-users-table tbody tr:last-child td{border-bottom:0}
.admin-user{display:flex;align-items:center;gap:.75rem;min-width:220px}
.admin-user-avatar{width:2.25rem;height:2.25rem;border-radius:8px;background:var(--ipz-brand-soft);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;color:var(--ipz-cyan);text-transform:uppercase;overflow:hidden}
.admin-user-avatar img{width:100%;height:100%;object-fit:cover}
.admin-user-info{min-width:0}
.admin-user-name{font-weight:600;color:var(--ipz-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-user-email{font-size:.8rem;color:var(--ipz-muted)}
.admin-user-meta{font-size:.75rem;color:var(--ipz-muted);margin-top:.15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-plan{display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:.25rem .55rem;border-radius:6px;border:1px solid var(--ipz-line);background:var(--ipz-surface-2);color:var(--ipz-muted)}
.admin-plan--free{border-color:#bfc9d4;background:#f4f6f8;color:#475c6e}
.admin-plan--pro{border-color:#b8e0e8;background:#e8f7fa;color:#007a91}
.admin-plan--plus{border-color:#e8c2d6;background:#fae8f1;color:#9e1c5e}
.admin-plan--studio{border-color:#d4c2f0;background:#f0e8fc;color:#5e35b1}
html[data-theme='dark'] .admin-plan--free{border-color:#475c6e;background:#222c38;color:#9fb3c6}
html[data-theme='dark'] .admin-plan--plus{border-color:#7a3a5a;background:#2e1a28;color:#e08ab5}
html[data-theme='dark'] .admin-plan--pro{border-color:#1d5a66;background:#0f252a;color:#6fd3e6}
html[data-theme='dark'] .admin-plan--studio{border-color:#4a3a6e;background:#241a36;color:#bfa3f0}
.admin-role-list{display:flex;flex-wrap:wrap;gap:.35rem;max-width:120px}
.admin-role{font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:.22rem .45rem;border-radius:999px}
.admin-role--admin{background:var(--ipz-ink);color:var(--ipz-surface)}
.admin-role--beta{background:var(--ipz-accent);color:var(--ipz-accent-ink)}
.admin-role--none{color:var(--ipz-muted)}
.admin-org{display:block;font-weight:500;color:var(--ipz-ink);font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-org-seats{display:block;font-size:.72rem;color:var(--ipz-muted)}
.admin-org--none{color:var(--ipz-muted);font-size:.82rem}
.admin-country{font-size:.82rem;color:var(--ipz-muted)}
.admin-usage{font-weight:700;font-size:.85rem;color:var(--ipz-ink)}
.admin-date{display:block;font-size:.82rem;color:var(--ipz-ink)}
.admin-time{display:block;font-size:.75rem;color:var(--ipz-muted)}
.admin-plan-dot{display:inline-block;width:.55rem;height:.55rem;border-radius:999px;margin-right:.35rem}
.admin-plan-dot--free{background:#94a3b8}
.admin-plan-dot--pro{background:#2b6fff}
.admin-plan-dot--plus{background:#C25100}
.admin-plan-dot--studio{background:#8b5cf6}
.admin-col-plan,.admin-col-roles,.admin-col-country,.admin-col-usage,.admin-col-login,.admin-col-joined,.admin-col-actions{width:1%}
.admin-col-org{min-width:160px}
@media (max-width:992px){
    .admin-header{flex-direction:column;align-items:flex-start}
    .admin-toolbar{flex-direction:column;align-items:flex-start}
    .admin-search{max-width:100%;width:100%}
    .admin-col-login,.admin-col-joined,.admin-col-country{display:none}
}
@media (max-width:768px){
    .admin-col-org{display:none}
}


/* preset templates */
.ipz-preset-card {
    border: 1px solid var(--ipz-line);
    border-radius: 8px;
    padding: 12px;
    background: linear-gradient(180deg, var(--ipz-surface) 0%, var(--ipz-surface-2) 100%);
}

.ipz-preset-card.ipz-preset-locked {
    background: linear-gradient(180deg, #fff8ea 0%, #fff0cc 100%);
    border-color: #e2bf60;
}

html[data-theme='dark'] .ipz-preset-card.ipz-preset-locked,
.page.theme-dark .ipz-preset-card.ipz-preset-locked {
    background: linear-gradient(180deg, #3a2e17 0%, #2a2214 100%);
    border-color: #6f5a2c;
}


/* Wizard step headers */
.ipz-step-head {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-bottom: .5rem;
}
.ipz-step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.65rem;
    height: 1.65rem;
    border-radius: 999px;
    background: var(--ipz-brand);
    color: #fff;
    font-weight: 700;
    font-size: .85rem;
    line-height: 1;
    box-shadow: 0 1px 2px rgba(11,18,32,.15);
    flex: 0 0 auto;
}
.ipz-step-title {
    font-weight: 700;
    color: var(--ipz-ink);
    letter-spacing: -0.01em;
    font-size: 1rem;
}
.ipz-step-divider {
    border: 0;
    border-top: 1px dashed var(--ipz-line);
    margin: .25rem 0 1rem;
}
.ipz-step-bordered {
    border: 1px solid var(--ipz-line);
    border-radius: 8px;
    padding: .85rem 1rem;
    background: var(--ipz-surface);
}

html[data-theme='dark'] .table,
.page.theme-dark .table {
    --bs-table-bg: var(--ipz-surface);
    --bs-table-color: var(--ipz-text);
    --bs-table-border-color: var(--ipz-line);
    --bs-table-striped-bg: #1c2740;
    --bs-table-hover-bg: #25304a;
}

html[data-theme='dark'] .table-light,
html[data-theme='dark'] .table > :not(caption) > * > .table-light,
.page.theme-dark .table-light,
.page.theme-dark .table > :not(caption) > * > .table-light {
    --bs-table-bg: #233050;
    --bs-table-color: #e3ecff;
}

/* ── Gang Up drop zone ─────────────────────────────────────────────────── */
.gang-drop-zone {
    position: relative;
    border: 2px dashed var(--ipz-line);
    border-radius: 8px;
    padding: 1.25rem 1rem;
    text-align: center;
    background: var(--ipz-paper);
    transition: border-color .15s, background .15s;
    cursor: pointer;
}
.gang-drop-zone:hover,
.gang-drop-zone.drag-active {
    border-color: var(--ipz-accent);
    background: rgba(245,196,0,.08);
}
.gang-drop-zone.drag-active .gang-drop-icon { color: var(--ipz-accent); }
.gang-drop-icon { font-size: 1.75rem; line-height: 1; color: var(--ipz-muted); transition: color .15s; }
.gang-drop-label { font-size: .85rem; color: var(--ipz-muted); margin-top: .35rem; }
.gang-drop-input {
    opacity: 0;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

/* ── Full-page drag-and-drop overlay ───────────────────────────────────── */
.page-drop-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(43, 111, 255, 0.12);
    border: 4px dashed var(--ipz-cyan);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;   /* invisible: let all events reach the page below */
    transition: opacity 0.12s;
}
.page-drop-overlay.active {
    opacity: 1;
    pointer-events: auto;   /* active: intercept pointer/drag events */
}
.page-drop-overlay-content {
    background: #fff;
    border-radius: 16px;
    padding: 2.5rem 4rem;
    text-align: center;
    box-shadow: 0 8px 32px rgba(0,0,0,0.18);
    pointer-events: none;
}
.page-drop-overlay-icon { font-size: 3rem; line-height: 1; }
.page-drop-overlay-label {
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--ipz-cyan);
    margin-top: .6rem;
}
/* Transparent full-screen input that receives the drop */
.page-drop-input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: copy;
    pointer-events: none;   /* inactive: pass-through */
}
.page-drop-overlay.active .page-drop-input {
    pointer-events: auto;   /* active: catch the drop */
}

/* ── Blazor reconnect modal ──────────────────────────────────── */
#components-reconnect-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 2000;
    align-items: center;
    justify-content: center;
}

#components-reconnect-modal.components-reconnect-show,
#components-reconnect-modal.components-reconnect-failed,
#components-reconnect-modal.components-reconnect-rejected {
    display: flex;
}

.ipz-reconnect-overlay {
    position: absolute;
    inset: 0;
    background: rgba(11, 18, 32, 0.55);
}

.ipz-reconnect-dialog {
    position: relative;
    background: var(--ipz-surface);
    border: 1px solid var(--ipz-line);
    border-radius: var(--ipz-radius);
    box-shadow: var(--ipz-shadow);
    padding: 1.75rem 2.25rem;
    text-align: center;
    min-width: 280px;
    max-width: 380px;
    color: var(--ipz-text);
}

.ipz-reconnect-connecting,
.ipz-reconnect-failed,
.ipz-reconnect-rejected {
    display: none;
}

#components-reconnect-modal.components-reconnect-show    .ipz-reconnect-connecting { display: block; }
#components-reconnect-modal.components-reconnect-failed  .ipz-reconnect-failed    { display: block; }
#components-reconnect-modal.components-reconnect-rejected .ipz-reconnect-rejected  { display: block; }

.ipz-reconnect-spinner {
    width: 2rem;
    height: 2rem;
    border: 3px solid var(--ipz-line);
    border-top-color: var(--ipz-cyan);
    border-radius: 50%;
    animation: ipz-reconnect-spin 0.75s linear infinite;
    margin: 0 auto 0.85rem;
}

@keyframes ipz-reconnect-spin {
    to { transform: rotate(360deg); }
}

.ipz-reconnect-message {
    margin: 0 0 0.85rem;
    font-size: 0.9rem;
    color: var(--ipz-text);
}

/* ── Page grid for PDF Tools ── */
.ipz-page-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 12px;
}

.ipz-page-card {
    position: relative;
    border: 2px solid var(--ipz-line);
    border-radius: var(--ipz-radius);
    background: var(--ipz-surface);
    overflow: hidden;
    transition: border-color 0.15s, opacity 0.15s;
}

.ipz-page-card:hover {
    border-color: var(--ipz-cyan);
}

.ipz-page-card.dragging {
    opacity: 0.4;
    transform: scale(0.95);
}

.ipz-page-card.drag-over {
    border-color: #C25100;
    border-style: dashed;
}

.ipz-page-card.deleted {
    opacity: 0.35;
    border-style: dashed;
}

.ipz-page-card-thumb {
    width: 100%;
    aspect-ratio: 8.5 / 11;
    object-fit: contain;
    background: var(--ipz-paper-2);
    display: block;
}

/* ── Support chat widget ──────────────────────────────────── */
.ipz-chat-widget {
    position: fixed;
    bottom: 1.25rem;
    right: 1.25rem;
    z-index: 1050;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    font-size: .9rem;
}

.ipz-chat-fab {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 50%;
    border: none;
    background: var(--ipz-brand);
    color: #fff;
    box-shadow: var(--ipz-shadow);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform .15s, box-shadow .15s;
}

.ipz-chat-fab:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 16px rgba(11,18,32,.18);
}

.ipz-chat-window {
    width: min(360px, calc(100vw - 2.5rem));
    max-height: calc(100vh - 6rem);
    display: flex;
    flex-direction: column;
    background: var(--ipz-surface);
    border: 1px solid var(--ipz-line);
    border-radius: var(--ipz-radius);
    box-shadow: var(--ipz-shadow);
    margin-bottom: .75rem;
    overflow: hidden;
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity .15s, transform .15s;
}

.ipz-chat-window.open {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.ipz-chat-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .85rem 1rem;
    background: var(--ipz-brand-soft);
    border-bottom: 1px solid var(--ipz-line);
}

.ipz-chat-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--ipz-ink);
}

.ipz-chat-subtitle {
    font-size: .75rem;
    color: var(--ipz-muted);
}

.ipz-chat-close {
    background: transparent;
    border: none;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--ipz-muted);
    cursor: pointer;
}

.ipz-chat-close:hover { color: var(--ipz-ink); }

.ipz-chat-window.closed {
    display: none;
}

.ipz-chat-messages {
    flex: 1 1 auto;
    min-height: 220px;
    max-height: 360px;
    overflow-y: auto;
    padding: .75rem;
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.ipz-chat-message {
    display: flex;
    flex-direction: column;
    max-width: 85%;
}

.ipz-chat-message--user {
    align-self: flex-end;
}

.ipz-chat-message--agent {
    align-self: flex-start;
}

.ipz-chat-bubble {
    padding: .55rem .75rem;
    border-radius: .75rem;
    line-height: 1.35;
    background: var(--ipz-surface-2);
    color: var(--ipz-text);
    border: 1px solid var(--ipz-line);
}

.ipz-chat-message--user .ipz-chat-bubble {
    background: var(--ipz-cyan);
    color: #fff;
    border-color: transparent;
}

.ipz-chat-bubble--typing {
    display: flex;
    gap: .25rem;
    padding: .65rem .75rem;
}

.ipz-chat-dot {
    width: .4rem;
    height: .4rem;
    border-radius: 50%;
    background: var(--ipz-muted);
    animation: ipz-chat-bounce 1.2s infinite ease-in-out;
}

.ipz-chat-dot:nth-child(2) { animation-delay: .15s; }
.ipz-chat-dot:nth-child(3) { animation-delay: .3s; }

@keyframes ipz-chat-bounce {
    0%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-4px); }
}

.ipz-chat-meta {
    font-size: .72rem;
    color: var(--ipz-muted);
    margin-top: .2rem;
}

.ipz-chat-meta a { color: var(--ipz-cyan); text-decoration: none; }
.ipz-chat-meta a:hover { text-decoration: underline; }

.ipz-chat-input-area {
    padding: .75rem;
    border-top: 1px solid var(--ipz-line);
    background: var(--ipz-surface-2);
}

.ipz-chat-field { margin-bottom: .5rem; }

.ipz-chat-textarea {
    width: 100%;
    resize: none;
    border: 1px solid var(--ipz-line);
    border-radius: .5rem;
    padding: .5rem .65rem;
    background: var(--ipz-surface);
    color: var(--ipz-text);
    font-size: .9rem;
}

.ipz-chat-textarea:focus {
    outline: none;
    border-color: var(--ipz-cyan);
}

.ipz-chat-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

.ipz-chat-error {
    font-size: .8rem;
    color: #dc3545;
    margin-bottom: .5rem;
}

html[data-theme='dark'] .ipz-chat-bubble {
    background: var(--ipz-paper-2);
    color: var(--ipz-text);
}

html[data-theme='dark'] .ipz-chat-message--user .ipz-chat-bubble {
    background: var(--ipz-cyan);
    color: #0B1220;
}

@media (max-width: 420px) {
    .ipz-chat-widget {
        bottom: .75rem;
        right: .75rem;
    }
    .ipz-chat-window {
        width: calc(100vw - 1.5rem);
    }
}
}

.ipz-page-card-label {
    text-align: center;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ipz-muted);
    padding: 2px 0;
    background: var(--ipz-surface-2);
}

.ipz-page-card-actions {
    position: absolute;
    top: 4px;
    right: 4px;
    display: flex;
    gap: 2px;
}

.ipz-page-card-actions button {
    width: 24px;
    height: 24px;
    padding: 0;
    border: none;
    border-radius: 4px;
    background: rgba(255,255,255,0.85);
    color: var(--ipz-ink);
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.1s;
}

html[data-theme='dark'] .ipz-page-card-actions button {
    background: rgba(15,20,32,0.85);
    color: var(--ipz-ink);
}

.ipz-page-card-actions button:hover {
    background: var(--ipz-cyan);
    color: #fff;
}

.ipz-page-card-actions button.btn-delete:hover {
    background: #C25100;
    color: #fff;
}

.ipz-page-card-rotation {
    position: absolute;
    bottom: 4px;
    left: 4px;
    font-size: 0.6rem;
    font-weight: 700;
    color: var(--ipz-cyan);
    background: rgba(255,255,255,0.85);
    padding: 1px 4px;
    border-radius: 3px;
}

html[data-theme='dark'] .ipz-page-card-rotation {
    background: rgba(15,20,32,0.85);
}