.emp-portal-card { max-width: 860px; margin: 24px auto; padding: 28px; border-radius: 18px; background: #fff; box-shadow: 0 14px 42px rgb(15 23 42 / 12%); direction: rtl; }
.emp-registration-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.emp-registration-form > p { margin: 0; }
.emp-registration-form label { display: block; color: #1e293b; font-weight: 700; }
.emp-registration-form input, .emp-registration-form select, .emp-registration-form textarea { box-sizing: border-box; display: block; width: 100%; margin-top: 7px; padding: 10px 12px; border: 1px solid #cbd5e1; border-radius: 8px; }
.emp-registration-form button, .emp-otp-login button { padding: 10px 20px; border: 0; border-radius: 8px; background: #0f766e; color: #fff; cursor: pointer; }
.emp-elite-benefits { grid-column: 1 / -1; padding: 16px; border: 1px solid #99f6e4; border-radius: 10px; background: #f0fdfa; }
.emp-check { display: block !important; margin: 8px 0; font-weight: 400 !important; }
.emp-check input { display: inline-block !important; width: auto !important; margin-left: 6px !important; }
.emp-user-panel { overflow-x: auto; direction: rtl; }
.emp-profile-card { max-width: 860px; margin: 22px auto; padding: 20px 24px; border-radius: 14px; color: #134e4a; background: linear-gradient(135deg, #f0fdfa, #ecfeff); border: 1px solid #99f6e4; }.emp-profile-card h3 { margin: 0 0 10px; }.emp-profile-card div { display: flex; flex-wrap: wrap; gap: 10px 20px; }.emp-profile-card span { color: #475569; }
.emp-user-panel table { width: 100%; border-collapse: separate; border-spacing: 0 10px; }
.emp-user-panel th { color: #64748b; font-size: .85rem; }
.emp-user-panel td { padding: 14px; background: #fff; vertical-align: middle; }
.emp-user-panel tr td:first-child { border-radius: 0 10px 10px 0; }.emp-user-panel tr td:last-child { border-radius: 10px 0 0 10px; }
.emp-status { display: inline-block; padding: 5px 10px; border-radius: 999px; font-size: .82rem; font-weight: 700; }.emp-status-confirmed,.emp-status-attended { color: #166534; background: #dcfce7; }.emp-status-pending,.emp-status-waiting { color: #92400e; background: #fef3c7; }.emp-status-cancelled { color: #b91c1c; background: #fee2e2; }
.emp-entry-card { min-width: 280px; padding: 16px; border: 1px solid #99f6e4; border-radius: 14px; background: #f0fdfa; text-align: center; }.emp-entry-card h4 { margin: 0 0 8px; color: #134e4a; }.emp-entry-card p { font-size: .84rem; line-height: 1.8; color: #334155; }.emp-entry-card code { display: block; overflow-wrap: anywhere; font-size: .68rem; }.emp-entry-card button { margin-top: 12px; padding: 9px 14px; border: 0; border-radius: 7px; background: #0f766e; color: #fff; cursor: pointer; }.emp-no-qr { color: #92400e; font-size: .84rem; }
.emp-security-login { max-width: 440px; margin: 28px auto; padding: 26px; border: 1px solid #e2e8f0; border-radius: 18px; background: #fff; box-shadow: 0 12px 35px rgb(15 23 42 / 8%); }.emp-security-login h2 { margin-top: 0; }.emp-security-login p { margin: 14px 0; }.emp-security-login input { width: 100%; box-sizing: border-box; padding: 10px; border: 1px solid #cbd5e1; border-radius: 9px; }.emp-security-scanner { max-width: 700px; margin: 28px auto; }.emp-security-scanner video { display: block; width: 100%; min-height: 250px; max-height: 450px; object-fit: cover; border-radius: 14px; background: #0f172a; }
.emp-otp-login { direction: rtl; max-width: 520px; margin: 48px auto; padding: 16px; }.emp-otp-card { padding: 38px; border: 1px solid #e2e8f0; border-radius: 24px; background: linear-gradient(145deg, #fff, #f8fafc); box-shadow: 0 20px 50px rgb(15 23 42 / 12%); }.emp-otp-heading { margin-bottom: 30px; text-align: center; }.emp-otp-icon { display: inline-grid; width: 48px; height: 48px; place-items: center; border-radius: 15px; color: #fff; background: linear-gradient(135deg, #0f766e, #14b8a6); font-size: 30px; }.emp-otp-heading h2 { margin: 16px 0 11px; color: #0f172a; font-size: 1.55rem; }.emp-otp-heading p { margin: 0; color: #64748b; line-height: 2; }.emp-otp-login label { display: block; margin: 0 0 9px; color: #334155; font-weight: 700; }.emp-otp-login input { box-sizing: border-box; display: block; width: 100%; padding: 13px 14px; border: 1px solid #cbd5e1; border-radius: 11px; background: #fff; font-size: 1rem; transition: border-color .2s, box-shadow .2s; }.emp-otp-login input:focus { outline: 0; border-color: #14b8a6; box-shadow: 0 0 0 4px rgb(20 184 166 / 12%); }.emp-otp-request-form { margin-top: 14px; }.emp-otp-verify-form { margin-top: 30px; padding-top: 28px; border-top: 1px solid #e2e8f0; }.emp-otp-verify-form input { direction: ltr; margin-bottom: 16px; text-align: center; letter-spacing: .45em; font-size: 1.3rem; }.emp-otp-primary, .emp-otp-secondary { width: 100%; margin-top: 18px; padding: 13px 18px; border: 0; border-radius: 11px; cursor: pointer; font-weight: 700; font-size: .96rem; }.emp-otp-primary { color: #fff; background: #0f766e; box-shadow: 0 9px 18px rgb(15 118 110 / 20%); }.emp-otp-primary:hover { background: #0d665f; }.emp-otp-secondary { color: #0f766e; background: #ecfdf5; border: 1px solid #99f6e4; }.emp-otp-secondary:disabled { color: #94a3b8; border-color: #e2e8f0; background: #f8fafc; cursor: not-allowed; }.emp-otp-resend { margin-top: 16px; }.emp-otp-resend button { margin-top: 0; }.emp-otp-timer { display: block; min-height: 22px; margin-top: 10px; color: #64748b; font-size: .85rem; text-align: center; }.emp-otp-change { margin: 20px 0 0; text-align: center; }.emp-otp-change a { color: #0f766e; text-decoration: none; font-size: .9rem; }.emp-otp-login .emp-notice { margin: 0 0 24px; padding: 12px 14px; border-radius: 11px; text-align: center; }
@media print { body.emp-print-registration-only * { visibility: hidden !important; } body.emp-print-registration-only .emp-user-panel, body.emp-print-registration-only .emp-user-panel * { visibility: visible !important; } body.emp-print-registration-only .emp-user-panel { position: fixed; inset: 16px; display: block; width: auto; overflow: visible; background: #fff; } body.emp-print-registration-only .emp-user-panel table { width: 100%; border-collapse: collapse; } body.emp-print-registration-only .emp-user-panel th, body.emp-print-registration-only .emp-user-panel td { padding: 10px; border: 1px solid #cbd5e1; background: #fff; } body.emp-print-registration-only .emp-print-card { display: none; } }
@media (max-width: 680px) { .emp-registration-form { grid-template-columns: 1fr; }.emp-portal-card { padding: 18px; }.emp-user-panel { overflow: visible; }.emp-user-panel table, .emp-user-panel tbody, .emp-user-panel tr, .emp-user-panel td { display: block; width: 100%; box-sizing: border-box; }.emp-user-panel thead { display: none; }.emp-user-panel tr { margin: 14px 0; overflow: hidden; border: 1px solid #e2e8f0; border-radius: 14px; background: #fff; box-shadow: 0 7px 18px rgb(15 23 42 / 6%); }.emp-user-panel td { display: grid; grid-template-columns: 105px minmax(0, 1fr); gap: 10px; padding: 13px 14px; border-bottom: 1px solid #f1f5f9; text-align: right; }.emp-user-panel td:last-child { border-bottom: 0; }.emp-user-panel td::before { content: attr(data-label); color: #64748b; font-size: .82rem; font-weight: 700; }.emp-user-panel td .emp-entry-card { min-width: 0; }.emp-user-panel td .emp-no-qr { align-self: center; }.emp-user-panel td form { margin: 0; } }