:root {
    --hebk-font: system-ui, sans-serif;
    --hebk-title-font: "HeBK Calligraphy", var(--hebk-font);
    --hebk-green: #1a5829;
    --hebk-gold: #fcc106;
    --hebk-gold-rgb: 252, 193, 6;
    --hebk-text: var(--hebk-green);
    --hebk-body-text: var(--hebk-green);
    --hebk-surface: #fff;
    --hebk-background: #f4f7f4;
    --hebk-border: #ccdcd2;
    --hebk-control-border: #718677;
    --hebk-focus: #b97b00;
    --hebk-selection: #fff1b8;
    --hebk-success-background: #edf5ef;
    --hebk-error: #8a2424;
    --hebk-error-border: #b32d2e;
}

@font-face {
    font-family: "HeBK Calligraphy";
    src: url("fonts/calligraphyflf.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Shared foundation for every public module surface. Page CSS owns layout only. */
:where(.hebk-form, .hebk-portal, .hebk-leader-portal, .hebk-booking, .hebk-continuation-test, .hebk-test-review) {
    box-sizing: border-box;
    font: 16px/1.5 var(--hebk-font);
    color: var(--hebk-body-text);
}
:where(.hebk-form, .hebk-portal, .hebk-leader-portal, .hebk-booking) {
    background: var(--hebk-surface);
    border: 1px solid var(--hebk-border);
    border-top: 5px solid var(--hebk-gold);
    border-radius: 12px;
}
:where(.hebk-form, .hebk-portal, .hebk-leader-portal, .hebk-booking) * { box-sizing: border-box; }
:is(.hebk-form, .hebk-portal, .hebk-leader-portal, .hebk-booking, .hebk-continuation-test, .hebk-test-review) :where(h1,h2,h3,h4,h5,h6,label,legend,a) {
    color: var(--hebk-green);
}
:is(.hebk-form, .hebk-portal, .hebk-leader-portal, .hebk-booking) :where(input,select,textarea) {
    font: inherit;
    color: inherit;
}
:is(.hebk-form, .hebk-portal, .hebk-leader-portal, .hebk-booking) :where(button,.button,input[type=submit]) {
    font: inherit;
    background: var(--hebk-green);
    color: var(--hebk-gold);
    border: 1px solid var(--hebk-green);
    border-radius: 6px;
    min-height: 44px;
    cursor: pointer;
}
:is(.hebk-form, .hebk-portal, .hebk-leader-portal, .hebk-booking) :focus-visible {
    outline: 3px solid var(--hebk-focus);
    outline-offset: 3px;
}
body:has(> :is(.hebk-portal,.hebk-leader-portal,.hebk-booking)) {
    margin: 0;
    padding: 20px;
    background: var(--hebk-background);
}
@media(max-width:600px){body:has(> :is(.hebk-portal,.hebk-leader-portal,.hebk-booking)){padding:8px}}

.hebk-form h2,
.hebk-portal h1,
.hebk-leader-portal > header > h1,
.hebk-booking > h1,
.wrap .hebk-brand-title,
body.page-id-9300 #headline-50-8034 {
    font-family: var(--hebk-title-font);
    font-weight: 400;
    font-style: normal;
    font-synthesis: none;
    line-height: 1.35;
}

#wpbody .wrap:has(.hebk-brand-nav) {
    font-family: var(--hebk-font);
    color: var(--hebk-body-text);
}

#wpbody .wrap:has(.hebk-brand-nav) .widefat :is(th, td) {
    color: var(--hebk-body-text);
}

:is(.hebk-form, .hebk-portal, .hebk-leader-portal, .hebk-booking, #wpbody .wrap:has(.hebk-brand-nav))
    :where(button, input, select, textarea) {
    font-family: inherit;
}

.hebk-portal button[type=submit]:not(.hebk-portal-link),
.hebk-leader-portal :is(button, input)[type=submit],
.hebk-booking button[type=submit] {
    color: var(--hebk-gold);
    background: var(--hebk-text);
    border-color: var(--hebk-text);
}

.wrap .hebk-brand-title {
    display: flex;
    align-items: center;
    gap: 14px;
    border-bottom: 4px solid var(--hebk-gold);
    padding: 12px 0;
    color: var(--hebk-text);
    font-size: clamp(28px, 4vw, 36px);
}
#wpbody .wrap:has(.hebk-brand-nav) :is(h2,h3,h4,h5,h6,label,legend){color:var(--hebk-text)}
#wpbody .wrap:has(.hebk-brand-nav) .notice-success,
.hebk-calendar-feedback {
    background: var(--hebk-success-background);
    color: var(--hebk-text);
    border: 1px solid #b9d1c2;
    border-left: 4px solid var(--hebk-text);
    border-radius: 6px;
    box-shadow: none;
}
.hebk-calendar-feedback {
    margin-top: 8px;
    padding: 12px 16px;
    font: inherit;
    line-height: 1.5;
    overflow-wrap: anywhere;
}
.hebk-calendar-feedback.hebk-calendar-feedback-error {
    background: #fcf0f1;
    color: var(--hebk-error);
    border-color: var(--hebk-error-border);
}
.hebk-brand-title img{width:48px;height:48px;object-fit:contain}
.hebk-brand-nav [role=group]{padding:8px 10px;background:var(--hebk-success-background);border-radius:6px;color:var(--hebk-text);box-sizing:border-box}
.hebk-brand-nav .nav-tab{white-space:normal;border-radius:6px}
.hebk-brand-nav .nav-tab-wrapper{border-bottom:0}
#wpbody .wrap:has(.hebk-brand-nav) .button{border-radius:6px}
#wpbody .wrap:has(.hebk-brand-nav) .button:not(:disabled):not(.disabled):not([aria-disabled=true]){
    color:var(--hebk-text);border-color:var(--hebk-text);background:#f6faf7
}
#wpbody .wrap:has(.hebk-brand-nav) .button:not(:disabled):not(.disabled):not([aria-disabled=true]):hover{background:#e2efe5}
#wpbody .wrap:has(.hebk-brand-nav) .button-primary:not(:disabled):not(.disabled):not([aria-disabled=true]){
    color:var(--hebk-gold);border-color:var(--hebk-text);background:var(--hebk-text)
}
#wpbody .wrap:has(.hebk-brand-nav) .button-primary:not(:disabled):not(.disabled):not([aria-disabled=true]):hover{background:color-mix(in srgb, var(--hebk-green) 85%, black)}
#wpbody .wrap:has(.hebk-brand-nav) input[type=checkbox]:not(:disabled){
    border-color:var(--hebk-text)
}
#wpbody .wrap:has(.hebk-brand-nav) :is(input[type=checkbox],input[type=radio]):checked:not(:disabled){
    background-color:var(--hebk-text);border-color:var(--hebk-text)
}
#wpbody .wrap:has(.hebk-brand-nav) input[type=checkbox]:checked:not(:disabled)::before{
    content:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 20 20%27%3E%3Cpath fill=%27%23fcc106%27 d=%27M14.83 4.89l1.34.94-5.81 8.44H9.02L5.78 9.84l1.34-1.25 2.57 2.4z%27/%3E%3C/svg%3E")
}
#wpbody .wrap:has(.hebk-brand-nav) input[type=radio]:checked:not(:disabled)::before{background-color:white}
#wpbody .wrap:has(.hebk-brand-nav) :is(.button,.nav-tab,input[type=checkbox],input[type=radio]):focus-visible{outline:2px solid var(--hebk-text);outline-offset:2px;box-shadow:none}
.hebk-brand-nav .nav-tab:not(.nav-tab-active){
    background:rgba(var(--hebk-gold-rgb), .50);color:var(--hebk-text);border-color:#c7b87a
}
.hebk-brand-nav .nav-tab:not(.nav-tab-active):hover{background:rgba(var(--hebk-gold-rgb), .65)}
.hebk-brand-nav .nav-tab-active{background:var(--hebk-text);color:var(--hebk-gold);border-color:var(--hebk-text);box-shadow:inset 0 -3px var(--hebk-gold)}

#hebk-test-editor { max-width: 1000px; }
#hebk-test-editor-form { margin-top: 24px; }
.hebk-test-editor-question { border: 1px solid var(--hebk-border); border-radius: 8px; background: var(--hebk-surface); padding: 18px; margin: 16px 0; }
.hebk-test-editor-question summary { cursor: pointer; font-weight: 600; }
.hebk-test-editor-question label { display: block; margin: 12px 0; }
.hebk-test-editor-question label[hidden] { display: none; }
.hebk-test-editor-question :is(textarea,input:not([type=number])) { display: block; width: 100%; max-width: 100%; }
.hebk-test-editor-question input[type=number] { display: block; width: 100px; }
.hebk-test-editor-tools { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.hebk-test-editor-field { background: var(--hebk-success-background); border-radius: 6px; padding: 8px 16px 16px; margin: 12px 0; }

/* Question pictures are immutable copies, including edits made in this dialog. */
.hebk-test-image { margin: 16px 0; border-top: 1px solid var(--hebk-border); padding-top: 12px; }
.hebk-test-image [data-image-preview] { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; }
.hebk-test-image [data-image-preview] img { max-width: min(100%, 300px); max-height: 260px; object-fit: contain; }
.hebk-test-image input[type=file] { max-width: 250px; font-size: 14px; }
.hebk-test-image label.button { margin: 0; height: auto; }
.hebk-test-image-dialog { max-width: 900px; width: calc(100% - 40px); max-height: 90vh; overflow: auto; box-sizing: border-box; border: 2px solid #1A5829; border-radius: 12px; padding: 20px; color: #1A5829; background: #fff; font: 16px/1.5 system-ui, sans-serif; }
.hebk-test-image-dialog::backdrop { background: #0009; }
.hebk-test-image-dialog canvas { display: block; max-width: 100%; max-height: 46vh; width: auto; height: auto; touch-action: none; cursor: crosshair; border: 1px solid #1A5829; }
.hebk-test-image-dialog button { background: #1A5829; color: #FCC106; padding: 10px 14px; border: 1px solid #1A5829; border-radius: 8px; font: inherit; cursor: pointer; }
.hebk-test-image-dialog button:disabled { opacity: .5; cursor: default; }
.hebk-test-image-dialog button:focus-visible { outline: 3px solid #FCC106; outline-offset: 2px; }
.hebk-test-image-dialog label { display: grid; gap: 3px; }
.hebk-test-image-dialog input { width: 90px; font: inherit; color: #1A5829; }

.hebk-member-issue{border-left:4px solid var(--hebk-green,#1A5829);background:#f4f7f4;padding:12px 16px;margin:12px 0;border-radius:8px}.hebk-own-details{margin:12px 0}.hebk-own-details summary{cursor:pointer;color:#1A5829;font-weight:600}.hebk-member-details-help{font-size:.95em}
