@import url("https://fonts.googleapis.com/css2?family=Birthstone+Bounce&display=swap");

:root{--navy:#142d44;--green:#70dc15;--muted:#71808b;--paper:#f8f7f3;--border:#dce1e2}
*{box-sizing:border-box}html{min-width:320px}body{margin:0;color:var(--navy);background:radial-gradient(circle at 50% 0%,#fff 0,rgba(255,255,255,0) 42rem),var(--paper);font:15px/1.5 "Montserrat",Arial,sans-serif}
a{color:var(--navy)}h1,h2,h3{margin:0 0 12px;line-height:1.2}h1{font-size:27px}h2{font:600 25px/1.2 "Oswald","Montserrat",sans-serif}h3{font-size:17px;margin:17px 0 12px}p{color:#516176;margin:0 0 16px}
/* De welkomstheader is visueel identiek aan de homepage, maar wordt lokaal beheerd. */
.brandbar{width:min(1180px,calc(100% - 64px));min-height:112px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:inline-flex;align-items:center;gap:17px;text-decoration:none}.brand__bear{display:block;width:72px;height:72px;object-fit:contain}.brand__logo{display:block;width:220px;height:68px;object-fit:contain}
.welcome{text-align:right}.welcome p{margin:0}.welcome__motto{font-size:10px;font-weight:700;letter-spacing:.28em;color:var(--navy)}.welcome__note{padding-top:5px;font:400 27px/1 "Birthstone Bounce",cursive;color:var(--navy)}
.login-screen{max-width:490px;margin:7vh auto;padding:0 16px}.shell{max-width:1100px;margin:0 auto;padding:18px}
.panel{border:1px solid var(--border);background:white;border-radius:16px;padding:22px;box-shadow:0 7px 24px rgba(10,28,43,.055)}
.topbar{display:flex;align-items:center;gap:18px;padding:10px 2px 24px}.topbar p{flex:1;margin:0}.admin-logo{display:inline-flex;gap:11px;align-items:center;text-decoration:none}.admin-logo img{width:52px;height:52px;object-fit:contain}.topbar form{margin-left:auto}
.admin-grid{display:grid;grid-template-columns:1fr;gap:18px}.full{grid-column:1/-1}.intro{border-left:4px solid var(--green)}
form{margin:0}label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;margin:0 0 13px}
input:not([type=checkbox]):not([type=file]),select{font:inherit;color:var(--navy);padding:10px 11px;width:100%;border:1px solid #cdd6dd;border-radius:9px;background:#fff;outline-offset:3px}
input[type=file]{max-width:100%;font:inherit;font-size:12px;color:var(--muted)}input:focus-visible,select:focus-visible{outline:3px solid #8ac866;outline-offset:2px}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:18px}.subpanel{background:#fcfcfb;border:1px solid var(--border);border-radius:12px;padding:16px}.subpanel h3{margin:0 0 14px}.subpanel h3:after{content:"";display:block;background:var(--green);width:50px;height:3px;margin-top:8px}
.photo-pair{margin:5px 0 12px}.asset-row{display:flex;align-items:center;gap:15px}.asset-row label{flex:1;margin:0}.thumb{width:88px;height:88px;object-fit:cover;border-radius:50%;border:1px solid var(--border)}
.btn{font:inherit;font-size:13px;font-weight:700;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:10px 15px;min-height:39px;border-radius:9px;border:1px solid #cdd6dd;text-decoration:none}
.primary{background:var(--navy);border-color:var(--navy);color:white}.light{background:#f6f8fa;color:var(--navy)}.danger{background:white;border-color:#e4c1c1;color:#a42c2c}.btn:hover{filter:brightness(.95)}
.error,.success{padding:12px 14px;border-radius:10px;font-weight:600}.error{color:#8e2323;background:#fff1f1;border:1px solid #eac2c2}.success{color:#1f572a;background:#f1faec;border:1px solid #cce5bc}
.small,small{font-size:12px;color:var(--muted)}
.field-edit,.link-edit{margin:12px 0;padding:16px;background:#fcfcfb;border:1px solid var(--border);border-radius:13px}
.field-edit__top{display:grid;grid-template-columns:1fr 1fr 1.6fr 90px;gap:12px;align-items:end}.link-edit .field-edit__top{grid-template-columns:1fr 2fr 1fr 90px}
.field-edit__top label{min-width:0}.field-edit__bottom{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.field-edit__bottom>label{min-width:140px;max-width:220px;margin:0}.checks{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-right:auto}
.check{display:inline-flex;flex-direction:row;align-items:center;gap:6px;white-space:nowrap;margin:0;font-size:13px;font-weight:600}.check input{width:16px;height:16px;accent-color:var(--navy)}
.icon-thumb{width:43px;height:43px;object-fit:contain;background:#f5f6f8;border-radius:8px;padding:5px}
.qr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.qr-panel{border:1px solid var(--border);border-radius:12px;padding:15px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}.qr-panel h3{margin:0}.qr-panel img{display:block;width:175px;max-width:100%;height:auto}.qr-panel code{display:block;max-width:100%;font-size:12px;overflow-wrap:anywhere}.qr-panel a{font-weight:600}.password-form{max-width:430px}
@media(max-width:760px){.fields,.field-edit__top,.link-edit .field-edit__top{grid-template-columns:1fr 1fr}.qr-grid{grid-template-columns:1fr 1fr}.topbar{flex-wrap:wrap}.topbar p{flex-basis:40%}}
@media(max-width:550px){.brandbar{width:min(100% - 32px,560px);min-height:76px;gap:10px}.brand{gap:0}.brand__bear{width:52px;height:52px}.brand__logo,.welcome__motto{display:none}.welcome__note{font-size:clamp(19px,5vw,24px);white-space:nowrap;padding-top:0}.fields,.field-edit__top,.link-edit .field-edit__top,.qr-grid{grid-template-columns:1fr}.shell{padding:12px}.panel{padding:16px}.asset-row{flex-wrap:wrap}.topbar p{display:none}}
/* v0.3.0 gebruikersbeheer */
.account-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 0;border-bottom:1px solid var(--border)}
.account-row p{margin:5px 0 0;overflow-wrap:anywhere}.account-actions{display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:600px){.account-row{align-items:flex-start;flex-direction:column}.account-actions{width:100%}}