
:root{--ux-ink:#19324b;--ux-muted:#647587;--ux-teal:#2b7f74;--ux-teal-2:#49a18d;--ux-sky:#eaf6fb;--ux-mint:#eaf7f2;--ux-sand:#fff5e6;--ux-lilac:#f4effb;--ux-border:#dfe9ee;--ux-shadow:0 12px 34px rgba(26,54,78,.08)}
.app-body{background:linear-gradient(180deg,#f7fbfd 0,#f3f7f9 100%)}
.app-sidebar{width:250px;background:linear-gradient(180deg,#253b53 0%,#2f4a60 55%,#28445a 100%);border:0;box-shadow:10px 0 30px rgba(21,43,61,.08)}.app-main{margin-left:250px}.app-sidebar .brand{margin:2px 2px 10px;padding:8px 10px 16px;border-bottom:1px solid rgba(255,255,255,.12)}.side-nav-group{margin:3px 0}.side-nav-group-toggle,.side-link-dashboard{border-radius:12px!important}.side-nav-group-toggle{font-size:15px!important;min-height:46px!important}.side-nav-group-items{margin:4px 0 6px 10px!important;padding:6px!important;background:rgba(9,29,46,.28)!important;border-radius:12px!important}.side-nav-group-items .side-link{border-radius:9px!important;min-height:39px!important;padding:7px 10px!important}.side-link.is-active,.side-nav-group-items .side-link.is-active{background:linear-gradient(135deg,#39a68f,#2d8f88)!important;box-shadow:0 5px 14px rgba(0,0,0,.15)}
.app-topbar{height:72px;border:0;box-shadow:0 1px 0 rgba(34,69,91,.08);backdrop-filter:blur(14px)}.topbar-find input{border-radius:999px;background:#f4f8fa;border:1px solid #dfe7eb;padding-left:16px}.topbar-find button{border-radius:999px;background:#e9f5f2;color:#245f57}.user-chip{padding:5px 8px;border-radius:14px;background:#f7fafb}.app-content{padding:30px 28px 16px}
.dashboard-hero,.dashboard-panel,.dashboard-card,.quick-card{border-radius:20px!important}.dashboard-panel,.dashboard-card{border-color:var(--ux-border)!important;box-shadow:var(--ux-shadow)!important}.ux-kicker{display:inline-block;margin-bottom:7px;color:var(--ux-teal);font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.ux-welcome-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:150px;padding:30px 34px;background:linear-gradient(120deg,#eff9f5 0%,#f3f8ff 55%,#fff5e8 100%);border:1px solid #dfece8;box-shadow:var(--ux-shadow)}.ux-welcome-hero:after{content:'✦';position:absolute;right:38px;top:13px;font-size:42px;color:rgba(68,155,137,.16);transform:rotate(15deg)}.ux-welcome-hero h1{font-size:clamp(28px,4vw,38px);color:var(--ux-ink)}.ux-hero-actions{display:flex;flex-wrap:wrap;gap:10px;position:relative;z-index:1}.ux-hero-actions .button{border-radius:999px;padding-inline:20px}
.ux-task-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0 0 20px}.ux-task-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;min-height:102px;padding:18px;background:#fff;border:1px solid var(--ux-border);border-radius:18px;color:var(--ux-ink);text-decoration:none;box-shadow:0 7px 22px rgba(31,64,86,.05);transition:.18s ease}.ux-task-card:nth-child(2){background:linear-gradient(145deg,#fff,#f1f8fd)}.ux-task-card:nth-child(3){background:linear-gradient(145deg,#fff,#fff8ed)}.ux-task-card:nth-child(4){background:linear-gradient(145deg,#fff,#f4f0fb)}.ux-task-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(31,64,86,.1);text-decoration:none}.ux-task-primary{background:linear-gradient(145deg,#e9f7f2,#f8fffc)!important;border-color:#bddfd4}.ux-task-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#e8f5f1;color:#28796d;font-size:22px}.ux-task-card strong,.ux-task-card small{display:block}.ux-task-card strong{font-size:16px}.ux-task-card small{margin-top:4px;color:var(--ux-muted);line-height:1.35}.ux-arrow{font-size:20px;color:#7a8b96}.ux-two-column{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,.85fr);gap:18px}.ux-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px}.ux-panel-head h2{margin:0}.ux-panel-head p{margin:5px 0 0;color:var(--ux-muted)}.ux-appointment-list{display:grid;gap:8px}.ux-appointment{display:grid;grid-template-columns:68px 1fr auto;align-items:center;gap:12px;padding:13px 14px;border-radius:14px;background:#f8fbfc;color:var(--ux-ink);text-decoration:none;border:1px solid #edf2f4}.ux-appointment:hover{background:#eef8f5;text-decoration:none}.ux-appointment time{font-weight:900;color:var(--ux-teal)}.ux-appointment strong,.ux-appointment small{display:block}.ux-appointment small{margin-top:3px;color:var(--ux-muted)}.ux-empty{text-align:center;padding:28px 18px;background:#fbfdfd;border:1px dashed #d5e2e7;border-radius:16px}.ux-empty>span{display:block;font-size:34px}.ux-empty strong{display:block;margin:5px}.ux-empty p{color:var(--ux-muted)}.ux-status-row{display:flex;gap:12px;align-items:flex-start;padding:13px;border-radius:14px;background:#f7fafb}.ux-status-dot{width:12px;height:12px;border-radius:50%;margin-top:5px;box-shadow:0 0 0 4px rgba(0,0,0,.04)}.ux-status-dot.is-on{background:#38a078}.ux-status-dot.is-off{background:#c78945}.ux-status-row strong,.ux-status-row small{display:block}.ux-status-row small{margin-top:4px;color:var(--ux-muted)}.ux-mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}.ux-mini-stats div{padding:12px 8px;text-align:center;border-radius:12px;background:#f7f9fb}.ux-mini-stats strong,.ux-mini-stats span{display:block}.ux-mini-stats strong{font-size:20px}.ux-mini-stats span{font-size:11px;color:var(--ux-muted)}.ux-inline-form{margin:0}.ux-help-strip{display:flex;justify-content:space-between;align-items:center;gap:18px;background:linear-gradient(120deg,#fff7e9,#f5f0fb)!important}.ux-help-strip h2{margin:0}.ux-help-strip p{margin:.4rem 0 0}.ux-advanced summary{cursor:pointer;display:flex;justify-content:space-between;gap:10px;list-style:none}.ux-advanced summary::-webkit-details-marker{display:none}.ux-advanced summary span{color:var(--ux-muted);font-size:13px}.ux-advanced[open] summary{margin-bottom:18px}.ux-compact-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))!important}
.ux-settings-page{max-width:1050px!important;padding-bottom:45px}.ux-settings-hero{min-height:auto!important;padding:26px 30px!important;background:linear-gradient(120deg,#eef8f5,#f6f3fc)!important}.ux-settings-hero h1{margin:0 0 6px}.ux-setup-steps{display:grid;gap:12px;margin:20px 0}.ux-setup-card,.ux-setting-card{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:18px;background:#fff;border:1px solid var(--ux-border);border-radius:17px;color:var(--ux-ink);text-decoration:none;box-shadow:0 6px 20px rgba(31,64,86,.045);transition:.16s}.ux-setup-card:hover,.ux-setting-card:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(31,64,86,.09);text-decoration:none}.ux-step-number,.ux-setting-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--ux-mint);color:var(--ux-teal);font-weight:900;font-size:18px}.ux-setup-card:nth-child(2) .ux-step-number,.ux-setting-card:nth-child(2) .ux-setting-icon{background:var(--ux-sky)}.ux-setup-card:nth-child(3) .ux-step-number,.ux-setting-card:nth-child(3) .ux-setting-icon{background:var(--ux-sand)}.ux-setup-card:nth-child(4) .ux-step-number{background:var(--ux-lilac)}.ux-setup-card strong,.ux-setup-card small,.ux-setting-card strong,.ux-setting-card small{display:block}.ux-setup-card small,.ux-setting-card small{margin-top:4px;color:var(--ux-muted);line-height:1.4}.ux-help-box{display:flex;align-items:center;gap:16px}.ux-help-box .ux-help-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#e9f3fb;color:#3577a6;font-size:24px;font-weight:900}.ux-help-box div{flex:1}.ux-help-box h2,.ux-help-box p{margin:0}.ux-help-box p{margin-top:4px;color:var(--ux-muted)}.ux-settings-groups{display:grid;gap:26px}.ux-settings-groups>section>h2{font-size:19px;margin:0 0 12px}.ux-setting-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ux-setting-card{min-height:92px}.ux-back-row{display:flex;justify-content:space-between;gap:12px;margin:24px 0;flex-wrap:wrap}.ux-simple-panel{margin-bottom:14px;padding:22px;background:#fff;border:1px solid var(--ux-border);border-radius:18px;box-shadow:0 7px 22px rgba(31,64,86,.05)}.ux-module-list{display:grid;gap:9px}.ux-module-list .module-switch{border:1px solid #e2eaee;border-radius:14px;padding:12px 14px;background:#fbfdfd}.ux-details{padding:0}.ux-details summary{display:flex;justify-content:space-between;gap:18px;padding:20px 22px;cursor:pointer;list-style:none}.ux-details summary::-webkit-details-marker{display:none}.ux-details summary strong,.ux-details summary small{display:block}.ux-details summary small{margin-top:4px;color:var(--ux-muted)}.ux-details-body{padding:0 22px 22px;border-top:1px solid #edf1f3}.ux-danger-details{border-color:#ecd6d2}.ux-danger-details summary strong{color:#8e4037}
.button,.button-primary,.button-secondary,button{border-radius:12px}.button-primary{background:linear-gradient(135deg,#2e8a78,#3a9e89);box-shadow:0 6px 14px rgba(45,138,120,.18)}.quick-card{transition:.16s ease}.quick-card:hover{box-shadow:0 10px 24px rgba(31,64,86,.08)}
@media(max-width:1100px){.ux-task-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ux-two-column{grid-template-columns:1fr}.ux-setting-grid{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.app-main{margin-left:0}.ux-welcome-hero{align-items:flex-start;flex-direction:column}.app-content{padding:20px 14px}.app-sidebar{width:270px}}
@media(max-width:650px){.ux-task-grid,.ux-setting-grid{grid-template-columns:1fr}.ux-welcome-hero{padding:22px!important}.ux-hero-actions{width:100%}.ux-hero-actions .button{flex:1}.ux-task-card{min-height:88px}.ux-two-column{display:block}.ux-status-panel{margin-top:14px}.ux-help-strip,.ux-help-box{align-items:flex-start;flex-direction:column}.ux-help-strip .button,.ux-help-box .button{width:100%}.ux-mini-stats{grid-template-columns:1fr 1fr}.ux-mini-stats div:last-child{grid-column:span 2}.ux-appointment{grid-template-columns:58px 1fr auto}.ux-settings-page{padding-inline:0}.ux-details summary{padding:17px}.ux-details-body{padding:0 17px 17px}.ux-back-row{flex-direction:column}}

/* Fase 9 - Praktijkcockpit en sneller herboeken */
.cockpit-home{margin:18px 0}.cockpit-home-grid,.cockpit-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.cockpit-home-grid a,.cockpit-summary article{display:flex;flex-direction:column;gap:3px;padding:16px;border:1px solid #d9e4e4;border-radius:14px;background:#fff;text-decoration:none;color:inherit}.cockpit-home-grid strong,.cockpit-summary strong{font-size:1.6rem}.cockpit-ok{padding:14px;border-radius:12px;background:#f0f7f5}.cockpit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:18px}.action-count{display:inline-grid;place-items:center;min-width:34px;height:34px;border-radius:999px;background:#eef3f3;font-weight:700}.action-list{display:grid;gap:8px}.action-list a{display:grid;grid-template-columns:1.2fr 1.5fr auto;gap:12px;align-items:center;padding:12px;border:1px solid #e0e7e7;border-radius:12px;text-decoration:none;color:inherit}.action-list a:hover{border-color:#8fb7b5}.action-list span{font-size:.9rem;color:#53686b}.followup-slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin:18px 0}.followup-slots a{display:flex;justify-content:space-between;gap:8px;padding:14px;border:1px solid #b9d1cf;border-radius:12px;text-decoration:none;color:inherit}.followup-choice{margin-top:14px;padding:14px;border:1px solid #d9e4e4;border-radius:12px}.quick-rebook-actions{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}.inline-preference{display:flex;gap:10px;align-items:end;flex-wrap:wrap}.inline-preference label{min-width:260px}.strip-card-book{margin:10px 0 14px}@media(max-width:760px){.cockpit-home-grid,.cockpit-summary,.cockpit-grid{grid-template-columns:1fr 1fr}.action-list a{grid-template-columns:1fr}.action-list b{justify-self:start}}@media(max-width:480px){.cockpit-home-grid,.cockpit-summary,.cockpit-grid{grid-template-columns:1fr}}
