/* enrprg.php only (2026-10-23): the login page in the home look (base: index.css + home_theme.css + login.css).
   login.htm / login.css are shared with the index.php login popup, so everything here is scoped to .lg-page. */

/* index.css hides #flogin (popup); on this page the box is the page content */
.lg-page #flogin{ display: block; position: static; height: auto; width: auto; }

/* the login box as a home-style card */
.lg-page .fbox{ width: min(440px, 100%); margin: 8px auto 12px; padding: 0 0 18px; background: var(--hc-surface); border: 1px solid var(--hc-line); border-radius: 14px; box-shadow: 0 2px 10px rgba(3,73,167,.08); overflow: hidden; font-size: 1rem; }
.lg-page .fbox .table, .lg-page .fbox .table-tr, .lg-page .fbox .table-td,
.lg-page .fbox .sub-table, .lg-page .fbox .sub-table-tr, .lg-page .fbox .sub-table-th, .lg-page .fbox .sub-table-td{
	display: block; width: 100% !important; height: auto; margin: 0; border: 0; background: none; text-align: left; }

/* first row = card heading */
.lg-page .fbox .table-tr:first-child .sub-table-td{ padding: 14px 24px; background: linear-gradient(120deg, #cddcf6 0%, var(--hc-surface) 100%); border-bottom: 3px solid var(--hc-brand); }
.lg-page .fbox h4{ margin: 0; font-size: 1.2rem; font-weight: bold; letter-spacing: .04em; color: var(--hc-brand); }

/* label above field */
.lg-page .fbox .sub-table-th{ padding: 12px 24px 4px; font-weight: bold; color: var(--hc-fg); }
.lg-page .fbox .sub-table-td{ padding: 0 24px; }
.lg-page .fbox .acc{ width: 100%; height: 2.6em; margin: 0; padding: 0 12px; border: 1px solid #b6cde6; border-radius: 8px; background: #fff; color: var(--hc-fg); font: inherit; }
.lg-page .fbox .acc:focus{ outline: 2px solid var(--hc-d-gr); outline-offset: 1px; border-color: var(--hc-brand); }

/* captcha: image + input side by side, hint below */
.lg-page .fbox .sub-table-td:has(#mypic){ display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.lg-page #mypic{ flex: none; height: 2.6em; margin: 0; border: 1px solid #b6cde6; border-radius: 6px; cursor: pointer; }
.lg-page .fbox .sub-table-td:has(#mypic) .acc{ flex: 1; width: auto; min-width: 0; }
.lg-page .fbox .sub-table-td:has(#mypic) span{ flex-basis: 100%; font-size: .82rem; color: var(--hc-muted); }

/* buttons: full-width login pill, cancel (popup only) hidden, links centered below */
.lg-page .fbox .table-tr:last-child .sub-table-td{ display: flex; flex-direction: column; align-items: stretch; gap: 10px; padding-top: 18px; }
.lg-page #cancelbtn{ display: none; }
.lg-page #confirmbtn{ float: none; width: 100%; margin: 0; padding: 10px 0; border: 0; border-radius: 999px; background: var(--hc-brand); font-size: 1.05rem; font-weight: bold; letter-spacing: .1em; }
.lg-page #confirmbtn:hover{ background: var(--hc-c-gr); }
.lg-page #otherbtn{ display: flex; justify-content: center; }
.lg-page #welcome1{ float: none; display: flex; align-items: center; margin: 0; padding: 0; }
.lg-page #welcome1 li{ float: none; }
.lg-page #welcome1 a{ color: var(--hc-brand); font-weight: bold; }
.lg-page #welcome1 a:hover{ color: var(--hc-c-gr); }
.lg-page #welcome1 .boundary:after{ color: #b9c9dc; }
.lg-page #welcome1 li:last-child:after{ content: none; }

@media (max-width: 600px){
	.lg-page .fbox{ margin-top: 10px; }
}