/* Hollandboot: existing theme primary #02bcaf, Work Sans and dark #212529. */
body.hb-portal-body { background: #f3f6f6; }
#hb-portal { --hb-accent: #02bcaf; --hb-ink: #212529; --hb-link: #08736d; --hb-border: #dce4e4; --hb-muted: #59686b; --hb-surface: #fff; color: var(--hb-ink); font: 16px/1.6 "Work Sans",system-ui,sans-serif; min-height: 100vh; }
#hb-portal *,#hb-portal *::before,#hb-portal *::after { box-sizing: border-box; }
#hb-portal h1,#hb-portal h2,#hb-portal h3,#hb-portal h4 { font-family: inherit; color: var(--hb-ink); font-weight: 650; letter-spacing: -.025em; text-transform: none; line-height: 1.2; }
#hb-portal h1 { font-size: clamp(30px,3.5vw,44px); margin: 8px 0 18px; }
#hb-portal h2 { font-size: 23px; margin: 0 0 14px; }
#hb-portal p { margin: 0 0 16px; color: var(--hb-muted); opacity: 1; }
#hb-portal a { color: var(--hb-link); text-underline-offset: 4px; }
#hb-portal .hb-site-header { background: #fff; border-bottom: 1px solid var(--hb-border); min-height: 90px; padding: 20px max(24px,calc((100% - 1200px)/2)); display: flex; align-items: center; justify-content: space-between; gap: 24px; }
#hb-portal .hb-logo { display: inline-flex; flex-shrink: 0; font-size: 24px; font-weight: 700; }
#hb-portal .hb-logo img { width: 184px; height: auto; max-height: 68px; object-fit: contain; }
#hb-portal nav { display: flex; flex-wrap: wrap; gap: 12px 26px; }
#hb-portal nav a { font-size: 14px; font-weight: 600; text-decoration: none; padding: 6px 0; }
#hb-main { width: min(1200px,calc(100% - 48px)); margin: 42px auto 64px; display: grid; gap: 24px; }
#hb-portal .hb-footer { border-top: 1px solid var(--hb-border); display: flex; flex-wrap: wrap; gap: 16px 26px; padding: 24px max(24px,calc((100% - 1200px)/2)); font-size: 13px; color: var(--hb-muted); }
#hb-portal .hb-footer span { flex: 1; }
#hb-portal .hb-card { min-width: 0; padding: 32px; border-radius: 16px; background: var(--hb-surface); border: 1px solid var(--hb-border); box-shadow: 0 4px 24px rgb(33 37 41 / 3%); }
#hb-portal .hb-login { max-width: 580px; width: 100%; margin: 12px auto; padding: 40px; }
#hb-portal .hb-eyebrow { display: inline-block; color: var(--hb-link); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 6px; }
#hb-portal .hb-muted { color: var(--hb-muted); font-size: 14px; }
#hb-portal .hb-notice { background: #edf8f7; border: 1px solid #c0e5e2; border-left: 3px solid var(--hb-accent); border-radius: 8px; padding: 14px 18px; margin-bottom: 20px; color: var(--hb-ink); }
#hb-portal .hb-login form,#hb-portal .hb-photo-upload form { display: grid; gap: 18px; }
#hb-portal label { display: grid; gap: 7px; min-width: 0; margin: 0; font-size: 14px; font-weight: 600; color: var(--hb-ink); }
#hb-portal input:not([type=hidden]):not([type=checkbox]),#hb-portal select,#hb-portal textarea { box-sizing: border-box; display: block; width: 100%; min-width: 0; max-width: 100%; height: 48px; margin: 0; padding: 10px 13px; border: 1px solid #c7d2d3; border-radius: 8px; background: #fff; color: var(--hb-ink); font-family: inherit; font-size: 16px; line-height: 1.4; font-weight: 400; box-shadow: none; }
#hb-portal input[type=file] { height: auto !important; font-size: 12px !important; }
#hb-portal input[type=file]::file-selector-button { border: 0; background: #eef3f3; color: var(--hb-ink); border-radius: 4px; padding: 8px; margin-right: 6px; cursor: pointer; }
#hb-portal textarea { height: auto; min-height: 112px; resize: vertical; }
#hb-portal :is(input,select,textarea,button,a,summary):focus-visible { outline: 3px solid var(--hb-link); outline-offset: 3px; }
#hb-portal .hb-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: auto; min-height: 46px; margin: 0; padding: 11px 19px; border: 1px solid transparent; border-radius: 8px; box-shadow: none; background: var(--hb-accent); color: var(--hb-ink); font: inherit; font-size: 14px; line-height: 1.4; font-weight: 650; text-transform: none; text-decoration: none; letter-spacing: 0; cursor: pointer; transition: filter .15s; }
#hb-portal .hb-button::before,#hb-portal .hb-button::after { content: none; }
#hb-portal .hb-button:hover { filter: brightness(.95); }
#hb-portal .hb-secondary { background: #fff; border-color: var(--hb-border); color: var(--hb-link); }
#hb-portal .hb-help { margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--hb-border); font-size: 14px; }
#hb-portal summary { cursor: pointer; color: var(--hb-link); font-weight: 600; padding: 8px 0; }
#hb-portal details[open] summary { margin-bottom: 14px; }
#hb-portal .hb-search { display: grid; grid-template-columns: minmax(170px,1fr) minmax(240px,3fr) auto; align-items: end; gap: 18px; }
#hb-portal .hb-section-title { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
#hb-portal .hb-section-title h2,#hb-portal .hb-section-title p { margin-bottom: 0; }
#hb-portal .hb-badge { display: inline-flex; white-space: nowrap; background: #f0f4f4; color: #526164; border-radius: 6px; padding: 5px 10px; font-size: 12px; font-weight: 600; }
#hb-portal .hb-badge.is-green { background: #e4f4eb; color: #266242; }
#hb-portal .hb-booking { display: grid; grid-template-columns: 64px 1fr auto auto; gap: 22px; align-items: center; padding: 20px 0; border-top: 1px solid var(--hb-border); }
#hb-portal .hb-booking time { font-size: 22px; font-weight: 650; font-variant-numeric: tabular-nums; }
#hb-portal .hb-booking strong,#hb-portal .hb-booking span:not(.hb-badge) { display: block; }
#hb-portal .hb-booking div span { color: var(--hb-muted); font-size: 14px; }
#hb-portal .hb-boat-search { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
#hb-portal .hb-boat-result { display: flex; flex-direction: column; gap: 6px; padding: 22px; background: #f7faf9; border: 1px solid var(--hb-border); border-radius: 10px; text-decoration: none; }
#hb-portal .hb-boat-result strong { font-size: 18px; color: var(--hb-ink); }
#hb-portal .hb-boat-result span,#hb-portal .hb-boat-result small { color: var(--hb-muted); }
#hb-portal .hb-boat-result b { margin-top: 10px; font-size: 13px; }
#hb-portal .hb-toolbar { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 16px; }
#hb-portal .hb-toolbar form { display: flex; align-items: end; gap: 12px; }
#hb-portal .hb-toolbar label { font-size: 12px; }
#hb-portal .hb-facts { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 24px; padding: 24px; background: #f5f8f8; border-radius: 10px; margin: 22px 0; }
#hb-portal .hb-facts dt { color: var(--hb-muted); font-size: 12px; font-weight: 500; margin-bottom: 4px; }
#hb-portal .hb-facts > div { display: block; min-width: 0; }
#hb-portal .hb-facts dt,#hb-portal .hb-facts dd { display: block; float: none; width: auto; text-align: left; }
#hb-portal .hb-facts dd { color: var(--hb-ink); margin: 0; font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
#hb-portal .hb-slip-form fieldset { padding: 28px 0; margin: 0; border: 0; border-top: 1px solid var(--hb-border); }
#hb-portal .hb-slip-form legend { float: none; width: auto; font-size: 18px; font-weight: 650; padding: 0 12px 0 0; margin: 0 0 20px; }
#hb-portal .hb-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px 28px; }
#hb-portal .hb-signature { margin-top: 24px; }
#hb-portal .hb-signature canvas { display: block; width: 100%; max-width: 800px; height: auto; aspect-ratio: 40 / 9; background: #fcfdfd; border: 1px dashed #9badae; border-radius: 10px; touch-action: none; margin: 8px 0; }
#hb-portal .hb-signature small { display: block; max-width: 700px; color: var(--hb-muted); }
#hb-portal .hb-text-button { border: 0; background: none; color: var(--hb-link); padding: 6px 0; font: inherit; font-size: 13px; text-decoration: underline; cursor: pointer; }
#hb-portal .hb-signed { width: 100%; max-width: 600px; height: 135px; border-bottom: 1px solid var(--hb-border); }
#hb-portal .hb-print-signature { display: none; }
#hb-portal .hb-skip { position: absolute; left: -9999px; }
#hb-portal .hb-skip:focus { left: 10px; top: 10px; z-index: 100000; padding: 12px; background: #fff; }
/* Same portal logic and controls, styled in Hollandboot's existing brand. */
#hb-portal .srn-cp-front { --srn-front-accent: var(--hb-link); --srn-front-accent-dark: #075c57; --srn-front-border: var(--hb-border); --srn-front-text: var(--hb-ink); --srn-front-muted: var(--hb-muted); margin: 0; font-family: inherit; }
#hb-portal .srn-cp-front-hero { background: #fff; border-radius: 16px; }
#hb-portal .srn-cp-front-hero h1 { font-size: clamp(24px,2.2vw,32px); margin: 0 0 12px; }
#hb-portal .srn-cp-front-panel { border-radius: 16px; }
#hb-portal .srn-cp-front-contact { background: #f2f8f7; border-color: var(--hb-border); }
#hb-portal .srn-cp-front-grid { grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); }
#hb-portal .srn-cp-boat-card { grid-template-columns: 120px minmax(0,1fr); }
#hb-portal .srn-cp-boat-card dl { grid-column: 1 / -1; }
#hb-portal .srn-cp-boat-card .hb-photo-upload { grid-column: 1 / -1; border-top: 1px solid var(--hb-border); padding-top: 6px; font-size: 13px; }
#hb-portal .srn-cp-boat-card .hb-photo-upload small { color: var(--hb-muted); font-size: 12px; }
#hb-portal .srn-cp-boat-media { background: #eef5f4; min-height: 94px; }
#hb-portal .srn-cp-boat-media::before { background: #71aaa5; }
#hb-portal .srn-cp-boat-media::after { border-color: #71aaa5; }
#hb-portal .srn-cp-boat-media:has(img)::before,#hb-portal .srn-cp-boat-media:has(img)::after { content: none; }
#hb-portal .srn-cp-front-head { gap: 14px; margin-bottom: 22px; }
#hb-portal .srn-cp-front-head h3 { font-size: 21px; font-weight: 600; }
#hb-portal .srn-cp-front-head > span { padding: 5px 9px; background: #eff7f6; border-color: var(--hb-border); color: var(--hb-muted); font-size: 12px; font-weight: 500; letter-spacing: 0; }
#hb-portal .srn-cp-front-contact strong { font-weight: 500; }
#hb-portal .srn-cp-boat-card { padding: 18px; gap: 18px; align-items: center; box-shadow: none; }
#hb-portal .srn-cp-boat-card h4 { font-size: 18px; font-weight: 600; margin: 0 0 6px; line-height: 1.35; }
#hb-portal .srn-cp-boat-card p { font-size: 13px; line-height: 1.5; margin: 0; }
#hb-portal .srn-cp-boat-card dl { padding: 14px 0 0; margin: 0; border-top: 1px solid var(--hb-border); gap: 14px; }
#hb-portal .srn-cp-boat-card dl dt,#hb-portal .srn-cp-boat-card dl dd { float: none; display: block; width: auto; text-align: left; margin: 0; padding: 0; letter-spacing: 0; }
#hb-portal .srn-cp-boat-card dl dt { font-size: 11px; font-weight: 400; text-transform: none; margin-bottom: 4px; }
#hb-portal .srn-cp-boat-card dl dd { font-size: 13px; font-weight: 500; white-space: nowrap; line-height: 1.5; }
#hb-portal .srn-cp-boat-media span { font-size: 9px; font-weight: 500; letter-spacing: .02em; }
#hb-portal .srn-cp-front-muted { font-size: 13px; line-height: 1.7; }
#hb-portal .srn-cp-kran-form { gap: 18px; margin-top: 24px; }
#hb-portal .srn-cp-kran-form > label,#hb-portal .srn-cp-form-row label { font-weight: 500; }
#hb-portal .srn-cp-kran-form > button { font-family: inherit; font-size: 14px; font-weight: 500; border-radius: 8px; letter-spacing: 0; }
#hb-portal .srn-cp-slot-state { font-size: 12px; line-height: 1.6; margin: -6px 0 0; }
/* Use real checkboxes; portal.js removes the theme's red iCheck replacement. */
#hb-portal .srn-cp-policy-check,#hb-portal .srn-cp-cancel-consent { display: grid; grid-template-columns: 18px minmax(0,1fr); gap: 12px; align-items: start; padding: 14px; background: #f2f8f7; border: 1px solid var(--hb-border); border-radius: 8px; }
#hb-portal .srn-cp-policy-check > span,#hb-portal .srn-cp-cancel-consent > span { margin: 0; padding: 0; color: var(--hb-muted); font-size: 13px; font-weight: 400; line-height: 1.65; }
#hb-portal input[type=checkbox] { appearance: auto !important; -webkit-appearance: checkbox !important; accent-color: var(--hb-link); position: static !important; display: block !important; width: 18px !important; height: 18px !important; min-width: 18px !important; min-height: 18px !important; margin: 2px 0 0 !important; padding: 0 !important; opacity: 1 !important; transform: none !important; box-shadow: none !important; cursor: pointer; }
#hb-portal input[type=checkbox]::before,#hb-portal input[type=checkbox]::after { content: none !important; display: none !important; }
#hb-portal .srn-cp-front-bookings { gap: 0; }
#hb-portal .srn-cp-front-bookings .srn-cp-booking-row { grid-template-columns: minmax(0,1fr) minmax(130px,.5fr) minmax(180px,.65fr); gap: 24px; padding: 22px 0; align-items: start; }
#hb-portal .srn-cp-booking-boat strong { color: var(--hb-ink); font-size: 15px; line-height: 1.5; font-weight: 500; }
#hb-portal .srn-cp-booking-boat > span,#hb-portal .srn-cp-booking-date > span { font-size: 13px; font-weight: 400; }
#hb-portal .srn-cp-booking-date time { font-size: 15px; font-weight: 500; font-variant-numeric: tabular-nums; line-height: 1.5; }
#hb-portal .srn-cp-booking-state { gap: 8px; }
#hb-portal .srn-cp-booking-status { display: inline-flex; align-items: center; width: auto; max-width: 100%; padding: 5px 10px; border: 1px solid var(--hb-border); border-radius: 6px; background: #f0f4f4; color: var(--hb-muted); font-size: 13px; font-style: normal; font-weight: 500; line-height: 1.4; letter-spacing: 0; white-space: nowrap; }
#hb-portal .srn-cp-booking-status.is-srn_confirmed { color: #266242; background: #e4f4eb; border-color: #cde5d7; }
#hb-portal .srn-cp-booking-status.is-srn_requested { color: var(--hb-link); background: #eff7f6; }
#hb-portal .srn-cp-front-bookings button.srn-cp-cancel-button { font-size: 12px !important; font-weight: 400 !important; line-height: 1.6 !important; text-underline-offset: 3px; }
#hb-portal .srn-cp-front-bookings .srn-cp-cancel-actions button { font-weight: 500 !important; border-radius: 8px !important; }
#hb-portal .srn-cp-cancel-eyebrow,#hb-portal .srn-cp-charge-state strong { font-weight: 500; }
#hb-portal .srn-cp-cancel-card { border-color: var(--hb-border); border-radius: 16px; }
#hb-portal .srn-cp-cancel-card h4 { font-size: 23px; font-weight: 600; }
#hb-portal .srn-cp-cancel-card p { font-size: 14px; line-height: 1.65; }
#hb-portal .srn-cp-cancel-card p strong { font-weight: 500; }
@media(max-width:900px) {
 #hb-portal .srn-cp-front-grid { grid-template-columns: 1fr; }
 #hb-portal .hb-facts { grid-template-columns: repeat(2,minmax(0,1fr)); }
 #hb-portal .hb-boat-search { grid-template-columns: repeat(2,minmax(0,1fr)); }
 #hb-portal .hb-booking { grid-template-columns: 58px 1fr auto; }
 #hb-portal .hb-booking .hb-button { grid-column: 2 / -1; justify-self: start; }
}
@media(max-width:600px) {
 #hb-main { width: calc(100% - 28px); margin: 24px auto 36px; }
 #hb-portal .hb-site-header { padding: 16px; flex-wrap: wrap; gap: 12px; }
 #hb-portal .hb-logo img { width: 152px; }
 #hb-portal nav { gap: 8px 18px; }
 #hb-portal nav a { font-size: 12px; }
 #hb-portal .hb-card,#hb-portal .hb-login { padding: 22px 18px; }
 #hb-portal .hb-search,#hb-portal .hb-form-grid,#hb-portal .hb-boat-search { grid-template-columns: 1fr; }
 #hb-portal .hb-facts { padding: 16px; gap: 16px; }
 #hb-portal .hb-section-title { align-items: start; flex-wrap: wrap; gap: 12px; }
 #hb-portal .hb-booking { gap: 12px; grid-template-columns: 58px 1fr; }
 #hb-portal .hb-booking .hb-badge { grid-column: 2; justify-self: start; }
 #hb-portal .hb-footer { padding: 22px 16px; }
 #hb-portal .hb-footer span { flex-basis: 100%; }
 #hb-portal .srn-cp-boat-card { grid-template-columns: 94px minmax(0,1fr); }
 #hb-portal .srn-cp-boat-card dl { grid-template-columns: repeat(2,minmax(0,1fr)); }
 #hb-portal .srn-cp-front-panel,#hb-portal .srn-cp-front-hero { padding: 22px 18px; }
 #hb-portal .srn-cp-front-head { display: flex; flex-wrap: wrap; align-items: center; }
 #hb-portal .srn-cp-front-head h3 { font-size: 19px; }
 #hb-portal .srn-cp-front-bookings .srn-cp-booking-row { grid-template-columns: minmax(0,1fr) auto; gap: 12px 16px; padding: 20px 0; }
 #hb-portal .srn-cp-booking-date { text-align: right; }
 #hb-portal .srn-cp-booking-state { grid-column: 1 / -1; }
 #hb-portal .srn-cp-policy-check,#hb-portal .srn-cp-cancel-consent { padding: 12px; gap: 10px; }
}
/* Staff tools are scoped to the portal, so the public theme cannot stretch their controls. */
#hb-portal .hb-archive-fields { border: 0; padding: 0; margin: 0; }
#hb-portal .hb-archive .hb-signature { display: none; }
#hb-portal .hb-operation-list { display: grid; }
#hb-portal .hb-operation-row { display: grid; grid-template-columns: minmax(0,1fr) auto 16px; align-items: center; gap: 20px; padding: 20px 0; border-bottom: 1px solid var(--hb-border); text-decoration: none; color: var(--hb-ink); }
#hb-portal .hb-operation-row strong { display: block; font-size: 15px; font-weight: 500; }
#hb-portal .hb-operation-row div > span { display: block; font-size: 12px; color: var(--hb-muted); margin-top: 6px; }
#hb-portal .hb-boat-editor { border: 1px solid var(--hb-border); border-radius: 10px; margin: 22px 0; overflow: hidden; }
#hb-portal .hb-boat-editor > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; list-style: none; padding: 16px 20px; color: var(--hb-link); font-weight: 500; cursor: pointer; }
#hb-portal .hb-boat-editor > summary::-webkit-details-marker { display: none; }
#hb-portal .hb-boat-editor[open] > summary { border-bottom: 1px solid var(--hb-border); }
#hb-portal .hb-editor-body { padding: 22px; }
#hb-portal .hb-editor-body h2,#hb-portal .hb-documentation h2 { font-size: 22px; margin: 0 0 8px; }
#hb-portal .hb-field-wide { grid-column: 1 / -1; }
#hb-portal .hb-editor-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; margin-top: 20px; }
#hb-portal .hb-editor-actions button { flex: 0 0 auto; }
#hb-portal .hb-editor-actions [role=status] { flex: 1 1 240px; font-size: 13px; line-height: 1.5; }
#hb-portal .hb-master-photo { display: grid; grid-template-columns: minmax(0,1fr); align-items: start; gap: 16px; padding: 22px 0 0; margin-top: 22px; border-top: 1px solid var(--hb-border); }
#hb-portal .hb-master-photo:has(> img) { grid-template-columns: 140px minmax(0,1fr); }
#hb-portal .hb-master-photo > img { width: 140px; height: 105px; object-fit: cover; border-radius: 8px; }
#hb-portal .hb-master-photo .hb-photo-upload summary { padding-top: 0; }
#hb-portal .hb-master-photo button { justify-self: start; }
#hb-portal .hb-boat-history { margin: 16px 0; padding-left: 22px; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
#hb-portal .hb-boat-history > li { margin-bottom: 16px; }
#hb-portal .hb-document-upload { border: 1px solid var(--hb-border); border-radius: 10px; margin: 22px 0; padding: 0 20px; }
#hb-portal .hb-document-upload summary { padding: 16px 0; color: var(--hb-link); cursor: pointer; font-weight: 500; }
#hb-portal .hb-document-upload form { padding: 8px 0 20px; }
#hb-portal .hb-document-upload .hb-muted { font-size: 12px; margin: 8px 0 18px; }
#hb-portal input[type=file] { width: 100%; height: auto; min-height: 48px; font-size: 13px; white-space: normal; }
#hb-portal .hb-document-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
#hb-portal .hb-document { border: 1px solid var(--hb-border); border-radius: 10px; overflow: hidden; min-width: 0; }
#hb-portal .hb-document-preview { aspect-ratio: 4 / 3; background: var(--hb-ink); }
#hb-portal .hb-document-preview a { display: block; width: 100%; height: 100%; }
#hb-portal .hb-document-preview img,#hb-portal .hb-document-preview video { display: block; width: 100%; height: 100%; object-fit: contain; }
#hb-portal .hb-document-copy { padding: 16px; overflow-wrap: anywhere; }
#hb-portal .hb-document-copy p { font-size: 14px; line-height: 1.6; margin: 0 0 10px; white-space: normal; }
#hb-portal .hb-document-copy small { color: var(--hb-muted); font-size: 11px; display: block; }
#hb-portal .hb-document-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }
#hb-portal .hb-document-actions a,#hb-portal .hb-document-actions button { font-size: 12px; font-weight: 400; padding: 0; }
#hb-portal .hb-document-empty { border-top: 1px solid var(--hb-border); padding-top: 20px; font-size: 14px; }
@media(max-width:900px) { #hb-portal .hb-document-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) {
 #hb-portal .hb-operation-row { grid-template-columns: minmax(0,1fr) 16px; gap: 12px; }
 #hb-portal .hb-operation-row .hb-badge { grid-row: 2; justify-self: start; }
 #hb-portal .hb-editor-body { padding: 18px 14px; }
 #hb-portal .hb-master-photo:has(> img),#hb-portal .hb-document-grid { grid-template-columns: 1fr; }
 #hb-portal .hb-document-upload { padding: 0 14px; }
 #hb-portal .hb-editor-actions { align-items: stretch; }
 #hb-portal .hb-editor-actions button { width: 100%; }
}
/* Consistent screen spacing and alignment for planning, sheets and staff forms. */
@media screen {
 #hb-portal label { padding: 0; line-height: 1.5; }
 #hb-portal .hb-button { min-height: 48px; }
 #hb-portal .hb-button:disabled { opacity: .5; cursor: not-allowed; filter: none; }
 #hb-portal .hb-search { grid-template-columns: minmax(170px,1fr) minmax(0,3fr) auto; }
 #hb-portal .hb-search > .hb-button { height: 48px; align-self: end; }
 #hb-portal .hb-form-grid { align-items: end; }
 #hb-portal .hb-card > p:last-child { margin-bottom: 0; }
 #hb-portal .hb-toolbar > .hb-badge { max-width: 100%; white-space: normal; }
 #hb-portal .hb-slip-form fieldset { min-width: 0; padding: 16px 0 28px; }
 #hb-portal .hb-slip-form legend { margin: 0 0 4px; }
 #hb-portal .hb-slip-form fieldset > p:last-child { margin-bottom: 0; }
 #hb-portal .hb-slip-form .hb-form-grid + .hb-form-grid { margin-top: 20px; }
 #hb-portal .hb-slip-form .hb-form-grid + p { margin-top: 14px; }
 #hb-portal .hb-slip-form fieldset > label + .hb-notice { margin: 18px 0 0; }
 #hb-portal .hb-signature .hb-text-button { min-height: 36px; margin-top: 4px; padding: 8px 0; }
 #hb-portal .hb-signature small { margin-top: 10px; line-height: 1.65; }
 #hb-portal .hb-slip-form > .hb-toolbar { justify-content: flex-start; gap: 12px; margin-top: 4px; padding-top: 24px; border-top: 1px solid var(--hb-border); }
 #hb-portal .hb-slip-form [data-hb-dirty] { flex-basis: 100%; margin-top: 4px; }
 #hb-portal .hb-slip-form [data-hb-dirty]:empty { display: none; }
 #hb-portal #hb-team-send-hint { max-width: 80ch; margin: 16px 0 0; font-size: 13px; line-height: 1.7; }
 #hb-portal .hb-boat-editor[open] > summary,#hb-portal .hb-document-upload[open] > summary { margin-bottom: 0; }
 #hb-portal .hb-document-upload[open] > summary { border-bottom: 1px solid var(--hb-border); }
 #hb-portal .hb-document-upload form { display: grid; gap: 16px; padding-top: 20px; }
 #hb-portal .hb-document-upload form > .hb-muted { margin: 0; line-height: 1.7; }
 #hb-portal .hb-document-upload .hb-editor-actions { margin-top: 4px; }
}
@media screen and (max-width:760px) {
 #hb-portal .hb-search { grid-template-columns: 1fr; gap: 18px; }
 #hb-portal .hb-search > .hb-button { width: 100%; }
}
@media screen and (max-width:600px) {
 #hb-portal .hb-slip-form > .hb-toolbar { display: grid; grid-template-columns: 1fr; gap: 12px; }
 #hb-portal .hb-slip-form > .hb-toolbar .hb-button { width: 100%; }
 #hb-portal .hb-slip-form fieldset { padding-bottom: 24px; }
 #hb-portal .hb-slip-form legend { font-size: 17px; }
}
@media print {
 @page { size: A4; margin: 12mm; }
 body.hb-portal-body { background: #fff; }
 #wpadminbar,#hb-portal .hb-no-print,.hb-portal-body > :not(#hb-portal) { display: none !important; }
 #hb-main { width: 100%; margin: 0; display: block; }
 #hb-portal { font-size: 10pt; }
 #hb-portal .hb-card { border: 0; padding: 0; box-shadow: none; }
 #hb-portal h1 { font-size: 24pt; margin: 3px 0 8px; }
 #hb-portal .hb-section-title { margin-bottom: 10px; }
 #hb-portal .hb-slip > p.hb-muted { display: none; }
 #hb-portal .hb-slip-form fieldset { padding: 12px 0; break-inside: avoid; }
 #hb-portal .hb-slip-form legend { font-size: 12pt; margin-bottom: 8px; }
 #hb-portal .hb-facts { gap: 12px; padding: 12px; grid-template-columns: repeat(4,1fr); }
 #hb-portal .hb-facts dd,#hb-portal label { font-size: 9pt; }
 #hb-portal .hb-form-grid { gap: 8px 20px; }
 #hb-portal .hb-slip input:not([type=hidden]):not([type=checkbox]),#hb-portal select,#hb-portal textarea { font-size: 10pt; padding: 4px; height: 27px; border: 0; border-bottom: 1px solid #bbb; border-radius: 0; }
 #hb-portal .hb-signed { height: 72px; max-width: 320px; }
 #hb-portal .hb-slip label { gap: 3px; }
 #hb-portal textarea { height: 64px; min-height: 64px; }
 #hb-portal .hb-notice { margin: 8px 0 0; padding: 6px; font-size: 8pt; }
 #hb-portal .hb-print-signature { display: block; margin: 22px 0; }
 #hb-portal .hb-muted { font-size: 8pt; }
}