/* Box headings adapted from EasyGoldShop branch-overview-panel; shared by forms and tables. */
.fi-main{
 --ehr-box-header-bg:linear-gradient(180deg,#eef4f9 0%,#f4f7fa 100%);
 --ehr-box-border:#dce7f0;
 --ehr-box-title:#17324d;
 --ehr-box-caption:#566f85;
 --ehr-box-icon-bg:linear-gradient(145deg,#0d67b5,#064682);
 --ehr-box-shadow:0 8px 24px rgb(11 67 111 / 5%);
}
.fi-main .fi-section:not(.fi-aside),.fi-main .fi-ta-ctn{
 border:1px solid var(--ehr-box-border);border-radius:18px;
 box-shadow:var(--ehr-box-shadow);--tw-ring-color:transparent;
}
.fi-main .fi-section:not(.fi-aside)>.fi-section-header,.fi-main .ehr-box-header{
 box-sizing:border-box;min-height:60px;padding:12px 16px;
 border:0;border-radius:17px 17px 0 0;background:var(--ehr-box-header-bg);
}
.fi-main .fi-section:not(.fi-aside)>.fi-section-header>.flex{gap:10px}
.fi-main .fi-section:not(.fi-aside)>.fi-section-header>.flex>.grid{min-width:0;gap:2px}
.fi-main .fi-section:not(.fi-aside)>.fi-section-content-ctn{border-color:var(--ehr-box-border)}
.fi-main .fi-section-header-icon,.ehr-box-heading__icon{
 box-sizing:border-box;flex:0 0 auto;align-self:center;width:32px;height:32px;margin:0;
 border-radius:9px;background:var(--ehr-box-icon-bg);color:#fff;
 box-shadow:0 7px 16px rgb(6 73 134 / 20%),inset 0 1px rgb(255 255 255 / 20%);
}
.fi-main .fi-section-header-icon{padding:7.5px}
.ehr-box-heading__icon{display:grid;place-items:center}
.ehr-box-heading__icon svg{width:17px;height:17px}
.fi-main .fi-section-header-heading,.ehr-box-heading__title{
 color:var(--ehr-box-title);font-size:15px;font-weight:800;line-height:1.5;letter-spacing:-.01em;overflow-wrap:anywhere;
}
.fi-main .fi-section-header-description,.ehr-box-heading__description{
 margin:0;color:var(--ehr-box-caption);font-size:11px;line-height:1.65;overflow-wrap:anywhere;
}
.ehr-box-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.ehr-box-heading{display:flex;align-items:center;min-width:0;gap:10px;flex:1 1 200px}
.ehr-box-heading__copy{min-width:0;display:grid;gap:2px}
.ehr-box-header__actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-width:0;max-width:100%}
.fi-main .fi-ta-header-ctn{border-color:var(--ehr-box-border)}
.fi-main .fi-ta-header-ctn>.ehr-box-header+.fi-ta-header-toolbar{border-color:var(--ehr-box-border)}
html.dark .fi-main{
 --ehr-box-header-bg:linear-gradient(180deg,#162b41 0%,#122337 100%);
 --ehr-box-border:#2b435c;--ehr-box-title:#e7eff7;--ehr-box-caption:#a8bfd3;
 --ehr-box-icon-bg:linear-gradient(145deg,#206caa,#164574);
 --ehr-box-shadow:0 8px 24px rgb(0 0 0 / 9%);
}
/* Keep the shared header authoritative over existing person-form theme rules. */
html.dark .fi-main .fi-section:not(.fi-aside)>.fi-section-header{background:var(--ehr-box-header-bg)}
html.dark .fi-main .fi-section-header-heading{color:var(--ehr-box-title)}
html.dark .fi-main .fi-section-header-description{color:var(--ehr-box-caption)}
@media(max-width:639px){
 .fi-main .fi-section:not(.fi-aside)>.fi-section-header,.fi-main .ehr-box-header{padding:12px 14px}
}

/* Independent form groups use Alpine's native height collapse, retaining field state. */
.fi-main .ehr-collapsible-section>.fi-section-header{transition:border-radius .36s ease}
.fi-main .ehr-collapsible-section.fi-collapsed>.fi-section-header{border-radius:17px}
.fi-main .ehr-collapsible-section>.fi-section-content-ctn{transition-timing-function:cubic-bezier(.22,.61,.36,1)!important}
.fi-main .ehr-collapsible-section .ehr-section-toggle{flex-shrink:0;width:44px;height:44px;margin:-6px;color:var(--ehr-box-caption);border-radius:10px;touch-action:manipulation;transition:transform .36s cubic-bezier(.22,.61,.36,1),background-color .18s,color .18s}
.fi-main .ehr-collapsible-section .ehr-section-toggle:hover{background:rgb(33 105 223 / 9%);color:var(--ehr-box-title)}
.fi-main .ehr-collapsible-section .ehr-section-toggle:focus-visible{outline:2px solid #459ed8;outline-offset:2px}
@media(prefers-reduced-motion:reduce){
 .fi-main .ehr-collapsible-section>.fi-section-header,.fi-main .ehr-collapsible-section>.fi-section-content-ctn,.fi-main .ehr-collapsible-section .ehr-section-toggle{transition-duration:0s!important}
}

/* Read-only completion: emerald stamp with a quiet halo; pending stays neutral. */
.ehr-completion-status{position:relative;justify-content:center;isolation:isolate}
.ehr-completion-status .fi-ta-icon-item{box-sizing:border-box;width:24px;height:24px;padding:5px;border-radius:50%}
.ehr-completion-status.is-complete .fi-ta-icon-item{position:relative;z-index:1;color:#fff;background:linear-gradient(145deg,#0b9564,#08754f);box-shadow:0 2px 6px rgb(8 117 79 / 22%),inset 0 1px rgb(255 255 255 / 22%);animation:ehr-completion-stamp .5s cubic-bezier(.2,.8,.25,1) both}
.ehr-completion-status.is-complete::after{content:"";position:absolute;left:50%;top:50%;width:24px;height:24px;box-sizing:border-box;border:1px solid rgb(16 160 105 / 40%);border-radius:50%;pointer-events:none;opacity:0;animation:ehr-completion-halo 5.2s ease-out infinite;animation-delay:var(--ehr-completion-phase,0s)}
.fi-ta-row:nth-child(3n+2) .ehr-completion-status{--ehr-completion-phase:-1.7s}
.fi-ta-row:nth-child(3n) .ehr-completion-status{--ehr-completion-phase:-3.4s}
@keyframes ehr-completion-stamp{0%{transform:scale(.78);opacity:.55}65%{transform:scale(1.08);opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes ehr-completion-halo{0%,64%{transform:translate(-50%,-50%) scale(1);opacity:0}68%{transform:translate(-50%,-50%) scale(1);opacity:.5}94%,100%{transform:translate(-50%,-50%) scale(1.65);opacity:0}}
.ehr-completion-status.is-incomplete .fi-ta-icon-item{color:#8fa2ba;background:#f0f4f8}
html.dark .ehr-completion-status.is-complete .fi-ta-icon-item{color:#fff;background:linear-gradient(145deg,#15976b,#0b7856);box-shadow:0 2px 8px rgb(0 0 0 / 22%),inset 0 1px rgb(255 255 255 / 18%)}
html.dark .ehr-completion-status.is-complete::after{border-color:rgb(57 210 149 / 45%)}
html.dark .ehr-completion-status.is-incomplete .fi-ta-icon-item{color:#879cb4;background:#1b2c40}

@media(prefers-reduced-motion:reduce){.ehr-completion-status.is-complete .fi-ta-icon-item{animation:none}.ehr-completion-status.is-complete::after{animation:none;opacity:0}}
@media print{.ehr-completion-status.is-complete .fi-ta-icon-item{animation:none}.ehr-completion-status.is-complete::after{display:none}}

.ehr-box-heading__actions{display:flex;align-items:center;flex:0 0 auto;margin-inline-start:auto;gap:8px}.ehr-box-heading__actions .fi-icon-btn{min-width:44px;min-height:44px}
