/* v81 UI-only desktop layer extracted from the supplied v83 UI patch.
   No routes, sync, API or database behaviour lives in this file. */
@media (min-width:1025px) and (pointer:fine){
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-match-browser .sx-parent-event{display:flex!important;flex-direction:column!important;gap:12px!important;min-width:0;width:100%;max-width:100%;padding:22px;box-sizing:border-box}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-match-browser .sx-parent-event>div{grid-column:auto!important;grid-row:auto!important;width:100%;max-width:100%;min-width:0;box-sizing:border-box}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-match-browser .sx-parent-event>.sx-parent-event-logo{width:52px!important;height:52px!important;flex:none}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-match-browser .sx-parent-event h3{font-size:18px!important;line-height:1.35;white-space:normal!important;word-break:normal!important;overflow-wrap:break-word!important;width:100%;max-width:none!important}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-match-browser .sx-parent-event .sx-parent-date{display:flex!important;gap:8px;align-items:center;white-space:normal}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-match-browser .sx-parent-event .sx-parent-wash{display:flex!important;align-items:center;gap:8px;border-radius:12px;padding:10px 12px;background:#f0eafd;color:#7050a5;font-size:12px}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-list{align-items:start;gap:18px}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-event.is-training{padding:20px!important;gap:10px 14px!important}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-event.is-training .sx-parent-attendance{display:flex;gap:6px;padding:5px;background:var(--bg-subtle);border-radius:14px;margin:0}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-event.is-training .sx-parent-attendance button{flex:1;border:0;min-height:38px;border-radius:10px;font-size:12px;background:transparent;color:var(--text-muted);padding:8px;box-shadow:none}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-event.is-training .sx-parent-attendance button.is-active.yes{background:#dbf5e9;color:#087b50}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-event.is-training .sx-parent-attendance button.is-active.maybe{background:#fff0d5;color:#a76000}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-event.is-training .sx-parent-attendance button.is-active.no{background:#ffe3e8;color:#bb2946}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-portal .sx-parent-quicklinks{padding:16px 18px;border-radius:20px}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-quicklinks-head{margin-bottom:12px}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-quicklinks-head small{display:none}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-quicklinks-grid>button{padding:14px;min-height:84px;box-shadow:none;gap:12px}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-quicklinks-grid .sx-parent-quick-icon svg{color:white!important;stroke:white!important;width:25px;height:25px}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-quicklinks-grid>button>svg{margin-left:auto;width:16px;flex:none;opacity:.5}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-dashboard{grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:20px;align-items:start}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-dashboard>.sx-announcement-list{grid-column:1;grid-row:1}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-dashboard>.sx-follow-panel{grid-column:2;grid-row:1;margin-top:0;position:sticky;top:20px}
 html:not(.sx-phone-webapp) :is(.sx-view,.sx-modal,.modal-card) :is(form,.form-group,.sx-field,.meta) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=hidden]),select,textarea){box-sizing:border-box;max-width:100%;min-height:44px;padding:11px 13px;border:1px solid var(--border-subtle);border-radius:12px;background:var(--bg-card);color:var(--text-main);font-family:inherit;font-size:14px;line-height:1.4;box-shadow:inset 0 1px 2px #14263e04;transition:border-color .16s,box-shadow .16s,background .16s}
 html:not(.sx-phone-webapp) :is(.sx-view,.sx-modal,.modal-card) textarea{min-height:110px;resize:vertical}
 html:not(.sx-phone-webapp) :is(.sx-view,.sx-modal,.modal-card) :is(input,select,textarea):focus-visible{outline:0;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 16%,transparent)}
 html:not(.sx-phone-webapp) :is(.sx-view,.sx-modal,.modal-card) :is(input,select,textarea):disabled{opacity:.55;cursor:not-allowed;background:var(--bg-subtle)}
 html:not(.sx-phone-webapp) .sx-parent-portal{width:100%;max-width:none;gap:22px}
 html:not(.sx-phone-webapp) .sx-parent-dashboard{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,1fr);gap:22px;align-items:start}
 html:not(.sx-phone-webapp) .sx-parent-quicklinks{padding:20px 24px;border:1px solid var(--border-subtle);background:var(--bg-card);border-radius:20px}
 html:not(.sx-phone-webapp) .sx-parent-dashboard .sx-announcement-list{display:flex;flex-direction:column;gap:18px;min-width:0}
 html:not(.sx-phone-webapp) .sx-announcement-list>article{border:1px solid var(--border-subtle);border-radius:20px;overflow:hidden;background:var(--bg-card)}
 html:not(.sx-phone-webapp) .sx-announcement-list>article>div{padding:22px}
 html:not(.sx-phone-webapp) .sx-announcement-list h3{line-height:1.35}
 html:not(.sx-phone-webapp) .sx-announcement-list p{line-height:1.65;overflow-wrap:anywhere}
 html:not(.sx-phone-webapp) .sx-parent-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(380px,100%),1fr));gap:20px}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-event{padding:22px;border:1px solid var(--border-subtle);border-radius:20px;background:var(--bg-card);min-width:0}
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-event-logo{width:52px;height:52px;object-fit:contain}
 html:not(.sx-phone-webapp) .sx-parent-context-switch{border-radius:16px;padding:16px 20px;background:var(--bg-card);border:1px solid var(--border-subtle)}
 html:not(.sx-phone-webapp) .sx-program-fixture .sx-native-weather-card,html:not(.sx-phone-webapp) .sx-program-fixture .sx-native-weather-hero{min-height:180px;height:auto}
 html:not(.sx-phone-webapp) .sx-program-fixture .sx-native-weather-hero{padding:18px}
 html:not(.sx-phone-webapp) .sx-program-fixture .sx-overview-weather-tempbox{font-size:38px}
}
@media (min-width:1280px) and (pointer:fine){
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-dem-match-view.is-grid .sx-dem-fixtures,
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-match-grid,
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-mobile-fixture-list,
 html:not(.sx-phone-webapp):not(.sx-tablet-webapp) .sx-parent-match-browser .sx-parent-list{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:18px!important}
}
/* Mobile-only exception requested by the user: the switcher only exists with >1 linked child. */
@media(max-width:1024px){
 .sx-parent-context-switch.is-child-picker{grid-template-columns:38px minmax(0,1fr)!important;align-items:center!important;padding:9px 10px!important;gap:9px!important}
 .sx-parent-context-switch.is-child-picker .sx-parent-child-dropdown{grid-column:2!important;margin:0!important;display:grid!important;grid-template-columns:1fr!important;gap:4px!important;background:transparent!important;border:0!important;padding:0!important}
 .sx-parent-context-switch.is-child-picker .sx-parent-child-dropdown>span{font-size:10px!important;font-weight:750!important;color:var(--text-muted)!important}
 .sx-parent-context-switch.is-child-picker .sx-parent-child-dropdown select{width:100%!important;height:38px!important;font-size:12px!important;border-radius:12px!important}
}

/* Child switcher is intentionally absent for single-child parents. With multiple children it is a compact picker, not a second "Ouderomgeving" card. */
.sx-parent-context-switch.is-child-picker .sx-parent-context-copy{display:none!important}
.sx-parent-context-switch.is-child-picker{grid-template-columns:auto minmax(0,1fr)!important}
.sx-parent-context-switch.is-child-picker .sx-parent-child-dropdown{grid-column:2!important;margin:0!important}