:root {
	--qeos-navy: #071d45;
	--qeos-blue: #1768e5;
	--qeos-border: #e3e9f2;
	--qeos-text: #13213a;
	--qeos-muted: #64748b;
	--qeos-surface: #ffffff;
	--qeos-field-bg: #fbfdff;
	--qeos-field-border: #cfd8e6;
	--qeos-radius: 15px;
	--qeos-shadow: 0 10px 30px rgba(15, 23, 42, .055);
}

.qeos-wrap { color: var(--qeos-text); max-width: 1540px; padding: 22px 28px 48px 4px; }
.qeos-header { align-items: flex-start; display: flex; gap: 24px; justify-content: space-between; margin: 10px 0 26px; }
.qeos-header h1 { color: #0f172a; font-size: 30px; font-weight: 750; letter-spacing: -.025em; line-height: 1.2; margin: 0 0 7px; }
.qeos-header p { color: var(--qeos-muted); margin: 0; }
.qeos-eyebrow { color: var(--qeos-blue) !important; font-size: 12px; font-weight: 700; letter-spacing: .08em; margin-bottom: 7px !important; text-transform: uppercase; }
.qeos-badge { background: #e9f2ff; border-radius: 999px; color: #165fce; font-weight: 600; padding: 8px 12px; }
.qeos-cards { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.qeos-card, .qeos-panel { background: var(--qeos-surface); border: 1px solid var(--qeos-border); border-radius: var(--qeos-radius); box-shadow: var(--qeos-shadow); }
.qeos-card { align-items: center; display: flex; gap: 14px; min-height: 82px; padding: 18px; }
.qeos-card__icon { align-items: center; border-radius: 10px; display: inline-flex; height: 42px; justify-content: center; width: 42px; }
.qeos-card strong { display: block; font-size: 24px; line-height: 1.1; }
.qeos-card span:last-child { color: var(--qeos-muted); display: block; margin-top: 5px; }
.qeos-card--blue .qeos-card__icon { background: #e9f2ff; color: #1768e5; }
.qeos-card--green .qeos-card__icon { background: #e9f9ee; color: #169447; }
.qeos-card--orange .qeos-card__icon { background: #fff4e5; color: #e77b11; }
.qeos-card--red .qeos-card__icon { background: #ffebee; color: #dc3545; }
.qeos-grid { display: grid; gap: 16px; grid-template-columns: 1.2fr .8fr; margin-top: 16px; }
.qeos-panel { min-height: 230px; padding: 24px; }
.qeos-panel h2 { font-size: 17px; margin: 0 0 12px; }
.qeos-panel p { color: var(--qeos-muted); line-height: 1.6; }
.qeos-empty { align-items: center; background: #f7faff; border: 1px dashed #b9c9e3; border-radius: 10px; display: flex; flex-direction: column; gap: 6px; margin-top: 22px; padding: 26px; text-align: center; }
.qeos-empty .dashicons { color: var(--qeos-blue); font-size: 30px; height: 30px; width: 30px; }
.qeos-empty span:last-child, .qeos-muted { color: var(--qeos-muted); }
.qeos-activity { margin: 0; }
.qeos-activity li { border-bottom: 1px solid var(--qeos-border); display: flex; justify-content: space-between; margin: 0; padding: 12px 0; }
.qeos-activity li:last-child { border-bottom: 0; }
.qeos-activity span { color: var(--qeos-muted); font-size: 12px; }
.qeos-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.qeos-layout { align-items: start; display: grid; gap: 22px; grid-template-columns: minmax(360px, 440px) minmax(0, 1fr); }
.qeos-form-panel, .qeos-list-panel { min-height: 0; min-width: 0; }
.qeos-form-heading { align-items: flex-start; border-bottom: 1px solid var(--qeos-border); display: flex; gap: 14px; margin: -2px 0 20px; padding: 0 0 17px; }
.qeos-form-heading__icon { align-items: center; background: #eaf3ff; border-radius: 999px; color: var(--qeos-blue); display: inline-flex; flex: 0 0 46px; font-size: 21px; height: 46px; justify-content: center; width: 46px; }
.qeos-form-heading > div { min-width: 0; }
.qeos-form-heading h2, .qeos-panel .qeos-form-heading h2 { color: #17233a; font-size: 16px; font-weight: 750; letter-spacing: -.01em; margin: 4px 0 4px; }
.qeos-form-heading p, .qeos-panel .qeos-form-heading p { color: var(--qeos-muted); font-size: 12.5px; line-height: 1.5; margin: 0; }
.qeos-form { display: grid; gap: 17px; }
.qeos-form label { display: grid; gap: 7px; margin: 0; }
.qeos-form label > span { color: #293750; font-size: 12px; font-weight: 700; letter-spacing: .005em; }
.qeos-form label b { color: #d63638; }
.qeos-form input, .qeos-form select, .qeos-form textarea { background: var(--qeos-field-bg); border: 1px solid var(--qeos-field-border); border-radius: 9px; box-shadow: 0 1px 2px rgba(15, 23, 42, .025); box-sizing: border-box; color: #17233a; font-size: 13.5px; line-height: 1.4; min-height: 48px; padding: 10px 12px; transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; width: 100%; }
.qeos-form textarea { min-height: 104px; resize: vertical; }
.qeos-form input::placeholder, .qeos-form textarea::placeholder { color: #93a0b3; opacity: 1; }
.qeos-form input:hover, .qeos-form select:hover, .qeos-form textarea:hover { border-color: #afbdd0; }
.qeos-form input[type="file"] { background: #f7faff; padding: 9px; }
.qeos-form small { color: var(--qeos-muted); font-size: 10.5px; line-height: 1.45; }
.qeos-form input:focus, .qeos-form select:focus, .qeos-form textarea:focus { background: #fff; border-color: var(--qeos-blue); box-shadow: 0 0 0 3px rgba(23, 104, 229, .12); outline: 0; }
.qeos-form .button { align-items: center; border-radius: 8px; display: inline-flex; font-weight: 700; gap: 7px; justify-content: center; justify-self: start; margin-top: 3px; min-height: 43px; padding: 6px 16px; }
.qeos-form .button-primary { background: linear-gradient(180deg, #1b70ef, #0f63e4); border-color: #0f63e4; box-shadow: 0 5px 12px rgba(23, 104, 229, .19); color: #fff; }
.qeos-form .button-primary:hover, .qeos-form .button-primary:focus { background: #0c59ce; border-color: #0c59ce; color: #fff; }
.qeos-form .button .dashicons { font-size: 17px; height: 17px; width: 17px; }
.qeos-app-content .qeos-form .button { border-radius: 8px; min-height: 43px; padding: 6px 16px; }
.qeos-app-content .qeos-form .button-primary { background: linear-gradient(180deg, #1b70ef, #0f63e4); border-color: #0f63e4; box-shadow: 0 5px 12px rgba(23, 104, 229, .19); color: #fff; }
.qeos-app-content .qeos-form .button-primary:hover, .qeos-app-content .qeos-form .button-primary:focus { background: #0c59ce; border-color: #0c59ce; color: #fff; }
.qeos-panel-title { align-items: center; display: flex; justify-content: space-between; margin-bottom: 12px; }
.qeos-panel-title h2 { margin: 0; }
.qeos-panel-title > span { background: #eef4ff; border-radius: 999px; color: var(--qeos-blue); font-size: 12px; font-weight: 700; min-width: 24px; padding: 5px 9px; text-align: center; }
.qeos-table-wrap { overflow-x: auto; }
.qeos-table { border-collapse: collapse; min-width: 650px; width: 100%; }
.qeos-table th { color: #64748b; font-size: 11px; font-weight: 700; letter-spacing: .05em; padding: 11px 12px; text-align: left; text-transform: uppercase; }
.qeos-table td { border-top: 1px solid var(--qeos-border); padding: 14px 12px; vertical-align: middle; }
.qeos-table td strong, .qeos-table td span { display: block; }
.qeos-table td > span:not(.qeos-status) { color: var(--qeos-muted); font-size: 12px; margin-top: 3px; }
.qeos-table a { text-decoration: none; }
.qeos-status { border-radius: 999px; display: inline-block !important; font-size: 11px; font-weight: 700; padding: 5px 9px; white-space: nowrap; }
.qeos-status--vacant { background: #fff4e5; color: #a95506; }
.qeos-status--owner_occupied, .qeos-status--tenant_occupied, .qeos-status--approved { background: #e9f9ee; color: #147a3e; }
.qeos-status--under_renovation { background: #eef2f7; color: #526175; }
.qeos-status--pending { background: #fff4e5; color: #a95506; }
.qeos-status--verified { background: #e9f9ee; color: #147a3e; }
.qeos-status--rejected { background: #ffebee; color: #b4232f; }
.qeos-list-panel .qeos-empty { margin: 28px 0 8px; }
.qeos-form-panel > .button { margin-top: 14px; }
.qeos-finance-cards { grid-template-columns: repeat(2, minmax(200px, 280px)); margin-bottom: 16px; }
.qeos-finance-layout { grid-template-columns: minmax(360px, 440px) minmax(0, 1fr); }
.qeos-receipts-table { min-width: 980px; }
.qeos-review-form { display: grid; gap: 7px; min-width: 210px; }
.qeos-review-form input[type="text"] { border-color: #cbd5e1; border-radius: 6px; min-height: 32px; width: 100%; }
.qeos-review-form > div { display: flex; gap: 6px; }
.qeos-button-danger { border-color: #dc3545 !important; color: #b4232f !important; }
.qeos-security-cards { grid-template-columns: repeat(2, minmax(200px, 280px)); margin-bottom: 16px; }
.qeos-gate-desk { align-items: end; background: linear-gradient(135deg, #071d45, #0b3776); color: #fff; display: grid; gap: 26px; grid-template-columns: minmax(0, 1fr) auto; min-height: 0; }
.qeos-gate-desk h2 { color: #fff; font-size: 22px; margin-bottom: 6px; }
.qeos-gate-desk p:not(.qeos-eyebrow) { color: #cfddf2; margin: 0; }
.qeos-gate-desk .qeos-eyebrow { color: #7eb4ff !important; }
.qeos-gate-form { align-items: end; display: flex; gap: 10px; }
.qeos-gate-form input { border: 0; border-radius: 8px; font-size: 19px; font-weight: 700; letter-spacing: .16em; min-height: 46px; padding: 8px 13px; text-transform: uppercase; width: 220px; }
.qeos-gate-form .button { min-height: 46px; }
.qeos-security-grid { grid-template-columns: 1fr 1fr; }
.qeos-status--expected { background: #e9f2ff; color: #165fce; }
.qeos-status--checked_out { background: #eef2f7; color: #526175; }
.qeos-status--expired { background: #ffebee; color: #b4232f; }
.qeos-visitor-list { margin: 0; }
.qeos-visitor-list li { align-items: center; border-bottom: 1px solid var(--qeos-border); display: flex; justify-content: space-between; margin: 0; padding: 13px 0; }
.qeos-visitor-list li:last-child { border-bottom: 0; }
.qeos-visitor-list li > div:first-child strong, .qeos-visitor-list li > div:first-child span { display: block; }
.qeos-visitor-list li > div:first-child span { color: var(--qeos-muted); font-size: 12px; margin-top: 3px; }
.qeos-visitor-list li > div:last-child { text-align: right; }
.qeos-visitor-list small { color: var(--qeos-muted); display: block; letter-spacing: .08em; margin-top: 7px; }
.qeos-visitor-create { margin-top: 16px; min-height: 0; }
.qeos-visitor-history { margin-top: 16px; min-height: 0; }
.qeos-visitor-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.qeos-visitor-form label:first-of-type { grid-column: span 2; }
.qeos-visitor-form .button { align-self: end; min-height: 42px; }
.qeos-pass-notice code { background: #eef6ff; border: 1px solid #9bc1f3; border-radius: 8px; color: #071d45; display: inline-block; font-size: 23px; font-weight: 800; letter-spacing: .18em; padding: 10px 14px; }
.qeos-module-grid { align-items: start; display: grid; gap: 22px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 22px; }
.qeos-module-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.qeos-module-grid--lists .qeos-panel { min-height: 0; }
.qeos-wide-panel { min-height: 0; margin-top: 16px; }
.qeos-ops-cards { margin-bottom: 16px; }
.qeos-row { border-top: 1px solid var(--qeos-border); display: grid; gap: 3px; padding: 13px 0; }
.qeos-row:first-child { border-top: 0; }
.qeos-row span, .qeos-row small { color: var(--qeos-muted); }
.qeos-row .button { justify-self: start; margin-top: 5px; }
.qeos-inline-form { align-items: center; display: flex; gap: 6px; min-width: 220px; }
.qeos-inline-form select { min-height: 32px; }
.qeos-bars { display: grid; gap: 16px; margin-top: 20px; }
.qeos-bars > div { display: grid; gap: 7px; grid-template-columns: 1fr auto; }
.qeos-bars i { background: #e9f2ff; border-radius: 999px; display: block; grid-column: 1 / -1; height: 9px; overflow: hidden; position: relative; }
.qeos-bars i:after { background: linear-gradient(90deg, #1768e5, #67a3f5); border-radius: inherit; content: ''; inset: 0 auto 0 0; position: absolute; width: var(--qeos-bar); }
.qeos-export-list { display: grid; gap: 9px; margin-top: 18px; }
.qeos-export-list .button { align-items: center; display: flex; gap: 8px; justify-content: flex-start; min-height: 38px; }
.qeos-offline-shell { display: grid; gap: 16px; }
.qeos-offline-status { align-items: center; display: flex; justify-content: space-between; min-height: 0; }
.qeos-offline-status > div { display: grid; gap: 4px; grid-template-columns: auto 1fr; }
.qeos-offline-status small { color: var(--qeos-muted); grid-column: 2; }
#qeos-connection-dot { border-radius: 999px; height: 10px; margin-top: 5px; width: 10px; }
#qeos-connection-dot.is-online { background: #169447; }
#qeos-connection-dot.is-offline { background: #e77b11; }
.qeos-offline-result { align-items: center; border: 1px dashed #b9c9e3; border-radius: 10px; display: flex; flex-direction: column; gap: 7px; padding: 28px; text-align: center; }
.qeos-offline-result .dashicons { font-size: 32px; height: 32px; width: 32px; }
.qeos-offline-result--success { background: #e9f9ee; border-color: #8bd3a5; color: #147a3e; }
.qeos-offline-result--error { background: #fff4e5; border-color: #efbd7c; color: #9a4b03; }
.qeos-status--open, .qeos-status--assigned, .qeos-status--expected { background: #e9f2ff; color: #165fce; }
.qeos-status--high, .qeos-status--critical, .qeos-status--out_of_service { background: #ffebee; color: #b4232f; }
.qeos-status--normal, .qeos-status--pending, .qeos-status--under_review, .qeos-status--awaiting_parts { background: #fff4e5; color: #a95506; }
.qeos-status--resolved, .qeos-status--closed, .qeos-status--completed, .qeos-status--operational, .qeos-status--available, .qeos-status--active { background: #e9f9ee; color: #147a3e; }
.qeos-saas-cards { margin-bottom: 16px; }
.qeos-saas-layout { grid-template-columns: minmax(320px, 400px) minmax(0, 1fr); }
.qeos-form hr { border: 0; border-top: 1px solid var(--qeos-border); margin: 4px 0; }
.qeos-form h3 { color: #24334c; font-size: 14px; margin: 0; }
.qeos-estate-cards { display: grid; gap: 14px; }
.qeos-estate-card { border: 1px solid var(--qeos-border); border-radius: 12px; padding: 17px; }
.qeos-estate-card.is-current { border-color: #8bb8f2; box-shadow: inset 3px 0 #1768e5; }
.qeos-estate-card__head, .qeos-estate-card__head > div, .qeos-estate-actions { align-items: center; display: flex; gap: 10px; justify-content: space-between; }
.qeos-estate-card__head > div { justify-content: flex-start; }
.qeos-estate-card__head strong, .qeos-estate-card__head small { display: block; }
.qeos-estate-card__head small { color: var(--qeos-muted); margin-top: 3px; }
.qeos-estate-mark { align-items: center; background: color-mix(in srgb, var(--estate-colour) 13%, white); border-radius: 10px; color: var(--estate-colour); display: inline-flex; font-size: 18px; font-weight: 800; height: 42px; justify-content: center; width: 42px; }
.qeos-estate-stats { display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 16px 0 10px; }
.qeos-estate-stats span { background: #f7f9fc; border-radius: 8px; color: var(--qeos-muted); padding: 9px; text-align: center; }
.qeos-estate-stats b { color: var(--qeos-text); display: block; font-size: 17px; }
.qeos-estate-meta { color: var(--qeos-muted); display: flex; flex-wrap: wrap; font-size: 12px; gap: 12px; }
.qeos-onboarding-link { display: grid; gap: 5px; margin: 14px 0; }
.qeos-onboarding-link span { color: #26354f; font-size: 12px; font-weight: 700; }
.qeos-onboarding-link input { background: #f7f9fc; border-color: #d9e1ec; font-size: 12px; width: 100%; }
.qeos-estate-actions { align-items: flex-start; justify-content: flex-start; }
.qeos-estate-actions details { position: relative; }
.qeos-estate-actions summary { cursor: pointer; list-style: none; }
.qeos-compact-form { background: #fff; border: 1px solid var(--qeos-border); border-radius: 10px; box-shadow: 0 12px 30px rgba(15,23,42,.13); display: grid; gap: 10px; min-width: 270px; padding: 15px; position: absolute; right: 0; top: 36px; z-index: 20; }
.qeos-compact-form label { display: grid; gap: 4px; }
.qeos-compact-form label span { font-size: 12px; font-weight: 700; }
.qeos-compact-form input, .qeos-compact-form select { background: var(--qeos-field-bg); border: 1px solid var(--qeos-field-border); border-radius: 8px; min-height: 42px; padding: 8px 10px; width: 100%; }
.qeos-compact-form input:focus, .qeos-compact-form select:focus, .qeos-review-form input:focus, .qeos-inline-form select:focus { border-color: var(--qeos-blue); box-shadow: 0 0 0 3px rgba(23, 104, 229, .12); outline: 0; }
.qeos-context-notice a { margin-left: 8px; }
.qeos-status--onboarding, .qeos-status--trial { background: #fff4e5; color: #a95506; }
.qeos-status--suspended { background: #ffebee; color: #b4232f; }
.qeos-status--inactive { background: #eef2f7; color: #526175; }
.qeos-team-row { gap: 10px; }
.qeos-team-summary { align-items: flex-start; display: flex; gap: 14px; justify-content: space-between; }
.qeos-team-summary > div { display: grid; gap: 3px; }
.qeos-team-summary em { font-style: normal; }
.qeos-team-actions { align-items: flex-start; display: flex; flex-wrap: wrap; gap: 7px; }
.qeos-team-actions details { position: relative; }
.qeos-team-actions summary { cursor: pointer; list-style: none; }
.qeos-team-actions form { margin: 0; }
.qeos-team-actions .qeos-compact-form { left: 0; right: auto; }
.qeos-team-edit { min-width: 310px; }
.qeos-danger-button { border-color: #dc3545 !important; color: #b4232f !important; }
.qeos-current-account { background: #f5f8fc; border-radius: 7px; padding: 8px 10px; }
.qeos-resident-table { min-width: 1100px; }
.qeos-resident-actions { align-items: flex-start; display: flex; flex-wrap: wrap; gap: 7px; }
.qeos-resident-actions details { position: relative; }
.qeos-resident-actions summary { cursor: pointer; list-style: none; white-space: nowrap; }
.qeos-resident-actions .qeos-compact-form { left: auto; right: 0; }
.qeos-resident-edit { min-width: 320px; }
.qeos-resident-password { min-width: 300px; }
.qeos-resident-actions small { color: var(--qeos-muted); line-height: 1.45; }
.qeos-pass-recovery-form { margin-top: 8px; }
.qeos-pass-recovery-form .button { white-space: nowrap; }

/* Keep the frontend workspace shell aligned with the same visual system. */
.qeos-estate-app { grid-template-columns: 252px minmax(0, 1fr); }
.qeos-estate-app .qeos-app-sidebar { background: linear-gradient(180deg, #061b40 0%, #072552 100%); padding: 24px 14px 18px; }
.qeos-estate-app .qeos-app-sidebar nav { gap: 4px; }
.qeos-estate-app .qeos-app-sidebar nav a { border-radius: 8px; min-height: 39px; padding: 9px 12px; }
.qeos-estate-app .qeos-app-sidebar nav a.is-active { box-shadow: 0 7px 16px rgba(0, 82, 210, .24); }
.qeos-estate-app .qeos-app-content { background: #f6f8fc; }

/* Reference layout: use paired fields where the form benefits from comparison. */
.qeos-form--personnel, .qeos-form--vehicle { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.qeos-form--personnel .qeos-field--person_type,
.qeos-form--personnel .qeos-field--job_role,
.qeos-form--personnel .qeos-field--phone,
.qeos-form--personnel .qeos-field--email,
.qeos-form--personnel .qeos-field--access_expires,
.qeos-form--vehicle .qeos-field--personnel_id,
.qeos-form--vehicle .qeos-field--plate_number,
.qeos-form--vehicle .qeos-field--make_model,
.qeos-form--personnel .button,
.qeos-form--vehicle .button { grid-column: 1 / -1; }

@media (max-width: 1100px) {
	.qeos-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.qeos-grid { grid-template-columns: 1fr; }
	.qeos-layout { grid-template-columns: 1fr; }
	.qeos-finance-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.qeos-security-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.qeos-gate-desk { align-items: start; grid-template-columns: 1fr; }
	.qeos-security-grid { grid-template-columns: 1fr; }
	.qeos-visitor-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.qeos-module-grid, .qeos-module-grid--three { grid-template-columns: 1fr; }
	.qeos-saas-layout { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
	.qeos-wrap { padding-right: 10px; }
	.qeos-header { gap: 12px; }
	.qeos-badge { display: none; }
	.qeos-cards { grid-template-columns: 1fr; }
	.qeos-finance-cards { grid-template-columns: 1fr; }
	.qeos-security-cards { grid-template-columns: 1fr; }
	.qeos-gate-form { align-items: stretch; flex-direction: column; }
	.qeos-gate-form input { width: 100%; }
	.qeos-visitor-form { grid-template-columns: 1fr; }
	.qeos-visitor-form label:first-of-type { grid-column: auto; }
	.qeos-offline-status { align-items: stretch; flex-direction: column; gap: 14px; }
	.qeos-estate-stats { grid-template-columns: 1fr; }
	.qeos-estate-actions { align-items: stretch; flex-direction: column; }
	.qeos-compact-form { position: static; }
	.qeos-team-actions { align-items: stretch; flex-direction: column; }
	.qeos-team-actions .button { width: 100%; }
	.qeos-resident-actions { align-items: stretch; flex-direction: column; }
	.qeos-resident-actions .button { width: 100%; }
	.qeos-form--personnel, .qeos-form--vehicle { grid-template-columns: 1fr; }
	.qeos-form--personnel .qeos-field, .qeos-form--vehicle .qeos-field, .qeos-form--personnel .button, .qeos-form--vehicle .button { grid-column: auto; }
	.qeos-panel { padding: 19px; }
	.qeos-form-heading { margin-bottom: 17px; }
}
