/* 2026-10-23 home look for the single-form pages: regapply.php, changepwd.php, forgot.php, qur/qurq001.php.
   Load AFTER the page's own css and home_theme.css. The page css keeps its form styling;
   this file only undoes the old fixed banner header and wraps the content in a home-style white card. */

/* old base css: fixed header + big top margin for it, banner image, white bars */
#header{ position: static; overflow: visible; height: auto; width: auto; background: none; }
#content{ margin-top: 0; margin-bottom: 0; padding-top: 4px; }
#content > .container{ max-width: 1170px; }

/* old base css: footer band colour */
#footer, #footer > .container{ background: none; }

/* the content area is one white card */
#content > .container{ margin-top: 14px; padding: 8px 28px 24px; background: var(--hc-surface); border: 1px solid var(--hc-line); border-radius: 14px; box-shadow: 0 2px 10px rgba(3,73,167,.06); }
#content > .container > div{ background: transparent; }

/* page title (changepwdL.htm / forgotL.htm .title) as a card heading */
#content > .container > .title{ width: auto; margin: 0 -28px 18px; padding: 16px 28px; text-align: left; border-bottom: 3px solid var(--hc-brand); background: linear-gradient(120deg, #cddcf6 0%, var(--hc-surface) 100%); border-radius: 14px 14px 0 0; }
#content > .container > .title h3{ margin: 0; font-size: 1.35rem; font-weight: bold; letter-spacing: .06em; color: var(--hc-brand); }
#content > .container:has(> .title){ padding-top: 0; }

/* buttons: same pill style as the home page */
#content .mnav button:not(.pwd-eye), #content .mform button:not(.pwd-eye), #content .btn button:not(.pwd-eye){ font: inherit; font-weight: bold; border: 0; border-radius: 999px; padding: 6px 22px; background: var(--hc-brand); color: #fff; cursor: pointer; }
#content .mnav button:not(.pwd-eye):hover, #content .mform button:not(.pwd-eye):hover, #content .btn button:not(.pwd-eye):hover{ background: var(--hc-c-gr); }
#content .mnav button img, #content .btn button img{ display: none; }
#content .mnav table, #content .mnav td, #content .btn table, #content .btn td{ border: 0 !important; background: transparent !important; }

@media (max-width: 600px){
	#content > .container{ padding: 6px 16px 18px; }
	#content > .container > .title{ margin: 0 -16px 14px; padding: 14px 16px; }
}