#seafix-demo .sf-settings-page .sf-profile-logout {
  display:flex; align-items:center; width:100%; min-height:76px; padding:16px 20px;
  color:var(--sf-danger); font:inherit; text-align:left; cursor:pointer;
}
#seafix-demo .sf-settings-page .sf-profile-logout .sf-settings-summary-copy {
  display:flex; align-items:center; gap:14px;
}
#seafix-demo .sf-settings-page .sf-profile-logout svg { width:16px; height:16px; }
#seafix-demo .sf-settings-page .sf-profile-logout strong,
#seafix-demo .sf-settings-page .sf-profile-logout svg { color:var(--sf-danger); }
#seafix-demo .sf-settings-page .sf-profile-logout:disabled { opacity:.6; cursor:wait; }
#seafix-demo .sf-side-menu-form { max-width:640px; }
#seafix-demo #sf-side-menu-slots { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:18px 0; }
#seafix-demo .sf-side-menu-row { display:grid; gap:6px; min-width:0; color:var(--sf-settings-muted); font-size:12px; }
#seafix-demo .sf-side-menu-row select { width:100%; min-height:44px; padding:8px 10px; border:1px solid var(--sf-settings-line); border-radius:10px; background:var(--sf-settings-paper); color:var(--sf-settings-ink); font:inherit; font-size:14px; }
#seafix-demo .sf-side-menu-form :focus-visible { outline:2px solid var(--sf-heading); outline-offset:2px; }
@media(max-width:540px){#seafix-demo #sf-side-menu-slots{grid-template-columns:minmax(0,1fr);}}
@media(max-width:999px){
  #seafix-demo .sf-account-menu-nav :is([data-go],[data-side-action]) { min-height:75px; font-size:11px; }
  #seafix-demo .sf-account-menu-nav [data-side-action]:hover { background:var(--sf-settings-selection); }
  #seafix-demo .sf-account-menu-nav .sf-side-menu-spacer { display:block; }
  #seafix-demo .sf-account-menu-nav [hidden] { display:none!important; }
}

#seafix-demo .sf-notification-page .sf-notification-inbox-heading{align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:12px;}
#seafix-demo .sf-notification-page #sf-notification-read-all{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 12px;border:1px solid color-mix(in srgb,var(--sf-heading) 27%,var(--sf-settings-line));border-radius:12px;background:color-mix(in srgb,var(--sf-heading) 8%,var(--sf-settings-paper));color:var(--sf-heading);font-weight:600;cursor:pointer;}
#seafix-demo .sf-notification-page #sf-notification-read-all[hidden]{display:none;}
#seafix-demo .sf-notification-page #sf-notification-read-all:disabled{opacity:.5;cursor:wait;}
#seafix-demo .sf-notification-page #sf-notification-read-all svg{width:16px;height:16px;}
#seafix-demo .sf-notification-inbox-list{gap:12px;}
#seafix-demo .sf-notification-inbox-item{border-color:color-mix(in srgb,var(--sf-heading) 17%,var(--sf-settings-line));box-shadow:0 5px 18px rgb(0 0 0 / .055);}
#seafix-demo .sf-notification-inbox-item.is-unread{border-color:color-mix(in srgb,var(--sf-heading) 55%,var(--sf-settings-line));background:color-mix(in srgb,var(--sf-heading) 10%,var(--sf-settings-paper));box-shadow:inset 3px 0 var(--sf-heading),0 6px 20px rgb(0 0 0 / .08);}
@media(min-width:760px) and (max-width:999px){
  #seafix-demo.sf-wide-header-glass .sf-topbar { padding-top:calc(4px + env(safe-area-inset-top,0px)); padding-bottom:8px; }
}
/* Phone and tablet account navigation follows the Settings list. */
#seafix-demo #sf-side-menu-slots { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
#seafix-demo .sf-side-menu-row { display:flex; align-items:center; gap:10px; min-height:48px; padding:8px 12px; border:1px solid var(--sf-settings-line); border-radius:12px; background:var(--sf-settings-paper); color:var(--sf-settings-ink); font-size:14px; cursor:pointer; }
#seafix-demo .sf-side-menu-row input { flex:none; accent-color:var(--sf-heading); width:18px; height:18px; }
#seafix-demo .sf-side-menu-row svg { flex:none; width:18px; height:18px; color:var(--sf-settings-muted); }
@media(max-width:540px){#seafix-demo #sf-side-menu-slots{grid-template-columns:minmax(0,1fr);}}
@media(max-width:999px){
  #seafix-demo .sf-account-menu-panel { width:min(320px,calc(100vw - 24px)); padding-inline:16px; }
  #seafix-demo .sf-account-menu-nav { display:flex; flex:1 0 auto; flex-direction:column; gap:3px; padding-bottom:12px; }
  #seafix-demo .sf-account-menu-nav :is([data-go],[data-side-action]) { flex-direction:row; justify-content:flex-start; gap:16px; min-height:52px; padding:11px 15px; border:0; border-radius:14px; background:transparent; font-size:16px; font-weight:450; text-align:left; overflow-wrap:normal; }
  #seafix-demo .sf-account-menu-nav :is([data-go],[data-side-action]) > svg { width:22px!important; height:22px!important; }
  #seafix-demo .sf-account-menu-nav :is([data-go],[data-side-action])[aria-current="page"] { background:var(--sf-settings-selection); color:var(--sf-settings-ink); font-weight:650; }
  #seafix-demo .sf-account-menu-nav [data-go="settings"] { margin-top:auto; }
  #seafix-demo .sf-account-menu-person { margin:4px 0 12px; padding:16px; border:1px solid var(--sf-settings-line); border-radius:16px; background:var(--sf-settings-paper); }
  #seafix-demo .sf-account-menu-person strong { font-size:17px; }
  #seafix-demo .sf-account-menu-person small { font-size:13px; }
  #seafix-demo #sf-account-menu-close { border:1px solid var(--sf-settings-line); border-radius:14px; background:var(--sf-settings-paper); }
}
@media(max-width:999px){
  #seafix-demo .sf-account-menu-panel { width:min(224px,calc(100vw - 24px)); padding-inline:9px; }
  #seafix-demo .sf-account-menu-nav :is([data-go],[data-side-action]) { gap:10px; min-height:48px; padding:9px 10px; font-size:13px; }
  #seafix-demo .sf-account-menu-nav :is([data-go],[data-side-action]) > svg { width:19px!important; height:19px!important; }
  #seafix-demo .sf-account-menu-person { padding:10px; }
  #seafix-demo .sf-account-menu-person strong { font-size:14px; }
  #seafix-demo .sf-account-menu-person small { font-size:11px; }
  #seafix-demo #sf-account-menu-close { width:38px; height:38px; border:0; border-radius:12px; background:var(--sf-settings-selection); color:var(--sf-settings-ink); }
}
#seafix-demo .sf-notification-inbox { margin:0 0 22px; padding:16px; border:1px solid var(--sf-settings-line); border-radius:16px; background:var(--sf-settings-paper); }
#seafix-demo .sf-notification-inbox-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
#seafix-demo .sf-notification-inbox-heading h3 { margin:0; font-size:16px; }
#seafix-demo .sf-notification-inbox-heading button { font-size:12px; text-align:right; }
#seafix-demo .sf-notification-inbox-list { display:grid; gap:8px; margin-top:12px; max-height:420px; overflow:auto; }
#seafix-demo .sf-notification-inbox-list > p { margin:0; color:var(--sf-settings-muted); font-size:13px; }
#seafix-demo .sf-notification-inbox-item { display:grid; gap:4px; width:100%; padding:12px; border:1px solid var(--sf-settings-line); border-radius:12px; background:var(--sf-settings-paper); color:var(--sf-settings-ink); font:inherit; text-align:left; cursor:pointer; }
#seafix-demo .sf-notification-inbox-item.is-unread { background:var(--sf-settings-selection); border-color:var(--sf-heading); }
#seafix-demo .sf-notification-inbox-item strong { font-size:14px; }
#seafix-demo .sf-notification-inbox-item span,#seafix-demo .sf-notification-inbox-item small { font-size:12px; line-height:1.4; }
#seafix-demo .sf-notification-inbox-item small { color:var(--sf-settings-muted); }
@media(max-width:999px){
  #seafix-demo .sf-account-menu-panel { width:min(var(--sf-side-panel-width,224px),calc(100vw - 24px)); }
  #seafix-demo .sf-account-menu-nav :is([data-go],[data-side-action]) { font-size:14px; white-space:nowrap; }
  #seafix-demo .sf-account-menu-nav :is([data-go],[data-side-action]) > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #seafix-demo .sf-account-menu-person { margin:0 0 9px; padding:8px 10px 13px; border:0; border-bottom:1px solid var(--sf-settings-line); border-radius:0; background:transparent; }
  #seafix-demo .sf-account-menu-person strong { font-size:14px; }
  #seafix-demo .sf-account-menu-person small { font-size:11px; }
}
@media(max-width:999px){
 #seafix-demo .sf-account-menu-person{position:relative;min-height:113px;overflow:hidden;padding:14px 10px 16px;isolation:isolate;}
 #seafix-demo .sf-account-menu-person>div{position:relative;z-index:1;max-width:100%;}
 #seafix-demo #sf-menu-name span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
 #seafix-demo .sf-menu-department-icon{position:absolute;right:8px;top:7px;width:98px;height:98px;display:block;opacity:.16;transform:rotate(-11deg);pointer-events:none;}
 #seafix-demo .sf-menu-department-icon[data-department="hotel"]{transform:none;}
 #seafix-demo .sf-menu-department-icon svg{display:block;width:100%;height:100%;}
 #seafix-demo .sf-side-menu-row{display:flex;justify-content:space-between;gap:7px;}
 #seafix-demo .sf-side-menu-choice{display:flex;align-items:center;gap:9px;min-width:0;flex:1;cursor:pointer;}
 #seafix-demo .sf-side-menu-choice span{min-width:0;overflow-wrap:anywhere;}
 #seafix-demo .sf-side-menu-order{display:flex;flex:none;gap:3px;}
 #seafix-demo .sf-side-menu-order button{width:38px;min-height:38px;border:1px solid var(--sf-settings-line);border-radius:9px;background:var(--sf-settings-paper);color:var(--sf-settings-ink);font:inherit;cursor:pointer;}
 #seafix-demo .sf-side-menu-order button:disabled{opacity:.35;cursor:default;}
}
@media(max-width:999px){
 #seafix-demo .sf-notification-page{width:min(100%,740px);margin:0 auto;padding:16px 14px 28px;box-sizing:border-box;}
 #seafix-demo .sf-notification-page .sf-screen-title{margin-bottom:12px;}
 #seafix-demo .sf-notification-inbox{margin:0;padding:0;border:0;background:transparent;}
 #seafix-demo .sf-notification-inbox-heading{align-items:flex-start;padding:0 2px 8px;}
 #seafix-demo .sf-notification-inbox-heading h3{font-size:13px;color:var(--sf-settings-muted);font-weight:550;}
 #seafix-demo .sf-notification-inbox-list{max-height:none;gap:9px;margin-top:7px;overflow:visible;}
 #seafix-demo .sf-notification-inbox-item{display:grid;grid-template-columns:38px minmax(0,1fr);align-items:start;gap:12px;padding:15px;border:1px solid var(--sf-settings-line);border-radius:15px;background:var(--sf-settings-paper);box-shadow:0 2px 10px rgb(0 0 0 / .035);}
 #seafix-demo .sf-notification-inbox-item.is-unread{border-color:color-mix(in srgb,var(--sf-heading) 28%,var(--sf-settings-line));background:var(--sf-settings-selection);}
 #seafix-demo .sf-notification-inbox-item>svg{box-sizing:border-box;width:36px!important;height:36px!important;padding:9px;border-radius:11px;background:color-mix(in srgb,var(--sf-heading) 9%,var(--sf-settings-paper));color:var(--sf-heading);}
 #seafix-demo .sf-notification-inbox-copy{display:grid;gap:4px;min-width:0;}
 #seafix-demo .sf-notification-inbox-copy strong{font-size:14px;font-weight:600;}
 #seafix-demo .sf-notification-inbox-copy span{font-size:13px;line-height:1.4;overflow-wrap:anywhere;}
 #seafix-demo .sf-notification-inbox-copy small{margin-top:3px;font-size:11px;}
}
@media(max-width:999px){
 #seafix-demo #sf-description{box-sizing:border-box;min-height:48px;max-height:160px;resize:none;overflow-y:auto;padding-block:12px;}
}

#seafix-demo #sf-side-menu-message:not([hidden]){
 display:flex;align-items:center;gap:10px;margin:14px 0 0;padding:13px 15px;
 border:1px solid color-mix(in srgb,var(--sf-heading) 24%,var(--sf-settings-line));border-radius:12px;
 background:var(--sf-settings-selection);color:var(--sf-settings-ink);font-size:13px;font-weight:600;line-height:1.45;
}
#seafix-demo #sf-side-menu-message:not([hidden])::before{content:"✓";display:grid;place-items:center;flex:none;width:25px;height:25px;border-radius:50%;background:var(--sf-heading);color:var(--sf-canvas);font-size:15px;}
#seafix-demo #sf-side-menu-message.is-error:not([hidden]){border-color:var(--sf-danger);background:color-mix(in srgb,var(--sf-danger) 10%,var(--sf-settings-paper));color:var(--sf-danger);}
#seafix-demo #sf-side-menu-message.is-error:not([hidden])::before{content:"!";background:var(--sf-danger);color:#fff;}

#seafix-demo .sf-side-menu-form{max-width:940px;}
#seafix-demo .sf-side-menu-builder{display:grid;grid-template-columns:minmax(190px,.78fr) minmax(0,1.22fr);gap:18px;align-items:start;margin:18px 0;}
#seafix-demo .sf-side-menu-preview-shell{padding:16px;border:1px solid var(--sf-settings-line);border-radius:18px;background:var(--sf-settings-paper);box-shadow:0 8px 26px rgb(0 0 0 / .045);}
#seafix-demo .sf-side-menu-preview-shell>strong{display:block;margin:0 0 13px;font-size:13px;font-weight:600;}
#seafix-demo #sf-side-menu-preview{display:grid;gap:3px;padding:12px 9px;border-radius:15px;background:var(--sf-settings-ground);}
#seafix-demo .sf-side-menu-preview-row{display:flex;align-items:center;gap:10px;min-height:36px;padding:6px 9px;border-radius:9px;font-size:12px;line-height:1.3;}
#seafix-demo .sf-side-menu-preview-row svg{width:16px!important;height:16px!important;flex:none;color:var(--sf-settings-muted);}
#seafix-demo .sf-side-menu-preview-row.is-fixed{font-weight:600;}
#seafix-demo .sf-side-menu-preview-row:last-child{margin-top:9px;border-top:1px solid var(--sf-settings-line);border-radius:0;padding-top:12px;}
#seafix-demo .sf-side-menu-editor{padding:16px;border:1px solid var(--sf-settings-line);border-radius:18px;background:var(--sf-settings-paper);}
#seafix-demo .sf-side-menu-editor h3{margin:0 0 5px;font-size:16px;}
#seafix-demo .sf-side-menu-editor>p{margin:0;color:var(--sf-settings-muted);font-size:12px;line-height:1.5;}
#seafix-demo #sf-side-menu-slots{display:block;margin:14px 0 0;}
#seafix-demo .sf-side-menu-selected{display:grid;gap:7px;}
#seafix-demo .sf-side-menu-selected .sf-side-menu-row{display:flex;align-items:center;gap:10px;min-height:46px;padding:4px 8px;border:1px solid var(--sf-settings-line);border-radius:11px;background:var(--sf-settings-ground);font-size:13px;cursor:default;}
#seafix-demo .sf-side-menu-selected .sf-side-menu-row.is-dragging{border-color:var(--sf-heading);box-shadow:0 5px 15px rgb(0 0 0 / .13);}
#seafix-demo .sf-side-menu-grip{display:grid;place-items:center;flex:none;width:38px;height:38px;padding:0;border:0;background:transparent;color:var(--sf-settings-muted);font-size:22px;cursor:grab;touch-action:none;user-select:none;}
#seafix-demo .sf-side-menu-grip:active{cursor:grabbing;}
#seafix-demo .sf-side-menu-selected .sf-side-menu-row svg{width:18px;height:18px;flex:none;}
#seafix-demo .sf-side-menu-name{flex:1;min-width:0;}
#seafix-demo [data-side-remove]{width:34px;height:34px;border:0;border-radius:8px;background:transparent;color:var(--sf-settings-muted);font-size:21px;cursor:pointer;}
#seafix-demo .sf-side-menu-available{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:17px;padding-top:14px;border-top:1px solid var(--sf-settings-line);}
#seafix-demo .sf-side-menu-available h4{grid-column:1/-1;margin:0 0 2px;font-size:12px;font-weight:600;}
#seafix-demo .sf-side-menu-available-choice{display:flex;align-items:center;gap:7px;min-height:39px;padding:6px 9px;border-radius:9px;background:var(--sf-settings-ground);font-size:11px;cursor:pointer;}
#seafix-demo .sf-side-menu-available-choice input{width:16px;height:16px;flex:none;accent-color:var(--sf-heading);}
#seafix-demo .sf-side-menu-available-choice svg{width:15px;height:15px;flex:none;}
@media(max-width:650px){#seafix-demo .sf-side-menu-builder{grid-template-columns:1fr;}#seafix-demo .sf-side-menu-preview-shell{max-width:330px;}}

/* Keep the inbox hierarchy after the compact menu styles above. */
#seafix-demo .sf-notification-page .sf-notification-inbox-list{gap:12px;}
#seafix-demo .sf-notification-page .sf-notification-inbox-item{border-color:color-mix(in srgb,var(--sf-heading) 17%,var(--sf-settings-line));box-shadow:0 5px 18px rgb(0 0 0 / .055);}
#seafix-demo .sf-notification-page .sf-notification-inbox-item.is-unread{border-color:color-mix(in srgb,var(--sf-heading) 55%,var(--sf-settings-line));background:color-mix(in srgb,var(--sf-heading) 10%,var(--sf-settings-paper));box-shadow:inset 3px 0 var(--sf-heading),0 6px 20px rgb(0 0 0 / .08);}

/* Arrange shortcuts within each category; Settings remains available below. */
#seafix-demo #sf-side-menu-slots > h4 { margin:18px 0 8px; font-size:12px; letter-spacing:.8px; text-transform:uppercase; }
#seafix-demo #sf-side-menu-slots > h4:first-child { margin-top:0; }
#seafix-demo #sf-side-menu-slots [data-side-move] { display:grid; place-items:center; flex:none; width:40px; height:40px; padding:0; border:0; border-radius:8px; background:transparent; color:var(--sf-settings-ink); cursor:pointer; }
#seafix-demo #sf-side-menu-slots [data-side-move]:disabled { opacity:.3; cursor:default; }
#seafix-demo #sf-side-menu-preview { gap:12px; background:var(--sf-menu-paper); color:light-dark(#262626,#ededed); }
#seafix-demo #sf-side-menu-preview .sf-side-menu-group { display:grid; gap:2px; }
#seafix-demo #sf-side-menu-preview .sf-side-menu-group-title { margin:0 0 3px; padding:0 8px; font-size:10px; font-weight:600; letter-spacing:1px; text-transform:uppercase; color:light-dark(#626262,#b7b7b7); }
#seafix-demo #sf-side-menu-preview button { display:flex; align-items:center; gap:10px; width:100%; min-height:36px; padding:8px; border:0; border-radius:8px; background:transparent; color:inherit; font:inherit; font-size:12px; text-align:left; opacity:1; }
#seafix-demo #sf-side-menu-preview button[hidden] { display:none; }
#seafix-demo #sf-side-menu-preview svg { flex:none; width:16px!important; height:16px!important; }
#seafix-demo #sf-side-menu-preview .sf-side-menu-bottom { padding-top:9px; border-top:1px solid light-dark(#d0d0d0,#454545); }

/* Personal menu: optional shortcuts, an accessible catalogue and live preview. */
#seafix-demo .sf-side-menu-catalog{margin:12px 0 22px;border:1px solid var(--sf-settings-line);border-radius:12px;background:var(--sf-settings-paper);overflow:hidden;}
#seafix-demo .sf-side-menu-catalog summary{padding:14px 12px;color:var(--sf-heading);font-size:12px;font-weight:650;cursor:pointer;}
#seafix-demo .sf-side-menu-catalog-options{display:grid;gap:5px;padding:0 8px 8px;}
#seafix-demo .sf-side-menu-catalog-options button{min-height:44px;padding:10px 12px;border:0;border-radius:8px;background:var(--sf-settings-ground);color:var(--sf-settings-ink);font:inherit;font-size:12px;text-align:left;cursor:pointer;}
#seafix-demo .sf-side-menu-catalog-options button:hover{background:color-mix(in srgb,var(--sf-heading) 12%,var(--sf-settings-ground));}
#seafix-demo #sf-side-menu-slots [data-side-remove]{display:grid;place-items:center;flex:none;width:40px;height:40px;font-size:24px;}
#seafix-demo #sf-side-menu-slots [data-side-remove]:hover{background:color-mix(in srgb,#ba4545 12%,transparent);color:#ba4545;}
#seafix-demo .sf-side-menu-fixed{flex:none;width:40px;}
#seafix-demo .sf-side-menu-catalog summary:focus-visible,#seafix-demo #sf-side-menu-slots button:focus-visible{outline:2px solid var(--sf-heading);outline-offset:-2px;}
@media(max-width:650px){
  #seafix-demo .sf-side-menu-editor{order:0;padding:12px;}
  #seafix-demo .sf-side-menu-preview-shell{order:1;max-width:none;}
  #seafix-demo .sf-side-menu-selected .sf-side-menu-row{gap:2px;padding:4px;font-size:12px;}
  #seafix-demo .sf-side-menu-grip{width:24px;min-width:24px;}
  #seafix-demo #sf-side-menu-slots [data-side-move],#seafix-demo #sf-side-menu-slots [data-side-remove],#seafix-demo .sf-side-menu-fixed{width:32px;min-width:32px;}
  #seafix-demo .sf-side-menu-name{overflow-wrap:anywhere;}
}




/* Office vessel navigation uses the same rows as every other menu group. */
#seafix-demo #sf-account-menu-panel .fv-office-links{gap:3px}