/* ===========================================================
   Patient Admin — standalone stylesheet
   =========================================================== */

/* ---------- Patient list panel ---------- */
.pa-wrap {
	max-width: 1180px;
	margin: 30px auto;
	padding: 0 16px;
}

.pa-panel {
	background: #fff;
	border: 1px solid #eef0f3;
	border-radius: 14px;
	box-shadow: 0 4px 18px rgba(15, 23, 42, 0.05);
	padding: 22px 22px 10px;
}

.pa-panel-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 16px;
}

.pa-logout-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #fff;
	color: #b91c1c;
	border: 1px solid #fecaca;
	border-radius: 8px;
	padding: 8px 16px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
}

.pa-logout-btn svg {
	width: 15px;
	height: 15px;
}

.pa-logout-btn:hover {
	background: #fef2f2;
}

.pa-panel-title {
	font-size: 18px;
	font-weight: 700;
	margin: 0;
	color: #111827;
}

/* ---------- Toolbar: search + filters + export ---------- */
.pa-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin-bottom: 18px;
}

.pa-search {
	position: relative;
	flex: 1 1 260px;
	min-width: 220px;
}

.pa-search svg {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
	color: #9ca3af;
	pointer-events: none;
}

.pa-search input {
	width: 100%;
	padding: 10px 12px 10px 36px;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	font-size: 14px;
	box-sizing: border-box;
}

.pa-search input:focus {
	outline: none;
	border-color: #2563eb;
	box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.12);
}

.pa-select {
	padding: 10px 14px;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	background: #fff;
	font-size: 14px;
	color: #374151;
	min-width: 140px;
	cursor: pointer;
}

.pa-select:focus {
	outline: none;
	border-color: #2563eb;
}

.pa-add-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #fff;
	color: #2563eb;
	border: 1px solid #2563eb;
	border-radius: 8px;
	padding: 10px 18px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	margin-left: auto;
	white-space: nowrap;
}

.pa-add-btn svg {
	width: 16px;
	height: 16px;
}

.pa-add-btn:hover {
	background: #eff6ff;
}

.pa-export-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #2563eb;
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 10px 18px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
}

.pa-export-btn svg {
	width: 16px;
	height: 16px;
}

.pa-export-btn:hover {
	background: #1d4ed8;
}

/* ---------- Table ---------- */
.pa-table-wrap {
	overflow-x: auto;
	border: 1px solid #f1f2f4;
	border-radius: 10px;
}

.pa-table-main {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	min-width: 760px;
}

.pa-table-main thead th {
	text-align: left;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: #6b7280;
	background: #f9fafb;
	padding: 12px 16px;
	border-bottom: 1px solid #eef0f3;
}

.pa-table-main tbody td {
	padding: 14px 16px;
	border-bottom: 1px solid #f1f2f4;
	color: #1f2937;
	vertical-align: middle;
}

.pa-table-main tbody tr:last-child td {
	border-bottom: none;
}

.pa-table-main tbody tr:hover {
	background: #fafbfc;
}

.pa-table-empty {
	text-align: center;
	color: #9ca3af;
	padding: 24px 16px !important;
}

/* ---------- Row selection checkboxes ---------- */
.pa-checkbox-cell {
	width: 40px;
	padding-right: 0 !important;
}

.pa-checkbox-cell input[type="checkbox"],
.pa-row-checkbox {
	width: 16px;
	height: 16px;
	cursor: pointer;
	accent-color: #2563eb;
}

/* ---------- Row action icons ---------- */
.pa-actions-cell {
	white-space: nowrap;
}

.pa-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border: none;
	background: transparent;
	border-radius: 6px;
	cursor: pointer;
	margin-right: 2px;
}

.pa-icon-btn svg {
	width: 16px;
	height: 16px;
}

.pa-icon-view {
	color: #2563eb;
}

.pa-icon-view:hover {
	background: #eff6ff;
}

.pa-icon-edit {
	color: #0891b2;
}

.pa-icon-edit:hover {
	background: #ecfeff;
}

.pa-icon-delete {
	color: #dc2626;
}

.pa-icon-delete:hover {
	background: #fef2f2;
}

/* ---------- Pagination ---------- */
.pa-pagination {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 4px;
}

.pa-pagination-info {
	font-size: 13px;
	color: #6b7280;
}

.pa-pagination-pages {
	display: flex;
	align-items: center;
	gap: 4px;
}

.pa-page-btn {
	min-width: 32px;
	height: 32px;
	padding: 0 8px;
	border: 1px solid #e5e7eb;
	background: #fff;
	color: #374151;
	border-radius: 6px;
	font-size: 13px;
	cursor: pointer;
}

.pa-page-btn:hover:not(:disabled) {
	background: #f3f4f6;
}

.pa-page-btn:disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

.pa-page-active {
	background: #2563eb;
	border-color: #2563eb;
	color: #fff;
}

.pa-page-ellipsis {
	padding: 0 4px;
	color: #9ca3af;
	font-size: 13px;
}

/* ---------- Patient list table ---------- */
.patient-table {
	width: 100%;
	border-collapse: collapse;
	margin: 20px 0;
	font-size: 14px;
}

.patient-table th,
.patient-table td {
	padding: 10px 12px;
	border-bottom: 1px solid #e2e2e2;
	text-align: left;
}

.patient-table th {
	background: #f5f6f8;
	font-weight: 600;
}

.patient-table a {
	color: #2563eb;
	text-decoration: none;
}

.patient-table a:hover {
	text-decoration: underline;
}

/* ---------- Modal content wrapper ---------- */
.pa-details {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

/* ---------- Card / section ---------- */
.pa-card {
	border: none;
	border-radius: 0;
	padding: 0 0 22px;
	background: transparent;
}

.pa-card + .pa-card {
	margin-top: 6px;
	padding-top: 18px;
	border-top: 1px solid #f1f2f4;
}

.pa-card h2 {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #6d28d9;
	margin: 0 0 14px;
	padding-bottom: 0;
	border-bottom: none;
}

/* ---------- Read-only rows (View modal) ---------- */
.pa-row {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 6px 0;
	border-bottom: 1px dashed #e5e7eb;
	font-size: 14px;
}

.pa-row:last-child {
	border-bottom: none;
}

.pa-row label {
	font-weight: 600;
	color: #555;
	flex: 0 0 45%;
}

.pa-row span {
	flex: 1;
	text-align: right;
	color: #222;
}

.pa-row--stack {
	flex-direction: column;
	align-items: flex-start;
}

.pa-row--stack span,
.pa-row--stack .pa-answer,
.pa-row--stack .pa-tags {
	text-align: left;
	width: 100%;
}

.pa-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.pa-tag {
	background: #e0e7ff;
	color: #3730a3;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 12px;
}

.pa-tag--muted {
	background: #eee;
	color: #777;
}

.pa-answer {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.pa-answer__note {
	font-size: 12px;
	color: #777;
}

.pa-address {
	font-style: normal;
	color: #222;
	white-space: pre-line;
}

/* ---------- Repeater tables (View modal, read-only) ---------- */
.pa-repeater-view {
	margin-top: 10px;
}

.pa-repeater-view > label {
	display: block;
	font-weight: 600;
	color: #555;
	margin-bottom: 6px;
}

.pa-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

.pa-table th,
.pa-table td {
	border: 1px solid #e5e7eb;
	padding: 6px 8px;
	text-align: left;
}

.pa-table th {
	background: #f0f1f3;
}

/* ---------- Edit form fields ---------- */
.pa-field {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding: 10px 0;
	border-bottom: 1px solid #f4f2fa;
}

.pa-field:last-child {
	border-bottom: none;
}

.pa-label {
	flex: 0 0 180px;
	font-weight: 600;
	color: #4b5563;
	font-size: 13px;
	padding-top: 10px;
}

.pa-input {
	flex: 1;
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #e2e4e9;
	border-radius: 8px;
	font-size: 14px;
	box-sizing: border-box;
	background: #fff;
	color: #111827;
}

.pa-input:focus {
	outline: none;
	border-color: #6d28d9;
	box-shadow: 0 0 0 3px rgba(109, 40, 217, 0.1);
}

.pa-textarea {
	min-height: 64px;
	resize: vertical;
}

/* ---------- Checklist / inline checkbox controls (Add New form) ---------- */
.pa-checklist {
	flex: 1;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	padding-top: 6px;
}

.pa-checklist-item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	color: #374151;
	font-weight: 400;
	cursor: pointer;
}

.pa-checklist-item input[type="checkbox"] {
	width: 15px;
	height: 15px;
	cursor: pointer;
	accent-color: #6d28d9;
}

.pa-checklist-other {
	flex: 1 1 100%;
	margin-top: 4px;
}

.pa-checkbox-inline {
	padding: 10px 12px;
	border: 1px solid #e2e4e9;
	border-radius: 8px;
	width: 100%;
	box-sizing: border-box;
}

@media (max-width: 560px) {
	.pa-field {
		flex-direction: column;
		gap: 6px;
	}

	.pa-label {
		flex-basis: auto;
		padding-top: 0;
	}
}

/* ---------- Editable repeaters ---------- */
.pa-repeater {
	margin-top: 14px;
	padding-top: 10px;
	border-top: 1px dashed #e5e7eb;
}

.pa-repeater > label {
	display: block;
	font-weight: 600;
	color: #555;
	margin-bottom: 8px;
}

.pa-repeater-row {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	margin-bottom: 8px;
}

.pa-repeater-row .pa-input {
	flex: 1 1 140px;
	width: auto;
}

.pa-repeater-remove {
	flex: 0 0 auto;
	border: none;
	background: #fee2e2;
	color: #b91c1c;
	width: 28px;
	height: 28px;
	border-radius: 6px;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
}

.pa-repeater-remove:hover {
	background: #fecaca;
}

.pa-repeater-add {
	border: 1px dashed #2563eb;
	background: transparent;
	color: #2563eb;
	padding: 6px 12px;
	border-radius: 6px;
	font-size: 13px;
	cursor: pointer;
}

.pa-repeater-add:hover {
	background: #eff6ff;
}

/* ---------- Form actions / messages ---------- */
.pa-form-actions {
	margin-top: 18px;
	display: flex;
	justify-content: flex-end;
	gap: 10px;
}

.pa-btn {
	border: none;
	border-radius: 6px;
	padding: 10px 20px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.pa-btn-save {
	background: #2563eb;
	color: #fff;
}

.pa-btn-save:hover {
	background: #1d4ed8;
}

.pa-btn-save:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.pa-form-message {
	margin-top: 10px;
	font-size: 13px;
	text-align: right;
}

.pa-message-success {
	color: #15803d;
}

.pa-message-error {
	color: #b91c1c;
}

/* ---------- View Patient Details modal ---------- */
.pa-view-dialog {
	/*max-width: 640px;*/
	max-width: 700px;
}

.pa-view-modal-content {
	border-radius: 16px;
	border: 1px solid #e9e2fb;
	box-shadow: 0 10px 30px rgba(109, 40, 217, 0.12);
	overflow: hidden;
}

.pa-view-modal-header {
	background: linear-gradient(90deg, #f5f0ff, #f8f5ff);
	border-bottom: 1px solid #efeafc;
	padding: 16px 20px;
}

.pa-view-modal-header .modal-title {
	font-weight: 700;
	color: #1f2937;
}

.pa-view-modal-body {
	padding: 0;
}

.pa-view-modal-footer {
	border-top: none;
	padding: 10px 20px 20px;
	justify-content: flex-end;
}

.pa-btn-close {
	background: #efeafb;
	color: #4c1d95;
	border: none;
	border-radius: 8px;
	padding: 10px 28px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.pa-btn-close:hover {
	background: #e3d7fa;
}

/* ---------- Edit Patient modal ---------- */
.pa-edit-dialog {
	max-width: 620px;
}

.pa-edit-modal-content {
	border-radius: 16px;
	border: 1px solid #dbeafe;
	box-shadow: 0 10px 30px rgba(37, 99, 235, 0.12);
	overflow: hidden;
}

.pa-edit-modal-header {
	background: linear-gradient(90deg, #eaf2ff, #f1f7ff);
	border-bottom: 1px solid #e3edfd;
	padding: 16px 20px;
}

.pa-edit-modal-header .modal-title {
	font-weight: 700;
	color: #1f2937;
}

.pa-edit-modal-body {
	padding: 20px 22px;
	max-height: 65vh;
	overflow-y: auto;
}

/* ---------- View Patient Details: left tabs / right content ---------- */
.pa-view {
	display: flex;
	min-height: 380px;
}

.pa-view-tabs {
	flex: 0 0 170px;
	background: #faf8ff;
	border-right: 1px solid #f0ecfa;
	padding: 14px 10px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.pa-view-tab {
	text-align: left;
	background: transparent;
	border: none;
	border-radius: 8px;
	padding: 10px 12px;
	font-size: 13px;
	font-weight: 600;
	color: #6b7280;
	cursor: pointer;
}

.pa-view-tab:hover {
	background: #f1ecfd;
	color: #4c1d95;
}

.pa-view-tab-active {
	background: #ede4ff;
	color: #6d28d9;
}

.pa-view-content {
	flex: 1;
	padding: 18px 22px;
	max-height: 60vh;
	overflow-y: auto;
}

.pa-view-panel {
	display: none;
}

.pa-view-panel-active {
	display: block;
}

.pa-view-row {
	display: flex;
	align-items: baseline;
	gap: 6px;
	padding: 7px 0;
	font-size: 14px;
	border-bottom: 1px dashed #f1f2f4;
}

.pa-view-row:last-child {
	border-bottom: none;
}

.pa-view-label {
	flex: 0 0 190px;
	color: #6b7280;
	font-weight: 500;
}

.pa-view-colon {
	flex: 0 0 auto;
	color: #9ca3af;
}

.pa-view-value {
	flex: 1;
	color: #111827;
}

.pa-view-na {
	color: #b0b4bb;
	font-style: italic;
}

.pa-view-signature {
	max-height: 60px;
	border: 1px solid #f1f2f4;
	border-radius: 6px;
	padding: 4px;
	width: 65%;
}

.pa-view-repeater {
	margin: 14px 0 6px;
}

.pa-view-repeater-label {
	display: block;
	margin-bottom: 8px;
	flex: none;
}

.pa-view-empty {
	color: #9ca3af;
	font-size: 14px;
	padding: 30px 0;
	text-align: center;
}

/* ---------- Confirmation modal buttons ---------- */
.pa-btn-cancel {
	background: #f3f4f6;
	color: #374151;
}

.pa-btn-cancel:hover {
	background: #e5e7eb;
}

.pa-btn-danger {
	background: #dc2626;
	color: #fff;
}

.pa-btn-danger:hover {
	background: #b91c1c;
}

#patientConfirmMessage {
	font-size: 14px;
	color: #374151;
	margin: 0;
}

/* ---------- Confirm modal chrome ---------- */
.pa-confirm-dialog {
	max-width: 480px;
}

#patientConfirmModal.show {
	background: rgba(15, 23, 42, 0.6);
}

.pa-confirm-modal-content {
	border-radius: 16px;
	border: 1px solid #eef0f3;
	border-top: 4px solid #b45309;
	box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
	overflow: hidden;
}

.pa-confirm-modal-content--danger {
	border-color: #fecaca;
	border-top-color: #dc2626;
	box-shadow: 0 10px 30px rgba(220, 38, 38, 0.15);
}

.pa-confirm-modal-header {
	border-bottom: none;
	padding: 18px 20px 4px;
}

.pa-confirm-modal-header .modal-title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-weight: 700;
	font-size: 16px;
	color: #1f2937;
}

.pa-confirm-modal-body {
	padding: 4px 20px 18px;
}

.pa-confirm-modal-footer {
	border-top: 1px solid #f1f2f4;
	padding: 14px 20px;
	justify-content: flex-end;
	gap: 10px;
}

.pa-confirm-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 38px;
	height: 38px;
	border-radius: 50%;
}

.pa-confirm-icon svg {
	width: 20px;
	height: 20px;
}

.pa-confirm-icon-danger {
	background: #fee2e2;
	color: #dc2626;
}

.pa-confirm-icon-warning {
	background: #fef3c7;
	color: #b45309;
}

/* ---------- Dedicated Delete Patient modal ---------- */
.pa-delete-dialog {
	max-width: 380px;
}

.pa-delete-modal-content {
	border-radius: 18px;
	border: 1px solid #fecaca;
	box-shadow: 0 12px 34px rgba(220, 38, 38, 0.14);
	padding: 34px 28px 28px;
	text-align: center;
}

.pa-delete-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	margin: 0 auto 20px;
	border-radius: 50%;
	border: 2px solid #fca5a5;
	color: #dc2626;
	background: #fff;
}

.pa-delete-icon svg {
	width: 28px;
	height: 28px;
}

.pa-delete-title {
	font-size: 18px;
	font-weight: 700;
	color: #111827;
	line-height: 1.35;
	margin: 0 0 8px;
}

.pa-delete-subtext {
	font-size: 14px;
	color: #6b7280;
	margin: 0 0 26px;
}

.pa-delete-actions {
	display: flex;
	justify-content: center;
	gap: 12px;
}

.pa-delete-actions .pa-btn {
	min-width: 110px;
}

/* ---------- Centered modals ---------- */
.pa-view-dialog,
.pa-edit-dialog,
.pa-confirm-dialog,
.pa-delete-dialog {
	display: flex;
	align-items: center;
	min-height: calc(100% - 3.5rem);
}

/* ---------- Patient Admin Login page ---------- */
.pa-login-wrap {
	min-height: 70vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 40px 16px;
}

.pa-login-card {
	width: 100%;
	max-width: 380px;
	background: #fff;
	border: 1px solid #eef0f3;
	border-radius: 16px;
	box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
	padding: 36px 32px 30px;
	text-align: center;
}

.pa-login-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: linear-gradient(135deg, #ede4ff, #eaf2ff);
	color: #6d28d9;
	margin-bottom: 16px;
}

.pa-login-icon svg {
	width: 24px;
	height: 24px;
}

.pa-login-title {
	font-size: 20px;
	font-weight: 700;
	color: #1f2937;
	margin: 0 0 4px;
}

.pa-login-subtitle {
	font-size: 13px;
	color: #6b7280;
	margin: 0 0 24px;
}

.pa-login-form {
	text-align: left;
}

.pa-login-field {
	margin-bottom: 18px;
}

.pa-login-field label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #4b5563;
	margin-bottom: 6px;
}

.pa-login-field input {
	width: 100%;
	padding: 11px 14px;
	border: 1px solid #e2e4e9;
	border-radius: 8px;
	font-size: 14px;
	box-sizing: border-box;
}

.pa-login-field input:focus {
	outline: none;
	border-color: #6d28d9;
	box-shadow: 0 0 0 3px rgba(109, 40, 217, 0.1);
}

.pa-password-wrap {
	position: relative;
}

.pa-password-wrap input {
	padding-right: 40px;
}

.pa-password-toggle {
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border: none;
	background: transparent;
	color: #9ca3af;
	cursor: pointer;
	padding: 0;
}

.pa-password-toggle svg {
	width: 18px;
	height: 18px;
}

.pa-password-toggle:hover {
	color: #6b7280;
}

.pa-password-toggle-active {
	color: #6d28d9;
}

.pa-login-btn {
	width: 100%;
	background: #2563eb;
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 12px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.pa-login-btn:hover {
	background: #1d4ed8;
}

.pa-login-message {
	margin-top: 14px;
	font-size: 13px;
	color: #dc2626;
	min-height: 1em;
}

.lab-test-sec label#wpforms\[fields\]\[470\]-error{
    margin-top: 20px;    
}

@media (max-width: 560px) {
	.pa-view {
		flex-direction: column;
	}

	.pa-view-tabs {
		flex: 0 0 auto;
		flex-direction: row;
		overflow-x: auto;
		border-right: none;
		border-bottom: 1px solid #f0ecfa;
	}

	.pa-view-tab {
		white-space: nowrap;
	}

	.pa-view-label {
		flex-basis: 140px;
	}
}