/* ===== FOAP UI NL v1.6.1 ===== */
/* Forceer font-stack op dashboardcontainer */
.foapfd-wrap { font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif !important; }
.foapfd-wrap * { font-family: inherit !important; }

/* Zorg dat TinyMCE iconen altijd zichtbaar blijven */
.tox .tox-tbtn, .mce-toolbar .mce-btn button {
  color: #374151; /* iconen zijn SVG en volgen currentColor */
}
.tox .tox-tbtn svg { width: 16px; height: 16px; }

/* Hero/kaart */
.foapfd-wrap, .foapfd-card, .foapfd-form, .foapfd-tabs, .x-btn, .foapfd-badge, .foapfd-header { font: inherit; }
.foapfd-hero{ background: radial-gradient(1200px 250px at 0% 0%, rgba(26,115,232,.08), transparent), linear-gradient(180deg, #fff, #fff); border-radius:20px; padding:20px; box-shadow:0 12px 40px rgba(0,0,0,.08); display:flex; align-items:center; justify-content:space-between; }
.foapfd-hero .foapfd-user .avatar{ border-radius:12px; }

/* FOAP-knoppen */
.x-btn{ --fs:16px; --px:18px; --py:12px; --gap:10px; --radius:14px; --bg:#1a73e8; --fg:#fff; --bg-hover:#1667cc; --bg-active:#145db8; --border:transparent; --shadow:0 12px 30px rgba(0,0,0,.12); --ripple: currentColor; display:inline-flex; align-items:center; justify-content:center; gap:var(--gap); font: inherit; font-size:var(--fs); font-weight:600; padding:var(--py) var(--px); color:var(--fg)!important; background:var(--bg)!important; border:1px solid var(--border)!important; border-radius:var(--radius)!important; text-decoration:none!important; white-space:nowrap; vertical-align:middle; cursor:pointer; user-select:none; box-shadow:var(--shadow); transition:background .15s ease, box-shadow .2s ease, transform .02s ease; box-sizing:border-box; }
.x-btn:hover{ background:var(--bg-hover)!important; } .x-btn:active{ background:var(--bg-active)!important; transform:translateY(.5px); } .x-btn:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(26,115,232,.35), var(--shadow); }
.x-btn .x-label{ display:inline-block; } .x-btn .x-arrow{ display:inline-block; margin-left:var(--gap); transition:transform .2s ease; } .x-btn:hover .x-arrow{ transform:translateX(2px); }
.x-btn.sm{ --fs:14px; --py:6px;  --px:12px; --gap:8px; } .x-btn.md{ --fs:16px; --py:10px; --px:18px; --gap:10px; } .x-btn.lg{ --fs:18px; --py:14px; --px:26px; --gap:12px; }
.x-primary{ --bg:#1a73e8; --fg:#fff; --bg-hover:#1667cc; --bg-active:#145db8; --ripple:#fff; } .x-outline{ --bg:transparent; --fg:#1a73e8; color:var(--fg)!important; border-color: currentColor!important; background:transparent!important; } .x-outline:hover{ background:rgba(26,115,232,.08)!important; }

/* Layout */
.foapfd-wrap{ max-width:1100px; margin:32px auto; padding:0 16px; }
.foapfd-header{ margin-bottom:18px; }
.foapfd-user{ display:flex; align-items:center; gap:12px; }
.foapfd-user .avatar{ border-radius:50%; box-shadow:0 4px 12px rgba(0,0,0,.1); }
.foapfd-card{ background:#fff; border-radius:16px; padding:18px; box-shadow:0 10px 35px rgba(0,0,0,.08); margin-bottom:16px; }
.foapfd-tabs{ display:flex; gap:8px; flex-wrap:wrap; margin:12px 0 16px; } .foapfd-tabs .x-btn{ box-shadow:none; }
.foapfd-muted{ color:#6b7280; font-size:14px; }

/* Forms */
.foapfd-form label{ font-weight:600; display:block; margin-bottom:6px; }
.foapfd-form input[type="text"], .foapfd-form input[type="email"], .foapfd-form select, .foapfd-form input[type="password"]{ width:100%; border:1px solid #e5e7eb; border-radius:12px; padding:12px 14px; font:inherit; box-sizing:border-box; background:#fff; }
.foapfd-form .wp-editor-wrap{ border:1px solid #e5e7eb; border-radius:12px; overflow:hidden; }
.foapfd-form .mce-toolbar, .foapfd-form .quicktags-toolbar{ background:#f9fafb; }
.foapfd-actions{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.foapfd-badge{ display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; background:#f3f4f6; color:#111827; font-size:12px; }

/* Composer + */
.foapfd-composer{ position:relative; }
.foapfd-plusbtn{ position:absolute; right:14px; bottom:14px; z-index:9; width:44px; height:44px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; border:1px solid #e5e7eb; background:#fff; cursor:pointer; transition:box-shadow .15s ease, transform .05s ease; box-shadow:0 6px 16px rgba(0,0,0,.08); }
.foapfd-plusbtn:hover{ box-shadow:0 10px 24px rgba(0,0,0,.12); }
.foapfd-plusmenu{ position:absolute; right:14px; bottom:64px; z-index:99; background:#fff; border:1px solid #e5e7eb; border-radius:12px; box-shadow:0 18px 40px rgba(0,0,0,.15); padding:6px; display:none; min-width:300px; }
.foapfd-plusmenu button{ display:flex; width:100%; gap:12px; align-items:center; padding:12px 14px; border-radius:12px; background:transparent; border:none; cursor:pointer; text-align:left; font:inherit; }
.foapfd-plusmenu button:hover{ background:#f3f4f6; }
.foapfd-icon{ width:18px; display:inline-flex; align-items:center; justify-content:center; }

/* AI-assistent paneel */
.foapfd-ai{ background:#fff; border:1px solid #e5e7eb; border-radius:16px; padding:14px; box-shadow:0 8px 24px rgba(0,0,0,.06); display:grid; gap:10px; }
.foapfd-ai .chiprow{ display:flex; flex-wrap:wrap; gap:8px; }
.foapfd-chip{ padding:8px 10px; border-radius:999px; border:1px solid #e5e7eb; background:#fafafa; cursor:pointer; font:inherit; }
.foapfd-chip.active,.foapfd-chip:hover{ background:#f3f4f6; }
.foapfd-ai .x-btn{ box-shadow:none; }

/* Kaartenlijst (mijn inhoud) */
.foapfd-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
.foapfd-card.small{ padding:14px; }
.foapfd-meta{ display:flex; justify-content:space-between; font-size:12px; color:#6b7280; margin-top:6px; }
