.hrb-member-login,
.hrb-member-welcome,
.hrb-member-form {
	font-family: var(--font-sans, Arial, Helvetica, sans-serif);
}

.hrb-member-login {
	display: grid;
	grid-template-columns: 1.1fr .9fr;
	gap: clamp(2rem, 6vw, 5rem);
	align-items: center;
	padding: clamp(1.6rem, 5vw, 3.5rem);
	color: #fff;
	background: linear-gradient(135deg, #03265f, #06499d);
	border-radius: 1rem;
	box-shadow: 0 24px 60px rgba(3, 38, 95, .18);
}

.hrb-member-login h2,
.hrb-member-welcome h2,
.hrb-member-form-heading h2 {
	margin: 0 0 .8rem;
	font-size: clamp(2rem, 4vw, 3.5rem);
	line-height: 1.04;
	letter-spacing: -.045em;
}

.hrb-member-login h2,
.hrb-member-login-copy > p,
.hrb-member-login-note { color: #fff !important; }
.hrb-member-login-copy > p { max-width: 640px; }
.hrb-member-login-note { opacity: .78; font-size: .9rem; }
.hrb-member-login form { display: grid; gap: 1rem; padding: 1.5rem; color: #12243a; background: #fff; border-radius: .8rem; }
.hrb-member-login label:not(.hrb-login-remember),
.hrb-member-form label { display: grid; gap: .35rem; font-weight: 800; }
.hrb-member-login input[type="text"],
.hrb-member-login input[type="password"],
.hrb-member-form input,
.hrb-member-form select,
.hrb-member-form textarea {
	width: 100%;
	min-height: 48px;
	padding: .72rem .8rem;
	color: #12243a;
	background: #fff;
	border: 1px solid #b9c7d6;
	border-radius: .45rem;
	font: inherit;
}
.hrb-member-form textarea { min-height: 110px; resize: vertical; }
.hrb-member-login input:focus,
.hrb-member-form :where(input, select, textarea):focus { outline: 3px solid rgba(245, 99, 24, .25); border-color: #f56318; }
.hrb-login-remember { display: flex; align-items: center; gap: .55rem; font-weight: 600; }
.hrb-login-remember input { width: 18px; height: 18px; }

.hrb-portal-notice { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: center; margin: 0 0 1.4rem; padding: 1rem 1.1rem; border-left: 5px solid #18864b; background: #e9f7ef; color: #0c5130; border-radius: .35rem; }
.hrb-portal-notice.is-error { border-color: #be3628; background: #fff0ed; color: #7f2017; }
.hrb-portal-notice span { font-size: .9rem; }

.hrb-member-welcome { display: flex; justify-content: space-between; gap: 2rem; align-items: start; margin-bottom: 2rem; padding: clamp(1.6rem, 4vw, 2.7rem); color: #fff; background: linear-gradient(135deg, #03265f, #053b91); border-radius: .9rem; }
.hrb-member-welcome h2, .hrb-member-welcome p { color: #fff !important; }
.hrb-member-welcome p { margin-bottom: 0; opacity: .85; }
.hrb-member-logout { flex: 0 0 auto; padding: .65rem .9rem; color: #fff; border: 1px solid rgba(255,255,255,.55); border-radius: .45rem; text-decoration: none; font-weight: 800; }
.hrb-member-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.hrb-member-actions a { display: grid; grid-template-columns: 56px 1fr; gap: .1rem 1rem; min-height: 150px; align-content: center; padding: 1.4rem; color: #03265f; background: #f5f2eb; border: 1px solid #dde5ee; border-top: 4px solid #f56318; border-radius: .75rem; text-decoration: none; transition: transform .16s ease, box-shadow .16s ease; }
.hrb-member-actions a:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(3,38,95,.1); }
.hrb-member-actions a > span { grid-row: 1 / span 2; display: grid; place-items: center; width: 56px; height: 56px; color: #fff; background: #053b91; border-radius: .6rem; font-size: 1.6rem; font-weight: 900; }
.hrb-member-actions strong { align-self: end; font-size: 1.2rem; }
.hrb-member-actions small { align-self: start; color: #52657a; }

.hrb-member-form { display: grid; gap: 1.5rem; }
.hrb-member-form-heading { padding: clamp(1.5rem, 4vw, 2.8rem); color: #fff; background: linear-gradient(135deg, #03265f, #053b91); border-radius: .9rem; }
.hrb-member-form-heading h2, .hrb-member-form-heading p { color: #fff !important; }
.hrb-member-form-heading p { max-width: 760px; margin-bottom: 0; opacity: .86; }
.hrb-member-form fieldset { min-width: 0; margin: 0; padding: clamp(1.2rem, 3vw, 2rem); background: #f8fafc; border: 1px solid #dce4ed; border-radius: .75rem; }
.hrb-member-form legend { padding: 0 .5rem; color: #03265f; font-size: 1.25rem; font-weight: 900; }
.hrb-member-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.hrb-member-form label > span { color: #12243a; }
.hrb-member-form label small { color: #5d6d80; font-weight: 400; }
.hrb-member-form .hrb-photo-field { padding: .9rem; background: #eef5ff; border: 1px dashed #8fa9c7; border-radius: .55rem; }
.hrb-member-form .hrb-photo-field input[type="file"] { min-height: 0; padding: .65rem; background: #fff; }
.hrb-member-form .hrb-photo-field input[type="file"]::file-selector-button { margin-right: .8rem; padding: .55rem .7rem; color: #fff; background: #053b91; border: 0; border-radius: .35rem; font: inherit; font-weight: 800; cursor: pointer; }
.hrb-member-field { padding: 1.2rem; background: #f8fafc; border: 1px solid #dce4ed; border-radius: .75rem; }
.hrb-form-lines { display: grid; gap: 1rem; }
.hrb-form-line { position: relative; display: grid; grid-template-columns: 42px 1fr; gap: 1rem; padding: 1rem; background: #fff; border: 1px solid #ced9e5; border-radius: .65rem; }
.hrb-form-line.compact { grid-template-columns: 42px 1fr; }
.hrb-line-number { display: grid; place-items: center; align-self: start; width: 42px; height: 42px; color: #fff; background: #053b91; border-radius: .5rem; font-weight: 900; }
.hrb-line-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
.hrb-line-fields .full { grid-column: 1 / -1; }
.hrb-remove-line { position: absolute; right: 1rem; top: -1rem; padding: .3rem .55rem; color: #9b2e24; background: #fff; border: 1px solid #e3b5b0; border-radius: .35rem; cursor: pointer; }
.hrb-add-line { margin-top: 1rem; }
.hrb-member-submit { display: flex; justify-content: space-between; gap: 2rem; align-items: center; padding: 1.2rem 1.4rem; color: #fff; background: #03265f; border-radius: .75rem; }
.hrb-member-submit p { max-width: 700px; margin: 0; color: #dce8ff !important; }
.hrb-member-submit .button { flex: 0 0 auto; }

.hrb-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.hrb-product-card { overflow: hidden; display: grid; grid-template-columns: 145px 1fr; background: #fff; border: 2px solid #dce4ed; border-radius: .7rem; transition: border-color .16s ease, box-shadow .16s ease; }
.hrb-product-card.is-selected { border-color: #f56318; box-shadow: 0 12px 28px rgba(245,99,24,.12); }
.hrb-first-aid-card:not(.has-image) { grid-template-columns: 1fr; }
.hrb-product-image { min-height: 100%; background: #f1f4f7; }
.hrb-product-image img { width: 100%; height: 100%; min-height: 220px; object-fit: cover; }
.hrb-product-copy { padding: 1.1rem; }
.hrb-product-code { color: #f56318; font-size: .72rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.hrb-product-card h3 { margin: .2rem 0 .5rem; color: #03265f; font-size: 1.2rem; }
.hrb-product-card p { color: #52657a; font-size: .92rem; }
.hrb-product-card .hrb-first-aid-meta { padding: .7rem .8rem; background: #eef5ff; border-radius: .4rem; }
.hrb-product-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.hrb-product-fields .full { grid-column: 1 / -1; }
.hrb-form-empty { padding: 1.2rem; background: #fff8df; border-left: 5px solid #dba617; }

@media (max-width: 900px) {
	.hrb-member-login, .hrb-product-grid { grid-template-columns: 1fr; }
	.hrb-product-card { grid-template-columns: 120px 1fr; }
}

@media (max-width: 650px) {
	.hrb-member-actions, .hrb-member-grid, .hrb-line-fields { grid-template-columns: 1fr; }
	.hrb-member-welcome, .hrb-member-submit { align-items: stretch; flex-direction: column; }
	.hrb-member-submit .button { width: 100%; }
	.hrb-form-line, .hrb-form-line.compact { grid-template-columns: 1fr; padding-top: 1.5rem; }
	.hrb-line-number { width: 36px; height: 36px; }
	.hrb-line-fields .full, .hrb-product-fields .full { grid-column: auto; }
	.hrb-product-card { grid-template-columns: 1fr; }
	.hrb-product-image img { min-height: 180px; max-height: 240px; }
}
