body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background-color:#f0f2f5;color:#333;margin:0;padding:20px}.container{max-width:600px;margin-left:auto;margin-right:auto;padding:20px}header{text-align:center;margin-bottom:30px;border-bottom:1px solid #ddd;padding-bottom:20px}header h1{color:#0056b3}.rooster-info h3{font-size:1rem}#exportButton{padding:10px 16px;font-size:16px;font-weight:600;color:#fff;background-color:#1a73e8;border:none;border-radius:5px;cursor:pointer;transition:background-color .2s ease,transform .1s ease}#exportButton:hover{background-color:#1765c4}#exportButton:active{transform:scale(.98)}#exportButton:disabled{background-color:#b0bec5;opacity:.7;cursor:not-allowed}.controls{display:flex;flex-direction:column;gap:15px;justify-content:space-between;align-items:center;margin-bottom:30px;background:#fff;padding:20px;border-radius:8px;box-shadow:0 4px 12px #0000000d}.control-item{display:flex;align-items:center}.control-item label{font-weight:600;margin-right:10px}input[type=date]{padding:8px;border:1px solid #ccc;border-radius:5px;font-size:16px}.toggle-label{margin-right:15px}.toggle-input{display:none}.toggle-switch{position:relative;display:inline-block;width:50px;height:28px;background-color:#ccc;border-radius:34px;cursor:pointer;transition:background-color .2s}.toggle-switch:before{content:"";position:absolute;width:20px;height:20px;border-radius:50%;background-color:#fff;top:4px;left:4px;transition:transform .2s}.toggle-input:checked+.toggle-switch{background-color:#007bff}.toggle-input:checked+.toggle-switch:before{transform:translate(22px)}.rooster-lijst{margin-top:20px}.placeholder-text{text-align:center;color:#777;font-size:1.1em}.rooster-item{display:flex;justify-content:space-between;align-items:center;background:#fff;border-radius:8px;margin-bottom:5px;padding:15px 20px;box-shadow:0 4px 8px #0000000d;border-left:5px solid #007bff;transition:transform .2s ease-in-out}.rooster-item:hover{transform:translateY(-2px)}.rooster-info h3{margin:0 0 5px;color:#333}.rooster-info p{margin:0;color:#666;font-size:.9em}.rooster-duur{font-weight:600;font-size:.9em;color:#555;white-space:nowrap;margin-left:20px}.rooster-item.vakantie{border-left-color:#ff9800}.rooster-item.stage{border-left-color:#4caf50}.rooster-item.semiarts{border-left-color:#e91e63}.rooster-item.coschap{border-left-color:#007bff}.rooster-item.voorbereidend{border-left-color:#9c27b0}.main-nav{background-color:#004a99;padding:10px 20px;border-radius:8px;margin-bottom:30px}.main-nav ul{list-style:none;display:flex;gap:20px;margin:0;padding:0}.main-nav a{color:#fff;text-decoration:none;font-weight:600;font-size:16px;padding:10px;border-radius:5px;transition:background-color .2s}.main-nav a:hover{background-color:#0056b3}.content{max-width:900px;margin:0 auto;padding:20px;background:#fff;border-radius:8px;box-shadow:0 4px 12px #0000000d}.fase-titel{margin-top:25px;margin-bottom:10px;color:#004a99;border-bottom:2px solid #e0e0e0;padding-bottom:8px}.rooster-lijst .fase-titel:first-of-type{margin-top:10px}@media(max-width:600px){.container{padding:10px}.controls{flex-direction:column;align-items:stretch;gap:15px}.control-item input[type=date],#exportButton{width:100%;box-sizing:border-box}.control-item label{margin-bottom:5px}#exportButton{text-align:center}.rooster-item{align-items:center;justify-content:space-between;gap:5px}.rooster-info{flex:1}.rooster-duur{margin-left:0;background-color:#f4f4f4;padding:4px 8px;border-radius:4px;font-size:.9em}header h1{font-size:1.8rem}.fase-titel{font-size:1.3rem}}.filter-controls{display:flex;gap:15px;justify-content:center;padding:10px;background-color:#f9f9f9;border-radius:1px;margin-top:10px;margin-bottom:10px}.filter-item{display:flex;align-items:center;gap:8px}.filter-item label{font-weight:500;cursor:pointer}.filter-item input[type=checkbox]{width:18px;height:18px;cursor:pointer}@media(max-width:600px){.filter-controls{flex-direction:column;align-items:flex-start;gap:15px}}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}