@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600;700;800&display=swap');

:root{
  --dvt-bg:#edf3f8;
  --dvt-bg-2:#e3ebf3;
  --dvt-surface:#ffffff;
  --dvt-surface-soft:#f7fafc;
  --dvt-border:rgba(148,163,184,.26);
  --dvt-border-strong:rgba(148,163,184,.42);
  --dvt-text:#0D8DFF;
  --dvt-muted:#64748b;
  --dvt-primary:#0D8DFF;
  --dvt-primary-2:#0D8DFF;
  --dvt-success:#166534;
  --dvt-danger:#be123c;
  --dvt-shadow:0 18px 42px rgba(15,23,42,.10);
  --dvt-shadow-hover:0 20px 46px rgba(15,23,42,.14);
  --dvt-radius-xl:26px;
  --dvt-radius-lg:18px;
  --dvt-radius-md:14px;
  --dvt-btn-height:40px;
}
html,body{background:linear-gradient(180deg,var(--dvt-bg) 0%,var(--dvt-bg-2) 100%) !important;color:var(--dvt-text) !important;}
body{font-family:var(--dvt-font-body);letter-spacing:-.01em;}
a,button,input,select,textarea{font-family:var(--dvt-font-body);}
.btn,.back,.login-button,.session-users-btn,.session-logout-btn,.session-admin-text-btn.admin-btn,.tab,.nav-item{
  min-height:var(--dvt-btn-height) !important;
  border-radius:14px !important;
  font-weight:800 !important;
  letter-spacing:-.01em;
}
.btn,.login-button,.session-logout-btn{
  box-shadow:0 12px 28px rgba(15,23,42,.12) !important;
}
.btn:hover,.back:hover,.login-button:hover,.session-users-btn:hover,.session-logout-btn:hover,.session-admin-text-btn.admin-btn:hover,.tab:hover,.nav-item:hover{
  transform:translateY(-1px) !important;
  box-shadow:var(--dvt-shadow-hover) !important;
}
.btn.dark,.login-button,.session-logout-btn,.tab.active,.nav-item.active{
  background:linear-gradient(180deg,var(--dvt-primary) 0%,var(--dvt-primary-2) 100%) !important;
  border-color:var(--dvt-primary) !important;
  color:#fff !important;
}
.btn.secondary,.btn.soft,.back,.session-users-btn,.session-admin-text-btn.admin-btn{
  background:rgba(255,255,255,.92) !important;
  border:1px solid var(--dvt-border-strong) !important;
  color:var(--dvt-text) !important;
  box-shadow:0 12px 28px rgba(15,23,42,.08) !important;
}
.btn.danger{background:#fff1f2 !important;color:var(--dvt-danger) !important;border-color:#fecdd3 !important;}
.login-card,.card,.panel,.content-card,.page-card,.tool-card,.files-card,.hero{border-radius:var(--dvt-radius-xl) !important;box-shadow:var(--dvt-shadow) !important;border:1px solid var(--dvt-border) !important;}
.customer-card,.report-item,.drawing-item,.log-item,.item,.entry,.filecard,.metric,.invite-box{border-radius:var(--dvt-radius-lg) !important;}
.input,.textarea,.select,.login-field,input[type='text'],input[type='email'],input[type='password'],select,textarea{
  border-radius:16px !important;
  border:1px solid rgba(148,163,184,.34) !important;
  background:#fff !important;
  color:var(--dvt-text) !important;
  box-shadow:inset 0 1px 2px rgba(15,23,42,.02);
}
.input:focus,.textarea:focus,.select:focus,.login-field:focus,input:focus,select:focus,textarea:focus{
  outline:none !important;
  border-color:#5fa3c7 !important;
  box-shadow:0 0 0 4px rgba(95,163,199,.14) !important;
}
.title,.detail-title,.page-title,.login-title,h1{letter-spacing:-.03em;}
.subtitle,.detail-meta,.page-sub,.hint,.small,.item-meta,.customer-meta{color:var(--dvt-muted) !important;}
.session-topbar,.topbar,.top{margin-top:4px;}
.user-chip,.object-badge,.pill,.status,.role,.mini-pill,.app-status-badge{
  border-radius:999px !important;
}
.user-chip,.object-badge,.pill,.status,.role{
  box-shadow:0 10px 20px rgba(15,23,42,.06);
}
.page-wrap,.wrap{padding-bottom:36px;}
.auth-page .card,.login-card{backdrop-filter:blur(10px);}
table{border-collapse:separate !important;border-spacing:0 10px !important;}
thead th{border-bottom:none !important;}
tbody tr{background:#f8fbfd;box-shadow:0 8px 18px rgba(15,23,42,.04);} 
tbody td{background:#fff;border-top:1px solid rgba(148,163,184,.18);border-bottom:1px solid rgba(148,163,184,.18);} 
tbody td:first-child{border-left:1px solid rgba(148,163,184,.18);border-top-left-radius:16px;border-bottom-left-radius:16px;} 
tbody td:last-child{border-right:1px solid rgba(148,163,184,.18);border-top-right-radius:16px;border-bottom-right-radius:16px;}
.row-actions .btn,.item-actions .btn,.top-actions .btn{min-width:148px;justify-content:center;}
.page-title,.detail-title,.title{font-weight:900 !important;}
.top-actions,.row-actions,.detail-actions,.form-actions{gap:12px !important;}
@media (max-width:640px){
  .btn,.back,.session-users-btn,.session-logout-btn,.session-admin-text-btn.admin-btn,.top-actions .btn,.row-actions .btn,.item-actions .btn{width:100% !important;}
  .login-card,.card,.panel,.content-card,.page-card,.tool-card,.files-card,.hero{border-radius:22px !important;}
}


/* ===== refined sitewide button consistency ===== */
:root{
  --dvt-btn-height:44px;
  --dvt-btn-min-width:152px;
  --dvt-btn-padding:0 18px;
}
.btn,.back,.login-button,.session-users-btn,.session-logout-btn,.session-admin-text-btn.admin-btn,.tab,.nav-item{
  min-height:var(--dvt-btn-height) !important;
  height:var(--dvt-btn-height) !important;
  padding:var(--dvt-btn-padding) !important;
  border-radius:14px !important;
  font-size:13px !important;
  font-weight:800 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  line-height:1 !important;
  white-space:nowrap;
}
.btn,.back,.session-users-btn,.session-logout-btn,.session-admin-text-btn.admin-btn{
  min-width:var(--dvt-btn-min-width) !important;
}
.btn.secondary,.btn.soft,.back,.session-users-btn,.session-admin-text-btn.admin-btn{
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%) !important;
  color:var(--dvt-text) !important;
  border:1px solid rgba(148,163,184,.42) !important;
}
.btn:not(.secondary):not(.soft):not(.danger),.login-button,.session-logout-btn{
  background:linear-gradient(180deg,#0D8DFF 0%,#0D8DFF 100%) !important;
  color:#fff !important;
  border:1px solid #0D8DFF !important;
}
.top-actions,.row-actions,.detail-actions,.form-actions,.actions,.session-actions{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  flex-wrap:wrap !important;
}
.top-actions > :first-child,.row-actions > :first-child,.actions > :first-child{
  margin-left:0 !important;
}

/* ===== refinement round: lighter dark buttons + tighter admin pages ===== */
:root{
  --dvt-primary:#445b70;
  --dvt-primary-2:#6b8092;
}
.btn.dark,.login-button,.session-logout-btn,.tab.active,.nav-item.active,
.btn:not(.secondary):not(.soft):not(.danger){
  background:linear-gradient(180deg,var(--dvt-primary) 0%,var(--dvt-primary-2) 100%) !important;
  border-color:var(--dvt-primary) !important;
  box-shadow:0 12px 28px rgba(68,91,112,.18) !important;
}
.btn:hover,.back:hover,.login-button:hover,.session-users-btn:hover,.session-logout-btn:hover,.session-admin-text-btn.admin-btn:hover,.tab:hover,.nav-item:hover{
  box-shadow:0 16px 30px rgba(68,91,112,.16) !important;
}

/* users page: action buttons same full width inside each mini form */
.mini-form .btn,
.mini-form .btn.small,
.mini-form .btn.secondary.small{
  width:100% !important;
  min-width:0 !important;
}
.mini-form .row-actions{display:block !important;}

/* klanten page: cleaner left header block and customer controls */
.left-panel .section-head{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  align-items:stretch !important;
  margin-bottom:12px !important;
}
.left-panel .section-title{
  font-size:20px !important;
  line-height:1.1 !important;
}
.left-panel .section-head-actions{
  display:grid !important;
  grid-template-columns:1fr auto !important;
  gap:10px !important;
  align-items:center !important;
}
.left-panel .section-head-actions .pill{
  justify-self:start !important;
  min-height:36px !important;
  padding:0 14px !important;
}
.left-panel .section-head-actions .inline-form{
  margin:0 !important;
}
.left-panel .section-head-actions .btn{
  min-width:144px !important;
}
.left-panel .search{
  margin-top:2px !important;
  margin-bottom:2px !important;
}
.left-panel .left-list{
  margin-top:14px !important;
}
@media (max-width:640px){
  .left-panel .section-head-actions{
    grid-template-columns:1fr !important;
  }
  .left-panel .section-head-actions .btn,
  .left-panel .section-head-actions .pill{
    width:100% !important;
    justify-content:center !important;
  }
}

/* ===== admin reports dashboard refinement ===== */
body:has(.layout) .wrap,
body:has(.topbar) .wrap{
  max-width:1480px !important;
}
.topbar{
  align-items:center !important;
  margin-bottom:24px !important;
}
.topbar .title,
.detail-title,
.section-title{
  letter-spacing:-.035em !important;
}
.layout{
  grid-template-columns:380px minmax(0,1fr) !important;
  gap:26px !important;
  align-items:start !important;
}
.left-panel,
.right-panel{
  background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(148,163,184,.22) !important;
  box-shadow:0 22px 52px rgba(15,23,42,.08) !important;
}
.left-panel{
  padding:20px !important;
}
.right-panel{
  padding:24px !important;
}
.section-head{
  margin-bottom:16px !important;
}
.section-head-actions{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  flex-wrap:wrap !important;
}
.left-panel .search{
  height:46px !important;
  border-radius:16px !important;
  background:#fff !important;
}
.left-list{
  gap:12px !important;
}
.customer-card{
  padding:16px !important;
  border-radius:22px !important;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbfd 100%) !important;
}
.customer-card.active{
  background:linear-gradient(180deg,#ffffff 0%,#f4f8fb 100%) !important;
  border-color:rgba(95,163,199,.42) !important;
  box-shadow:0 16px 30px rgba(95,163,199,.14) !important;
}
.customer-title .pill,
.section-head-actions .pill{
  min-height:34px !important;
  padding:0 14px !important;
  font-size:12px !important;
}
.mini-stats{
  gap:9px !important;
}
.mini-pill{
  background:#f4f8fb !important;
  border-color:rgba(95,163,199,.24) !important;
  color:#557389 !important;
}
.detail-head{
  align-items:center !important;
  padding-bottom:6px !important;
}
.detail-actions{
  align-items:center !important;
}
.metrics{
  gap:14px !important;
  margin-bottom:20px !important;
}
.metric{
  background:linear-gradient(180deg,#ffffff 0%,#f8fbfd 100%) !important;
  border:1px solid rgba(148,163,184,.18) !important;
  box-shadow:0 12px 26px rgba(15,23,42,.05) !important;
}
.tabs{
  gap:12px !important;
  margin-bottom:20px !important;
}
.tab{
  min-width:132px !important;
}
.content-card{
  background:linear-gradient(180deg,#f8fbfd 0%,#f3f7fb 100%) !important;
  border-radius:26px !important;
  padding:22px !important;
}
.report-item,.drawing-item,.log-item{
  border-radius:20px !important;
  padding:16px !important;
  box-shadow:0 10px 22px rgba(15,23,42,.04) !important;
}
.form-actions + .form-actions{
  margin-top:14px !important;
}

/* ===== edit/app shell refinement only (forms untouched) ===== */
.session-topbar{
  max-width:calc(100% - 40px) !important;
  margin:12px 20px 0 !important;
  padding:12px 16px !important;
  background:rgba(255,255,255,.82) !important;
  border:1px solid rgba(148,163,184,.20) !important;
  border-radius:24px !important;
  box-shadow:0 16px 32px rgba(15,23,42,.08) !important;
  backdrop-filter:blur(14px) !important;
}
.session-topbar .session-actions{
  gap:12px !important;
}
.session-topbar .session-action-form{
  margin:0 !important;
}
.session-users-btn,
.session-logout-btn,
.session-admin-text-btn.admin-btn,
.session-topbar #adminBtn.session-admin-text-btn.admin-btn{
  min-width:152px !important;
  height:44px !important;
  min-height:44px !important;
  padding:0 18px !important;
  font-size:13px !important;
  font-weight:800 !important;
  border-radius:14px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.session-admin-text-btn.admin-btn,
.session-topbar #adminBtn.session-admin-text-btn.admin-btn{
  width:auto !important;
  max-width:none !important;
  flex:0 0 auto !important;
}
.app-topbar{
  margin-top:14px !important;
}
.app-status-badge{
  min-height:40px !important;
  padding:0 16px !important;
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%) !important;
  border:1px solid rgba(148,163,184,.28) !important;
  color:#5b7183 !important;
}
.admin-sidebar{
  border-top-left-radius:26px !important;
  border-bottom-left-radius:26px !important;
  box-shadow:0 22px 42px rgba(15,23,42,.16) !important;
}
.admin-sidebar .admin-header{
  padding-top:18px !important;
}
.admin-sidebar .admin-menu-btn{
  min-height:52px !important;
  border-radius:18px !important;
}

@media (max-width:1200px){
  .layout{grid-template-columns:1fr !important;}
}
@media (max-width:700px){
  .session-topbar{
    max-width:calc(100% - 24px) !important;
    margin:12px 12px 0 !important;
  }
}

/* ===== definitive polish: homepage top area should keep normal page background ===== */
body.app-layout .session-topbar,
body .session-topbar{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
body.app-layout .session-topbar{
  padding:12px 0 6px !important;
}


/* force light mode across shell + embedded pages */
:root{color-scheme:light !important;}
html,body{color-scheme:light !important;forced-color-adjust:none !important;background:#eef3f7 !important;color:#111827 !important;}
*,*::before,*::after{forced-color-adjust:none;}
img,svg,canvas,video{forced-color-adjust:none !important;}
input,textarea,select,button{color-scheme:light !important;forced-color-adjust:none !important;}

/* ===== typography normalization across admin pages ===== */
:root{
  --dvt-font-family:var(--dvt-font-body);
  --dvt-font-size-body:14px;
  --dvt-font-size-small:12px;
  --dvt-font-size-label:13px;
  --dvt-font-size-control:14px;
  --dvt-font-size-title:28px;
  --dvt-font-size-section:20px;
  --dvt-font-size-card-title:18px;
  --dvt-font-weight-regular:500;
  --dvt-font-weight-label:700;
  --dvt-font-weight-strong:800;
}
html,body,
input,select,textarea,button,
.btn,.back,.tab,.nav-item,
.title,.page-title,.detail-title,.section-title,
.customer-name,.item-title,.tool-title,.card h2,
.field label,label,th,.metric-label,.log-label,.meta,.hint,.small,.page-sub,.subtitle,.detail-meta,.customer-meta,.item-meta,.muted{
  font-family:var(--dvt-font-body);
}
body,
td,li,p,.msg,.empty,.flash,.message,.notice,.error,.customer-meta,.detail-meta,.item-meta,.muted,.hint,.small{
  font-size:var(--dvt-font-size-body) !important;
  line-height:1.45 !important;
}
.title,.page-title,.detail-title,h1,.obj{
  font-size:var(--dvt-font-size-title) !important;
  font-weight:var(--dvt-font-weight-strong) !important;
  line-height:1.08 !important;
  letter-spacing:-.03em !important;
}
.section-title,.tool-title,.card h2,h2{
  font-size:var(--dvt-font-size-section) !important;
  font-weight:var(--dvt-font-weight-label) !important;
  line-height:1.15 !important;
  letter-spacing:-.02em !important;
}
.customer-name,.item-title,.metric-value,.file-name{
  font-size:var(--dvt-font-size-card-title) !important;
  font-weight:var(--dvt-font-weight-strong) !important;
  line-height:1.2 !important;
}
label,.field label,.label,.login-label,
.object-badge,.pill,.role,.status,.mini-pill,
th,.metric-label,.log-label{
  font-size:var(--dvt-font-size-small) !important;
  font-weight:var(--dvt-font-weight-label) !important;
}
.btn,.back,.login-button,.session-users-btn,.session-logout-btn,.session-admin-text-btn.admin-btn,.tab,.nav-item,
.small{
  font-size:13px !important;
  font-weight:var(--dvt-font-weight-label) !important;
}
.input,.textarea,.select,.search,.login-field,input[type='text'],input[type='email'],input[type='password'],select,textarea{
  font-size:var(--dvt-font-size-control) !important;
  font-weight:var(--dvt-font-weight-regular) !important;
}
.subtitle,.page-sub,.detail-meta,.customer-meta,.item-meta,.muted,.hint,.small,.meta{
  font-size:13px !important;
  font-weight:var(--dvt-font-weight-regular) !important;
  color:var(--dvt-muted) !important;
}
@media (max-width:640px){
  .title,.page-title,.detail-title,h1,.obj{font-size:24px !important;}
  .section-title,.tool-title,.card h2,h2{font-size:18px !important;}
  .customer-name,.item-title,.metric-value,.file-name{font-size:16px !important;}
}


/* ===== DVT MODERNE TYPOGRAFIE ===== */
:root{
  --dvt-font-body:'Geist',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --dvt-font-heading:'Geist',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
html,body{
  font-family:var(--dvt-font-body) !important;
  letter-spacing:-0.012em;
  text-rendering:geometricPrecision;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
body,button,input,select,textarea,a,label,.btn,.tab,.card,.field,.input,.textarea{
  font-family:var(--dvt-font-body) !important;
}
h1,h2,h3,.obj,.customer-title,.page-title,.brand-title,.section-title,.form-title{
  font-family:var(--dvt-font-heading) !important;
  letter-spacing:-0.025em;
}
input::placeholder,textarea::placeholder{
  font-family:var(--dvt-font-body) !important;
}

/* ===== DVT ULTRA STRAK FONT RENDERING ===== */
:root{
  --dvt-font-body:'Geist',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --dvt-font-heading:'Geist',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
html{
  text-rendering:geometricPrecision;
  -webkit-text-size-adjust:100%;
}
body,
a,
button,
input,
select,
textarea,
label,
table,
.card,
.tab,
.btn{
  font-family:var(--dvt-font-body) !important;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-synthesis-weight:none;
}
h1,h2,h3,h4,.title,.page-title,.obj,.brand-title{
  font-family:var(--dvt-font-heading) !important;
  font-weight:650;
  letter-spacing:-.025em;
}
p,li,.muted,.label,.stat-title{
  letter-spacing:-.01em;
}

/* ===== DVT automatische logo-switch bescherming ===== */
img[data-dvt-logo], #logo, .logo, .login-logo, .site-logo, .object-logo{
  forced-color-adjust:none !important;
  -webkit-filter:none !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}

/* ===== DVT logo switch v2 ===== */
img[data-dvt-logo], img.logo, img.login-logo, img.site-logo, img.object-logo, .pdf-logo img{
  filter:none !important;
  -webkit-filter:none !important;
  mix-blend-mode:normal !important;
  forced-color-adjust:none !important;
}


/* ===== DVT laatste polish: voorkom input/iframe overflow ===== */
*,*::before,*::after{box-sizing:border-box;}
html,body{max-width:100%;overflow-x:hidden;}
.login-card,.login-card *, .login-form,.login-form *, .login-card-inline,.login-card-inline *{box-sizing:border-box;}
.login-card input,.login-form input,.login-card-inline input,.login-field{width:100%;max-width:100%;box-sizing:border-box;}
iframe,.maintenance-frame,.app-shell-frame{width:100%;max-width:100%;display:block;}

/* ===== DVT definitieve adaptive logo fix: geen darkmode-detectie meer ===== */
.dvt-logo-overlay{display:none!important;opacity:0!important;}
.dvt-logo-system-wrap{display:inline-block!important;line-height:0!important;max-width:100%!important;}
img[data-dvt-logo], img.logo, img.login-logo, img.site-logo, img.object-logo{visibility:visible!important;opacity:1!important;}
/* ===== DVT v3: blauwgrijs logboek-thema op alle ingesloten pagina's ===== */
:root{
  --dvt-shell-bg:#dfe7ef;
  --dvt-shell-bg2:#f5f8fc;
  --dvt-card:#ffffff;
  --dvt-blue:#0874f2;
  --dvt-ink:#071f3d;
  --dvt-muted:#435873;
}
html,body{
  background:linear-gradient(90deg, rgba(222,231,240,.96), rgba(247,250,253,1)) !important;
  color:var(--dvt-ink) !important;
}
body.embed, body.embedded-shell-mode, .embedded-shell-mode{
  background:transparent !important;
}
.card,.panel,.page-card,.dashboard-card,.report-card,.planning-card,.object-card,.user-card,.content-card,.box,.form-card,
.table-wrap,.toolbar,.main-card,.section,.list-card{
  background:rgba(255,255,255,.92) !important;
  border-color:rgba(255,255,255,.72) !important;
  box-shadow:0 18px 44px rgba(32,53,75,.12) !important;
}
h1,h2,h3,h4,.title,.page-title,.section-title,.card-title{color:var(--dvt-blue) !important;}
.muted,.sub,.hint,.help,.small{color:var(--dvt-muted) !important;}
button,.btn,.button,a.btn,input[type="submit"]{
  border-radius:14px !important;
}


/* ==========================================================
   DVT logboek-thema SITEBREED v4 - doorlopend kladblok
   Complete versie: achtergrond loopt door over menu + content
   ========================================================== */
:root{
  --dvt-bg:#dfe7ef;
  --dvt-text:#08233d;
  --dvt-blue:#0874f2;
  --dvt-panel:rgba(255,255,255,.86);
  --dvt-border:rgba(255,255,255,.62);
  --dvt-shadow:0 18px 44px rgba(25,47,70,.14);
}
html,body{
  background:
    linear-gradient(90deg, rgba(4,28,52,.52) 0%, rgba(46,70,95,.34) 25%, rgba(224,232,241,.82) 48%, rgba(244,247,251,.96) 100%),
    url('/assets/logboek-doorlopend-bg.png') left center / cover fixed no-repeat !important;
  background-color:var(--dvt-bg)!important;
  color:var(--dvt-text)!important;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(circle at 6% 6%, rgba(255,255,255,.22), transparent 28%),
    linear-gradient(90deg, rgba(2,20,38,.28), transparent 42%);
}
.shell,.main,.content,.dash-card,.frame-card,.hero,.app-page,.page,.admin-page,.builder-page,.maintenance-page,.form-page{
  background:transparent!important;
}
.sidebar,
.admin-sidebar,
.editor-sidebar{
  background:
    linear-gradient(90deg, rgba(2,22,42,.76), rgba(8,38,66,.52) 68%, rgba(220,230,240,.10)),
    url('/assets/logboek-doorlopend-bg.png') left center / cover fixed no-repeat!important;
  border-color:rgba(255,255,255,.28)!important;
  box-shadow:18px 0 44px rgba(20,43,66,.20)!important;
}
.sidebar::after{
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(0,0,0,.10))!important;
}
.main{
  background:
    linear-gradient(90deg, rgba(140,158,178,.36) 0%, rgba(218,228,239,.64) 12%, rgba(245,248,252,.88) 52%, rgba(247,250,253,.96) 100%),
    url('/assets/logboek-doorlopend-bg.png') left center / cover fixed no-repeat!important;
}
.content-frame{background:transparent!important;}
.stat-card,.panel,.card,.tile,.box,.admin-card,.report-card,.user-card,.object-card,.planning-card,.builder-card,.form-card,.section-card,
.table-wrap,.table-card,.content-card,.page-card,.upload-card,.settings-card,.list-card{
  background:var(--dvt-panel)!important;
  border:1px solid var(--dvt-border)!important;
  box-shadow:var(--dvt-shadow)!important;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.panel-head,.card-header,.table-header,.page-header{
  border-color:rgba(114,135,158,.18)!important;
}
.nav h4{color:rgba(255,255,255,.82)!important;}
.nav a{color:rgba(255,255,255,.95)!important;text-shadow:0 1px 12px rgba(0,0,0,.25)!important;}
.nav a i{color:rgba(255,255,255,.95)!important;}
.nav a.active,
.nav a:hover.active{
  background:rgba(255,255,255,.94)!important;
  color:#062443!important;
  text-shadow:none!important;
  box-shadow:0 18px 34px rgba(4,21,39,.24)!important;
}
.nav a.active i{color:var(--dvt-blue)!important;}
.nav a:hover{background:rgba(255,255,255,.14)!important;}
.brand img{filter:drop-shadow(0 14px 24px rgba(0,0,0,.32))!important;}
.stat-value,.panel h3,.activity-main strong,h1,h2,h3,.page-title{color:var(--dvt-blue)!important;}
.stat-label,.stat-sub,.activity-main span,.activity-time,.status-list,.status-row b,.empty-activity,p,label,td,th{color:#304964;}
input,select,textarea,.btn,button{
  border-color:rgba(119,140,164,.28)!important;
}
@media(max-width:680px){
  html,body{background-position:left top!important;background-size:auto 100%!important;}
}


/* ==========================================================
   DVT v5 SITEBREED - alle pagina's zelfde logboek thema
   ========================================================== */
:root{
  --dvt-panel:rgba(255,255,255,.84);
  --dvt-border:rgba(255,255,255,.66);
  --dvt-shadow:0 18px 44px rgba(21,44,68,.13);
}
html,body{
  background:
    linear-gradient(90deg,
      rgba(4,25,46,.70) 0%,
      rgba(10,35,61,.50) 13%,
      rgba(84,105,128,.30) 23%,
      rgba(214,225,237,.76) 39%,
      rgba(244,248,252,.94) 100%),
    url('/assets/logboek-doorlopend-bg.png') left center / cover fixed no-repeat!important;
  background-color:#dfe8f1!important;
  color:#08233d!important;
}
body.embedded-view,
body.embedded-shell-mode,
body.embed{
  background:transparent!important;
}
.embedded-view,
.embedded-shell-mode,
.embed,
.app-layout,
.page-wrap,
.wrap,
.main,
.content,
.app-page,
.admin-page,
.form-page,
.builder-page,
.maintenance-page{
  background:transparent!important;
}
.card,.panel,.page-card,.dashboard-card,.report-card,.planning-card,.object-card,.user-card,.content-card,.box,.form-card,
.table-wrap,.toolbar,.main-card,.section,.list-card,.customer-card,.admin-card,.upload-card,.settings-card,.files-card,.hero,.stat{
  background:var(--dvt-panel)!important;
  border-color:var(--dvt-border)!important;
  box-shadow:var(--dvt-shadow)!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
}


/* === DVT SITEBREED DOORLOPEND LOGBOEK THEMA V6 === */
html,body,
.app-shell,
.app-content,
.main-content,
.page-content,
.content,
.dashboard-content,
.admin-content,
.shell-layout,
main{
background:
linear-gradient(rgba(214,221,232,.48),rgba(214,221,232,.48)),
url('assets/logboek-doorlopend-bg.png') center top / cover fixed no-repeat !important;
background-color:#dbe2eb !important;
}

.sidebar,.sidebar-shell,.nav-sidebar,.left-nav{
background:rgba(28,46,72,.58)!important;
backdrop-filter:blur(10px)!important;
border-right:none!important;
}

.card,.panel,.widget,.content-card,.dashboard-card,.stat-card,.box{
background:rgba(255,255,255,.78)!important;
backdrop-filter:blur(7px)!important;
border:1px solid rgba(255,255,255,.35)!important;
box-shadow:0 10px 28px rgba(70,84,110,.08)!important;
}

body::before{
content:'';
position:fixed;inset:0;
background:
linear-gradient(90deg,
rgba(28,46,72,.18) 0%,
rgba(28,46,72,.08) 22%,
rgba(28,46,72,0) 38%);
pointer-events:none;
z-index:-1;
}


/* DVT v14 - echte doorlopende achtergrond */
html,body{
min-height:100%;
background:#dbe3ec !important;
}
body::before{
content:"";
position:fixed;
inset:0;
z-index:-999;
background:
linear-gradient(90deg,
rgba(28,46,72,.48) 0%,
rgba(85,103,128,.22) 22%,
rgba(224,231,239,.18) 45%,
rgba(234,238,244,.42) 100%),
url("/assets/logboek-doorlopend-bg.png");
background-size:cover;
background-position:left top;
background-repeat:no-repeat;
background-attachment:fixed;
}

#app,.app,.app-shell,.shell,.page,.page-content,.content,
.main,.main-content,.dashboard,.dashboard-content,
iframe,.frame-card,.admin-content,[class*="page"]{
background:transparent !important;
background-color:transparent !important;
}

.sidebar,.left-nav,.nav-sidebar{
background:rgba(30,48,72,.42)!important;
backdrop-filter:blur(8px);
}

.card,.panel,.widget,.dashboard-card,.content-card{
background:rgba(255,255,255,.82)!important;
backdrop-filter:blur(8px);
}



/* ==========================================================
   DVT v15 - ECHTE DOORLOPENDE ACHTERGROND VIA SHELL
   Belangrijk:
   - Alleen app/shell.php tekent de kladblokachtergrond.
   - Alle iframe/subpagina's zijn transparant.
   - Daardoor loopt de achtergrond optisch door op Dashboard, Formulieren,
     Rapportages, Planning, Documenten, Gebruikers, Locaties en Builder.
   ========================================================== */

html, body {
  color-scheme: light !important;
}

/* Standaard: subpagina's/iframes tekenen GEEN eigen achtergrond meer */
html:not(:has(body.dvt-shell-page)),
body:not(.dvt-shell-page),
body:not(.dvt-shell-page)::before,
body:not(.dvt-shell-page)::after {
  background: transparent !important;
  background-image: none !important;
}

/* Subpagina containers transparant houden */
body:not(.dvt-shell-page) #app,
body:not(.dvt-shell-page) .app,
body:not(.dvt-shell-page) .app-shell,
body:not(.dvt-shell-page) .shell,
body:not(.dvt-shell-page) .layout,
body:not(.dvt-shell-page) .page,
body:not(.dvt-shell-page) .page-shell,
body:not(.dvt-shell-page) .page-wrapper,
body:not(.dvt-shell-page) .app-content,
body:not(.dvt-shell-page) .page-content,
body:not(.dvt-shell-page) .content,
body:not(.dvt-shell-page) .content-wrapper,
body:not(.dvt-shell-page) .main,
body:not(.dvt-shell-page) .main-content,
body:not(.dvt-shell-page) .dashboard,
body:not(.dvt-shell-page) .dashboard-content,
body:not(.dvt-shell-page) .admin-content,
body:not(.dvt-shell-page) .form-page,
body:not(.dvt-shell-page) .users-page,
body:not(.dvt-shell-page) .locations-page,
body:not(.dvt-shell-page) .documents-page,
body:not(.dvt-shell-page) .reports-page,
body:not(.dvt-shell-page) .planning-page,
body:not(.dvt-shell-page) .builder-page,
body:not(.dvt-shell-page) [class*="page"],
body:not(.dvt-shell-page) [class*="content"] {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* Alleen de shell krijgt één vaste, doorlopende achtergrond */
body.dvt-shell-page {
  background-color: #dbe4ee !important;
  background-image:
    linear-gradient(90deg,
      rgba(28,46,72,.52) 0%,
      rgba(48,68,94,.38) 18%,
      rgba(160,176,195,.26) 34%,
      rgba(218,226,236,.40) 55%,
      rgba(235,239,245,.62) 100%),
    url("../assets/logboek-doorlopend-bg.png") !important;
  background-position: left top, left top !important;
  background-size: cover, cover !important;
  background-repeat: no-repeat, no-repeat !important;
  background-attachment: fixed, fixed !important;
}

/* Shell-layout zelf transparant, zodat body-achtergrond doorloopt */
body.dvt-shell-page .shell,
body.dvt-shell-page .main,
body.dvt-shell-page .content,
body.dvt-shell-page .dash-card,
body.dvt-shell-page .frame-card,
body.dvt-shell-page .content-frame {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* Sidebar mag donker glas zijn, maar geen eigen ander plaatje meer */
body.dvt-shell-page .sidebar,
body.dvt-shell-page .nav-sidebar,
body.dvt-shell-page .left-sidebar,
body.dvt-shell-page .side-menu,
body.dvt-shell-page aside {
  background: rgba(28,46,72,.48) !important;
  background-image: none !important;
  border-right: 0 !important;
  box-shadow: none !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* Kaarten overal gelijk */
.card,
.panel,
.widget,
.dashboard-card,
.stat-card,
.content-card,
.table-container,
.chart-container,
.form-card,
.builder-card,
.box,
[class*="card"],
[class*="panel"] {
  background: rgba(255,255,255,.82) !important;
  background-color: rgba(255,255,255,.82) !important;
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  border: 1px solid rgba(255,255,255,.40) !important;
}

/* Oude overlays die kleurbreuken veroorzaken uitzetten */
.sidebar::before,
.sidebar::after,
.main::before,
.main::after,
.content::before,
.content::after,
.app-content::before,
.app-content::after,
.frame-card::before,
.frame-card::after {
  display: none !important;
  content: none !important;
}



/* V19 - alleen achtergrond maximaal duidelijker, layout blijft gelijk */

/* Oude overlay-lagen uitzetten: dit was waarom v16/v17/v18 weinig verschil gaven */
body.dvt-shell-page::before,
body.dvt-shell-page::after,
body.dvt-shell-page .shell::before,
body.dvt-shell-page .shell::after,
body.dvt-shell-page .main::before,
body.dvt-shell-page .main::after,
body.dvt-shell-page .content::before,
body.dvt-shell-page .content::after {
  display: none !important;
  content: none !important;
  background: none !important;
  background-image: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Eén achtergrond, bijna zonder grijze waas */
body.dvt-shell-page {
  background-color: #dbe4ee !important;
  background-image:
    linear-gradient(90deg,
      rgba(28,46,72,.10) 0%,
      rgba(48,68,94,.05) 18%,
      rgba(160,176,195,.00) 34%,
      rgba(218,226,236,.00) 55%,
      rgba(235,239,245,.04) 100%),
    url("../assets/logboek-doorlopend-bg.png") !important;
  background-size: cover, cover !important;
  background-position: left top, left top !important;
  background-repeat: no-repeat, no-repeat !important;
  background-attachment: fixed, fixed !important;
  filter: none !important;
}

/* Shell/iframe/subpagina’s blijven transparant zodat de doorlopende achtergrond zichtbaar blijft */
body.dvt-shell-page .shell,
body.dvt-shell-page .main,
body.dvt-shell-page .content,
body.dvt-shell-page .dash-card,
body.dvt-shell-page .frame-card,
body.dvt-shell-page .content-frame,
body:not(.dvt-shell-page),
body:not(.dvt-shell-page) #app,
body:not(.dvt-shell-page) .app,
body:not(.dvt-shell-page) .app-shell,
body:not(.dvt-shell-page) .page,
body:not(.dvt-shell-page) .page-content,
body:not(.dvt-shell-page) .content,
body:not(.dvt-shell-page) .main,
body:not(.dvt-shell-page) .main-content {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}



/* V20 - zelfde layout, alleen lichter + achtergrond duidelijker */

body.dvt-shell-page{
background-color:#e9eef5 !important;
background-image:
linear-gradient(90deg,
rgba(28,46,72,.06) 0%,
rgba(48,68,94,.02) 18%,
rgba(180,194,210,0) 34%,
rgba(230,235,242,0) 55%,
rgba(245,248,251,.02) 100%),
url("../assets/logboek-doorlopend-bg.png") !important;

filter:none!important;
}

/* hele site iets frisser/lighter */
.card,
.panel,
.widget,
.dashboard-card,
.content-card,
[class*="card"]{
background:rgba(255,255,255,.88)!important;
border-color:rgba(255,255,255,.55)!important;
}

.sidebar,
.nav-sidebar,
.left-sidebar{
background:rgba(34,56,82,.34)!important;
}


/* V21 - grijs/blauw i.p.v. blauw */

body.dvt-shell-page{
background-color:#edf0f3 !important;

background-image:
linear-gradient(90deg,
rgba(68,74,82,.08) 0%,
rgba(92,100,112,.04) 18%,
rgba(168,174,182,.02) 34%,
rgba(228,232,236,.00) 55%,
rgba(245,246,248,.02) 100%),
url("../assets/logboek-doorlopend-bg.png") !important;
}

.sidebar,
.nav-sidebar,
.left-sidebar{
background:rgba(74,82,92,.28)!important;
}

.card,
.panel,
.widget,
[class*="card"]{
background:rgba(252,252,252,.90)!important;
}



/* V22 - terug richting originele grijs/lichtgrijze sfeer */

body.dvt-shell-page{
background-color:#eef1f3 !important;

background-image:
linear-gradient(90deg,
rgba(80,82,86,.05) 0%,
rgba(118,122,128,.03) 18%,
rgba(186,190,196,.01) 34%,
rgba(236,238,240,.00) 55%,
rgba(247,248,249,.01) 100%),
url("../assets/logboek-doorlopend-bg.png") !important;
}

/* menu minder blauw, meer antraciet/grijs-blauw */
.sidebar,
.nav-sidebar,
.left-sidebar{
background:rgba(58,66,74,.30)!important;
}

/* kaarten niet blauw wit maar neutraal wit */
.card,
.panel,
.widget,
[class*="card"]{
background:rgba(252,252,251,.88)!important;
}



/* V23 - echt weg van blauw, richting papier/lichtgrijs */

body.dvt-shell-page{
background-color:#f1f1ef !important;

background-image:
linear-gradient(90deg,
rgba(92,92,92,.02) 0%,
rgba(124,124,124,.01) 20%,
rgba(210,210,210,0) 40%,
rgba(242,242,242,0) 70%,
rgba(250,250,250,.01) 100%),
url("../assets/logboek-doorlopend-bg.png") !important;
}

/* menu minder marine, meer antraciet */
.sidebar,
.nav-sidebar,
.left-sidebar{
background:rgba(64,66,70,.22)!important;
}

/* neutrale kaarten */
.card,
.panel,
.widget,
[class*="card"]{
background:rgba(253,253,252,.90)!important;
}



/* V24 - zelfde uiterlijk/layout, alleen lichte neutrale tint */
body.dvt-shell-page{
  background-color:#eef3f6 !important;
  background-image:
    linear-gradient(90deg,
      rgba(210,218,224,.10) 0%,
      rgba(222,228,233,.06) 22%,
      rgba(236,241,245,.03) 45%,
      rgba(245,248,250,.02) 100%),
    url("../assets/logboek-doorlopend-bg.png") !important;
}

/* Sidebar blijft zoals huidige site, alleen minder blauw */
.sidebar,
.nav-sidebar,
.left-sidebar{
  background:rgba(45,56,66,.28)!important;
}

/* Kaarten neutraal wit, layout niet wijzigen */
.card,
.panel,
.widget,
.dashboard-card,
.content-card,
[class*="card"]{
  background:rgba(255,255,255,.88)!important;
}



/* V26 - ALLEEN achtergrondafbeelding duidelijker */
/* Voorgrond niet aanpassen */

body.dvt-shell-page{
background-image:
linear-gradient(90deg,
rgba(235,239,242,.03) 0%,
rgba(239,242,245,.02) 25%,
rgba(244,246,248,.01) 50%,
rgba(248,249,250,.01) 100%),
url("../assets/logboek-doorlopend-bg.png") !important;
}

/* geen extra waas over achtergrond */
body.dvt-shell-page::before,
body.dvt-shell-page::after{
display:none!important;
content:none!important;
}

/* ==========================================================
   V28 ZONDER BLUR - zelfde positie, scherper beeld
   - kladblokpositie ongewijzigd t.o.v. laatste goede versie
   - geen blur/filter op achtergrond of menu-overlay
   - achtergrond blijft doorlopen achter menu
   ========================================================== */
body.dvt-shell-page,
body.dvt-shell-page .shell{
  background:#eef1f4 !important;
}
body.dvt-shell-page .shell{
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
}
body.dvt-shell-page .shell::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:-2 !important;
  display:block !important;
  background-image:url('/assets/logboek-doorlopend-bg.png') !important;
  background-size:cover !important;
  background-position:left top !important;
  background-repeat:no-repeat !important;
  opacity:1 !important;
  filter:none !important;
  -webkit-filter:none !important;
  transform:none !important;
}
body.dvt-shell-page .shell::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:-1 !important;
  pointer-events:none !important;
  display:block !important;
  background:linear-gradient(90deg,
    rgba(3,23,43,.07) 0%,
    rgba(18,38,58,.035) 16%,
    rgba(238,241,244,.00) 34%,
    rgba(255,255,255,.00) 100%) !important;
  filter:none !important;
  -webkit-filter:none !important;
}
body.dvt-shell-page .sidebar{
  background:rgba(15,38,58,.62) !important;
  background-color:rgba(15,38,58,.62) !important;
  background-image:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  filter:none !important;
  -webkit-filter:none !important;
  border-right:1px solid rgba(255,255,255,.18) !important;
  box-shadow:none !important;
}
body.dvt-shell-page .sidebar::before,
body.dvt-shell-page .sidebar::after,
body.dvt-shell-page .main::before,
body.dvt-shell-page .main::after,
body.dvt-shell-page .content::before,
body.dvt-shell-page .content::after{
  display:none !important;
  content:none !important;
  filter:none !important;
  -webkit-filter:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
body.dvt-shell-page .main,
body.dvt-shell-page .content,
body.dvt-shell-page .dash-card,
body.dvt-shell-page .frame-card,
body.dvt-shell-page .content-frame,
body.dvt-shell-page .hero{
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  filter:none !important;
  -webkit-filter:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}



/* ===== DVT PATCH: uniforme pagina-spacing + blauwe tekst zwart ===== */

/* Eén vaste contentpositie op alle pagina's binnen de app */
body.app-shell .dash-card,
body.app-shell .reports-page,
body.app-shell .rapportages-page,
body.app-shell .planning-page,
body.app-shell .documents-page,
body.app-shell .documenten-page,
body.app-shell .users-page,
body.app-shell .gebruikers-page,
body.app-shell .locations-page,
body.app-shell .locaties-page,
body.app-shell .builder-page,
body.app-shell .formulieren-page,
.dash-card,
.reports-page,
.rapportages-page,
.planning-page,
.documents-page,
.documenten-page,
.users-page,
.gebruikers-page,
.locations-page,
.locaties-page,
.builder-page,
.formulieren-page {
  padding: 34px 42px !important;
  margin: 0 !important;
}

/* Containers op alle pagina's exact zelfde breedte en startpositie */
.dashboard-wrap,
.reports-wrap,
.rapportages-wrap,
.planning-wrap,
.documents-wrap,
.documenten-wrap,
.users-wrap,
.gebruikers-wrap,
.locations-wrap,
.locaties-wrap,
.builder-wrap,
.formulieren-wrap,
.page-wrap,
.admin-wrap,
.content-wrap {
  width: 100% !important;
  max-width: 1320px !important;
  margin: 0 auto !important;
}

/* Eerste rij/statistiekblokken overal gelijk uitlijnen */
.dash-grid,
.reports-stats,
.rapportages-stats,
.stats-grid,
.stat-grid,
.cards-grid,
.summary-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: 100% !important;
  margin: 0 0 16px 0 !important;
}

/* Panelen/lijsten direct onder statistieken overal zelfde afstand */
.panel,
.reports-panel,
.rapportages-panel,
.list-panel,
.table-panel,
.card-panel {
  margin-top: 0 !important;
}

/* Blauwe teksten binnen content zwart maken, behalve primaire knoppen/actieve menu-items */
.content a:not(.btn):not(.nav-link):not(.active):not(.bottom-link),
.content-frame a:not(.btn):not(.nav-link):not(.active):not(.bottom-link),
.dash-card a:not(.btn):not(.nav-link):not(.active):not(.bottom-link),
.panel a:not(.btn):not(.nav-link):not(.active):not(.bottom-link),
.reports-page a:not(.btn):not(.nav-link):not(.active):not(.bottom-link),
.rapportages-page a:not(.btn):not(.nav-link):not(.active):not(.bottom-link),
.activity-main strong,
.report-title,
.report-name,
.rapport-title,
.rapport-name,
.list-title,
.table-title,
.item-title,
.card-title,
.stat-value,
.stat-card .stat-value,
.panel h1,
.panel h2,
.panel h3,
.panel h4 {
  color: #111827 !important;
}

/* Ook losse blauwe labels/links in tabellen en rapportregels zwart */
[style*="color:#111827"],
[style*="color:#111827"],
[style*="color:#111827"],
[style*="color:#111827"],
[style*="color:#111827"],
[style*="color:#111827"],
[style*="color:#111827"],
[style*="color:#111827"] {
  color: #111827 !important;
}

/* Primaire actieknoppen mogen blauw blijven als knop, tekst blijft duidelijk */
.btn.primary,
button.primary,
.filter-chip.active,
.pill.active,
.tabs .active,
.badge.active {
  background: #0D8DFF !important;
  border-color:#111827 !important;
  color: #fff !important;
}

/* Niet-actieve knoppen: tekst zwart i.p.v. blauw */
.btn:not(.primary),
button:not(.primary),
.filter-chip:not(.active),
.pill:not(.active),
.chip:not(.active) {
  color: #111827 !important;
}

/* Open PDF / Bewerken: behouden als knoppen, maar niet felblauwe tekst tenzij primaire knop */
a.btn:not(.primary),
button.btn:not(.primary) {
  color: #111827 !important;
}

/* Dropdown/formulierselector tekst zwart */
select,
.form-select,
.custom-select,
.select-trigger,
.dropdown-toggle {
  color: #111827 !important;
}

/* Responsive: dezelfde basis-spacing iets compacter */
@media (max-width: 980px) {
  .dash-card,
  .reports-page,
  .rapportages-page,
  .planning-page,
  .documents-page,
  .documenten-page,
  .users-page,
  .gebruikers-page,
  .locations-page,
  .locaties-page,
  .builder-page,
  .formulieren-page {
    padding: 22px 18px !important;
  }

  .dash-grid,
  .reports-stats,
  .rapportages-stats,
  .stats-grid,
  .stat-grid,
  .cards-grid,
  .summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 680px) {
  .dash-grid,
  .reports-stats,
  .rapportages-stats,
  .stats-grid,
  .stat-grid,
  .cards-grid,
  .summary-grid {
    grid-template-columns: 1fr !important;
  }
}


/* ===== DVT DEFINITIEVE FIX: spacing overal gelijk + blauwe contenttekst zwart ===== */
:root{
  --text:#111827 !important;
  --dark:#111827 !important;
}

/* Iframe-pagina's: geen dubbele body/page padding meer */
html, body{
  color:#111827 !important;
}

/* Pagina's die zelfstandig in de shell/iframe laden */
body{
  margin:0 !important;
}

/* Eén vaste pagina-start voor alle beheer-/overzichtspagina's */
.wrap,
.page-wrap,
.dashboard-wrap,
.reports-wrap,
.rapportages-wrap,
.planning-wrap,
.documents-wrap,
.documenten-wrap,
.users-wrap,
.gebruikers-wrap,
.locations-wrap,
.locaties-wrap,
.admin-wrap,
.content-wrap{
  width:100% !important;
  max-width:1280px !important;
  margin:0 auto !important;
  padding:28px 36px 40px !important;
}

/* Rapportages had body-padding; die gaat naar .wrap zodat alle pagina's hetzelfde starten */
body:has(.wrap) {
  padding:0 !important;
}

/* Documenten/Tekeningen: titelblok bovenaan niet tonen als dat alleen uitleg is */
.page-head{
  margin:0 0 16px 0 !important;
}
.page-head:empty{
  display:none !important;
}

/* Kaarten/statistieken overal exact dezelfde tussenruimte */
.stats,
.topline,
.dash-grid,
.stats-grid,
.stat-grid,
.reports-stats,
.rapportages-stats,
.summary-grid,
.cards-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:16px !important;
  margin:0 0 16px 0 !important;
  width:100% !important;
}

/* Alle panels/lijsten direct onder stats exact gelijk */
.panel,
.page-card,
.files-card,
.card,
.right-panel,
.left-panel{
  margin-top:0 !important;
}

/* Blauwe letters in content hard naar zwart */
a,
a:link,
a:visited,
.name,
.report .name,
.report-title,
.report-name,
.rapport-title,
.rapport-name,
.item-title,
.list-title,
.card-title,
.customer-name,
.customer,
.title,
.page-title,
.section-title,
.tool-title,
.panel-head h1,
.panel-head h2,
.panel-head h3,
.stat b,
.stat-value,
.month,
.chip,
.filter,
.pill,
.badge,
.edit-link,
.btn,
button,
select,
input,
textarea,
.search,
.form-select,
.custom-select,
.dropdown-toggle{
  color:#111827 !important;
}

/* Muted teksten blijven grijs, niet blauw */
.meta,
.muted,
.page-sub,
.subtitle,
.panel-sub,
.hint,
.stat span,
.stat-title,
.files-head,
th,
small{
  color:#64748b !important;
}

/* Actieve/gevulde blauwe knoppen moeten witte tekst houden */
.filter.active,
.chip.active,
.month.active,
.btn.dark,
.btn-dark,
.btn.primary,
button.primary,
.active.btn,
.pill.active,
.badge.active{
  background:#0D8DFF !important;
  border-color:#0D8DFF !important;
  color:#fff !important;
}

/* Menu-active en sidebar blijven leesbaar */
.nav a.active,
.nav a.active span{
  color:#111827 !important;
}
.nav a:not(.active),
.nav a:not(.active) span{
  color:#fff !important;
}

/* Links in lijsten zoals rapportnaam en Open PDF zwart zonder blauwe override */
.report a,
.report .btn,
.report .name,
.report-list a,
.files-card a,
.table a,
.panel a{
  color:#111827 !important;
}

/* Badges/chips die geen actieve blauwe knop zijn: tekst zwart */
.pill:not(.active),
.badge:not(.active),
.chip:not(.active),
.filter:not(.active){
  color:#111827 !important;
}

/* Documenten-pagina zonder overbodige titeltekst: bovenruimte blijft gelijk maar niet te groot */
.page-card > .page-head:first-child{
  display:none !important;
}

/* Responsive behoudt dezelfde logica */
@media(max-width:1050px){
  .wrap,
  .page-wrap,
  .dashboard-wrap,
  .reports-wrap,
  .rapportages-wrap,
  .planning-wrap,
  .documents-wrap,
  .documenten-wrap,
  .users-wrap,
  .gebruikers-wrap,
  .locations-wrap,
  .locaties-wrap,
  .admin-wrap,
  .content-wrap{
    padding:22px 18px 34px !important;
  }
  .stats,
  .topline,
  .dash-grid,
  .stats-grid,
  .stat-grid,
  .reports-stats,
  .rapportages-stats,
  .summary-grid,
  .cards-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media(max-width:680px){
  .stats,
  .topline,
  .dash-grid,
  .stats-grid,
  .stat-grid,
  .reports-stats,
  .rapportages-stats,
  .summary-grid,
  .cards-grid{
    grid-template-columns:1fr !important;
  }
}

/* DVT safeguard actieve knoppen wit */
.filter.active,.chip.active,.month.active,.btn.dark,.btn-dark,.btn.primary,button.primary{color:#fff!important;}


/* ===== DVT FIX2: exacte gelijke uitlijning tussen alle pagina's =====
   Belangrijk: dashboard kreeg eerder dubbele padding (.dash-card + .dashboard-wrap).
   Nu heeft iedere pagina maar één paddinglaag: 28px boven en 36px links/rechts.
*/
html, body {
  margin: 0 !important;
  padding: 0 !important;
  color: #111827 !important;
}

:root {
  --text: #111827 !important;
}

/* Dashboard in shell: alleen .dash-card heeft padding */
.dash-card {
  padding: 28px 36px 40px !important;
  overflow: auto !important;
}
.dashboard-wrap {
  width: 100% !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  gap: 16px !important;
}

/* Alle iframe/losse pagina's: dezelfde padding en dezelfde max-width */
.wrap,
.page-wrap,
.reports-wrap,
.rapportages-wrap,
.planning-wrap,
.documents-wrap,
.documenten-wrap,
.users-wrap,
.gebruikers-wrap,
.locations-wrap,
.locaties-wrap,
.admin-wrap,
.content-wrap {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 28px 36px 40px !important;
}

/* Geen extra bovenmarge op eerste elementen */
.wrap > *:first-child,
.page-wrap > *:first-child,
.dashboard-wrap > *:first-child,
.reports-wrap > *:first-child,
.rapportages-wrap > *:first-child,
.planning-wrap > *:first-child,
.documents-wrap > *:first-child,
.documenten-wrap > *:first-child,
.users-wrap > *:first-child,
.gebruikers-wrap > *:first-child,
.locations-wrap > *:first-child,
.locaties-wrap > *:first-child,
.admin-wrap > *:first-child,
.content-wrap > *:first-child {
  margin-top: 0 !important;
}

/* Gelijke afstand tussen blokken */
.dash-grid,
.stats,
.topline,
.stats-grid,
.stat-grid,
.reports-stats,
.rapportages-stats,
.summary-grid,
.cards-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin: 0 0 16px 0 !important;
  width: 100% !important;
}

.dash-panels,
.activity-grid,
.tools,
.filterbar,
.month-grid {
  margin-top: 0 !important;
}

.panel,
.page-card,
.files-card,
.card,
.right-panel,
.left-panel {
  margin-top: 0 !important;
}

/* Contenttekst en contentlinks zwart */
body,
.wrap,
.page-wrap,
.dashboard-wrap,
.panel,
.page-card,
.card,
.stat,
.stat-card,
.report,
.report-list,
.file-row,
.table,
.activity-item,
.name,
.report .name,
.report-title,
.report-name,
.rapport-title,
.rapport-name,
.item-title,
.list-title,
.card-title,
.customer-name,
.customer,
.title,
.page-title,
.section-title,
.tool-title,
.panel-head h1,
.panel-head h2,
.panel-head h3,
.stat b,
.stat-value,
.activity-main strong,
.activity-main span,
.status-list,
.status-row,
.edit-link,
.month:not(.active),
.chip:not(.active),
.filter:not(.active),
.pill:not(.active),
.badge:not(.active),
.btn:not(.dark):not(.btn-dark):not(.primary),
button:not(.primary),
select,
input,
textarea,
.search,
.form-select,
.custom-select,
.dropdown-toggle {
  color: #111827 !important;
}

/* Alle normale links zwart, behalve actieve/gevulde knoppen */
a:not(.btn-dark):not(.dark):not(.primary):not(.active),
a:link:not(.btn-dark):not(.dark):not(.primary):not(.active),
a:visited:not(.btn-dark):not(.dark):not(.primary):not(.active),
.report a:not(.btn-dark):not(.dark):not(.primary),
.panel a:not(.btn-dark):not(.dark):not(.primary),
.table a:not(.btn-dark):not(.dark):not(.primary),
.files-card a:not(.btn-dark):not(.dark):not(.primary) {
  color: #111827 !important;
}

/* Grijze subtitels blijven grijs */
.meta,
.muted,
.page-sub,
.subtitle,
.panel-sub,
.hint,
.stat span,
.stat-title,
.files-head,
th,
small,
.empty,
.empty-activity {
  color: #64748b !important;
}

/* Actieve/gevulde blauwe knoppen houden witte tekst */
.filter.active,
.chip.active,
.month.active,
.btn.dark,
.btn-dark,
.btn.primary,
button.primary,
.active.btn,
.pill.active,
.badge.active {
  background: #0D8DFF !important;
  border-color: #0D8DFF !important;
  color: #fff !important;
}

/* Sidebar blijft correct: wit op donker, active zwart/blauw icoon */
.nav a:not(.active),
.nav a:not(.active) span {
  color: #fff !important;
}
.nav a.active,
.nav a.active span {
  color: #111827 !important;
}
.nav a.active i {
  color:#111827 !important;
}

/* Documenten-uitleg definitief weg */
.page-title:empty,
.page-sub:empty {
  display: none !important;
}

/* Kleinere schermen */
@media(max-width:1050px){
  .dash-card,
  .wrap,
  .page-wrap,
  .reports-wrap,
  .rapportages-wrap,
  .planning-wrap,
  .documents-wrap,
  .documenten-wrap,
  .users-wrap,
  .gebruikers-wrap,
  .locations-wrap,
  .locaties-wrap,
  .admin-wrap,
  .content-wrap {
    padding: 22px 18px 34px !important;
  }
  .dash-grid,
  .stats,
  .topline,
  .stats-grid,
  .stat-grid,
  .reports-stats,
  .rapportages-stats,
  .summary-grid,
  .cards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media(max-width:680px){
  .dash-grid,
  .stats,
  .topline,
  .stats-grid,
  .stat-grid,
  .reports-stats,
  .rapportages-stats,
  .summary-grid,
  .cards-grid {
    grid-template-columns: 1fr !important;
  }
}

/* DVT FIX2 safeguard: actieve knoppen wit */
.filter.active,.chip.active,.month.active,.btn.dark,.btn-dark,.btn.primary,button.primary,.active.btn,.pill.active,.badge.active{background:#0D8DFF!important;border-color:#0D8DFF!important;color:#fff!important;}


/* ===== DVT FIX3: extra achtergrondlagen/overlays verwijderen ===== */

/* Basis: echte achtergrond tonen zonder extra content-overlay */
html, body {
  background: #dfe8f1 !important;
}

/* De shell gebruikt alleen de achtergrondafbeelding */
.shell {
  background: #dfe8f1 !important;
}
.shell::after {
  background: none !important;
}
body::before {
  background: none !important;
}
.main {
  background: transparent !important;
}
.content,
.frame-card,
.content-frame,
.dash-card,
.dashboard-wrap,
.dash-panels,
.activity-grid,
.tools,
.filterbar,
.month-grid,
.page-wrap,
.wrap,
.page-wrap > *,
.wrap > * {
  background: transparent !important;
}

/* Grote wrapper-kaarten weghalen zodat de echte achtergrond zichtbaar blijft */
.page-card,
.content-card,
.upload-card,
.settings-card,
.list-card,
.table-wrap,
.table-card,
.card-shell,
.admin-shell,
.files-shell {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
}

/* Alleen de echte losse witte onderdelen behouden */
.stat-card,
.panel,
.card,
.tool-card,
.files-card,
.object-card,
.user-card,
.report-card,
.planning-card,
.section-card {
  background: #ffffff !important;
  border: 1px solid rgba(148,163,184,.22) !important;
  box-shadow: 0 18px 44px rgba(21,44,68,.10) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Documenten/tekeningen: geen extra blok meer om tools + tabel heen */
.tools {
  margin-bottom: 20px !important;
}
.files-card {
  margin-top: 0 !important;
}

/* Dashboard: panel-groep zonder extra achterplaat */
.dash-panels,
.activity-grid {
  border: 0 !important;
  box-shadow: none !important;
}

/* Als pagina-head leeg is, geen ruimte */
.page-head:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Responsive */
@media(max-width:980px){
  .page-card,
  .content-card,
  .upload-card,
  .settings-card,
  .list-card,
  .table-wrap,
  .table-card {
    padding: 0 !important;
  }
}


/* ===== DVT REALFIX GENERAL ===== */
.page-card{
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}



/* ===== DVT HARD FINAL: geen doorschijnende/blur overlay meer ===== */

/* Achtergrond alleen op shell/body, niet als tweede laag op content */
html, body,
.shell, .main, .content, .frame-card, .content-frame, .dash-card {
  background-color: transparent !important;
}
.shell::after,
.main::before,
.main::after,
.content::before,
.content::after,
.dash-card::before,
.dash-card::after,
.frame-card::before,
.frame-card::after,
body::before,
body::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* Grote wrapper-blokken mogen géén eigen waas/achtergrond maken */
.dashboard-wrap,
.dash-panels,
.activity-grid,
.wrap,
.page-wrap,
.page-card,
.content-card,
.list-card,
.table-card,
.table-wrap,
.upload-card,
.settings-card,
.admin-card,
.card-shell,
.page-shell {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Alleen echte UI-kaarten zijn wit, zonder doorzicht/blur */
.stat-card,
.panel,
.tool-card,
.files-card,
.card,
.report,
.file-row,
.object-card,
.user-card,
.report-card,
.planning-card,
.section-card {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  border: 1px solid rgba(148,163,184,.22) !important;
  box-shadow: 0 14px 34px rgba(21,44,68,.08) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Headerrijen in tabellen/listen niet half-transparant */
.files-head,
.panel-head,
.card-header,
.table-header,
.page-header {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Documenten/Tekeningen: de page-card is alleen layout, geen zichtbaar vlak */
.page-wrap > .page-card {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Dashboard: geen grote plaat achter de twee grafiekkaarten */
.dash-panels {
  display: grid !important;
  grid-template-columns: 1.35fr 1fr !important;
  gap: 16px !important;
}
.dash-panels > .panel,
.activity-grid > .panel {
  background: #ffffff !important;
  border: 1px solid rgba(148,163,184,.22) !important;
}

/* Content moet zwart blijven */
a:not(.btn-dark):not(.dark):not(.primary):not(.active),
.name, .report .name, .report-title, .report-name,
.item-title, .list-title, .card-title, .customer-name,
.title, .page-title, .section-title, .tool-title,
.panel-head h1, .panel-head h2, .panel-head h3,
.stat b, .stat-value {
  color: #111827 !important;
}
.filter.active,.chip.active,.month.active,.btn.dark,.btn-dark,.btn.primary,button.primary,.active.btn,.pill.active,.badge.active{
  background:#0D8DFF!important;
  border-color:#0D8DFF!important;
  color:#fff!important;
}




/* ===== DVT FINAL: alle witte vlakken exact gelijk uitgelijnd =====
   Eén vaste maatvoering voor elke pagina:
   - bovenruimte: 28px
   - links/rechts: 36px
   - ruimte tussen grote witte onderdelen: 16px
*/
:root{
  --dvt-page-top:28px;
  --dvt-page-x:36px;
  --dvt-page-bottom:40px;
  --dvt-card-gap:16px;
  --dvt-page-max:1280px;
}

/* Geen dubbele body-padding meer in iframe pagina's */
html,
body{
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
}

/* Dashboard: padding alleen op de buitenste pagina-laag */
.dash-card{
  padding:var(--dvt-page-top) var(--dvt-page-x) var(--dvt-page-bottom) !important;
  margin:0 !important;
  box-sizing:border-box !important;
}

/* Dashboard content zelf krijgt géén extra padding, alleen max-width */
.dashboard-wrap{
  width:100% !important;
  max-width:var(--dvt-page-max) !important;
  margin:0 auto !important;
  padding:0 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:var(--dvt-card-gap) !important;
  box-sizing:border-box !important;
}

/* Alle losse pagina's/iframe pagina's krijgen exact dezelfde buitenruimte */
.wrap,
.page-wrap,
.reports-wrap,
.rapportages-wrap,
.planning-wrap,
.documents-wrap,
.documenten-wrap,
.users-wrap,
.gebruikers-wrap,
.locations-wrap,
.locaties-wrap,
.admin-wrap,
.content-wrap,
.builder-wrap,
.formulieren-wrap{
  width:100% !important;
  max-width:var(--dvt-page-max) !important;
  margin:0 auto !important;
  padding:var(--dvt-page-top) var(--dvt-page-x) var(--dvt-page-bottom) !important;
  box-sizing:border-box !important;
}

/* Geen extra marge bovenaan het eerste onderdeel */
.dashboard-wrap > *:first-child,
.wrap > *:first-child,
.page-wrap > *:first-child,
.reports-wrap > *:first-child,
.rapportages-wrap > *:first-child,
.planning-wrap > *:first-child,
.documents-wrap > *:first-child,
.documenten-wrap > *:first-child,
.users-wrap > *:first-child,
.gebruikers-wrap > *:first-child,
.locations-wrap > *:first-child,
.locaties-wrap > *:first-child,
.admin-wrap > *:first-child,
.content-wrap > *:first-child,
.builder-wrap > *:first-child,
.formulieren-wrap > *:first-child{
  margin-top:0 !important;
}

/* Grote witte blokken: overal dezelfde onderlinge ruimte */
.dash-grid,
.stats,
.topline,
.stats-grid,
.stat-grid,
.reports-stats,
.rapportages-stats,
.summary-grid,
.cards-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:var(--dvt-card-gap) !important;
  margin:0 0 var(--dvt-card-gap) 0 !important;
  width:100% !important;
  box-sizing:border-box !important;
}

/* Dashboard: panelrijen exact zelfde afstand */
.dash-panels,
.activity-grid{
  display:grid !important;
  gap:var(--dvt-card-gap) !important;
  margin:0 !important;
  width:100% !important;
  box-sizing:border-box !important;
}
.dash-panels{
  grid-template-columns:1.35fr 1fr !important;
}
.activity-grid{
  grid-template-columns:1fr 1fr !important;
}

/* Wanneer er meerdere grote rijen onder elkaar staan */
.dash-panels + .activity-grid,
.stats + .panel,
.topline + .month-grid,
.month-grid + .filterbar,
.filterbar + .panel,
.tools + .files-card,
.page-card + .panel,
.panel + .panel,
.card + .card,
.files-card + .files-card{
  margin-top:var(--dvt-card-gap) !important;
}

/* Documenten/tekeningen: toolblokken en bestandenlijst exact gelijk */
.tools{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:var(--dvt-card-gap) !important;
  margin:0 0 var(--dvt-card-gap) 0 !important;
  width:100% !important;
  box-sizing:border-box !important;
}
.tool-card,
.files-card{
  margin:0 !important;
  box-sizing:border-box !important;
}

/* Planning: bovenkaarten, maanden en filterrijen gelijke start en vaste spacing */
.month-grid{
  display:grid !important;
  gap:var(--dvt-card-gap) !important;
  margin:0 0 var(--dvt-card-gap) 0 !important;
  width:100% !important;
  box-sizing:border-box !important;
}
.filterbar{
  display:flex !important;
  gap:8px !important;
  margin:0 0 var(--dvt-card-gap) 0 !important;
  width:100% !important;
  box-sizing:border-box !important;
}

/* Algemene kaart/panel margins resetten, zodat er geen eigen afwijking ontstaat */
.stat-card,
.panel,
.card,
.tool-card,
.files-card,
.report,
.report-card,
.object-card,
.user-card,
.planning-card,
.section-card,
.page-card{
  margin:0 !important;
  box-sizing:border-box !important;
}

/* Transparante layout-wrappers mogen geen eigen wit vlak of spacing veroorzaken */
.page-card,
.content-card,
.list-card,
.table-card,
.table-wrap,
.upload-card,
.settings-card,
.admin-card,
card-shell,
page-shell{
  padding:0 !important;
}

/* Binnenruimte van witte kaarten/panels consistent */
.stat-card{
  padding:18px !important;
}
.panel-head,
.card-header,
.table-header,
.page-header{
  padding:18px 20px !important;
}
.panel > :not(.panel-head):not(style):not(script),
.card > :not(.card-header):not(style):not(script){
  box-sizing:border-box !important;
}

/* Rapportages lijst: panel-content sluit netjes aan */
.report{
  padding:16px 20px !important;
}
.tools + .report-list,
.panel .report-list{
  margin:0 !important;
}

/* Tabellen/lijsten */
.files-head,
.file-row{
  padding:14px 18px !important;
}

/* Rechts/links nooit buiten de max-width trekken */
.wrap *,
.page-wrap *,
.dashboard-wrap *{
  box-sizing:border-box !important;
}

/* Responsive: zelfde verhouding, alleen compacter */
@media(max-width:1180px){
  .dash-panels,
  .activity-grid{
    grid-template-columns:1fr !important;
  }
}
@media(max-width:1050px){
  :root{
    --dvt-page-top:22px;
    --dvt-page-x:18px;
    --dvt-page-bottom:34px;
  }
  .dash-grid,
  .stats,
  .topline,
  .stats-grid,
  .stat-grid,
  .reports-stats,
  .rapportages-stats,
  .summary-grid,
  .cards-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .tools{
    grid-template-columns:1fr !important;
  }
}
@media(max-width:680px){
  .dash-grid,
  .stats,
  .topline,
  .stats-grid,
  .stat-grid,
  .reports-stats,
  .rapportages-stats,
  .summary-grid,
  .cards-grid,
  .month-grid{
    grid-template-columns:1fr !important;
  }
}

