/* ─── AI Chatbot - Elementor override ─── */
#fpChatBtn,
#fpChatBtn:hover,
#fpChatBtn:focus {
    position: fixed !important;
    bottom: 24px !important;
    right: 24px !important;
    z-index: 999999 !important;
    width: 60px !important;
    height: 60px !important;
    background: linear-gradient(135deg,#6366f1,#8b5cf6) !important;
    border: none !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 26px !important;
    box-shadow: 0 8px 32px rgba(99,102,241,.45) !important;
    color: white !important;
    text-decoration: none !important;
    pointer-events: all !important;
}

#fpChatOverlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 999998 !important;
    pointer-events: all !important;
}

#fpChatBox {
    position: fixed !important;
    bottom: 96px !important;
    right: 24px !important;
    z-index: 999999 !important;
    width: 380px !important;
    max-height: 560px !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    pointer-events: all !important;
}

#fpChatBox * {
    pointer-events: all !important;
}
.fp-shell a,
.fp-shell a:link,
.fp-shell a:visited,
.fp-shell a:hover,
.fp-shell a:active,
.fp-shell button,
.fp-shell .fp-nav-link,
.fp-shell .fp-btn-secondary,
.fp-shell .fp-btn-ghost,
.fp-shell .fp-card-head a,
.fp-shell .fp-page-sub a {
    color: inherit;
    text-decoration: none;
}

/* Nav links zwart — overschrijft Elementor theme link kleur */
.fp-shell .fp-nav { color: #0f172a; }
.fp-shell .fp-nav .fp-nav-link,
.fp-shell .fp-nav a,
.fp-shell .fp-nav a:link,
.fp-shell .fp-nav a:visited { color: #0f172a !important; }
.fp-shell .fp-nav a:hover { color: #0f172a !important; }
.fp-shell .fp-nav .fp-nav-link.active,
.fp-shell .fp-nav a.active { color: #1f6feb !important; }

/* Actie knoppen — zwart */
.fp-shell .fp-btn-ghost,
.fp-shell .fp-btn-ghost:link,
.fp-shell .fp-btn-ghost:visited { color: #0f172a !important; }
.fp-shell .fp-btn-secondary,
.fp-shell .fp-btn-secondary:link { color: #0f172a !important; }

.fp-shell,.fp-shell *,.fp-auth-wrap,.fp-auth-wrap *{box-sizing:border-box}.fp-shell,.fp-auth-wrap{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:#18212f}.fp-shell{background:linear-gradient(180deg,#f7f9fc 0%,#eef3f8 100%);border:1px solid #e6ebf2;border-radius:24px;overflow:visible;position:relative;box-shadow:0 18px 50px rgba(15,23,42,.08)}.fp-topbar{display:flex;align-items:center;gap:16px;padding:14px 24px;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border-bottom:1px solid #e6ebf2;position:sticky;top:0;z-index:100;flex-wrap:wrap;overflow:visible}.fp-brand-wrap{display:flex;align-items:center;gap:14px}.fp-brand-mark{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#1f6feb,#8f5bff);color:#fff;display:grid;place-items:center;font-weight:800}.fp-brand-title{font-size:18px;font-weight:800}.fp-brand-sub{font-size:12px;color:#64748b}.fp-topbar-right{display:flex;align-items:center;gap:10px;margin-left:auto}
.fp-nav{display:flex;align-items:center;gap:10px;flex:1;justify-content:center}.fp-shell .fp-topbar .fp-nav a.fp-nav-link,
.fp-shell .fp-topbar .fp-nav a.fp-nav-link:link,
.fp-shell .fp-topbar .fp-nav a.fp-nav-link:visited {
    padding:10px 18px !important;border-radius:999px !important;text-decoration:none !important;
    color:#0f172a !important;font-weight:600 !important;font-size:14px !important;
    transition:.18s ease !important;border:1.5px solid transparent !important;
    background:transparent !important;
}
.fp-shell .fp-topbar .fp-nav a.fp-nav-link:hover {
    background:#f8fafc !important;color:#0f172a !important;border-color:#e2e8f0 !important;
    transform:none !important;
}
.fp-shell .fp-topbar .fp-nav a.fp-nav-link.active {
    background:#fff !important;color:#1f6feb !important;border:1.5px solid #1f6feb !important;
    box-shadow:0 2px 12px rgba(31,111,235,.12) !important;
}.fp-topbar-actions{display:flex;align-items:center;gap:10px}.fp-shell .fp-user-chip,
.fp-shell .fp-user-chip-btn {
    padding: 9px 18px !important;
    background: #eff6ff !important;
    border: 1.5px solid #bfdbfe !important;
    border-radius: 999px !important;
    font-weight: 700 !important;
    color: #1d4ed8 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    transition: .15s ease !important;
    cursor: pointer !important;
    font-family: inherit !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    box-shadow: none !important;
}
.fp-shell .fp-user-chip:hover,
.fp-shell .fp-user-chip-btn:hover {
    background: #dbeafe !important;
    border-color: #1f6feb !important;
    color: #1e40af !important;
}
.fp-user-dropdown{position:relative}
.fp-user-menu{display:none;position:absolute;right:0;top:calc(100% + 8px);background:#fff;border:1px solid #e2e8f0;border-radius:16px;box-shadow:0 8px 32px rgba(15,23,42,.12);min-width:180px;overflow:hidden;z-index:200}
.fp-user-menu.open{display:block}
.fp-user-menu-item{display:block;width:100%;padding:12px 16px;text-align:left;font-size:14px;font-weight:600;color:#334155;text-decoration:none;background:none;border:none;cursor:pointer;font-family:inherit}
.fp-user-menu-item:hover{background:#f1f5f9}
.fp-user-menu-divider{height:1px;background:#e6ebf2;margin:2px 0}
.fp-user-menu-logout{color:#ef4444 !important}
.fp-user-menu-logout:hover{background:#fef2f2 !important}
.fp-hamburger{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:40px;height:40px;background:#f8fafc !important;border:1.5px solid #e2e8f0 !important;border-radius:10px;cursor:pointer;padding:0;transition:.15s ease}
.fp-hamburger:hover{background:#f1f5f9 !important;border-color:#cbd5e1 !important}
.fp-hamburger span{display:block;width:18px;height:2px;background:#334155 !important;border-radius:2px;transition:all .25s ease}
.fp-hamburger.open{background:#f1f5f9 !important;border-color:#cbd5e1 !important}
.fp-hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.fp-hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.fp-hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.fp-mobile-menu{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(15,23,42,.5);
    backdrop-filter:blur(6px);
    z-index:99999;
    align-items:center;
    justify-content:center;
    opacity:0;
    transition:opacity .25s ease;
}
.fp-mobile-menu.open{
    display:flex;
}
.fp-mobile-menu.open.visible{
    opacity:1;
}
.fp-mobile-menu-inner{
    background:#fff;
    width:calc(100% - 48px);
    max-width:360px;
    border-radius:24px;
    box-shadow:0 32px 80px rgba(15,23,42,.25);
    overflow:hidden;
    transform:scale(.9) translateY(16px);
    opacity:0;
    transition:transform .3s cubic-bezier(.34,1.56,.64,1), opacity .25s ease;
}
.fp-mobile-menu.open.visible .fp-mobile-menu-inner{
    transform:scale(1) translateY(0);
    opacity:1;
}
.fp-mobile-link{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:15px 24px;
    border-radius:0;
    text-decoration:none !important;
    color:#1e293b !important;
    font-weight:600;
    font-size:16px;
    background:none;
    border:none;
    cursor:pointer;
    text-align:center;
    width:100%;
    transition:.15s ease;
    letter-spacing:.01em;
    position:relative;
}
.fp-mobile-link::after{
    content:'';
    position:absolute;
    bottom:0;left:24px;right:24px;
    height:1px;background:#f1f5f9;
}
.fp-mobile-link:last-of-type::after{display:none}
.fp-mobile-link:hover{background:#f8fafc !important;color:#1f6feb !important}
.fp-mobile-link.active{
    background:linear-gradient(135deg,#1f6feb,#8f5bff) !important;
    color:#fff !important;
}
.fp-mobile-logout{
    color:#e11d48 !important;
    font-weight:600 !important;
    margin:8px 12px 12px !important;
    border-radius:12px !important;
    background:#fff1f2 !important;
    border:1px solid #fecdd3 !important;
    width:calc(100% - 24px) !important;
}
.fp-mobile-logout:hover{background:#ffe4e6 !important;color:#be123c !important}
.fp-mobile-divider{height:1px;background:#f1f5f9;margin:0}
/* Menu header */
.fp-mobile-menu-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:18px 20px 14px;
    border-bottom:1px solid #f1f5f9;
}
.fp-mobile-menu-title{
    font-weight:700;font-size:16px;color:#0f172a;
}
.fp-mobile-menu-close{
    background:#f1f5f9;border:none;border-radius:50%;
    width:32px;height:32px;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    font-size:14px;color:#64748b;
    transition:.15s ease;
}
.fp-mobile-menu-close:hover{background:#e2e8f0;color:#0f172a}
/* Gebruiker in menu */
.fp-mobile-user{
    display:flex;align-items:center;gap:10px;
    padding:12px 20px;color:#64748b;font-size:13px;
    text-decoration:none !important;
    border-bottom:1px solid #f1f5f9;
}
.fp-mobile-user:hover{background:#f8fafc}.fp-menu-toggle{display:none}.fp-main{padding:28px}.fp-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:22px}.fp-page-title{font-size:32px;line-height:1.1;margin:0;font-weight:800}.fp-page-sub{margin:8px 0 0;color:#64748b}.fp-shell .fp-actions-row{display:flex !important;gap:10px !important;flex-wrap:nowrap !important;align-items:center !important}.fp-shell .fp-actions-row .fp-btn{height:44px !important;display:inline-flex !important;align-items:center !important;white-space:nowrap !important;padding:0 18px !important}.fp-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:20px}.fp-stat-card,.fp-card{background:#fff;border:1px solid #e6ebf2;border-radius:22px;box-shadow:0 10px 30px rgba(15,23,42,.05)}.fp-stat-card{padding:22px}.fp-stat-card strong{display:block;font-size:30px;line-height:1.1;margin:8px 0;font-weight:800}.fp-stat-kicker{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#64748b;font-weight:700}.fp-grid-2{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.fp-grid-profile{grid-template-columns:1.2fr .8fr}.fp-card{padding:22px}.fp-card-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}.fp-card-head h2{margin:0;font-size:20px}.fp-card-head a{color:#2563eb;text-decoration:none;font-weight:700}.fp-empty-inline{padding:26px;border:1px dashed #cbd5e1;border-radius:18px;color:#64748b;text-align:center}.fp-table{width:100%;border-collapse:collapse}.fp-table th,.fp-table td{padding:14px 12px;text-align:left;border-bottom:1px solid #eef2f7;vertical-align:middle}.fp-table th{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#64748b}.fp-actions-cell{display:flex;gap:8px;flex-wrap:wrap}.fp-status{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.02em}.fp-status-concept,.fp-status-nieuw{background:#fff7ed;color:#c2410c}.fp-status-verzonden{background:#eff6ff;color:#1d4ed8}.fp-status-betaald{background:#ecfdf5;color:#15803d}.fp-status-afgewezen,.fp-status-geannuleerd{background:#fef2f2;color:#dc2626}.fp-status-omgezet,.fp-status-geaccepteerd{background:#f5f3ff;color:#7c3aed}.fp-btn{appearance:none;border:none;border-radius:14px;padding:13px 18px;text-decoration:none;font-weight:800;cursor:pointer;transition:.2s ease;display:inline-flex;align-items:center;justify-content:center;gap:8px}.fp-shell .fp-btn:hover{transform:translateY(-1px)}.fp-shell .fp-btn-ghost:hover{background:#f8fafc !important;color:#0f172a !important}.fp-shell .fp-btn-secondary:hover{color:#0f172a !important}.fp-btn-primary{background:linear-gradient(135deg,#1f6feb,#8f5bff);color:#fff;box-shadow:0 12px 24px rgba(31,111,235,.18)}.fp-shell .fp-btn-secondary{background:#eef4ff !important;color:#1e293b !important;border:1.5px solid #bfdbfe !important}.fp-shell .fp-btn-ghost{background:#fff !important;border:1.5px solid #e2e8f0 !important;color:#1e293b !important}.fp-btn-danger{background:#ef4444;color:#fff}.fp-btn-xs{padding:9px 12px;border-radius:12px;font-size:12px}.fp-btn-block{width:100%}.fp-msg{padding:14px 18px;border-radius:16px;margin:0 0 16px}.fp-msg-success{background:#ecfdf5;color:#166534;border:1px solid #bbf7d0}.fp-msg-error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}.fp-auth-wrap{display:flex;justify-content:center;padding:48px 16px;min-height:100vh;background:linear-gradient(135deg,#1e40af 0%,#3b82f6 40%,#6366f1 100%) !important}.fp-auth-box{width:100%;max-width:700px;background:#fff;border-radius:24px;border:1px solid #e6ebf2;box-shadow:0 18px 50px rgba(15,23,42,.15);padding:40px}.fp-auth-logo{font-size:26px;font-weight:900}.fp-subtitle{color:#64748b;margin:10px 0 22px}.fp-form,.fp-doc-form{display:grid;gap:16px}.fp-field label{display:block;font-size:13px;font-weight:800;color:#334155;margin-bottom:8px}.fp-field input,.fp-field textarea,.fp-field select{width:100%;padding:14px 15px;border-radius:14px;border:1px solid #d9e2ec;background:#fff;color:#0f172a}.fp-form-grid{display:grid;gap:14px}.fp-form-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.fp-form-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.fp-form-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.fp-field-span-2{grid-column:span 2}.fp-item-card{padding:18px;border:1px solid #e8edf5;border-radius:18px;background:#fbfdff}.fp-item-card+.fp-item-card{margin-top:14px}.fp-item-actions{display:flex;justify-content:flex-end;margin-top:12px}.fp-line-total{height:52px;display:flex;align-items:center;padding:0 14px;background:#f8fafc;border:1px solid #d9e2ec;border-radius:14px;font-weight:800}.fp-doc-footer{display:grid;grid-template-columns:.8fr 1.2fr;gap:18px;align-items:end}.fp-summary-card{position:sticky;bottom:16px}.fp-summary-row{display:flex;justify-content:space-between;gap:16px;padding:10px 0;color:#334155}.fp-summary-grand{padding-top:14px;margin-top:6px;border-top:1px solid #e2e8f0;font-size:20px}.fp-form-actions{display:flex;justify-content:flex-end;gap:12px;align-items:center}.fp-logo-preview{width:120px;height:120px;border-radius:20px;background:#f8fafc;border:1px solid #e2e8f0;display:grid;place-items:center;margin-bottom:14px;overflow:hidden}.fp-logo-preview img{max-width:100%;max-height:100%;object-fit:contain}.fp-profile-side hr{border:none;border-top:1px solid #e2e8f0;margin:10px 0}.fp-item-template{display:none}.fp-help{font-size:12px;color:#64748b}.fp-required{color:#dc2626}.fp-fieldset{border:none;padding:0;margin:0}.fp-legend{font-weight:800}.fp-remove-row{min-width:110px}
@media (max-width:1024px){.fp-stat-grid,.fp-grid-2,.fp-doc-footer,.fp-form-grid-3,.fp-form-grid-4{grid-template-columns:1fr 1fr}.fp-field-span-2{grid-column:span 1}.fp-nav{justify-content:flex-start;overflow:auto}}
@media (max-width:760px){.fp-topbar{flex-wrap:wrap;padding:18px}.fp-menu-toggle{display:inline-flex;padding:10px 14px;border-radius:12px;background:#eef4ff;border:none;font-weight:800}.fp-nav{display:none;width:100%;flex-wrap:wrap;padding-top:8px}.fp-nav.open{display:flex}.fp-topbar-actions{width:100%;justify-content:space-between}.fp-main{padding:18px}.fp-page-head,.fp-form-actions{flex-direction:column;align-items:stretch}.fp-stat-grid,.fp-grid-2,.fp-doc-footer,.fp-form-grid-2,.fp-form-grid-3,.fp-form-grid-4{grid-template-columns:1fr}.fp-table{display:block;overflow:auto}.fp-actions-cell{min-width:240px}}

.fp-inline-note{padding:12px 14px;border-radius:14px;background:#f8fafc;border:1px dashed #d9e2ec;color:#475569;font-size:13px}.fp-table td .fp-client-sub{display:block;font-size:12px;color:#64748b;margin-top:4px}

.fp-auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 18px}.fp-auth-tab{display:flex;align-items:center;justify-content:center;padding:12px 14px;border-radius:14px;border:1px solid #dbe4f0;background:#f8fafc;color:#334155;text-decoration:none;font-weight:800;transition:.2s ease}.fp-auth-tab.active{background:linear-gradient(135deg,#1f6feb,#8f5bff);border-color:transparent;color:#fff;box-shadow:0 12px 24px rgba(31,111,235,.18)}.fp-auth-tab:hover{transform:translateY(-1px)}

.fp-color-field{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.fp-color-field .fp-help{margin:0}.fp-color-input{width:58px !important;height:40px !important;padding:4px !important;border-radius:12px !important;border:1px solid #d9e2ec !important;background:#fff !important;cursor:pointer}.fp-color-input::-webkit-color-swatch-wrapper{padding:0}.fp-color-input::-webkit-color-swatch{border:none;border-radius:8px}


.fp-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;padding-bottom:6px;border-bottom:1px solid #edf2f7;margin-bottom:2px}.fp-section-head h2{margin:0;font-size:19px}.fp-settings-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.fp-settings-main{display:grid;gap:16px}.fp-settings-side{position:sticky;top:92px;padding:20px}.fp-side-block+.fp-side-block{margin-top:18px}.fp-side-block h2{margin:0 0 10px;font-size:18px}.fp-chip-list{display:flex;flex-wrap:wrap;gap:8px}.fp-chip{display:inline-flex;align-items:center;padding:8px 11px;border-radius:999px;background:#f8fafc;border:1px solid #dbe4f0;color:#1e293b;font-size:12px;font-weight:700}.fp-color-swatch-label{display:inline-flex;align-items:center;min-width:86px;padding:8px 10px;border-radius:12px;background:#f8fafc;border:1px solid #dbe4f0;font-size:12px;font-weight:800;color:#334155;text-transform:uppercase}.fp-settings-main textarea{min-height:112px}.fp-settings-main .fp-btn-primary{margin-top:4px}
@media (max-width:1024px){.fp-settings-layout{grid-template-columns:1fr 1fr;gap:16px}.fp-settings-side{position:static;top:auto}}
@media (max-width:768px){.fp-settings-layout{grid-template-columns:1fr}.fp-settings-side{position:static;top:auto}}


/* SaaS polish: dashboard cards + tables */
.fp-stat-card{position:relative;overflow:hidden;border-color:#dfe7f1;background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)}
.fp-stat-card:before{content:"";position:absolute;inset:0 auto auto 0;width:100%;height:4px;background:linear-gradient(90deg,#1f6feb,#8f5bff)}
.fp-stat-card span:last-child{display:block;color:#64748b;font-weight:600}
.fp-stat-card:hover,.fp-card:hover{box-shadow:0 16px 38px rgba(15,23,42,.08);transform:translateY(-1px)}
.fp-card{transition:box-shadow .2s ease,transform .2s ease}
.fp-table-shell{border:1px solid #e6ebf2;border-radius:18px;overflow:hidden;background:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
.fp-table-shell-compact{border:none;border-radius:16px;box-shadow:none;background:transparent}
.fp-table-modern thead th{background:#f8fafc;position:sticky;top:0;z-index:1}
.fp-table-modern tbody tr:nth-child(even){background:#fbfdff}
.fp-table-modern tbody tr:hover{background:#f3f7ff}
.fp-table-modern td:first-child{font-weight:700;color:#0f172a}
.fp-table-modern td:nth-child(4),.fp-table-modern td:nth-child(3){white-space:nowrap}
.fp-actions-cell .fp-btn{box-shadow:none}
.fp-actions-cell .fp-btn-secondary{background:#edf3ff;color:#1d4ed8}
.fp-actions-cell .fp-btn-ghost{background:#fff;border:1px solid #dbe4f0}
/* Compact action buttons */
.fp-actions-cell{gap:4px}
.fp-actions-cell .fp-btn-xs{padding:6px 10px;font-size:11px;border-radius:8px}
.fp-actions-cell form{display:inline;margin:0}
.fp-page-head .fp-btn{min-height:46px}


/* ─── v3.8.0: Contacten ─── */
.fp-card-import{border:2px dashed #dbe4f0;background:linear-gradient(180deg,#f8faff 0%,#fff 100%)}
.fp-card-import .fp-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.fp-card-import .fp-card-head h2{margin:0;font-size:17px}
.fp-badge-soft{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;background:#edf3ff;color:#1d4ed8;font-size:12px;font-weight:700;border:1px solid #bfdbfe}
.fp-import-form{display:flex;flex-direction:column;gap:10px}
.fp-import-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.fp-file-label{display:flex;align-items:center;gap:10px;cursor:pointer;flex-wrap:wrap}
.fp-file-input{display:none}
.fp-file-name{font-size:13px;color:var(--fp-text-muted,#64748b);min-width:160px}
.fp-search-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.fp-search-input{flex:1;min-width:200px;padding:10px 14px;border:1px solid #dbe4f0;border-radius:12px;font-size:14px;outline:none;transition:border-color .2s}
.fp-search-input:focus{border-color:#1f6feb;box-shadow:0 0 0 3px rgba(31,111,235,.12)}
.fp-source-badge{display:inline-flex;align-items:center;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px}
.fp-source-csv{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0}
.fp-source-handmatig{background:#f8fafc;color:#475569;border:1px solid #dbe4f0}
.fp-form-contact .fp-form-grid-3{grid-template-columns:1fr 2fr 1fr}
.fp-form-footer{display:flex;gap:10px;align-items:center;margin-top:8px}
@media(max-width:760px){.fp-import-row{flex-direction:column;align-items:stretch}.fp-import-row .fp-btn{width:100%}.fp-form-contact .fp-form-grid-3{grid-template-columns:1fr}}


/* ─── v4.3.2: Responsive layout ─── */

/* ── Topbar basis ── */
.fp-topbar { flex-direction: column; padding: 0; gap: 0; }
.fp-topbar-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 24px;
    width: 100%;
    box-sizing: border-box;
}
.fp-brand-mark { flex-shrink: 0; width: 44px; height: 44px; }
/* Topbar: 3-kolom grid alleen op desktop — op mobiel flex via bottom nav inline style */
@media (min-width: 769px) {
.fp-topbar {
    display: grid !important;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 0;
    position: sticky;
    top: 0;
}
}
.fp-nav { display: flex; align-items: center; gap: 4px; justify-content: center; }
.fp-topbar-right { display: flex; align-items: center; gap: 10px; justify-content: flex-end; }

/* Hamburger — verborgen op desktop */
.fp-menu-toggle {
    display: none;
    width: 40px;
    height: 40px;
    background: #f1f5f9;
    border: 1px solid #dbe4f0;
    border-radius: 10px;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    color: #334155;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Mobiele nav — verborgen tenzij .open */
.fp-nav-mobile {
    display: none;
    flex-direction: column;
    gap: 2px;
    padding: 8px 12px 12px;
    border-top: 1px solid #e6ebf2;
    width: 100%;
    box-sizing: border-box;
    background: rgba(255,255,255,0.95);
}
.fp-nav-mobile.open { display: flex; }
.fp-nav-mobile .fp-nav-link {
    width: 100%;
    border-radius: 12px;
    padding: 12px 16px;
    text-align: left;
}

/* ── Tablet (768–1024px) ── */
@media (max-width: 1024px) {
    .fp-stat-grid { grid-template-columns: repeat(2, 1fr); }
    .fp-settings-layout { grid-template-columns: 1fr 1fr; gap: 16px; }
    .fp-settings-side { position: static; }
    .fp-doc-footer { grid-template-columns: 1fr; }
    .fp-form-grid-3, .fp-form-grid-4 { grid-template-columns: 1fr 1fr; }
    .fp-nav { gap: 2px; }
    .fp-nav-link { padding: 10px 12px; font-size: 13px; }
}

/* ── Mobiel (max 767px) ── */
@media (max-width: 767px) {
    /* Mobiel: logo links, hamburger rechts — override grid naar flex */
    /* fp-topbar verborgen op alle schermen */
    .fp-brand-mark { flex-shrink: 0; }
    .fp-nav { display: none !important; }
    .fp-topbar-right { margin-left: auto; gap: 8px; justify-content: flex-end; }
    .fp-hamburger { display: flex !important; }
    .fp-logout-form { display: none !important; }
    .fp-user-chip, .fp-user-chip-btn { display: none !important; }
    .fp-main { padding: 14px; }
    .fp-page-head { flex-direction: column; align-items: stretch; gap: 10px; }
    .fp-page-title { font-size: 22px; }
    .fp-actions-row { flex-direction: column; gap: 8px; }
    .fp-actions-row .fp-btn { width: 100%; justify-content: center; }
    .fp-stat-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .fp-stat-card { padding: 14px; }
    .fp-stat-card strong { font-size: 20px; }
    .fp-grid-2, .fp-grid-profile { grid-template-columns: 1fr; }
    .fp-form-grid-2, .fp-form-grid-3, .fp-form-grid-4 { grid-template-columns: 1fr; }
    .fp-field-span-2 { grid-column: span 1; }
    .fp-card { padding: 14px; border-radius: 16px; }
    .fp-table-shell { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .fp-table { min-width: 520px; }
    .fp-table th, .fp-table td { padding: 10px 8px; font-size: 12px; }
    .fp-actions-cell { gap: 5px; flex-wrap: nowrap; }
    .fp-btn-xs { padding: 6px 9px; font-size: 11px; }
    .fp-form-actions { flex-direction: column-reverse; align-items: stretch; }
    .fp-form-actions .fp-btn { width: 100%; justify-content: center; }
    .fp-doc-footer { grid-template-columns: 1fr; }
    .fp-settings-layout { grid-template-columns: 1fr; }
    .fp-settings-side { position: static; }
    .fp-auth-wrap { padding: 12px; }
    .fp-auth-box { padding: 20px 16px; }
    .fp-search-bar { flex-direction: column; }
    .fp-search-input { width: 100%; }
    .fp-import-row { flex-direction: column; align-items: stretch; }
    .fp-import-row .fp-btn { width: 100%; }
}

/* ── Extra klein (max 420px) ── */
@media (max-width: 420px) {
    .fp-stat-grid { grid-template-columns: 1fr; }
    .fp-page-title { font-size: 19px; }
    .fp-stat-card strong { font-size: 18px; }
    .fp-user-chip { max-width: 100px; font-size: 12px; }
}

/* Chatbot responsive */
@media (max-width: 767px) {
    #fpChatBox {
        width: calc(100vw - 32px) !important;
        right: 16px !important;
        bottom: 80px !important;
    }
    #fpChatBtn {
        right: 16px !important;
        bottom: 16px !important;
    }
}

/* ══════════════════════════════════════════════════════════════
   DARK MODE — v4.43.0
   Activated by [data-theme="dark"] on <html> (set by website's
   invoisioApplyTheme()). The plugin inherits the website's theme
   automatically — no separate toggle required.
   ══════════════════════════════════════════════════════════════ */

/* Shell & topbar backgrounds */
[data-theme="dark"] .fp-shell {
  background: var(--bg2, #111c30) !important;
  border-color: var(--border, #2a3a52) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.35) !important;
}
[data-theme="dark"] .fp-topbar {
  background: rgba(11,18,32,.96) !important;
  border-bottom-color: var(--border, #2a3a52) !important;
}

/* Cards and panels */
[data-theme="dark"] .fp-card,
[data-theme="dark"] .fp-stat-card {
  background: var(--card, #111c30) !important;
  border-color: var(--border, #2a3a52) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.3) !important;
}

/* Auth box */
[data-theme="dark"] .fp-auth-box {
  background: var(--card, #111c30) !important;
  border-color: var(--border, #2a3a52) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.35) !important;
}

/* Form field backgrounds */
[data-theme="dark"] .fp-field input,
[data-theme="dark"] .fp-field textarea,
[data-theme="dark"] .fp-field select {
  background: var(--bg3, #17243b) !important;
  border-color: var(--border, #2a3a52) !important;
  color: var(--text, #f8fafc) !important;
}
[data-theme="dark"] .fp-field input::placeholder,
[data-theme="dark"] .fp-field textarea::placeholder {
  color: var(--text3, #a9bad0) !important;
  opacity: 1;
}

/* Item cards (invoice/quote line rows) */
[data-theme="dark"] .fp-item-card {
  background: var(--bg3, #17243b) !important;
  border-color: var(--border, #2a3a52) !important;
}
[data-theme="dark"] .fp-line-total {
  background: var(--bg2, #111c30) !important;
  border-color: var(--border, #2a3a52) !important;
  color: var(--text, #f8fafc) !important;
}

/* Tables */
[data-theme="dark"] .fp-table th,
[data-theme="dark"] .fp-table td {
  border-bottom-color: var(--border, #2a3a52) !important;
}
[data-theme="dark"] .fp-table-shell {
  background: var(--card, #111c30) !important;
  border-color: var(--border, #2a3a52) !important;
}

/* User dropdown menu */
[data-theme="dark"] .fp-user-menu {
  background: var(--card, #111c30) !important;
  border-color: var(--border, #2a3a52) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.4) !important;
}
[data-theme="dark"] .fp-user-menu-item {
  color: var(--text2, #dbe6f3) !important;
}
[data-theme="dark"] .fp-user-menu-item:hover {
  background: var(--bg3, #17243b) !important;
}
[data-theme="dark"] .fp-user-menu-divider {
  background: var(--border, #2a3a52) !important;
}
[data-theme="dark"] .fp-user-menu-logout:hover {
  background: rgba(239,68,68,.15) !important;
  color: #fca5a5 !important;
}

/* Ghost and secondary buttons */
[data-theme="dark"] .fp-shell .fp-btn-ghost {
  background: var(--bg3, #17243b) !important;
  border-color: var(--border, #2a3a52) !important;
  color: var(--text2, #dbe6f3) !important;
}
[data-theme="dark"] .fp-shell .fp-btn-ghost:hover {
  background: var(--bg2, #111c30) !important;
  color: var(--text, #f8fafc) !important;
}
[data-theme="dark"] .fp-shell .fp-btn-secondary {
  background: var(--bg3, #17243b) !important;
  border-color: var(--border, #2a3a52) !important;
  color: var(--text2, #dbe6f3) !important;
}
[data-theme="dark"] .fp-shell .fp-btn-secondary:hover {
  color: var(--text, #f8fafc) !important;
}

/* Nav links */
[data-theme="dark"] .fp-shell .fp-nav { color: var(--text, #f8fafc) !important; }
[data-theme="dark"] .fp-shell .fp-topbar .fp-nav a.fp-nav-link,
[data-theme="dark"] .fp-shell .fp-topbar .fp-nav a.fp-nav-link:link,
[data-theme="dark"] .fp-shell .fp-topbar .fp-nav a.fp-nav-link:visited {
  color: var(--text2, #dbe6f3) !important;
}
[data-theme="dark"] .fp-shell .fp-topbar .fp-nav a.fp-nav-link:hover {
  color: var(--text, #f8fafc) !important;
}
[data-theme="dark"] .fp-shell .fp-topbar .fp-nav a.fp-nav-link.active {
  background: rgba(59,130,246,.15) !important;
  color: #93c5fd !important;
}

/* Hamburger button */
[data-theme="dark"] .fp-hamburger {
  background: var(--bg3, #17243b) !important;
  border-color: var(--border, #2a3a52) !important;
}
[data-theme="dark"] .fp-hamburger span {
  background: var(--text2, #dbe6f3) !important;
}

/* Mobile menu panel */
[data-theme="dark"] .fp-mobile-menu-panel {
  background: var(--card, #111c30) !important;
  border-color: var(--border, #2a3a52) !important;
}
[data-theme="dark"] .fp-mobile-link {
  color: var(--text2, #dbe6f3) !important;
}
[data-theme="dark"] .fp-mobile-link:hover {
  background: var(--bg3, #17243b) !important;
  color: var(--text, #f8fafc) !important;
}
[data-theme="dark"] .fp-mobile-divider,
[data-theme="dark"] .fp-mobile-menu-divider {
  background: var(--border, #2a3a52) !important;
}
[data-theme="dark"] .fp-mobile-logout:hover {
  background: rgba(239,68,68,.15) !important;
  color: #fca5a5 !important;
}

/* Status badges — lightened backgrounds for dark mode readability */
[data-theme="dark"] .fp-status-concept,
[data-theme="dark"] .fp-status-nieuw {
  background: rgba(194,65,12,.18) !important;
  color: #fdba74 !important;
}
[data-theme="dark"] .fp-status-verzonden {
  background: rgba(29,78,216,.18) !important;
  color: #93c5fd !important;
}
[data-theme="dark"] .fp-status-betaald {
  background: rgba(21,128,61,.18) !important;
  color: #6ee7b7 !important;
}
[data-theme="dark"] .fp-status-afgewezen,
[data-theme="dark"] .fp-status-geannuleerd {
  background: rgba(220,38,38,.18) !important;
  color: #fca5a5 !important;
}
[data-theme="dark"] .fp-status-omgezet,
[data-theme="dark"] .fp-status-geaccepteerd {
  background: rgba(124,58,237,.18) !important;
  color: #c4b5fd !important;
}

/* Message banners */
[data-theme="dark"] .fp-msg-success {
  background: rgba(21,128,61,.18) !important;
  color: #6ee7b7 !important;
  border-color: rgba(21,128,61,.35) !important;
}
[data-theme="dark"] .fp-msg-error {
  background: rgba(153,27,27,.18) !important;
  color: #fca5a5 !important;
  border-color: rgba(153,27,27,.35) !important;
}

/* Summary and doc footer */
[data-theme="dark"] .fp-summary-row {
  color: var(--text2, #dbe6f3) !important;
}
[data-theme="dark"] .fp-summary-grand {
  border-top-color: var(--border, #2a3a52) !important;
}
[data-theme="dark"] .fp-doc-footer .fp-summary-card {
  background: var(--card, #111c30) !important;
  border-color: var(--border, #2a3a52) !important;
}

/* Profile & template sections */
[data-theme="dark"] .fp-profile-side hr {
  border-top-color: var(--border, #2a3a52) !important;
}
[data-theme="dark"] .fp-logo-preview {
  background: var(--bg3, #17243b) !important;
  border-color: var(--border, #2a3a52) !important;
}
[data-theme="dark"] .fp-inline-note {
  background: var(--bg3, #17243b) !important;
  border-color: var(--border, #2a3a52) !important;
  color: var(--text2, #dbe6f3) !important;
}

/* Empty / dashed placeholder blocks */
[data-theme="dark"] .fp-empty-inline {
  border-color: var(--border, #2a3a52) !important;
  color: var(--text3, #a9bad0) !important;
}

/* Chip and user area */
[data-theme="dark"] .fp-shell .fp-user-chip,
[data-theme="dark"] .fp-shell .fp-user-chip-btn {
  background: var(--bg3, #17243b) !important;
  border-color: var(--border, #2a3a52) !important;
  color: var(--text2, #dbe6f3) !important;
}
[data-theme="dark"] .fp-shell .fp-user-chip:hover,
[data-theme="dark"] .fp-shell .fp-user-chip-btn:hover {
  background: var(--bg2, #111c30) !important;
}

/* Lookup widget (KvK search) */
[data-theme="dark"] #fpKvkResults,
[data-theme="dark"] #fpProfileKvkResults,
[data-theme="dark"] #fpAdminKvkResults {
  background: var(--card, #111c30) !important;
  border-color: var(--border, #2a3a52) !important;
}
[data-theme="dark"] #fpKvkResults > div,
[data-theme="dark"] #fpProfileKvkResults > div,
[data-theme="dark"] #fpAdminKvkResults > div {
  border-bottom-color: var(--border, #2a3a52) !important;
  color: var(--text2, #dbe6f3) !important;
}
[data-theme="dark"] #fpKvkResults > div:hover,
[data-theme="dark"] #fpProfileKvkResults > div:hover,
[data-theme="dark"] #fpAdminKvkResults > div:hover {
  background: var(--bg3, #17243b) !important;
}

/* Auth tabs */
[data-theme="dark"] .fp-auth-tabs {
  border-color: var(--border, #2a3a52) !important;
}
[data-theme="dark"] .fp-auth-tab {
  color: var(--text2, #dbe6f3) !important;
}
[data-theme="dark"] .fp-auth-tab.active {
  background: var(--btn-bg, #3b82f6) !important;
  color: #fff !important;
}

/* Color picker field */
[data-theme="dark"] .fp-color-field {
  background: var(--bg3, #17243b) !important;
  border-color: var(--border, #2a3a52) !important;
}

/* AI chatbot bubble (if present) */
[data-theme="dark"] #fpChatBox {
  background: var(--card, #111c30) !important;
  border-color: var(--border, #2a3a52) !important;
}
[data-theme="dark"] #fpChatMessages {
  background: var(--bg2, #111c30) !important;
}
[data-theme="dark"] #fpChatInput {
  background: var(--bg3, #17243b) !important;
  border-color: var(--border, #2a3a52) !important;
  color: var(--text, #f8fafc) !important;
}

/* ── Password eye toggle — v4.44 FINAL ─────────────────────── */
.fp-input-eye {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
}
.fp-input-eye input[type="password"],
.fp-input-eye input[type="text"] {
  width: 100% !important;
  padding-right: 46px !important;
}
/* Maximale specificiteit om elk thema/plugin te overschrijven */
html body .fp-shell .fp-input-eye button.fp-eye-btn,
html body .fp-auth-box .fp-input-eye button.fp-eye-btn,
html body .fp-input-eye button.fp-eye-btn,
.fp-auth-box button.fp-eye-btn,
button.fp-eye-btn {
  all: unset !important;
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
  position: absolute !important;
  right: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  background: none !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  padding: 4px !important;
  margin: 0 !important;
  color: #94a3b8 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  line-height: 1 !important;
  font-size: inherit !important;
  outline: none !important;
  transition: color .15s !important;
}
html body .fp-shell .fp-input-eye button.fp-eye-btn:hover,
html body .fp-auth-box .fp-input-eye button.fp-eye-btn:hover,
html body .fp-input-eye button.fp-eye-btn:hover {
  color: #334155 !important;
  background: none !important;
  background-color: transparent !important;
  transform: translateY(-50%) !important;
}
html body .fp-input-eye button.fp-eye-btn.is-visible {
  color: #1e40af !important;
}
.fp-eye-icon {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  pointer-events: none !important;
}

/* Auth page body override */
body:has(.fp-auth-wrap){background:linear-gradient(135deg,#1e40af 0%,#3b82f6 40%,#6366f1 100%) !important;}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE FIXES — Alle apparaten v4.46.29
   ═══════════════════════════════════════════════════════ */

/* Topbar navigatie op tablet */
@media (max-width: 900px) {
  .fp-topbar { padding: 10px 16px; gap: 8px; }
  .fp-brand-title { font-size: 15px; }
  .fp-nav { display: none; }
  .fp-topbar-right { gap: 6px; }
}

/* Mobiel — volledig responsive */
@media (max-width: 640px) {
  /* Topbar */
  .fp-topbar { padding: 10px 14px; flex-wrap: nowrap; }
  .fp-brand-sub { display: none; }
  .fp-brand-mark { width: 36px; height: 36px; }
  .fp-brand-title { font-size: 14px; }

  /* Pagina content padding */
  .fp-page-head { padding: 20px 16px 0; }
  .fp-page-title { font-size: 22px !important; }
  .fp-page-sub { font-size: 13px !important; }

  /* Cards */
  .fp-card { border-radius: 12px; margin-bottom: 12px; }
  .fp-card-head { padding: 14px 16px; }
  .fp-card-body { padding: 16px; }

  /* Stat grid */
  .fp-stat-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
  .fp-stat-card { padding: 14px !important; }
  .fp-stat-card strong { font-size: 24px !important; }

  /* Grid 2 kolommen → 1 kolom */
  .fp-grid-2 {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  /* Tabellen scrollen horizontaal */
  .fp-table-shell {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 10px;
  }
  .fp-table { min-width: 500px; }

  /* Formulieren */
  .fp-form-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
  .fp-form-grid-4 { grid-template-columns: 1fr 1fr !important; }
  .fp-field { margin-bottom: 12px; }
  .fp-field input, .fp-field select, .fp-field textarea {
    font-size: 16px !important; /* Voorkomt zoom op iOS */
  }

  /* Knoppen */
  .fp-actions-row {
    flex-direction: column !important;
    gap: 8px !important;
  }
  .fp-actions-row .fp-btn {
    width: 100% !important;
    justify-content: center;
  }

  /* Items rij in factuur/offerte editor */
  .fp-item-card { padding: 14px !important; }
  .fp-form-grid-4 { grid-template-columns: 1fr 1fr !important; }

  /* Nav links op mobiel — verborgen, bottom nav neemt het over */
  .fp-nav { display: none !important; gap: 6px; }
  .fp-nav-link { padding: 6px 10px !important; font-size: 12px !important; }

  /* Mobile menu */
  .fp-mobile-menu { padding: 12px 14px 20px; }
  .fp-mobile-link { padding: 10px 14px; font-size: 14px; }

  /* Logout knop */
  .fp-logout-label { display: none; }

  /* Shell padding */
  .fp-shell { overflow-x: hidden; }

  /* Factuur/offerte overzicht */
  .fp-summary { padding: 14px 16px; }

  /* PDF preview */
  .fp-preview-wrap { overflow-x: auto; }
}

/* Extra klein — iPhone SE etc */
@media (max-width: 375px) {
  .fp-stat-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .fp-stat-card strong { font-size: 20px !important; }
  .fp-brand-title { display: none; }
  .fp-topbar { justify-content: space-between; }
}

/* Tablet landscape */
@media (min-width: 641px) and (max-width: 1024px) {
  .fp-stat-grid { grid-template-columns: repeat(4, 1fr) !important; }
  .fp-grid-2 { grid-template-columns: 1fr 1fr !important; }
  .fp-form-grid { grid-template-columns: 1fr 1fr !important; }
}

/* Dark mode portaal — tekst altijd leesbaar */
[data-theme="dark"] .fp-shell {
  background: linear-gradient(180deg, #1e293b 0%, #162032 100%) !important;
  border-color: #334155 !important;
  color: #f1f5f9 !important;
}
[data-theme="dark"] .fp-topbar {
  background: rgba(15,23,42,.95) !important;
  border-color: #334155 !important;
}
[data-theme="dark"] .fp-card {
  background: #1e293b !important;
  border-color: #334155 !important;
}
[data-theme="dark"] .fp-card-head {
  border-color: #334155 !important;
}
[data-theme="dark"] .fp-field input,
[data-theme="dark"] .fp-field select,
[data-theme="dark"] .fp-field textarea {
  background: #0f172a !important;
  border-color: #334155 !important;
  color: #f1f5f9 !important;
}
[data-theme="dark"] .fp-page-title { color: #f1f5f9 !important; }
[data-theme="dark"] .fp-page-sub { color: #cbd5e1 !important; }
[data-theme="dark"] .fp-stat-card {
  background: #0f172a !important;
  border-color: #334155 !important;
}
[data-theme="dark"] .fp-table th { background: #0f172a !important; color: #94a3b8 !important; }
[data-theme="dark"] .fp-table td { border-color: #334155 !important; color: #e2e8f0 !important; }
[data-theme="dark"] .fp-table tbody tr:hover td { background: #334155 !important; }
[data-theme="dark"] .fp-nav-link { color: #cbd5e1 !important; }
[data-theme="dark"] .fp-nav-link:hover { color: #f1f5f9 !important; }
[data-theme="dark"] .fp-nav-link.active { color: #60a5fa !important; }
[data-theme="dark"] .fp-brand-title { color: #f1f5f9 !important; }
[data-theme="dark"] .fp-empty { color: #94a3b8 !important; }
[data-theme="dark"] .fp-msg { border-color: #334155 !important; }

/* ═══════════════════════════════════════════════════════
   BOTTOM NAVIGATION BAR — Glasmorphism v4.46.30
   Alleen zichtbaar op mobiel (max 768px)
   5 items: Dashboard, Facturen, Offertes, Klanten, Meer
   ═══════════════════════════════════════════════════════ */

/* Verberg oude hamburger op mobiel */
@media (max-width: 768px) {
  /* Topbar: alleen PI logo links, alles weg */
  .fp-topbar {
    padding: 10px 14px !important;
    justify-content: flex-start !important;
  }
  .fp-topbar-right,
  .fp-nav,
  .fp-hamburger,
  .fp-mobile-menu,
  .fp-user-dropdown,
  #fpUserDropdown,
  .fp-user-chip,
  .fp-user-chip-btn,
  .fp-logout-form-topbar,
  .fp-logout-btn-topbar { display: none !important; }
  /* Content padding voor bottom nav */
  .fp-main { padding-bottom: 88px !important; }
}

/* ── Portal topbar verborgen — navigatie via bottom nav ── */
.fp-topbar { display: none !important; }
.fp-shell { padding-top: 0 !important; border-radius: 24px !important; }

/* ── Bottom Nav Container ─────────────────────────────── */
.fp-bottom-nav {
  display: flex; /* Base — overschreven door inline style in output_bottom_nav() */
  position: fixed;
  bottom: 0; left: 0; right: 0;
  height: 64px;
  z-index: 99999;

  /* Glasmorphism */
  background: rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  border-top: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow: 0 -4px 32px rgba(15, 23, 42, 0.08), 0 -1px 0 rgba(255,255,255,0.5) inset;

  /* Layout */
  flex-direction: row;
  align-items: stretch;
  justify-content: space-around;
  padding: 0 4px;
  padding-bottom: env(safe-area-inset-bottom, 0px); /* iPhone notch */
}

/* fp-bottom-nav is altijd zichtbaar (display:flex in base regel) */

/* Dark mode bottom nav */
[data-theme="dark"] .fp-bottom-nav {
  background: rgba(15, 23, 42, 0.85);
  border-top-color: rgba(51, 65, 85, 0.6);
  box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.3);
}

/* ── Bottom Nav Item ──────────────────────────────────── */
.fp-bnav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  flex: 1;
  padding: 6px 2px 4px;
  text-decoration: none !important;
  color: #94a3b8;
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  transition: all .2s cubic-bezier(.34,1.56,.64,1);
  border-radius: 12px;
  margin: 4px 2px;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}

.fp-bnav-item:hover {
  color: #1d4ed8;
  background: rgba(29, 78, 216, 0.06);
}

.fp-bnav-item.active {
  color: #1d4ed8;
}

[data-theme="dark"] .fp-bnav-item { color: #64748b; }
[data-theme="dark"] .fp-bnav-item:hover { color: #60a5fa; background: rgba(96,165,250,.08); }
[data-theme="dark"] .fp-bnav-item.active { color: #60a5fa; }

/* ── Icoon wrapper ────────────────────────────────────── */
.fp-bnav-icon {
  width: 32px; height: 32px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  transition: all .2s cubic-bezier(.34,1.56,.64,1);
  position: relative;
}

.fp-bnav-item.active .fp-bnav-icon {
  background: linear-gradient(135deg, #1d4ed8, #7c3aed);
  color: #fff;
  box-shadow: 0 4px 12px rgba(29, 78, 216, 0.35);
  transform: translateY(-2px) scale(1.08);
}

[data-theme="dark"] .fp-bnav-item.active .fp-bnav-icon {
  background: linear-gradient(135deg, #2563eb, #8b5cf6);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4);
}

/* ── Label ────────────────────────────────────────────── */
.fp-bnav-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.2px;
  line-height: 1;
  transition: all .2s ease;
}

.fp-bnav-item.active .fp-bnav-label {
  color: #1d4ed8;
  font-weight: 700;
}

[data-theme="dark"] .fp-bnav-item.active .fp-bnav-label {
  color: #60a5fa;
}

/* ── Badge notificatie ────────────────────────────────── */
.fp-bnav-badge {
  position: absolute;
  top: -2px; right: -2px;
  min-width: 16px; height: 16px;
  background: #ef4444;
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  border: 2px solid rgba(255,255,255,0.8);
  display: none;
}

.fp-bnav-badge.visible { display: flex; }

/* ── "Meer" popup menu ────────────────────────────────── */
.fp-bnav-more-menu {
  display: none;
  position: fixed;
  bottom: 72px;
  right: 12px;
  left: auto;
  width: 240px;
  background: rgba(255,255,255,0.97);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  border: 1px solid rgba(226,232,240,0.8);
  border-radius: 18px;
  box-shadow: 0 8px 40px rgba(15,23,42,0.18), 0 2px 8px rgba(15,23,42,0.08);
  z-index: 100000;
  overflow: hidden;
  opacity: 0;
  transform: translateY(10px) scale(0.95);
  transform-origin: bottom right;
  transition: opacity .2s ease, transform .2s cubic-bezier(.34,1.56,.64,1);
  pointer-events: none;
}

.fp-bnav-more-menu.open {
  display: block;
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: all;
}

[data-theme="dark"] .fp-bnav-more-menu {
  background: rgba(30, 41, 59, 0.95);
  border-color: rgba(51, 65, 85, 0.7);
  box-shadow: 0 8px 40px rgba(0,0,0,0.4);
}

/* ── Meer menu items ──────────────────────────────────── */
.fp-bnav-more-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 16px;
  text-decoration: none !important;
  color: #1e293b;
  font-weight: 600;
  font-size: 14px;
  background: none;
  border: none;
  cursor: pointer;
  width: 100%;
  text-align: left;
  font-family: inherit;
  border-bottom: 1px solid rgba(241, 245, 249, 0.8);
  transition: background .15s ease;
  -webkit-tap-highlight-color: transparent;
}

.fp-bnav-more-item:last-child { border-bottom: none; }

.fp-bnav-more-item:hover,
.fp-bnav-more-item:active {
  background: rgba(29, 78, 216, 0.06);
  color: #1d4ed8;
}

.fp-bnav-more-item.active {
  color: #1d4ed8;
  background: rgba(29, 78, 216, 0.06);
}

[data-theme="dark"] .fp-bnav-more-item {
  color: #e2e8f0;
  border-bottom-color: rgba(51, 65, 85, 0.5);
}

[data-theme="dark"] .fp-bnav-more-item:hover {
  background: rgba(96, 165, 250, 0.08);
  color: #60a5fa;
}

.fp-bnav-more-icon {
  width: 32px; height: 32px;
  border-radius: 9px;
  background: rgba(29, 78, 216, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}

.fp-bnav-more-item.logout-item {
  color: #ef4444;
  margin: 4px 8px 8px;
  border-radius: 12px;
  border: none;
  background: rgba(239, 68, 68, 0.06);
  width: calc(100% - 16px);
}

.fp-bnav-more-item.logout-item:hover {
  background: rgba(239, 68, 68, 0.12);
  color: #dc2626;
}

.fp-bnav-more-item.logout-item .fp-bnav-more-icon {
  background: rgba(239, 68, 68, 0.1);
}

/* ── Overlay sluiten meer menu ────────────────────────── */
.fp-bnav-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99997;
}

.fp-bnav-overlay.open { display: block; }

/* ── Animatie tap feedback ────────────────────────────── */
.fp-bnav-item:active .fp-bnav-icon {
  transform: scale(0.88);
}

.fp-bnav-item.active:active .fp-bnav-icon {
  transform: translateY(-2px) scale(0.96);
}


/* Desktop bottom nav stijl → geregeld via inline style in output_bottom_nav() */


/* ── Desktop/tablet (≥769px): horizontale tab-balk ── */
@media (min-width: 769px) {
  .fp-bottom-nav {
    height: 56px !important;
    justify-content: flex-start !important;
    padding: 0 24px !important;
    gap: 0 !important;
    background: rgba(255,255,255,0.98) !important;
  }
  .fp-bnav-item {
    flex: 0 0 auto !important;
    flex-direction: row !important;
    gap: 8px !important;
    padding: 0 18px !important;
    height: 100% !important;
    border-radius: 0 !important;
    margin: 0 !important;
    border-bottom: 3px solid transparent !important;
    color: #64748b !important;
    font-size: 13px !important;
  }
  .fp-bnav-item:hover {
    color: #1e293b !important;
    background: rgba(0,0,0,0.03) !important;
  }
  .fp-bnav-item.active {
    color: #1d4ed8 !important;
    border-bottom-color: #1d4ed8 !important;
    background: transparent !important;
  }
  .fp-bnav-item.active .fp-bnav-icon {
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    color: #1d4ed8 !important;
    font-size: 16px !important;
  }
  .fp-bnav-icon {
    width: 20px !important;
    height: 20px !important;
    font-size: 16px !important;
  }
  .fp-bnav-label {
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
  }
  .fp-bnav-more-menu {
    bottom: 64px !important;
    right: 12px !important;
    left: auto !important;
  }
}


/* ── WhatsApp button (portal) ─────────────────────────────────────────── */
a.fp-btn[href*="wa.me"] {
    background-color: #25D366 !important;
    border-color:     #20b558 !important;
    color:            #fff    !important;
}
a.fp-btn[href*="wa.me"]:hover {
    background-color: #1da851 !important;
    border-color:     #1da851 !important;
    color:            #fff    !important;
}


/* ── WhatsApp invoice action button (portal) ─── */
a.wa-btn, a.wa-btn:link, a.wa-btn:visited {
    background: #25D366 !important;
    border-color: #20b558 !important;
    color: #fff !important;
}
a.wa-btn:hover {
    background: #1aad4e !important;
    border-color: #1aad4e !important;
    color: #fff !important;
}

/* ═══════════════════════════════════════════════════════════
   v4.50.0: RESPONSIVE FIXES — Portaal + PDF Editor + Publiek
   ═══════════════════════════════════════════════════════════ */

/* ── PDF Editor: stack op tablet ── */
@media (max-width: 1024px) {
    #fpPdfEditor { flex-direction: column !important; }
    #fpPdfEditor > div:first-child { width: 100% !important; }
    #fpPdfPreview { min-height: 400px !important; }
}

/* ── PDF Editor: compacter op mobiel ── */
@media (max-width: 767px) {
    #fpPdfEditor { gap: 12px !important; }
    #fpPdfPreview { padding: 16px 14px !important; font-size: 9px !important; }
    .fpb-head { padding: 6px 8px; }
    .fpb-label { font-size: 10px; }
    .fpb-settings { padding: 6px 8px 8px; }
    .fpb-checks { grid-template-columns: 1fr; }
}

/* ── Factuur/offerte formulier op mobiel ── */
@media (max-width: 767px) {
    .fp-invoice-header { flex-direction: column; gap: 8px; }
    .fp-invoice-header .fp-btn { width: 100%; text-align: center; justify-content: center; }
    .fp-doc-meta { grid-template-columns: 1fr !important; }
    .fp-items-mobile { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .fp-items-table { min-width: 480px; }
}

/* ── Custom template hint responsive ── */
@media (max-width: 767px) {
    #fpCustomTemplateHint > div { flex-direction: column; text-align: center; gap: 10px; }
    #fpCustomTemplateHint .fp-btn { width: 100%; }
}

/* ── Bottom nav: kleinere iconen op extra klein ── */
@media (max-width: 360px) {
    #fpBottomNav .fp-bnav-icon { font-size: 18px; }
    #fpBottomNav .fp-bnav-label { font-size: 9px; }
    #fpBottomNav .fp-bnav-item { padding: 6px 4px; }
    .fp-main { padding: 10px !important; }
}

/* ── Offerte detail acties: wrap op mobiel ── */
@media (max-width: 767px) {
    .invoisio-actions { flex-direction: column !important; align-items: stretch !important; }
    .invoisio-actions .button,
    .invoisio-actions a.button,
    .invoisio-actions button { width: 100%; text-align: center; box-sizing: border-box; }
}

/* ── Dashboard stat cards: betere spacing ── */
@media (max-width: 480px) {
    .fp-stat-grid { gap: 8px; }
    .fp-stat-card { padding: 12px; }
    .fp-stat-card strong { font-size: 18px; }
    .fp-stat-card small { font-size: 10px; }
    .fp-page-sub { font-size: 13px; }
}

/* ── Meer-menu responsive ── */
@media (max-width: 767px) {
    .fp-bnav-more-menu {
        left: 8px !important;
        right: 8px !important;
        width: auto !important;
        min-width: unset !important;
    }
}

/* ── Actie dropdown menu (facturen/offertes) ── */
.fp-action-item {
    display: block;
    width: 100%;
    padding: 10px 16px;
    font-size: 13px;
    font-weight: 600;
    color: #334155;
    background: none;
    border: none;
    text-align: left;
    cursor: pointer;
    text-decoration: none;
    transition: background .15s;
    font-family: inherit;
    line-height: 1.4;
}
.fp-action-item:hover {
    background: #f1f5f9;
    color: #0f172a;
}
.fp-action-item.fp-action-danger {
    color: #dc2626;
}
.fp-action-item.fp-action-danger:hover {
    background: #fef2f2;
    color: #b91c1c;
}
@media (max-width: 768px) {
    .fp-action-menu {
        right: 0 !important;
        min-width: 180px !important;
    }
    .fp-action-toggle {
        min-width: 44px !important;
        min-height: 44px !important;
        touch-action: manipulation;
    }
}

/* ── Mobiel touch-fix: actieknoppen (e-mail, WhatsApp, verwijder) ── */
@media (max-width: 768px) {
    .fp-actions-cell {
        display: flex;
        gap: 6px;
        flex-wrap: wrap;
    }
    .fp-actions-cell form {
        display: inline-flex;
        margin: 0;
    }
    .fp-actions-cell .fp-btn-xs,
    .fp-actions-cell button.fp-btn-xs {
        min-width: 44px;
        min-height: 44px;
        padding: 10px 14px;
        font-size: 14px;
        border-radius: 12px;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
        cursor: pointer;
    }
}